/* Final layout layer: a readable scale and space for the small edge companion. */
:root{--pad:max(64px,calc((100vw - 1360px)/2));--edge-clearance:70px}
.header,.hero,.section,.connection-note,footer,.mobile-nav{padding-left:var(--pad);padding-right:max(var(--pad),var(--edge-clearance))}
.hero-grid>*,.connection-body>*,.manifesto-grid>*,.approach-top>*,.approach-body>*,.candidate-grid>*,.journey-grid>*,.play-intro>*,.reel-layout>*,.clarity>*{min-width:0}
.section{padding-top:96px;padding-bottom:96px}
.header .desktop-nav{gap:24px}
.header .desktop-nav a{min-height:44px;display:flex;align-items:center;gap:5px}
.brand,.footer-brand{display:flex;align-items:center;min-height:44px}
.header .talk-button{min-height:46px;gap:20px}
.with-roadster .motion-button,.with-roadster .menu-toggle{width:44px;height:44px;flex-shrink:0}
.with-roadster .header-actions{gap:10px}


.with-roadster .hero-explainer{max-width:440px}

.hero-principles{gap:9px 18px}
.hero-copy .audience-choices .button,.with-roadster .hero-copy .audience-choices .button{min-height:50px;max-width:350px;white-space:normal;gap:16px;padding:15px 22px}
.button,.candidate-copy .button,.with-roadster .candidate-copy .button,.journey-cta,.with-roadster .journey-cta{min-height:48px;border-radius:28px;}
.hero-rail{gap:24px}



.hero-rail>.film-link,.with-roadster .hero-rail>.film-link{min-height:44px;gap:10px;max-width:220px;text-align:left}
.film-link .play-disc{width:36px;height:36px;}
.hero-v2 .scroll-link,.with-roadster .hero-v2 .scroll-link{min-height:46px;align-items:center;padding-top:12px;padding-bottom:12px}
.flight-experience .scene-caption>span,.flight-experience .flight-caption .scene-caption>span{color:#3a6d5e}



.section-label{gap:24px}
.connection-body{grid-template-columns:minmax(0,1.8fr) minmax(0,1fr)}
.connection-body p{max-width:340px}




.manifesto-copy{max-width:800px}


/* Blend the entire reveal layer so its transform cannot isolate the video from the section. */
.flow-mark{mix-blend-mode:multiply}
.flow-mark video{filter:brightness(1.07);mix-blend-mode:normal}
/* Keep the people in the new footage in view when the video cards crop to fit. */
.hero-film-picture video{object-position:64% 44%}
.candidate-picture video{object-position:56% 46%}
.adaptive-reel video{object-position:72% 44%}
.cinema-video{object-position:62% 40%}
/* Keep the montage's own titles visible above its separate playback bar. */
.story-reel{aspect-ratio:auto}
.story-reel video{height:auto;aspect-ratio:16/9;object-fit:contain}
.story-reel .reel-bottom{position:relative;background:#142625}
.value-notes article>span,.role-tag{color:#426c5c}


.chapter summary>span{flex-shrink:0}
.chapter summary>i{display:grid;place-items:center;width:32px;height:32px;flex:0 0 32px;}
.chapter h3{min-width:0}
.journey-grid{gap:64px}

.cinema-top,.cinema-content{left:var(--pad);right:max(var(--pad),var(--edge-clearance))}
.cinema-content h2{max-width:940px}
.cinema-bottom p{max-width:450px}
.play-intro{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,1fr);align-items:end;gap:40px}

.play-intro p{min-width:0;max-width:360px;justify-self:end;flex-shrink:1}
.reel-bottom{min-height:66px;gap:14px}

.clarity{gap:64px}
.faq-list details{padding:0}
.faq-list summary{min-height:68px;padding:20px 0;gap:20px}
.faq-list summary>span{flex-shrink:0}
.faq-list p{padding-bottom:24px;margin-top:0}


.closing-preview{max-width:540px}
.closing-action{min-height:50px}
footer{gap:24px}

footer p{max-width:340px}
footer>a{min-height:44px;display:flex;align-items:center}
footer p>a{display:inline-flex;align-items:center;min-height:44px;}
.drive-rail #rail-flip{width:44px;height:44px;min-width:44px;min-height:44px}
.drive-rail .rail-footer{right:8px;bottom:16px}
dialog{border-radius:18px}
.dialog-close{width:44px;height:44px}
.contact-audiences button{min-height:44px;}



input,textarea{min-height:48px}
input::placeholder,textarea::placeholder{color:#5d7468;opacity:1}

.film-controls .button{min-height:46px}

#film-direct{display:flex;align-items:center;min-height:44px}
button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid #087762;outline-offset:4px}
footer a:focus-visible,.human-cinema button:focus-visible{outline-color:#67f6d4}
.skip{background:#123f36;color:white;border-radius:8px}
@media(max-width:1200px){
 .header .desktop-nav{display:none}.with-roadster .menu-toggle{display:block}
 .hero-rail{grid-template-columns:minmax(0,1fr) minmax(0,1.15fr)}
 .hero-rail>.film-link{grid-column:2;max-width:none}
}
@media(max-width:1100px){
 :root{--pad:40px;--edge-clearance:58px}
 .with-roadster .drive-rail{width:52px}


 .hero-copy .audience-choices .button,.with-roadster .hero-copy .audience-choices .button{padding:14px 17px;min-width:0}
 .connection-body{gap:30px}
 .play-intro{gap:28px}
 .journey-grid,.clarity{gap:38px}
 .approach-top{gap:36px}.candidate-grid{gap:36px}
 .value-notes,.human-roles,.candidate-steps{gap:28px}

 footer{flex-wrap:wrap;justify-content:flex-start;gap:20px 30px}
 footer p{max-width:330px}
}
@media(max-width:850px) and (min-width:721px){
 .connection-body{grid-template-columns:1fr;gap:24px}
.connection-body p{max-width:480px}
 .manifesto-copy{grid-template-columns:1fr;gap:20px}
 .candidate-grid{gap:28px}
 .candidate-copy .button{padding:15px 18px}
 .human-roles{gap:24px}
 .situation-list article{grid-template-columns:28px minmax(0,.9fr) minmax(0,1.1fr);gap:20px}
 .journey-grid{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:30px}
.journey-steps li{grid-template-columns:26px minmax(0,1fr);gap:14px}
 .clarity{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:30px}

}
@media(max-width:720px){
 :root{--pad:22px;--edge-clearance:48px}
 .section{padding-top:64px;padding-bottom:64px}
 .with-roadster .header{padding-top:18px;padding-bottom:18px;padding-right:var(--pad)}
 .with-roadster .header .brand{width:114px!important}
 .with-roadster .hero-v2 h1{margin-bottom:24px}

 .hero-meta p{gap:7px}


 .hero-principles{gap:9px 15px}
 .with-roadster .hero-copy .audience-choices .button{min-height:50px;max-width:none;gap:12px;padding:14px 17px}
 .flight-experience .flight-hud{inset:15px 14px auto;}



 .with-roadster .hero-film{gap:14px}
 .with-roadster .hero-film-picture{width:90px;height:70px}


 .with-roadster .hero-film-arrow{display:none}
 .with-roadster .hero-rail>.film-link{max-width:none;margin-top:20px}
 .connection-note{padding-top:44px;padding-bottom:48px}
 .connection-body{margin-top:24px}








 .candidate-copy .button,.with-roadster .candidate-copy .button{min-height:50px}

 .candidate-play{width:48px;height:48px}
 .candidate-picture-note{max-width:61%}
 .with-roadster .chapter p{margin-left:0;margin-right:0}


 .with-roadster .journey-cta{white-space:normal;gap:18px}


 .with-roadster .cinema-bottom p{max-width:none}
 .cinema-bottom{display:block}.cinema-bottom .round-play{margin-top:24px}
 .cinema-top{gap:15px}
 .play-intro{display:block}.play-intro p{margin-top:24px;max-width:none}

 .reel-bottom{padding:14px 16px;min-height:64px}
 .reel-headline{left:18px;bottom:82px}

 .with-roadster .faq-list summary{min-height:64px;padding:20px 0}


 .closing-link{gap:14px}
 .with-roadster footer{gap:22px;}
footer>a:last-child{text-align:left}
 .with-roadster .drive-rail{width:32px}
 .drive-rail .rail-footer{right:2px;bottom:12px}
 #contact-dialog{padding:24px 20px;width:calc(100vw - 24px)}

 .dialog-top{gap:14px}
 .contact-audiences{gap:4px}.contact-audiences button{min-height:44px}
 .film-controls{gap:12px}#film-status{min-width:120px}
 .mobile-nav a{min-height:48px;padding:14px 0}
}
@media(max-width:380px){
 :root{--pad:20px;--edge-clearance:44px}
 .with-roadster .header .brand{width:106px!important}

 .hero-meta p{max-width:230px;flex-wrap:wrap;gap:5px;}
 .hero-copy .audience-choices .button{padding-left:15px;padding-right:15px}
 .with-roadster .hero-film-picture{width:76px;height:66px}
 .with-roadster .hero-film{gap:12px}
 .flight-experience .flight-hud{gap:5px}

 .manifesto-grid{display:block}.manifesto-grid .flow-mark{display:none}



 .candidate-play{right:15px;bottom:18px}
 .with-roadster .journey-steps li{grid-template-columns:20px minmax(0,1fr);gap:12px}

 .reel-bottom{padding:12px;gap:10px}
}
@media(prefers-reduced-motion:reduce){
 .js .reveal{opacity:1;transform:none}
}

/* One fluid type scale; rem-based minimums respect the reader's text settings. */
:root{
 --type-hero:clamp(3rem,6.5vw,6rem);
 --type-feature:clamp(2rem,calc(1.125rem + 3.2vw),4rem);
 --type-title:clamp(2rem,calc(1.25rem + 2.6vw),3.5rem);
 --type-card:clamp(1.375rem,calc(1.2rem + .35vw),1.5rem);
 --type-lead:clamp(1.125rem,calc(1rem + .3vw),1.3125rem);
 --type-body:clamp(1rem,calc(.94rem + .16vw),1.125rem);
 --type-small:.875rem;--type-label:.75rem;
}
p{text-wrap:pretty}
.header .desktop-nav{font-size:.9375rem}
.header .talk-button{font-size:var(--type-small)}
.with-roadster .hero-v2 h1{font-size:var(--type-hero);line-height:1.06;letter-spacing:-.055em}
.hero-lead,.candidate-copy .candidate-lead{font-size:var(--type-lead);line-height:1.6}
.with-roadster .hero-explainer{font-size:var(--type-body);line-height:1.7;max-width:32rem}
.hero-meta,.with-roadster .hero-meta p,.hero-meta>span{font-size:var(--type-label);line-height:1.6;letter-spacing:.06em}
.hero-principles{font-size:.8125rem;line-height:1.6}
.button,.candidate-copy .button,.with-roadster .candidate-copy .button,.journey-cta,.with-roadster .journey-cta{font-size:.9375rem;line-height:1.5;min-height:50px}
.hero-copy .audience-choices .button,.with-roadster .hero-copy .audience-choices .button{font-size:.9375rem;line-height:1.5;min-height:52px;max-width:370px}
.hero-rail>p{font-size:.9375rem;line-height:1.7}
.hero-film-copy strong,.with-roadster .hero-film-copy strong{font-size:1rem;line-height:1.5}
.hero-film-copy>span,.with-roadster .hero-film-copy>span{font-size:.8125rem;line-height:1.6}
.hero-rail>.film-link,.with-roadster .hero-rail>.film-link{font-size:.8125rem;line-height:1.6;max-width:240px}
.film-link .play-disc{font-size:10px}
.hero-v2 .scroll-link,.with-roadster .hero-v2 .scroll-link{font-size:var(--type-label);line-height:1.5;letter-spacing:.05em}
.flight-experience .flight-caption .scene-caption strong{font-size:clamp(1.125rem,1.5vw,1.375rem);line-height:1.4}
.flight-experience .scene-caption>span,.flight-experience .flight-caption .scene-caption>span{font-size:var(--type-small);line-height:1.6;white-space:normal}
.flight-experience .flight-hud{font-size:10px;letter-spacing:.07em}
.flight-experience .flight-mode{font-size:11px}
.section-label,.with-roadster .section-label,.human-detail-intro>.section-label,.connection-eyebrow{font-size:var(--type-label);line-height:1.7;letter-spacing:.07em}
.connection-body p{font-size:var(--type-body);line-height:1.7;max-width:360px}
.connection-body h2,.with-roadster .approach-top h2,.candidate-copy h2,.with-roadster .journey-intro h2,.with-roadster .human-detail-intro h2,.with-roadster .play-intro h2,.with-roadster .situations-heading h2,.clarity h2{font-size:var(--type-title);line-height:1.16;letter-spacing:-.045em;text-wrap:balance}
.with-roadster .statement,.with-roadster .human-cinema .cinema-content h2{font-size:var(--type-feature);line-height:1.12;letter-spacing:-.045em;text-wrap:balance}
.manifesto-copy,.with-roadster .manifesto-copy{font-size:var(--type-body);line-height:1.7;max-width:54rem}
.value-notes p,.with-roadster .human-roles p,.with-roadster .situation-list p,.with-roadster .journey-steps p,.candidate-copy p,.candidate-steps p,.approach-top p,.journey-intro>p,.situations-heading p,.play-intro p,.with-roadster .faq-list p,.with-roadster .chapter p{font-size:var(--type-body);line-height:1.7}
.with-roadster .manifesto .value-notes h3,.with-roadster .human-roles h3,.candidate-steps h3,.with-roadster .journey-steps h3{font-size:var(--type-card);line-height:1.3;letter-spacing:-.025em;text-wrap:balance}
.with-roadster .approach .chapter h3{font-size:clamp(1.25rem,calc(1.125rem + .6vw),1.5rem);line-height:1.35;letter-spacing:-.025em;text-wrap:balance}
.with-roadster .situation-list h3{font-size:clamp(1.375rem,calc(1.1rem + .75vw),1.75rem);line-height:1.3;letter-spacing:-.025em;text-wrap:balance}
.value-notes article>span,.role-tag,.candidate-steps article>span,.flow-mark>span{font-size:var(--type-label);line-height:1.7;letter-spacing:.06em}
.candidate-note p,.step-result,.with-roadster .situation-list strong,.scope-note,.with-roadster .chapter .chapter-result{font-size:var(--type-small);line-height:1.7}
.chapter summary>span{font-size:var(--type-label)}
.chapter summary>i{line-height:1}
.cinema-top,.reel-top{font-size:var(--type-label);line-height:1.6;letter-spacing:.06em}
.with-roadster .cinema-bottom p{font-size:var(--type-body);line-height:1.7;max-width:480px}
.play-intro p{max-width:380px}
.reel-bottom{font-size:.8125rem;line-height:1.6}
.reel-headline{font-size:clamp(2rem,4vw,3.5rem);line-height:1.08;letter-spacing:-.04em}
.story-caption p,.with-roadster .story-caption p{font-size:1rem;line-height:1.7}
.with-roadster .faq-list summary{font-size:var(--type-body);line-height:1.6}
.closing-copy{font-size:var(--type-lead);line-height:1.7}
.with-roadster .closing-link>span:first-child{font-size:clamp(2rem,6.5vw,6rem);line-height:1.1;letter-spacing:-.045em}
.closing-preview{font-size:var(--type-small);line-height:1.7;max-width:560px}
.closing-action{font-size:.9375rem;line-height:1.7}
footer,.with-roadster footer{font-size:.8125rem;line-height:1.8}
footer>span,footer p>a{font-size:.8125rem;line-height:1.7}
footer p{max-width:360px}
.contact-audiences button{font-size:var(--type-small);line-height:1.4}
#contact-title{font-size:clamp(2rem,4vw,2.5rem);line-height:1.16}
#contact-dialog>p{font-size:1rem;line-height:1.7}
#contact-dialog .contact-preview-note p,.contact-preview-note strong{font-size:var(--type-small);line-height:1.7}
label{font-size:var(--type-small);line-height:1.6}
input,textarea{font-size:1rem;line-height:1.65}
.demo-note,#contact-status{font-size:.8125rem;line-height:1.7}
.film-controls .button{font-size:var(--type-small)}
#film-status,#film-direct,.film-caption{font-size:var(--type-small);line-height:1.7}
.skip{font-size:1rem}
@media(max-width:1100px){
 .hero-copy .audience-choices .button,.with-roadster .hero-copy .audience-choices .button{font-size:var(--type-small)}
}
@media(max-width:850px) and (min-width:721px){
 .connection-body p{max-width:480px}
}
@media(max-width:720px){
 :root{--type-hero:clamp(2.625rem,calc(1rem + 7.5vw),3.75rem)}
 .hero-meta,.with-roadster .hero-meta p{letter-spacing:.04em}
 .with-roadster .hero-copy .audience-choices .button{max-width:none}
 .with-roadster .hero-rail>.film-link{max-width:none}
 .flight-experience .flight-hud{font-size:9px;letter-spacing:.02em}
 .flight-experience .flight-mode{font-size:10px}
 .connection-body p{max-width:none}
 .section-label,.with-roadster .section-label,.connection-eyebrow,.human-detail-intro>.section-label{letter-spacing:.05em}
 .candidate-copy .button,.with-roadster .candidate-copy .button{font-size:var(--type-small);min-height:52px}
 .candidate-picture-note{font-size:1rem}
 .with-roadster .journey-cta{font-size:var(--type-small)}
 .with-roadster .cinema-bottom p,.play-intro p{max-width:none}
 .with-roadster .cinema-top span:last-child{font-size:var(--type-label);max-width:110px}
 .with-roadster .closing-link>span:first-child{font-size:var(--type-feature)}
 .closing-arrow{font-size:15vw}.closing-action{font-size:var(--type-small)}
 .dialog-top .section-label{font-size:var(--type-label)}
 .contact-audiences button{font-size:.8125rem}
 .mobile-nav a{font-size:1.375rem;line-height:1.4}
}
@media(max-width:380px){
 .flight-experience .flight-hud{font-size:8px}
 .flight-experience .flight-mode{font-size:9px}
 .candidate-picture-note{font-size:.9375rem}
 .reel-bottom{font-size:var(--type-label)}
}