:root {
  --lime: #c7ff00;
  --lime-hot: #d5ff18;
  --ink: #101a18;
  --ink-soft: #182421;
  --cream: #f5f2e9;
  --line: rgba(16, 26, 24, 0.22);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  background: var(--lime);
  font-family: "DM Sans", Arial, sans-serif;
  font-size: 16px;
  overflow-x: hidden;
}
a { color: inherit; text-decoration: none; }
button, a { -webkit-tap-highlight-color: transparent; }
img { display: block; max-width: 100%; }

.noise {
  position: fixed;
  inset: 0;
  pointer-events: none;
  opacity: .055;
  z-index: 30;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.6'/%3E%3C/svg%3E");
}

.site-header {
  height: 92px;
  padding: 0 clamp(24px, 5vw, 76px);
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  border-bottom: 1px solid var(--line);
  position: relative;
  z-index: 20;
}
.brand { width: clamp(150px, 14vw, 210px); overflow: hidden; }
.brand img { width: 100%; mix-blend-mode: multiply; }
.desktop-nav { display: flex; gap: 32px; font-weight: 700; }
.desktop-nav a { position: relative; }
.desktop-nav a::after {
  content: ""; position: absolute; left: 0; right: 100%; bottom: -6px; height: 2px;
  background: var(--ink); transition: right .2s ease;
}
.desktop-nav a:hover::after { right: 0; }
.header-cta { justify-self: end; }
.button {
  min-height: 52px;
  padding: 0 24px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 2px solid var(--ink);
  border-radius: 100px;
  font: 700 15px/1 "DM Sans", sans-serif;
  cursor: pointer;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}
.button-dark { color: var(--lime); background: var(--ink); box-shadow: 0 0 0 var(--ink); }
.button-dark:hover { transform: translate(-3px, -3px); box-shadow: 6px 6px 0 rgba(16, 26, 24, .26); }
.menu-button, .mobile-nav { display: none; }

.hero {
  min-height: calc(100svh - 92px);
  padding: clamp(64px, 8vw, 118px) clamp(24px, 5vw, 76px) 72px;
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(360px, .95fr);
  align-items: center;
  gap: clamp(36px, 7vw, 110px);
  position: relative;
}
.eyebrow, .section-kicker {
  margin: 0 0 25px;
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.eyebrow span { width: 9px; height: 9px; border-radius: 50%; background: var(--ink); box-shadow: 0 0 0 5px rgba(16,26,24,.12); }
h1, h2, h3, p { margin-top: 0; }
h1, h2 { font-family: "Archivo Black", Impact, sans-serif; letter-spacing: -.055em; }
h1 { margin-bottom: 28px; font-size: clamp(56px, 7vw, 112px); line-height: .88; }
h1 em { color: var(--cream); font-style: normal; -webkit-text-stroke: 2px var(--ink); text-shadow: 6px 6px 0 var(--ink); }
.hero-lede { max-width: 610px; margin-bottom: 32px; font-size: clamp(18px, 1.7vw, 24px); line-height: 1.48; font-weight: 500; }
.hero-actions { display: flex; align-items: center; gap: 28px; flex-wrap: wrap; }
.text-link { display: inline-flex; align-items: center; gap: 10px; font-weight: 800; }
.text-link span { font-size: 22px; transition: transform .2s ease; }
.text-link:hover span { transform: translate(4px, 4px); }
.launch-note { margin-top: 30px; display: flex; align-items: center; gap: 10px; font-size: 14px; font-weight: 600; }
.status-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--ink); animation: pulse 1.8s infinite; }
@keyframes pulse { 50% { opacity: .35; transform: scale(.75); } }

.hero-art { min-height: 590px; position: relative; display: grid; place-items: center; }
.art-card {
  width: min(100%, 550px);
  aspect-ratio: 1;
  border: 3px solid var(--ink);
  border-radius: 46% 46% 20% 20% / 34% 34% 16% 16%;
  overflow: hidden;
  position: relative;
  z-index: 2;
  background: var(--lime-hot);
  box-shadow: 17px 17px 0 var(--ink);
  transform: rotate(2deg);
}
.art-card img { width: 100%; height: 100%; object-fit: cover; }
.orbit { position: absolute; border: 2px solid rgba(16,26,24,.36); border-radius: 50%; transform: rotate(-18deg); }
.orbit-one { width: 112%; height: 62%; }
.orbit-two { width: 75%; height: 112%; transform: rotate(26deg); }
.reward-tag {
  position: absolute; z-index: 3; min-width: 128px; padding: 14px 18px;
  background: var(--cream); border: 2px solid var(--ink); box-shadow: 6px 6px 0 var(--ink);
}
.reward-tag small { display: block; margin-bottom: 3px; font-size: 10px; font-weight: 800; letter-spacing: .13em; }
.reward-tag strong { font-family: "Archivo Black"; font-size: 24px; }
.reward-tag-top { top: 13%; right: -3%; transform: rotate(6deg); }
.reward-tag-bottom { bottom: 7%; left: -4%; transform: rotate(-7deg); }

.ticker { background: var(--ink); color: var(--lime); border-block: 2px solid var(--ink); overflow: hidden; }
.ticker-track { width: max-content; padding: 17px 0; display: flex; gap: 28px; align-items: center; font-family: "Archivo Black"; font-size: 18px; animation: ticker 22s linear infinite; }
.ticker-track b { font-size: 14px; }
@keyframes ticker { to { transform: translateX(-50%); } }

.statement { padding: 120px clamp(24px, 6vw, 92px); background: var(--cream); }
.statement-grid { display: grid; grid-template-columns: 1.1fr .9fr; align-items: end; gap: 80px; }
.statement h2, .steps h2, .launch h2, .reward-copy h2 { margin: 0; font-size: clamp(48px, 6.2vw, 96px); line-height: .92; }
.statement-copy { max-width: 560px; }
.statement-copy p { font-size: clamp(17px, 1.35vw, 20px); line-height: 1.6; }
.statement-copy p:first-child { font-size: clamp(19px, 1.55vw, 23px); }
.statement-copy strong { font-weight: 800; }
.dark-link { margin-top: 15px; border-bottom: 2px solid var(--ink); padding-bottom: 8px; }

.rewards-panel {
  padding: 100px clamp(24px, 6vw, 92px);
  display: grid; grid-template-columns: 1fr 1fr; gap: clamp(50px, 9vw, 140px); align-items: center;
  background: var(--ink); color: var(--cream);
}
.reward-visual { display: grid; place-items: center; min-height: 520px; position: relative; }
.reward-visual::before { content: ""; position: absolute; width: 86%; aspect-ratio: 1; border-radius: 50%; background: var(--lime); filter: blur(1px); }
.reward-card {
  width: min(100%, 430px); padding: 28px; position: relative; z-index: 1;
  background: var(--cream); color: var(--ink); border: 3px solid var(--ink); box-shadow: 14px 14px 0 var(--lime);
  transform: rotate(-3deg);
}
.reward-card-head { display: flex; justify-content: space-between; align-items: center; font-size: 12px; font-weight: 800; letter-spacing: .1em; }
.live-pill { padding: 7px 10px; background: var(--ink); color: var(--lime); border-radius: 100px; }
.reward-symbol { margin: 54px 0 8px; font-family: "Archivo Black"; font-size: clamp(64px, 8vw, 116px); line-height: .8; letter-spacing: -.08em; }
.reward-card p { font-size: 17px; font-weight: 700; }
.reward-chart { height: 90px; margin-top: 32px; display: flex; gap: 9px; align-items: end; border-bottom: 2px solid var(--ink); }
.reward-chart span { flex: 1; background: var(--lime); border: 2px solid var(--ink); border-bottom: 0; }
.section-kicker.light { color: var(--lime); }
.reward-copy > p:not(.section-kicker) { max-width: 590px; margin: 32px 0 24px; font-size: 20px; line-height: 1.6; color: #d8dedb; }
.fine-print { max-width: 560px; padding-top: 20px; border-top: 1px solid rgba(245,242,233,.22); font-size: 14px; line-height: 1.6; color: #929d99; }

.tracker {
  padding: 120px clamp(24px, 6vw, 92px);
  display: grid;
  grid-template-columns: .72fr 1.28fr;
  gap: clamp(50px, 8vw, 130px);
  align-items: start;
  background: var(--cream);
}
.tracker-heading {
  position: sticky;
  top: 42px;
}
.tracker-heading h2 {
  margin: 0;
  font-size: clamp(48px, 6vw, 90px);
  line-height: .9;
}
.tracker-heading > p:last-child {
  max-width: 470px;
  margin: 30px 0 0;
  font-size: 19px;
  line-height: 1.6;
}
.tracker-console {
  border: 3px solid var(--ink);
  background: var(--ink);
  color: var(--cream);
  box-shadow: 14px 14px 0 var(--lime);
}
.tracker-console-head {
  min-height: 105px;
  padding: 25px 28px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
  border-bottom: 1px solid rgba(245,242,233,.2);
}
.tracker-console-head > div {
  display: grid;
  gap: 5px;
}
.console-label {
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: #8d9994;
}
.tracker-console-head strong {
  font-family: "Archivo Black";
  font-size: clamp(20px, 2.2vw, 32px);
  letter-spacing: -.035em;
}
.tracker-status {
  padding: 9px 12px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border: 1px solid rgba(245,242,233,.25);
  border-radius: 100px;
  font-size: 12px;
  font-weight: 800;
  white-space: nowrap;
}
.tracker-status i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #7b8782;
}
.tracker-status.live i { background: var(--lime); box-shadow: 0 0 0 4px rgba(199,255,0,.13); }
.tracker-status.error i { background: #ff7e67; }
.wallet-form {
  padding: 30px 28px 28px;
  border-bottom: 1px solid rgba(245,242,233,.2);
}
.wallet-form label {
  display: block;
  margin-bottom: 10px;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: #aeb7b3;
}
.wallet-input-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 10px;
}
.wallet-input-row input {
  min-width: 0;
  height: 56px;
  padding: 0 17px;
  border: 2px solid #44504b;
  border-radius: 0;
  outline: 0;
  background: #202b27;
  color: var(--cream);
  font: 600 15px/1 "DM Sans", sans-serif;
}
.wallet-input-row input::placeholder { color: #7c8883; }
.wallet-input-row input:focus { border-color: var(--lime); }
.tracker-button {
  min-width: 155px;
  height: 56px;
  border-color: var(--lime);
  border-radius: 0;
  background: var(--lime);
  color: var(--ink);
}
.tracker-button:hover {
  transform: translate(-3px,-3px);
  box-shadow: 5px 5px 0 var(--cream);
}
.tracker-button:disabled { cursor: wait; opacity: .6; transform: none; box-shadow: none; }
.wallet-message {
  min-height: 21px;
  margin: 11px 0 0;
  color: #9da7a3;
  font-size: 14px;
  line-height: 1.5;
}
.wallet-message.error { color: #ff9a88; }
.tracker-results {
  margin: 0;
  display: grid;
  grid-template-columns: 1.25fr 1fr .7fr;
  border-bottom: 1px solid rgba(245,242,233,.2);
}
.tracker-results > div {
  min-width: 0;
  padding: 28px;
  border-right: 1px solid rgba(245,242,233,.2);
}
.tracker-results > div:last-child { border-right: 0; }
.tracker-results dt,
.tracker-proof span {
  margin-bottom: 9px;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: #89958f;
}
.tracker-results dd {
  margin: 0;
  overflow-wrap: anywhere;
  font-family: "Archivo Black";
  font-size: clamp(22px, 2.5vw, 38px);
  letter-spacing: -.04em;
}
.tracker-proof {
  padding: 25px 28px 28px;
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: end;
  gap: 35px;
}
.tracker-proof > div { display: grid; gap: 4px; }
.tracker-proof span { margin: 0; }
.tracker-proof strong { font-size: 14px; }
.tracker-proof p {
  max-width: 470px;
  margin: 0;
  justify-self: end;
  color: #9da7a3;
  font-size: 13px;
  line-height: 1.55;
}

.steps { padding: 120px clamp(24px, 6vw, 92px); background: var(--lime); display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(50px, 9vw, 140px); }
.step-list { border-top: 2px solid var(--ink); }
.step { min-height: 150px; padding: 28px 4px; display: grid; grid-template-columns: 70px 1fr auto; align-items: center; gap: 20px; border-bottom: 2px solid var(--ink); }
.step-number { align-self: start; font-size: 13px; font-weight: 800; }
.step h3 { margin-bottom: 7px; font-family: "Archivo Black"; font-size: clamp(26px, 2.5vw, 40px); letter-spacing: -.04em; }
.step p { margin: 0; font-size: 17px; }
.step-arrow { font-size: 34px; transition: transform .25s ease; }
.step:hover .step-arrow { transform: translate(6px, -6px); }

.launch { min-height: 720px; padding: 90px clamp(24px, 6vw, 92px); display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 80px; background: var(--cream); overflow: hidden; }
.launch-art { align-self: end; position: relative; height: 620px; }
.launch-art::before { content: ""; position: absolute; inset: 10% -10% -30%; border-radius: 50% 50% 0 0; background: var(--lime); border: 3px solid var(--ink); }
.launch-art img { height: 110%; width: 100%; object-fit: cover; position: relative; z-index: 1; mix-blend-mode: multiply; }
.launch-copy p:not(.section-kicker) { max-width: 520px; margin: 28px 0 32px; font-size: 20px; line-height: 1.6; }
.button.disabled { opacity: .66; cursor: not-allowed; }
.button.disabled:hover { transform: none; box-shadow: none; }

footer { min-height: 180px; padding: 48px clamp(24px, 5vw, 76px); display: grid; grid-template-columns: 1fr auto 1fr; gap: 30px; align-items: center; background: var(--lime); border-top: 2px solid var(--ink); font-weight: 700; }
footer img { width: 185px; mix-blend-mode: multiply; }
footer p { margin: 0; }
footer > span { justify-self: end; font-size: 14px; }

@media (max-width: 980px) {
  .site-header { grid-template-columns: 1fr auto; }
  .desktop-nav, .header-cta { display: none; }
  .menu-button { width: 48px; height: 48px; display: grid; place-content: center; gap: 7px; border: 2px solid var(--ink); border-radius: 50%; background: transparent; }
  .menu-button span { width: 20px; height: 2px; background: var(--ink); transition: transform .2s ease; }
  .menu-button.open span:first-child { transform: translateY(4.5px) rotate(45deg); }
  .menu-button.open span:last-child { transform: translateY(-4.5px) rotate(-45deg); }
  .mobile-nav { position: absolute; top: 92px; left: 0; right: 0; z-index: 19; padding: 24px; display: none; flex-direction: column; gap: 18px; background: var(--lime); border-bottom: 2px solid var(--ink); font-size: 22px; font-weight: 800; }
  .mobile-nav.open { display: flex; }
  .hero { grid-template-columns: 1fr; padding-top: 70px; }
  .hero-art { min-height: 540px; }
  .art-card { max-width: 500px; }
  .statement-grid, .rewards-panel, .tracker, .steps, .launch { grid-template-columns: 1fr; }
  .statement-grid, .steps { gap: 48px; }
  .reward-copy { max-width: 700px; }
  .tracker-heading { position: static; }
  .launch { padding-bottom: 0; }
  .launch-art { order: 2; height: 560px; max-width: 620px; }
}

@media (max-width: 600px) {
  .site-header { height: 76px; padding-inline: 18px; }
  .brand { width: 135px; }
  .mobile-nav { top: 76px; }
  .hero { min-height: auto; padding: 52px 20px 62px; gap: 48px; }
  h1 { font-size: clamp(49px, 16vw, 72px); }
  h1 em { -webkit-text-stroke-width: 1.5px; text-shadow: 4px 4px 0 var(--ink); }
  .hero-lede { font-size: 18px; }
  .hero-actions { align-items: flex-start; flex-direction: column; gap: 20px; }
  .hero-art { min-height: 390px; }
  .art-card { width: 90%; border-radius: 42% 42% 18% 18% / 32% 32% 15% 15%; box-shadow: 10px 10px 0 var(--ink); }
  .reward-tag { min-width: 100px; padding: 10px 13px; }
  .reward-tag strong { font-size: 18px; }
  .reward-tag-top { right: 0; }
  .reward-tag-bottom { left: 0; }
  .statement, .rewards-panel, .tracker, .steps, .launch { padding: 82px 20px; }
  .statement h2, .steps h2, .launch h2, .reward-copy h2 { font-size: clamp(44px, 14vw, 66px); }
  .statement-copy p, .reward-copy > p:not(.section-kicker), .launch-copy p:not(.section-kicker) { font-size: 18px; }
  .reward-visual { min-height: 390px; }
  .reward-card { padding: 21px; }
  .reward-symbol { margin-top: 45px; }
  .tracker { gap: 45px; }
  .tracker-console { box-shadow: 8px 8px 0 var(--lime); }
  .tracker-console-head { align-items: flex-start; flex-direction: column; padding: 22px 18px; }
  .wallet-form { padding: 24px 18px; }
  .wallet-input-row { grid-template-columns: 1fr; }
  .tracker-button { width: 100%; }
  .tracker-results { grid-template-columns: 1fr; }
  .tracker-results > div { padding: 22px 18px; border-right: 0; border-bottom: 1px solid rgba(245,242,233,.2); }
  .tracker-results > div:last-child { border-bottom: 0; }
  .tracker-proof { grid-template-columns: 1fr; gap: 18px; padding: 22px 18px; }
  .tracker-proof p { justify-self: start; }
  .step { grid-template-columns: 45px 1fr auto; min-height: 138px; gap: 12px; }
  .step p { font-size: 15px; }
  .launch { padding-bottom: 0; }
  .launch-art { height: 420px; }
  footer { grid-template-columns: 1fr auto; }
  footer p { display: none; }
}

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