/* cryptco.in - Crypt Keeper meme coin theme */
:root{
  --bg:#07090a; --bg2:#0d1110; --panel:#111614; --line:#1f2a25;
  --ink:#e9efe6; --dim:#9bb39e; --mut:#5f7565;
  --toxic:#5dff8a; --toxic2:#39c46a; --blood:#b8203a; --purple:#7a3cff; --bone:#e7e0cf;
  --radius:14px; --max:1040px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0; background:
    radial-gradient(1200px 500px at 50% -10%, rgba(93,255,138,.10), transparent 60%),
    radial-gradient(900px 500px at 80% 120%, rgba(122,60,255,.10), transparent 60%),
    var(--bg);
  color:var(--ink); font:16px/1.65 "Special Elite","Courier New",monospace;
  -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
a{color:inherit;text-decoration:none}
.fog{position:fixed;inset:0;pointer-events:none;z-index:0;
  background:radial-gradient(600px 300px at 20% 80%, rgba(93,255,138,.05), transparent 70%);}
main{position:relative;z-index:1;max-width:var(--max);margin:0 auto;padding:0 22px}

/* nav */
.site-nav{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;
  max-width:var(--max);margin:0 auto;padding:18px 22px}
.brand{font-size:1.25rem;letter-spacing:.04em;display:flex;align-items:center;gap:8px}
.brand-logo{width:34px;height:34px;border-radius:50%;vertical-align:middle;
  filter:drop-shadow(0 0 6px rgba(93,255,138,.6))}
.skull{filter:drop-shadow(0 0 6px var(--toxic))}
.ticker{color:var(--toxic);font-weight:700}
.site-nav nav{display:flex;gap:18px;align-items:center;flex-wrap:wrap}
.site-nav nav a{color:var(--dim);font-size:.95rem}
.site-nav nav a:hover{color:var(--toxic)}
.nav-cta{padding:8px 14px;border:1px solid var(--toxic2);border-radius:999px;color:var(--toxic)!important}
.nav-cta:hover{background:rgba(93,255,138,.1)}

/* hero */
.hero{text-align:center;padding:40px 0 30px}
.keeper{width:200px;height:200px;border-radius:50%;margin:0 auto 14px;display:block;
  filter:drop-shadow(0 0 26px rgba(93,255,138,.45));
  animation:float 5s ease-in-out infinite}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
.kicker{color:var(--purple);letter-spacing:.18em;text-transform:uppercase;font-size:.8rem;margin:0 0 10px}
.title{font-family:"Creepster",cursive;font-weight:400;font-size:clamp(3.4rem,12vw,7rem);
  line-height:.95;margin:0;color:var(--toxic);letter-spacing:.04em;
  text-shadow:0 0 18px rgba(93,255,138,.55), 0 0 50px rgba(93,255,138,.25);}
.title .co{color:var(--bone);text-shadow:0 0 16px rgba(231,224,207,.4)}
.sub{font-size:1.3rem;color:var(--bone);margin:10px 0 6px}
.sub em{color:var(--toxic);font-style:italic}
.lede{color:var(--dim);max-width:36em;margin:0 auto 26px}

/* countdown */
.countdown{display:flex;gap:14px;justify-content:center;margin:6px 0 4px;flex-wrap:wrap}
.cd{background:var(--panel);border:1px solid var(--line);border-radius:12px;
  padding:14px 18px;min-width:92px;box-shadow:inset 0 0 22px rgba(93,255,138,.06)}
.cd .num{display:block;font-family:"Creepster",cursive;font-size:2.4rem;color:var(--toxic);
  text-shadow:0 0 12px rgba(93,255,138,.5);line-height:1}
.cd .lbl{display:block;font-size:.75rem;color:var(--mut);text-transform:uppercase;letter-spacing:.12em;margin-top:4px}
.until{color:var(--mut);font-size:.85rem;letter-spacing:.1em;text-transform:uppercase;margin:6px 0 26px}

/* buttons */
.hero-cta{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.btn{display:inline-block;padding:13px 24px;border-radius:10px;font-weight:700;letter-spacing:.03em;
  transition:transform .12s ease,box-shadow .12s ease,filter .12s ease}
.btn:hover{transform:translateY(-2px)}
.btn-toxic{background:linear-gradient(135deg,var(--toxic),var(--toxic2));color:#05140a;
  box-shadow:0 0 22px rgba(93,255,138,.35)}
.btn-toxic:hover{box-shadow:0 0 30px rgba(93,255,138,.55)}
.btn-ghost{border:1px solid var(--line);color:var(--bone)}
.btn-ghost:hover{border-color:var(--toxic2);color:var(--toxic)}

/* panels */
.panel{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);
  padding:30px 32px;margin:22px 0}
.panel h2{font-family:"Creepster",cursive;font-weight:400;font-size:2rem;color:var(--toxic);
  letter-spacing:.04em;margin:0 0 14px;text-shadow:0 0 12px rgba(93,255,138,.3)}
.panel p{color:var(--dim)}
.note{color:var(--mut);font-size:.9rem;margin-top:14px}

/* tokenomics */
.tokgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:8px}
.tok{background:var(--bg2);border:1px solid var(--line);border-radius:12px;padding:18px;text-align:center}
.tnum{display:block;font-family:"Creepster",cursive;font-size:1.8rem;color:var(--bone)}
.tlbl{display:block;color:var(--mut);font-size:.8rem;text-transform:uppercase;letter-spacing:.08em;margin-top:4px}

/* how to buy */
.steps{color:var(--dim);padding-left:22px;line-height:1.9}
.steps strong{color:var(--toxic)}
.contract{margin-top:16px;background:var(--bg2);border:1px dashed var(--blood);border-radius:10px;
  padding:14px 16px;color:var(--bone)}
.contract code{color:var(--blood)}

/* summon */
.summon{text-align:center;background:
  radial-gradient(500px 200px at 50% 0%, rgba(122,60,255,.12), transparent 70%), var(--panel);
  border:1px solid var(--line);border-radius:var(--radius);padding:44px 24px;margin:24px 0 50px}
.summon h2{font-family:"Creepster",cursive;font-weight:400;font-size:2.2rem;color:var(--toxic);
  margin:0 0 8px;text-shadow:0 0 14px rgba(93,255,138,.4)}
.summon p{color:var(--dim);max-width:36em;margin:0 auto 20px}
.signup{display:flex;gap:10px;max-width:460px;margin:0 auto;flex-wrap:wrap}
.signup input{flex:1;min-width:220px;padding:14px 16px;border-radius:10px;border:1px solid var(--line);
  background:#0a0d0c;color:var(--ink);font:inherit}
.signup input:focus{outline:none;border-color:var(--toxic2)}
.signup button{padding:14px 22px;border:0;border-radius:10px;font-weight:700;cursor:pointer;
  background:linear-gradient(135deg,var(--toxic),var(--toxic2));color:#05140a}
.signup button:hover{filter:brightness(1.1)}
.form-ok{color:var(--toxic);font-weight:700}
.form-err{color:var(--blood);font-weight:700}
.socials{color:var(--mut);margin-top:18px;font-size:.9rem}
.socials span{color:var(--dim)}

/* legal */
.legal-page{color:var(--ink);max-width:840px;margin:0 auto}
.legal-page h1{font-family:"Creepster",cursive;font-weight:400;color:var(--toxic)}
.legal-page h2{color:var(--toxic2);margin-top:1.8em}
.legal-page a{color:var(--toxic)}

/* footer */
.site-footer{position:relative;z-index:1;border-top:1px solid var(--line);margin-top:30px}
.foot-grid{max-width:var(--max);margin:0 auto;padding:36px 22px 16px;
  display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:22px}
.foot-brand{font-size:1.1rem}
.foot-tag{color:var(--mut);margin:10px 0 0;font-size:.9rem}
.foot-links,.foot-contact{display:flex;flex-direction:column;gap:9px;padding-top:6px}
.foot-links a,.foot-contact a{color:var(--dim);font-size:.92rem}
.foot-links a:hover,.foot-contact a:hover{color:var(--toxic)}
.foot-disc{max-width:var(--max);margin:0 auto;padding:10px 22px;color:var(--mut);font-size:.78rem;line-height:1.5}
.foot-legal{max-width:var(--max);margin:0 auto;padding:14px 22px 28px;color:var(--mut);
  font-size:.82rem;border-top:1px solid var(--line)}

@media(max-width:780px){
  .tokgrid{grid-template-columns:repeat(2,1fr)}
  .foot-grid{grid-template-columns:1fr;gap:16px}
}
