:root{
  --dark: #14110E;
  --dark-2: #0D0B09;
  --tan: #E4CBA5;
  --tan-deep: #C9A876;
  --ink: #F2EAD9;
  --ink-dim: #A99C87;
  --ink-dark: #1C1712;
  --ink-dark-soft: #4a4033;
  --red: #D94F3D;
  --mono: 'Space Mono', monospace;
}

*{ box-sizing: border-box; }
html{ scroll-behavior: smooth; }
body{
  margin:0; background: var(--dark); color: var(--ink);
  font-family: var(--mono); overflow-x: hidden;
}
img{ display:block; max-width:100%; }
a{ text-decoration:none; color:inherit; }
h1,h2,h3{ margin:0; }
p{ margin:0; }

/* ---------- shared bits ---------- */
.badge{
  display:inline-block; background: var(--red); color:#fff;
  font-size:.7rem; font-weight:700; letter-spacing:.08em;
  padding:.3rem .7rem; margin-bottom:1.2rem;
}
.badge--dark{ background: var(--ink-dark); }
.index-num{
  position:absolute; top:.5rem; left: clamp(1rem, 4vw, 3rem);
  font-size: 5rem; font-weight:700; color: rgba(228,203,165,.06); line-height:1;
}
.index-num--light{ color: rgba(255,255,255,.05); }

.btn{
  display:inline-block; padding: .8rem 1.6rem; font-family: var(--mono); font-weight:700;
  font-size:.85rem; letter-spacing:.04em; border:1px solid var(--ink); color: var(--ink);
  transition: background .15s ease, color .15s ease;
}
.btn--fill{ background: var(--ink); color: var(--dark); }
.btn--fill:hover{ background: transparent; color: var(--ink); }
.btn--outline:hover{ background: var(--ink); color: var(--dark); }
.btn--light{ border-color: rgba(255,255,255,.5); }

.reveal{ opacity:0; transform: translateY(24px); transition: opacity .7s ease, transform .7s cubic-bezier(.2,.8,.2,1); }
.reveal.is-visible{ opacity:1; transform:none; }

/* ---------- topbar ---------- */
.topbar{
  display:flex; align-items:center; justify-content:space-between;
  padding: 1rem clamp(1rem, 4vw, 2.5rem); font-size:.7rem; letter-spacing:.06em;
  border-bottom: 1px solid rgba(228,203,165,.15); color: var(--ink-dim);
}
.topbar__file{ display:flex; align-items:center; gap:.5rem; }
.dot{ width:7px; height:7px; border-radius:50%; background: var(--red); display:inline-block; }
.topbar__status{ display:none; }
.topbar__nav{ display:flex; gap:1.4rem; }
.topbar__nav a{ color: var(--ink-dim); }
.topbar__nav a:hover{ color: var(--ink); }
@media (min-width: 720px){ .topbar__status{ display:inline; } }

/* ---------- hero ---------- */
.hero{
  position:relative; min-height: 92vh; display:flex; align-items:center;
  padding: clamp(6rem,10vw,7rem) clamp(1.2rem, 5vw, 3rem) 4rem;
  overflow:hidden;
}
.hero__bg{ position:absolute; inset:0; z-index:0; }
.hero__bg img{ width:100%; height:100%; object-fit:cover; object-position: center 55%; filter: saturate(.85) contrast(1.05); }
.hero__overlay{
  position:absolute; inset:0; z-index:1;
  background: linear-gradient(90deg, rgba(20,17,14,.92) 0%, rgba(20,17,14,.72) 32%, rgba(20,17,14,.25) 60%, rgba(20,17,14,.55) 100%),
              linear-gradient(0deg, rgba(20,17,14,.85) 0%, rgba(20,17,14,0) 30%);
}
.hero__stamp{
  position:absolute; top: 6.5rem; right: clamp(1.2rem, 5vw, 3rem); z-index:2;
  color: var(--red); border:2px solid var(--red); font-weight:700; font-size:.75rem;
  padding:.3rem .6rem; transform: rotate(-8deg); letter-spacing:.05em;
}
.hero__content{ position:relative; z-index:2; max-width: 640px; }
.hero__case{ font-size:.75rem; color: var(--ink-dim); letter-spacing:.06em; margin-bottom: 1.4rem; }
.hero__title{ display:flex; flex-direction:column; gap:.2rem; margin-bottom: 1.4rem; }
.hero__title-line{ font-size: clamp(2.6rem, 7vw, 4.6rem); font-weight:700; line-height:1; letter-spacing:-.01em; }
.hero__title-line--solid{ color: var(--ink); }
.hero__title-line--outline{ color: transparent; -webkit-text-stroke: 2px var(--ink); }
.hero__tagline{ font-size: clamp(1rem, 2vw, 1.2rem); color: var(--ink-dim); margin-bottom: 1.6rem; max-width: 34ch; }
.hero__status-line{ font-size:.75rem; color: var(--tan-deep); margin-bottom: 2.4rem; letter-spacing:.03em; }
.hero__actions{ display:flex; gap:.8rem; flex-wrap:wrap; }
.hero__caption{
  position:absolute; z-index:2; bottom: 1.6rem; left: clamp(1.2rem, 5vw, 3rem); right: clamp(1.2rem, 5vw, 3rem);
  font-size:.68rem; color: var(--ink-dim); letter-spacing:.02em;
}
.hero__caption span{ color: var(--tan-deep); font-weight:700; }

/* ---------- marquee ---------- */
.marquee{ background: var(--tan); color: var(--ink-dark); overflow:hidden; border-top:1px solid var(--dark); border-bottom:1px solid var(--dark); padding: .6rem 0; }
.marquee__track{ display:flex; width: max-content; animation: marquee 22s linear infinite; }
.marquee__track span{ font-size:.75rem; font-weight:700; letter-spacing:.06em; white-space:nowrap; padding-right: 1rem; }
@keyframes marquee{ from{ transform: translateX(0); } to{ transform: translateX(-50%); } }

/* ---------- profile ---------- */
.profile{ position:relative; padding: 6rem clamp(1.2rem, 5vw, 3rem) 5rem; background: var(--dark); }
.profile__grid{ max-width: 1160px; margin:0 auto; display:grid; grid-template-columns: 1.3fr .9fr; gap: 3rem 4rem; }
.profile__title{ font-size: clamp(1.9rem, 4.2vw, 2.8rem); line-height:1.1; margin-bottom: 1.4rem; }
.profile__body{ color: var(--ink-dim); font-size:.95rem; line-height:1.8; max-width: 52ch; }
.field-note{ margin-top:1.4rem; padding-left:.8rem; border-left:2px solid var(--red); color: var(--tan-deep); font-size:.8rem; font-style:italic; }
.profile__media{ display:flex; align-items:center; justify-content:center; }
.profile__img{ max-width: 280px; filter: drop-shadow(0 14px 20px rgba(0,0,0,.5)); }
.rules{ grid-column: 1 / -1; display:grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; margin-top: 1rem; }
.rule{ border: 1px solid rgba(228,203,165,.2); padding: 1.4rem; }
.rule__num{ display:block; font-size:.7rem; color: var(--red); font-weight:700; margin-bottom:.6rem; letter-spacing:.06em; }
.rule h3{ font-size:1rem; margin-bottom:.5rem; }
.rule p{ font-size:.82rem; color: var(--ink-dim); line-height:1.6; }

/* ---------- evidence ---------- */
.evidence{ background: var(--dark-2); padding: 4rem clamp(1.2rem, 5vw, 3rem) 5rem; text-align:center; }
.evidence__grid{ max-width: 1100px; margin: 0 auto; display:grid; grid-template-columns: repeat(3, 1fr); gap: 1.6rem; }
.evidence__item{ background: var(--tan); padding: 1rem 1rem 1.2rem; }
.evidence__item img{ width:100%; height:200px; object-fit:contain; }
.evidence__item figcaption{ margin-top:.8rem; font-size:.68rem; color: var(--ink-dark-soft); letter-spacing:.03em; }

/* ---------- transmission (color flip) ---------- */
.transmission{ background: var(--tan); color: var(--ink-dark); padding: 5rem clamp(1.2rem, 5vw, 3rem); }
.transmission__grid{ max-width: 1000px; margin:0 auto; display:grid; grid-template-columns: 1.4fr .8fr; gap: 3rem; align-items:center; }
.transmission__card{ background: var(--ink); padding: 2rem; box-shadow: 0 16px 30px rgba(0,0,0,.15); }
.transmission__head{ display:flex; justify-content:space-between; font-size:.65rem; color: var(--ink-dark-soft); letter-spacing:.06em; margin-bottom: 1.4rem; }
.transmission__quote{ font-size: clamp(1.3rem, 3vw, 1.8rem); font-weight:700; line-height:1.3; margin-bottom:1.2rem; }
.transmission__source{ font-size:.68rem; color: var(--ink-dark-soft); letter-spacing:.03em; }
.transmission__side{ text-align:center; }
.transmission__side img{ max-width: 160px; margin: 0 auto 1rem; }
.transmission__side p{ font-size:.7rem; color: var(--ink-dark-soft); letter-spacing:.03em; }
.transmission__side span{ display:block; font-weight:700; color: var(--ink-dark); margin-top:.2rem; }

/* ---------- tokenomics ---------- */
.tokenomics{ position:relative; background: var(--dark); padding: 6rem clamp(1.2rem, 5vw, 3rem) 4rem; }
.section-title{ font-size: clamp(2rem, 5vw, 3rem); font-weight:700; margin-bottom: 2.4rem; }
.readout{ max-width: 700px; }
.readout__row{
  display:flex; justify-content:space-between; padding: 1rem 0; border-bottom: 1px dashed rgba(228,203,165,.2);
  font-size:.85rem; letter-spacing:.04em;
}
.readout__row span:first-child{ color: var(--ink-dim); }
.readout__val{ font-weight:700; color: var(--red); }
.tokenomics__ca{ margin-top: 2rem; font-size:.78rem; color: var(--ink-dim); }
.tokenomics__ca span{ color: var(--tan-deep); font-weight:700; }

/* ---------- how to buy ---------- */
.howto{ background: var(--tan); color: var(--ink-dark); padding: 5.5rem clamp(1.2rem, 5vw, 3rem); }
.section-title--dark{ color: var(--ink-dark); }
.howto .badge{ background: var(--ink-dark); }
.protocol{ display:grid; grid-template-columns: repeat(3, 1fr); gap: 1.6rem; }
.protocol__step{ background: var(--ink); padding: 1.6rem; }
.protocol__step span{ font-size:.7rem; color: var(--red); font-weight:700; letter-spacing:.06em; }
.protocol__step h3{ font-size:1.1rem; margin: .6rem 0 .5rem; }
.protocol__step p{ font-size:.82rem; color: var(--ink-dark-soft); line-height:1.6; }

/* ---------- join ---------- */
.join{ background: var(--dark); padding: 6rem clamp(1.2rem, 5vw, 3rem); text-align:center; }
.join__inner{ max-width: 620px; margin: 0 auto; }
.join__case{ font-size:.75rem; color: var(--ink-dim); letter-spacing:.06em; margin-bottom: 1.4rem; }
.join .hero__title{ align-items:center; }
.join__sub{ color: var(--ink-dim); font-size:.9rem; margin: 1.4rem 0 2rem; }
.join__actions{ display:flex; gap: .8rem; justify-content:center; flex-wrap:wrap; }
.join__foot{ margin-top: 2.4rem; font-size:.72rem; color: var(--ink-dim); }

/* ---------- responsive ---------- */
@media (max-width: 900px){
  .profile__grid{ grid-template-columns: 1fr; }
  .rules{ grid-template-columns: 1fr; }
  .evidence__grid{ grid-template-columns: 1fr; }
  .transmission__grid{ grid-template-columns: 1fr; }
  .protocol{ grid-template-columns: 1fr; }
}