:root{
  --bg:#0b0b0e;
  --text:#f3f3f5;
  --gold:#f3c969;
  --accent:#ffd36a;

  /* oferta */
  --panel:#101114;
  --muted:#d5d5e3;
  --gold1:#ffe8a3;
  --gold2:#f5c455;
  --gold3:#d79b2b;
  --danger:#ff3b30;

  /* chamas */
  --flame-red:#ff4d2d;
  --flame-orange:#ff8a2a;
  --flame-yellow:#ffd057;
  --flame-core:#fff4cc;
}

*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{
  font-family:Inter,system-ui,Arial,sans-serif;
  background: var(--bg);
  color:var(--text);
  line-height:1.5;
  overflow-x:hidden;
}

/* ========= FUNDO DE CHAMAS (CSS ONLY) ========= */

/* Camada base: duas ondas de conic-gradient desfocadas, animadas */
.flame-layer,
.flame-layer--2{
  position:fixed;
  inset:auto 0 0 0;          /* “presa” ao rodapé */
  height:95vh;               /* altura do fogo */
  pointer-events:none;
  z-index:-2;
  filter:blur(18px) saturate(115%);
  opacity:.0.75;
}
.flame-layer{
  background:
    conic-gradient(from 200deg at 50% 100%,
      transparent 0 10deg,
      rgba(255,109,31,.10) 11deg 18deg,
      rgba(255,160,38,.16) 18deg 40deg,
      rgba(255,208,85,.24) 40deg 60deg,
      rgba(255,255,255,.22) 60deg 70deg,
      transparent 71deg 360deg);
  animation: flameWave 6.5s ease-in-out infinite alternate;
  transform-origin:50% 100%;
}
.flame-layer--2{
  background:
    conic-gradient(from 160deg at 50% 100%,
      transparent 0 14deg,
      rgba(255,109,31,.12) 14deg 22deg,
      rgba(255,160,38,.18) 22deg 45deg,
      rgba(255,208,85,.26) 45deg 66deg,
      rgba(255,255,255,.25) 66deg 72deg,
      transparent 73deg 360deg);
  animation: flameWave2 7.2s ease-in-out infinite alternate;
  transform-origin:50% 100%;
  opacity:.38;
}

/* Glow quente no rodapé */
.flame-glow{
  position:fixed;
  left:50%; bottom:-20vh;
  width:120vw; height:60vh;
  transform:translateX(-50%);
  background:
    radial-gradient(60% 80% at 50% 0%,
      rgba(255,160,50,.30), transparent 60%),
    radial-gradient(50% 70% at 50% 0%,
      rgba(255,220,120,.20), transparent 70%);
  filter:blur(24px);
  z-index:-3;
  pointer-events:none;
}

/* Brasas subindo */
.embers{
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:-1;
}
.embers span{
  position:absolute;
  bottom:-40px;
  width:6px; height:6px;
  border-radius:50%;
  background: radial-gradient(circle, var(--flame-core), var(--flame-yellow) 60%, transparent 70%);
  box-shadow:
    0 0 14px rgba(255,200,90,.75),
    0 0 30px rgba(255,120,40,.35);
  animation: ember 6s linear infinite;
  opacity:.85;
}
/* posições e delays variados (15 partículas) */
.embers span:nth-child(1){left:8%; animation-delay:.0s; animation-duration:7.5s}
.embers span:nth-child(2){left:18%; animation-delay:1.1s}
.embers span:nth-child(3){left:25%; animation-delay:.6s; animation-duration:6.2s}
.embers span:nth-child(4){left:32%; animation-delay:1.8s}
.embers span:nth-child(5){left:40%; animation-delay:.9s; animation-duration:7.1s}
.embers span:nth-child(6){left:48%; animation-delay:1.4s}
.embers span:nth-child(7){left:55%; animation-delay:.3s; animation-duration:6.4s}
.embers span:nth-child(8){left:62%; animation-delay:1.9s}
.embers span:nth-child(9){left:69%; animation-delay:.5s; animation-duration:6.8s}
.embers span:nth-child(10){left:75%; animation-delay:1.2s}
.embers span:nth-child(11){left:82%; animation-delay:.7s; animation-duration:7.3s}
.embers span:nth-child(12){left:12%; animation-delay:2.1s}
.embers span:nth-child(13){left:52%; animation-delay:2.5s}
.embers span:nth-child(14){left:88%; animation-delay:1.7s}
.embers span:nth-child(15){left:95%; animation-delay:.2s; animation-duration:7.9s}

@keyframes ember{
  0%   { transform:translateY(0) translateX(0) scale(1); opacity:.75 }
  30%  { transform:translateY(-30vh) translateX(-6px) scale(1.05) }
  60%  { transform:translateY(-55vh) translateX(6px)  scale(.95) }
  100% { transform:translateY(-85vh) translateX(-4px) scale(.85); opacity:0 }
}

@keyframes flameWave{
  0%   { transform:scaleY(1) skewX(-2deg) }
  50%  { transform:scaleY(1.08) skewX(2deg) }
  100% { transform:scaleY(1.02) skewX(-1deg) }
}
@keyframes flameWave2{
  0%   { transform:scaleY(.98) skewX(2deg) }
  50%  { transform:scaleY(1.06) skewX(-2deg) }
  100% { transform:scaleY(1.00) skewX(1deg) }
}

/* ====== DOURADOS SUAVES NAS SEÇÕES ====== */
.gold-hero{
  background:
    linear-gradient(180deg, rgba(255,170,60,.08), rgba(255,170,60,0) 28%),
    radial-gradient(900px 420px at 10% -10%, rgba(255,215,110,.10), transparent 60%),
    radial-gradient(1000px 520px at 95% 110%, rgba(255,210,90,.08), transparent 60%),
    transparent;
  position:relative;
  z-index:1;
}
.gold-section{
  background:
    linear-gradient(180deg, rgba(255,215,110,.07), rgba(255,215,110,0) 28%),
    radial-gradient(800px 360px at 10% 120%, rgba(255,210,90,.08), transparent 60%),
    radial-gradient(900px 420px at 90% -20%, rgba(255,210,90,.06), transparent 60%),
    transparent;
  position:relative;
  z-index:1;
}
.gold-offer{
  background:
    linear-gradient(180deg, rgba(255,215,110,.08), rgba(255,215,110,0) 35%),
    radial-gradient(1000px 500px at -10% 30%, rgba(255,210,90,.06), transparent 60%),
    radial-gradient(900px 420px at 110% 80%, rgba(255,210,90,.06), transparent 60%),
    transparent;
  position:relative;
  z-index:1;
}

/* ====== LAYOUT BASE ====== */
.container{width:min(1200px,92%);margin:0 auto}

/* Header */
.header{position:sticky;top:0;z-index:10;background:linear-gradient(180deg,rgba(0,0,0,.65),rgba(0,0,0,.2) 70%,transparent);backdrop-filter:blur(6px)}
.header__row{display:flex;align-items:center;justify-content:center;padding:14px 0}
.brand{display:flex;align-items:center;gap:.6rem;color:#fff;text-decoration:none;font-weight:800}
.brand__icon{color:var(--gold)}
.brand__text b{color:var(--accent)}

/* Hero */
.hero{padding:clamp(40px,6vw,100px) 0}
.center-text{text-align:center;max-width:900px;margin-inline:auto}
h1{font-family:Montserrat,sans-serif;font-size:clamp(2rem,4.5vw,3.2rem);line-height:1.1;text-shadow:0 0 28px rgba(255,210,90,.25)}
h1 span{display:inline-block;background:linear-gradient(90deg,#fff,var(--accent));-webkit-background-clip:text;color:transparent;text-shadow:0 0 25px rgba(255,210,99,.35)}
.lead{font-size:clamp(1rem,2.4vw,1.15rem);color:#e5e5f0;margin-top:20px;margin-bottom:45px;text-shadow:0 1px 0 rgba(0,0,0,.25)}
.hero-image{margin:30px auto;display:flex;justify-content:center;align-items:center}
.hero-image img{width:100%;max-width:500px;border-radius:16px;box-shadow:0 0 25px rgba(255,215,90,.25),0 0 50px rgba(255,200,50,.15);animation:fadeIn 2s ease forwards}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;height:56px;padding:0 24px;border-radius:999px;text-decoration:none;font-weight:800;text-transform:uppercase;transition:.2s}
.btn:hover{transform:translateY(-1px);filter:saturate(110%)}
.btn--primary{color:#1a1a1a;background:linear-gradient(180deg,var(--gold1),var(--gold2) 45%,var(--gold3) 100%);box-shadow:0 8px 24px rgba(255,200,80,.35),inset 0 2px 0 rgba(255,255,255,.6)}
.btn--xl{height:64px;padding:0 30px;border-radius:18px}

/* ===== Blocos Dor / Benefício ===== */
.section--punch{padding:clamp(70px,8vw,100px) 0;display:flex;justify-content:center}
.punch-grid{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:30px;max-width:1040px}
.punch-card{flex:1 1 320px;max-width:340px;min-height:270px;padding:28px 26px 34px;border-radius:22px;background:linear-gradient(180deg,#14151b,#0e0f14 70%);border:1px solid rgba(255,255,255,.06);box-shadow:0 10px 28px rgba(0,0,0,.45);text-align:center;position:relative;transition:transform .3s ease, box-shadow .3s ease, border .3s ease}
.punch-card:hover{transform:scale(1.07);box-shadow:0 0 40px rgba(255,220,100,.25),0 18px 45px rgba(0,0,0,.55);border:1px solid rgba(255,215,90,.3)}
.punch-card::after{content:"";position:absolute;left:24px;right:24px;bottom:12px;height:5px;border-radius:999px;background:linear-gradient(90deg,#ffd77a,#d79b2b);opacity:.85}
.punch-icon{width:60px;height:60px;margin:0 auto 16px auto;display:grid;place-items:center;border-radius:16px;background:linear-gradient(180deg,#ffc86d,#e29e2f);box-shadow:inset 0 2px 0 rgba(255,255,255,.6),0 6px 18px rgba(255,190,80,.25);font-size:28px}
.punch-card h3{margin:0 0 12px;font:800 1.25rem/1.25 Montserrat,Inter,sans-serif;color:#fff}
.punch-card p{margin:0;color:#dcdce6;font-size:1.05rem;line-height:1.55}

/* ===== Duas Escolhas ===== */
.section--choices{padding:clamp(52px,7vw,90px) 0}
.choices-wrap{max-width:820px;margin:0 auto;text-align:center}
.choice-title{display:inline-block;padding:12px 22px;margin:0 auto 32px;border-radius:999px;background:linear-gradient(180deg,#15161c,#0e0f14);color:#fff;font:900 clamp(1rem,2.6vw,1.25rem)/1 Montserrat,Inter,sans-serif;letter-spacing:.8px;box-shadow:0 12px 28px rgba(0,0,0,.45),inset 0 0 0 1px rgba(255,255,255,.06)}
.choice-box{position:relative;padding:46px 20px 28px;margin:34px auto;border-radius:20px;background:linear-gradient(180deg,#14151b,#0f1015 70%);box-shadow:0 12px 28px rgba(0,0,0,.45);border:1px dashed rgba(255,255,255,.12);color:#eaeaf5;overflow:visible}
.choice-box p{margin:0;font-size:clamp(1rem,2.4vw,1.08rem);line-height:1.55}
.num{position:absolute;top:-28px;left:50%;transform:translateX(-50%);width:64px;height:64px;display:grid;place-items:center;border-radius:999px;color:#fff;font:900 1.4rem/1 Inter,system-ui,sans-serif;box-shadow:inset 0 2px 0 rgba(255,255,255,.6);z-index:2}
.num--red{background:radial-gradient(circle at 30% 25%,#ffb3a6,#ff4d4d 55%,#cc2b2b 100%);box-shadow:0 0 28px rgba(255,90,90,.35),inset 0 2px 0 rgba(255,255,255,.6)}
.num--green{background:radial-gradient(circle at 30% 25%,#b8ffc7,#2ecc71 55%,#1b8e4b 100%);box-shadow:0 0 28px rgba(70,220,120,.35),inset 0 2px 0 rgba(255,255,255,.6)}
.choice-note{margin:22px auto 10px;color:#e9e9f2;font-size:clamp(1rem,2.5vw,1.1rem);max-width:760px;text-shadow:0 1px 0 rgba(0,0,0,.2)}
.highlight{color:#ffd36a;font-weight:800}
.choice-btn{margin-top:12px}

/* ===== Provas Sociais ===== */
.section--social{padding:clamp(56px,8vw,100px) 0}
.social-wrap{text-align:center}
.social-title{font:900 clamp(1.25rem,3.2vw,1.8rem)/1.15 Montserrat,Inter,sans-serif;color:#fff;margin-bottom:6px;text-shadow:0 0 20px rgba(255,210,90,.2)}
.social-title span{background:linear-gradient(90deg,#fff,var(--accent));-webkit-background-clip:text;color:transparent}
.social-sub{color:#d3d3de;margin-bottom:24px}
.social-track{display:grid;gap:18px;grid-auto-flow:column;grid-auto-columns:86%;overflow-x:auto;padding:6px 6px 10px;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch}
.social-track::-webkit-scrollbar{height:8px}
.social-track::-webkit-scrollbar-thumb{background:rgba(255,215,110,.25);border-radius:999px}
@media(min-width:900px){.social-track{overflow:visible;grid-auto-flow:initial;grid-auto-columns:initial;grid-template-columns:repeat(3,1fr);padding:0}}
.social-card{scroll-snap-align:center;margin:0;border-radius:18px;background:linear-gradient(180deg,#14151b,#0f1015 70%);border:1px solid rgba(255,255,255,.06);box-shadow:0 12px 28px rgba(0,0,0,.45),0 0 0 12px rgba(255,179,25,.05) inset;padding:10px;position:relative;transition:transform .25s ease,box-shadow .25s ease,border .25s ease}
.social-card:hover{transform:translateY(-4px);box-shadow:0 16px 40px rgba(0,0,0,.55),0 0 0 12px rgba(255,195,60,.08) inset;border-color:rgba(255,215,90,.28)}
.img-wrap{width:100%;aspect-ratio:7/5;background:#0a0b10;border-radius:14px;display:flex;align-items:center;justify-content:center;overflow:hidden}
.social-card img{width:100%;height:100%;object-fit:contain;display:block;filter:drop-shadow(0 6px 18px rgba(0,0,0,.35))}

/* ===== OFERTA ===== */
.section-offer{padding:clamp(64px,8vw,110px) 0}
.offer-card{
  position:relative;margin:auto;max-width:860px;
  padding:28px 24px 26px;border-radius:34px;
  background: radial-gradient(120% 120% at 50% -20%, rgba(255,190,60,.10), transparent 40%),
              linear-gradient(180deg,#17181e,#0f1015 72%);
  border:1px solid rgba(255,255,255,.06);
  box-shadow:0 35px 90px rgba(0,0,0,.55), 0 0 0 14px rgba(255,179,25,.08) inset;
  text-align:center;
}
.offer-card::before{content:"";position:absolute;inset:10px;border-radius:28px;box-shadow:0 0 60px 10px rgba(255,170,40,.15) inset;pointer-events:none}
.offer-logo{display:inline-flex;align-items:center;gap:.55rem;color:#fff;margin-bottom:8px;font-weight:900;letter-spacing:.4px}
.offer-logo .logo-mark{color:#ffd36a}
.offer-logo .logo-text b{color:#ffd36a}
.offer-headline{font:900 clamp(1.4rem,3.8vw,2.2rem)/1.1 Montserrat,Inter,sans-serif;letter-spacing:.5px;margin:8px 0 14px;color:#ffcf66;text-shadow:0 0 22px rgba(255,210,90,.32);text-transform:uppercase}
.offer-urgency{display:inline-flex;flex-direction:column;gap:10px;margin:8px auto 18px}
.offer-urgency span{display:inline-block;padding:10px 14px;border-radius:8px;font:900 clamp(1rem,2.7vw,1.25rem)/1 Montserrat,Inter,sans-serif;color:#101010;background:linear-gradient(180deg,var(--gold1),var(--gold2) 45%,var(--gold3) 100%);box-shadow:0 10px 22px rgba(255,200,80,.30), inset 0 2px 0 rgba(255,255,255,.65);text-transform:uppercase}
.offer-line{margin:10px 0 6px;font-size:clamp(1rem,2.4vw,1.25rem);color:#fff}
.offer-line .old{color:#ff3b30;text-decoration:line-through;font-weight:900}
.installments{margin:2px 0 12px;font:800 clamp(1.1rem,3.5vw,1.6rem)/1.2 Montserrat,Inter,sans-serif;letter-spacing:.3px;color:#ffffff}
.cashline{margin:4px 0 18px;font:900 clamp(1.2rem,4.2vw,1.9rem)/1.1 Montserrat,Inter,sans-serif;color:#ffffff;text-transform:uppercase}
.cashline .cash{display:inline-block;font:900 clamp(1.6rem,6vw,2.6rem)/1 Montserrat,Inter,sans-serif;letter-spacing:.6px}
.btn-buy{display:inline-flex;align-items:center;justify-content:center;margin:6px auto 16px;height:64px;min-width:clamp(240px,50vw,520px);padding:0 28px;border-radius:18px;text-decoration:none;text-transform:uppercase;font:900 clamp(1rem,2.6vw,1.2rem)/1 Montserrat,Inter,sans-serif;color:#1a1a1a;background:linear-gradient(180deg,var(--gold1),var(--gold2) 45%,var(--gold3) 100%);box-shadow:0 16px 36px rgba(255,200,80,.35), inset 0 2px 0 rgba(255,255,255,.70);transition:transform .15s ease, filter .15s ease, box-shadow .15s ease}
.btn-buy:hover{transform:translateY(-2px);filter:saturate(110%)}
.btn-buy:active{transform:translateY(0) scale(.98)}
.guarantees{display:flex;align-items:stretch;justify-content:center;gap:18px;flex-wrap:wrap;margin-top:10px;color:#e9e9f2}
.g-item{display:flex;align-items:center;gap:10px;padding:10px 14px;border-radius:12px;background:linear-gradient(180deg,#181920,#101117 70%);border:1px solid rgba(255,255,255,.06);box-shadow:0 10px 24px rgba(0,0,0,.35)}
.g-icon{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;color:#1a1a1a;background:linear-gradient(180deg,var(--gold1),var(--gold2) 45%,var(--gold3) 100%);box-shadow:inset 0 2px 0 rgba(255,255,255,.65)}
.g-text{font-size:.92rem;line-height:1.25}
.g-text b{font-weight:900;color:#fff}
@media (max-width:520px){.btn-buy{min-width:100%}.g-text{font-size:.88rem}}

/* Footer */
.footer{border-top:1px solid rgba(255,255,255,.06);background:linear-gradient(180deg, transparent, rgba(0,0,0,.45));color:#bdbdcc;text-align:center;padding:22px 0}

/* Animations de entrada */
@keyframes pulseGlow{0%{box-shadow:0 0 0 0 rgba(255,200,80,.35)}70%{box-shadow:0 0 0 18px rgba(255,200,80,0)}100%{box-shadow:0 0 0 0 rgba(255,200,80,0)}}
.pulse{animation:pulseGlow 2.4s ease-in-out infinite}
@keyframes fadeIn{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
.appear{opacity:0;transform:translateY(8px);transition:.6s ease}
.appear.is-visible{opacity:1;transform:none}