/* Spatial calibration at the measured 1080 × 676 content viewport.
   AGM copy and imagery are intentional substitutions, not source-pixel matches. */
.nav { height: 4rem; }
.nav_link,.nav_cta { font-weight: 400; font-size: .75rem; letter-spacing: 0; }
.nav_brand { opacity: .78; font-size: 2.5rem; font-weight: 600; letter-spacing: -.04em; }
.cine { height: 460vh; }
.cine_title { font-size: 4.075vw; line-height: .96; letter-spacing: -.045em; }
.cine_sub { font-size: 1.3rem; max-width: 31rem; margin-top: .9rem; margin-bottom: 1.45rem; }
.cine_copy { top: 29.5%; left: 15.75%; }
.cine_caption { font-size: 1.125rem; margin-top: 3.4vh; line-height: 1.5; }
.tabs { margin-top: 3.4vh; }
.tabs_pill { font-size: .95rem; }
.scr { padding: 1.1em; }
.scr-home_pipe .scr-h { font-size: 1.4em; }
.scr-home_chat .scr-bubble { font-size: .75em; border-radius: .65em; }
.scr-legend { gap: 1em; font-size: .65em; }
.scr-legend i { border-radius: 0; box-shadow: 0 -3px currentColor,3px -3px currentColor,3px 0 currentColor; width: 2px; height: 2px; margin-right: .4em; }
.hiw { padding-top: 1rem; } /* lead line starts 46px below the caption (measured 13.5 s) */
.vline.is-lead i { height: 16.7rem; }
.hiw_head { gap: 1rem; padding-top: 4.7rem; padding-bottom: 2rem; }
.hiw_head .h2 { max-width: 48rem; }
.hiw .vline.is-short i { height: 2.6rem; }
.hiw .vline.is-short.has-bar { margin-bottom: 2.05rem; }
.hiw_step .vline.is-tiny { height: .8rem; }
.market { min-height: 135vh; }
.market_copy { padding-top: 55vh; gap: 1.7rem; }
.market_copy .h2 { max-width: 30rem; text-align: center; }
.market_copy .sub { font-size: 1.15rem; }
.mcard { transform: perspective(900px) rotate(var(--r)); }
.mcard_img { border-radius: .9rem; }
.mcard:nth-child(1) { --r: 15deg!important; --y: 15.5%!important; --w: 14.1rem!important; --h: 12.2rem!important; }
.mcard:nth-child(2) { --r: -3deg!important; --y: 26%!important; }
.mcard:nth-child(3) { --y: 11.9%!important; }
.mcard:nth-child(4) { --r: -16deg!important; --x:70%!important; --y: 14.2%!important; --w: 17.2rem!important; --h: 13.6rem!important; }
.mcard:nth-child(5) { --y: 46%!important; }
.mcard:nth-child(6) { --x:83.5%!important; --y: 45.2%!important; }
.mcard:nth-child(7) { --x:12%!important; --y:65.8%!important; --w:13.5rem!important; --h:12.5rem!important; }
.mcard:nth-child(8) { --y:68.5%!important; --w:11.75rem!important; --h:11.7rem!important; }
.mcard:nth-child(9) { --x:63.5%!important; --y:63%!important; }
.mcard:nth-child(10) { --x:76%!important; --y:61.6%!important; --w:10rem!important; --h:14rem!important; }
.whole { padding-left: 1.8rem; padding-right: 1.8rem; }
.vline.is-cross b { width: 39.7vw; }
.whole_head { margin-top: 0; margin-bottom: 0; padding: 3.3rem 0 5.2rem; }
.whole_head .sub { margin-top: 0; }
.whole .vline.is-short i { height: 2.9rem; }
.whole .vline.is-short { margin-bottom: 1.8rem; }
.whole .vline.is-short:last-child { margin: 1.9rem 0 0; }
.tile_box img { filter: grayscale(1) contrast(1.15) brightness(.82); }
.tiles { height: 25rem; max-width: none; gap: .8rem; }
.tiles_row { gap: .7rem; transition: flex .5s var(--ease-expo); }
.tile, .tile_side { transition-duration: .5s; transition-timing-function: var(--ease-expo); } /* hover settles like an expo.out over ~.5 s (26.3–26.8 s) */
.tile_box { border-radius: .65rem; }
.tile_side em { font-size: .8rem; }
.ticker { padding-top: 2.3rem; }
.ticker .vline.is-tiny { height: 3rem; margin-top: 2.45rem; }
.ticker_rows { padding: 3.95rem 0 4.3rem; gap: 1.1rem; }
.ticker .vline.is-mid i { height: 12rem; }
.backed { padding-top: 8.25rem; }
.backed { padding-bottom: 7rem; }
.backed_cols { max-width: 67.3rem; gap: 0 1rem; }
.backed_head { gap: 1.7rem; margin-bottom: 5.6rem; }
.backed_col li { height: 6.25rem; gap: 1.4rem; }
.backed_logo { border: 0; border-radius: 0; padding: .3rem; }
.backed_col p { font-size: 1rem; }
.backed_col b { font-size: 1.05rem; }
.quotes { padding-top: 5.8rem; padding-bottom: 0; }
.sun_wrap-rise { margin-top: -7.75rem; } /* the dome starts growing (wrapper top meets the viewport bottom) when the frame bottom is still 104px below it (fit of 35.8–37.2 s) */
.quotes_stage { height: 29.75rem; }
.quote blockquote { font-size: 3.45rem; letter-spacing: -.05em; max-width: 30rem; } /* sized so every quote breaks into 3 lines like the footage (checked in Mona Sans at 1440, 1024 and 390 wide) */
.quote figcaption { bottom: 1.3rem; }
.life { height: 470vh; }
.life_title { top: 13.1vh; font-size: 4.075vw; line-height: .94; letter-spacing: -.045em; }
.life_node { width: 22rem; gap: .4rem; }
.life_node::before { height: var(--stem-length,20rem); }
.life_node::after { top: var(--stem,6.6rem); }
.life_node b { font-size: 1.02rem; }
.life_node li { font-size: .78rem; }
.life_tag { font-size: .84rem; letter-spacing: 0; }
.life_body { gap: .35rem; }
.manifesto { padding-top: 0; padding-bottom: 17rem; gap: 1.7rem; }
.manifesto .h2 { margin-bottom: 2rem; }
.manifesto .btn-mono { margin-top: 2rem; }
.footer_links ul { gap: .9rem; }
.manifesto > .sun_wrap { height: 84vh; margin-bottom: calc(6rem - 1.7rem); } /* heading top sits .977H below the bell base (52.5–53.3 s) */
.manifesto p { font-size: 1.3rem; max-width: 40rem; color: #2a2a2a; }
@media (min-width: 1800px) { .cine_title,.h2,.cine_heading,.life_title { font-size: 73px; } }
@media (max-width: 700px) {
 html { font-size: 13px; }
 .nav { height: 56px; }
 .nav_logo { width: 30px; height: 30px; }
 .nav_links { gap: 12px; }
 .nav_link { font-size: .75rem; } /* same size as the nav button (it was 8px, the smallest text on the site) */
 .cine_title,.cine_heading,.h2,.life_title { font-size: clamp(28px,6.3vw,44px); }
 .cine_copy { left: 7%; right: 7%; top: auto; bottom: 14%; }
 .cine_sub { font-size: 14px; max-width: 330px; }
 .cine_tablet-wrap { justify-content: center; justify-content: safe center; padding: 50px 0; } /* safe: a stack taller than a landscape phone starts at the top (then fitStage scales it) instead of losing its heading above the screen */
 .cine_heading { margin-bottom: 30px; }
 .tablet { width: 92vw; }
 .tablet_screen { font-size: 1.12vw; }
 .tabs { margin-top: 30px; }
 .tabs_pill { font-size: 9px; padding: 0 8px; }
 .cine_caption { font-size: 12px; margin-top: 22px; }
 .hiw_head .h2 { padding: 0; }
 .hiw_title { font-size: 20px; max-width: 90%; }
 .hiw_sub { max-width: 88%; font-size: 13px; }
 .hiw_card { width: 82vw; }
 .market { min-height: 100vh; }
 .market_copy { padding-top: 40vh; }
 .market_copy .h2 { text-align: center; }
 .market_copy .sub { max-width: 70%; font-size: 12px; }
 .mcard { width: calc(var(--w)*.43); }
 .mcard_img { height: calc(var(--h)*.43); }
 .mcard:nth-child(4) { --x:69%!important; }
 .mcard:nth-child(6) { --x:88%!important; }
 .tiles { height: auto; }
 .tiles_row { flex-wrap: wrap; }
 .tile { flex: 1 1 28%; height: 105px; }
 .tile:last-child { flex-grow: 1; }
 .backed_cols { max-width: 90%; }
 .backed_col p { font-size: 12px; }
 .quotes_frame,.quotes_track { width: 80vw; }
 .quote blockquote { font-size: 32px; }
 .life_node { width: 170px; }
 .life_node b { font-size: 12px; }
 .life_tag { font-size: 10px; }
 .manifesto p { font-size: 15px; max-width: 90%; }
 .footer_links { gap: 2rem; }
}

/* floating cards (positions re-measured against the heading at 21.0 s and 23.5 s): orange = photo multiplied over a red-orange field (VO2-style cards in the footage) */
.mcard_img.is-amber { background: radial-gradient(circle at 50% 25%, #ff9a2a, #f0461c 70%, #d92a0c); }
.mcard_img.is-amber img { mix-blend-mode: multiply; filter: grayscale(1) contrast(1.4) brightness(.95); }
