/* Luxury Lineups hub: additions on top of royal.css. */
.hero--hub { min-height: min(82svh, 54rem); }
.hero--hub .hero__media img { object-position: center 40%; }
.hero--hub .hero__sub { max-width: 46ch; }
.site-nav__home { color: var(--gold) !important; }
.stay__title { color: inherit; text-decoration: none; }
.stay__title:hover, .stay__title:focus-visible { color: var(--gold-2); }
.stay h3 { margin-top: .2rem; }
.principles { display: grid; gap: clamp(1rem, 2vw, 1.5rem); grid-template-columns: 1fr; margin-top: 2.5rem; }
@media (min-width: 800px) { .principles { grid-template-columns: repeat(3, 1fr); } }
.principle { padding: 2.25rem clamp(1.4rem, 2.5vw, 2rem) 2rem; }
.principle__mark { width: 56px; height: 56px; margin-bottom: 1.25rem; }
.principle__mark span { font-size: .95rem; }
.principle h3 { font-size: var(--step-1); }
.principle p { color: var(--ivory-muted); font-size: .95rem; margin: .6rem 0 0; }
.upcoming { list-style: none; margin: 2.5rem 0 0; padding: 0; border-top: 1px solid color-mix(in srgb, var(--gold) 30%, transparent); }
.upcoming li { display: grid; gap: .25rem 2rem; grid-template-columns: 1fr; padding: 1.1rem 0; border-bottom: 1px solid color-mix(in srgb, var(--gold) 18%, transparent); color: var(--ivory-muted); font-size: .95rem; }
.upcoming b { font-family: var(--font-display); font-weight: 500; font-size: var(--step-1); color: var(--ivory); }
.upcoming__tag { font-family: var(--font-label); font-size: .68rem; letter-spacing: .2em; text-transform: uppercase; color: var(--gold); align-self: center; }
@media (min-width: 800px) { .upcoming li { grid-template-columns: 8rem 1.2fr 1.6fr; align-items: baseline; } }