/* =========================================================
   NOT ANONYMOUS CAT ($NOTAC) — stylesheet
   ========================================================= */

:root{
  --bg:        #14100b;
  --bg-soft:   #1f1811;
  --panel:     #241b13;
  --kraft:     #a9773f;
  --kraft-2:   #c9a479;
  --cream:     #f3e7d6;
  --cream-dim: #cdbca6;
  --gold:      #e8b464;
  --gold-2:    #ffd48a;
  --ink:       #201509;
  --line:      rgba(243,231,214,0.14);
  --shadow:    0 20px 60px rgba(0,0,0,0.45);
  --radius:    18px;
  --radius-sm: 10px;
  --ff-head:   'Fredoka', system-ui, sans-serif;
  --ff-body:   'Space Grotesk', system-ui, sans-serif;
  --ease:      cubic-bezier(.16,.84,.44,1);
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:auto; }
body{
  margin:0;
  background:var(--bg);
  color:var(--cream);
  font-family:var(--ff-body);
  overflow-x:hidden;
  cursor:default;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
h1,h2,h3{ font-family:var(--ff-head); margin:0; line-height:1.05; }
p{ margin:0; color:var(--cream-dim); line-height:1.6; }
button{ font-family:inherit; cursor:pointer; }
::selection{ background:var(--gold); color:var(--ink); }

.section-inner{
  max-width:1180px;
  margin:0 auto;
  padding:0 28px;
  position:relative;
  z-index:2;
}
.eyebrow{
  display:inline-block;
  font-family:var(--ff-body);
  font-weight:600;
  letter-spacing:.14em;
  text-transform:uppercase;
  font-size:12.5px;
  color:var(--gold);
  margin-bottom:14px;
}
.section-title{
  font-size:clamp(28px,4vw,44px);
  font-weight:600;
  color:var(--cream);
  margin-bottom:10px;
}
.section-head{ max-width:640px; margin-bottom:48px; }

/* ================= GRAIN / VIGNETTE ================= */
.grain-overlay{
  position:fixed; inset:0; z-index:9997; pointer-events:none;
  background-image:url('assets/images/grain.png');
  background-size:220px 220px;
  opacity:.5;
  mix-blend-mode:overlay;
}
.vignette-overlay{
  position:fixed; inset:0; z-index:9996; pointer-events:none;
  background:radial-gradient(ellipse at center, rgba(0,0,0,0) 45%, rgba(10,7,4,0.55) 100%);
}

/* ================= SCROLL PROGRESS ================= */
.scroll-progress{
  position:fixed; top:0; left:0; width:100%; height:3px; z-index:9999;
  background:rgba(255,255,255,0.06);
}
.scroll-progress span{
  display:block; height:100%; width:0%;
  background:linear-gradient(90deg,var(--kraft),var(--gold-2));
}

/* ================= CUSTOM CURSOR ================= */
.cursor-dot{
  position:fixed; top:0; left:0; width:22px; height:22px;
  border:2px solid var(--gold); border-radius:50%;
  transform:translate(-50%,-50%);
  pointer-events:none; z-index:9998;
  mix-blend-mode:difference;
  transition:width .2s var(--ease),height .2s var(--ease),opacity .2s;
  opacity:0;
}
@media (hover:hover) and (pointer:fine){
  .cursor-dot{ opacity:1; }
}
.cursor-dot.is-active{ width:44px; height:44px; background:rgba(232,180,100,0.25); }

/* ================= PRELOADER ================= */
.preloader{
  position:fixed; inset:0; z-index:10000;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  background:var(--bg);
  overflow:hidden;
}
.preloader-bg{
  position:absolute; inset:0;
  background-size:cover; background-position:center;
  opacity:.55; filter:saturate(1.1);
  transform:scale(1.1);
}
.preloader-img{
  position:relative; z-index:2;
  width:min(46vw,320px); aspect-ratio:1/1; object-fit:cover;
  border-radius:28px;
  box-shadow:0 30px 80px rgba(0,0,0,0.6);
  animation:preloaderFloat 2.6s ease-in-out infinite;
}
@keyframes preloaderFloat{
  0%,100%{ transform:translateY(0) rotate(-1.5deg); }
  50%{ transform:translateY(-16px) rotate(1.5deg); }
}
.preloader-text{ position:relative; z-index:2; margin-top:28px; text-align:center; }
.preloader-title{
  display:block; font-family:var(--ff-head); font-weight:600;
  letter-spacing:.08em; font-size:clamp(18px,3vw,26px); color:var(--cream);
  margin-bottom:16px;
}
.preloader-bar{
  width:min(70vw,280px); height:6px; border-radius:6px;
  background:rgba(255,255,255,0.12); overflow:hidden; margin:0 auto;
}
.preloader-bar span{
  display:block; height:100%; width:0%;
  background:linear-gradient(90deg,var(--kraft),var(--gold-2));
  transition:width .15s linear;
}
.preloader-pct{ display:block; margin-top:10px; font-size:13px; color:var(--cream-dim); letter-spacing:.05em; }
body.preloading{ overflow:hidden; height:100%; }
.preloader.is-hidden{
  animation:preloaderOut .8s var(--ease) forwards;
  pointer-events:none;
}
@keyframes preloaderOut{
  to{ opacity:0; transform:scale(1.03); visibility:hidden; }
}

/* ================= HEADER ================= */
.site-header{
  position:fixed; top:0; left:0; right:0; z-index:500;
  display:flex; align-items:center; justify-content:space-between;
  padding:16px clamp(18px,4vw,40px);
  background:linear-gradient(to bottom, rgba(20,16,11,.85), rgba(20,16,11,0));
  backdrop-filter:blur(2px);
  transition:background .3s ease, padding .3s ease, box-shadow .3s ease;
}
.site-header.is-scrolled{
  background:rgba(18,14,9,0.86);
  backdrop-filter:blur(10px);
  box-shadow:0 10px 30px rgba(0,0,0,0.3);
  padding-top:10px; padding-bottom:10px;
}
.brand{ display:flex; align-items:center; gap:10px; }
.brand-mark{ width:38px; height:38px; border-radius:50%; object-fit:cover; border:2px solid var(--gold); }
.brand-name{ font-family:var(--ff-head); font-weight:600; font-size:19px; letter-spacing:.02em; }
.main-nav{ display:flex; gap:28px; }
.nav-link{
  font-size:14px; font-weight:500; color:var(--cream-dim);
  position:relative; padding:4px 0; transition:color .2s;
}
.nav-link::after{
  content:''; position:absolute; left:0; bottom:0; height:2px; width:0;
  background:var(--gold); transition:width .25s var(--ease);
}
.nav-link:hover{ color:var(--cream); }
.nav-link:hover::after{ width:100%; }
.header-actions{ display:flex; align-items:center; gap:10px; }
.icon-btn{
  width:38px; height:38px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:rgba(255,255,255,0.08); border:1px solid var(--line);
  transition:transform .25s var(--ease), background .25s;
}
.icon-btn svg{ width:17px; height:17px; fill:var(--cream); }
.icon-btn:hover{ transform:translateY(-3px) rotate(-6deg); background:var(--gold); }
.icon-btn:hover svg{ fill:var(--ink); }
.hamburger{
  display:none; width:38px; height:38px; border-radius:50%;
  background:rgba(255,255,255,0.08); border:1px solid var(--line);
  flex-direction:column; align-items:center; justify-content:center; gap:4px;
}
.hamburger span{ width:16px; height:2px; background:var(--cream); border-radius:2px; transition:transform .25s var(--ease), opacity .25s var(--ease); }

/* ================= BUTTONS ================= */
.btn{
  display:inline-flex; align-items:center; gap:10px;
  padding:15px 26px; border-radius:999px;
  font-weight:600; font-size:15px; font-family:var(--ff-body);
  border:2px solid transparent;
  transition:transform .25s var(--ease), box-shadow .25s var(--ease), background .25s;
  white-space:nowrap;
}
.btn-icon{ font-size:17px; }
.btn-primary{
  background:linear-gradient(135deg,var(--gold-2),var(--kraft));
  color:var(--ink);
  box-shadow:0 12px 30px rgba(232,180,100,0.28);
}
.btn-primary:hover{ transform:translateY(-3px) scale(1.02); box-shadow:0 18px 40px rgba(232,180,100,0.4); }
.btn-ghost{
  background:rgba(255,255,255,0.06);
  border-color:var(--line);
  color:var(--cream);
}
.btn-ghost:hover{ background:rgba(255,255,255,0.12); transform:translateY(-3px); border-color:var(--gold); }

.hero-ctas{ display:flex; flex-wrap:wrap; gap:14px; margin:30px 0 22px; }

.ca-pill{
  display:inline-flex; align-items:center; gap:12px;
  background:rgba(0,0,0,0.28); border:1px solid var(--line);
  border-radius:999px; padding:9px 9px 9px 18px;
  color:var(--cream-dim); font-size:13px;
}
.ca-label{ font-weight:700; color:var(--gold); letter-spacing:.06em; }
.ca-value{
  font-family:monospace; font-size:12.5px; color:var(--cream);
  max-width:180px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.ca-copy-icon{
  width:30px; height:30px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  background:var(--gold); color:var(--ink); font-size:14px; transition:transform .2s var(--ease);
}
.ca-pill:hover .ca-copy-icon{ transform:scale(1.12) rotate(-8deg); }
.ca-pill.is-copied .ca-copy-icon{ background:#7bd88f; }

/* ================= HERO ================= */
.hero{
  position:relative; min-height:100vh; min-height:100svh;
  display:flex; align-items:center;
  padding:130px 0 70px;
  overflow:hidden;
  perspective:1200px;
}
.hero-bg-layer{
  position:absolute; inset:-6% -6%;
  background-size:cover; background-position:center;
  will-change:transform;
}
.hero-glow{
  position:absolute; inset:0;
  background:radial-gradient(60% 55% at 78% 45%, rgba(232,180,100,0.22), transparent 70%);
}
.hero-inner{
  position:relative; z-index:2;
  max-width:1180px; margin:0 auto; padding:0 28px;
  display:grid; grid-template-columns:1.1fr .9fr; gap:40px; align-items:center;
  width:100%;
}
.hero-title{
  font-size:clamp(46px,8vw,96px);
  color:var(--cream);
  text-transform:uppercase;
}
.hero-title .line{ display:block; }
.hero-title-outline{
  color:transparent;
  -webkit-text-stroke:2px var(--gold-2);
  text-stroke:2px var(--gold-2);
}
.hero-tagline{ max-width:460px; font-size:17px; margin-top:20px; color:var(--cream-dim); }
.hero-tagline strong{ color:var(--gold-2); }

.hero-visual{ position:relative; display:flex; justify-content:center; }
.hero-tilt{
  position:relative; width:min(100%,420px); aspect-ratio:.78/1;
  transform-style:preserve-3d; will-change:transform;
  transition:transform .15s ease-out;
}
.hero-cutout{
  position:relative; z-index:3; width:100%; height:100%; object-fit:contain;
  filter:drop-shadow(0 40px 60px rgba(0,0,0,0.55));
  transform:translateZ(40px);
}
.hero-ring{
  position:absolute; border-radius:50%; border:1.5px dashed rgba(232,180,100,0.35);
  animation:spin 22s linear infinite;
}
.ring-1{ inset:6% ; transform:translateZ(-10px); }
.ring-2{ inset:-4%; border-color:rgba(243,231,214,0.14); animation-duration:32s; animation-direction:reverse; transform:translateZ(-30px); }
@keyframes spin{ to{ transform:translateZ(-10px) rotate(360deg); } }

.hero-coin{
  position:absolute; top:6%; right:-4%; width:88px; height:88px;
  transform-style:preserve-3d; animation:coinFlip 5s linear infinite;
  z-index:4;
}
@keyframes coinFlip{ from{ transform:rotateY(0deg);} to{ transform:rotateY(360deg);} }
.coin-face{
  position:absolute; inset:0; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  backface-visibility:hidden; box-shadow:0 10px 26px rgba(0,0,0,0.4);
  border:3px solid var(--gold-2);
  overflow:hidden;
}
.coin-front img{ width:100%; height:100%; object-fit:cover; }
.coin-back{
  background:linear-gradient(135deg,var(--kraft),var(--gold));
  color:var(--ink); font-family:var(--ff-head); font-weight:700; font-size:34px;
  transform:rotateY(180deg);
}

.scroll-cue{
  position:absolute; left:50%; bottom:26px; transform:translateX(-50%);
  width:26px; height:42px; border:2px solid var(--line); border-radius:16px;
  z-index:3;
}
.scroll-cue span{
  position:absolute; top:7px; left:50%; width:4px; height:8px; margin-left:-2px;
  background:var(--gold); border-radius:3px; animation:cueMove 1.8s ease-in-out infinite;
}
@keyframes cueMove{ 0%{ opacity:1; transform:translateY(0);} 70%{opacity:0; transform:translateY(14px);} 100%{opacity:0; transform:translateY(0);} }

/* ================= TICKER ================= */
.ticker{
  position:relative; z-index:3;
  background:linear-gradient(90deg,var(--kraft),var(--gold-2));
  color:var(--ink); overflow:hidden; padding:13px 0;
  transform:rotate(-1.2deg) scale(1.02);
  box-shadow:0 10px 30px rgba(0,0,0,0.3);
}
.ticker-track{ display:flex; width:max-content; animation:tickerScroll 26s linear infinite; }
.ticker-track span{
  font-family:var(--ff-head); font-weight:600; font-size:15px; letter-spacing:.04em;
  white-space:nowrap; padding-right:0;
}
@keyframes tickerScroll{ from{ transform:translateX(0);} to{ transform:translateX(-50%);} }

/* ================= LORE ================= */
.lore{
  position:relative; padding:120px 0;
  background-size:cover; background-position:center;
}
.lore::before{
  content:''; position:absolute; inset:0; background:rgba(20,16,11,0.55);
}
.lore-grid{
  display:grid; grid-template-columns:.85fr 1.15fr; gap:60px; align-items:center;
}
.lore-media{ position:relative; }
.lore-img{
  border-radius:var(--radius); box-shadow:var(--shadow);
  aspect-ratio:4/5; object-fit:cover; width:100%;
}
.lore-tag{
  position:absolute; bottom:-16px; left:-16px;
  background:var(--gold); color:var(--ink); font-weight:700; font-size:12px;
  padding:8px 16px; border-radius:999px; letter-spacing:.04em; text-transform:uppercase;
  box-shadow:0 10px 24px rgba(0,0,0,0.35);
}
.lore-copy p{ margin-bottom:16px; font-size:16px; }

/* ================= HOW TO BUY ================= */
.how-to-buy{ padding:120px 0; background:var(--bg); }
.steps-grid{
  display:grid; grid-template-columns:repeat(4,1fr); gap:22px;
}
.step-card{
  background:var(--panel); border:1px solid var(--line); border-radius:var(--radius);
  padding:28px 22px; transform-style:preserve-3d;
  transition:transform .3s var(--ease), border-color .3s;
}
.step-card:hover{ border-color:var(--gold); }
.step-num{
  display:inline-block; font-family:var(--ff-head); font-size:14px; font-weight:600;
  color:var(--ink); background:var(--gold); padding:5px 12px; border-radius:999px; margin-bottom:16px;
}
.step-card h3{ font-size:19px; margin-bottom:8px; color:var(--cream); }
.step-card p{ font-size:14px; }
.steps-cta{ display:flex; flex-wrap:wrap; align-items:center; gap:16px; margin-top:44px; }

/* ================= CHART / TOKENOMICS ================= */
.chart-section{
  position:relative; padding:120px 0; background-size:cover; background-position:center;
}
.chart-section::before{ content:''; position:absolute; inset:0; background:rgba(15,11,7,0.4); }
.tokenomics-grid{
  display:grid; grid-template-columns:repeat(4,1fr); gap:18px; margin-bottom:44px;
}
.token-chip{
  background:rgba(255,255,255,0.06); border:1px solid var(--line); border-radius:var(--radius-sm);
  padding:22px 18px; text-align:center;
}
.chip-value{ display:block; font-family:var(--ff-head); font-size:22px; color:var(--gold-2); margin-bottom:6px; }
.chip-label{ font-size:12.5px; letter-spacing:.04em; text-transform:uppercase; color:var(--cream-dim); }
.chart-embed-wrap{
  position:relative; border-radius:var(--radius); overflow:hidden; border:1px solid var(--line);
  background:#0c0a08; aspect-ratio:16/9; box-shadow:var(--shadow);
}
.chart-embed-wrap iframe{ position:absolute; inset:0; width:100%; height:100%; }
.chart-fallback{
  position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:16px; text-align:center; background:linear-gradient(160deg,#20160d,#0d0a07);
}

/* ================= ROADMAP ================= */
.roadmap{ padding:120px 0; background:var(--bg-soft); }
.roadmap-track{ position:relative; padding-left:32px; }
.roadmap-line{
  position:absolute; left:9px; top:6px; bottom:6px; width:2px;
  background:linear-gradient(var(--gold),transparent);
}
.roadmap-item{ position:relative; padding:0 0 46px 30px; }
.roadmap-item:last-child{ padding-bottom:0; }
.roadmap-dot{
  position:absolute; left:-32px; top:2px; width:20px; height:20px; border-radius:50%;
  background:var(--gold); border:4px solid var(--bg-soft); box-shadow:0 0 0 2px var(--gold);
}
.roadmap-phase{ font-size:12.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--gold); font-weight:600; }
.roadmap-item h3{ font-size:23px; margin:8px 0; color:var(--cream); }
.roadmap-item p{ max-width:520px; }

/* ================= GALLERY ================= */
.gallery{ padding:120px 0; background:var(--bg); }
.gallery-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.gallery-item{
  margin:0; position:relative; border-radius:var(--radius); overflow:hidden;
  aspect-ratio:3/4; border:1px solid var(--line); transform-style:preserve-3d;
}
.gallery-item img{ width:100%; height:100%; object-fit:cover; transition:transform .5s var(--ease); }
.gallery-item:hover img{ transform:scale(1.08); }
.gallery-item figcaption{
  position:absolute; left:0; right:0; bottom:0; padding:16px;
  font-size:12.5px; font-weight:600; letter-spacing:.03em;
  background:linear-gradient(to top, rgba(10,7,4,0.9), transparent);
  color:var(--cream);
}

/* ================= FINAL CTA ================= */
.final-cta{
  position:relative; padding:140px 0; background-size:cover; background-position:center; text-align:center;
}
.final-cta::before{ content:''; position:absolute; inset:0; background:rgba(15,11,7,0.72); }
.final-cta-inner{ display:flex; flex-direction:column; align-items:center; }
.final-cta-avatar{
  width:110px; height:110px; border-radius:50%; object-fit:cover;
  border:3px solid var(--gold); margin-bottom:24px; box-shadow:0 20px 50px rgba(0,0,0,0.5);
}
.final-cta .section-title{ max-width:560px; margin:0 auto 8px; }
.final-cta .hero-ctas{ justify-content:center; }

/* ================= FOOTER ================= */
.site-footer{
  background:#0f0b07; padding:80px 0 30px; position:relative; border-top:1px solid var(--line);
}
.footer-top{ text-align:center; margin-bottom:50px; }
.footer-mark{ width:56px; height:56px; border-radius:50%; margin:0 auto 14px; border:2px solid var(--gold); }
.footer-top h3{ font-size:26px; color:var(--cream); margin-bottom:6px; }
.footer-top p{ font-size:14px; }
.footer-links-block{ text-align:center; margin-bottom:38px; }
.footer-label{
  display:block; font-size:12px; letter-spacing:.12em; text-transform:uppercase;
  color:var(--gold); margin-bottom:16px; font-weight:600;
}
.footer-btn-row{ display:flex; flex-wrap:wrap; justify-content:center; gap:12px; }
.footer-link-btn{
  padding:10px 20px; border-radius:999px; background:rgba(255,255,255,0.06);
  border:1px solid var(--line); font-size:14px; font-weight:500;
  transition:all .25s var(--ease);
}
.footer-link-btn:hover{ background:var(--gold); color:var(--ink); transform:translateY(-3px); }
.footer-action-btn{
  padding:12px 22px; border-radius:999px; font-weight:600; font-size:14px;
  border:1px solid var(--line); background:rgba(255,255,255,0.06); color:var(--cream);
  transition:all .25s var(--ease); display:inline-flex; align-items:center; gap:8px;
}
.footer-action-btn:hover{ transform:translateY(-3px); box-shadow:0 14px 30px rgba(0,0,0,0.35); }
.action-pump:hover{ background:linear-gradient(135deg,var(--gold-2),var(--kraft)); color:var(--ink); }
.action-tg:hover{ background:#2AABEE; color:#fff; border-color:#2AABEE; }
.action-x:hover{ background:#fff; color:#000; border-color:#fff; }
.action-dex:hover{ background:#1b2a4a; color:#8ec8ff; border-color:#8ec8ff; }
.action-ca:hover{ background:#7bd88f; color:#0f2415; border-color:#7bd88f; }
.footer-bottom{ text-align:center; border-top:1px solid var(--line); padding-top:26px; }
.footer-bottom p{ font-size:12px; max-width:640px; margin:0 auto 10px; color:rgba(205,188,166,0.55); }
.copyright{ font-size:12px; color:var(--cream-dim); }

/* ================= TOAST ================= */
.copy-toast{
  position:fixed; left:50%; bottom:32px; transform:translate(-50%,20px);
  background:var(--gold); color:var(--ink); font-weight:600; font-size:14px;
  padding:12px 22px; border-radius:999px; z-index:9999;
  opacity:0; pointer-events:none; transition:all .35s var(--ease);
  box-shadow:0 14px 30px rgba(0,0,0,0.35);
}
.copy-toast.is-visible{ opacity:1; transform:translate(-50%,0); }

/* ================= REVEAL ANIMATION BASE ================= */
[data-reveal]{ opacity:0; transform:translateY(40px); }
[data-reveal].is-inview{
  animation:revealUp .9s var(--ease) forwards;
}
@keyframes revealUp{ to{ opacity:1; transform:translateY(0); } }

/* ================= RESPONSIVE ================= */
@media (max-width:980px){
  .main-nav{
    display:none;
    position:fixed; top:70px; right:16px; left:16px;
    background:rgba(18,14,9,0.97); border:1px solid var(--line);
    border-radius:var(--radius); padding:18px; flex-direction:column; gap:4px;
    box-shadow:var(--shadow); z-index:499;
  }
  .main-nav.is-open{ display:flex; }
  .main-nav .nav-link{ padding:12px 8px; border-bottom:1px solid var(--line); }
  .main-nav .nav-link:last-child{ border-bottom:none; }
  .hamburger{ display:flex; }
  .hamburger.is-open span:nth-child(1){ transform:translateY(6px) rotate(45deg); }
  .hamburger.is-open span:nth-child(2){ opacity:0; }
  .hamburger.is-open span:nth-child(3){ transform:translateY(-6px) rotate(-45deg); }
  .hero-inner{ grid-template-columns:1fr; text-align:center; }
  .hero-tagline{ margin-left:auto; margin-right:auto; }
  .hero-ctas{ justify-content:center; }
  .lore-grid{ grid-template-columns:1fr; }
  .steps-grid{ grid-template-columns:repeat(2,1fr); }
  .tokenomics-grid{ grid-template-columns:repeat(2,1fr); }
  .gallery-grid{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:560px){
  .steps-grid{ grid-template-columns:1fr; }
  .gallery-grid{ grid-template-columns:1fr; }
  .hero{ padding-top:110px; }
  .hero-coin{ display:none; }
  .cursor-dot{ display:none; }
}

/* honor reduced-motion preference */
@media (prefers-reduced-motion: reduce){
  *{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; }
}