:root {
  --forest:#013823;
  --pine:#02563f;
  --teal:#94d4b6;
  --pearl:#f7fbff;
  --ink:#10261c;
  --journey-height:460svh;
  --page-gutter:clamp(30px,5.2vw,100px);
  color-scheme:dark;
  font-family:Georgia,'Times New Roman',serif;
  background:#061711;
}
* { box-sizing:border-box; }
html { scroll-behavior:auto; }
body { min-width:320px; margin:0; overflow-x:clip; color:var(--pearl); background:#061711; -webkit-font-smoothing:antialiased; }
a { color:inherit; }
button { font:inherit; color:inherit; cursor:pointer; }
a:focus-visible,button:focus-visible { outline:2px solid var(--teal); outline-offset:6px; }
.journey { position:relative; height:var(--journey-height); }
.cinematic-frame { position:sticky; top:0; height:100vh; height:100svh; overflow:hidden; isolation:isolate; contain:layout paint style; background:#061711; }
.media-stage { position:absolute; inset:0; z-index:-2; overflow:hidden; }
.film-poster,.film-poster img,[data-cinematic-master] { position:absolute; inset:0; display:block; width:100%; height:100%; }
.film-poster { z-index:2; margin:0; pointer-events:none; }
.film-poster img,[data-cinematic-master] { object-fit:cover; object-position:center; }
[data-cinematic-master] { z-index:1; background:#061711; }
.film-poster-final { z-index:3; opacity:0; }
.world-grade { position:absolute; inset:0; z-index:4; pointer-events:none; background:linear-gradient(90deg,rgba(3,17,11,.48),transparent 54%),linear-gradient(180deg,rgba(3,17,11,.12),transparent 24%,transparent 77%,rgba(3,17,11,.32)); }

.site-header { position:absolute; z-index:12; inset:0 0 auto; display:flex; min-height:104px; align-items:center; gap:32px; padding:0 var(--page-gutter); border-bottom:1px solid #f7fbff26; transform:translateZ(0); }
.brand { display:flex; align-items:center; gap:10px; flex:none; text-decoration:none; }
.brand img { display:block; height:auto; }
.brand .brand-symbol { width:35px; height:35px; }
.brand .brand-wordmark { width:174px; }
.site-header p { margin:0 auto 0 0; font-size:15px; line-height:1.35; color:#e1eae3d9; }
.header-contact { display:inline-flex; align-items:center; justify-content:center; gap:18px; min-height:44px; margin-left:auto; text-decoration:none; font-size:17px; white-space:nowrap; }
.contact-arrow { color:var(--teal); font-size:22px; }
.contact-mobile { display:none; }

.typography-stage { position:absolute; inset:0; z-index:8; pointer-events:none; }
.hero-intro,.phase-panel,.final-lockup,.final-support { position:absolute; opacity:0; will-change:opacity,transform; }
.hero-intro { left:var(--page-gutter); top:18vh; width:46%; max-width:880px; }
.phase-kicker { margin:0 0 27px; color:var(--teal); font-size:13px; line-height:1.4; letter-spacing:.11em; }
.phase-kicker span { display:inline-block; margin-left:25px; color:#e1eae399; letter-spacing:0; }
.hero-intro h1 { margin:0; font-size:clamp(64px,5.45vw,108px); font-weight:400; line-height:1.015; letter-spacing:-.055em; }
.hero-intro h1 em { font-weight:400; color:var(--teal); }
.intro-description { max-width:500px; margin:27px 0 0; color:#ecf4e9e6; font-size:clamp(20px,1.52vw,28px); line-height:1.45; }
.intro-action { display:inline-flex; align-items:center; gap:32px; min-height:44px; margin-top:27px; padding:0 0 8px; border:0; border-bottom:1px solid #94d4b69c; background:none; font-size:18px; pointer-events:auto; }
.intro-action span { color:var(--teal); font-size:23px; }
.phase-panel { left:var(--page-gutter); top:24vh; width:43%; max-width:760px; }
.phase-panel h2 { margin:0; font-size:clamp(62px,5.6vw,108px); font-weight:400; letter-spacing:-.055em; line-height:1.015; }
.phase-description { max-width:470px; margin:30px 0 0; color:#edf4eeeb; font-size:clamp(24px,1.8vw,32px); line-height:1.4; }
.final-lockup { left:var(--page-gutter); top:25vh; }
.final-lockup>p { margin:0 0 22px; color:var(--teal); font-size:14px; letter-spacing:.12em; }
.final-lockup h2 { margin:0; font-size:clamp(94px,11vw,178px); line-height:.93; letter-spacing:-.065em; font-weight:400; }
.final-support { left:var(--page-gutter); top:57vh; max-width:460px; pointer-events:auto; }
.final-support p { margin:0; color:#edf4eee0; font-size:26px; line-height:1.4; }
.primary-action { display:inline-flex; align-items:center; gap:30px; min-height:44px; margin-top:26px; padding-bottom:7px; border-bottom:1px solid var(--teal); font-size:19px; text-decoration:none; }
.primary-action span { color:var(--teal); }
.scroll-cue { position:absolute; z-index:9; left:var(--page-gutter); bottom:114px; margin:0; color:#f7fbffb8; font-size:14px; }
.scroll-cue span { display:inline-block; margin-left:30px; color:var(--teal); }
.phase-navigation { position:absolute; z-index:10; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); left:var(--page-gutter); right:var(--page-gutter); bottom:24px; gap:26px; }
.phase-navigation button { position:relative; display:flex; align-items:center; gap:14px; text-align:left; min-height:57px; padding:17px 0 0; border:0; border-top:1px solid #d5e6db42; background:none; color:#dbe5dfb5; font-size:16px; line-height:1.35; }
.phase-navigation button:before { content:''; position:absolute; left:0; top:-1px; width:100%; height:1px; background:var(--teal); transform:scaleX(var(--phase-progress,0)); transform-origin:left; }
.phase-navigation strong { font-weight:400; }
.phase-navigation span { flex:none; font-size:13px; color:#94d4b6c2; }
.phase-navigation button[aria-current=step] { color:var(--pearl); }
.phase-navigation button:hover { color:var(--pearl); }

.no-script-hero { min-height:100svh; padding:90px var(--page-gutter); background:var(--forest); }
.no-script-hero h1 { max-width:950px; font-size:clamp(48px,7vw,112px); line-height:1.04; font-weight:400; letter-spacing:-.05em; }
.no-script-hero p { max-width:660px; font-size:22px; line-height:1.5; }
.no-script-hero a { display:inline-block; margin-top:20px; font-size:20px; }
.journey[data-media-state=static] { height:100svh; }
.journey[data-media-state=static] .cinematic-frame { position:relative; }
.journey[data-media-state=static] .film-poster-opening { display:none; opacity:0!important; }
.journey[data-media-state=static] .film-poster-final { opacity:1!important; }
.journey[data-media-state=static] .scroll-cue,.journey[data-media-state=static] .phase-navigation { display:none; }

@media(max-width:1100px) and (min-width:681px) {
  .site-header { gap:24px; min-height:92px; }
  .site-header p { display:none; }
  .brand .brand-symbol { width:31px; height:31px; }
  .brand .brand-wordmark { width:156px; }
  .hero-intro { width:48%; top:20vh; }
  .hero-intro h1 { font-size:6.05vw; }
  .phase-panel { width:47%; }
  .phase-panel h2 { font-size:6.3vw; }
  .phase-description { font-size:23px; }
  .phase-navigation { gap:18px; }
  .phase-navigation button { font-size:14px; gap:9px; }
}
@media(min-width:681px) and (max-height:760px) {
  .site-header { min-height:86px; }
  .hero-intro { top:20vh; }
  .hero-intro .phase-kicker { margin-bottom:20px; }
  .hero-intro h1 { font-size:min(5.1vw,78px); }
  .intro-description { margin-top:20px; font-size:20px; max-width:470px; }
  .intro-action { margin-top:15px; font-size:17px; }
  .phase-panel { top:22vh; }
  .phase-panel h2 { font-size:min(5.4vw,82px); }
  .phase-description { margin-top:23px; font-size:23px; }
  .final-lockup { top:24vh; }
  .final-lockup h2 { font-size:min(11vw,178px); }
  .final-support { top:56vh; }
  .final-support p { font-size:22px; }
  .primary-action { margin-top:18px; }
  .phase-navigation { bottom:18px; }
  .scroll-cue { bottom:98px; }
}
@media(max-width:680px) {
  :root { --journey-height:430svh; --page-gutter:25px; }
  .site-header { min-height:84px; padding:0 var(--page-gutter); gap:15px; }
  .brand { gap:8px; }
  .brand .brand-symbol { width:28px; height:28px; }
  .brand .brand-wordmark { width:127px; }
  .site-header p,.contact-desktop { display:none; }
  .contact-mobile { display:inline; }
  .header-contact { gap:10px; min-height:44px; font-size:16px; }
  .contact-arrow { font-size:21px; }
  .hero-intro { left:var(--page-gutter); right:var(--page-gutter); top:117px; width:auto; }
  .phase-kicker { margin-bottom:19px; font-size:11px; letter-spacing:.09em; }
  .hero-intro h1 { font-size:clamp(36px,10.8vw,62px); line-height:1.03; letter-spacing:-.055em; }
  .intro-description { margin-top:23px; max-width:440px; font-size:18px; line-height:1.4; }
  .intro-action { min-height:42px; margin-top:18px; padding-bottom:5px; gap:25px; font-size:16px; }
  .intro-action span { font-size:21px; }
  .phase-panel { left:var(--page-gutter); right:var(--page-gutter); top:128px; width:auto; max-width:none; }
  .phase-kicker span { margin-left:19px; }
  .phase-panel h2 { font-size:clamp(42px,11.8vw,65px); line-height:1.03; }
  .phase-description { max-width:410px; margin-top:24px; font-size:20px; line-height:1.4; }
  .world-grade { background:linear-gradient(180deg,rgba(3,17,11,.18),transparent 52%,transparent 76%,rgba(3,17,11,.85) 94%,rgba(3,17,11,.85)); }
  .final-lockup { left:var(--page-gutter); top:118px; }
  .final-lockup>p { margin-bottom:16px; font-size:12px; }
  .final-lockup h2 { font-size:clamp(70px,20vw,125px); }
  .final-support { left:var(--page-gutter); top:238px; max-width:320px; }
  .final-support p { font-size:20px; }
  .primary-action { margin-top:18px; min-height:44px; font-size:18px; }
  .final-support .primary-action { margin-top:4px; min-height:40px; padding-bottom:4px; }
  .scroll-cue { display:none; }
  .phase-navigation { left:var(--page-gutter); right:var(--page-gutter); bottom:16px; gap:12px; }
  .phase-navigation button { display:block; min-height:65px; padding-top:10px; font-size:13px; line-height:1.25; }
  .phase-navigation span { display:block; margin-bottom:8px; font-size:12px; }
  .phase-navigation strong { display:block; font-weight:400; }
}
@media(max-width:680px) and (max-height:740px) {
  .site-header { min-height:76px; }
  .hero-intro { top:102px; }
  .hero-intro .phase-kicker { margin-bottom:14px; }
  .hero-intro h1 { font-size:10vw; }
  .intro-description { margin-top:17px; font-size:18px; line-height:1.35; }
  .intro-action { margin-top:10px; min-height:38px; }
  .phase-panel { top:113px; }
  .phase-panel h2 { font-size:11vw; }
  .phase-description { margin-top:20px; font-size:19px; }
  .final-lockup { top:113px; }
  .final-support { top:218px; }
  .final-support p { display:none; }
  .final-support .primary-action { margin-top:0; min-height:36px; }
  .primary-action { margin-top:13px; }
  .phase-navigation { bottom:12px; }
  .phase-navigation button { min-height:58px; }
  .scroll-cue { bottom:94px; }
}
@media(prefers-reduced-motion:reduce) { * { scroll-behavior:auto!important; } }
