:root {
  --ink: #0d100d;
  --ink-soft: #141a15;
  --forest: #1b2a20;
  --moss: #425344;
  --acid: #d8ff38;
  --paper: #e9e2d4;
  --bone: #f7f2e8;
  --orange: #ed7440;
  --line: rgba(247, 242, 232, .17);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--ink);
  color: var(--bone);
  font-family: Arial, Helvetica, sans-serif;
  overflow-x: hidden;
}
button, a { font: inherit; }
button { color: inherit; }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
.shell { width: min(1400px, calc(100% - 48px)); margin-inline: auto; }
.section { padding-block: clamp(92px, 11vw, 170px); }
.section-kicker {
  display: flex; align-items: center; gap: 14px;
  color: rgba(247, 242, 232, .58);
  font-size: 10px; font-weight: 800; letter-spacing: .2em; text-transform: uppercase;
}
.section-kicker span {
  display: grid; place-items: center; width: 30px; aspect-ratio: 1;
  border: 1px solid currentColor; border-radius: 50%; color: var(--orange);
}
.section-kicker.light { color: rgba(13, 16, 13, .58); }

.hero {
  min-height: 100svh;
  overflow: hidden;
  position: relative;
  background:
    radial-gradient(circle at 79% 43%, rgba(216,255,56,.13), transparent 29%),
    repeating-linear-gradient(112deg, transparent 0 70px, rgba(255,255,255,.017) 71px 72px),
    var(--ink);
  border-bottom: 1px solid var(--line);
}
.hero::before {
  content: '';
  position: absolute; inset: 0; pointer-events: none;
  opacity: .18;
  background: repeating-radial-gradient(circle at 20% 30%, rgba(255,255,255,.08) 0 1px, transparent 1px 4px);
  mix-blend-mode: soft-light;
}
.hero::after {
  content: 'GT / 001';
  position: absolute; left: -26px; bottom: 180px;
  color: rgba(247,242,232,.04); font: 900 clamp(130px, 20vw, 330px)/.8 Arial;
  letter-spacing: -.11em; pointer-events: none; white-space: nowrap;
}
.site-header {
  height: 92px;
  display: grid; grid-template-columns: 1fr auto 1fr; align-items: center;
  position: relative; z-index: 10; border-bottom: 1px solid var(--line);
}
.brand { display: inline-flex; align-items: center; gap: 12px; width: max-content; }
.brand > img { width: 43px; height: 43px; border-radius: 50%; }
.brand-copy { display: grid; gap: 3px; }
.brand-copy strong { font-size: 13px; letter-spacing: .09em; }
.brand-copy small { color: rgba(247,242,232,.43); font-size: 8px; letter-spacing: .18em; text-transform: uppercase; }
nav { display: flex; gap: 34px; color: rgba(247,242,232,.62); font-size: 10px; letter-spacing: .14em; text-transform: uppercase; }
nav a { position: relative; padding-block: 10px; }
nav a::after { content: ''; position: absolute; left: 0; right: 100%; bottom: 4px; height: 1px; background: var(--acid); transition: right .25s ease; }
nav a:hover { color: var(--acid); }
nav a:hover::after { right: 0; }
.header-actions { justify-self: end; display: flex; gap: 8px; }
.header-actions button {
  width: 38px; aspect-ratio: 1; border-radius: 50%; border: 1px solid var(--line);
  background: transparent; cursor: pointer; font-size: 10px; font-weight: 800;
  transition: background .2s ease, color .2s ease, transform .2s ease;
}
.header-actions button:hover { background: var(--acid); color: var(--ink); transform: rotate(-7deg); }

.hero-grid {
  position: relative; z-index: 2;
  display: grid; grid-template-columns: minmax(0, 1.14fr) minmax(420px, .86fr);
  align-items: center; gap: 30px;
  min-height: calc(100svh - 168px); padding-block: 42px 62px;
}
.hero-copy { position: relative; z-index: 4; }
.eyebrow { display: flex; align-items: center; gap: 12px; color: var(--acid); font-size: 10px; font-weight: 800; letter-spacing: .21em; }
.eyebrow span { width: 36px; height: 1px; background: currentColor; }
h1 { margin: 22px 0 28px; max-width: 950px; font: 900 clamp(60px, 7.4vw, 122px)/.81 Arial, sans-serif; letter-spacing: -.08em; text-transform: uppercase; }
h1 em { color: var(--acid); font-family: Georgia, serif; font-weight: 400; letter-spacing: -.06em; text-transform: none; }
.hero-lede { max-width: 660px; color: rgba(247,242,232,.72); font-size: clamp(15px, 1.28vw, 19px); line-height: 1.62; }
.hero-chinese { margin: 19px 0 0; color: rgba(247,242,232,.43); font: 400 14px/1.5 Georgia, serif; letter-spacing: .08em; }
.hero-actions-row { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 32px; }
.button {
  min-height: 50px; display: inline-flex; align-items: center; justify-content: center; gap: 18px;
  padding: 0 22px; border: 1px solid rgba(247,242,232,.3); background: transparent;
  cursor: pointer; font-size: 10px; font-weight: 900; letter-spacing: .14em; text-transform: uppercase;
  transition: transform .2s ease, background .2s ease, border-color .2s ease, color .2s ease;
}
.button:hover { transform: translateY(-3px); }
.button-primary { background: var(--acid); border-color: var(--acid); color: var(--ink); }
.button-ghost:hover { border-color: var(--acid); color: var(--acid); }
.button-dark { background: var(--ink); border-color: var(--ink); color: var(--bone); }
.prelaunch-note { margin-top: 23px; display: flex; align-items: flex-start; gap: 10px; max-width: 590px; color: rgba(247,242,232,.42); font-size: 10px; line-height: 1.5; letter-spacing: .03em; }
.prelaunch-note i { flex: 0 0 auto; width: 6px; aspect-ratio: 1; margin-top: 4px; border-radius: 50%; background: var(--orange); box-shadow: 0 0 12px var(--orange); }

.hero-art {
  --hero-x: 0px; --hero-y: 0px;
  min-height: 620px; position: relative; align-self: stretch;
  display: grid; place-items: end center;
  transform: translate3d(var(--hero-x), var(--hero-y), 0);
  transition: transform .45s cubic-bezier(.2,.8,.2,1);
}
.hero-art::before {
  content: ''; position: absolute; width: min(85%, 590px); aspect-ratio: 1; bottom: 5%; border-radius: 50%;
  background: radial-gradient(circle at 50% 42%, #566a55 0, #26372b 58%, #17201a 100%);
  box-shadow: 0 0 0 1px rgba(216,255,56,.22), inset 0 0 120px rgba(0,0,0,.42), 0 40px 90px rgba(0,0,0,.45);
}
.hero-art::after {
  content: ''; position: absolute; width: 80%; height: 17%; bottom: 1%; border-radius: 50%;
  background: rgba(0,0,0,.72); filter: blur(30px);
}
.hero-art > img { width: min(105%, 680px); position: relative; z-index: 3; filter: contrast(1.04) saturate(.88); }
.orbit { position: absolute; z-index: 1; border: 1px solid rgba(216,255,56,.22); border-radius: 50%; }
.orbit::before, .orbit::after { content: ''; position: absolute; width: 6px; aspect-ratio: 1; border-radius: 50%; background: var(--acid); box-shadow: 0 0 15px var(--acid); }
.orbit-a { width: 94%; aspect-ratio: 1; bottom: -1%; animation: rotate 28s linear infinite; }
.orbit-a::before { top: 22%; left: 3%; }
.orbit-a::after { bottom: 12%; right: 9%; }
.orbit-b { width: 67%; aspect-ratio: 1; bottom: 13%; border-style: dashed; animation: rotate 22s linear infinite reverse; }
.orbit-b::before { top: 1%; left: 45%; }
.orbit-b::after { display: none; }
@keyframes rotate { to { transform: rotate(360deg); } }
.serial { position: absolute; z-index: 4; color: rgba(247,242,232,.45); font-size: 8px; letter-spacing: .18em; }
.serial-top { top: 6%; right: 2%; writing-mode: vertical-rl; }
.camera-card { position: absolute; z-index: 5; right: 0; bottom: 17%; display: grid; gap: 6px; padding: 12px 14px; border-right: 2px solid var(--acid); background: rgba(13,16,13,.7); text-align: right; backdrop-filter: blur(8px); }
.camera-card span { color: rgba(247,242,232,.48); font-size: 8px; letter-spacing: .16em; }
.camera-card strong { color: var(--acid); font-size: 9px; letter-spacing: .12em; }
.hero-paw { position: absolute; z-index: 2; left: 5%; top: 18%; transform: rotate(-22deg) scale(.75); opacity: .3; }

.contract-rail { height: 76px; position: relative; z-index: 4; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 18px; border-top: 1px solid var(--line); }
.rail-label { color: var(--acid); font-size: 10px; font-weight: 900; letter-spacing: .16em; }
.contract-rail code { overflow: hidden; color: rgba(247,242,232,.58); font-size: 10px; letter-spacing: .12em; text-overflow: ellipsis; white-space: nowrap; }
.contract-rail button { display: flex; align-items: center; gap: 12px; border: 0; background: transparent; color: rgba(247,242,232,.53); cursor: pointer; font-size: 9px; letter-spacing: .14em; text-transform: uppercase; }
.contract-rail button:hover { color: var(--acid); }

.signal-ticker { overflow: hidden; background: var(--acid); color: var(--ink); border-bottom: 1px solid var(--ink); }
.signal-ticker > div { width: max-content; display: flex; align-items: center; height: 58px; animation: ticker 30s linear infinite; }
.signal-ticker span:not(.pawprint) { margin-inline: 30px; font-size: 10px; font-weight: 900; letter-spacing: .17em; }
.signal-ticker .pawprint { transform: scale(.24); width: 48px; margin: -28px; }
@keyframes ticker { to { transform: translateX(-50%); } }

.mission { position: relative; }
.mission-grid { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(330px, .75fr); gap: clamp(50px, 10vw, 160px); align-items: start; margin-top: 48px; }
.mission h2 { margin: 0; max-width: 880px; color: var(--paper); font: 400 clamp(54px, 7.1vw, 108px)/.91 Georgia, serif; letter-spacing: -.06em; }
.mission-copy { border-top: 1px solid var(--line); padding-top: 24px; }
.mission-copy p { margin: 0 0 22px; color: rgba(247,242,232,.58); font-size: 14px; line-height: 1.75; }
.mission-copy .mission-lead { color: var(--acid); font: 400 25px/1.26 Georgia, serif; letter-spacing: -.025em; }
.mission-copy strong { color: var(--bone); }
.mission-stamp { position: absolute; right: 0; bottom: 50px; width: 150px; aspect-ratio: 1; display: grid; place-items: center; border: 1px dashed rgba(216,255,56,.35); border-radius: 50%; transform: rotate(10deg); }
.mission-stamp img { width: 56px; border-radius: 50%; }
.mission-stamp span { position: absolute; color: rgba(216,255,56,.6); font-size: 7px; line-height: 1.5; letter-spacing: .16em; text-align: center; transform: translateY(48px); }

.impact { background: var(--paper); color: var(--ink); }
.impact-heading { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 60px; align-items: end; margin-top: 46px; }
.impact-heading h2 { margin: 0; font: 400 clamp(53px, 6.7vw, 102px)/.9 Georgia, serif; letter-spacing: -.06em; }
.impact-heading > p { margin: 0 0 8px; color: rgba(13,16,13,.6); font-size: 14px; line-height: 1.65; }
.impact-console { display: grid; grid-template-columns: minmax(280px, .65fr) minmax(0, 1.35fr); margin-top: 70px; border: 1px solid rgba(13,16,13,.3); }
.impact-tabs { display: grid; border-right: 1px solid rgba(13,16,13,.3); }
.impact-tabs button { display: grid; grid-template-columns: 44px 1fr; align-items: center; min-height: 90px; padding: 0 25px; border: 0; border-bottom: 1px solid rgba(13,16,13,.2); background: transparent; color: rgba(13,16,13,.42); cursor: pointer; text-align: left; transition: background .2s ease, color .2s ease; }
.impact-tabs button:last-child { border-bottom: 0; }
.impact-tabs button:hover, .impact-tabs button.active { background: var(--ink); color: var(--bone); }
.impact-tabs button span { font-size: 9px; letter-spacing: .15em; }
.impact-tabs button strong { font: 400 24px/1 Georgia, serif; letter-spacing: -.03em; }
.impact-readout { min-height: 360px; display: flex; flex-direction: column; padding: clamp(34px, 5vw, 74px); background: var(--acid); }
.readout-top { display: flex; align-items: center; justify-content: space-between; color: rgba(13,16,13,.52); font-size: 9px; font-weight: 800; letter-spacing: .16em; }
.readout-top i { width: 8px; aspect-ratio: 1; border-radius: 50%; background: var(--orange); box-shadow: 0 0 13px var(--orange); }
.readout-tag { margin: auto 0 8px; font-size: 10px; font-weight: 900; letter-spacing: .16em; text-transform: uppercase; }
.impact-readout h3 { margin: 0 0 15px; font: 400 clamp(46px, 5vw, 82px)/.9 Georgia, serif; letter-spacing: -.06em; }
.impact-readout > p:last-of-type { max-width: 690px; margin: 0; color: rgba(13,16,13,.67); font-size: 14px; line-height: 1.65; }
.readout-line { height: 4px; margin-top: 34px; background: rgba(13,16,13,.17); }
.readout-line span { display: block; height: 100%; background: var(--ink); transition: width .35s ease; }

.field { padding-bottom: 0; }
.field-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 34px; }
.field-head > p { color: rgba(247,242,232,.42); font-size: 9px; letter-spacing: .14em; text-transform: uppercase; }
.field-scanner {
  --scan-x: 50%; --scan-y: 50%;
  min-height: min(74vw, 780px); position: relative; overflow: hidden;
  background: url('assets/amur-forest.png') center/cover no-repeat;
  border: 1px solid rgba(247,242,232,.18);
  cursor: crosshair; isolation: isolate;
}
.field-scanner::before { content: ''; position: absolute; inset: 0; background: rgba(5,9,7,.66); z-index: 1; }
.scan-light { position: absolute; inset: 0; z-index: 2; pointer-events: none; background: radial-gradient(circle 180px at var(--scan-x) var(--scan-y), transparent 0 52%, rgba(5,9,7,.16) 70%, rgba(5,9,7,.9) 100%); }
.scan-light::after { content: ''; position: absolute; width: 360px; height: 360px; left: calc(var(--scan-x) - 180px); top: calc(var(--scan-y) - 180px); border: 1px solid rgba(216,255,56,.42); border-radius: 50%; box-shadow: 0 0 80px rgba(216,255,56,.08); }
.scan-grid { position: absolute; inset: 0; z-index: 3; opacity: .14; pointer-events: none; background: repeating-linear-gradient(90deg, transparent 0 calc(12.5% - 1px), rgba(247,242,232,.4) calc(12.5% - 1px) 12.5%), repeating-linear-gradient(0deg, transparent 0 calc(16.666% - 1px), rgba(247,242,232,.4) calc(16.666% - 1px) 16.666%); }
.scan-cursor { position: absolute; z-index: 7; left: var(--scan-x); top: var(--scan-y); display: grid; place-items: center; transform: translate(-50%,-50%); pointer-events: none; }
.scan-cursor i { width: 8px; aspect-ratio: 1; border-radius: 50%; background: var(--acid); box-shadow: 0 0 18px var(--acid); }
.scan-cursor span { margin-top: 8px; color: var(--acid); font-size: 7px; letter-spacing: .18em; }
.field-label { position: absolute; z-index: 5; display: grid; gap: 5px; padding: 12px 14px; border-left: 1px solid var(--acid); background: rgba(8,12,9,.76); backdrop-filter: blur(7px); }
.field-label span { color: rgba(247,242,232,.43); font-size: 7px; letter-spacing: .18em; }
.field-label strong { color: var(--bone); font-size: 10px; letter-spacing: .1em; }
.label-a { left: 6%; top: 16%; }
.label-b { right: 7%; top: 25%; }
.label-c { left: 12%; bottom: 11%; max-width: 320px; }
.field-scanner .pawprint { position: absolute; z-index: 5; opacity: .72; }
.paw-one { left: 25%; top: 38%; transform: rotate(-18deg) scale(.8); }
.paw-two { left: 47%; top: 54%; transform: rotate(13deg) scale(.62); }
.paw-three { right: 18%; bottom: 17%; transform: rotate(28deg) scale(.48); }

.pawprint { width: 72px; height: 78px; position: relative; display: inline-block; color: var(--acid); }
.pawprint i, .pawprint b { position: absolute; display: block; background: currentColor; }
.pawprint i { width: 17px; height: 24px; border-radius: 50%; }
.pawprint i:nth-child(1) { left: 4px; top: 20px; transform: rotate(-28deg); }
.pawprint i:nth-child(2) { left: 19px; top: 4px; transform: rotate(-10deg); }
.pawprint i:nth-child(3) { right: 18px; top: 3px; transform: rotate(10deg); }
.pawprint i:nth-child(4) { right: 2px; top: 19px; transform: rotate(28deg); }
.pawprint b { width: 48px; height: 40px; left: 12px; bottom: 2px; border-radius: 50% 50% 42% 42%; }

.proof { padding-top: 120px; }
.proof-grid { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 48px; border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.proof-grid article { min-height: 330px; display: flex; flex-direction: column; padding: 32px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.proof-grid article > span { color: var(--orange); font-size: 9px; letter-spacing: .16em; }
.proof-grid h3 { margin: auto 0 16px; color: var(--acid); font: 400 43px/1 Georgia, serif; letter-spacing: -.04em; }
.proof-grid p { margin: 0; color: rgba(247,242,232,.52); font-size: 13px; line-height: 1.65; }

.final-cta { min-height: 650px; position: relative; overflow: hidden; display: grid; align-items: center; background: var(--acid); color: var(--ink); }
.final-cta::before { content: '001'; position: absolute; right: -2vw; bottom: -10vw; color: rgba(13,16,13,.08); font: 900 40vw/.7 Arial; letter-spacing: -.12em; }
.final-grid { position: relative; z-index: 3; display: grid; grid-template-columns: 1fr 290px; gap: 80px; align-items: end; }
.final-grid > div:first-child p { margin: 0 0 16px; font-size: 11px; font-weight: 900; line-height: 1.45; letter-spacing: .16em; }
.final-grid h2 { margin: 0; font: 400 clamp(70px, 11vw, 176px)/.78 Georgia, serif; letter-spacing: -.075em; }
.cta-actions { display: grid; gap: 9px; }
.cta-actions .button { width: 100%; }
.final-cta > img { position: absolute; z-index: 2; width: min(48vw, 680px); right: 21%; bottom: -34%; filter: grayscale(1) contrast(1.35); opacity: .16; }

footer { min-height: 180px; display: grid; grid-template-columns: auto 1fr auto; gap: 44px; align-items: center; color: rgba(247,242,232,.45); }
.footer-brand { display: flex; align-items: center; gap: 10px; color: var(--bone); font-size: 10px; letter-spacing: .11em; }
.footer-brand img { width: 34px; border-radius: 50%; }
.footer-brand span { color: var(--acid); }
footer > p { max-width: 720px; margin: 0; font-size: 9px; line-height: 1.6; letter-spacing: .02em; }
footer > a { justify-self: end; font-size: 9px; letter-spacing: .12em; text-transform: uppercase; }
footer > a:hover { color: var(--acid); }

.toast { position: fixed; z-index: 50; left: 50%; bottom: 24px; padding: 13px 18px; transform: translate(-50%, 24px); background: var(--bone); color: var(--ink); border-left: 4px solid var(--orange); opacity: 0; pointer-events: none; font-size: 10px; font-weight: 800; letter-spacing: .04em; transition: opacity .2s ease, transform .2s ease; }
.toast.show { opacity: 1; transform: translate(-50%, 0); }

@media (max-width: 1080px) {
  .site-header { grid-template-columns: 1fr auto; }
  nav { display: none; }
  .hero-grid { grid-template-columns: minmax(0,1fr) minmax(360px,.8fr); }
  .mission-stamp { display: none; }
  .impact-heading { grid-template-columns: 1fr 300px; }
}

@media (max-width: 820px) {
  .hero-grid { grid-template-columns: 1fr; padding-top: 68px; }
  .hero-art { min-height: 560px; }
  .mission-grid, .impact-heading, .final-grid { grid-template-columns: 1fr; }
  .impact-console { grid-template-columns: 1fr; }
  .impact-tabs { grid-template-columns: repeat(3, 1fr); border-right: 0; border-bottom: 1px solid rgba(13,16,13,.3); }
  .impact-tabs button { grid-template-columns: 1fr; gap: 8px; min-height: 92px; border-bottom: 0; border-right: 1px solid rgba(13,16,13,.2); }
  .proof-grid { grid-template-columns: 1fr; }
  .proof-grid article { min-height: 250px; }
  .final-grid { align-items: start; }
  .cta-actions { grid-template-columns: repeat(2, 1fr); }
  footer { grid-template-columns: 1fr; gap: 20px; padding-block: 45px; }
  footer > a { justify-self: start; }
}

@media (max-width: 600px) {
  .shell { width: min(100% - 28px, 1400px); }
  .site-header { height: 74px; }
  .brand-copy small { display: none; }
  .brand > img { width: 38px; height: 38px; }
  .hero-grid { min-height: auto; gap: 10px; padding-block: 58px 22px; }
  h1 { font-size: clamp(52px, 17vw, 78px); }
  .hero-lede { font-size: 15px; }
  .hero-art { min-height: 420px; }
  .hero-art > img { width: 112%; max-width: none; }
  .camera-card { right: 2%; bottom: 8%; }
  .serial-top { display: none; }
  .contract-rail { grid-template-columns: auto 1fr; }
  .contract-rail button { grid-column: 2; justify-self: start; padding: 0; }
  .mission-grid { gap: 42px; }
  .mission h2, .impact-heading h2 { font-size: 53px; }
  .impact-tabs button { padding: 14px 10px; }
  .impact-tabs button strong { font-size: 17px; }
  .impact-readout { min-height: 390px; }
  .field-head { align-items: flex-end; gap: 22px; }
  .field-head > p { text-align: right; line-height: 1.5; }
  .field-scanner { min-height: 610px; }
  .scan-light::after { width: 260px; height: 260px; left: calc(var(--scan-x) - 130px); top: calc(var(--scan-y) - 130px); }
  .label-c { left: 6%; right: 6%; }
  .proof-grid article { min-height: 230px; }
  .final-cta { min-height: 680px; }
  .final-grid { gap: 54px; }
  .final-grid h2 { font-size: 80px; }
  .cta-actions { grid-template-columns: 1fr; }
  .final-cta > img { width: 100%; right: -20%; bottom: -14%; }
}

@media (hover: none) {
  .field-scanner { --scan-x: 62%; --scan-y: 42%; }
  .scan-cursor { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .orbit, .signal-ticker > div { animation: none; }
  .hero-art { transition: none; }
}