/* Give the offer priority while leaving the ember and landscape open. */
header{z-index:5;pointer-events:none}
header .brand,header nav{pointer-events:auto}
.hero-nav{margin-left:auto;display:flex;align-items:center;gap:26px}
.hero-nav button,.nav-contact{font-size:.875rem;font-weight:500;letter-spacing:0;white-space:nowrap}
.hero-nav button{padding:10px 0;min-height:44px}
.nav-contact{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:10px 20px;color:#25211c;background:#f4efe4;border:1px solid #f4efe4;border-radius:2px;text-decoration:none;transition:background-color .18s,border-color .18s}
.nav-contact:hover{background:#ffcea9;border-color:#ffcea9}
.hero-copy{position:absolute;inset:0;pointer-events:none;z-index:2}
.hero-info{position:absolute;left:3.2%;bottom:clamp(96px,12svh,142px);width:min(44%,550px)}
.hero-eyebrow{margin:0 0 15px;font-size:.75rem;font-weight:500;letter-spacing:.12em;text-transform:uppercase}
.hero-info h1{max-width:19ch;margin:0;color:var(--fg);font-weight:400;font-size:clamp(1.875rem,3.2vw,3.125rem);line-height:1.13;letter-spacing:-.045em;text-transform:none;text-align:left;text-wrap:balance}
.hero-description{max-width:44ch;margin:18px 0 0;font-size:clamp(0.875rem,1.1vw,1rem);line-height:1.65;color:#eee8dd;text-wrap:pretty}
.hero-copy .statement{margin:0;bottom:clamp(96px,12svh,142px);max-width:24ch;font-size:clamp(0.875rem,1.15vw,1.125rem);line-height:1.45;letter-spacing:-.015em;color:#e6dccb}
.scrim{background:linear-gradient(180deg,#17191755,transparent 20%,transparent 48%,#111510ba)}
footer:not(.embr-footer){display:flex;justify-content:center;align-items:center;padding:18px 3.2%;pointer-events:none;z-index:3}
.scroll-cue{pointer-events:auto;padding:10px 20px 4px;min-height:54px;font-size:1rem;letter-spacing:.02em}
.descent-line{display:block;width:1px;height:18px;background:#f4efe477;margin:9px auto 0;transform-origin:top;transition:transform .25s,background-color .25s}
.scroll-cue:hover .descent-line{background:#ffd2ac;transform:scaleY(1.2)}
body[data-realm=cavern] footer:not(.embr-footer){display:none}
body.graphics-failed .hero-copy{opacity:1!important}
body.graphics-failed .statement{display:block}
.approach-motion{margin-top:30px;padding-top:12px;border-top:1px solid #d5dee31c}
.approach-motion #motion{font-size:1rem;color:#bac3cc;border-bottom:1px solid #bac3cc66}
html:has(dialog[open]){overflow:hidden}
@media(max-width:700px){
 header{padding:20px 22px;gap:12px}.brand{font-size:1.75rem}
 .hero-nav{gap:18px}.hero-nav button,.nav-contact{font-size:.875rem}
 .nav-contact{padding:10px 15px}
 .hero-info{left:22px;right:22px;top:108px;bottom:auto;width:auto}
 .hero-eyebrow{font-size:.75rem;margin-bottom:12px}
 .hero-info h1{max-width:19ch;font-size:clamp(1.75rem,7.7vw,2.125rem);line-height:1.15}
 .hero-description{max-width:40ch;margin-top:14px;font-size:1rem;line-height:1.6}
 .hero-copy .statement{top:auto;bottom:104px;left:22px;right:auto;max-width:24ch;font-size:1rem;line-height:1.45;text-align:left}
 .scrim{background:linear-gradient(180deg,#12171080,#15191388 31%,transparent 46%,transparent 63%,#111510a1)}
 footer:not(.embr-footer){padding:18px 22px max(20px,env(safe-area-inset-bottom))}
 .scroll-cue{font-size:0.6875rem}
}
@media(max-width:700px) and (max-height:720px){
 .hero-copy .statement{display:none}
 .hero-info{top:98px;bottom:98px}
 .hero-eyebrow{margin-bottom:9px}
 .hero-info h1{font-size:1.75rem}
 .hero-description{position:absolute;bottom:0;margin:0;font-size:1rem;line-height:1.55}
}
@media(min-width:701px) and (max-height:600px){
 .hero-info{bottom:76px;width:40%}
 .hero-info h1{font-size:clamp(1.625rem,3vw,2.125rem)}
 .hero-eyebrow{margin-bottom:10px}
 .hero-description{font-size:1rem;line-height:1.55;margin-top:13px}
 .hero-copy .statement{bottom:76px}
}
@media(min-width:701px) and (max-height:500px){
 header{padding-block:16px}
 .hero-copy .statement{display:none}
 .hero-info{bottom:28px;width:35%}
 .hero-eyebrow{margin-bottom:8px;font-size:0.6875rem}
 .hero-info h1{font-size:clamp(1.4375rem,2.6vw,1.75rem)}
 .hero-description{font-size:1rem;line-height:1.5;margin-top:10px}
 footer:not(.embr-footer){padding-bottom:16px}
}
@media(max-width:700px) and (max-height:500px){
 header{padding-block:16px}
 .hero-info{top:auto;bottom:20px;width:44%;right:auto}
 .hero-eyebrow{font-size:0.6875rem;margin-bottom:7px}
 .hero-info h1{font-size:1.375rem}
 .hero-description{position:static;margin-top:9px;font-size:1rem;line-height:1.5}
 footer:not(.embr-footer){justify-content:flex-end}
}
@media(prefers-reduced-motion:reduce){
 .nav-contact,.descent-line{transition:none}
 .scroll-cue:hover .descent-line{transform:none}
}

/* Immediate routes sit with the offer; the scroll invitation remains separate. */
.hero-support{pointer-events:auto}
.hero-actions{display:flex;align-items:center;flex-wrap:wrap;gap:12px 25px;margin-top:22px;text-shadow:none}
.hero-actions .action-secondary{gap:12px;font-weight:500}
.hero-nav .nav-work{color:inherit;text-decoration:none;font-size:.875rem;min-height:44px;display:inline-flex;align-items:center}
.hero-nav .nav-work:hover{color:#ffcea9}
@media(max-width:700px){
 .hero-nav{gap:14px}.hero-nav button,.hero-nav .nav-work,.nav-contact{font-size:.875rem}.nav-contact{padding-inline:12px}
 .hero-info{top:108px;bottom:100px}
 .hero-support{position:absolute;bottom:0;left:0;right:0}
 .hero-description{position:static;max-width:42ch;font-size:1rem;line-height:1.6;margin:0}
 .hero-actions{margin-top:16px;gap:12px 24px}
 .hero-copy .statement{display:none}
 .scrim{background:linear-gradient(180deg,#12171085,#15191370 27%,transparent 40%,transparent 57%,#111510e6 82%)}
}
@media(max-width:400px){
 header{padding-inline:18px}.brand{font-size:1.625rem}.hero-nav{gap:10px}.nav-contact{padding-inline:10px}
 .hero-info{left:18px;right:18px}.hero-description{font-size:1rem;line-height:1.55}
 .hero-actions{gap:12px 20px}.hero-actions .action-primary{padding-inline:13px}
}
@media(max-width:700px) and (max-height:720px){
 .hero-info{top:98px;bottom:86px}.hero-info h1{font-size:1.75rem}
 .hero-description{font-size:1rem}.hero-actions{margin-top:12px}
}
@media(max-height:500px) and (min-aspect-ratio:4/3){
 .hero-info{top:86px;bottom:auto;width:43%;left:22px;right:auto}
 .hero-info h1{font-size:1.5rem}.hero-eyebrow{font-size:0.6875rem;margin-bottom:8px}
 .hero-support{position:static}.hero-description{font-size:1rem;line-height:1.5;margin-top:10px}
 .hero-actions{margin-top:10px;gap:10px 16px}.hero-actions .action-primary{padding:10px 12px;font-size:0.6875rem}
 .hero-actions .action-secondary{font-size:0.6875rem;gap:6px}.hero-copy .statement{display:none}
 footer:not(.embr-footer){justify-content:flex-end}
}

/* Keep navigation usable when text grows; let the artwork reading route expand
   with its content instead of pinning words inside a fixed-height picture. */
.hero-nav{flex-wrap:wrap;justify-content:flex-end}
.hero-nav button,.hero-nav .nav-work,.nav-contact{font-size:.875rem}
.hero-actions .action-primary,.hero-actions .action-secondary{font-size:.875rem}
.hero-info h1,.hero-description{overflow-wrap:break-word}
body:not(.live-experience) #journey{height:auto}
body:not(.live-experience) .viewport{position:relative;height:auto;min-height:100svh}
body:not(.live-experience) header{position:relative}
body:not(.live-experience) .hero-copy{position:relative;display:flex;align-items:flex-end;min-height:calc(100svh - 6.25rem);padding:2rem 3.2% 6rem}
body:not(.live-experience) .hero-info{position:relative;inset:auto;width:min(55%,38rem)}
body:not(.live-experience) .hero-support{position:static}
body:not(.live-experience) .hero-description{margin-top:1.25rem}
@media(max-width:700px){
 .hero-nav{gap:4px 12px}.nav-contact{padding-inline:10px}
 body:not(.live-experience) .hero-copy{align-items:stretch;padding:1.5rem 22px 4rem;min-height:calc(100svh - 5.25rem)}
 body:not(.live-experience) .hero-info{width:100%;display:flex;flex-direction:column}
 body:not(.live-experience) .hero-support{margin-top:auto;padding-top:clamp(8rem,23svh,16rem)}
 body:not(.live-experience) .hero-description{margin-top:0}
}
@media(max-height:600px) and (min-aspect-ratio:4/3){
 body:not(.live-experience) .hero-copy{padding:2rem 22px 3rem;min-height:0}
 body:not(.live-experience) .hero-info{width:min(75%,40rem)}
 body:not(.live-experience) .hero-support{padding-top:0;margin-top:1.25rem}
 body:not(.live-experience) .hero-info h1{font-size:2rem}
 body:not(.live-experience) .hero-eyebrow{font-size:.75rem}
 body:not(.live-experience) .scrim{background:linear-gradient(90deg,#111510d9,#11151088 65%,#11151022)}
}

header{flex-wrap:wrap}

/* Keep all primary routes accessible on narrow headers. */
.nav-services{color:inherit;text-decoration:none;font-size:.875rem;display:inline-flex;align-items:center;min-height:44px}
@media(max-width:520px){.hero-nav{gap:12px}.hero-nav .nav-work{display:none}.hero-nav button,.nav-services,.nav-contact{font-size:.75rem}.nav-contact{padding-inline:10px}}

/* Shared service-navigation treatment; retain the homepage's logo and gutters. */
header .hero-nav{gap:36px}
header .hero-nav a,header .hero-nav .nav-work{position:relative;display:inline-flex;align-items:center;min-height:44px;padding:8px 0;background:transparent;border:0;border-radius:0;color:#f4f1e9;font-size:.9375rem;font-weight:400;line-height:1.45;text-decoration:none;white-space:nowrap}
header .hero-nav a::after{content:'';position:absolute;bottom:0;left:0;width:100%;height:1px;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform .3s ease}
header .hero-nav a:hover::after,header .hero-nav a:focus-visible::after{transform:scaleX(1);transform-origin:left}
@media(max-width:650px){header .hero-nav{gap:16px}header .hero-nav a,header .hero-nav .nav-work{font-size:.8125rem}}
@media(prefers-reduced-motion:reduce){header .hero-nav a::after{transition:none}}