:root {
  --forest: #0f1f10;
  --forest-deep: #07130b;
  --ink: #0a0d0a;
  --paper: #f4f4ef;
  --white: #fff;
  --acid: #c7f58a;
  --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 { transform: translateY(3px); }
.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; font-weight: 400; gap: 16px; margin-bottom: 30px; text-transform: uppercase; }
.kicker span { color: var(--acid); }
.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; }
.hero .target { border-color: #b7e059; opacity: .64; }
.hero .target::before, .hero .target::after { background: #b7e059; }
.hero .target span { border-color: #b7e059; }
.target--one { left: 42.5%; top: 49%; }
.target--two { right: calc(20% - 100px); top: 28%; transform: scale(.65); }
.cursor-follower { border-color: #b7e059; display: none; height: 22px; left: 0; opacity: 0; pointer-events: none; position: fixed; right: auto; top: 0; transform: translate3d(-100px,-100px,0) translate(-50%,-50%); transition: opacity .2s; width: 22px; will-change: transform; z-index: 95; }
.cursor-follower::before, .cursor-follower::after { background: #b7e059; }
.cursor-follower span { border-color: #b7e059; inset: 5px; }
.cursor-follower.is-visible { opacity: .64; }
.cursor-coordinates { background: transparent; color: #b7e059; font: 500 .44rem/1.25 "Google Sans Flex","Google Sans",Arial,sans-serif; font-variant-numeric: tabular-nums; left: 27px; letter-spacing: .035em; padding: 0; position: absolute; top: 25px; white-space: pre; }
.data-tag { background: transparent; color: #b7e059; font: 500 .44rem/1.25 "Google Sans Flex", "Google Sans", Arial, sans-serif; font-variant-numeric: tabular-nums; letter-spacing: .035em; margin: 0; padding: 0; position: absolute; z-index: 2; }
.data-tag--one { left: 42.5%; top: calc(49% + 101px); }
.data-tag--two { right: calc(19.5% - 100px); 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: 1px solid transparent; border-top-color: rgba(183,224,89,.72); border-radius: 50%; height: 48%; left: -12%; position: absolute; transform: rotate(-16deg); width: 124%; }
.water-current--one { animation: current-one 7s linear infinite; top: 24%; }
.water-current--two { animation: current-two 10s linear infinite; top: 39%; }
.water-current--three { animation: current-three 13s linear infinite; top: 53%; }
@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; transform-origin: left center; transition: transform .55s var(--ease); width: 72px; }
.philosophy-grid article:hover .philosophy-icon { transform: scale(1.6); }
.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 { border-top: 1px solid var(--line-dark); }
.principle-list li:last-child { border-bottom: 1px solid var(--line-dark); }
.principle-summary { -webkit-appearance: none; -webkit-tap-highlight-color: transparent; align-items: center; background: transparent; border: 0; color: inherit; cursor: pointer; display: grid; gap: 28px; grid-template-columns: 45px minmax(0,1fr) 48px; min-height: 102px; padding: 0; text-align: left; touch-action: manipulation; transition: background .3s, padding .3s; width: 100%; }
.principle-summary:hover, .principle-summary:focus-visible { background: rgba(255,255,255,.03); padding-inline: 18px; }
.principle-summary:focus-visible { outline: 2px solid var(--acid); outline-offset: -2px; }
.principle-number { color: var(--acid); font-size: .65rem; }
.principle-list strong { font-size: clamp(1.5rem, 3vw, 3rem); font-weight: 500; letter-spacing: normal; min-width: 0; }
.principle-toggle { border: 1px solid var(--line-dark); border-radius: 50%; height: 44px; position: relative; width: 44px; }
.principle-toggle::before, .principle-toggle::after { background: var(--acid); content: ""; left: 50%; position: absolute; top: 50%; transform: translate(-50%,-50%); transition: transform .3s var(--ease); }
.principle-toggle::before { height: 1px; width: 14px; }
.principle-toggle::after { height: 14px; width: 1px; }
.principle-item.is-open .principle-toggle::after { transform: translate(-50%,-50%) scaleY(0); }
.principle-panel p { color: rgba(255,255,255,.72); font-size: 1rem; line-height: 1.5; margin: 0 76px 34px 73px; max-width: 720px; }

.closing { background: var(--acid); color: var(--ink); overflow: hidden; padding: 150px 28px 70px; position: relative; text-align: center; }
.closing-grid { animation: topo-art-drift 18s ease-in-out infinite alternate; background: url("../img/lionstraits-topo-map-v3.webp") center 60%/cover no-repeat; inset: -4%; opacity: .82; pointer-events: none; position: absolute; transform: scale(1.02); }
.closing-grid::after { background: radial-gradient(ellipse at 50% 50%,rgba(199,245,138,.48) 0 25%,rgba(199,245,138,.16) 52%,transparent 76%); content: ""; inset: 0; position: absolute; }
@keyframes topo-art-drift { to { background-position: 53% 57%; transform: scale(1.055); } }
.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); }

.contact-section { background: var(--forest) url("../img/lionstraits-contact-passage.webp") center/cover no-repeat; color: var(--white); isolation: isolate; overflow: hidden; padding: 120px 28px; position: relative; }
.contact-section::before { background: rgba(7,19,11,.34); content: ""; inset: 0; pointer-events: none; position: absolute; z-index: 0; }
.contact-shell { display: grid; gap: clamp(84px,10vw,160px); grid-template-columns: minmax(0,.85fr) minmax(0,1fr); margin: 0 auto; max-width: 1400px; position: relative; z-index: 1; }
.contact-copy, .contact-form { min-width: 0; }
.contact-copy h2 { font-size: clamp(3.5rem,5.5vw,6.2rem); line-height: .92; margin-bottom: 30px; max-width: 660px; overflow-wrap: break-word; }
.contact-copy > p:not(.kicker) { color: rgba(255,255,255,.78); font-size: 1.05rem; line-height: 1.45; max-width: 500px; }
.company-details { color: rgba(255,255,255,.68); display: grid; font-size: .72rem; font-style: normal; gap: 8px; line-height: 1.5; margin-top: 48px; }
.company-details strong { color: var(--white); font-size: .76rem; font-weight: 600; letter-spacing: .04em; }
.company-details a { justify-self: start; text-decoration: none; }
.company-details a:hover { color: var(--acid); }
.contact-form { backdrop-filter: blur(10px) saturate(.85); background: rgba(7,19,11,.56); border: 1px solid rgba(255,255,255,.26); border-radius: 24px; display: grid; gap: 28px 30px; grid-template-columns: 1fr 1fr; padding: clamp(28px,4vw,52px); position: relative; }
.form-honeypot { height: 1px; left: -10000px; overflow: hidden; position: absolute; top: auto; width: 1px; }
.form-field { display: grid; gap: 10px; }
.form-field--wide { grid-column: 1 / -1; }
.form-field label { font-size: .7rem; font-weight: 600; letter-spacing: .04em; }
.form-field input, .form-field textarea { appearance: none; background: rgba(255,255,255,.035); border: 0; border-bottom: 1px solid rgba(255,255,255,.38); border-radius: 0; color: var(--white); font: inherit; min-width: 0; outline: 0; padding: 12px 0; transition: background .25s,border-color .25s; width: 100%; }
.form-field textarea { line-height: 1.45; min-height: 132px; resize: vertical; }
.form-field input:focus, .form-field textarea:focus { background: rgba(255,255,255,.065); border-color: var(--acid); }
.form-field input:-webkit-autofill, .form-field input:-webkit-autofill:hover, .form-field input:-webkit-autofill:focus { -webkit-text-fill-color: var(--white); box-shadow: 0 0 0 1000px var(--forest-deep) inset; }
.form-actions { align-items: center; display: flex; gap: 24px; grid-column: 1 / -1; justify-content: space-between; }
.form-actions button { align-items: center; background: var(--acid); border: 1px solid var(--acid); color: var(--ink); cursor: pointer; display: inline-flex; font-size: .72rem; font-weight: 700; gap: 24px; justify-content: space-between; min-height: 54px; padding: 12px 16px; transition: background .25s,border-color .25s,transform .25s; }
.form-actions button:hover { background: var(--white); border-color: var(--white); transform: translateY(-2px); }
.form-actions button:focus-visible { outline-color: var(--white); }
.form-actions button span { font-size: 1rem; }
.form-status { font-size: .76rem; line-height: 1.4; margin: 0; max-width: 340px; }
.form-status.is-success { color: var(--acid); }
.form-status.is-error { color: var(--white); }

.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; 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: -28px; content: ""; height: 1px; left: 50%; position: absolute; transform: translateX(-50%); width: 72%; }
@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; font-size: .504rem; font-weight: 400; gap: 25px; grid-template-columns: 1fr 1fr; padding-top: 22px; }
.footer-slogan { color: #b7e059; }
.footer-bottom > :last-child { text-align: right; }
.footer-bottom strong { font-weight: 700; }

.back-to-top { -webkit-tap-highlight-color: transparent; align-items: center; background: var(--acid); border: 0; border-radius: 50%; bottom: calc(56px + env(safe-area-inset-bottom)); box-shadow: 0 10px 30px rgba(4,10,5,.24); color: var(--ink); cursor: pointer; display: flex; height: 56px; justify-content: center; min-height: 56px; opacity: 0; padding: 0; pointer-events: none; position: fixed; right: calc(28px + env(safe-area-inset-right)); text-decoration: none; touch-action: manipulation; transform: translateY(16px); transition: opacity .3s, transform .3s, background .3s; visibility: hidden; width: 56px; z-index: 90; }
.back-to-top span { color: var(--ink); font-size: 1.35rem; line-height: 1; }
.back-to-top.is-visible { opacity: 1; pointer-events: auto; transform: none; visibility: visible; }
.back-to-top:hover { background: var(--white); }
.back-to-top:focus-visible { outline: 2px solid var(--white); outline-offset: 3px; }

.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; }
  .principles { padding: 100px 40px 120px; }
  .principles-heading { gap: 18px; grid-template-columns: 1fr; margin-bottom: 58px; max-width: 780px; }
  .principle-summary { gap: 20px; grid-template-columns: 40px minmax(0,1fr) 44px; }
  .principle-summary:hover { padding-inline: 0; }
  .principle-list strong { font-size: clamp(1.6rem,4vw,2.6rem); line-height: 1.05; }
  .principle-panel p { margin-inline: 60px 64px; max-width: 680px; }
  .contact-shell { gap: 56px; grid-template-columns: 1fr; max-width: 800px; }
  .contact-copy > p:not(.kicker) { max-width: 580px; }
  .back-to-top { bottom: calc(40px + env(safe-area-inset-bottom)); opacity: 1; pointer-events: auto; right: calc(24px + env(safe-area-inset-right)); transform: none; visibility: visible; }
}

@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: 90px 20px 110px; }
  .principle-summary { gap: 16px; grid-template-columns: 34px minmax(0,1fr) 42px; }
  .principle-panel p { margin-inline: 50px 58px; }
  .closing { padding-inline: 20px; }
  .contact-section { background-position: 58% center; padding: 90px 20px; }
  .form-actions { justify-content: flex-start; }
  .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; }
}

@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-summary { gap: 12px; grid-template-columns: 26px minmax(0,1fr) 38px; min-height: 90px; }
  .principle-toggle { height: 38px; width: 38px; }
  .principle-panel p { margin-inline: 38px 0; }
  .closing h2 { font-size: 4rem; }
  .contact-section { background-position: 70% center; }
  .contact-copy h2 { font-size: 3.6rem; }
  .company-details { margin-top: 36px; }
  .contact-form { border-radius: 18px; gap: 24px; grid-template-columns: 1fr; padding: 26px 20px; }
  .form-field, .form-field--wide { grid-column: 1; }
  .form-actions { align-items: flex-start; flex-direction: column; }
  .form-actions button { min-width: 190px; }
  .footer-top, .footer-bottom { grid-template-columns: 1fr; }
  .footer-top nav { grid-column: 1; grid-row: auto; justify-self: center; }
  .footer-bottom { font-size: .72rem; }
  .footer-bottom, .footer-bottom > * { text-align: center; }
  .footer-bottom > .footer-legal { font-size: .58rem; justify-self: center; text-align: center; width: 100%; }
  .site-footer { padding-inline: 20px; }
  .back-to-top { bottom: calc(20px + env(safe-area-inset-bottom)); right: calc(16px + env(safe-area-inset-right)); }
}

@media (hover: hover) and (pointer: fine) and (min-width: 821px) {
  .cursor-follower { display: block; }
}

@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; }
}