/* Alpha Dojo — public site theme (self-contained for CF Pages / local :8080) */
@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@700;900&family=Space+Grotesk:wght@400;500;700;900&family=Space+Mono:wght@400;700&family=Inter:wght@400;500;600&family=VT323&display=swap');

:root{
  --bg:#040704; --panel:#0a0f0a; --panel2:#0e140e; --border:#15401c; --border2:#1f5a28;
  --accent:#00ff66; --accent2:#38d4ff; --accent3:#ff8a1e; --accent4:#ffe600;
  --btc:#f7931a; --btc-gold:#ffd700; --win:#00ff66; --loss:#ff4444;
  --text:#eef3ef; --subtext:#bcccc2; --dim:#84a290; --dimmer:#4a6654;
  --at84:#ffe600; --ag47:#00ff66; --omega76:#38d4ff; --prq17:#b377ff; --usr19:#ff3355; --btc124:#ff8a1e;
  --font-display:'Space Grotesk',system-ui,sans-serif;
  --font-mono:'Space Mono',ui-monospace,monospace;
  --font-body:'Inter',system-ui,sans-serif;
  --font-crt:'VT323',monospace;
  --max:1240px;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:var(--font-body);background:var(--bg);color:var(--text);min-height:100vh;
  line-height:1.5;
}
body::before{
  content:"";position:fixed;inset:0;z-index:0;pointer-events:none;
  background:
    radial-gradient(ellipse 80% 50% at 50% -10%,rgba(0,255,102,.07),transparent 55%),
    radial-gradient(ellipse 40% 30% at 90% 20%,rgba(247,147,26,.05),transparent 50%),
    repeating-linear-gradient(0deg,rgba(0,255,102,.015) 0 1px,transparent 1px 3px);
}
a{color:var(--accent);text-decoration:none;transition:color .15s,text-shadow .15s}
a:hover{text-shadow:0 0 10px rgba(0,255,102,.4)}
img,svg{display:block;max-width:100%}
.page{position:relative;z-index:1;max-width:var(--max);margin:0 auto;padding:0 22px 72px}
.mono{font-family:var(--font-mono);font-variant-numeric:tabular-nums}
.eyebrow{font-family:var(--font-mono);font-size:11px;letter-spacing:2.5px;color:var(--accent);text-transform:uppercase}

/* ═══ Page H1 — same as admin / journal ad-theme.css (.hero-title) ═══ */
.page-hero{
  /* Sit below the open hover-nav drawer + little top banner */
  padding:var(--ad-nav-clear,120px) 0 12px;text-align:center;
}
/* First in-page H2 blocks also clear the drawer when used near the top */
.page > .sec:first-of-type,
.page > section.sec:first-of-type{
  padding-top:max(40px, calc(var(--ad-nav-clear,120px) * 0.15));
}
.page-hero + .sec,
.page-hero + section.sec{
  padding-top:40px;
}
.hero-eyebrow,
.page-hero .eyebrow{
  position:relative;
  font-family:var(--font-mono);font-size:11px;color:#ff8a1e;
  letter-spacing:.22em;text-transform:uppercase;margin:0 0 24px;
  display:flex;align-items:center;justify-content:center;gap:14px;
  white-space:nowrap;
}
.hero-eyebrow::before,.hero-eyebrow::after,
.page-hero .eyebrow::before,.page-hero .eyebrow::after{
  content:"";flex:0 0 60px;height:1px;display:block;
}
.hero-eyebrow::before,.page-hero .eyebrow::before{
  background:linear-gradient(90deg,transparent,rgba(240,165,0,.6));
}
.hero-eyebrow::after,.page-hero .eyebrow::after{
  background:linear-gradient(-90deg,transparent,rgba(240,165,0,.6));
}
.hero-title,
.hero-h1,
h1.hero-title{
  font-family:'Orbitron',var(--font-display),monospace;
  font-size:clamp(38px,7vw,92px);font-weight:900;line-height:1;
  letter-spacing:-.01em;text-transform:uppercase;
  background:linear-gradient(95deg,var(--accent4,#ffe600) 0%,#38d4ff 50%,#00ff66 100%);
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent;
  margin:0 0 20px;
}
.hero-subtitle{
  font-family:var(--font-body);font-size:18px;font-weight:300;
  color:rgba(255,255,255,.6);letter-spacing:.06em;
  margin:0 auto 28px;max-width:720px;line-height:1.55;text-align:center;
}
.page-hero .hero-subtitle,
.page-hero .sec-sub{
  margin-left:auto;margin-right:auto;text-align:center;max-width:56ch;
}
@media(max-width:640px){
  .hero-eyebrow::before,.hero-eyebrow::after,
  .page-hero .eyebrow::before,.page-hero .eyebrow::after{flex-basis:28px}
  .hero-title,.hero-h1{font-size:clamp(32px,11vw,56px)}
}

.sec{padding:56px 0 8px}
.sec-h{font-family:var(--font-display);font-weight:700;font-size:clamp(22px,3.4vw,38px);letter-spacing:2px;margin:8px 0 10px;text-transform:uppercase}
.sec-sub{color:var(--dim);max-width:56ch;font-size:15px;line-height:1.65;margin-bottom:22px}
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  font-family:var(--font-display);font-weight:700;font-size:13px;letter-spacing:1px;
  padding:12px 22px;border-radius:10px;border:1px solid var(--accent);cursor:pointer;
  background:linear-gradient(135deg,#5cffa0,var(--accent));color:#04160a;
  box-shadow:0 0 22px rgba(0,255,102,.28);transition:transform .15s,box-shadow .15s;
}
.btn:hover{transform:translateY(-1px);box-shadow:0 0 28px rgba(0,255,102,.4);color:#04160a;text-shadow:none}
.btn.ghost{background:transparent;color:var(--accent);box-shadow:none}
.btn.ghost:hover{background:rgba(0,255,102,.08)}
.btn.btc{
  border-color:var(--btc);
  background:linear-gradient(135deg,#ffd9a8,var(--btc) 45%,#c25e00);color:#1a0c00;
  box-shadow:0 0 22px rgba(247,147,26,.35);
}
.grid-algos{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;perspective:1200px}
@media(max-width:900px){.grid-algos{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.grid-algos{grid-template-columns:1fr}}

/* Flip cards — random direction assigned on each hover */
.algo-flip{
  --c:var(--accent);
  position:relative;height:220px;cursor:pointer;
  perspective:1100px;outline:none;
}
.algo-flip-inner{
  position:relative;z-index:1;width:100%;height:100%;
  transform-style:preserve-3d;-webkit-transform-style:preserve-3d;
  transition:transform .58s cubic-bezier(.2,.85,.25,1);
}
.algo-flip.is-flipped.flip-left .algo-flip-inner{transform:rotateY(-180deg)}
.algo-flip.is-flipped.flip-right .algo-flip-inner{transform:rotateY(180deg)}
.algo-flip.is-flipped.flip-up .algo-flip-inner{transform:rotateX(180deg)}
.algo-flip.is-flipped.flip-down .algo-flip-inner{transform:rotateX(-180deg)}
.algo-face{
  position:absolute;inset:0;border-radius:12px;padding:16px 16px 14px;
  backface-visibility:hidden;-webkit-backface-visibility:hidden;
  transform-style:preserve-3d;-webkit-transform-style:preserve-3d;
  background:linear-gradient(165deg,var(--panel2),var(--panel));
  border:1px solid var(--border);
  box-shadow:0 10px 28px rgba(0,0,0,.35);
}
.algo-face-front{transform:rotateY(0deg) rotateX(0deg)}
.algo-face-back.back-y{transform:rotateY(180deg)}
.algo-face-back.back-x{transform:rotateX(180deg)}
/* Border chase lives on a sibling layer so it never flattens the 3D flip */
.algo-flip-border{
  position:absolute;inset:-2px;border-radius:14px;z-index:0;pointer-events:none;overflow:hidden;
}
.algo-flip-border::before{
  content:"";position:absolute;inset:0;border-radius:14px;
  background:linear-gradient(120deg,transparent 20%,var(--c) 50%,transparent 80%);
  background-size:220% 220%;
  opacity:.35;
  animation:algoBorderChase var(--border-dur,3.2s) linear infinite;
}
.algo-flip-border::after{
  content:"";position:absolute;inset:2px;border-radius:12px;
  box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--c) 35%,transparent),
    0 0 0 1px color-mix(in srgb,var(--c) 22%,transparent),
    0 0 18px color-mix(in srgb,var(--c) 18%,transparent);
  animation:algoBorderPulse var(--border-dur,3.2s) ease-in-out infinite;
}
.algo-flip:hover .algo-flip-border::before,
.algo-flip:focus-within .algo-flip-border::before{opacity:.75}
.algo-flip:hover .algo-flip-border::after,
.algo-flip:focus-within .algo-flip-border::after{
  box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--c) 70%,transparent),
    0 0 0 1px color-mix(in srgb,var(--c) 45%,transparent),
    0 0 28px color-mix(in srgb,var(--c) 35%,transparent);
}
@keyframes algoBorderChase{
  0%{background-position:0% 50%}
  100%{background-position:200% 50%}
}
@keyframes algoBorderPulse{
  0%,100%{opacity:.55}
  50%{opacity:1}
}
.algo-flip:nth-child(1){--border-dur:2.6s}
.algo-flip:nth-child(2){--border-dur:3.5s}
.algo-flip:nth-child(2) .algo-flip-border::before{animation-direction:reverse}
.algo-flip:nth-child(3){--border-dur:2.9s}
.algo-flip:nth-child(4){--border-dur:3.8s}
.algo-flip:nth-child(4) .algo-flip-border::before{animation-direction:reverse}
.algo-flip:nth-child(5){--border-dur:3.1s}
.algo-flip:nth-child(6){--border-dur:2.4s}
.algo-flip:nth-child(6) .algo-flip-border::before{animation-direction:reverse}

.algo-card .nm,.algo-face .nm{font-family:var(--font-mono);font-weight:700;font-size:15px;letter-spacing:1.5px;color:var(--c)}
.algo-card .sub,.algo-face .sub{font-size:11px;color:var(--dim);margin:4px 0 12px;letter-spacing:.4px}
.algo-card .row,.algo-face .row{display:flex;justify-content:space-between;font-family:var(--font-mono);font-size:12px;color:var(--dim);margin:4px 0}
.algo-card .row b,.algo-face .row b{color:var(--text)}
.algo-card .up,.algo-face .up{color:var(--win)}
.algo-card .dn,.algo-face .dn{color:var(--loss)}
.algo-face-back{display:flex;flex-direction:column;gap:8px;border-color:color-mix(in srgb,var(--c) 45%,var(--border))}
.algo-face-back .algo-ico{
  width:36px;height:36px;border-radius:10px;display:flex;align-items:center;justify-content:center;
  font-size:18px;background:color-mix(in srgb,var(--c) 16%,#060805);
  border:1px solid color-mix(in srgb,var(--c) 40%,transparent);margin-bottom:2px;
}
.algo-face-back .bio{
  font-size:12.5px;color:var(--subtext);line-height:1.5;margin:0;
  display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;
  overflow:hidden;
}
.algo-face-back .meth{
  font-size:11px;color:var(--dim);line-height:1.45;margin:0;padding-top:8px;
  border-top:1px solid rgba(28,40,24,.8);
}
.algo-face-back .meth b{color:var(--c);font-weight:700;letter-spacing:.8px;font-size:10px;display:block;margin-bottom:4px}
.algo-flip-hint{position:absolute;right:12px;bottom:10px;font-family:var(--font-mono);font-size:9px;letter-spacing:1px;color:var(--dimmer)}
.price-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
@media(max-width:980px){.price-grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.price-grid{grid-template-columns:1fr}}
.price-card{
  background:var(--panel);border:1px solid var(--border);border-radius:14px;padding:20px 18px;
  display:flex;flex-direction:column;gap:10px;position:relative;overflow:hidden;
}
.price-card.featured{border-color:rgba(0,255,102,.45);box-shadow:0 0 30px rgba(0,255,102,.08)}
.price-card .tier{font-family:var(--font-display);font-weight:700;font-size:18px}
.price-card .alias{font-family:var(--font-mono);font-size:10px;letter-spacing:1.5px;color:var(--dimmer)}
.price-card .amt{font-family:var(--font-mono);font-size:28px;font-weight:700}
.price-card .amt span{font-size:13px;color:var(--dim);font-weight:400}
.price-card ul{list-style:none;font-size:13px;color:var(--subtext);line-height:1.7;flex:1}
.price-card ul li::before{content:"▸ ";color:var(--accent)}
.chart-shell{
  border:1px solid var(--border);border-radius:14px;background:var(--panel);
  padding:12px 14px 14px;min-height:380px;position:relative;
}
.chart-shell canvas,#ltc-canvas{width:100%!important;height:360px!important}
.slim-arena{
  border:1px solid var(--border);border-radius:14px;overflow:hidden;background:#050605;
  position:relative;min-height:280px;
}
.slim-arena canvas{width:100%;height:360px;display:block;background:#050605;border-radius:8px}
.slim-cta{position:absolute;right:14px;bottom:14px;z-index:5}
.nfa{
  margin-top:40px;padding:16px;border:1px solid var(--border);border-radius:10px;
  font-size:12px;color:var(--dim);line-height:1.6;
}
.badge-live{
  display:inline-flex;align-items:center;gap:6px;font-family:var(--font-mono);font-size:10px;
  letter-spacing:1.5px;padding:5px 10px;border-radius:999px;border:1px solid rgba(0,255,102,.35);
  color:var(--accent);background:rgba(0,255,102,.06);
}
.badge-live i{width:6px;height:6px;border-radius:50%;background:var(--accent);box-shadow:0 0 8px var(--accent)}
/* public header / footer injected by ad-public-nav.js
   Header must stay fixed — relative would leave a blank band and break the hover drawer */
#ad-pub-header{position:fixed;top:0;left:0;right:0;z-index:120}
#ad-pub-footer{position:relative;z-index:40;margin-top:48px}
