/* A quieter editorial rhythm keeps the rooms and the product in focus. */
html{scroll-behavior:auto}
.hero h1{font-size:clamp(3.4rem,7.1vw,7rem);line-height:1.01;letter-spacing:-.045em}
.hero h1 .line-mask:last-child{color:#e3c695}
.hero-copy>p{max-width:490px;text-wrap:pretty}
.hero .proof{letter-spacing:0;font-size:.75rem;color:#ded9cf}
.hero-copy>.eyebrow,.hero-copy .line-mask,.hero-copy>p,.hero-copy>.actions,.hero-copy>.proof{will-change:auto}
.film-navigation{position:absolute;z-index:9;bottom:26px;left:max(24px,calc((100vw - 1240px)/2));right:max(24px,calc((100vw - 1240px)/2));display:flex;align-items:center;justify-content:space-between;gap:20px;padding:14px 18px 18px;background:rgba(8,10,12,.86);border:1px solid rgba(243,240,233,.23);border-radius:8px;font-size:.75rem}
.film-position{display:flex;gap:18px;color:#d5d0c7}
#film-percent{font-variant-numeric:tabular-nums;color:#e3c695}
.film-navigation a{display:flex;align-items:center;gap:22px;min-height:44px;margin:-10px 0;padding:8px 0}
.film-navigation a:hover{color:#e3c695}
.film-navigation a:focus-visible{outline:2px solid var(--gold);outline-offset:4px}
.film-track{position:absolute;inset:auto 18px 0;height:2px;background:rgba(243,240,233,.16);overflow:hidden}
.film-track span{position:absolute;inset:0;display:block;height:100%;background:#e3c695;transform:scaleX(0);transform-origin:left}
/* Loaded extent sits under the scroll position: when the bright line overtakes
   the dim one the visitor is ahead of the film, and the wait explains itself. */
.film-track .loaded{background:rgba(227,198,149,.32)}
#film-percent{display:inline-flex;align-items:center}
#film-percent:before{content:"";width:5px;height:5px;margin-right:8px;border-radius:50%;background:#e3c695;box-shadow:0 0 10px #e3c695;opacity:0;transition:opacity .3s}
.film-navigation.is-loading #film-percent:before{opacity:1;animation:film-wait 1.2s ease-in-out infinite}
/* The bar carries the loading cue; the status line stays for assistive tech. */
.hero .film-status{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.hero.film-static .film-navigation,.hero.film-failed .film-navigation{display:none}
.hero .cue{display:none}
.hero-intro{padding-bottom:90px}
/* A room collection should be browsable without five more pinned screens. */
.gallery{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:20px;margin-top:48px}
.gallery .shot{grid-column:span 3;position:relative;top:auto;height:420px;min-height:0;margin:0;border-radius:10px;box-shadow:none}
.gallery .shot:nth-child(n+3){grid-column:span 2;height:350px}
.gallery .shot video{will-change:auto;transform:none}
.gallery .caption{padding:100px 26px 32px;font-size:.8rem;transform:none}
.gallery .caption strong{font-size:2.4rem}
.gallery .caption:after{left:26px;right:26px}
.gallery .motion-cue{left:20px;top:20px}
.gallery .shot:before{display:none}
.gallery .shot:after{right:20px;top:20px}
/* Paper sections give the long page clear pauses and a consistent reading pace. */
.journey,.buyer-faq{background:#eee9df;color:#242820;--line:rgba(36,40,32,.18);--mist:#565b51;--gold:#77603d}
.journey .eyebrow,.buyer-faq .eyebrow{color:#77603d}
.journey-grid{background:transparent;border:0;border-radius:0}
.journey-step{background:transparent;border-radius:0;box-shadow:none;border-top:1px solid var(--line)}
.journey-step p,.journey-note p,.faq-grid details p{color:#565b51}
.journey .button,.buyer-faq .button{color:#242820;border-color:#888b80}
.journey-note{border-radius:6px;background:#e3ddcf}
.faq-grid details{border-radius:0;background:transparent;border-color:var(--line)}
.faq-grid summary{font-weight:500;font-size:1.05rem}
.living-home,.home-visual{border-radius:12px;box-shadow:none}
.home-orbit{animation:none}
.intro h2,.heading,.plain-answer>p{text-wrap:balance}
.reveal:not(.hero-copy){opacity:1;transform:none;animation:none}
@media(min-width:901px){
  .hero-copy{max-width:800px}
  .journey-grid{gap:32px}
  /* Two-line and one-line headings share a baseline for the copy beneath. */
  .journey-step h3{line-height:1.15;min-height:2.3em}
}
/* Trust cards hold their copy, not a fixed height of empty panel. */
.e-card,.e-card:nth-child(-n+2){min-height:0}
.e-card h3{margin-top:22px}
@media(max-width:900px){
  .hero-intro{padding-bottom:115px}
  .hero h1{font-size:clamp(3.15rem,8.5vw,5.3rem)}
  .gallery .shot,.gallery .shot:nth-child(n+3){grid-column:span 3;height:380px}
  .gallery .shot:last-child{grid-column:1/-1;height:360px}
}
@media(max-width:560px){
  .hero h1{font-size:clamp(2.65rem,11.8vw,4rem);line-height:1.03}
  .hero-intro{padding-top:84px;padding-bottom:106px}
  .hero .proof{font-size:.64rem;gap:8px 14px;margin-top:20px}
  .hero p{font-size:.93rem;line-height:1.6}
  .film-navigation{left:18px;right:18px;bottom:max(18px,env(safe-area-inset-bottom));padding:14px 12px 18px;font-size:.68rem}
  .film-position{gap:10px}
  .film-navigation a{gap:12px}
  .gallery{grid-template-columns:1fr;gap:18px}
  .gallery .shot,.gallery .shot:nth-child(n+3),.gallery .shot:last-child{grid-column:auto;height:380px}
  .gallery .caption strong{font-size:2.6rem}
}
@media(prefers-reduced-motion:reduce){
  .film-navigation{display:none}
  #film-percent:before{animation:none}
}
/* The generic grain pseudo-element used to replace the film's contrast scrim. */
.hero .stage.grain:after{z-index:2;opacity:1;background:linear-gradient(90deg,rgba(5,7,9,.8),rgba(5,7,9,.35) 46%,transparent 80%),linear-gradient(0deg,rgba(5,7,9,.72),transparent 42%)}
.hero .scroll-note{display:none}
@media(min-width:901px) and (max-height:740px){
  .hero h1{font-size:clamp(3.4rem,6vw,5rem);margin:14px 0 18px}
  .hero .actions{margin-top:20px}
  .hero .proof{margin-top:24px}
  .hero-intro{padding-top:76px;padding-bottom:110px}
}
@media(max-height:600px){
  .hero .stage{min-height:600px}
}