:root { --ink: #f3f2ed; --muted: #d8e0e4; --copper: #a9c7d9; --line: rgba(210, 228, 238, .3); }
html, body, .background-stage { background: #142b3c; }
.background-fallback { background-image: url('/assets/media/background-desktop.v1.webp'); }
.background-shade { background: linear-gradient(90deg, rgba(7, 20, 34, .64), rgba(10, 22, 31, .16) 80%), linear-gradient(0deg, rgba(8, 22, 35, .48), rgba(7, 19, 31, .08) 65%); }
.background-stage.show-opening #continuation-film { opacity: 0; }
.background-stage.show-opening #opening-film { opacity: 1; }
.background-stage.show-continuation #opening-film { opacity: 0; }
.background-stage.show-continuation #continuation-film { opacity: 1; }
.site-header { width: min(1280px, calc(100% - 80px)); min-height: 102px; background: rgba(7, 20, 34, .58); padding-inline: 16px; }
.site-header nav a { color: #e8eff2; }
.wordmark b, .header-cta span, .text-link span, .underlined-link span { color: #b6d3e3; }
.header-cta { border-color: #aac5d7; color: #e0edf4; padding: 12px 20px; }
.site-header nav a:hover, .text-link:hover, .underlined-link:hover { color: #b9d9ee; }
.hero { width: min(1280px, calc(100% - 80px)); min-height: 810px; padding: 110px 0 150px; }
.hero-copy { width: min(880px, 90%); }
h1 { font-size: clamp(3.8rem, 7.6vw, 7.15rem); max-width: 1050px; line-height: 1.02; }
h1 em, h2 em { color: #c3ddeb; }
.eyebrow { color: #bcd7e5; letter-spacing: .17em; }
.hero-lede { max-width: 650px; color: #eef1f0; }
.hero-note { bottom: 90px; background: rgba(15, 42, 60, .66); border-color: #abc9dd; }
.hero-note strong { color: #f3f5f3; }
.app-release-caption { color: #e0e9eb; }
.app-release-cta:hover { background: #1d465e; }
.button-light { background: #e4edf1; color: #173447; }
.button-light span { color: #3a647b; }
.text-link, .underlined-link { color: #e3edf3; text-decoration-color: #b3cbd9; }
.scroll-cue { color: #e1eaf0; }
.section-wrap { width: min(1160px, calc(100% - 80px)); }
.approach { padding-top: 100px; padding-bottom: 90px; }
.section-heading { max-width: none; display: grid; grid-template-columns: 1.2fr 1fr; gap: 0 80px; align-items: end; }
.section-heading .eyebrow { grid-column: 1 / -1; }
.section-heading h2 { font-size: clamp(2.8rem, 4.6vw, 4.4rem); margin-bottom: 0; }
.section-intro { margin-bottom: 0; color: #e0e6e8; }
.principles { gap: 35px; }
.principles article, .principles article + article { padding: 28px 0; border-left: 0; }
.principles p { max-width: none; color: #e0e5e7; }
.principles h3 { color: #e9f0f3; }
.story-section, .story-right { grid-template-columns: 1fr 1.05fr; gap: 90px; padding: 90px 0; }
.story-copy { max-width: none; }
.story-copy > p:not(.eyebrow):not(.micro-note) { color: #e0e6e8; }
.micro-note { color: #d3e2ec; }
.media-frame { border-color: rgba(193, 218, 232, .65); box-shadow: 0 22px 60px rgba(4, 19, 30, .32); }
.support-band { width: min(1280px, calc(100% - 80px)); background: rgba(12, 33, 50, .25); border: 1px solid #6b8d9e; padding: 72px 60px; gap: 75px; }
.support-copy > p:not(.eyebrow) { color: #e4e9eb; }
.support-callout { background: rgba(30, 62, 82, .85); border-color: #b5d2e2; }
.support-callout strong { color: #f0f4f6; }
.support-callout p { color: #e1eaf0; }
.closing { text-align: left; padding: 100px 0; }
.closing .eyebrow { justify-content: flex-start; }
.closing h2 { max-width: 900px; }
.app-intro { margin-left: 0; max-width: 790px; color: #e0e6e8; }
.app-features { gap: 36px; }
.app-features article { padding: 25px 0; background: transparent; border-top-color: #9ebfce; }
.app-features p { color: #e0e6e8; }
.app-actions { justify-content: flex-start; }
.site-footer { width: min(1280px, calc(100% - 80px)); grid-template-columns: auto 1fr; padding-bottom: 42px; }
.site-footer p { color: #dbe5eb; font-size: .74rem; }
.footer-tag { grid-column: 1 / -1; text-align: left; color: #aec9d8; }
a:focus-visible, video:focus-visible { outline-color: #b5daed; }
@media (max-width: 850px) {
  .site-header, .hero, .section-wrap, .support-band, .site-footer { width: calc(100% - 48px); }
  .hero { min-height: 800px; }
  .section-heading { gap: 0 35px; }
  .story-section, .story-right { gap: 40px; }
  .support-band { padding: 55px 32px; gap: 35px; }
}
@media (max-width: 620px) {
  .background-fallback { background-image: url('/assets/media/background-mobile.v1.webp'); }
  .background-shade { background: linear-gradient(180deg, rgba(7, 20, 34, .28), rgba(7, 20, 34, .52) 70%, rgba(7, 20, 34, .6)); }
  .site-header, .hero, .section-wrap, .support-band, .site-footer { width: calc(100% - 36px); }
  .site-header { min-height: 100px; }
  .wordmark { font-size: .60rem; letter-spacing: .12em; }
  .header-cta { padding: 9px 10px; }
  .hero { min-height: 790px; padding: 65px 0 185px; }
  .hero-copy { width: 100%; }
  h1 { font-size: clamp(1.95rem, 10vw, 3.875rem); }
  .hero .eyebrow { font-size: .54rem; letter-spacing: .1em; }
  .hero-note { right: auto; left: 0; bottom: 65px; width: min(300px, 100%); }
  .section-heading { display: block; }
  .section-heading h2 { margin-bottom: 25px; }
  .approach { padding-top: 65px; padding-bottom: 65px; }
  .principles { gap: 0; }
  .story-section, .story-right { grid-template-columns: 1fr; gap: 28px; padding: 62px 0; }
  .support-band { padding: 42px 22px; }
  .closing { padding: 75px 0; }
  .app-features { gap: 18px; }
  .site-footer { grid-template-columns: 1fr; gap: 22px; }
}