#home-page { overflow: clip; } #home-page .home-hero { position: relative; overflow: clip; padding-top: clamp(4rem, 8vw, 7rem); background: var(--color-ink-950); } #home-page .home-hero__wrap { position: relative; min-height: 47rem; } #home-page .home-hero__image { position: absolute; z-index: 1; top: 0; right: 0; width: min(82%, 73.75rem); height: clamp(33rem, 52vw, 46rem); } #home-page .home-hero__image::after, #home-page .home-table__media::after, #home-page .home-room__media::after, #home-page .home-dining__media::after { position: absolute; inset: 0; content: ""; pointer-events: none; background: rgba(11, 12, 13, 0.24); } #home-page .home-hero__image img { width: 100%; height: 100%; object-fit: cover; object-position: 62% 50%; } #home-page .home-hero__panel { position: absolute; z-index: 2; bottom: 0; left: 0; width: min(52%, 42rem); min-width: 0; padding: clamp(2rem, 4vw, 4rem); border: 1px solid var(--color-border); background: rgba(17, 19, 21, 0.97); box-shadow: var(--shadow-panel); } #home-page .home-hero__content { display: flex; min-width: 0; flex-direction: column; gap: var(--space-5); } #home-page .home-hero h1 { margin: 0; font-size: clamp(3.5rem, 5.3vw, 4rem); line-height: 0.92; } #home-page .home-hero__lead { max-width: 39rem; margin: 0; font-size: var(--text-lead); line-height: 1.6; } #home-page .home-hero__actions { display: flex; min-width: 0; flex-wrap: wrap; gap: var(--space-3); } #home-page .home-hero__actions > * { min-width: 0; } #home-page .home-hero__eligibility { margin: 0; color: var(--color-text-subtle); font-size: var(--text-meta); } #home-page .home-hero__ticker { position: absolute; z-index: 0; width: 100%; overflow: hidden; color: var(--color-gold-500); opacity: 0.27; white-space: nowrap; mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); } #home-page .home-hero__ticker--upper { top: 21%; } #home-page .home-hero__ticker--lower { top: 67%; } #home-page .home-hero__ticker-track { display: inline-block; font-size: var(--text-utility); font-weight: 600; letter-spacing: 0.14em; animation: home-ticker-left 92s linear infinite; } #home-page .home-hero__ticker--lower .home-hero__ticker-track { animation-name: home-ticker-right; animation-duration: 78s; } @keyframes home-ticker-left { from { transform: translateX(0); } to { transform: translateX(-35%); } } @keyframes home-ticker-right { from { transform: translateX(-30%); } to { transform: translateX(0); } } #home-page .home-principles { border-block: 1px solid var(--color-border); } #home-page .home-principles__intro { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 4fr); column-gap: 16.666%; align-items: end; margin-bottom: var(--space-8); } #home-page .home-principles__intro > * { min-width: 0; } #home-page .home-principles__intro h2 { max-width: 38rem; } #home-page .home-principles__intro p { max-width: 29rem; margin: 0; } #home-page .home-principles__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-6); } #home-page .home-principle { min-width: 0; padding-right: var(--space-5); } #home-page .home-principle + .home-principle { padding-left: var(--space-6); border-left: 1px solid var(--color-border); } #home-page .home-principle__number, #home-page .home-pathway__label { display: block; margin-bottom: var(--space-5); color: var(--color-accent); font-size: var(--text-utility); font-weight: 600; letter-spacing: 0.14em; } #home-page .home-principle h3 { max-width: 25rem; } #home-page .home-principle p { max-width: 29rem; } #home-page .home-table__grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--space-6); align-items: center; } #home-page .home-table__copy { position: relative; z-index: 1; min-width: 0; max-width: 34rem; padding: var(--space-7); background: var(--color-ink-950); } #home-page .home-table__copy h2, #home-page .home-table__copy p { max-width: 34rem; } #home-page .home-table__media { position: relative; grid-column: 2; grid-row: 1; width: 100%; height: auto; aspect-ratio: 3 / 2; } #home-page .home-table__media img { width: 100%; height: 100%; object-fit: cover; object-position: 68% 52%; } #home-page .home-table__cue { display: flex; min-width: 0; flex-direction: column; gap: var(--space-3); margin-top: var(--space-6); padding-top: var(--space-5); border-top: 1px solid var(--color-border-gold); } #home-page .home-table__cue span { color: var(--color-accent); font-size: var(--text-utility); font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; } #home-page .home-table__cue p { margin: 0; } #home-page .home-pathways__intro { max-width: 44rem; margin: 0 auto var(--space-8); text-align: center; } #home-page .home-pathways__intro p { margin-bottom: 0; } #home-page .home-pathways__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-6); } #home-page .home-pathway { display: flex; min-width: 0; flex-direction: column; align-items: flex-start; gap: var(--space-5); min-height: 29rem; padding: var(--space-6); border-top: 1px solid var(--color-border-gold); border-right: 1px solid var(--color-border); border-bottom: 1px solid var(--color-border); border-left: 1px solid var(--color-border); transition: border-color var(--transition-standard), background-color var(--transition-standard); } #home-page .home-pathway:hover { border-color: rgba(231, 228, 221, 0.28); background: var(--color-slate-800); } #home-page .home-pathway__label, #home-page .home-pathway h3, #home-page .home-pathway p { margin: 0; } #home-page .home-pathway p { max-width: 27rem; } #home-page .home-pathway .text-link { margin-top: auto; } #home-page .home-room__grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--space-6); align-items: center; } #home-page .home-room__media { position: relative; width: 100%; height: auto; aspect-ratio: 16 / 10; } #home-page .home-room__media img { width: 100%; height: 100%; object-fit: cover; object-position: 37% 50%; } #home-page .home-room__copy { display: flex; min-width: 0; flex-direction: column; align-items: flex-start; gap: var(--space-5); } #home-page .home-room__copy > * { margin: 0; } #home-page .home-room__copy > h2, #home-page .home-room__copy > p { max-width: 38rem; } #home-page .home-room__note { display: flex; min-width: 0; flex-direction: column; gap: var(--space-3); padding-top: var(--space-5); border-top: 1px solid var(--color-border); } #home-page .home-room__note > * { margin: 0; } #home-page .home-room__note p { max-width: 34rem; } #home-page .home-plan__grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--space-8); } #home-page .home-plan__heading, #home-page .home-plan__steps { min-width: 0; } #home-page .home-plan__heading h2 { max-width: 40rem; } #home-page .home-plan__steps { display: flex; min-width: 0; flex-direction: column; } #home-page .home-plan__step { display: grid; grid-template-columns: 4rem minmax(0, 1fr); gap: var(--space-4); min-width: 0; padding: var(--space-5) 0; border-top: 1px solid var(--color-border); } #home-page .home-plan__step:last-child { border-bottom: 1px solid var(--color-border); } #home-page .home-plan__step > span { min-width: 0; color: var(--color-accent); font-size: var(--text-utility); font-weight: 600; letter-spacing: 0.14em; } #home-page .home-plan__step > div { min-width: 0; } #home-page .home-plan__step h3 { margin-bottom: var(--space-3); } #home-page .home-plan__step p { max-width: 42rem; } #home-page .home-dining__grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); column-gap: 8.333%; row-gap: var(--space-5); align-items: center; } #home-page .home-dining__copy { min-width: 0; max-width: 36rem; } #home-page .home-dining__media { position: relative; width: 100%; height: auto; aspect-ratio: 3 / 2; } #home-page .home-dining__media img { width: 100%; height: 100%; object-fit: cover; object-position: 70% 50%; } #home-page .home-dining__link { grid-column: 1; } #home-page .home-private { text-align: center; } #home-page .home-private__invitation { display: flex; min-width: 0; flex-direction: column; align-items: center; gap: var(--space-5); width: min(100%, 46rem); margin-inline: auto; } #home-page .home-private__invitation > * { margin: 0; } #home-page .home-private__invitation p { max-width: 46rem; } #home-page .home-private__note { display: flex; min-width: 0; flex-direction: column; gap: var(--space-3); width: min(100%, 34rem); margin: var(--space-8) auto 0; padding-top: var(--space-5); border-top: 1px solid var(--color-border-gold); text-align: left; } #home-page .home-private__note > * { margin: 0; } #home-page .home-notes__heading { max-width: 40rem; margin-bottom: var(--space-7); } #home-page .home-faq { width: min(100%, 69rem); margin-inline: auto; border: 1px solid var(--color-border); background: var(--color-slate-800); } #home-page .home-faq__item + .home-faq__item { border-top: 1px solid var(--color-border); } #home-page .home-faq__item h3 { margin: 0; font-family: var(--font-body); font-size: var(--text-lead); font-weight: 500; letter-spacing: 0; } #home-page .home-faq__item button { display: grid; grid-template-columns: minmax(0, 1fr) 2.75rem; align-items: center; width: 100%; min-height: 4rem; padding: var(--space-4) var(--space-5); color: var(--color-text); text-align: left; } #home-page .home-faq__item button span { justify-self: end; color: var(--color-accent); font-family: var(--font-display); font-size: 1.8rem; font-weight: 400; } #home-page .home-faq__answer { max-width: 50rem; padding: 0 var(--space-5) var(--space-5); } #home-page .home-faq__answer p { margin: 0; } #home-page .home-enquiry__grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: 8.333%; align-items: start; } #home-page .home-enquiry__intro { min-width: 0; max-width: 38rem; } #home-page .home-enquiry__age { color: var(--color-text-subtle); font-size: var(--text-meta); } #home-page .home-enquiry__panel { min-width: 0; } #home-page .home-enquiry__fields { display: flex; min-width: 0; flex-direction: column; gap: var(--space-4); } #home-page .home-enquiry__pair { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4); } #home-page .home-enquiry__pair > *, #home-page .home-enquiry__fields > * { min-width: 0; } #home-page .home-enquiry__check { display: grid; grid-template-columns: 1rem minmax(0, 1fr); column-gap: var(--space-3); align-items: start; } #home-page .home-enquiry__check input { margin-top: 0.35rem; } #home-page .home-enquiry__check label { margin: 0; } #home-page .home-enquiry__check .status { grid-column: 2; } #home-page .home-enquiry__helper, #home-page .home-enquiry__phone, #home-page .home-enquiry__required { max-width: 34rem; margin-bottom: var(--space-3); font-size: var(--text-meta); } #home-page .home-enquiry__required { margin-bottom: 0; color: var(--color-text-subtle); } #home-page .home-enquiry__success { display: flex; min-width: 0; flex-direction: column; align-items: flex-start; gap: var(--space-5); } #home-page .home-enquiry__success > * { margin: 0; } #home-page .home-enquiry__success h3, #home-page .home-enquiry__success p { max-width: 34rem; } #home-page .home-closing__rail { display: flex; min-width: 0; flex-direction: column; align-items: center; gap: var(--space-6); width: min(100% - (var(--container-padding) * 2), 42rem); margin-inline: auto; text-align: center; } #home-page .home-closing__rail > * { margin: 0; } #home-page .home-closing__rail .rule { margin: 0; } #home-page .home-closing h2 { max-width: 42rem; font-size: clamp(2.2rem, 4.2vw, 3.5rem); } @media (max-width: 68.75rem) { #home-page .home-hero__wrap { min-height: 43rem; } #home-page .home-hero__image { width: 78%; } #home-page .home-hero__panel { width: min(55%, 39rem); } } @media (max-width: 61.25rem) { #home-page .home-principles__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } #home-page .home-principle:nth-child(3) { grid-column: 1 / -1; max-width: 50%; } #home-page .home-principle:nth-child(3) { padding-left: 0; border-left: 0; } #home-page .home-table__grid { grid-template-columns: 1fr; gap: var(--space-5); } #home-page .home-table__copy { grid-column: 1; grid-row: 1; max-width: 38rem; padding: 0; } #home-page .home-table__media { grid-column: 1; grid-row: 2; } #home-page .home-pathways__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } #home-page .home-pathway:nth-child(3) { grid-column: 1 / -1; } #home-page .home-room__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } #home-page .home-plan__grid { grid-template-columns: 1fr; gap: var(--space-6); } #home-page .home-enquiry__grid { grid-template-columns: 1fr; gap: var(--space-7); } } @media (max-width: 52.5rem) { #home-page .home-room__grid, #home-page .home-dining__grid { grid-template-columns: 1fr; row-gap: var(--space-5); } #home-page .home-room__media { grid-row: 1; } #home-page .home-room__copy { grid-row: 2; } #home-page .home-dining__copy { grid-row: 1; } #home-page .home-dining__media { grid-row: 2; } #home-page .home-dining__link { grid-column: 1; grid-row: 3; } } @media (max-width: 47.5rem) { #home-page .home-hero { padding-top: var(--space-8); } #home-page .home-hero__wrap { display: flex; min-width: 0; flex-direction: column; gap: var(--space-5); min-height: 0; } #home-page .home-hero__panel { position: relative; order: 1; width: 100%; padding: var(--space-6); box-shadow: none; } #home-page .home-hero__image { position: relative; order: 2; width: 100%; height: clamp(13.75rem, 62vw, 22.5rem); } #home-page .home-hero h1 { font-size: clamp(2.9rem, 13vw, 4rem); } #home-page .home-hero__actions { flex-direction: column; } #home-page .home-hero__actions .button { width: 100%; } #home-page .home-hero__ticker--upper { top: 4%; } #home-page .home-hero__ticker--lower { top: 77%; } #home-page .home-principles__intro { grid-template-columns: 1fr; gap: var(--space-4); margin-bottom: var(--space-6); } #home-page .home-principles__grid, #home-page .home-pathways__grid { grid-template-columns: 1fr; gap: 0; } #home-page .home-principle, #home-page .home-principle:nth-child(3) { max-width: none; padding: var(--space-5) 0; border-top: 1px solid var(--color-border); } #home-page .home-principle + .home-principle { padding-left: 0; border-left: 0; } #home-page .home-principle:last-child { border-bottom: 1px solid var(--color-border); } #home-page .home-pathway:nth-child(3) { grid-column: auto; } #home-page .home-pathway { min-height: 0; padding: var(--space-6) var(--space-5); } #home-page .home-table__media { height: clamp(15rem, 60vw, 24rem); aspect-ratio: auto; } #home-page .home-room__media { height: clamp(14rem, 60vw, 26rem); aspect-ratio: auto; } #home-page .home-dining__media { height: clamp(13.75rem, 58vw, 24rem); aspect-ratio: auto; } #home-page .home-plan__step { grid-template-columns: 2.75rem minmax(0, 1fr); gap: var(--space-3); } #home-page .home-faq__item button { padding-inline: var(--space-4); } #home-page .home-faq__answer { padding-inline: var(--space-4); } #home-page .home-enquiry__panel { padding: var(--space-5); } #home-page .home-enquiry__pair { grid-template-columns: 1fr; } } @media (max-width: 26.25rem) { #home-page .home-private__invitation .button, #home-page .home-closing__rail .button { width: 100%; } } @media (prefers-reduced-motion: reduce) { #home-page .home-hero__ticker-track { animation: none; } }