:root{
  --text:#ffffff;
  --muted:#bfc7d6;
  --bg:#000000;
  --footer-bg:#0b0d11; /* footer color used for mobile drawer background */

  /* Accents */
  --accent:#00bf63;      /* neon green */
  --accent-900:#00a457;  /* darker hover */
  --accent-2:#00c2ff;    /* neon blue */
  --scribble:#0381f6;

  --chevron-bg: rgba(40,44,52,.68);
  --focus: 0 0 0 3px rgba(3,129,246,.35);

  --z-header:1000;
  --h-header:72px;
  --maxw:1200px;

  --line: rgba(255,255,255,.08);
}

*{ box-sizing:border-box; }
html,body{ margin:0; height:100%; }
html, body { max-width:100%; overflow-x:hidden; } /* prevent horizontal scroll */
body{
  font-family:"Montserrat", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color:var(--text);
  background:
    radial-gradient(1200px 800px at 10% -10%, rgba(0,194,255,.08), transparent 60%),
    radial-gradient(1000px 640px at 100% 0%, rgba(0,191,99,.08), transparent 55%),
    var(--bg);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
a{ color:inherit; text-decoration:none; }

/* Fixed transparent header */
.site-header{
  position:fixed; inset:0 0 auto 0; height:var(--h-header);
  display:flex; align-items:center; z-index:var(--z-header);
  background:transparent; pointer-events:auto;
}
.nav-wrap{
  width:min(var(--maxw), 92vw);
  margin:0 auto;
  display:grid; grid-template-columns:auto 1fr auto;
  align-items:center; gap:14px;
}

/* Logo */
.brand{ display:inline-flex; align-items:center; padding:6px 8px; }
.brand:focus-visible{ outline:none; box-shadow:var(--focus); border-radius:6px; }
.brand-img{ height:40px; width:auto; display:block; }

/* Center pointy chevron bar */
.main-nav{ position:relative; justify-self:center; }
.nav-list{
  list-style:none; display:flex; gap:26px;
  padding:14px 36px;
  background:var(--chevron-bg);
  color:var(--text);
  border:1px solid rgba(255,255,255,.06);
  backdrop-filter:saturate(160%) blur(6px);
  -webkit-backdrop-filter:saturate(160%) blur(6px);
  clip-path:polygon(18px 0%, calc(100% - 18px) 0%, 100% 50%, calc(100% - 18px) 100%, 18px 100%, 0% 50%);
}
.nav-link{
  font-weight:900; text-transform:uppercase; letter-spacing:.08em; font-size:14px;
  transition:transform .18s ease, opacity .18s ease;
  white-space:nowrap;
}
.nav-link:hover, .nav-link:focus-visible{ opacity:.95; outline:none; transform:scale(1.08); }

/* CTA chevron */
.cta{
  --padY:14px; --padX:28px;
  display:inline-flex; align-items:center; justify-content:center;
  padding:var(--padY) var(--padX);
  color:#0e1115; font-weight:900; text-transform:uppercase; letter-spacing:.08em;
  background:var(--accent);
  border:1px solid rgba(0,0,0,.08);
  clip-path:polygon(14px 0%, calc(100% - 24px) 0%, 100% 50%, calc(100% - 24px) 100%, 14px 100%, 0% 50%);
  transition:transform .15s ease, background .2s ease, filter .2s ease;
}
.cta:hover{ background:var(--accent-900); transform:translateY(-1px); }
.cta:active{ transform:translateY(0); }
.cta:focus-visible{ outline:none; box-shadow:var(--focus); }

/* Make the HERO CTA bigger */
.hero .cta{
  --padY:18px; --padX:44px;
  font-size: clamp(1.05rem, 2.4vw, 1.6rem);
  letter-spacing: .10em;
  clip-path:polygon(18px 0%, calc(100% - 30px) 0%, 100% 50%, calc(100% - 30px) 100%, 18px 100%, 0% 50%);
}
@media (max-width:560px){ .hero .cta{ --padY:16px; --padX:36px; font-size:1.1rem; } }

/* OLD hamburger & dropdown styles are intentionally *not* used anymore */
.hamburger{ display:none !important; } /* hide any legacy hamburger */

/* ===== New mobile trigger (white hamburger) ===== */
.hamburger-btn{
  display:none; /* hidden on desktop */
  align-items:center; justify-content:center;
  width:44px; height:44px; border-radius:12px;
  background:transparent; border:1px solid rgba(255,255,255,.55);
  color:#fff; -webkit-tap-highlight-color:transparent; cursor:pointer;
}
.hamburger-btn .icon{ width:22px; height:22px; }
.hidden{ display:none !important; }

@media (max-width:900px){
  .main-nav, .site-header .cta{ display:none !important; } /* hide desktop nav + CTA */
  .hamburger-btn{ display:inline-flex; }
  .site-header .nav-wrap{ position:relative; }
  .hamburger-btn{
    position:absolute; right:12px; top:50%; transform:translateY(-50%);
    z-index: 1001;
  }
}

/* ===== Overlay + drawer ===== */
.mobile-overlay[hidden]{ display:none !important; }
.mobile-overlay{
  position:fixed; inset:0; z-index:999; display:grid; grid-template-columns: 1fr auto;
}
.mobile-backdrop{
  position:absolute; inset:0; background:rgba(0,0,0,.55); backdrop-filter: blur(6px);
  opacity:0; transition:opacity .22s ease;
}
.mobile-drawer{
  position:relative; height:100%; width:min(86vw, 360px);
  background: var(--footer-bg); color:#fff;
  box-shadow: 0 18px 60px rgba(0,0,0,.25), 0 6px 18px rgba(0,0,0,.12);
  transform: translateX(100%); transition: transform .22s ease;
  border-top-left-radius: 18px; border-bottom-left-radius: 18px;
  display:flex; flex-direction:column;
}

/* Open state */
.mobile-overlay.is-open .mobile-backdrop{ opacity:1; }
.mobile-overlay.is-open .mobile-drawer{ transform: translateX(0); }

/* Drawer head */
.mobile-drawer-head{
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  padding:12px 12px; border-bottom:1px solid rgba(255,255,255,.12);
}
.mobile-logo{ height:32px; width:auto; }
.mobile-close{
  display:inline-grid; place-items:center; width:40px; height:40px;
  border-radius:10px; border:1px solid rgba(255,255,255,.18);
  background: rgba(255,255,255,.06); color:#fff;
}
.mobile-close:hover{ background: rgba(255,255,255,.12); }

/* Drawer links */
.mobile-nav{ padding: 10px; }
.mobile-nav .mobile-link{
  display:block; padding:14px 12px; border-radius:12px; font-weight:800; text-decoration:none;
  color:#fff; border:1px solid transparent;
}
.mobile-nav .mobile-link:hover{ background:rgba(255,255,255,.06); border-color:rgba(255,255,255,.12); }

/* Divider + CTA */
.divider{ height:1px; background: rgba(255,255,255,.12); margin:8px 12px; }
.mobile-cta-btn{ display:block; text-align:center; margin: 8px 12px 16px; }

/* Hide toggle behind the drawer while open (prevents "double X") */
html.nav-open #mobile-toggle{ visibility:hidden; }

/* Anchor offset */
:target{ scroll-margin-top: calc(var(--h-header) + 12px); }

/* ---------- Hero ---------- */
.hero{
  position:relative; height:100vh; width:100%; overflow:hidden;
  display:flex; align-items:center; justify-content:center; text-align:center; color:white;
}
.hero-video{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-2; filter:saturate(110%) contrast(105%) brightness(75%); }
.hero-overlay{ position:absolute; inset:0; z-index:-1; background:
  linear-gradient(180deg, rgba(0,0,0,.55) 0%, rgba(0,0,0,.6) 35%, rgba(10,15,20,.8) 100%),
  radial-gradient(800px 400px at 20% -10%, rgba(0,194,255,.25), transparent 60%),
  radial-gradient(900px 480px at 100% 0%, rgba(16,242,150,.22), transparent 55%);
}
.hero-content{ position:relative; padding:20px; max-width:1100px; }
.hero-eyebrow{ margin:0 0 6px; letter-spacing:.12em; text-transform:uppercase; font-weight:800; color:var(--accent-2); }
.hero-title{ margin:0 0 10px; font-weight:900; line-height:1.05; font-size: clamp(2rem, 5.4vw, 4rem); }
.hero-title .accent{ color:#cffff1; text-shadow:0 0 18px rgba(0,191,99,.35); }
.hero-sub{ font-size:1.2rem; opacity:.9; margin:0 0 26px; }

/* ---------- Sections & grids ---------- */
.section{ padding:96px 0; }
.section.alt{ background:linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,0) 40%); }
.container{ width:min(1100px, 92vw); margin:0 auto; }
.grid-2{ display:grid; grid-template-columns:1.1fr 1fr; gap:56px; align-items:center; }
.grid-3{ display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:22px; }
.stack{ display:flex; flex-direction:column; gap:16px; }
@media (max-width:980px){ .grid-2{ grid-template-columns:1fr; gap:36px; } .grid-3{ grid-template-columns:1fr; } }

/* About (crypto) */
.crypto-media{ display:flex; align-items:center; justify-content:center; }
.crypto-media img{ width:100%; max-width:560px; filter:drop-shadow(0 30px 60px rgba(0,0,0,.55)); transform:translateZ(0); }
.scroll-zoom{ transform:scale(1); transition:transform 480ms ease; backface-visibility:hidden; }

.eyebrow{ color:#037ff6 !important; letter-spacing:.12em; text-transform:uppercase; font-weight:700; margin:0 0 14px; font-size:.95rem; }
.section-title{ font-size:clamp(2rem, 4vw + .5rem, 3.25rem); line-height:1.15; font-weight:900; margin:0 0 16px; }
.section-title .accent{ color:var(--text); }
.section-subtitle{ color:#d7d9e0; opacity:.9; line-height:1.65; max-width:56ch; margin:0 0 26px; }

.cta-row{ display:flex; gap:14px; flex-wrap:wrap; }
.btn-ghost{
  display:inline-flex; align-items:center; justify-content:center;
  padding:12px 22px; border-radius:999px; border:1px solid rgba(0,191,99,.45);
  color:var(--accent); font-weight:800; transition:transform .15s ease, background .2s ease, border-color .2s ease;
  backdrop-filter:blur(4px) saturate(140%); -webkit-backdrop-filter:blur(4px) saturate(140%);
}
.btn-ghost:hover{ transform:translateY(-1px); border-color:rgba(0,191,99,.65); background:rgba(0,191,99,.10); }

/* Paint-style highlight */
.paint-highlight{ position:relative; display:inline-block; padding:0 .08em; }
.paint-highlight > *{ position:relative; z-index:1; }
.paint-highlight::before{
  content:""; position:absolute; left:-0.28em; right:-0.28em; bottom:.06em; height:.95em; background:var(--scribble);
  border-radius:.25em .6em .45em .3em; transform-origin:left center; transform:skewX(-12deg) rotate(-1.5deg) scaleX(0);
  opacity:0; transition:transform .55s cubic-bezier(.2,.65,.2,1), opacity .25s ease;
  filter:drop-shadow(0 0 10px rgba(3,129,246,.35)) drop-shadow(0 2px 0 rgba(0,0,0,.18));
}
.paint-highlight.is-painted::before{ transform:skewX(-12deg) rotate(-1.5deg) scaleX(1); opacity:1; }

/* Stats */
.stats{ margin-top:56px; display:grid; grid-template-columns:repeat(3,1fr); gap:22px; text-align:center; }
@media (max-width:720px){ .stats{ grid-template-columns:1fr; gap:18px; } }
.stat-value{
  color:var(--accent); font-weight:900; font-size:clamp(1.6rem, 3.5vw, 2rem); margin-bottom:6px;
  transform:scale(.92); opacity:0; transition:transform .45s ease, opacity .45s ease;
}
.stat-value.revealed{ transform:scale(1); opacity:1; }
.stat{ transform:translateY(6px); transition:transform .45s ease; }
.stat.revealed{ transform:translateY(0); }
.stat-label{ letter-spacing:.12em; text-transform:uppercase; color:#e9e9ee; opacity:.85; font-weight:800; font-size:.9rem; }
.footnote{ margin-top:8px; color:#9aa0ab; font-size:.9rem; opacity:.85; }

/* ======================= WINS BACKGROUND ======================= */
.trades.has-bg{ position:relative; overflow:hidden; }
.trades.has-bg .bg{
  position:absolute; inset:0; z-index:0;
  /* image is set inline (data-bg); keep only positioning here */
  background-position:center; background-size:cover; background-repeat:no-repeat;
  background-attachment: fixed; /* desktop: true fixed */
  opacity:.28; filter:saturate(110%) contrast(105%);
  pointer-events:none;
}
@media (max-width:900px){
  .trades.has-bg .bg{
    background-attachment: scroll !important; /* iOS/Android ignore fixed */
    will-change: transform;
    transform: translate3d(0,0,0); /* mobile parallax via JS */
    backface-visibility:hidden;
  }
}
/* generic helper if you reuse parallax elsewhere */
@media (max-width:900px){
  .has-bg .bg.is-parallax{
    will-change: transform;
    transform: translate3d(0,0,0);
    backface-visibility:hidden;
  }
}

.trades .container{ position:relative; z-index:1; }
.trades-head{ text-align:center; margin-bottom:26px; }

.ticker{ overflow:hidden; border:1px solid var(--line); border-radius:14px; background:rgba(255,255,255,.03); }
.ticker-track{ display:flex; gap:28px; padding:12px 18px; white-space:nowrap; animation:slide-left 35s linear infinite; }
.ticker-track span{ display:inline-flex; align-items:center; gap:8px; padding:6px 10px; border-radius:999px; background:rgba(0,191,99,.10); border:1px solid rgba(0,191,99,.28); }

@keyframes slide-left{ from{transform:translateX(0)} to{transform:translateX(-50%)} }

.kpis{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; margin-top:18px; }
@media (max-width:960px){ .kpis{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
.kpi{ background:rgba(255,255,255,.04); border:1px solid var(--line); border-radius:16px; padding:18px; text-align:center; box-shadow:0 10px 30px rgba(0,0,0,.35); }
.kpi-num{ font-size:2rem; font-weight:900; background:linear-gradient(90deg, var(--accent), var(--accent-2)); -webkit-background-clip:text; background-clip:text; color:transparent; }
.kpi-label{ color:var(--muted); font-weight:700; letter-spacing:.3px; }

/* Results (curve + bars) */
.card{ background:rgba(255,255,255,.04); border:1px solid var(--line); border-radius:18px; padding:20px; box-shadow:0 10px 30px rgba(0,0,0,.35); }
.curve{ position:relative; height:140px; border-radius:12px; background:linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.01)); overflow:hidden; border:1px solid var(--line); margin-bottom:12px; }
.curve-line{ position:absolute; inset:0; background:linear-gradient(180deg, transparent 75%, rgba(255,255,255,.06) 76%, transparent 77%) repeat-y; mask:linear-gradient(90deg, transparent 0%, black 10%, black 90%, transparent 100%); }
.curve-glow{ position:absolute; inset:0; background:
  radial-gradient(400px 120px at 10% 75%, rgba(0,194,255,.28), transparent 60%),
  radial-gradient(400px 120px at 55% 45%, rgba(16,242,150,.28), transparent 60%),
  radial-gradient(400px 120px at 90% 25%, rgba(0,194,255,.28), transparent 60%); filter:blur(14px);
}
.bars{ display:grid; grid-template-columns:repeat(6,1fr); gap:8px; }
.bar{ position:relative; height:160px; background:rgba(255,255,255,.03); border:1px solid var(--line); border-radius:12px; overflow:hidden; }
.bar::after{ content:""; position:absolute; bottom:0; left:0; right:0; height:var(--h,50%); background:linear-gradient(180deg, rgba(0,194,255,.15), rgba(16,242,150,.8)); box-shadow:0 0 28px rgba(16,242,150,.4) inset; }
.bar span{ position:absolute; inset:auto 0 8px 0; text-align:center; font-size:.8rem; color:var(--muted); }

/* Avoid scam */
.grid-3 .card h3{ margin:0 0 6px; }
.muted{ color:var(--muted); }

/* Form */
.form-card{ align-self:start; }
.contact-form{ display:grid; gap:12px; }
.contact-form label{ display:grid; gap:6px; font-weight:800; color:#e6f0ff; }
.contact-form input, .contact-form textarea{
  background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.12);
  color:var(--text); border-radius:12px; padding:12px 14px; outline:none;
}
.contact-form input:focus, .contact-form textarea:focus{ border-color:rgba(0,194,255,.5); box-shadow:0 0 0 3px rgba(0,194,255,.15); }

/* Checklist */
.checklist{ list-style:none; padding:0; margin:0; display:grid; gap:8px; }
.checklist li{ position:relative; padding-left:28px; }
.checklist li::before{
  content:""; position:absolute; left:0; top:.1rem; width:18px; height:18px; border-radius:5px;
  background:linear-gradient(135deg, var(--accent), var(--accent-2)); box-shadow:0 0 12px rgba(0,194,255,.5);
}

/* Footer */
.site-footer{ background:#0b0d11; border-top:1px solid var(--line); padding:36px 0 26px; }
.footer-top{ display:grid; grid-template-columns:auto 1fr; gap:28px; align-items:start; }
.footer-logo .brand-img{ height:56px; width:auto; filter:drop-shadow(0 10px 24px rgba(0,0,0,.5)); }
.footer-grid{ display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:10px 26px; }
.footer-title{ margin:0 0 10px; font-weight:900; font-size:1rem; letter-spacing:.04em; }
.footer-links{ list-style:none; margin:0; padding:0; display:grid; gap:8px; }
.footer-links a{ color:#d7d9e0; opacity:.9; transition:color .2s ease, opacity .2s ease; }
.footer-links a:hover{ color:#fff; opacity:1; }
.footer-bottom{ margin-top:20px; padding-top:16px; border-top:1px solid var(--line); }
.footer-disclaimer{ color:#9aa0ab; font-size:.9rem; text-align:center; opacity:.9; line-height:1.55; }
@media (max-width:900px){
  .footer-top{ grid-template-columns:1fr; }
  .footer-logo{ justify-self:center; }
  .footer-grid{ grid-template-columns:1fr 1fr; }
}
@media (max-width:560px){ .footer-grid{ grid-template-columns:1fr; text-align:center; } .footer-title{ margin-top:8px; } }

/* Reduce motion */
@media (prefers-reduced-motion: reduce){
  .scroll-zoom, .stat-value{ transition:none; transform:none !important; opacity:1 !important; }
  .ticker-track{ animation:none; }
}

/* ===== Trades carousel ===== */
.trades-frame{ position:relative; }
.trades-track{
  display:grid;
  grid-auto-flow: column;
  grid-auto-columns: 78%;
  gap: 18px;
  overflow-x: auto;
  padding: 8px 0 6px;
  scroll-snap-type: x mandatory;
  scroll-snap-stop: always;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  opacity:0; transform: translateY(8px);
  transition: opacity .5s ease, transform .5s ease;
  perspective: 1000px; /* za 3D klasice ispod */
}
.trades-track::-webkit-scrollbar{ display:none; }
.trades-track.revealed{ opacity:1; transform: translateY(0); }

@media (min-width: 900px){ .trades-track{ grid-auto-columns: 44%; } }
@media (min-width: 1280px){ .trades-track{ grid-auto-columns: 32%; } }

.trade-card{
  scroll-snap-align: center;
  background: rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.08);
  border-radius: 18px;
  overflow:hidden;
  transition: transform .25s ease, border-color .25s ease, background .25s ease, box-shadow .25s ease, opacity .25s ease;
  will-change: transform, opacity;
}
.trade-card:hover,
.trade-card:focus-within{
  transform: translateY(-2px);
  border-color: rgba(255,255,255,.18);
  background: rgba(255,255,255,.06);
}

.shot-wrap{ position: relative; aspect-ratio: 16 / 9; overflow: hidden; }
.shot-wrap img{ width:100%; height:100%; object-fit: cover; display:block; transform: scale(1.01); }

.trade-meta{ padding: 12px 14px 14px; }
.trade-meta h3{ margin:0 0 4px; font-size: 1.05rem; font-weight:800; color: var(--text); }
.trade-meta p{ margin:0; color:#cfd3db; font-size:.95rem; opacity:.9; }

/* prev/next */
.carousel-btn{
  position:absolute; top: 50%; transform: translateY(-50%);
  width: 42px; height:42px; border-radius: 50%;
  background: rgba(0,191,99,.16);
  color: #eafff3;
  border:1px solid rgba(0,191,99,.45);
  display:flex; align-items:center; justify-content:center;
  cursor:pointer;
  transition: transform .2s ease, background .2s ease, opacity .2s ease;
  z-index:2; opacity:.95;
}
.carousel-btn:hover{ transform: translateY(-50%) scale(1.05); background: rgba(0,191,99,.26); }
.carousel-btn.prev{ left: -6px; }
.carousel-btn.next{ right: -6px; }
@media (max-width: 720px){ .carousel-btn{ display:none; } }

/* 3D pozicioniranje najbližih kartica */
.trade-card.pos-left  { transform: translateX(-4%) scale(.92) rotateY(3deg);  opacity: .93; z-index: 1; }
.trade-card.pos-center{ transform: scale(1.02); opacity: 1; z-index: 3; box-shadow: 0 18px 48px rgba(0,0,0,.45); }
.trade-card.pos-right { transform: translateX(4%)  scale(.92) rotateY(-3deg); opacity: .93; z-index: 2; }
@media (max-width: 900px){
  .trade-card.pos-left  { transform: translateX(-2%) scale(.96) rotateY(2deg); }
  .trade-card.pos-right { transform: translateX( 2%) scale(.96) rotateY(-2deg); }
  .trade-card.pos-center{ transform: scale(1.01); }
}

/* Lightbox */
.lightbox{
  position: fixed; inset:0; display:none;
  background: rgba(0,0,0,.85);
  align-items: center; justify-content: center;
  z-index: 2000;
}
.lightbox.is-open{ display:flex; }
.lightbox-img{
  max-width: 92vw; max-height: 88vh; border-radius: 12px;
  box-shadow: 0 20px 80px rgba(0,0,0,.6);
}
.lightbox-close{
  position:absolute; top: 18px; right: 20px;
  width: 44px; height:44px;
  border-radius: 8px; border:1px solid rgba(255,255,255,.15);
  background: rgba(255,255,255,.06);
  color: var(--text); font-size: 28px; line-height: 1;
  cursor: pointer;
}
.lightbox-close:hover{ background: rgba(255,255,255,.12); }

/* “All Results” centrirano (ako ga koristiš) */
.results-cta{ margin-top: 26px; display:flex; justify-content:center; }
@media (max-width: 920px){ .results-cta .cta{ display:inline-flex; } }

/* ====================  PLANS  ======================== */
.plans-head{ text-align:center; margin-bottom: 28px; }
.plans-grid{
  display:grid; grid-template-columns: repeat(3, 1fr);
  gap: 22px; perspective: 1200px;
}
@media (max-width:1024px){ .plans-grid{ grid-template-columns: repeat(2, 1fr); } }
@media (max-width:720px){ .plans-grid{ grid-template-columns: 1fr; } }

.plan-card{
  position:relative; display:flex; flex-direction:column;
  padding:24px 22px 22px;
  border-radius:20px; background: rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 8px 24px rgba(0,0,0,.35);
  transform-style:preserve-3d; overflow:hidden;
  transition: transform .35s cubic-bezier(.2,.65,.2,1), border-color .35s, background .35s, box-shadow .35s;
}
.plan-card:hover{ transform: translateY(-6px); background: rgba(255,255,255,.06); border-color: rgba(255,255,255,.18); box-shadow:0 26px 80px rgba(0,0,0,.55); }
.plan-card .glow{
  position:absolute; inset:-40px; pointer-events:none;
  background: radial-gradient(160px 160px at var(--mx,50%) var(--my,50%), rgba(3,129,246,.40), rgba(3,129,246,0) 60%);
  filter: blur(22px); opacity: 0; transition: opacity .25s ease;
}
.plan-card:hover .glow{ opacity:1; }
.plan-card.featured{ box-shadow: 0 18px 64px rgba(3,129,246,.25), 0 8px 24px rgba(0,0,0,.45); border-color: rgba(3,129,246,.35); }
.plan-card.featured:hover{ box-shadow: 0 28px 90px rgba(3,129,246,.32), 0 16px 60px rgba(0,0,0,.6); }
.ribbon{
  position:absolute; top:10px; left:50%; transform:translateX(-50%);
  padding:6px 12px; background: linear-gradient(90deg, rgba(3,129,246,.95), rgba(3,129,246,.75));
  color:#fff; font-weight:800; font-size:.8rem; letter-spacing:.06em;
  border:1px solid rgba(255,255,255,.18); border-radius:999px; text-transform:uppercase; pointer-events:none;
}
.plan-head{ margin-bottom:10px; }
.plan-name{ margin:0 0 6px 0; font-size: clamp(1.25rem, 2.4vw, 1.6rem); font-weight: 800; }
.plan-price{ margin:0 0 10px 0; font-size: clamp(1.05rem, 2.2vw, 1.35rem); color:#e9e9ee; opacity:.95; }
.plan-price span{ font-weight:900; font-size: clamp(1.35rem, 3vw, 1.8rem); color:var(--text); }
.plan-blurb{ margin:0; color:#cfd3db; opacity:.9; line-height:1.6; }
.plan-list{ list-style:none; margin:10px 0 18px; padding:0; display:grid; gap:10px; }
.plan-list li{ display:flex; gap:10px; align-items:flex-start; color:#d7d9e0; line-height:1.6; }
.plan-list li::before{
  content:""; flex:0 0 18px; height:18px; margin-top:2px; background-repeat:no-repeat; background-size:contain; background-position:center;
  filter: drop-shadow(0 0 4px rgba(0,0,0,.25));
}
.plan-list .ok::before{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path d='M3 8l3 3 7-7' fill='none' stroke='%2300bf63' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/></svg>");
}
.plan-list .no{ color:#aeb3bd; }
.plan-list .no::before{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path d='M4 4l8 8M12 4L4 12' fill='none' stroke='rgba(255,255,255,0.65)' stroke-width='3' stroke-linecap='round'/></svg>");
}
.plan-cta{ margin-top:auto; align-self:center; padding-left:34px; padding-right:34px; }
@media (max-width: 920px){ .plans .plan-cta{ display:inline-flex; } }

/* ====================  HOW IT WORKS  ======================== */
.how-head{ text-align:center; margin-bottom: 20px; }
.how-grid{ display:grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
@media (max-width:900px){ .how-grid{ grid-template-columns:1fr; } }
.how-step{ background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.08); border-radius:16px; padding:18px; box-shadow:0 10px 30px rgba(0,0,0,.35); }
.how-step h3{ margin:8px 0 6px; }
.how-icon{
  width:42px; height:42px; border-radius:12px; display:inline-flex; align-items:center; justify-content:center; font-weight:900;
  background:linear-gradient(135deg, var(--accent), var(--accent-2)); box-shadow:0 0 16px rgba(0,194,255,.45), 0 0 16px rgba(0,191,99,.35) inset;
}

/* ====================  TESTIMONIALS  ======================== */
.t-head{ text-align:center; margin-bottom: 22px; }
.t-grid{ display:grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
@media (max-width:980px){ .t-grid{ grid-template-columns:1fr; } }
.t-card{ display:grid; grid-template-columns: 56px 1fr; gap:12px; align-items:flex-start;
  background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.08); border-radius:16px; padding:16px; box-shadow:0 10px 30px rgba(0,0,0,.35);
}
.t-ava{ width:56px; height:56px; border-radius:12px; object-fit:cover; border:1px solid rgba(255,255,255,.12); }
.t-name{ font-weight:800; }
.t-stars{ color:#ffd76a; letter-spacing:.08em; font-weight:900; margin:2px 0 6px; }

/* ====================  FAQ (Accordion)  ======================== */
.faq-title{ text-align:center; margin-bottom: 20px; }
.faq-accordion{ list-style:none; margin:0; padding:0; display:grid; gap:12px; }
.faq-item{ border-radius:16px; background: rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.08); box-shadow: 0 10px 30px rgba(0,0,0,.45); overflow:hidden; transition: border-color .25s, background .25s, box-shadow .25s; }
.faq-item.is-open{ background: rgba(255,255,255,.06); border-color: rgba(255,255,255,.18); box-shadow: 0 18px 48px rgba(0,0,0,.6); }
.faq-q{ width:100%; display:grid; grid-template-columns: 1fr auto; align-items:center; gap:12px; padding:18px; background:transparent; border:0; color:var(--text); text-align:left; cursor:pointer; font-weight:800; }
.faq-q:hover{ background: rgba(255,255,255,.03); }
.faq-icon{ position: relative; width: 28px; height: 28px; border-radius: 8px; background: rgba(3,129,246,.10); border:1px solid rgba(255,255,255,.12); }
.faq-icon::before, .faq-icon::after{ content:""; position:absolute; left:50%; top:50%; width:14px; height:2px; background:#fff; border-radius:2px; transform: translate(-50%,-50%) rotate(0deg); transition: transform .25s, opacity .25s; }
.faq-icon::after{ transform: translate(-50%,-50%) rotate(90deg); }
.faq-item.is-open .faq-icon::after{ opacity:0; transform: translate(-50%,-50%) rotate(0deg); }
.faq-a{ padding: 0 18px; max-height: 0; overflow: hidden; opacity: 0; transform: translateY(-6px); border-top: 1px solid rgba(255,255,255,.08); background: rgba(255,255,255,.02); transition: max-height .45s, opacity .35s, transform .35s, padding .2s; }
.faq-a p{ color:#cfd3db; margin:14px 0 16px; line-height:1.65; }
.faq-item.is-open .faq-a{ max-height: 240px; opacity: 1; transform: translateY(0); padding-top: 6px; padding-bottom: 14px; }

/* ====================  Sticky CTA  ======================== */
.sticky-cta{
  position: fixed; left:0; right:0; bottom:-120px; z-index: 1200;
  transition: transform .35s ease, bottom .35s ease; transform: translateY(0);
}
.sticky-cta.is-visible{ bottom:0; }
.sticky-wrap{
  width:min(1100px, 92vw); margin:0 auto 14px auto; padding:12px 16px;
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  background: rgba(14,17,21,.9); backdrop-filter: saturate(160%) blur(12px); -webkit-backdrop-filter: saturate(160%) blur(12px);
  border:1px solid rgba(255,255,255,.08); border-radius:16px; box-shadow: 0 16px 40px rgba(0,0,0,.55);
}
.sticky-text{ font-weight:800; letter-spacing:.02em; }

/* Reduced motion */
@media (prefers-reduced-motion: reduce){
  .plan-card, .faq-a{ transition: none; }
  .sticky-cta{ transition: none; }
}

/* ========== MOBILE OVERLAY Z-INDEX CLARITY ========== */
:root { --z-overlay: 2001; } /* higher than --z-header:1000 */
.mobile-overlay{ z-index: var(--z-overlay) !important; }
.mobile-backdrop{ z-index: 0; }
.mobile-drawer{ z-index: 1; }
html.nav-open .site-header .brand{ opacity: 0; visibility: hidden; pointer-events: none; }
html.nav-open #mobile-toggle{ visibility:hidden; }
.site-header{ z-index: 1000; }
.mobile-overlay{ z-index: 1001; }

/* ========= RESULTS v2 (scoped) ========= */
#results .eq-legend{ display:flex; gap:8px; flex-wrap:wrap; margin-top:6px; }
#results .eq-legend .pill{
  display:inline-flex; align-items:center; gap:6px; padding:6px 10px; border-radius:999px;
  background: rgba(0,191,99,.12); border:1px solid rgba(0,191,99,.32); color:#eafff3; font-weight:800; letter-spacing:.04em;
  box-shadow: 0 4px 20px rgba(0,0,0,.35);
}

#results .eq-v2{ overflow:hidden; }
#results .eq-v2 .eq-wrap{
  position:relative; height:180px; border:1px solid var(--line); border-radius:12px;
  background:linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.01));
  margin-bottom:12px; box-shadow: 0 10px 30px rgba(0,0,0,.35);
}
#results .eq-v2 .eq-chart{ width:100%; height:100%; display:block; }
#results .eq-v2 .eq-line{ filter: drop-shadow(0 0 10px rgba(16,242,150,.35)); }
#results .eq-v2.is-live .eq-line{ transition: stroke-dashoffset 2.6s cubic-bezier(.2,.65,.2,1); }
#results .eq-v2 .eq-sheen{ opacity: .35; }
#results .eq-v2.is-live .eq-sheen{ animation: eqv2-sheen 6.5s linear infinite; }
@keyframes eqv2-sheen{
  0%{ transform: translateX(0); }
  100%{ transform: translateX(120%); }
}

/* Bars */
#results .eq-v2 .eq-bars{
  display:grid; grid-template-columns:repeat(8,1fr); gap:8px;
}
#results .eq-v2 .wbar{
  position:relative; height:160px; border-radius:12px; overflow:hidden;
  border:1px solid var(--line); background: rgba(255,255,255,.03);
}
#results .eq-v2 .wbar::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height: var(--to,50%);
  background: linear-gradient(180deg, rgba(0,194,255,.18), rgba(16,242,150,.85));
  box-shadow: 0 0 28px rgba(16,242,150,.38) inset;
  transform-origin: bottom;
  transform: scaleY(0);
}
#results .eq-v2.is-live .wbar::after{ transition: transform .9s cubic-bezier(.2,.65,.2,1); transform: scaleY(1); }
#results .eq-v2 .wbar span{
  position:absolute; left:0; right:0; bottom:8px; text-align:center; font-size:.8rem; color:var(--muted);
}

/* Small screens: keep layout tidy */
@media (max-width: 640px){
  #results .eq-v2 .eq-bars{ grid-template-columns: repeat(4,1fr); }
}

/* ===== Remove corner glows (global, kept) ===== */
.glow,
.plan-card .glow,
.card .glow { display: none !important; }

.section::before,
.section::after,
.hero::before,
.hero::after,
.how::before,
.how::after,
.plans::before,
.plans::after,
.trades::before,
.trades::after,
.testimonials::before,
.testimonials::after,
.faq::before,
.faq::after,
.cta-strip::before,
.cta-strip::after {
  content: none !important;
  background: none !important;
  box-shadow: none !important;
  filter: none !important;
  opacity: 0 !important;
}
.how,
.plans,
.trades,
.testimonials,
.faq,
.cta-strip {
  background-image: none !important;
  box-shadow: none !important;
  filter: none !important;
}
[class*="glow"],
[class*="halo"] { mix-blend-mode: normal !important; filter: none !important; }

/* ===== Equal spacing above/below the "All Results" CTA in WINS ===== */
.trades .results-cta{
  display: flex;
  justify-content: center;
  margin-top: 32px;   /* space from the cards */
  margin-bottom: 32px;/* same space down to the ticker */
}
@media (max-width: 768px){
  .trades .results-cta{
    margin-top: 24px;
    margin-bottom: 24px;
  }
}

/* ======================= Tiny SEO Expander ======================= */
.tiny-seo{
  background: transparent;
  padding: 0;
  margin: 8px 0 24px;
}
.tiny-seo details{
  width: min(1100px, 92vw);
  margin: 0 auto;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: rgba(255,255,255,.02);
  backdrop-filter: saturate(140%) blur(2px);
  -webkit-backdrop-filter: saturate(140%) blur(2px);
  overflow: hidden;
}
.tiny-seo summary::-webkit-details-marker{ display:none; }
.tiny-seo summary::marker{ content:""; }

.seo-summary{
  position: relative;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 34px 6px 10px; /* small height, room for caret */
  min-height: 28px;
  font-size: .8rem;           /* tiny text per request */
  letter-spacing: .02em;
  cursor: pointer;
  color: #e9eef7;
  background: rgba(255,255,255,.02);
}
.seo-summary:hover{ background: rgba(255,255,255,.04); }
.seo-summary:focus-visible{
  outline: none;
  box-shadow: var(--focus);
  border-radius: 10px;
}

.seo-summary-text{
  opacity: .85;
  font-weight: 800;
  text-transform: uppercase;
}

/* right-corner arrow */
.seo-caret{
  position: absolute;
  right: 8px;
  top: 50%;
  transform: translateY(-50%) rotate(0deg);
  transition: transform .25s ease, opacity .25s ease;
  opacity: .9;
}
.tiny-seo details[open] .seo-caret{
  transform: translateY(-50%) rotate(180deg);
}

/* expanded content */
.seo-content{
  padding: 12px 14px 14px;
  border-top: 1px solid var(--line);
  color: #cfd3db;
  font-size: .95rem;
  line-height: 1.65;
}
.seo-content h3{
  margin: 0 0 6px;
  font-size: 1.05rem;
  font-weight: 900;
  color: var(--text);
}
.seo-content a{
  color: var(--accent);
  text-decoration: underline;
  text-underline-offset: 2px;
}
.seo-content ul{
  margin: 8px 0 10px 18px;
  padding: 0;
}
.seo-content li{
  margin: 4px 0;
}

/* keep it unobtrusive on phones */
@media (max-width: 560px){
  .seo-summary{ font-size: .78rem; padding: 6px 32px 6px 10px; }
  .seo-content{ font-size: .92rem; }
}
