/* ═══════════════════════════════════════════════
   KING BI — Premium Design System v3.0
   ═══════════════════════════════════════════════ */

:root {
  --bg:       #030712;
  --bg2:      #060e1e;
  --cyan:     #00d2ff;
  --blue:     #1a6fff;
  --orange:   #ff9500;
  --gold:     #d4a820;
  --t1:       #eef2ff;
  --t2:       #6b7a99;
  --t3:       #2a3550;
  --glass:    rgba(6,14,30,0.72);
  --b0:       rgba(255,255,255,0.055);
  --b1:       rgba(0,210,255,0.22);
  --d:        'Syne',sans-serif;
  --b:        'Inter',sans-serif;
  --ease:     cubic-bezier(.4,0,.2,1);
  --spring:   cubic-bezier(.34,1.56,.64,1);
}

*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; font-size:16px; }
body {
  background:var(--bg);
  color:var(--t1);
  font-family:var(--b);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
  cursor:none;
}
a { text-decoration:none; color:inherit; }
strong { font-weight:600; color:var(--t1); }
em { font-style:normal; }
img { display:block; width:100%; }
::selection { background:rgba(0,210,255,.18); color:var(--cyan); }
::-webkit-scrollbar { width:3px; }
::-webkit-scrollbar-track { background:var(--bg); }
::-webkit-scrollbar-thumb { background:var(--blue); border-radius:2px; }

/* ── LAYOUT ───────────────────────────────────── */
.container { max-width:1180px; margin:0 auto; padding:0 44px; }
section { position:relative; }

/* ── CUSTOM CURSOR ───────────────────────────── */
.cur-dot, .cur-ring {
  position:fixed; top:0; left:0;
  border-radius:50%;
  pointer-events:none;
  z-index:9999;
  will-change:transform;
}
.cur-dot {
  width:7px; height:7px;
  background:var(--cyan);
  box-shadow:0 0 12px rgba(0,210,255,.9);
  transform:translate(-50%,-50%);
}
.cur-ring {
  width:38px; height:38px;
  border:1.5px solid rgba(0,210,255,.4);
  transform:translate(-50%,-50%);
  transition:width .2s var(--ease),height .2s var(--ease),border-color .2s;
}
.cursor-hover .cur-ring {
  width:56px; height:56px;
  border-color:rgba(0,210,255,.7);
}
@media (hover:none) { .cur-dot,.cur-ring { display:none; } body { cursor:auto; } }

/* ── PRELOADER ───────────────────────────────── */
.preloader {
  position:fixed; inset:0; z-index:9000;
  background:#000;
  display:flex; align-items:center; justify-content:center;
}
.pl-box { text-align:center; }
.pl-logo {
  font-family:var(--d);
  font-size:52px; font-weight:800;
  letter-spacing:-2px; color:var(--t1);
  margin-bottom:28px;
}
.pl-logo span { color:var(--cyan); text-shadow:0 0 30px rgba(0,210,255,.6); }
.pl-bar-wrap {
  width:200px; height:2px;
  background:rgba(255,255,255,.08);
  border-radius:2px; overflow:hidden;
  margin:0 auto 20px;
}
.pl-bar-fill { height:100%; width:0; background:var(--cyan); border-radius:2px; }
.pl-hint { font-size:12px; letter-spacing:2px; color:var(--t3); text-transform:uppercase; }

/* ── NAV ─────────────────────────────────────── */
.nav {
  position:fixed; top:0; left:0; right:0; z-index:100;
  padding:22px 44px;
  transition:padding .4s var(--ease), background .4s, border-color .4s;
  border-bottom:1px solid transparent;
}
.nav.scrolled {
  padding:14px 44px;
  background:rgba(3,7,18,.88);
  backdrop-filter:blur(24px);
  border-bottom-color:var(--b0);
}
.nav-inner {
  max-width:1180px; margin:0 auto;
  display:flex; align-items:center; gap:16px;
}
.nav-brand {
  font-family:var(--d); font-size:22px; font-weight:800;
  letter-spacing:-.5px; color:var(--t1);
}
.nav-brand span { color:var(--cyan); text-shadow:0 0 22px rgba(0,210,255,.5); }
.nav-sep { width:1px; height:16px; background:var(--t3); }
.nav-label { font-size:11px; font-weight:500; letter-spacing:1.8px; color:var(--t2); text-transform:uppercase; }

/* ── HERO ────────────────────────────────────── */
.hero {
  position:relative; min-height:100vh;
  display:flex; align-items:center; justify-content:center;
  overflow:hidden; padding:120px 44px 80px;
}
.hero-bg-img {
  position:absolute; inset:0;
  background-size:cover; background-position:center;
  transform:scale(1.05);
  transition:transform 0.1s linear;
}
.hero-overlay {
  position:absolute; inset:0;
  background:linear-gradient(135deg,rgba(3,7,18,.92) 30%,rgba(6,14,40,.75) 100%);
}
/* Dot grid texture */
.hero::before {
  content:'';
  position:absolute; inset:0; z-index:1;
  background-image:radial-gradient(rgba(255,255,255,.025) 1px,transparent 1px);
  background-size:36px 36px;
  pointer-events:none;
}
/* Animated mesh blobs */
.mesh-wrap { position:absolute; inset:0; z-index:1; pointer-events:none; overflow:hidden; }
.blob {
  position:absolute; border-radius:50%;
  filter:blur(90px);
}
.b1 {
  width:700px; height:700px;
  background:rgba(26,111,255,.12);
  top:-200px; left:-200px;
  animation:blob1 20s ease-in-out infinite alternate;
}
.b2 {
  width:500px; height:500px;
  background:rgba(0,210,255,.08);
  bottom:-100px; right:-100px;
  animation:blob2 15s ease-in-out infinite alternate;
}
.b3 {
  width:350px; height:350px;
  background:rgba(100,50,255,.06);
  top:50%; left:50%;
  animation:blob3 25s ease-in-out infinite alternate;
}
@keyframes blob1 { from{transform:translate(0,0) scale(1)} to{transform:translate(120px,80px) scale(1.15)} }
@keyframes blob2 { from{transform:translate(0,0) scale(1)} to{transform:translate(-80px,-60px) scale(1.1)} }
@keyframes blob3 { from{transform:translate(-50%,-50%) scale(1)} to{transform:translate(-40%,-60%) scale(1.2)} }

/* Floating badges */
.floaters { position:absolute; inset:0; z-index:2; pointer-events:none; }
.floater {
  position:absolute;
  display:flex; align-items:center; gap:10px;
  padding:12px 18px;
  background:rgba(6,14,30,.75);
  border:1px solid var(--b0);
  border-radius:14px;
  backdrop-filter:blur(20px);
  font-size:13px;
  opacity:0; /* animated in by GSAP */
}
.floater div { display:flex; flex-direction:column; }
.floater strong { font-size:13px; font-weight:700; color:var(--t1); line-height:1.2; }
.floater small { font-size:11px; color:var(--t2); margin-top:2px; }
.fl-ico { font-size:22px; }
.fl-a { top:22%; right:8%; animation:fl-float 4s ease-in-out infinite; }
.fl-b { top:42%; right:5%; animation:fl-float 4.5s ease-in-out infinite .5s; }
.fl-c { bottom:22%; right:10%; animation:fl-float 3.8s ease-in-out infinite 1s; }
@keyframes fl-float {
  0%,100% { transform:translateY(0); }
  50%      { transform:translateY(-10px); }
}
@media (max-width:900px) { .floaters { display:none; } }

/* Hero content */
.hero-content {
  position:relative; z-index:3;
  text-align:center; max-width:900px; width:100%;
}
.hero-eyebrow {
  display:inline-flex; align-items:center; gap:9px;
  font-size:11px; font-weight:600; letter-spacing:2.5px;
  text-transform:uppercase; color:var(--cyan);
  border:1px solid rgba(0,210,255,.25);
  background:rgba(0,210,255,.05);
  padding:8px 22px; border-radius:100px;
  margin-bottom:44px;
  backdrop-filter:blur(10px);
}
.eye-pulse {
  width:7px; height:7px;
  background:var(--cyan); border-radius:50%; flex-shrink:0;
  animation:pulse-ring 2.2s ease-in-out infinite;
}
@keyframes pulse-ring {
  0%,100% { box-shadow:0 0 0 0 rgba(0,210,255,.7); }
  50%      { box-shadow:0 0 0 8px rgba(0,210,255,0); }
}
.hero-wordmark {
  font-family:var(--d);
  font-size:clamp(72px,15vw,160px);
  font-weight:800;
  letter-spacing:-6px;
  line-height:.9;
  color:var(--t1);
  margin-bottom:26px;
}
.hero-wordmark span {
  color:var(--cyan);
  text-shadow:0 0 60px rgba(0,210,255,.6),0 0 120px rgba(0,210,255,.2);
}
.hero-h1 {
  font-family:var(--d);
  font-size:clamp(22px,4vw,46px);
  font-weight:700; letter-spacing:-1.5px; line-height:1.2;
  margin-bottom:28px;
}
.hl { display:block; }
.grad-text {
  background:linear-gradient(125deg,var(--cyan) 10%,var(--blue) 90%);
  -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;
}
.hero-sub {
  font-size:clamp(15px,1.8vw,18px); color:var(--t2);
  line-height:1.8; margin-bottom:56px;
}
.br-d { display:inline; }

/* ── CTA BUTTON ──────────────────────────────── */
.cta-wrap { margin-bottom:72px; }
.cta-btn {
  display:inline-flex; align-items:center; gap:14px;
  position:relative; overflow:hidden;
  padding:22px 56px;
  background:linear-gradient(135deg,rgba(0,210,255,.1),rgba(26,111,255,.07));
  border:1px solid rgba(0,210,255,.4);
  border-radius:100px;
  font-family:var(--d); font-size:17px; font-weight:700;
  letter-spacing:.3px; color:var(--t1);
  backdrop-filter:blur(20px);
  cursor:none;
  transition:transform .35s var(--spring), box-shadow .35s var(--ease), border-color .3s, background .3s;
  animation:btn-pulse 3.5s ease-in-out infinite;
}
@keyframes btn-pulse {
  0%,100% { box-shadow:0 0 30px rgba(0,210,255,.18); }
  50%      { box-shadow:0 0 60px rgba(0,210,255,.38),0 0 120px rgba(0,210,255,.08); }
}
.cta-btn:hover {
  animation-play-state:paused;
  transform:translateY(-4px) scale(1.03);
  border-color:var(--cyan);
  background:linear-gradient(135deg,rgba(0,210,255,.16),rgba(26,111,255,.12));
  box-shadow:
    0 0 0 1px rgba(0,210,255,.35),
    0 0 60px rgba(0,210,255,.3),
    0 24px 64px rgba(0,0,0,.55),
    inset 0 1px 0 rgba(255,255,255,.1);
}
.cta-btn:active { transform:translateY(-2px) scale(1.01); }
.cta-arr {
  width:19px; height:19px; flex-shrink:0;
  transition:transform .3s var(--spring);
}
.cta-btn:hover .cta-arr { transform:translateX(6px); }
/* Shimmer sweep */
.cta-shine {
  position:absolute; inset:0; border-radius:100px;
  background:linear-gradient(105deg,transparent 30%,rgba(255,255,255,.07) 50%,transparent 70%);
  transform:translateX(-110%);
  transition:transform .7s var(--ease);
}
.cta-btn:hover .cta-shine { transform:translateX(110%); }

/* Hero stats */
.hero-stats {
  display:flex; align-items:center; justify-content:center; gap:44px;
}
.hst { text-align:center; }
.hst-n {
  display:block; font-family:var(--d);
  font-size:32px; font-weight:800; letter-spacing:-1px; color:var(--t1); line-height:1;
}
.hst-l {
  display:block; font-size:11px; font-weight:500;
  letter-spacing:1.5px; text-transform:uppercase; color:var(--t3); margin-top:7px;
}
.hst-sep { width:1px; height:38px; background:var(--b0); }

/* Scroll hint */
.scroll-hint {
  position:absolute; bottom:36px; left:50%; transform:translateX(-50%);
  display:flex; flex-direction:column; align-items:center; gap:8px;
  animation:sh-bob 2.2s ease-in-out infinite;
  pointer-events:none; z-index:3;
}
@keyframes sh-bob {
  0%,100% { transform:translateX(-50%) translateY(0); opacity:.5; }
  50%      { transform:translateX(-50%) translateY(10px); opacity:.2; }
}
.sh-line { width:1px; height:44px; background:linear-gradient(to bottom,transparent,var(--cyan)); }
.scroll-hint span { font-size:10px; letter-spacing:2.5px; text-transform:uppercase; color:var(--t2); }

/* ── SECTION SHARED ──────────────────────────── */
.s-hd { text-align:center; margin-bottom:72px; }
.s-eye {
  display:inline-block; font-size:11px; font-weight:700;
  letter-spacing:3px; text-transform:uppercase; color:var(--cyan);
  margin-bottom:18px;
}
.s-eye::before,.s-eye::after { content:'  ——  '; opacity:.4; letter-spacing:0; }
.s-title {
  font-family:var(--d); font-size:clamp(30px,5vw,58px);
  font-weight:800; letter-spacing:-2.5px; line-height:1.05;
  margin-bottom:18px;
}
.s-sub { font-size:17px; color:var(--t2); max-width:520px; margin:0 auto; line-height:1.75; }

/* Wave dividers */
.wave { position:absolute; left:0; right:0; width:100%; overflow:hidden; line-height:0; }
.wave-top { top:0; }
.wave-bot { bottom:0; }
.wave svg { width:100%; height:70px; }

/* ── FREE SECTION ────────────────────────────── */
.s-free {
  padding:130px 0;
  background:linear-gradient(180deg,var(--bg) 0%,#050d1f 50%,var(--bg) 100%);
}
.free-grid {
  display:grid; grid-template-columns:repeat(4,1fr); gap:22px;
}
.icard {
  position:relative; border-radius:20px; overflow:hidden;
  background:var(--glass); border:1px solid var(--b0);
  transition:transform .5s var(--ease),box-shadow .5s,border-color .5s;
  will-change:transform; cursor:default;
}
.icard:hover {
  transform:translateY(-12px) scale(1.01);
  border-color:var(--b1);
  box-shadow:0 32px 72px rgba(0,0,0,.5),0 0 50px rgba(0,210,255,.07);
}
.icard-img { position:relative; height:210px; overflow:hidden; }
.icard-img img {
  height:100%; object-fit:cover;
  transition:transform .7s var(--ease);
}
.icard:hover .icard-img img { transform:scale(1.08); }
.icard-overlay {
  position:absolute; inset:0;
  background:linear-gradient(to bottom,rgba(3,7,18,.1) 0%,rgba(3,7,18,.85) 100%);
}
.icard-num {
  position:absolute; top:16px; left:16px;
  font-family:var(--d); font-size:11px; font-weight:800;
  letter-spacing:1px; color:var(--cyan);
  background:rgba(0,210,255,.1); border:1px solid rgba(0,210,255,.25);
  padding:4px 10px; border-radius:6px;
  backdrop-filter:blur(10px);
}
/* Glowing top line on hover */
.icard::before {
  content:''; position:absolute; top:0; left:0; right:0; height:1px; z-index:2;
  background:linear-gradient(90deg,transparent,var(--cyan),transparent);
  opacity:0; transition:opacity .4s;
}
.icard:hover::before { opacity:1; }
.icard-body { padding:24px 22px 28px; }
.icard-body h3 {
  font-family:var(--d); font-size:17px; font-weight:700;
  letter-spacing:-.3px; margin-bottom:10px;
}
.icard-body p { font-size:13.5px; color:var(--t2); line-height:1.72; margin-bottom:18px; }
.icard-tag { font-size:12px; color:var(--cyan); opacity:.7; font-weight:600; }
.icard-glow {
  position:absolute; inset:0; border-radius:20px;
  background:radial-gradient(ellipse at 50% 0%,rgba(0,210,255,.05) 0%,transparent 60%);
  opacity:0; transition:opacity .4s; pointer-events:none;
}
.icard:hover .icard-glow { opacity:1; }

/* ── PRO SECTION ─────────────────────────────── */
.s-pro { padding:130px 0; }
.pro-glow-bg {
  position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(ellipse 60% 40% at 50% 50%,rgba(26,111,255,.06) 0%,transparent 70%);
}
.pro-price-badge {
  display:inline-flex; flex-direction:column; align-items:center; gap:4px;
  border:1px solid var(--b1);
  background:linear-gradient(135deg,rgba(0,210,255,.07),rgba(26,111,255,.04));
  border-radius:18px; padding:20px 52px; margin-top:28px;
}
.ppb-label { font-size:11px; font-weight:700; letter-spacing:2.5px; color:var(--t2); text-transform:uppercase; }
.ppb-amount {
  font-family:var(--d); font-size:42px; font-weight:800; letter-spacing:-1.5px;
  color:var(--cyan); text-shadow:0 0 30px rgba(0,210,255,.45); line-height:1;
}
.ppb-sub { font-size:12px; color:var(--t3); letter-spacing:1px; }

/* Split layout */
.pro-split {
  display:grid; grid-template-columns:1fr 1fr; gap:48px;
  align-items:start;
}
/* Image column */
.pro-img-col { position:sticky; top:100px; }
.pro-img-wrap {
  position:relative; border-radius:22px; overflow:hidden;
  aspect-ratio:4/5;
}
.pro-wi {
  position:absolute; inset:0;
  width:100%; height:100%; object-fit:cover;
  opacity:0; transition:opacity .6s var(--ease),transform .6s var(--ease);
  transform:scale(1.04);
}
.pro-wi.active { opacity:1; transform:scale(1); }
.pro-img-overlay {
  position:absolute; inset:0;
  background:linear-gradient(to bottom,rgba(3,7,18,0) 30%,rgba(3,7,18,.92) 100%);
}
.pro-img-info {
  position:absolute; bottom:24px; left:24px; right:24px;
  background:rgba(6,14,30,.75); border:1px solid var(--b0);
  border-radius:14px; padding:16px 20px;
  backdrop-filter:blur(20px);
}
.pii-week { display:block; font-size:11px; font-weight:700; letter-spacing:2px; color:var(--cyan); text-transform:uppercase; margin-bottom:4px; }
.pii-title { display:block; font-family:var(--d); font-size:16px; font-weight:700; color:var(--t1); }

/* Tab buttons */
.week-tabs {
  display:flex; gap:8px; flex-wrap:wrap; margin-bottom:28px;
}
.wtab {
  display:flex; align-items:center; gap:8px;
  padding:11px 18px; border-radius:12px;
  background:rgba(255,255,255,.02); border:1px solid var(--b0);
  cursor:none; transition:all .3s var(--ease);
  font-family:var(--b);
}
.wtab-n { font-family:var(--d); font-size:13px; font-weight:800; color:var(--t3); transition:color .3s; }
.wtab-label { font-size:12px; font-weight:600; color:var(--t2); transition:color .3s; }
.wtab.active {
  background:rgba(0,210,255,.09); border-color:rgba(0,210,255,.3);
  box-shadow:0 0 20px rgba(0,210,255,.12);
}
.wtab.active .wtab-n { color:var(--cyan); }
.wtab.active .wtab-label { color:var(--t1); }
.wtab:hover:not(.active) { background:rgba(255,255,255,.04); border-color:var(--b0); }
.wtab:hover:not(.active) .wtab-label { color:var(--t1); }

/* Week panels */
.week-panels { position:relative; }
.wpanel { display:none; animation:wpIn .4s var(--ease) both; }
.wpanel.active { display:block; }
@keyframes wpIn { from{opacity:0;transform:translateY(14px)} to{opacity:1;transform:translateY(0)} }
.wp-hd { margin-bottom:24px; }
.wp-tag {
  display:inline-block; font-size:11px; font-weight:700; letter-spacing:2px;
  text-transform:uppercase; color:var(--cyan);
  border:1px solid rgba(0,210,255,.22); background:rgba(0,210,255,.06);
  padding:4px 14px; border-radius:100px; margin-bottom:12px;
}
.wp-hd h3 { font-family:var(--d); font-size:clamp(18px,2.5vw,26px); font-weight:700; letter-spacing:-.5px; margin-bottom:6px; }
.wp-hd em { font-size:13px; color:var(--t2); font-style:italic; }
.dlist { list-style:none; display:flex; flex-direction:column; gap:9px; }
.dlist li {
  display:flex; align-items:flex-start; gap:16px;
  padding:16px 20px; border-radius:12px;
  background:rgba(255,255,255,.018); border:1px solid var(--b0);
  transition:background .25s,border-color .25s;
}
.dlist li:hover { background:rgba(0,210,255,.03); border-color:rgba(0,210,255,.12); }
.dlist li.dl-star {
  background:linear-gradient(135deg,rgba(0,210,255,.05),rgba(26,111,255,.03));
  border-color:rgba(0,210,255,.18);
}
.dl-n {
  flex-shrink:0; width:35px; height:35px;
  background:rgba(0,210,255,.07); border:1px solid rgba(0,210,255,.2);
  border-radius:8px; display:flex; align-items:center; justify-content:center;
  font-family:var(--d); font-size:11px; font-weight:800; color:var(--cyan);
}
.dlist li p { font-size:14px; color:var(--t2); line-height:1.65; padding-top:8px; }

/* ── BENEFITS ────────────────────────────────── */
.s-ben { padding:130px 0; background:linear-gradient(180deg,var(--bg) 0%,#050d1f 50%,var(--bg) 100%); }
.ben-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-bottom:36px; }
.bcard {
  border-radius:22px; overflow:hidden;
  background:var(--glass); border:1px solid var(--b0);
  transition:transform .5s var(--ease),box-shadow .5s,border-color .5s;
  will-change:transform; cursor:default;
}
.bcard:hover {
  transform:translateY(-10px);
  border-color:var(--b1);
  box-shadow:0 30px 70px rgba(0,0,0,.5),0 0 50px rgba(0,210,255,.06);
}
.bcard--feat {
  border-color:rgba(212,168,32,.25);
  position:relative;
  transform:translateY(-8px);
}
.bcard--feat:hover { border-color:rgba(212,168,32,.5); box-shadow:0 30px 70px rgba(0,0,0,.5),0 0 50px rgba(212,168,32,.08); }
.bcard-img { position:relative; height:220px; overflow:hidden; }
.bcard-img img { height:100%; object-fit:cover; transition:transform .7s var(--ease); }
.bcard:hover .bcard-img img { transform:scale(1.07); }
.bcard-overlay {
  position:absolute; inset:0;
  background:linear-gradient(to bottom,rgba(3,7,18,.1) 0%,rgba(3,7,18,.8) 100%);
}
.bcard-feat-badge {
  position:absolute; top:16px; right:16px;
  font-size:10px; font-weight:700; letter-spacing:2px;
  text-transform:uppercase; color:#000;
  background:var(--gold); padding:5px 12px; border-radius:6px;
}
.bcard-body { padding:26px 24px 30px; }
.bcard-ico {
  width:48px; height:48px; color:var(--cyan);
  margin-bottom:20px; opacity:.8;
  transition:opacity .3s,transform .35s var(--spring);
}
.bcard:hover .bcard-ico { opacity:1; transform:scale(1.12); }
.bcard-ico--gold { color:var(--gold); }
.bcard-body h3 { font-family:var(--d); font-size:18px; font-weight:700; margin-bottom:12px; letter-spacing:-.3px; }
.bcard-body p { font-size:14px; color:var(--t2); line-height:1.75; }

/* Lifetime banner */
.life-banner {
  display:flex; align-items:center; gap:24px;
  padding:28px 36px; border-radius:18px;
  background:linear-gradient(135deg,rgba(0,210,255,.05),rgba(26,111,255,.03));
  border:1px solid rgba(0,210,255,.15);
}
.lb-icon { font-size:36px; flex-shrink:0; }
.life-banner strong { font-family:var(--d); font-size:18px; font-weight:700; display:block; margin-bottom:6px; }
.life-banner p { font-size:14px; color:var(--t2); line-height:1.7; }

/* ── OFFER SECTION ───────────────────────────── */
.s-offer { padding:130px 0; }
.offer-card {
  position:relative; max-width:860px; margin:0 auto;
  padding:76px 68px; border-radius:28px;
  background:linear-gradient(150deg,rgba(10,18,38,.95),rgba(6,12,26,.98));
  border:1px solid rgba(255,149,0,.22);
  overflow:hidden; text-align:center;
}
.oc-fire-bg { position:absolute; inset:0; pointer-events:none; }
.fire-blob {
  position:absolute; border-radius:50%; filter:blur(80px);
  animation:fire-drift linear infinite;
}
.fb1 { width:400px; height:300px; background:rgba(255,100,0,.08); top:-100px; left:50%; transform:translateX(-50%); animation-duration:12s; }
.fb2 { width:300px; height:200px; background:rgba(255,200,0,.05); bottom:-50px; right:-50px; animation-duration:9s; animation-direction:reverse; }
@keyframes fire-drift {
  0%   { transform:translate(0,0) scale(1); }
  33%  { transform:translate(40px,-20px) scale(1.1); }
  66%  { transform:translate(-20px,30px) scale(.9); }
  100% { transform:translate(0,0) scale(1); }
}
.oc-eyebrow {
  display:inline-block; font-size:10px; font-weight:700; letter-spacing:3.5px;
  text-transform:uppercase; color:var(--orange);
  border:1px solid rgba(255,149,0,.3); background:rgba(255,149,0,.06);
  padding:6px 20px; border-radius:100px; margin-bottom:28px;
}
.oc-title {
  font-family:var(--d); font-size:clamp(26px,4vw,46px);
  font-weight:800; letter-spacing:-1.5px; line-height:1.2; margin-bottom:18px;
}
.oc-pct { color:var(--orange); text-shadow:0 0 30px rgba(255,149,0,.5); }
.oc-desc { font-size:16px; color:var(--t2); line-height:1.75; margin-bottom:36px; max-width:580px; margin-left:auto; margin-right:auto; }
.oc-prices {
  display:flex; align-items:center; justify-content:center; gap:24px;
  margin-bottom:52px; flex-wrap:wrap;
}
.ocp-from,.ocp-to { display:flex; flex-direction:column; align-items:center; gap:6px; }
.ocp-label { font-size:11px; font-weight:600; letter-spacing:1.5px; color:var(--t2); text-transform:uppercase; }
.ocp-val { font-family:var(--d); font-weight:800; letter-spacing:-.5px; }
.ocp-strike { font-size:24px; color:var(--t3); text-decoration:line-through; text-decoration-color:rgba(255,255,255,.2); }
.ocp-new { font-size:52px; letter-spacing:-2px; color:var(--orange); text-shadow:0 0 40px rgba(255,149,0,.45); line-height:1; }
.ocp-arrow { color:var(--t3); }
.ocp-arrow svg { width:44px; }
.oc-steps {
  display:flex; align-items:flex-start; gap:0;
  margin-bottom:36px; text-align:left;
}
.ocs {
  flex:1; padding:24px 20px;
  background:rgba(255,255,255,.02); border:1px solid rgba(255,149,0,.1);
  border-radius:16px;
  transition:background .3s,border-color .3s;
}
.ocs:hover { background:rgba(255,149,0,.03); border-color:rgba(255,149,0,.22); }
.ocs-n {
  width:40px; height:40px; border-radius:10px;
  background:rgba(255,149,0,.1); border:1px solid rgba(255,149,0,.3);
  display:flex; align-items:center; justify-content:center;
  font-family:var(--d); font-size:16px; font-weight:800; color:var(--orange);
  margin-bottom:14px;
}
.ocs h4 { font-family:var(--d); font-size:15px; font-weight:700; margin-bottom:8px; }
.ocs p { font-size:13.5px; color:var(--t2); line-height:1.65; }
.ocs-arr {
  align-self:center; font-size:20px; color:var(--t3);
  padding:0 12px; flex-shrink:0;
}
.oc-note {
  font-size:14px; color:var(--t2); line-height:1.75;
  padding:20px 24px; border-radius:14px;
  background:rgba(255,255,255,.018); border:1px solid var(--b0);
  text-align:left;
}

/* ── FOOTER ──────────────────────────────────── */
.footer {
  padding:72px 44px; text-align:center;
  border-top:1px solid var(--b0); position:relative;
}
.footer::before {
  content:''; position:absolute; top:-1px; left:50%; transform:translateX(-50%);
  width:240px; height:1px;
  background:linear-gradient(90deg,transparent,var(--cyan),transparent);
}
.ft-brand { font-family:var(--d); font-size:38px; font-weight:800; letter-spacing:-1.5px; margin-bottom:10px; }
.ft-brand span { color:var(--cyan); text-shadow:0 0 22px rgba(0,210,255,.5); }
.ft-tag { font-size:12px; font-weight:500; letter-spacing:2.5px; text-transform:uppercase; color:var(--t2); margin-bottom:6px; }
.ft-url { font-size:12px; color:var(--cyan); opacity:.5; letter-spacing:1px; margin-bottom:32px; }
.ft-rule { border:none; border-top:1px solid var(--b0); width:36px; margin:0 auto 20px; }
.ft-copy { font-size:12px; color:var(--t3); letter-spacing:.4px; }

/* ── RESPONSIVE ──────────────────────────────── */
@media (max-width:1024px) {
  .free-grid { grid-template-columns:repeat(2,1fr); }
  .ben-grid  { grid-template-columns:repeat(2,1fr); }
  .bcard--feat { transform:none; }
  .pro-split { grid-template-columns:1fr; }
  .pro-img-col { position:static; }
  .pro-img-wrap { aspect-ratio:16/9; }
  .offer-card { padding:60px 48px; }
}
@media (max-width:768px) {
  .container { padding:0 24px; }
  .nav { padding:16px 24px; }
  .nav.scrolled { padding:12px 24px; }
  .nav-sep,.nav-label { display:none; }
  .hero { padding:100px 24px 72px; }
  .br-d,.hero-h1 br { display:none; }
  .hero-h1 .hl { display:inline; }
  .hero-stats { gap:24px; }
  .hst-n { font-size:26px; }
  .s-free,.s-pro,.s-ben,.s-offer { padding:90px 0; }
  .free-grid { grid-template-columns:1fr; }
  .ben-grid { grid-template-columns:1fr; }
  .oc-steps { flex-direction:column; }
  .ocs-arr { align-self:flex-start; padding:8px 0; }
  .offer-card { padding:44px 28px; }
  .ocp-new { font-size:40px; }
  .footer { padding:56px 24px; }
}
@media (max-width:480px) {
  .hero-wordmark { letter-spacing:-3px; }
  .cta-btn { padding:18px 36px; font-size:15px; }
  .hero-stats { gap:18px; }
  .hst-sep { height:28px; }
  .week-tabs { gap:6px; }
  .wtab { padding:9px 12px; }
  .wtab-label { display:none; }
  .ppb-amount { font-size:34px; }
  .ppb-badge { padding:18px 32px; }
  .oc-prices { flex-direction:column; gap:12px; }
  .ocp-arrow svg { transform:rotate(90deg); }
}