/* MODO RESET - VIBRANTE VENDEDOR - PRODUCTION CSS */
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@400;600;700;800;900&family=Cormorant+Garamond:ital,wght@0,600;1,500;1,600&display=swap');
:root{
  --coral:#FF6B4A; --magenta:#E93B81; --plum:#4A2545; --gold:#FFC857; --cream:#FFF8F0;
  --teal:#2EC4B6; --ink:#1A1020; --shadow:0 20px 60px rgba(74,37,69,.25);
  --grad: linear-gradient(135deg, #FF6B4A 0%, #E93B81 45%, #8B2CF5 100%);
  --grad-gold: linear-gradient(135deg, #FFC857, #FF8A3D);
  --grad-aura: radial-gradient(120% 120% at 0% 0%, #FF6B4A 0%, #E93B81 35%, #4A2545 75%);
}
*{box-sizing:border-box; margin:0; padding:0}
html{scroll-behavior:smooth}
body{font-family:'Outfit',system-ui,sans-serif; background:#FFF8F0; color:var(--ink); overflow-x:hidden}
.font-serif{font-family:'Cormorant Garamond',serif}
.app-wrap{min-height:100vh; background:linear-gradient(180deg,#FFF8F0 0%,#FFE8DD 100%); display:flex; justify-content:center; padding:0}
.phone{width:100%; max-width:430px; background:white; min-height:100vh; position:relative; box-shadow:0 0 0 1px rgba(0,0,0,.06), 0 30px 80px rgba(74,37,69,.2); overflow:hidden}
/* Progress */
#progress{position:fixed; top:0; left:0; height:4px; width:0; background:var(--grad); z-index:9999; transition:width .1s}
/* Marquee */
.marquee{background:var(--ink); color:white; overflow:hidden; white-space:nowrap; padding:10px 0; font-weight:800; font-size:12px; letter-spacing:.15em}
.marquee-track{display:flex; animation:marquee 18s linear infinite}
.marquee-track span{padding:0 28px}
@keyframes marquee{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
/* Hero */
.hero{position:relative; padding:28px 22px 36px; background:var(--grad-aura); color:white; overflow:hidden}
.hero::before{content:""; position:absolute; inset:-40%; background:radial-gradient(60% 60% at 70% 30%, rgba(255,200,87,.5), transparent 60%), radial-gradient(50% 50% at 20% 80%, rgba(46,196,182,.35), transparent); animation:float 8s ease-in-out infinite}
.orb{position:absolute; border-radius:50%; filter:blur(18px); opacity:.9}
.orb1{width:220px; height:220px; background:radial-gradient(circle, #FFC857, #FF6B4A); top:-30px; right:-40px; animation:float 6s ease-in-out infinite}
.orb2{width:160px; height:160px; background:radial-gradient(circle, #2EC4B6, #8B2CF5); bottom:20px; left:-30px; animation:float 7s ease-in-out reverse infinite}
.hero-content{position:relative; z-index:2}
.badge{display:inline-flex; gap:8px; align-items:center; background:rgba(255,255,255,.18); backdrop-filter:blur(12px); border:1px solid rgba(255,255,255,.3); padding:8px 14px; border-radius:100px; font-size:11px; font-weight:800; letter-spacing:.1em}
.hero-img-wrap{margin:18px 0; position:relative; border-radius:28px; overflow:hidden; box-shadow:0 20px 50px rgba(0,0,0,.35); transform:rotate(-1deg)}
.hero-img-wrap img{width:100%; height:320px; object-fit:cover; display:block; filter:saturate(1.1) contrast(1.05)}
.hero-title{font-size:54px; line-height:.9; font-weight:900; letter-spacing:-.03em; margin:18px 0 10px}
.hero-title span{background:linear-gradient(90deg, #FFC857, #FFF); -webkit-background-clip:text; background-clip:text; color:transparent}
.hero-sub{font-family:'Cormorant Garamond',serif; font-size:26px; font-style:italic; line-height:1.1; opacity:.95}
.hero-question{margin:18px 0; background:rgba(255,255,255,.14); backdrop-filter:blur(16px); border-radius:20px; padding:16px 18px; font-size:15px; line-height:1.4; border:1px solid rgba(255,255,255,.25)}
.btn-primary{display:flex; width:100%; align-items:center; justify-content:center; gap:10px; background:var(--grad-gold); color:var(--plum); font-weight:900; font-size:17px; padding:18px 20px; border-radius:18px; border:none; cursor:pointer; box-shadow:0 12px 30px rgba(255,107,74,.45); transition:transform .2s}
.btn-primary:active{transform:scale(.97)}
.btn-secondary{width:100%; margin-top:12px; background:rgba(255,255,255,.15); color:white; border:1px solid rgba(255,255,255,.4); padding:14px; border-radius:16px; font-weight:700}
.pain-grid{display:grid; grid-template-columns:1fr; gap:12px; padding:22px; margin-top:-18px; position:relative; z-index:3}
.pain-card{background:white; border-radius:20px; padding:16px; display:flex; gap:14px; box-shadow:var(--shadow); border:1px solid rgba(0,0,0,.04)}
.pain-ico{width:44px; height:44px; border-radius:14px; display:grid; place-items:center; font-size:22px; background:var(--grad); color:white; flex-shrink:0}
.section{padding:34px 22px}
.section-title{font-size:34px; font-weight:900; line-height:.95; letter-spacing:-.02em}
.section-title em{font-family:'Cormorant Garamond',serif; font-weight:600; font-style:italic; background:var(--grad); -webkit-background-clip:text; color:transparent}
.lead{font-size:17px; line-height:1.5; color:#5A3A52; margin-top:12px}
.carousel{display:flex; gap:14px; overflow-x:auto; scroll-snap-type:x mandatory; padding:18px 22px; scrollbar-width:none}
.carousel::-webkit-scrollbar{display:none}
.card-c{flex:0 0 82%; scroll-snap-align:center; background:white; border-radius:24px; overflow:hidden; box-shadow:var(--shadow)}
.card-c img{width:100%; height:200px; object-fit:cover}
.card-c-body{padding:18px}
.card-c h4{font-weight:800; font-size:18px}
.card-c p{font-size:14px; color:#6B4B64; margin-top:6px; line-height:1.4}
.image-full{border-radius:28px; overflow:hidden; box-shadow:var(--shadow); margin:18px 0}
.image-full img{width:100%; height:360px; object-fit:cover; display:block}
.price-box{background:var(--ink); color:white; border-radius:32px; padding:26px 22px; position:relative; overflow:hidden; box-shadow:0 30px 80px rgba(0,0,0,.35)}
.price-box::before{content:""; position:absolute; inset:0; background:radial-gradient(80% 80% at 100% 0%, rgba(233,59,129,.5), transparent)}
.badge-save{position:absolute; top:18px; right:-10px; background:var(--grad-gold); color:var(--plum); font-weight:900; padding:10px 18px; border-radius:100px; transform:rotate(6deg); box-shadow:0 10px 20px rgba(0,0,0,.25); animation:badgePulse 1.8s ease-in-out infinite}
@keyframes badgePulse{0%,100%{transform:rotate(6deg) scale(1)}50%{transform:rotate(6deg) scale(1.08)}}
.price-row{display:flex; align-items:end; gap:14px; margin:14px 0; flex-wrap:wrap}
.price-old{font-size:22px; text-decoration:line-through; opacity:.6}
.price-new{font-size:52px; font-weight:900; line-height:1; background:linear-gradient(90deg,#FFC857,#FF6B4A); -webkit-background-clip:text; color:transparent; animation:bouncePrice 1.2s ease}
@keyframes bouncePrice{0%{transform:scale(.7) translateY(14px)}50%{transform:scale(1.15)}100%{transform:scale(1)}}
.countdown{display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin:16px 0}
.cd{ background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.2); border-radius:16px; padding:12px 6px; text-align:center; backdrop-filter:blur(10px)}
.cd b{display:block; font-size:22px}
.cd span{font-size:11px; opacity:.8; letter-spacing:.08em}
.info-card{background:white; border-radius:24px; padding:18px; display:flex; gap:14px; box-shadow:var(--shadow); margin:14px 0}
.faq-item{background:white; border-radius:18px; margin:10px 0; box-shadow:0 6px 18px rgba(0,0,0,.06); overflow:hidden}
.faq-q{padding:16px 18px; display:flex; justify-content:space-between; align-items:center; font-weight:700; cursor:pointer}
.faq-a{max-height:0; overflow:hidden; transition:max-height .4s ease; padding:0 18px; color:#5A3A52}
.faq-item.open .faq-a{max-height:200px; padding:0 18px 18px}
.cta-big{margin:22px 0; background:var(--grad); color:white; border-radius:28px; padding:28px 22px; text-align:center}
.cta-big h3{font-size:32px; line-height:.95; font-weight:900}
.cta-big p{margin:12px 0; opacity:.9}
.whatsapp-float{position:fixed; bottom:18px; left:50%; transform:translateX(-50%); width:min(92%, 400px); background:#25D366; color:white; display:flex; align-items:center; justify-content:center; gap:10px; padding:16px 18px; border-radius:100px; font-weight:800; box-shadow:0 16px 40px rgba(37,211,102,.5); z-index:999; text-decoration:none; animation:whatsPulse 2.5s infinite}
@keyframes whatsPulse{0%,100%{transform:translateX(-50%) scale(1)}50%{transform:translateX(-50%) scale(1.04)}}
.whatsapp-float::before{content:""; position:absolute; inset:0; border-radius:100px; background:#25D366; animation:ping 1.8s cubic-bezier(0,0,.2,1) infinite; z-index:-1}
@keyframes ping{75%,100%{transform:scale(1.25); opacity:0}}
.fade-up{opacity:0; transform:translateY(24px); transition:all .7s cubic-bezier(.2,.8,.2,1)}
.fade-up.in{opacity:1; transform:none}
.confetti{position:absolute; width:8px; height:12px; border-radius:2px; pointer-events:none; z-index:5}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}
@media(min-width:600px){body{background:#F2E6DC} .phone{margin:24px auto; border-radius:36px}}