/* DESIGN-02-REVISION — isolated visual proposal; official site CSS remains untouched. */
:root {
  color-scheme: dark;
  --paper: #070b09;
  --paper-bright: #101713;
  --ink: #edf4ef;
  --forest: #0b1510;
  --forest-soft: #14231a;
  --muted: #a5b2a9;
  --line: #26362d;
  --mint: #14f195;
  --green: #14f195;
  --green-dark: #159764;
  --blue: #91c9b4;
  --violet: #52655a;
  --orange: #a94f2d;
  --display: "Archivo", "Arial Narrow", sans-serif;
  --body: "Source Sans 3", "Segoe UI", sans-serif;
  --measure: 80rem;
}

html { background: var(--paper); scroll-behavior: smooth; scroll-padding-top: 92px; }
body {
  min-width: 320px;
  background:
    radial-gradient(780px 420px at 9% 0%, rgba(20,241,149,.055), transparent 68%),
    linear-gradient(180deg, #070b09 0%, #0a100c 52%, #080d0a 100%);
  color: var(--ink);
  font-family: var(--body);
  font-size: 17px;
  line-height: 1.58;
}
.wrap { width: min(100% - 56px, var(--measure)); margin-inline: auto; }
a { color: inherit; }
a:focus-visible, button:focus-visible { outline: 2px solid var(--mint); outline-offset: 4px; }
::selection { color: #06110b; background: var(--mint); }
h1, h2, h3, p, li, td, th { text-wrap: pretty; }

/* Precision masthead */
.nav {
  min-height: 78px;
  padding: 12px 0;
  border-bottom: 1px solid rgba(165,178,169,.18);
  background: rgba(7,11,9,.88);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}
.brand { gap: 12px; color: var(--ink); }
.brand img { width: 38px; height: 38px; object-fit: contain; }
.brand-name { font: 700 16px/1 var(--display); letter-spacing: -.035em; }
.sys { border-color: rgba(20,241,149,.35); color: #91a79a; letter-spacing: .15em; }
.nav-links { gap: clamp(14px, 1.7vw, 27px); }
.nav-links a, .site-footer nav a { color: #b5c1b8; font-size: 13px; font-weight: 600; }
.nav-links a:hover, .site-footer nav a:hover { color: var(--mint); }
.lang button { min-width: 36px; border-radius: 8px; color: var(--muted); }
.lang button.on { border-color: rgba(20,241,149,.45); color: var(--mint); background: rgba(20,241,149,.06); }
.menu { border-color: var(--line); background: #101713; color: var(--ink); }
.menu span { background: currentColor; }

/* Hero: signal route + non-data-bearing architectural grid */
.hero {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(360px, .92fr);
  align-items: center;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-height: 610px;
  margin: 28px 0 94px;
  padding: clamp(34px, 5vw, 72px);
  gap: clamp(28px, 4.4vw, 68px);
  border: 1px solid rgba(20,241,149,.18);
  border-radius: 18px;
  background: #0b120e;
  box-shadow: 0 34px 80px -52px rgba(0,0,0,.9);
}
.hero::before {
  position: absolute;
  inset: 0;
  z-index: 0;
  content: "";
  pointer-events: none;
  opacity: .9;
  background:
    radial-gradient(ellipse at 76% 48%, rgba(20,241,149,.16), transparent 34%),
    linear-gradient(90deg, rgba(7,11,9,.12) 0%, rgba(7,11,9,.2) 48%, rgba(7,11,9,.68) 100%),
    repeating-linear-gradient(0deg, transparent 0 43px, rgba(20,241,149,.12) 44px, transparent 45px),
    repeating-linear-gradient(90deg, transparent 0 43px, rgba(20,241,149,.12) 44px, transparent 45px);
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 28%, #000 100%);
  mask-image: linear-gradient(90deg, transparent 0%, #000 28%, #000 100%);
  transform: perspective(1100px) rotateY(-12deg) rotateZ(-1deg) scale(1.08);
  transform-origin: 78% 50%;
}
.hero::after {
  position: absolute;
  inset: 0;
  z-index: 0;
  content: "";
  pointer-events: none;
  background:
    linear-gradient(135deg, transparent 0 63%, rgba(20,241,149,.12) 63.08%, transparent 63.2%),
    radial-gradient(34% 55% at 100% 90%, rgba(20,241,149,.085), transparent 72%);
}
.stage, .token { position: relative; z-index: 1; }
.stage { max-width: 680px; }
.kicker { color: var(--mint); font: 700 11px var(--display); letter-spacing: .16em; }
.kicker i, .dot { background: var(--mint); box-shadow: 0 0 12px rgba(20,241,149,.35); }
.signal { display: flex; align-items: center; gap: 8px; margin: 0 0 16px; color: #b4c3b9; font: 500 11px var(--body); letter-spacing: .06em; }
.signal .dot { display: inline-block; width: 6px; height: 6px; border-radius: 50%; }
.hero h1 { max-width: 9ch; color: #f2f7f3; font-size: clamp(4.4rem, 8vw, 7rem); letter-spacing: -.075em; }
.hero h1 em { color: var(--mint); }
.hero .lead { max-width: 56ch; color: #bac6bd; font-size: clamp(17px, 1.35vw, 19px); line-height: 1.55; }
.signal-route { border-top-color: rgba(20,241,149,.4); }
.signal-route::before, .signal-stop::before { background: var(--mint); }
.signal-stop::before { border-color: #0b120e; }
.signal-stop:nth-child(2)::before { background: #8bb49d; }
.signal-stop strong { font-size: 12px; }
.signal-stop small { color: #acbbb1; }
.signal-stop:hover strong { color: var(--mint); }
.network-note span, .network-note span:nth-child(2) { color: #9faca4; }
.network-note span:nth-child(2) { color: #96c4ac; }
.hero .cta { gap: 12px; margin-top: 28px; }
.btn {
  min-height: 48px;
  padding: 12px 20px;
  border-radius: 8px;
  font: 700 13px/1.2 var(--display);
  letter-spacing: .01em;
  transition: color .18s ease, border-color .18s ease, background-color .18s ease, transform .18s ease;
}
.btn:hover { transform: translateY(-1px); }
.btn::before, .btn::after { display: none; }
.btn-mint { border: 1px solid var(--mint); background: var(--mint); color: #06110b; box-shadow: none; }
.btn-mint:hover { border-color: #77ffc1; background: #77ffc1; color: #06110b; box-shadow: 0 8px 24px -18px var(--mint); }
.btn-glass { border-color: rgba(165,178,169,.32); background: #101713; color: var(--ink); }
.btn-glass:hover { border-color: rgba(20,241,149,.55); background: #142019; color: #fff; }

/* Token panel retains both networks and every published value */
.hero .token {
  align-self: center;
  padding: clamp(20px, 2.1vw, 30px);
  border: 1px solid rgba(165,178,169,.2);
  border-radius: 14px;
  background: rgba(13,20,16,.96);
  color: var(--ink);
  box-shadow: 0 24px 50px -36px rgba(0,0,0,.9), inset 0 1px 0 rgba(255,255,255,.025);
}
.token-top h2 { color: #f2f7f3; font: 700 42px/.95 var(--display); }
.token-top .sub { color: #9eada4; }
.token-top img { border: 1px solid rgba(20,241,149,.3); background: #07100b; }
.stats { border-color: var(--line); }
.stat { border-color: var(--line); }
.stat b { color: #92a197; }
.stat span { color: #e4eee7; }
.addr { border-color: #2a3c31; border-radius: 8px; background: #080e0a; color: #dce8df; font: 500 11px/1.6 "DM Mono", monospace; }
.addr b { color: var(--mint); }
.token .btn-glass { border-color: #33483b; background: #101713; color: var(--ink); }
.token .btn-glass:hover { border-color: var(--mint); background: #142019; color: #fff; }
.flags i { border-color: #304238; border-radius: 5px; background: rgba(20,241,149,.045); color: #a9c0b1; }

/* Editorial section rhythm and restrained material */
main { padding-bottom: 12px; }
.sec {
  margin: 0 0 100px;
  padding: 30px 0 0;
  border: 0;
  border-top: 1px solid rgba(165,178,169,.2);
}
.sec::before { display: none; }
.tag { margin-bottom: 14px; color: var(--mint); font: 700 10px var(--display); letter-spacing: .16em; }
.sec > h2, .sec h2 { color: #edf4ef; font-size: clamp(2.1rem, 4vw, 3.6rem); letter-spacing: -.055em; text-wrap: balance; }
.sec > .lead { max-width: 68ch; color: #a9b7ad; font-size: 18px; }
.cols { grid-template-columns: repeat(3, minmax(0,1fr)); gap: 12px; }
.glass, .block, .card, .feed-card, .step, .grid .card, .grid .slim {
  border: 1px solid rgba(165,178,169,.16);
  border-radius: 12px;
  background: #101713;
  box-shadow: none;
  backdrop-filter: none;
}
.block, #community .block { padding: 22px; }
.block h3, .card h3, .feed-card h3, .step h3 { color: #eaf2ec; font: 700 20px/1.18 var(--display); letter-spacing: -.025em; }
.block p, .card p, .feed-card p, .step p { color: #a9b7ad; font-size: 15px; }
.block:hover, .feed-card:hover, .step:hover, .grid .slim:hover { transform: none; border-color: rgba(20,241,149,.32); box-shadow: none; }
.note { color: #9eada4; font-size: 13px; }
.quote { border-left-color: var(--mint); color: #eaf2ec; }
.clean li { border-color: rgba(165,178,169,.15); color: #aab8ae; }
.clean li::before { background: var(--mint); }

/* Status, updates, doctrine, and product information */
.status-grid { grid-template-columns: repeat(5, minmax(0,1fr)); gap: 10px; }
.status-grid .block { min-height: 122px; padding: 18px; }
.status-grid .block h3 { font-size: 17px; }
.status-grid .block p { font-size: 13px; }
.feed { gap: 12px; margin-top: 30px; }
.feed-card { min-height: 205px; padding: 22px 20px; }
.feed-card::before { height: 2px; background: linear-gradient(90deg, var(--mint), rgba(20,241,149,.05)); }
.feed-card .pulse { margin-bottom: 14px; border: 1px solid rgba(20,241,149,.22); border-radius: 4px; background: rgba(20,241,149,.06); color: var(--mint); }
.feed-card small { color: #92b7a0; }
.feed-card h3 { font-size: 18px; }
#doctrine .cols { grid-template-columns: repeat(4,minmax(0,1fr)); }
.grid { grid-template-columns: minmax(0,1.12fr) minmax(300px,.88fr); gap: 18px; margin-bottom: 100px; }
.grid .card { padding: 26px; }
.grid .card:hover { transform: none; }
.card .shot { margin-bottom: 24px; border: 1px solid rgba(165,178,169,.16); border-radius: 10px; background: #080e0a; }
.card > small { color: var(--mint); }
.card > h3 { font-size: clamp(2.6rem, 4.5vw, 4.4rem); }
.grid .slim { padding: 22px; }
.slim h3 { font-size: 24px; }
.stack { gap: 12px; }
#smart .cols { grid-template-columns: repeat(3,minmax(0,1fr)); }
#creation .cols { grid-template-columns: minmax(0, 820px); }
#meta .cols { grid-template-columns: repeat(2,minmax(0,1fr)); }
.planned { opacity: 1; }

/* Tokenomics — table values, horizontal scroll on narrow screens */
#tokenomics .block { overflow-x: auto; border-color: rgba(165,178,169,.18); background: #0d1410; }
#tokenomics table { min-width: 680px; color: var(--ink); }
#tokenomics th { border-color: #34463a; background: #111b15; color: #c9d7ce; }
#tokenomics td { border-color: #26362d; color: #aebbb2; }
#tokenomics tr:last-child td, #tokenomics .pct { color: #edf4ef; }
#tokenomics .bar { background: #24332a; }
#tokenomics .bar i { background: var(--mint) !important; }

/* Roadmap and community */
.track { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.step { padding: 22px; }
.step .pill { border-color: #33483b; border-radius: 5px; color: #a9b9ae; }
.step.done .pill { border-color: rgba(20,241,149,.34); background: rgba(20,241,149,.08); color: var(--mint); }
.step.now .pill { border-color: rgba(20,241,149,.55); background: rgba(20,241,149,.12); color: var(--mint); }
.step.next .pill { color: #9eaaa2; }
#community .cols { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; }
#community .block { min-height: 220px; padding: 22px; }
#community .mark { border: 1px solid rgba(255,255,255,.1); box-shadow: none; }
#community .mark[style*="linear-gradient"] { background: #14231a !important; }
#community .btn-glass { border-color: #33483b; background: #111a14; color: #e7efe9; box-shadow: none; }
#community .btn-glass:hover { border-color: var(--mint); background: #15231a; color: #fff; box-shadow: none; }

/* Closing section and footer */
#community + .note { margin: 10px 0 0; padding: 18px 20px; border: 1px solid rgba(165,178,169,.16); border-radius: 10px; background: #0e1511; }
.site-footer {
  margin: 70px 0 24px;
  padding: 28px;
  border: 1px solid rgba(165,178,169,.16);
  border-radius: 14px;
  background: #0b120e;
  box-shadow: none;
}
.footer-brand { color: var(--ink); }
.footer-meta { border-color: rgba(165,178,169,.18); color: #93a198; }

@media (max-width: 1080px) {
  .status-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
  #doctrine .cols { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .nav-links { gap: 13px; }
}
@media (max-width: 760px) {
  html { scroll-padding-top: 72px; }
  .wrap { width: min(100% - 36px, var(--measure)); }
  .nav { min-height: 68px; }
  .nav-links { border-color: var(--line); border-radius: 0 0 12px 12px; background: #0c130f; }
  .nav-links a { border-color: rgba(165,178,169,.14); color: #d2ddd5; }
  .nav-actions { margin-left: auto; }
  .hero { grid-template-columns: 1fr; gap: 25px; min-height: 0; margin: 16px 0 72px; padding: 30px 24px; }
  .hero::before { opacity: .48; transform: none; -webkit-mask-image: linear-gradient(180deg,#000 0%,transparent 90%); mask-image: linear-gradient(180deg,#000 0%,transparent 90%); }
  .stage { max-width: none; }
  .hero h1 { max-width: 10ch; font-size: clamp(3.8rem, 14vw, 5.7rem); }
  .hero .token { width: 100%; max-width: none; }
  .sec { margin-bottom: 76px; padding-top: 24px; }
  .cols, #doctrine .cols, #smart .cols, #meta .cols, #community .cols { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .status-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .feed { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .grid { grid-template-columns: 1fr; gap: 14px; margin-bottom: 76px; }
  .track { grid-template-columns: 1fr; }
}
@media (max-width: 480px) {
  body { font-size: 16px; }
  .wrap { width: calc(100% - 28px); }
  .brand img { width: 32px; height: 32px; }
  .brand-name { font-size: 15px; }
  .sys { display: none; }
  .hero { margin-top: 10px; padding: 25px 17px; border-radius: 13px; }
  .hero h1 { font-size: clamp(3.5rem, 15vw, 4.4rem); }
  .hero .stage > .cta { display: grid; grid-template-columns: 1fr; gap: 9px; margin-top: 19px; }
  .hero .stage > .cta > .btn { width: 100%; min-width: 0; }
  .signal-route { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .signal-stop { padding: 10px 8px 8px 0; }
  .signal-stop:nth-child(n+3) { border-top: 1px solid rgba(20,241,149,.14); }
  .signal-stop:nth-child(n+3)::before { top: -4px; }
  .network-note { gap: 6px 12px; }
  .hero .token { padding: 19px; }
  .token-top h2 { font-size: 37px; }
  .sec > h2, .sec h2 { font-size: clamp(2rem, 10vw, 2.9rem); }
  .sec > .lead { font-size: 16px; }
  .cols, #doctrine .cols, #smart .cols, #meta .cols, #community .cols,
  .status-grid, .feed { grid-template-columns: 1fr; }
  .status-grid .block { min-height: 0; }
  .feed-card { min-height: 0; }
  .grid .card, .grid .slim, .block, #community .block, .step { padding: 19px; }
  #community .block { min-height: 0; }
  .site-footer { padding: 22px 18px; border-radius: 12px; }
  .footer-main, .footer-meta { align-items: flex-start; flex-direction: column; }
  .site-footer nav { justify-content: flex-start; gap: 8px 16px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}


/* Final cascade guard: keep the proposal within the approved restrained dark system. */
html, body {
  background: #070b09 !important;
  background-color: #070b09 !important;
}
html::before, html::after, body::before, body::after {
  display: none !important;
  content: none !important;
  animation: none !important;
  background: none !important;
  opacity: 0 !important;
}
body { color: #edf4ef !important; }
.hero {
  background: #0b120e !important;
  border: 1px solid rgba(20,241,149,.18) !important;
  box-shadow: 0 34px 80px -52px rgba(0,0,0,.9) !important;
}
.hero::before {
  background:
    radial-gradient(ellipse at 76% 48%, rgba(20,241,149,.16), transparent 34%),
    linear-gradient(90deg, rgba(7,11,9,.12) 0%, rgba(7,11,9,.2) 48%, rgba(7,11,9,.68) 100%),
    repeating-linear-gradient(0deg, transparent 0 43px, rgba(20,241,149,.12) 44px, transparent 45px),
    repeating-linear-gradient(90deg, transparent 0 43px, rgba(20,241,149,.12) 44px, transparent 45px) !important;
  opacity: .9 !important;
}
.hero::after { animation: none !important; }
.hero h1 span { color: #f2f7f3 !important; background: none !important; -webkit-text-fill-color: #f2f7f3 !important; }
.hero h1 em { color: var(--mint) !important; background: none !important; -webkit-text-fill-color: var(--mint) !important; animation: none !important; filter: none !important; }
.sec h2, .token-top h2, h1, h2, h3 {
  background: none !important;
  -webkit-text-fill-color: currentColor !important;
  text-shadow: none !important;
}
.sec h2 { color: #edf4ef !important; }
.hero .token {
  background: #0d1410 !important;
  border: 1px solid rgba(165,178,169,.2) !important;
  box-shadow: 0 24px 50px -36px rgba(0,0,0,.9), inset 0 1px 0 rgba(255,255,255,.025) !important;
  animation: none !important;
}
.glass, .block, .card, .feed-card, .step, #community .block, #status .block {
  background: #101713 !important;
  border: 1px solid rgba(165,178,169,.16) !important;
  border-radius: 12px !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  filter: none !important;
}
.glass:hover, .block:hover, .card:hover, .feed-card:hover, .step:hover,
.glass::after, .block::after, .feed-card::after, .step::after {
  box-shadow: none !important;
  filter: none !important;
  transform: none !important;
  opacity: 0 !important;
  animation: none !important;
}
.clean li, #tokenomics .block .clean li {
  background: #0d1410 !important;
  border: 1px solid rgba(165,178,169,.15) !important;
  box-shadow: none !important;
  color: #aebbb2 !important;
}
.note, #community + .note, #tokenomics .block .note, .quote {
  background: #0d1410 !important;
  box-shadow: none !important;
}
#status .block p {
  color: #c7d4cb !important;
  border-color: rgba(165,178,169,.22) !important;
  background: rgba(255,255,255,.035) !important;
  text-shadow: none !important;
}
#status .block p::before { background: var(--mint) !important; box-shadow: none !important; animation: none !important; }
.feed-card .pulse { box-shadow: none !important; }
.btn, .btn:hover, .btn:focus-visible, .menu, .nav-links, .site-footer, .site-footer a {
  animation: none !important;
  text-shadow: none !important;
}
.btn::before, .btn::after { display: none !important; content: none !important; }
.btn:hover, .btn:focus-visible { transform: none !important; }
.btn-mint, .btn-mint:hover, .btn-mint:focus-visible {
  background: var(--mint) !important;
  border-color: var(--mint) !important;
  color: #06110b !important;
  box-shadow: none !important;
}
.btn-glass, .btn-glass:hover, .btn-glass:focus-visible, #community .btn-glass {
  background: #101713 !important;
  border-color: #33483b !important;
  color: var(--ink) !important;
  box-shadow: none !important;
}
.site-footer {
  background: #0b120e !important;
  border: 1px solid rgba(165,178,169,.16) !important;
  box-shadow: none !important;
}
.nav, .is-scrolled .nav { background: rgba(7,11,9,.94) !important; box-shadow: none !important; }
@media (max-width: 760px) {
  .nav-links { background: #0c130f !important; border-color: var(--line) !important; box-shadow: 0 18px 40px -28px rgba(0,0,0,.9) !important; }
  .menu, .menu[aria-expanded="true"] { background: #101713 !important; border: 1px solid var(--line) !important; box-shadow: none !important; }
  .menu span { background: #edf4ef !important; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}
