* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: #0b0a08; color:#eee7da; font-family:'Space Mono',monospace; width:100%; overflow-x:hidden; }

@keyframes flicker {
  0%, 19%, 21%, 23%, 54%, 56%, 100% { opacity: 1; }
  20%, 22%, 55% { opacity: 0.72; }
  50% { opacity: 0.88; }
}
@keyframes grainshift {
  0% { transform: translate(0,0); }
  10% { transform: translate(-2%,-3%); }
  20% { transform: translate(-4%,2%); }
  30% { transform: translate(2%,-4%); }
  40% { transform: translate(-2%,5%); }
  50% { transform: translate(-4%,2%); }
  60% { transform: translate(3%,0); }
  70% { transform: translate(0,3%); }
  80% { transform: translate(-3%,0); }
  90% { transform: translate(2%,2%); }
  100% { transform: translate(0,0); }
}
@keyframes bob {
  0%, 100% { transform: translateY(0) rotate(-2deg); }
  50% { transform: translateY(-14px) rotate(2deg); }
}
@keyframes scan {
  0% { transform: translateY(-100%); }
  100% { transform: translateY(100%); }
}
@keyframes marquee {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}
@keyframes shake {
  0%, 100% { transform: translateX(0) rotate(0); }
  10% { transform: translateX(-6px) rotate(-0.5deg); }
  20% { transform: translateX(6px) rotate(0.5deg); }
  30% { transform: translateX(-8px) rotate(-0.5deg); }
  40% { transform: translateX(8px) rotate(0.5deg); }
  50% { transform: translateX(-6px) rotate(-0.3deg); }
  60% { transform: translateX(6px) rotate(0.3deg); }
  70% { transform: translateX(-4px) rotate(0); }
  80% { transform: translateX(4px) rotate(0); }
  90% { transform: translateX(-2px) rotate(0); }
}
@keyframes toastin {
  0% { opacity: 0; transform: translate(-50%, 12px); }
  10%, 90% { opacity: 1; transform: translate(-50%, 0); }
  100% { opacity: 0; transform: translate(-50%, 12px); }
}
@keyframes slidedown {
  0% { opacity: 0; transform: translateY(-12px); }
  100% { opacity: 1; transform: translateY(0); }
}
@keyframes fadein {
  0% { opacity: 0; }
  100% { opacity: 1; }
}
@keyframes pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(224,57,43,0.5); }
  50% { box-shadow: 0 0 0 8px rgba(224,57,43,0); }
}

.reveal { opacity: 0; transform: translateY(40px); transition: opacity 0.9s ease, transform 0.9s ease; }
.reveal.visible { opacity: 1; transform: translateY(0); }
.shaking { animation: shake 0.5s ease; }
.hero-img { cursor: pointer; }

/* Buttons / links get a lift on hover without touching their inline colors */
.btn-hover { transition: transform 0.2s ease, filter 0.2s ease, box-shadow 0.2s ease; }
.btn-hover:hover { transform: translateY(-3px); filter: brightness(1.1); }
.btn-hover:active { transform: translateY(-1px); }

.nav-link { position: relative; transition: color 0.2s ease; }
.nav-link::after {
  content: ''; position: absolute; left:0; right:100%; bottom:-6px; height:2px; background:#e0392b;
  transition: right 0.25s ease;
}
.nav-link:hover::after, .nav-link.active::after { right: 0; }
.nav-link.active { color:#f6efe2 !important; }

/* Cards */
.card { transition: transform 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease; }
.card:hover { transform: translateY(-6px); border-color: #e0392b; box-shadow: 0 14px 30px rgba(0,0,0,0.4); }

/* Nav / mobile menu */
.hamburger { display: none; flex-direction: column; gap: 5px; background: none; border: none; cursor: pointer; padding: 6px; z-index: 110; }
.hamburger span { width: 22px; height: 2px; background: #f3ecdf; display: block; transition: transform 0.25s ease, opacity 0.25s ease; }
.hamburger.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.hamburger.open span:nth-child(2) { opacity: 0; }
.hamburger.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

#mobileMenu { display: none; flex-direction: column; gap: 0; position: fixed; top: 0; left: 0; right: 0; z-index:99; background: #0f0d0a; border-bottom: 1px solid #2a251c; padding: 90px 32px 28px; animation: slidedown 0.25s ease; max-height: 100vh; overflow-y:auto; }
#mobileMenu a { color: #eee7da; text-decoration: none; font-size: 15px; letter-spacing:1.5px; text-transform: uppercase; padding: 14px 0; border-bottom: 1px solid #211d17; }
#mobileMenu.open { display: flex; }

/* Sticky buy bar */
#stickyBar { position: fixed; left: 0; right: 0; bottom: -100px; z-index: 150; display:flex; align-items:center; justify-content:space-between; gap:16px; background: rgba(15,13,10,0.97); border-top: 1px solid #e0392b; padding: 14px 20px; backdrop-filter: blur(4px); transition: bottom 0.35s ease; }
#stickyBar.show { bottom: 0; }
#stickyBar span { font-family:'Anton',sans-serif; letter-spacing:1px; color:#f6efe2; font-size:14px; }
#stickyBar a { background:#e0392b; color:#0b0a08; font-family:'Anton',sans-serif; letter-spacing:1px; font-size:13px; padding:11px 22px; text-decoration:none; white-space:nowrap; }
#stickyClose { background:none; border:none; color:#8f8571; font-size:18px; cursor:pointer; padding:0 4px; line-height:1; }

/* Toast */
#toast { position: fixed; left: 50%; bottom: 90px; z-index: 300; background:#e0392b; color:#0b0a08; font-family:'Space Mono',monospace; font-size:13px; letter-spacing:1px; padding:12px 22px; text-transform:uppercase; pointer-events:none; opacity:0; }
#toast.show { animation: toastin 2.2s ease forwards; }

/* Clock */
.clock-wrap { display:flex; gap:18px; flex-wrap:wrap; margin: 6px 0 28px; }
.clock-unit { text-align:center; min-width:56px; }
.clock-num { font-family:'Anton',sans-serif; font-size:28px; color:#f6efe2; }
.clock-label { font-size:10px; letter-spacing:2px; color:#8f8571; text-transform:uppercase; margin-top:2px; }

/* FAQ accordion */
.faq-item { border-bottom: 1px solid #2a251c; }
.faq-q { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:24px 4px; cursor:pointer; background:none; border:none; width:100%; text-align:left; font-family:'Space Mono',monospace; font-size:16px; color:#f6efe2; }
.faq-q .plus { color:#e0392b; font-family:'Anton',sans-serif; font-size:20px; transition: transform 0.25s ease; flex-shrink:0; }
.faq-item.open .faq-q .plus { transform: rotate(45deg); }
.faq-a { max-height:0; overflow:hidden; transition: max-height 0.3s ease, padding 0.3s ease; color:#c9bda6; font-size:14px; line-height:1.8; padding:0 4px; }
.faq-item.open .faq-a { max-height:260px; padding:0 4px 24px; }

/* Sub-page hero */
.page-hero { position:relative; padding:150px 32px 90px; max-width:1240px; margin:0 auto; border-bottom:1px solid #2a251c; }
.page-hero .badge { display:inline-block; font-size:11px; letter-spacing:4px; color:#e0392b; border:1px solid #e0392b; padding:6px 14px; margin-bottom:24px; text-transform:uppercase; }
.page-hero h1 { font-family:'Anton',sans-serif; font-size:clamp(36px,6vw,80px); line-height:0.98; letter-spacing:1px; margin:0 0 20px; color:#f6efe2; }
.page-hero p { font-size:15px; color:#c9bda6; max-width:620px; line-height:1.7; margin:0; }

/* Quicklink cards (home page) */
.quicklink-grid { display:grid; grid-template-columns:repeat(4, 1fr); gap:20px; }
.quicklink-card { display:block; text-decoration:none; border:1px solid #2a251c; background:#100e0b; padding:26px 22px; }
.quicklink-card .qc-num { font-size:11px; letter-spacing:2px; color:#e0392b; text-transform:uppercase; margin-bottom:14px; }
.quicklink-card .qc-title { font-family:'Anton',sans-serif; font-size:20px; color:#f6efe2; letter-spacing:0.5px; margin-bottom:8px; }
.quicklink-card .qc-desc { font-size:12px; color:#8f8571; line-height:1.6; }

/* Stat grid (tokenomics) */
.stat-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(180px, 1fr)); gap:1px; background:#2a251c; border:1px solid #2a251c; margin: 40px 0; }
.stat-cell { background:#100e0b; padding:28px 24px; }
.stat-cell .stat-num { font-family:'Anton',sans-serif; font-size:32px; color:#f6efe2; }
.stat-cell .stat-label { font-size:11px; letter-spacing:2px; color:#8f8571; text-transform:uppercase; margin-top:6px; }

/* Allocation bar */
.alloc-bar { display:flex; width:100%; height:44px; border:1px solid #2a251c; overflow:hidden; margin: 24px 0 16px; }
.alloc-seg { display:flex; align-items:center; justify-content:center; font-family:'Anton',sans-serif; font-size:12px; letter-spacing:1px; color:#0b0a08; }
.alloc-key { display:flex; gap:24px; flex-wrap:wrap; font-size:12px; color:#c9bda6; }
.alloc-key span.dot { display:inline-block; width:10px; height:10px; margin-right:8px; vertical-align:middle; }

/* Timeline (roadmap) */
.timeline { position:relative; max-width:820px; margin:0 auto; padding-left:36px; border-left:2px solid #2a251c; }
.tl-item { position:relative; padding-bottom:56px; }
.tl-item:last-child { padding-bottom:0; }
.tl-dot { position:absolute; left:-45px; top:2px; width:16px; height:16px; border-radius:50%; background:#0b0a08; border:2px solid #4a4438; }
.tl-item.active .tl-dot { border-color:#e0392b; background:#e0392b; animation: pulse 2s infinite; }
.tl-phase { font-size:11px; letter-spacing:3px; color:#e0392b; text-transform:uppercase; margin-bottom:8px; }
.tl-title { font-family:'Anton',sans-serif; font-size:26px; color:#f6efe2; margin-bottom:10px; }
.tl-desc { font-size:14px; color:#c9bda6; line-height:1.75; max-width:560px; }
.tl-status { display:inline-block; margin-top:14px; font-size:10px; letter-spacing:2px; text-transform:uppercase; padding:5px 12px; border:1px solid #4a4438; color:#8f8571; }
.tl-item.active .tl-status { border-color:#e0392b; color:#e0392b; }

/* Evidence gallery */
.evidence-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(280px, 1fr)); gap:28px; }
.evidence-card { border:1px solid #2a251c; background:#100e0b; overflow:hidden; cursor:pointer; }
.evidence-card img { width:100%; height:260px; object-fit:cover; display:block; filter:contrast(1.05) saturate(0.92); transition: transform 0.4s ease, filter 0.4s ease; }
.evidence-card:hover img { transform: scale(1.06); filter:contrast(1.1) saturate(1) brightness(1.05); }
.evidence-meta { padding:18px 20px; }
.evidence-tag { font-size:11px; letter-spacing:2px; color:#e0392b; text-transform:uppercase; margin-bottom:6px; }
.evidence-cap { font-size:13px; color:#c9bda6; line-height:1.6; }

#lightbox { position:fixed; inset:0; z-index:400; background:rgba(11,10,8,0.94); display:none; align-items:center; justify-content:center; padding:40px; }
#lightbox.open { display:flex; animation: fadein 0.2s ease; }
#lightbox img { max-width:90vw; max-height:80vh; border:1px solid #e0392b; }
#lightboxCap { position:absolute; bottom:60px; left:0; right:0; text-align:center; font-size:13px; letter-spacing:2px; color:#c9bda6; text-transform:uppercase; }
#lightboxClose { position:absolute; top:28px; right:32px; background:none; border:1px solid #4a4438; color:#eee7da; font-size:20px; width:40px; height:40px; cursor:pointer; }

/* How-to-buy steps */
.step-list { display:flex; flex-direction:column; gap:0; max-width:760px; }
.step { display:flex; gap:26px; padding:32px 0; border-bottom:1px solid #2a251c; }
.step:last-child { border-bottom:none; }
.step-num { font-family:'Anton',sans-serif; font-size:34px; color:#e0392b; min-width:56px; }
.step-title { font-family:'Anton',sans-serif; font-size:20px; color:#f6efe2; margin-bottom:8px; letter-spacing:0.5px; }
.step-desc { font-size:14px; color:#c9bda6; line-height:1.75; }
.warn-box { border:1px dashed #e0392b; padding:20px 24px; margin-top:40px; font-size:13px; color:#c9bda6; line-height:1.7; }
.warn-box b { color:#e0392b; }

@media (max-width: 860px) {
  .lore-grid { grid-template-columns: 1fr !important; gap: 40px !important; }
  nav .nav-links a:not(.chip), nav .nav-links .chip.desktop-only { display: none; }
  .hamburger { display: flex; }
  .quicklink-grid { grid-template-columns: 1fr 1fr; }
  .timeline { padding-left:28px; }
  .tl-dot { left:-37px; }
}
@media (max-width: 560px) {
  .quicklink-grid { grid-template-columns: 1fr; }
}