/* ==========================================================================
   SELFNAUT CREATIVE — Shared Brand Stylesheet
   Used by: homepage, portfolio, all landing pages
   Brand: white · royal blue · gold · crimson (accent)
   ========================================================================== */

/* ---------- BRAND TOKENS ---------- */
:root{
  --white:#FFFFFF;
  --bg-soft:#FAFAF7;
  --bg-cream:#F5F1E8;
  --royal:#1E3A8A;
  --royal-dark:#152C6B;
  --royal-deep:#0A1A47;
  --gold:#C9A227;
  --gold-warm:#D4B254;
  --gold-soft:#F2E4B3;
  --crimson:#DC2626;
  --crimson-deep:#B91C1C;
  --ink:#0F172A;
  --ink-soft:#475569;
  --ink-mute:#94A3B8;
  --border:#E5E7EB;
  --border-soft:#EFEFEA;
  --shadow-sm:0 1px 2px rgba(15,23,42,.05);
  --shadow-md:0 8px 24px rgba(15,23,42,.06);
  --shadow-lg:0 24px 60px rgba(15,23,42,.10);
  --radius:14px;
  --radius-lg:20px;
}

/* ---------- RESET ---------- */
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:'Inter',system-ui,-apple-system,sans-serif;
  color:var(--ink);
  background:var(--white);
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}

/* ---------- TYPOGRAPHY ---------- */
.eyebrow{
  font-family:'Inter',sans-serif;
  text-transform:uppercase;
  letter-spacing:.18em;
  font-size:12px;
  font-weight:600;
  color:var(--royal);
  display:inline-flex;
  align-items:center;
  gap:8px;
}
.eyebrow::before{
  content:"";
  width:24px;
  height:1px;
  background:var(--gold);
  display:inline-block;
}
.eyebrow.on-dark{color:var(--gold-warm)}
.eyebrow.on-dark::before{background:var(--gold)}
h1,h2,h3{
  font-family:'Fraunces',Georgia,serif;
  font-weight:600;
  letter-spacing:-.02em;
  line-height:1.08;
  color:var(--ink);
}
h1{font-size:clamp(40px,6vw,76px)}
h2{font-size:clamp(32px,4.4vw,52px);line-height:1.1}
h3{font-size:clamp(22px,2vw,28px);line-height:1.2}
p.lead{font-size:clamp(17px,1.4vw,20px);color:var(--ink-soft);max-width:60ch}
.accent-gold{color:var(--gold)}
.accent-royal{color:var(--royal)}
.accent-crimson{color:var(--crimson)}
.underline-gold{
  background-image:linear-gradient(transparent 62%, var(--gold-soft) 62%);
  padding:0 4px;
}

/* ---------- LAYOUT ---------- */
.wrap{max-width:1200px;margin:0 auto;padding:0 28px}
section{padding:120px 0;position:relative}
@media (max-width:720px){section{padding:80px 0}}

/* ---------- BUTTONS ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  padding:16px 28px;border-radius:999px;font-weight:600;font-size:15px;
  transition:transform .15s ease, box-shadow .2s ease, background .2s ease;
  cursor:pointer;border:none;font-family:'Inter',sans-serif;
}
.btn-primary{
  background:var(--royal);color:var(--white);
  box-shadow:0 8px 24px rgba(30,58,138,.28);
}
.btn-primary:hover{background:var(--royal-dark);transform:translateY(-1px);box-shadow:0 12px 30px rgba(30,58,138,.36)}
.btn-crimson{
  background:var(--crimson);color:var(--white);
  box-shadow:0 8px 24px rgba(220,38,38,.28);
}
.btn-crimson:hover{background:var(--crimson-deep);transform:translateY(-1px)}
.btn-ghost{
  background:transparent;color:var(--ink);
  border:1px solid var(--border);
}
.btn-ghost:hover{border-color:var(--ink);background:var(--white)}
.btn-gold{
  background:var(--gold);color:var(--royal-deep);
  box-shadow:0 8px 24px rgba(201,162,39,.30);
}
.btn-gold:hover{background:var(--gold-warm);transform:translateY(-1px)}
.btn .arrow{transition:transform .2s ease}
.btn:hover .arrow{transform:translateX(4px)}

/* ---------- NAV ---------- */
nav.top{
  position:sticky;top:0;z-index:50;
  background:rgba(255,255,255,.85);
  backdrop-filter:saturate(180%) blur(10px);
  border-bottom:1px solid var(--border-soft);
}
.nav-inner{display:flex;align-items:center;justify-content:space-between;padding:18px 28px;max-width:1200px;margin:0 auto}
.logo{
  font-family:'Fraunces',serif;font-weight:700;letter-spacing:.08em;
  font-size:18px;color:var(--royal-deep);
  display:inline-flex;align-items:center;gap:10px;
  white-space:nowrap;
}
.logo .dot{width:8px;height:8px;background:var(--gold);border-radius:50%;display:inline-block;flex-shrink:0}
.logo .name{display:inline-block}
.logo .name .alt{color:var(--gold);margin-left:4px}
.nav-links{display:flex;gap:32px;align-items:center}
.nav-links a{font-size:14px;font-weight:500;color:var(--ink-soft);transition:color .15s}
.nav-links a:hover{color:var(--royal)}
/* Specificity fix: buttons inside nav must keep their button text color */
.nav-links a.btn-primary,
.nav-links a.btn-crimson{color:var(--white)}
.nav-links a.btn-primary:hover,
.nav-links a.btn-crimson:hover{color:var(--white)}
.nav-links a.btn-gold{color:var(--royal-deep)}
.nav-links a.btn-gold:hover{color:var(--royal-deep)}
.nav-links a.btn-ghost{color:var(--ink)}
.nav-cta{padding:10px 20px;font-size:14px}

/* Hamburger toggle button */
.nav-toggle{
  display:none;
  align-items:center;justify-content:center;
  width:42px;height:42px;
  background:var(--white);border:1px solid var(--border);border-radius:10px;
  cursor:pointer;padding:0;flex-direction:column;gap:5px;
  transition:border-color .2s,background .2s;
}
.nav-toggle:hover{border-color:var(--royal)}
.nav-toggle span{
  width:18px;height:2px;background:var(--ink);border-radius:2px;
  transition:transform .3s cubic-bezier(.2,.7,.2,1),opacity .2s;
}
.nav-toggle.active span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav-toggle.active span:nth-child(2){opacity:0}
.nav-toggle.active span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

@media (max-width:780px){
  .nav-toggle{display:flex}
  /* Pages WITH a hamburger (homepage, portfolio): hide ALL nav links — drawer handles them.
     This avoids the cramped logo + Get Started + hamburger overlap. */
  .nav-inner:has(.nav-toggle) .nav-links > a{display:none}
  .nav-inner:has(.nav-toggle) .nav-links{gap:0}
  /* Pages WITHOUT a hamburger (landing pages): hide text links, keep the CTA visible. */
  .nav-inner:not(:has(.nav-toggle)) .nav-links > a:not(.nav-cta){display:none}
  /* Compact the landing-page CTA on mobile so it doesn't overlap the logo */
  .nav-inner:not(:has(.nav-toggle)) .nav-cta{padding:9px 16px;font-size:13px}
  .nav-inner:not(:has(.nav-toggle)) .nav-cta .price-tag{display:none}

  /* When drawer is open: turn nav-links into a fixed drawer */
  .nav-inner.open .nav-links{
    position:fixed;
    top:64px;left:0;right:0;
    flex-direction:column;align-items:stretch;
    background:var(--white);
    padding:8px 28px 24px;
    border-bottom:1px solid var(--border);
    box-shadow:0 18px 30px -12px rgba(15,23,42,.10);
    gap:0;z-index:49;
  }
  .nav-inner.open .nav-links > a{display:block;padding:16px 0;border-bottom:1px solid var(--border-soft);font-size:16px;color:var(--ink);font-weight:500}
  .nav-inner.open .nav-links > a:last-child{border-bottom:none}
  .nav-inner.open .nav-links > a.nav-cta{
    margin-top:14px;padding:14px 22px;text-align:center;
    color:var(--white) !important;border-bottom:none;
    font-size:15px;
  }
  /* Body scroll lock when drawer open */
  body.drawer-open{overflow:hidden}
  /* Backdrop */
  body.drawer-open::before{
    content:"";position:fixed;inset:64px 0 0 0;
    background:rgba(15,23,42,.4);z-index:48;
  }
}

/* ---------- HERO ---------- */
.hero{
  padding:40px 0 80px;
  background:
    radial-gradient(1200px 600px at 85% -10%, rgba(201,162,39,.10), transparent 60%),
    radial-gradient(900px 500px at -10% 110%, rgba(30,58,138,.07), transparent 60%),
    var(--white);
  position:relative;overflow:hidden;
}
@media (max-width:720px){.hero{padding:28px 0 60px}}
.hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:64px;align-items:start}
@media (max-width:960px){.hero-grid{grid-template-columns:1fr;gap:40px}}
.hero h1 .ink{color:var(--ink)}
.hero h1 .accent{color:var(--royal);font-style:italic;font-weight:500}
.hero-sub{margin-top:24px;font-size:clamp(17px,1.4vw,20px);color:var(--ink-soft);max-width:54ch}
.hero-ctas{margin-top:36px;display:flex;gap:14px;flex-wrap:wrap}
.hero-trust{margin-top:28px;display:flex;flex-wrap:wrap;gap:18px 28px;font-size:13px;color:var(--ink-soft);font-weight:500}
.hero-trust .item{display:flex;align-items:center;gap:8px}
.hero-trust .check{color:var(--gold);font-weight:700}

.hero-card{
  background:var(--white);border:1px solid var(--border);
  border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);
  padding:28px;position:relative;
}
.hero-card::before{
  content:"";position:absolute;inset:-1px;border-radius:var(--radius-lg);
  background:linear-gradient(135deg,rgba(201,162,39,.4),transparent 40%);z-index:-1;
}
.hero-card .label{font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--royal);margin-bottom:10px}
.hero-card .head{font-family:'Fraunces',serif;font-size:22px;line-height:1.2;color:var(--ink);margin-bottom:20px}
.hero-card .row{display:flex;justify-content:space-between;align-items:center;padding:14px 0;border-top:1px solid var(--border-soft)}
.hero-card .row:first-of-type{border-top:none}
.hero-card .row .name{font-size:14px;font-weight:600;color:var(--ink)}
.hero-card .row .meta{font-size:12px;color:var(--ink-mute);margin-top:2px}
.hero-card .row .price{font-family:'Fraunces',serif;font-size:20px;font-weight:600;color:var(--royal)}
.hero-card .row .price small{font-family:'Inter',sans-serif;font-size:11px;color:var(--ink-mute);font-weight:500;margin-left:4px;display:block;text-align:right;margin-top:2px}
.hero-card .stamp{
  margin-top:18px;display:flex;align-items:center;gap:10px;
  background:linear-gradient(135deg,var(--bg-cream),var(--white));
  border:1px solid var(--gold-soft);border-radius:12px;padding:12px 14px;
}
.hero-card .stamp .dot{width:8px;height:8px;border-radius:50%;background:#22C55E;box-shadow:0 0 0 4px rgba(34,197,94,.18)}
.hero-card .stamp .txt{font-size:13px;color:var(--ink);font-weight:500}

/* ---------- LOGO STRIP ---------- */
.logos{padding:28px 0 14px;border-top:1px solid var(--border-soft);border-bottom:1px solid var(--border-soft);background:var(--bg-soft)}
.logos-inner{display:flex;align-items:center;justify-content:space-between;gap:32px;flex-wrap:wrap;max-width:1200px;margin:0 auto;padding:0 28px}
.logos-label{font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-mute);font-weight:600}
.logos-row{display:flex;gap:36px;flex-wrap:wrap;align-items:center;opacity:.7}
.logos-row span{font-family:'Fraunces',serif;font-weight:600;font-size:18px;color:var(--ink-soft);letter-spacing:.04em}

/* ---------- PROBLEM ---------- */
.problem{background:var(--bg-soft)}
.section-head{max-width:760px;margin-bottom:56px}
.section-head h2{margin-top:14px}
.section-head p.lead{margin-top:18px}
.section-head.center{margin-left:auto;margin-right:auto;text-align:center}
.section-head.center .eyebrow{justify-content:center}
.section-head.center p.lead{margin-left:auto;margin-right:auto;text-align:center}
.pain-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
@media (max-width:760px){.pain-grid{grid-template-columns:1fr}}
.pain-card{background:var(--white);border:1px solid var(--border);border-radius:var(--radius);padding:28px;position:relative;transition:transform .2s,box-shadow .2s}
.pain-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}
.pain-card .x{
  width:36px;height:36px;border-radius:10px;
  background:rgba(220,38,38,.08);color:var(--crimson);
  display:flex;align-items:center;justify-content:center;font-weight:700;
  margin-bottom:16px;font-size:18px;
}
.pain-card h3{font-family:'Inter',sans-serif;font-size:18px;font-weight:700;letter-spacing:-.01em;margin-bottom:8px;color:var(--ink)}
.pain-card p{font-size:15px;color:var(--ink-soft)}
.pain-closer{
  margin-top:40px;padding:24px 28px;
  background:var(--royal-deep);color:var(--white);
  border-radius:var(--radius);font-family:'Fraunces',serif;
  font-size:clamp(18px,1.7vw,22px);font-weight:500;
  border-left:4px solid var(--gold);
}
.pain-closer .accent{color:var(--gold-warm)}

/* ---------- SOLUTION ---------- */
.solution{background:var(--white)}
.pillars{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:48px}
@media (max-width:820px){.pillars{grid-template-columns:1fr}}
.pillar{padding:32px;border:1px solid var(--border);border-radius:var(--radius);background:linear-gradient(180deg,var(--white),var(--bg-soft));transition:transform .2s,border-color .2s}
.pillar:hover{transform:translateY(-3px);border-color:var(--gold)}
.pillar .num{font-family:'Fraunces',serif;font-size:48px;font-weight:600;color:var(--gold);line-height:1;margin-bottom:14px}
.pillar h3{font-family:'Inter',sans-serif;font-size:18px;font-weight:700;margin-bottom:8px}
.pillar p{font-size:15px;color:var(--ink-soft)}

/* ---------- OFFERS ---------- */
.offers{background:var(--bg-soft)}
.offer-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:48px}
@media (max-width:960px){.offer-grid{grid-template-columns:1fr}}
.offer{
  background:var(--white);border:1px solid var(--border);border-radius:var(--radius-lg);
  padding:32px 30px;display:flex;flex-direction:column;
  transition:transform .25s,box-shadow .25s;position:relative;overflow:hidden;
}
.offer:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}
.offer.featured{border-color:var(--gold);box-shadow:0 0 0 1px var(--gold), var(--shadow-md)}
.offer.featured::before{
  content:"MOST POPULAR";position:absolute;top:18px;right:-32px;
  background:var(--gold);color:var(--royal-deep);font-size:11px;font-weight:700;
  letter-spacing:.12em;padding:4px 40px;transform:rotate(35deg);
}
.offer .tag{font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--royal);margin-bottom:10px}
.offer h3{font-family:'Fraunces',serif;font-size:26px;line-height:1.2;margin-bottom:6px}
.offer .pitch{font-family:'Fraunces',serif;font-size:18px;font-style:italic;color:var(--ink-soft);margin-bottom:20px;font-weight:400}
.offer .price-row{display:flex;align-items:baseline;gap:8px;margin-bottom:8px}
.offer .price{font-family:'Fraunces',serif;font-size:42px;font-weight:600;color:var(--royal)}
.offer .once{font-size:13px;color:var(--ink-mute);font-weight:500}
.offer .delivery{
  display:inline-flex;align-items:center;gap:6px;
  font-size:12px;font-weight:600;color:var(--crimson);
  background:rgba(220,38,38,.08);padding:5px 10px;border-radius:99px;
  margin-bottom:22px;width:fit-content;
}
.offer ul{list-style:none;margin-bottom:24px}
.offer ul li{padding:10px 0;border-top:1px solid var(--border-soft);font-size:14px;color:var(--ink);display:flex;gap:10px;line-height:1.45}
.offer ul li:first-child{border-top:none}
.offer ul li::before{content:"✓";color:var(--gold);font-weight:700;flex-shrink:0}
.offer .outcome{
  margin-top:auto;padding:14px 16px;background:var(--bg-cream);
  border-left:3px solid var(--gold);border-radius:8px;
  font-family:'Fraunces',serif;font-style:italic;font-size:15px;color:var(--ink);margin-bottom:20px;
}
.offer .cta{margin-top:auto}

/* ---------- CORE OFFER CARD (offer 04 — wide row) ---------- */
.offer-grid .offer.core-offer{
  grid-column:1 / -1;
  background:linear-gradient(135deg, var(--royal-deep) 0%, var(--royal) 60%, var(--royal-dark) 100%);
  color:var(--white);
  border:1px solid var(--gold);
  box-shadow:0 0 0 1px var(--gold-soft), 0 30px 60px -16px rgba(30,58,138,.30);
  display:grid;grid-template-columns:1.3fr 1fr;gap:40px;
  padding:40px;
  position:relative;overflow:hidden;
}
@media (max-width:780px){
  .offer-grid .offer.core-offer{grid-template-columns:1fr;gap:28px;padding:32px 26px}
}
.offer-grid .offer.core-offer::before{
  content:"";position:absolute;top:-100px;right:-100px;width:380px;height:380px;
  background:radial-gradient(circle,rgba(201,162,39,.22),transparent 70%);
  pointer-events:none;
}
.offer-grid .offer.core-offer:hover{transform:translateY(-4px);box-shadow:0 0 0 1px var(--gold), 0 36px 72px -16px rgba(30,58,138,.40)}
.offer-grid .offer.core-offer .core-tag{
  display:inline-block;
  background:var(--gold);color:var(--royal-deep);
  font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;
  padding:5px 12px;border-radius:99px;
  margin-bottom:14px;
  width:fit-content;
}
.offer-grid .offer.core-offer h3{
  font-family:'Fraunces',serif;font-size:clamp(28px,3.2vw,38px);
  line-height:1.15;color:var(--white);margin-bottom:14px;
}
.offer-grid .offer.core-offer h3 em{
  font-style:italic;font-weight:500;color:var(--gold-warm);
}
.offer-grid .offer.core-offer .pitch{
  font-family:'Inter',sans-serif;font-size:16px;font-style:normal;
  color:rgba(255,255,255,.72);margin-bottom:24px;line-height:1.55;font-weight:400;
}
.offer-grid .offer.core-offer .pitch strong{color:var(--gold-warm);font-weight:600}
.offer-grid .offer.core-offer ul{margin-bottom:0;list-style:none;position:relative;z-index:1}
.offer-grid .offer.core-offer ul li{
  padding:9px 0;border-top:1px solid rgba(255,255,255,.10);
  font-size:14px;color:rgba(255,255,255,.92);display:flex;gap:10px;line-height:1.45;
}
.offer-grid .offer.core-offer ul li:first-child{border-top:none}
.offer-grid .offer.core-offer ul li::before{content:"✓";color:var(--gold-warm);font-weight:700;flex-shrink:0}

.offer-grid .offer.core-offer .core-right{
  position:relative;z-index:1;
  display:flex;flex-direction:column;justify-content:center;
  text-align:right;
}
@media (max-width:780px){.offer-grid .offer.core-offer .core-right{text-align:left}}
.offer-grid .offer.core-offer .core-right .price-big{
  font-family:'Fraunces',serif;font-size:clamp(48px,6vw,68px);font-weight:600;
  line-height:1;color:var(--gold-warm);
}
.offer-grid .offer.core-offer .core-right .price-big small{
  font-family:'Inter',sans-serif;font-size:.32em;color:rgba(255,255,255,.55);
  font-weight:500;letter-spacing:.04em;margin-left:6px;text-transform:uppercase;
}
.offer-grid .offer.core-offer .core-right .monthly{
  font-size:15px;color:rgba(255,255,255,.85);margin-top:8px;font-weight:500;
}
.offer-grid .offer.core-offer .core-right .monthly strong{color:var(--white)}
.offer-grid .offer.core-offer .core-right .ad-budget{
  font-size:12px;color:rgba(255,255,255,.55);margin-top:10px;
  line-height:1.5;
}
.offer-grid .offer.core-offer .core-right .btn{margin-top:22px;align-self:flex-end}
@media (max-width:780px){.offer-grid .offer.core-offer .core-right .btn{align-self:flex-start;width:100%}}

/* ---------- HOW IT WORKS ---------- */
.how{background:var(--royal-deep);color:var(--white);overflow:hidden;position:relative}
.how::before{
  content:"";position:absolute;top:-200px;right:-200px;width:600px;height:600px;
  background:radial-gradient(circle,rgba(201,162,39,.18),transparent 70%);pointer-events:none;
}
.how h2{color:var(--white)}
.how .lead{color:rgba(255,255,255,.72)}
.how .section-head{position:relative;z-index:1}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-top:56px;position:relative;z-index:1}
@media (max-width:820px){.steps{grid-template-columns:1fr}}
.step{position:relative;padding:32px 28px;border:1px solid rgba(255,255,255,.12);border-radius:var(--radius);background:rgba(255,255,255,.03)}
.step .step-num{font-family:'Fraunces',serif;font-size:14px;font-weight:600;color:var(--gold);letter-spacing:.16em;text-transform:uppercase;margin-bottom:14px}
.step h3{font-family:'Fraunces',serif;font-size:24px;color:var(--white);margin-bottom:10px}
.step p{font-size:15px;color:rgba(255,255,255,.72)}
.step-line{position:absolute;top:50px;left:100%;width:28px;height:1px;background:linear-gradient(90deg,var(--gold),transparent)}
@media (max-width:820px){.step-line{display:none}}

/* ---------- VALUE STACK ---------- */
.value{background:var(--white)}
.value-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:48px}
@media (max-width:960px){.value-grid{grid-template-columns:1fr}}
.stack{border:1px solid var(--border);border-radius:var(--radius-lg);padding:30px;background:var(--bg-soft)}
.stack-title{font-family:'Fraunces',serif;font-size:20px;font-weight:600;margin-bottom:6px}
.stack-meta{font-size:13px;color:var(--ink-mute);margin-bottom:20px}
.stack ul{list-style:none}
.stack li{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;padding:12px 0;border-bottom:1px dashed var(--border);font-size:14px}
.stack li:last-child{border-bottom:none}
.stack li .label{color:var(--ink);flex:1}
.stack li .val{color:var(--ink-soft);font-weight:600;font-size:13px;white-space:nowrap}
.stack-total{
  margin-top:18px;padding:14px 16px;background:var(--white);
  border:1px solid var(--gold);border-radius:10px;
  display:flex;justify-content:space-between;align-items:center;
}
.stack-total .you-pay{font-family:'Fraunces',serif;font-size:13px;color:var(--ink-soft)}
.stack-total .you-pay strong{font-size:24px;color:var(--royal);display:block;font-weight:600;margin-top:2px}
.stack-total .you-save{background:var(--crimson);color:var(--white);font-size:11px;font-weight:700;padding:6px 10px;border-radius:99px;letter-spacing:.06em}

/* ---------- PRICING ---------- */
.pricing{background:var(--bg-cream);position:relative;overflow:hidden}
.pricing::before{
  content:"";position:absolute;inset:0;
  background:radial-gradient(700px 400px at 50% 0%, rgba(201,162,39,.18), transparent 60%);pointer-events:none;
}
.price-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:48px}
@media (max-width:960px){.price-grid{grid-template-columns:1fr}}
.price-card{background:var(--white);border:1px solid var(--border);border-radius:var(--radius-lg);padding:32px 28px;text-align:left;display:flex;flex-direction:column;position:relative}
.price-card.popular{border-color:var(--gold);box-shadow:0 0 0 2px var(--gold-soft)}
.price-card .badge{position:absolute;top:-13px;left:50%;transform:translateX(-50%);background:var(--gold);color:var(--royal-deep);font-size:11px;font-weight:700;letter-spacing:.12em;padding:6px 14px;border-radius:99px}
.price-card h3{font-family:'Fraunces',serif;font-size:22px;margin-bottom:6px}
.price-card .desc{font-size:14px;color:var(--ink-soft);margin-bottom:18px}
.price-card .num{font-family:'Fraunces',serif;font-size:54px;font-weight:600;color:var(--royal);line-height:1}
.price-card .num small{font-family:'Inter',sans-serif;font-size:14px;color:var(--ink-mute);font-weight:500;margin-left:4px}
.price-card .ship{margin-top:8px;font-size:13px;color:var(--crimson);font-weight:600}
.price-card .btn{margin-top:24px;width:100%}

.bundle{
  margin-top:32px;background:var(--royal-deep);color:var(--white);
  border-radius:var(--radius-lg);padding:40px;
  display:grid;grid-template-columns:1.4fr 1fr;gap:32px;align-items:center;
  position:relative;overflow:hidden;
}
@media (max-width:780px){.bundle{grid-template-columns:1fr;padding:32px}}
.bundle::before{content:"";position:absolute;top:-100px;right:-100px;width:400px;height:400px;background:radial-gradient(circle,rgba(201,162,39,.22),transparent 70%)}
.bundle .pill{display:inline-block;background:var(--gold);color:var(--royal-deep);font-size:11px;font-weight:700;letter-spacing:.16em;padding:6px 12px;border-radius:99px;margin-bottom:16px}
.bundle h3{font-family:'Fraunces',serif;color:var(--white);font-size:32px;line-height:1.15;margin-bottom:10px}
.bundle p{color:rgba(255,255,255,.78);font-size:15px;max-width:46ch}
.bundle .right{position:relative;z-index:1;text-align:right}
@media (max-width:780px){.bundle .right{text-align:left}}
.bundle .strike{font-family:'Fraunces',serif;font-size:18px;color:rgba(255,255,255,.5);text-decoration:line-through;margin-bottom:6px}
.bundle .big{font-family:'Fraunces',serif;font-size:64px;font-weight:600;line-height:1;color:var(--gold-warm)}
.bundle .save{font-size:13px;color:var(--white);margin-top:8px;font-weight:600}
.bundle .btn{margin-top:18px}

/* ---------- PORTFOLIO ---------- */
.portfolio{background:var(--white)}
.portfolio-filters{display:flex;flex-wrap:wrap;gap:8px;margin:36px 0 32px}
.portfolio-filters button{
  background:var(--white);border:1px solid var(--border);
  padding:8px 16px;border-radius:99px;font-size:13px;font-weight:600;
  color:var(--ink-soft);cursor:pointer;transition:all .15s;
  font-family:'Inter',sans-serif;
}
.portfolio-filters button:hover{border-color:var(--royal);color:var(--royal)}
.portfolio-filters button.active{background:var(--royal);color:var(--white);border-color:var(--royal)}
.portfolio-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
@media (max-width:960px){.portfolio-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.portfolio-grid{grid-template-columns:1fr}}
.case-card{
  background:var(--white);border:1px solid var(--border);
  border-radius:var(--radius-lg);overflow:hidden;
  transition:transform .25s,box-shadow .25s,border-color .25s;
  display:flex;flex-direction:column;cursor:pointer;
}
.case-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg);border-color:var(--gold-soft)}
.case-thumb{
  aspect-ratio:16/10;
  background:linear-gradient(135deg,var(--royal-deep) 0%,var(--royal) 50%,var(--royal-dark) 100%);
  position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;
}
.case-thumb::before{
  content:"";position:absolute;inset:0;
  background:radial-gradient(400px 200px at 50% 30%, rgba(201,162,39,.25), transparent 60%);
}
.case-thumb .mockup{
  position:relative;z-index:1;width:75%;height:70%;
  background:var(--white);border-radius:8px;
  box-shadow:0 16px 40px rgba(0,0,0,.3);
  overflow:hidden;display:flex;flex-direction:column;
}
.case-thumb .mockup .bar{height:18px;background:var(--bg-soft);display:flex;align-items:center;gap:4px;padding:0 8px;border-bottom:1px solid var(--border-soft)}
.case-thumb .mockup .bar i{width:6px;height:6px;border-radius:50%;background:var(--ink-mute);display:inline-block;font-style:normal}
.case-thumb .mockup .body{flex:1;padding:12px;display:flex;flex-direction:column;gap:6px}
.case-thumb .mockup .body .h{height:8px;background:var(--royal);border-radius:2px;width:60%}
.case-thumb .mockup .body .l{height:4px;background:var(--border);border-radius:2px;width:90%}
.case-thumb .mockup .body .l.short{width:70%}
.case-thumb .mockup .body .b{height:14px;background:var(--gold);border-radius:3px;width:30%;margin-top:auto}
.case-thumb.thumb-funnel{background:linear-gradient(135deg,var(--crimson-deep) 0%,var(--royal-deep) 100%)}
.case-thumb.thumb-ai{background:linear-gradient(135deg,var(--royal) 0%,#0F766E 100%)}
.case-tag{
  position:absolute;top:14px;left:14px;z-index:2;
  background:var(--white);color:var(--royal);
  font-size:10px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  padding:5px 10px;border-radius:99px;
}
.case-body{padding:22px 24px}
.case-client{font-size:12px;color:var(--ink-mute);font-weight:600;letter-spacing:.06em;text-transform:uppercase;margin-bottom:6px}
.case-title{font-family:'Fraunces',serif;font-size:20px;font-weight:600;line-height:1.25;margin-bottom:10px;color:var(--ink)}
.case-result{
  display:inline-flex;align-items:center;gap:6px;
  font-size:13px;font-weight:600;color:var(--royal);
  background:rgba(30,58,138,.06);padding:6px 12px;border-radius:99px;
  margin-bottom:14px;
}
.case-result strong{color:var(--gold)}
.case-meta{font-size:13px;color:var(--ink-soft);line-height:1.55}

/* ---------- TESTIMONIALS ---------- */
.proof{background:var(--bg-soft)}
.testimonial-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:48px}
@media (max-width:960px){.testimonial-grid{grid-template-columns:1fr}}
.testi{background:var(--white);border:1px solid var(--border);border-radius:var(--radius);padding:28px;display:flex;flex-direction:column}
.testi .stars{color:var(--gold);font-size:14px;letter-spacing:2px;margin-bottom:14px}
.testi blockquote{font-family:'Fraunces',serif;font-size:18px;line-height:1.45;color:var(--ink);margin-bottom:20px;flex:1}
.testi .who{display:flex;align-items:center;gap:12px;margin-top:auto}
.testi .avatar{width:42px;height:42px;border-radius:50%;background:linear-gradient(135deg,var(--royal),var(--gold));display:flex;align-items:center;justify-content:center;color:var(--white);font-weight:700;font-size:14px}
.testi .info .name{font-weight:600;font-size:14px;color:var(--ink)}
.testi .info .role{font-size:13px;color:var(--ink-mute)}

.stats{margin-top:40px;display:grid;grid-template-columns:repeat(4,1fr);gap:20px;padding:32px;background:var(--royal-deep);color:var(--white);border-radius:var(--radius-lg)}
@media (max-width:780px){.stats{grid-template-columns:repeat(2,1fr)}}
.stat .num{font-family:'Fraunces',serif;font-size:42px;font-weight:600;color:var(--gold-warm);line-height:1}
.stat .lbl{font-size:13px;color:rgba(255,255,255,.7);margin-top:6px}

/* ---------- OBJECTIONS ---------- */
.objections{background:var(--bg-soft)}
.faq{max-width:840px;margin:48px auto 0}
.faq details{background:var(--white);border:1px solid var(--border);border-radius:var(--radius);margin-bottom:12px;overflow:hidden;transition:border-color .2s,box-shadow .2s}
.faq details[open]{border-color:var(--gold);box-shadow:var(--shadow-md)}
.faq summary{list-style:none;cursor:pointer;padding:22px 26px;display:flex;justify-content:space-between;align-items:center;font-weight:600;font-size:16px;color:var(--ink)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-size:22px;color:var(--royal);font-weight:300;transition:transform .2s}
.faq details[open] summary::after{transform:rotate(45deg);color:var(--gold)}
.faq .answer{padding:0 26px 24px;color:var(--ink-soft);font-size:15px;line-height:1.65}

/* ---------- FINAL CTA ---------- */
.final{
  background:linear-gradient(135deg,var(--royal-deep) 0%,var(--royal) 60%,var(--royal-dark) 100%);
  color:var(--white);text-align:center;position:relative;overflow:hidden;
}
.final::before{
  content:"";position:absolute;inset:0;
  background:
    radial-gradient(700px 350px at 50% 0%, rgba(201,162,39,.20), transparent 60%),
    radial-gradient(500px 300px at 50% 100%, rgba(220,38,38,.10), transparent 60%);
  pointer-events:none;
}
.final-inner{position:relative;z-index:1;max-width:780px;margin:0 auto}
.final .eyebrow{color:var(--gold-warm)}
.final .eyebrow::before{background:var(--gold)}
.final h2{color:var(--white);margin-top:14px;font-size:clamp(34px,4.6vw,56px)}
.final h2 em{color:var(--gold-warm);font-style:italic}
.final p.lead{color:rgba(255,255,255,.78);margin:22px auto 0}
.urgency{
  margin:30px auto 0;display:inline-flex;align-items:center;gap:10px;
  padding:8px 16px;background:rgba(220,38,38,.18);border:1px solid rgba(220,38,38,.4);
  border-radius:99px;font-size:13px;font-weight:600;color:#FCA5A5;
}
.urgency .pulse{width:8px;height:8px;border-radius:50%;background:var(--crimson);box-shadow:0 0 0 0 rgba(220,38,38,.7);animation:pulse 1.6s infinite}
@keyframes pulse{
  0%{box-shadow:0 0 0 0 rgba(220,38,38,.6)}
  70%{box-shadow:0 0 0 12px rgba(220,38,38,0)}
  100%{box-shadow:0 0 0 0 rgba(220,38,38,0)}
}
.final-cta{margin-top:32px;display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.final-trust{margin-top:32px;display:flex;flex-wrap:wrap;gap:18px 28px;justify-content:center;font-size:13px;color:rgba(255,255,255,.7);font-weight:500}
.final-trust .check{color:var(--gold-warm);margin-right:6px;font-weight:700}

/* ---------- FOOTER ---------- */
footer{background:var(--royal-deep);color:rgba(255,255,255,.6);padding:40px 0;border-top:1px solid rgba(255,255,255,.08)}
.footer-inner{display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap;max-width:1200px;margin:0 auto;padding:0 28px}
.footer-inner .brand{font-family:'Fraunces',serif;font-weight:700;letter-spacing:.08em;color:var(--white);font-size:16px}
.footer-inner .brand .dot{display:inline-block;width:6px;height:6px;background:var(--gold);border-radius:50%;margin-right:8px}
.footer-inner small{font-size:13px}
.footer-links{display:flex;gap:24px;font-size:13px}
.footer-links a:hover{color:var(--gold-warm)}

/* ==========================================================================
   PREMIUM POLISH — added later for visual elevation
   ========================================================================== */

/* ---------- SCROLL REVEAL ---------- */
.reveal{opacity:0;transform:translateY(28px);transition:opacity .9s cubic-bezier(.2,.7,.2,1),transform .9s cubic-bezier(.2,.7,.2,1)}
.reveal.in{opacity:1;transform:translateY(0)}
.reveal.d1{transition-delay:.08s}
.reveal.d2{transition-delay:.16s}
.reveal.d3{transition-delay:.24s}
.reveal.d4{transition-delay:.32s}

/* ---------- SUBTLE GRAIN TEXTURE ---------- */
.grain{position:relative}
.grain::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200' viewBox='0 0 200 200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.4 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
  opacity:.45;mix-blend-mode:overlay;z-index:0;
}
.grain > *{position:relative;z-index:1}

/* ---------- HERO HEADLINE EMBELLISHMENT ---------- */
.hero h1 .accent{
  position:relative;
  background:linear-gradient(120deg,var(--royal) 0%, #3B5BC6 60%, var(--royal-dark) 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.hero h1 .accent::after{
  content:"";position:absolute;left:0;right:8%;bottom:-2px;height:6px;
  background:linear-gradient(90deg,var(--gold-warm),var(--gold) 60%,transparent);
  border-radius:6px;opacity:.55;
}

/* ---------- HERO TRUST STRIP (avatars) ---------- */
.hero-trustline{
  margin-top:32px;display:flex;align-items:center;gap:14px;flex-wrap:wrap;
}
.hero-trustline .avatars{display:flex}
.hero-trustline .avatars .av{
  width:34px;height:34px;border-radius:50%;border:2px solid var(--white);
  margin-left:-10px;
  box-shadow:var(--shadow-sm);
  display:flex;align-items:center;justify-content:center;
  font-family:'Inter',sans-serif;font-size:11px;font-weight:700;color:var(--white);
}
.hero-trustline .avatars .av:first-child{margin-left:0}
.hero-trustline .avatars .av.a1{background:linear-gradient(135deg,var(--royal),#3B5BC6)}
.hero-trustline .avatars .av.a2{background:linear-gradient(135deg,#7E22CE,var(--crimson))}
.hero-trustline .avatars .av.a3{background:linear-gradient(135deg,var(--gold),#A07A1F)}
.hero-trustline .avatars .av.a4{background:linear-gradient(135deg,#0F766E,var(--royal))}
.hero-trustline .stars{color:var(--gold);font-size:13px;letter-spacing:2px;line-height:1}
.hero-trustline .meta{font-size:13px;color:var(--ink-soft);line-height:1.4}
.hero-trustline .meta strong{color:var(--ink);font-weight:600}

/* ---------- HERO STACK VISUAL ---------- */
.hero-stack{
  position:relative;height:560px;perspective:1400px;
}
@media (max-width:960px){.hero-stack{height:520px}}
@media (max-width:520px){.hero-stack{height:480px}}
.hero-stack .stack-card{
  position:absolute;width:88%;max-width:380px;padding:24px 26px;
  background:var(--white);border:1px solid var(--border);
  border-radius:18px;box-shadow:0 24px 56px -12px rgba(15,23,42,.18), 0 8px 16px -8px rgba(15,23,42,.08);
  transition:transform .5s cubic-bezier(.2,.7,.2,1),box-shadow .5s;
  transform-origin:center center;
}
.hero-stack .stack-card .row-top{
  display:flex;justify-content:space-between;align-items:center;margin-bottom:18px;
}
.hero-stack .stack-card .pill{
  font-size:10px;letter-spacing:.16em;font-weight:700;text-transform:uppercase;
  padding:5px 10px;border-radius:99px;
  background:var(--bg-cream);color:var(--royal);
}
.hero-stack .stack-card .delivery-mini{
  font-size:11px;font-weight:700;color:var(--crimson);
  background:rgba(220,38,38,.08);padding:5px 9px;border-radius:99px;
}
.hero-stack .stack-card .icon-wrap{
  width:42px;height:42px;border-radius:12px;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,var(--bg-cream),var(--white));
  border:1px solid var(--gold-soft);margin-bottom:14px;
  color:var(--royal);
}
.hero-stack .stack-card .name{
  font-family:'Fraunces',serif;font-size:20px;font-weight:600;color:var(--ink);
  line-height:1.2;margin-bottom:4px;
}
.hero-stack .stack-card .desc{
  font-size:12px;color:var(--ink-mute);margin-bottom:18px;line-height:1.5;
}
.hero-stack .stack-card .price-line{
  display:flex;justify-content:space-between;align-items:center;
  padding-top:14px;border-top:1px solid var(--border-soft);
}
.hero-stack .stack-card .price-line .p{
  font-family:'Fraunces',serif;font-size:24px;font-weight:600;color:var(--royal);
}
.hero-stack .stack-card .price-line .p small{
  font-family:'Inter',sans-serif;font-size:11px;color:var(--ink-mute);font-weight:500;margin-left:3px;
}
.hero-stack .stack-card .price-line .own{
  font-size:11px;color:var(--ink-mute);font-weight:600;letter-spacing:.08em;text-transform:uppercase;
}

/* Stack positions — top card is "featured" (DESKTOP layered look) */
.hero-stack .s1{top:0;right:6%;z-index:3;transform:rotate(-2deg);border-color:var(--gold);box-shadow:0 30px 60px -12px rgba(201,162,39,.28), 0 8px 24px -8px rgba(15,23,42,.10)}
.hero-stack .s2{top:160px;right:0;z-index:2;transform:rotate(1.4deg)}
.hero-stack .s3{top:320px;right:8%;z-index:1;transform:rotate(-1deg)}

.hero-stack:hover .s1{transform:rotate(-1deg) translateY(-6px)}
.hero-stack:hover .s2{transform:rotate(0deg) translateY(-3px)}
.hero-stack:hover .s3{transform:rotate(0deg) translateY(0)}

/* Mobile/tablet: clean vertical stack — no rotations, no overlap, normal flow */
@media (max-width:960px){
  .hero-stack{
    height:auto;perspective:none;
    display:flex;flex-direction:column;gap:14px;margin-top:8px;
  }
  .hero-stack::before{display:none}
  .hero-stack .stack-card{
    position:relative !important;
    top:auto !important;right:auto !important;left:auto !important;
    width:100% !important;max-width:100% !important;
    transform:none !important;
    box-shadow:0 12px 28px -12px rgba(15,23,42,.10);
  }
  .hero-stack .s1{border-color:var(--gold);box-shadow:0 0 0 1px var(--gold-soft), 0 16px 32px -12px rgba(201,162,39,.20)}
  .hero-stack:hover .stack-card{transform:none !important}
  .hero-stack .live-badge{
    position:relative;top:auto;left:auto;
    align-self:flex-start;margin-bottom:6px;
  }
}

/* Floating "LIVE" badge */
.hero-stack .live-badge{
  position:absolute;top:-10px;left:6%;z-index:5;
  display:inline-flex;align-items:center;gap:8px;
  background:var(--royal-deep);color:var(--white);
  padding:8px 14px;border-radius:99px;
  font-size:11px;font-weight:700;letter-spacing:.14em;
  box-shadow:0 12px 24px -6px rgba(15,23,42,.3);
}
.hero-stack .live-badge .dot{
  width:8px;height:8px;border-radius:50%;background:#22C55E;
  box-shadow:0 0 0 0 rgba(34,197,94,.7);animation:pulse-green 1.6s infinite;
}
@keyframes pulse-green{
  0%{box-shadow:0 0 0 0 rgba(34,197,94,.6)}
  70%{box-shadow:0 0 0 10px rgba(34,197,94,0)}
  100%{box-shadow:0 0 0 0 rgba(34,197,94,0)}
}

/* Floating gold halo behind the stack */
.hero-stack::before{
  content:"";position:absolute;inset:-40px;
  background:radial-gradient(closest-side,rgba(201,162,39,.18),transparent 70%);
  z-index:0;pointer-events:none;
}

/* ---------- MANIFESTO SECTION ---------- */
.manifesto{
  background:var(--royal-deep);color:var(--white);
  padding:140px 0;text-align:center;position:relative;overflow:hidden;
}
@media (max-width:720px){.manifesto{padding:90px 0}}
.manifesto::before{
  content:"";position:absolute;inset:0;
  background:
    radial-gradient(900px 500px at 50% 30%, rgba(201,162,39,.20), transparent 60%),
    radial-gradient(600px 400px at 50% 100%, rgba(30,58,138,.4), transparent 60%);
  pointer-events:none;
}
.manifesto .wrap{position:relative;z-index:1}
.manifesto .stamp{
  display:inline-flex;align-items:center;gap:8px;
  padding:7px 14px;border-radius:99px;
  background:rgba(201,162,39,.12);border:1px solid rgba(201,162,39,.3);
  font-size:11px;letter-spacing:.18em;font-weight:600;color:var(--gold-warm);
  text-transform:uppercase;margin-bottom:36px;
}
.manifesto .stamp::before{content:"";width:6px;height:6px;background:var(--gold);border-radius:50%}
.manifesto .statement{
  font-family:'Fraunces',serif;
  font-size:clamp(44px,7vw,108px);
  line-height:.98;letter-spacing:-.035em;
  font-weight:500;color:var(--white);
  max-width:1100px;margin:0 auto;
}
.manifesto .statement em{
  font-style:italic;font-weight:500;
  background:linear-gradient(120deg,var(--gold-warm),var(--gold) 70%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.manifesto .statement .strike{position:relative;color:rgba(255,255,255,.3)}
.manifesto .statement .strike::after{
  content:"";position:absolute;left:-2%;right:-2%;top:48%;height:5px;
  background:var(--crimson);border-radius:4px;
  transform:rotate(-2deg);
}
.manifesto .sub{
  margin-top:36px;max-width:640px;margin-left:auto;margin-right:auto;
  font-size:clamp(15px,1.3vw,18px);line-height:1.6;color:rgba(255,255,255,.66);
}
.manifesto .sub strong{color:var(--white);font-weight:600}

/* ---------- FEATURED STAT (pain anchor) ---------- */
.featured-stat{
  display:grid;grid-template-columns:auto 1fr;gap:48px;align-items:center;
  padding:48px 56px;
  background:linear-gradient(135deg, var(--white) 0%, var(--bg-cream) 100%);
  border:1px solid var(--gold-soft);border-radius:var(--radius-lg);
  margin-bottom:32px;position:relative;overflow:hidden;
  box-shadow:0 16px 40px -16px rgba(15,23,42,.12);
}
@media (max-width:760px){
  .featured-stat{grid-template-columns:1fr;gap:24px;padding:36px 28px;text-align:center}
}
.featured-stat::before{
  content:"";position:absolute;top:-100px;right:-100px;width:300px;height:300px;
  background:radial-gradient(circle,rgba(220,38,38,.08),transparent 70%);
  pointer-events:none;
}
.featured-stat .big-num{
  font-family:'Fraunces',serif;font-size:clamp(96px,14vw,180px);
  font-weight:600;line-height:.92;letter-spacing:-.05em;
  background:linear-gradient(160deg,var(--crimson) 0%,var(--crimson-deep) 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.featured-stat .big-num small{
  font-family:'Fraunces',serif;font-size:.42em;
  -webkit-text-fill-color:var(--ink-mute);color:var(--ink-mute);font-weight:500;
}
.featured-stat .copy{position:relative;z-index:1}
.featured-stat .copy .label{
  font-size:11px;letter-spacing:.18em;text-transform:uppercase;
  font-weight:700;color:var(--crimson);margin-bottom:10px;
}
.featured-stat .copy h3{
  font-family:'Fraunces',serif;font-size:clamp(22px,2.4vw,30px);
  line-height:1.2;color:var(--ink);margin-bottom:10px;font-weight:600;
}
.featured-stat .copy p{
  font-size:15px;color:var(--ink-soft);line-height:1.6;max-width:48ch;
}

/* ---------- REFINED HOVER STATES ---------- */
.offer{transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s,border-color .35s}
.offer:hover{transform:translateY(-6px);box-shadow:0 30px 60px -16px rgba(15,23,42,.18)}
.offer.featured{box-shadow:0 0 0 1px var(--gold), 0 16px 40px -8px rgba(201,162,39,.22)}
.offer.featured:hover{box-shadow:0 0 0 1px var(--gold), 0 30px 60px -12px rgba(201,162,39,.32);transform:translateY(-8px)}

.case-card{transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s,border-color .35s}
.case-card:hover{transform:translateY(-6px);box-shadow:0 24px 50px -16px rgba(15,23,42,.18);border-color:var(--gold)}

.price-card{transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s}
.price-card:hover{transform:translateY(-4px);box-shadow:0 24px 50px -16px rgba(15,23,42,.16)}
.price-card.popular:hover{box-shadow:0 0 0 2px var(--gold-soft), 0 24px 50px -16px rgba(201,162,39,.25)}

/* ---------- ENHANCED PILLARS (replace plain numbers with badge style) ---------- */
.pillar{transition:transform .35s cubic-bezier(.2,.7,.2,1),border-color .35s,box-shadow .35s}
.pillar:hover{transform:translateY(-4px);box-shadow:0 16px 36px -12px rgba(15,23,42,.12)}
.pillar .num{
  display:inline-flex;align-items:center;justify-content:center;
  width:auto;height:auto;
  font-family:'Fraunces',serif;
}

/* ---------- SECTION DIVIDER (subtle gradient bridge) ---------- */
.bridge{
  height:1px;
  background:linear-gradient(90deg,transparent,var(--gold-soft),transparent);
  margin:0 auto;max-width:280px;
}

/* ---------- BTN MAGNETIC FEEL ---------- */
.btn-primary,.btn-gold,.btn-crimson{position:relative;overflow:hidden}
.btn-primary::after,.btn-gold::after,.btn-crimson::after{
  content:"";position:absolute;top:50%;left:50%;width:0;height:0;
  background:rgba(255,255,255,.25);border-radius:50%;
  transform:translate(-50%,-50%);transition:width .5s,height .5s;
  pointer-events:none;
}
.btn-primary:hover::after,.btn-gold:hover::after,.btn-crimson:hover::after{
  width:240px;height:240px;
}
.btn{position:relative;z-index:1}

/* ---------- ANIMATED COUNTERS (stats block) ---------- */
.stats .stat .num{font-variant-numeric:tabular-nums}

/* ==========================================================================
   WHATSAPP FLOATING ACTION BUTTON
   ========================================================================== */
.whatsapp-fab{
  position:fixed;
  bottom:24px;right:24px;
  width:60px;height:60px;border-radius:50%;
  background:#25D366;color:#fff;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 10px 28px -4px rgba(37,211,102,.45), 0 4px 12px rgba(15,23,42,.18);
  z-index:60;
  text-decoration:none;
  transition:transform .2s cubic-bezier(.2,.7,.2,1), box-shadow .2s;
  -webkit-tap-highlight-color:transparent;
}
.whatsapp-fab:hover{
  transform:scale(1.06);
  box-shadow:0 14px 36px -4px rgba(37,211,102,.55), 0 6px 16px rgba(15,23,42,.22);
}
.whatsapp-fab:active{transform:scale(.98)}
.whatsapp-fab svg{position:relative;z-index:1}

/* Subtle outward pulse ring */
.whatsapp-fab::before{
  content:"";position:absolute;inset:0;border-radius:50%;
  border:2px solid #25D366;
  animation:wa-pulse 2.4s infinite;
  pointer-events:none;
}
@keyframes wa-pulse{
  0%{transform:scale(1);opacity:.5}
  80%{transform:scale(1.45);opacity:0}
  100%{transform:scale(1.45);opacity:0}
}

/* Tooltip on hover (desktop only) */
.whatsapp-fab .wa-tip{
  position:absolute;right:72px;
  top:50%;transform:translateY(-50%) translateX(8px);
  background:var(--ink);color:var(--white);
  padding:8px 14px;border-radius:10px;
  font-family:'Inter',sans-serif;
  font-size:13px;font-weight:500;white-space:nowrap;
  opacity:0;pointer-events:none;
  transition:opacity .2s, transform .2s;
  box-shadow:0 8px 20px rgba(15,23,42,.18);
}
.whatsapp-fab .wa-tip::after{
  content:"";position:absolute;
  right:-5px;top:50%;transform:translateY(-50%) rotate(45deg);
  width:10px;height:10px;background:var(--ink);
}
.whatsapp-fab:hover .wa-tip{opacity:1;transform:translateY(-50%) translateX(0)}

@media (max-width:520px){
  .whatsapp-fab{bottom:18px;right:18px;width:56px;height:56px}
  .whatsapp-fab .wa-tip{display:none}
}

/* Don't let the WhatsApp FAB collide with the mobile drawer when open */
body.drawer-open .whatsapp-fab{opacity:0;pointer-events:none;transition:opacity .2s}

/* ---------- LANDING PAGE — focused single-offer pages ---------- */
.lp-hero{
  padding:40px 0 72px;
  background:
    radial-gradient(900px 500px at 80% -10%, rgba(201,162,39,.12), transparent 60%),
    radial-gradient(700px 400px at 0% 110%, rgba(30,58,138,.08), transparent 60%),
    var(--white);
  position:relative;overflow:hidden;
}
@media (max-width:720px){.lp-hero{padding:28px 0 56px}}
.lp-hero-grid{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:start}
@media (max-width:960px){.lp-hero-grid{grid-template-columns:1fr;gap:36px}}
.lp-hero h1{font-size:clamp(38px,5.4vw,64px)}
.lp-hero .strike-row{display:flex;align-items:center;gap:14px;margin-top:28px;font-size:15px;flex-wrap:wrap}
.lp-hero .strike{text-decoration:line-through;color:var(--ink-mute);font-size:14px}
.lp-hero .now{font-family:'Fraunces',serif;font-weight:600;color:var(--royal);font-size:26px;display:inline-flex;align-items:baseline;gap:8px}
.lp-hero .now small{font-family:'Inter',sans-serif;font-size:12px;color:var(--ink-mute);font-weight:500;letter-spacing:.04em;text-transform:uppercase}
.lp-pricebox{
  background:var(--white);border:1px solid var(--gold);border-radius:var(--radius-lg);
  padding:36px;box-shadow:var(--shadow-lg);position:relative;
}
.lp-pricebox .ribbon{position:absolute;top:-14px;left:32px;background:var(--gold);color:var(--royal-deep);font-size:11px;font-weight:700;letter-spacing:.14em;padding:6px 14px;border-radius:99px}
.lp-pricebox .head{font-family:'Fraunces',serif;font-size:24px;font-weight:600;line-height:1.2;margin-bottom:14px}
.lp-pricebox ul{list-style:none;margin:18px 0}
.lp-pricebox li{padding:10px 0;border-bottom:1px solid var(--border-soft);font-size:14px;display:flex;gap:8px}
.lp-pricebox li::before{content:"✓";color:var(--gold);font-weight:700}
.lp-pricebox .price-line{margin-top:18px;display:flex;align-items:baseline;gap:10px}
.lp-pricebox .big{font-family:'Fraunces',serif;font-size:48px;font-weight:600;color:var(--royal);line-height:1}
.lp-pricebox .strike-old{font-family:'Fraunces',serif;font-size:20px;color:var(--ink-mute);text-decoration:line-through}
.lp-pricebox .save{display:inline-block;margin-top:8px;font-size:12px;font-weight:700;background:var(--crimson);color:var(--white);padding:4px 10px;border-radius:99px;letter-spacing:.06em}
.lp-pricebox .btn{margin-top:22px;width:100%}