:root {
  --forest: #0f1f10;
  --forest-deep: #07130b;
  --ink: #0a0d0a;
  --paper: #f4f4ef;
  --white: #fff;
  --acid: #c7f58a;
  --bronze: #b88a57;
  --muted: #9ca69a;
  --line-dark: rgba(255,255,255,.18);
  --line-light: rgba(9,18,10,.2);
  --shell: calc(100vw - 56px);
  --ease: cubic-bezier(.2,.75,.22,1);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { background: var(--forest); color: var(--white); font-family: "Google Sans Flex", "Google Sans", Arial, sans-serif; margin: 0; overflow-x: hidden; text-rendering: optimizeLegibility; }
body.menu-open { overflow: hidden; }
img { display: block; height: auto; max-width: 100%; }
a { color: inherit; }
button { color: inherit; font: inherit; }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { font-family: "Google Sans Flex", "Google Sans", Arial, sans-serif; font-kerning: normal; font-optical-sizing: auto; font-weight: 500; letter-spacing: normal; }
h1 { font-size: clamp(3.7rem, 5.65vw, 5.15rem); line-height: .96; }
h2 { font-size: clamp(3.2rem, 5.7vw, 5.6rem); line-height: .98; }
h3 { font-size: clamp(2rem, 3.2vw, 3.6rem); line-height: 1; }
::selection { background: var(--acid); color: var(--ink); }
:focus-visible { outline: 2px solid var(--acid); outline-offset: 5px; }
[hidden] { display: none !important; }
.sr-only { clip: rect(0,0,0,0); clip-path: inset(50%); height: 1px; overflow: hidden; position: absolute; white-space: nowrap; width: 1px; }
.skip-link { background: var(--acid); color: var(--ink); left: 16px; padding: 12px 17px; position: fixed; text-decoration: none; top: 12px; transform: translateY(-160%); transition: transform .2s; z-index: 1000; }
.skip-link:focus { transform: translateY(0); }
.dark { background: var(--forest); color: var(--white); }
.light { background: var(--paper); color: var(--ink); }

.scroll-progress { background: rgba(255,255,255,.08); height: 2px; left: 0; position: fixed; right: 0; top: 0; z-index: 100; }
.scroll-progress span { background: var(--acid); display: block; height: 100%; transform: scaleX(0); transform-origin: left; will-change: transform; }

.site-header { align-items: center; display: grid; gap: 30px; grid-template-columns: 1fr auto 1fr; height: 94px; left: 0; padding-inline: 28px; position: fixed; right: 0; top: 0; transition: background .35s, border-color .35s, height .35s, padding .35s, transform .35s; z-index: 80; }
.site-header.is-scrolled { backdrop-filter: blur(18px); background: rgba(7,19,11,.82); border-bottom: 1px solid rgba(255,255,255,.12); height: 72px; padding-inline: 28px; }
.brand { display: block; grid-column: 2; grid-row: 1; justify-self: center; width: 165px; }
.brand img, .footer-brand img { filter: brightness(0) invert(1); }
.desktop-nav { align-items: center; display: flex; gap: clamp(24px, 3vw, 44px); grid-column: 1; grid-row: 1; justify-content: flex-start; justify-self: start; }
.desktop-nav a, .header-cta, .kicker, .card-top, .initiative-top, .footer-bottom, .manifesto-index, .closing-label { font-size: .72rem; font-weight: 600; letter-spacing: .055em; text-transform: none; }
.kicker, .card-top, .initiative-top, .manifesto-index, .closing-label, .principle-list strong { font-family: "Google Sans Flex", "Google Sans", Arial, sans-serif; font-kerning: normal; }
.desktop-nav a { position: relative; text-decoration: none; }
.desktop-nav a::after { background: var(--acid); bottom: -8px; content: ""; height: 1px; left: 0; position: absolute; transform: scaleX(0); transform-origin: right; transition: transform .3s; width: 100%; }
.desktop-nav a:hover::after { transform: scaleX(1); transform-origin: left; }
.header-cta { align-items: center; display: flex; gap: 17px; grid-column: 3; grid-row: 1; justify-content: flex-end; justify-self: end; text-decoration: none; }
.header-cta i, .outline-button i { align-items: center; background: var(--acid); color: var(--ink); display: inline-flex; font-style: normal; height: 25px; justify-content: center; transition: transform .35s var(--ease); width: 25px; }
.header-cta:hover i, .outline-button:hover i { transform: translate(3px,-3px); }
.menu-toggle, .mobile-menu { display: none; }

.hero { height: 100svh; min-height: 690px; overflow: hidden; position: relative; }
.hero::after { background: linear-gradient(90deg, rgba(15,31,16,.2), transparent 40%), linear-gradient(0deg, rgba(15,31,16,.25), transparent 35%); content: ""; inset: 0; pointer-events: none; position: absolute; }
.hero-visual { inset: 0; overflow: hidden; position: absolute; }
.hero-visual > img { height: 100%; object-fit: cover; object-position: center; transform: scale(1.035); width: 100%; will-change: transform; }
.hero-fragment { background-image: url("../img/lionstraits-passage-sculpture.webp"); background-position: center; background-repeat: no-repeat; background-size: cover; inset: 0; pointer-events: none; position: absolute; transform: translate3d(0,0,0); will-change: transform; z-index: 1; }
.hero-fragment--top { clip-path: polygon(86% 0,100% 0,100% 31%,86% 31%); transform-origin: 93% 15%; }
.hero-fragment--right { clip-path: polygon(84% 42%,100% 42%,100% 82%,84% 82%); transform-origin: 92% 62%; }
.hero-fragment--left { clip-path: polygon(31% 68%,48% 68%,48% 100%,31% 100%); transform-origin: 39% 87%; }
.hero-copy { left: 28px; max-width: 920px; position: absolute; top: 20%; z-index: 3; }
.hero-kicker { opacity: .72; }
.kicker { align-items: center; display: flex; gap: 16px; margin-bottom: 30px; }
.kicker span { color: var(--bronze); }
.kicker--acid span, .kicker--acid { color: var(--acid); }
.hero h1 { margin-bottom: 35px; max-width: 915px; }
.hero h1 span { display: block; opacity: 0; transform: translateY(105%); }
.hero.is-ready h1 span { animation: line-in .8s var(--ease) forwards; }
.hero.is-ready h1 span:nth-child(2) { animation-delay: .12s; }
.hero.is-ready h1 span:nth-child(3) { animation-delay: .24s; }
@keyframes line-in { to { opacity: 1; transform: none; } }
.outline-button { align-items: center; border: 1px solid rgba(255,255,255,.28); display: inline-flex; font-size: .72rem; font-weight: 600; gap: 28px; letter-spacing: .06em; min-height: 57px; padding: 10px 10px 10px 17px; text-decoration: none; text-transform: none; transition: border-color .3s; }
.outline-button:hover { border-color: var(--acid); }
.hero-intro { bottom: 38px; font-size: clamp(1rem, 1.45vw, 1.35rem); left: 28px; line-height: 1.1; margin: 0; max-width: 520px; position: absolute; z-index: 3; }
.scroll-cue { align-items: center; bottom: 38px; display: flex; font-size: .72rem; gap: 9px; position: absolute; right: 28px; text-decoration: none; z-index: 3; }
.scroll-cue span { animation: scroll-bob 1.5s ease-in-out infinite; font-size: 1rem; }
@keyframes scroll-bob { 50% { transform: translateY(5px); } }
.target { border: 1px solid rgba(255,255,255,.18); height: 92px; position: absolute; width: 92px; z-index: 2; }
.target::before, .target::after { background: rgba(255,255,255,.18); content: ""; left: 50%; position: absolute; top: 50%; transform: translate(-50%,-50%); }
.target::before { height: 1px; width: 140%; }
.target::after { height: 140%; width: 1px; }
.target span { border: 1px solid rgba(255,255,255,.18); inset: 22px; position: absolute; }
.target--one { left: 42.5%; top: 49%; }
.target--two { right: 20%; top: 28%; transform: scale(.65); }
.data-tag { background: var(--paper); color: var(--ink); font: 500 .54rem/1.15 "Google Sans Flex", "Google Sans", Arial, sans-serif; letter-spacing: .04em; margin: 0; padding: 5px 7px; position: absolute; z-index: 2; }
.data-tag--one { left: 42.5%; top: calc(49% + 101px); }
.data-tag--two { right: 19.5%; top: calc(28% + 72px); }

.manifesto { background: var(--paper); height: 170vh; position: relative; }
.manifesto-stage { background: var(--forest); height: 100vh; overflow: hidden; position: sticky; top: 0; }
.manifesto-media, .manifesto-wash { inset: 0; position: absolute; }
.manifesto-media img { height: 100%; object-fit: cover; object-position: center; width: 100%; }
.manifesto-media--current img { animation: water-image-drift 18s ease-in-out infinite alternate; transform: scale(1.08); }
@keyframes water-image-drift { to { transform: scale(1.14) translate3d(-1.5%,1%,0); } }
.manifesto-wash { background: linear-gradient(90deg, rgba(7,19,11,.68), rgba(7,19,11,.18) 58%, rgba(7,19,11,.48)), linear-gradient(0deg, rgba(7,19,11,.42), transparent 50%); pointer-events: none; z-index: 1; }
.water-overlay { inset: 0; overflow: hidden; pointer-events: none; position: absolute; z-index: 2; }
.water-overlay::before { animation: water-refraction 9s ease-in-out infinite alternate; background: radial-gradient(ellipse at 62% 57%,rgba(99,226,215,.24),transparent 42%), linear-gradient(112deg,transparent 26%,rgba(186,255,237,.13) 46%,transparent 64%); content: ""; filter: blur(8px); inset: -12%; mix-blend-mode: screen; position: absolute; }
@keyframes water-refraction { to { transform: translate3d(4%,-2%,0) rotate(2deg); } }
.water-current { border: 2px solid transparent; border-top-color: rgba(187,255,235,.5); border-radius: 50%; filter: drop-shadow(0 0 8px rgba(113,236,221,.35)); height: 48%; left: 18%; position: absolute; transform: rotate(-16deg); width: 94%; }
.water-current--one { animation: current-one 7s linear infinite; top: 24%; }
.water-current--two { animation: current-two 10s linear infinite; border-top-color: rgba(199,245,138,.36); left: 8%; top: 39%; width: 106%; }
.water-current--three { animation: current-three 13s linear infinite; border-top-color: rgba(203,255,247,.28); left: 25%; top: 53%; width: 82%; }
@keyframes current-one { from { transform: translateX(-8%) rotate(-16deg); } to { transform: translateX(8%) rotate(-16deg); } }
@keyframes current-two { from { transform: translateX(7%) rotate(-11deg); } to { transform: translateX(-7%) rotate(-11deg); } }
@keyframes current-three { from { transform: translateX(-6%) rotate(-20deg); } to { transform: translateX(10%) rotate(-20deg); } }
.water-shimmer { animation: water-shimmer 6s linear infinite; background: repeating-linear-gradient(105deg,transparent 0 8%,rgba(224,255,248,.16) 9%,transparent 11% 18%); inset: -20%; mix-blend-mode: screen; position: absolute; }
@keyframes water-shimmer { to { transform: translateX(18%); } }
.water-ripple { animation: water-ripple 4s ease-out infinite; border: 1px solid rgba(199,245,138,.58); border-radius: 50%; height: 24px; position: absolute; width: 24px; }
.water-ripple--one { left: 49%; top: 61%; }
.water-ripple--two { animation-delay: 1.8s; left: 70%; top: 35%; }
@keyframes water-ripple { 70%,100% { opacity: 0; transform: scale(8); } }
.water-glint { animation: water-glint 2.8s ease-in-out infinite; background: var(--acid); border-radius: 50%; box-shadow: 0 0 18px var(--acid); height: 6px; position: absolute; width: 6px; }
.water-glint--one { left: 50%; top: 62%; }
.water-glint--two { animation-delay: 1.2s; left: 71%; top: 36%; }
@keyframes water-glint { 50% { opacity: .45; transform: scale(1.7); } }
.water-caption { bottom: 30px; color: var(--acid); font: 500 .62rem/1.2 "Google Sans Flex","Google Sans",Arial,sans-serif; letter-spacing: .05em; position: absolute; right: 28px; }
.manifesto-index { color: rgba(255,255,255,.72); left: 28px; position: absolute; top: 88px; z-index: 3; }
.manifesto h2 { color: var(--white); left: 35%; margin: 0; max-width: 820px; position: absolute; top: 36vh; z-index: 3; }
.manifesto h2 strong { color: var(--acid); font-weight: 500; }
.manifesto-note { bottom: 48px; color: rgba(255,255,255,.92); font-size: 1.08rem; left: 28px; line-height: 1.25; max-width: 430px; position: absolute; z-index: 3; }

.section { padding: 120px 28px; }
.section-intro { display: grid; gap: 28px; grid-template-columns: minmax(160px,.65fr) minmax(450px,1.4fr) minmax(260px,.65fr); margin-bottom: 85px; }
.section-intro .kicker { align-self: start; }
.section-intro h2 { margin-bottom: 0; }
.section-intro > p:last-child { align-self: end; font-size: 1.05rem; line-height: 1.35; max-width: 360px; }
.section-intro--wide { grid-template-columns: minmax(160px,.5fr) minmax(600px,1.5fr); }
.section-intro--wide h2 { max-width: 1020px; }
.feature-cards { display: grid; gap: 20px; grid-template-columns: 1fr 1fr; }
.feature-card { border-radius: 24px; height: min(66vw, 610px); min-height: 520px; overflow: hidden; padding: 30px; position: relative; }
.feature-card img, .card-overlay { inset: 0; height: 100%; object-fit: cover; position: absolute; transition: transform 1.1s var(--ease); width: 100%; }
.feature-card:hover img { transform: scale(1.045); }
.card-overlay { background: linear-gradient(0deg, rgba(4,10,5,.82), transparent 67%); }
.card-top { align-items: center; display: flex; justify-content: space-between; position: relative; z-index: 2; }
.card-top i { align-items: center; background: var(--acid); border-radius: 50%; color: var(--ink); display: flex; font-size: 1.2rem; font-style: normal; height: 44px; justify-content: center; width: 44px; }
.feature-card h3 { bottom: 24px; margin: 0; max-width: 640px; position: absolute; z-index: 2; }
.feature-card--dark h3 { color: var(--acid); }
.feature-card--acid { background: var(--acid); color: var(--ink); }
.feature-card--acid .card-top i { background: var(--forest); color: var(--white); }
.feature-card--acid h3 { bottom: 108px; max-width: 600px; }
.feature-card--acid > p { bottom: 27px; font-size: .92rem; line-height: 1.35; margin: 0; max-width: 540px; position: absolute; z-index: 2; }
.signal-map { inset: 0; opacity: .48; position: absolute; }
.signal-map::before, .signal-map::after { border: 1px solid rgba(9,18,10,.25); border-radius: 50%; content: ""; height: 440px; left: 50%; position: absolute; top: 44%; transform: translate(-50%,-50%); width: 440px; }
.signal-map::after { height: 280px; width: 280px; }
.signal-map span { animation: pulse 2.8s ease-out infinite; background: var(--forest); border-radius: 50%; height: 8px; left: 50%; position: absolute; top: 44%; width: 8px; }
.signal-map span:nth-child(2) { left: 26%; top: 25%; }
.signal-map span:nth-child(3) { left: 78%; top: 28%; }
.signal-map span:nth-child(4) { left: 70%; top: 63%; }
@keyframes pulse { 50% { box-shadow: 0 0 0 16px rgba(15,31,16,0); transform: scale(1.4); } }

.philosophy { background: #e9e6de; color: var(--ink); padding-bottom: 0; }
.philosophy-grid { border-top: 1px solid var(--line-light); display: grid; grid-template-columns: repeat(3,1fr); margin: 0 -28px; }
.philosophy-grid article { border-right: 1px solid var(--line-light); min-height: 370px; padding: 35px 28px 55px; }
.philosophy-grid article:last-child { border-right: 0; }
.philosophy-grid span { color: #6a7169; font-size: .7rem; }
.philosophy-icon { height: 72px; margin-top: 38px; object-fit: contain; object-position: left center; transition: transform .55s var(--ease); width: 72px; }
.philosophy-grid article:hover .philosophy-icon { transform: rotate(-4deg) scale(1.06); }
.philosophy-grid h3 { margin: 40px 0 18px; }
.philosophy-grid p { font-size: 1rem; line-height: 1.3; max-width: 290px; }

.platform { min-height: 1300px; padding: 90px 28px; }
.platform-sticky { align-items: center; display: grid; gap: clamp(50px, 7vw, 120px); grid-template-columns: minmax(420px,1fr) minmax(500px,.9fr); margin: 0 auto; max-width: 1500px; min-height: calc(100svh - 140px); position: sticky; top: 70px; }
.platform-visual { height: min(73vh, 720px); overflow: hidden; position: relative; }
.platform-visual::after { background: radial-gradient(circle, transparent 30%, var(--forest) 72%); content: ""; inset: 0; position: absolute; }
.platform-visual img { height: 100%; object-fit: cover; object-position: 68% center; transition: transform 1s var(--ease), filter .6s; width: 100%; }
.platform-orbit { animation: orbit 18s linear infinite; border: 1px solid rgba(199,245,138,.28); border-radius: 50%; height: 55%; left: 48%; position: absolute; top: 24%; width: 44%; z-index: 3; }
.platform-orbit::before { background: var(--acid); border-radius: 50%; box-shadow: 0 0 20px var(--acid); content: ""; height: 7px; left: 10%; position: absolute; top: 15%; width: 7px; }
@keyframes orbit { to { transform: rotate(360deg); } }
.platform-label { bottom: 11%; color: var(--acid); font-size: .62rem; left: 10%; letter-spacing: .08em; position: absolute; z-index: 4; }
.platform-copy h2 { margin-bottom: 40px; }
.platform-steps { border-top: 1px solid var(--line-dark); }
.platform-step { align-items: start; border-bottom: 1px solid var(--line-dark); cursor: default; display: grid; gap: 22px; grid-template-columns: 32px 1fr; opacity: .35; padding: 18px 0; transition: opacity .45s, padding .45s; }
.platform-step.is-active { opacity: 1; padding: 24px 0; }
.platform-step > span { color: var(--acid); font-size: .65rem; padding-top: 5px; }
.platform-step h3 { font-size: clamp(1.25rem, 1.65vw, 1.8rem); margin: 0; }
.platform-step p { color: rgba(255,255,255,.65); display: grid; font-size: .83rem; grid-template-rows: 0fr; line-height: 1.35; margin: 0; max-width: 500px; opacity: 0; overflow: hidden; transition: grid-template-rows .5s, opacity .4s, margin .4s; }
.platform-step.is-active p { grid-template-rows: 1fr; margin-top: 10px; opacity: 1; }

.vision { overflow: hidden; }
.vision > .kicker { margin-bottom: 70px; }
.vision h2 { font-size: clamp(3.5rem, 7.3vw, 7.7rem); margin: 0 auto; max-width: 1460px; text-align: center; }
.vision-meta { align-items: end; border-top: 1px solid var(--line-light); display: flex; justify-content: space-between; margin-top: 100px; padding-top: 24px; }
.vision-meta span { color: #566057; font-size: .7rem; letter-spacing: .08em; }
.vision-meta p { font-size: 1.05rem; line-height: 1.2; margin: 0; text-align: right; }

.initiatives { border-top: 1px solid var(--line-light); }
.initiative-grid { display: grid; gap: 20px; grid-template-columns: 1fr 1fr; }
.initiative-card { border-radius: 24px; color: var(--white); height: min(66vw, 640px); min-height: 560px; overflow: hidden; position: relative; }
.initiative-card > img { height: 100%; object-fit: cover; transition: transform 1.1s var(--ease), filter .6s; width: 100%; }
.initiative-card:hover > img { transform: scale(1.04); }
.initiative-shade { background: linear-gradient(0deg, rgba(5,12,7,.88), transparent 62%), linear-gradient(180deg, rgba(5,12,7,.55), transparent 28%); inset: 0; position: absolute; }
.initiative-top { display: flex; justify-content: space-between; left: 30px; position: absolute; right: 30px; top: 28px; }
.initiative-top i { align-items: center; background: var(--acid); border-radius: 50%; color: var(--ink); display: flex; font-style: normal; height: 46px; justify-content: center; width: 46px; }
.initiative-copy { bottom: 28px; left: 30px; max-width: 600px; position: absolute; right: 30px; }
.initiative-copy h3 { margin-bottom: 18px; }
.initiative-copy p { font-size: .95rem; line-height: 1.35; max-width: 510px; }
.initiative-copy a { display: inline-flex; font-size: .72rem; font-weight: 600; gap: 16px; letter-spacing: .05em; margin-top: 12px; text-decoration: none; text-transform: none; }
.initiative-copy a span { color: var(--acid); transition: transform .3s; }
.initiative-copy a:hover span { transform: translateX(5px); }

.principles { padding: 120px 28px 150px; }
.principles-heading { display: grid; gap: 40px; grid-template-columns: .7fr 1.5fr; margin-bottom: 90px; }
.principles-heading h2 { margin: 0; }
.principle-list { list-style: none; margin: 0; padding: 0; }
.principle-list li { align-items: center; border-top: 1px solid var(--line-dark); display: grid; gap: 28px; grid-template-columns: 45px 1fr 48px; min-height: 102px; transition: background .3s, padding .3s; }
.principle-list li:last-child { border-bottom: 1px solid var(--line-dark); }
.principle-list li:hover { background: rgba(255,255,255,.03); padding-inline: 18px; }
.principle-list span { color: var(--acid); font-size: .65rem; }
.principle-list strong { font-size: clamp(1.5rem, 3vw, 3rem); font-weight: 500; letter-spacing: normal; }
.principle-list i { align-items: center; border: 1px solid var(--line-dark); border-radius: 50%; display: flex; font-style: normal; height: 44px; justify-content: center; width: 44px; }

.closing { background: var(--acid); color: var(--ink); overflow: hidden; padding: 150px 28px 70px; position: relative; text-align: center; }
.closing-grid { background-image: linear-gradient(rgba(9,18,10,.12) 1px,transparent 1px), linear-gradient(90deg,rgba(9,18,10,.12) 1px,transparent 1px); background-size: 80px 80px; inset: 0; mask-image: linear-gradient(transparent,black 36%,black 76%,transparent); position: absolute; }
.closing > *:not(.closing-grid) { position: relative; }
.closing-label { margin-bottom: 50px; }
.closing h2 { font-size: clamp(4rem, 8.6vw, 9rem); line-height: .87; margin: 0 auto 34px; max-width: 1240px; }
.closing > p:not(.closing-label) { font-size: 1.1rem; line-height: 1.35; margin: 0 auto 35px; max-width: 610px; }
.outline-button--dark { border-color: rgba(9,18,10,.4); }
.outline-button--dark i { background: var(--forest); color: var(--white); }
.outline-button--dark:hover { border-color: var(--forest); }

.site-footer { padding: 85px 28px 25px; }
.footer-top { align-items: center; display: grid; gap: 60px; grid-template-columns: 1fr 1fr 1fr; margin-bottom: 90px; }
.footer-brand { align-self: center; animation: footer-logo-float 6s ease-in-out infinite; grid-column: 2; grid-row: 1; justify-self: center; position: relative; width: min(360px,100%); }
.footer-brand::after { animation: footer-logo-signal 4.5s ease-in-out infinite; background: linear-gradient(90deg,transparent,var(--acid),transparent); bottom: -16px; content: ""; height: 1px; left: 50%; position: absolute; transform: translateX(-50%); width: 72%; }
@keyframes footer-logo-float { 0%,100% { transform: translateY(-6px) scale(1); } 50% { transform: translateY(6px) scale(1.015); } }
@keyframes footer-logo-signal { 0%,100% { opacity: .18; transform: translateX(-50%) scaleX(.3); } 50% { opacity: .9; transform: translateX(-50%) scaleX(1); } }
.footer-top > p { align-self: center; color: rgba(255,255,255,.68); font-size: 1.05rem; grid-column: 1; grid-row: 1; line-height: 1.3; }
.footer-top nav { align-self: center; display: grid; gap: 10px; grid-column: 3; grid-row: 1; justify-self: end; min-width: 170px; }
.footer-top nav a { font-size: .74rem; text-decoration: none; text-transform: none; }
.footer-bottom { border-top: 1px solid var(--line-dark); display: grid; gap: 25px; grid-template-columns: 1fr 1fr 1fr; padding-top: 22px; }
.footer-bottom a { text-decoration: none; }
.footer-bottom a:nth-child(2) { text-align: center; }
.footer-bottom a:last-child { text-align: right; }

.reveal { opacity: 0; transform: translateY(34px); transition: opacity .9s var(--ease), transform .9s var(--ease); }
.reveal.is-visible { opacity: 1; transform: none; }

@media (max-width: 1050px) {
  .site-header { grid-template-columns: 1fr auto 1fr; }
  .desktop-nav { gap: 20px; }
  .section-intro { grid-template-columns: 155px 1fr; }
  .section-intro > p:last-child { grid-column: 2; }
  .platform-sticky { gap: 35px; grid-template-columns: .8fr 1.2fr; }
  .platform-visual { height: 620px; }
}

@media (max-width: 820px) {
  :root { --shell: calc(100vw - 40px); }
  .site-header { grid-template-columns: 1fr auto 1fr; height: 78px; left: 0; padding-inline: 20px; right: 0; }
  .site-header.is-scrolled { height: 64px; padding-inline: 20px; }
  .brand { width: 145px; }
  .desktop-nav, .header-cta { display: none; }
  .menu-toggle { align-items: center; background: transparent; border: 1px solid rgba(255,255,255,.28); border-radius: 50%; display: flex; flex-direction: column; gap: 5px; grid-column: 3; grid-row: 1; height: 44px; justify-content: center; justify-self: end; padding: 0; width: 44px; }
  .menu-toggle > span { background: var(--white); height: 1px; transition: transform .3s; width: 18px; }
  .menu-toggle[aria-expanded="true"] > span:first-child { transform: translateY(3px) rotate(45deg); }
  .menu-toggle[aria-expanded="true"] > span:nth-child(2) { transform: translateY(-3px) rotate(-45deg); }
  .mobile-menu { background: var(--forest-deep); display: block; height: 100svh; inset: 0; padding: 110px 20px 40px; position: fixed; z-index: -1; }
  .mobile-menu nav { display: flex; flex-direction: column; }
  .mobile-menu a { align-items: baseline; border-top: 1px solid var(--line-dark); display: flex; font-family: "Google Sans Flex","Google Sans",Arial,sans-serif; font-size: clamp(2.2rem,10vw,4.5rem); gap: 22px; letter-spacing: normal; padding: 16px 0; text-decoration: none; }
  .mobile-menu a:last-child { border-bottom: 1px solid var(--line-dark); }
  .mobile-menu a span { color: var(--acid); font-size: .65rem; letter-spacing: 0; }
  .hero { min-height: 740px; }
  .hero-copy { left: 20px; right: 20px; top: 18%; }
  .hero h1 { font-size: clamp(3.25rem,10vw,5rem); max-width: 740px; }
  .hero-visual > img { object-position: 63% center; opacity: .8; }
  .hero-fragment { background-position: 63% center; }
  .hero-fragment--top, .hero-fragment--right { display: none; }
  .hero-fragment--left { clip-path: polygon(7% 66%,42% 66%,42% 100%,7% 100%); transform-origin: 24% 86%; }
  .hero-intro { bottom: 34px; left: 20px; max-width: calc(100% - 40px); }
  .scroll-cue { display: none; }
  .target, .data-tag { display: none; }
  .manifesto h2 { left: 20px; right: 20px; top: 34vh; }
  .manifesto-index { left: 20px; }
  .manifesto-note { left: 20px; }
  .section { padding: 90px 20px; }
  .section-intro, .section-intro--wide { gap: 20px; grid-template-columns: 1fr; margin-bottom: 55px; }
  .section-intro > p:last-child { grid-column: 1; }
  .feature-cards, .initiative-grid { grid-template-columns: 1fr; }
  .feature-card, .initiative-card { height: 640px; }
  .philosophy-grid { grid-template-columns: 1fr; margin-inline: -20px; }
  .philosophy-grid article { border-bottom: 1px solid var(--line-light); border-right: 0; min-height: 280px; padding-inline: 20px; }
  .philosophy-icon { height: 64px; margin-top: 36px; width: 64px; }
  .philosophy-grid h3 { margin-top: 32px; }
  .platform { min-height: 0; padding: 90px 20px; }
  .platform-sticky { display: block; min-height: 0; position: static; }
  .platform-visual { height: 480px; margin-bottom: 45px; }
  .platform-step { opacity: .72; }
  .platform-step p { display: block; grid-template-rows: 1fr; margin-top: 8px; opacity: 1; }
  .vision-meta { align-items: start; gap: 25px; }
  .principles { padding-inline: 20px; }
  .principles-heading { grid-template-columns: 1fr; }
  .closing { padding-inline: 20px; }
  .footer-top { grid-template-columns: 1fr; text-align: center; }
  .footer-brand { grid-column: 1; grid-row: 1; }
  .footer-top > p { grid-column: 1; grid-row: 2; }
  .footer-top nav { grid-column: 1; grid-row: 3; justify-self: center; }
  .footer-bottom { grid-template-columns: 1fr 1fr 1fr; }
  .footer-bottom a:last-child { text-align: right; }
}

@media (max-width: 520px) {
  h1 { font-size: 3.2rem; }
  h2 { font-size: 2.9rem; }
  .hero-copy { top: 15%; }
  .hero h1 { font-size: clamp(3rem,13.5vw,4rem); }
  .hero-kicker { margin-bottom: 18px; }
  .hero-intro { font-size: .98rem; }
  .hero-visual > img { object-position: 69% center; }
  .hero-fragment { background-position: 69% center; }
  .manifesto { height: 145vh; }
  .manifesto h2 { font-size: 2.8rem; }
  .manifesto-note { bottom: 28px; right: 20px; }
  .feature-card, .initiative-card { border-radius: 18px; height: 540px; min-height: 0; padding: 22px; }
  .feature-card--acid h3 { bottom: 130px; }
  .initiative-top { left: 22px; right: 22px; }
  .initiative-copy { bottom: 22px; left: 22px; right: 22px; }
  .platform-visual { height: 360px; }
  .vision h2 { font-size: 3.25rem; }
  .vision-meta { align-items: start; flex-direction: column; }
  .vision-meta p { text-align: left; }
  .principle-list li { gap: 15px; grid-template-columns: 30px 1fr; min-height: 90px; }
  .principle-list i { display: none; }
  .closing h2 { font-size: 4rem; }
  .footer-top, .footer-bottom { grid-template-columns: 1fr; }
  .footer-top nav { grid-column: 1; grid-row: auto; justify-self: center; }
  .footer-bottom, .footer-bottom a, .footer-bottom a:last-child { text-align: center; }
  .site-footer { padding-inline: 20px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: .01ms !important; }
  .reveal, .hero h1 span { opacity: 1; transform: none; }
}
