/* FearNGreed — clean static CSS */
:root{
  --bg: #0b0d10;
  --fg: #e7f1f1;
  --muted:#99a2a2;
  --card:#12161a;
  --border:#1f262c;
  --fear:#ff7a00;   /* orange for Fear */
  --greed:#14b866;  /* green for Greed */
  --accent-grad: linear-gradient(90deg, var(--fear), var(--greed));
}

*{box-sizing:border-box}
html,body{padding:0;margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;background:var(--bg);color:var(--fg)}
a{color:inherit;text-decoration:none}
.container{max-width:1100px;margin:0 auto;padding:0 20px}
.btn{display:inline-flex;align-items:center;gap:.5rem;border:1px solid var(--border);padding:.8rem 1rem;border-radius:999px;background:transparent}
.btn.primary{background:var(--accent-grad);color:#0b0d10;border:0;font-weight:800}
.btn.ghost{background:transparent}
.btn.small{padding:.55rem .8rem;font-size:.9rem}

.site-header{position:sticky;top:0;z-index:50;background:rgba(11,13,16,.7);backdrop-filter: blur(12px);border-bottom:1px solid var(--border)}
.nav{display:flex;align-items:center;justify-content:space-between;height:64px}
.brand{display:flex;align-items:center;gap:.6rem;font-weight:800;letter-spacing:.2px}
.brand img{height:28px;width:auto}
.menu{display:none;gap:1rem}
.menu a{padding:.4rem .7rem;border-radius:999px;border:1px solid transparent}
.menu a:hover{border-color:var(--border)}
.menu .pill{border-color:var(--border)}
.cta{display:flex;align-items:center;gap:.6rem}
#themeToggle{border:1px solid var(--border);background:transparent;border-radius:999px;padding:.4rem .6rem;color:var(--fg)}

@media(min-width:860px){ .menu{display:flex} }

.hero{position:relative;overflow:hidden;padding:72px 0 24px;border-bottom:1px solid var(--border)}
.hero-grid{display:grid;gap:24px;grid-template-columns:1.2fr .8fr;align-items:center}
.hero-copy h1{font-size:clamp(2.2rem,3.8vw,3.4rem);line-height:1.05;margin:0 0 .6rem}
.hero-copy .fade{background:linear-gradient(180deg,var(--fear),#ffa85a);-webkit-background-clip:text;background-clip:text;color:transparent;filter:saturate(120%)}
.hero-copy .pop{background:linear-gradient(180deg,var(--greed),#73e2a7);-webkit-background-clip:text;background-clip:text;color:transparent;filter:saturate(120%)}
.subtitle{color:var(--muted);max-width:46ch;margin-bottom:1rem}
.actions{display:flex;gap:.8rem;margin:1rem 0 1.2rem}
.contract{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;margin-bottom:1rem}
.contract code{padding:.4rem .6rem;background:#0f1317;border:1px solid var(--border);border-radius:8px}
.copy{border:1px solid var(--border);background:transparent;border-radius:8px;padding:.4rem .6rem;color:var(--fg)}

.wallets{display:flex;flex-wrap:wrap;gap:.6rem}
.wallet{border:1px solid var(--border);border-radius:10px;padding:.6rem .8rem;background:#0f1317}
.wallet:hover{border-color:#2b343a}

.hero-art{position:relative;height:320px;display:flex;align-items:center;justify-content:center}
.hero-art .badge{height:140px;z-index:2;filter:drop-shadow(0 8px 24px rgba(0,0,0,.6))}
.orb{position:absolute;border-radius:999px;filter:blur(40px);opacity:.55}
.orb-left{left:-10%;top:-10%;width:380px;height:380px;background:radial-gradient(circle at 30% 30%, rgba(255,122,0,.9), rgba(255,122,0,.05))}
.orb-right{right:-6%;bottom:-20%;width:420px;height:420px;background:radial-gradient(circle at 70% 70%, rgba(20,184,102,.85), rgba(20,184,102,.08))}

.ticker{overflow:hidden;border-top:1px solid var(--border);border-bottom:1px solid var(--border);margin-top:16px}
.ticker .track{display:flex;gap:2rem;white-space:nowrap;animation:scroll 24s linear infinite;padding:.5rem 0;color:#cdd6d6}
@keyframes scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}

.section{padding:56px 0;border-bottom:1px solid var(--border)}
.two-col{display:grid;gap:18px}
@media(min-width:860px){ .two-col{grid-template-columns:1fr 1fr} }

.card{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:20px}
.card.highlight{border-color:rgba(255,122,0,.35);box-shadow:0 0 0 1px rgba(20,184,102,.25) inset}
.card.stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.stat{background:#0f1317;border:1px solid var(--border);border-radius:12px;padding:12px}
.label{color:var(--muted);font-size:.85rem}
.value{font-weight:800;font-size:1.1rem}

.checklist{margin:.8rem 0 0;padding-left:1.1rem}
.checklist li{margin:.35rem 0}

#tokenomics h2, #howtobuy h2, #community h2, #roadmap h2{margin-top:0}
.tokenomics-grid{display:grid;gap:16px}
@media(min-width:860px){ .tokenomics-grid{grid-template-columns:repeat(3,1fr)} }
.token-card{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:18px}
.token-card .icon{height:36px;width:36px;border-radius:10px;display:grid;place-items:center;background:var(--accent-grad);color:#0b0d10;margin-bottom:10px}

.steps{margin:0 0 .6rem;padding-left:1.2rem}
.quick-links{display:flex;gap:.6rem;flex-wrap:wrap}

.roadmap{display:grid;gap:16px}
@media(min-width:860px){ .roadmap{grid-template-columns:repeat(3,1fr)} }
.phase{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:18px}

.socials{display:flex;gap:.6rem;flex-wrap:wrap;margin-top:.6rem}
.social{border:1px solid var(--border);border-radius:999px;padding:.6rem .9rem}
.social:hover{border-color:#2b343a}

.signup input{width:100%;background:#0f1317;border:1px solid var(--border);border-radius:10px;padding:.6rem .8rem;color:var(--fg);margin-bottom:.6rem}

.site-footer{padding:24px 0}
.footer-grid{display:grid;align-items:center;gap:12px;grid-template-columns:1fr;justify-items:center;color:#c9d1d1}
@media(min-width:860px){ .footer-grid{grid-template-columns:auto 1fr auto;justify-items:stretch} }
.foot-brand{display:flex;align-items:center;gap:.5rem}
.foot-brand img{height:22px}
.foot-links{display:flex;gap:.9rem;justify-content:center}
.foot-copy{font-size:.9rem;color:var(--muted);text-align:center}

.fear{color:var(--fear)}
.greed{color:var(--greed)}

/* Light theme */
.light{--bg:#f8faf9;--fg:#0a0d0c;--muted:#5a6362;--card:#ffffff;--border:#e6ecea}
.light .hero{border-bottom-color:#e6ecea}
.light .ticker{border-color:#e6ecea}
.light .wallet{background:#f3f6f5}
