/* ── Reset & Base ──────────────────────────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;font-size:16px}
body{font-family:'Inter',sans-serif;background:#FBF6F1;color:#2C2020;line-height:1.6;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
ul{list-style:none}

/* ── CSS Variables ─────────────────────────────────────────────────────── */
:root{
  --nude:#F5EDE3;
  --rose:#E8879C;
  --beige:#E8D5C0;
  --white:#FFFFFF;
  --brown:#7A3F2E;
  --brown-dark:#2E1B14;
  --gold:#D9A73B;
  --gold-light:#F0C868;
  --text:#2C2020;
  --text-light:#8B6F6A;
  --bg:#FBF6F1;
  --bg-pink:#FAF0F2;
  --border:#E8D5C0;
  --shadow:rgba(107,76,59,0.12);

  --radius-sm:8px;
  --radius-md:14px;
  --radius-lg:24px;
  --radius-xl:32px;

  --space-xs:8px;
  --space-sm:16px;
  --space-md:24px;
  --space-lg:40px;
  --space-xl:64px;
  --space-2xl:96px;

  --max-w:1100px;
  --cta-bg:#6B4C3B;
  --cta-hover:#3D2A22;
}

/* ── Typography ────────────────────────────────────────────────────────── */
h1,h2,h3,h4{font-family:'Playfair Display',serif;line-height:1.2;color:var(--brown)}
h1{font-size:clamp(26px,5vw,48px)}
h2{font-size:clamp(22px,4vw,38px)}
h3{font-size:clamp(18px,3vw,24px)}
h4{font-size:19px}
p{font-size:clamp(16px,2vw,18px);color:var(--text-light);line-height:1.7}

/* ── Layout ────────────────────────────────────────────────────────────── */
.container{width:100%;max-width:var(--max-w);margin:0 auto;padding:0 var(--space-sm)}
section{padding:var(--space-xl) 0}
.section-title{text-align:center;margin-bottom:var(--space-lg)}
.section-title h2{margin-bottom:var(--space-xs)}
.section-title p{max-width:640px;margin:0 auto}
.gold-line{width:60px;height:3px;background:var(--gold);margin:var(--space-xs) auto 0;border-radius:2px}

/* ── Urgency Bar ───────────────────────────────────────────────────────── */
.urgency-bar{background:linear-gradient(90deg,#C0392B 0%,#E0501F 55%,#E8871A 100%);color:var(--white);text-align:center;padding:14px var(--space-sm);font-size:15px;font-weight:700;letter-spacing:.3px;position:sticky;top:0;z-index:100;box-shadow:0 4px 16px rgba(0,0,0,.18);display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px}
.urgency-bar span#urgency-text{color:var(--white);font-weight:800}
.countdown-wrap{display:inline-flex;align-items:center;gap:4px}
.countdown-box{font-variant-numeric:tabular-nums;font-weight:800;font-size:16px;color:#C0392B;background:var(--white);padding:4px 10px;border-radius:8px;min-width:32px;display:inline-block}
.countdown-sep{font-weight:800;color:var(--white)}

/* ── Buttons ───────────────────────────────────────────────────────────── */
.btn{display:inline-block;padding:16px 32px;border-radius:var(--radius-xl);font-weight:700;font-size:16px;cursor:pointer;text-align:center;transition:transform .15s ease,box-shadow .15s ease,background .15s ease;min-height:56px;min-width:200px;text-transform:uppercase;letter-spacing:.5px;border:none}
.btn-primary{background:var(--cta-bg);color:var(--white);box-shadow:0 4px 20px rgba(107,76,59,.30)}
.btn-primary:hover{background:var(--cta-hover);transform:translateY(-2px);box-shadow:0 8px 28px rgba(107,76,59,.35)}
.btn-primary:active{transform:translateY(0)}
.btn-gold{background:var(--gold);color:var(--brown-dark);box-shadow:0 4px 20px rgba(201,169,110,.35)}
.btn-gold:hover{background:#B8955A;transform:translateY(-2px);box-shadow:0 8px 28px rgba(201,169,110,.4)}
.btn-outline{background:transparent;color:var(--brown);border:2px solid var(--brown);padding:14px 30px}
.btn-outline:hover{background:var(--brown);color:var(--white)}
.btn-lg{padding:20px 44px;font-size:17px;min-height:64px}
.cta-wrap{text-align:center;margin-top:var(--space-md)}
.cta-note{font-size:12px;color:var(--text-light);margin-top:var(--space-xs);text-align:center}

/* ── Hero ──────────────────────────────────────────────────────────────── */
.hero{background:linear-gradient(135deg,var(--nude) 0%,var(--bg-pink) 50%,var(--beige) 100%);padding:var(--space-xl) 0 var(--space-2xl)}
.hero-stack{display:flex;flex-direction:column;align-items:center;text-align:center;max-width:760px;margin:0 auto}
.hero-badge{display:inline-block;background:var(--rose);color:var(--white);font-size:13px;font-weight:700;padding:6px 14px;border-radius:var(--radius-xl);margin-bottom:var(--space-md);text-transform:uppercase;letter-spacing:1px}
.hero h1{margin-bottom:var(--space-md);color:var(--brown);max-width:16ch}
.hero h1 em{font-style:italic;color:var(--rose)}
.hero-sub{font-size:clamp(16px,2vw,19px);color:var(--text-light);margin-bottom:var(--space-lg);line-height:1.7;max-width:56ch}
.hero-image{width:100%;margin-bottom:var(--space-lg)}
.hero-img{border-radius:var(--radius-lg);box-shadow:0 20px 60px rgba(107,76,59,.18);width:100%;object-fit:contain;margin:0 auto;background:var(--white)}
.hero-pills{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-bottom:var(--space-lg)}
.hero-pill{background:var(--white);border:1px solid var(--border);border-radius:var(--radius-xl);padding:12px 22px;font-size:14px;font-weight:600;color:var(--brown);box-shadow:0 2px 10px var(--shadow)}
.hero-price{display:flex;align-items:baseline;gap:14px;margin-bottom:var(--space-md)}
.hero-price-old{font-size:18px;color:var(--text-light);text-decoration:line-through}
.hero-price-new{font-size:clamp(32px,6vw,44px);font-weight:700;font-family:'Playfair Display',serif;color:#2E9E5B}
.hero-cta{text-align:center}
.hero-seals{display:flex;flex-wrap:wrap;gap:var(--space-xs);margin-top:var(--space-md);justify-content:center}
.seal{background:var(--white);border:1px solid var(--border);border-radius:var(--radius-xl);padding:8px 16px;font-size:12px;font-weight:600;color:var(--brown);box-shadow:0 2px 8px var(--shadow)}

/* ── Pain Section ──────────────────────────────────────────────────────── */
.pain-section{background:var(--white)}
.pain-intro{max-width:700px;margin:0 auto var(--space-lg);text-align:center}
.pain-intro blockquote{font-size:clamp(17px,2.4vw,20px);font-family:'Inter',sans-serif;font-weight:600;color:var(--brown);font-style:normal;line-height:1.6;border-left:4px solid var(--gold);padding-left:var(--space-sm);text-align:left;margin-bottom:var(--space-md)}
.pain-bullets{display:grid;grid-template-columns:1fr;gap:12px;max-width:700px;margin:0 auto var(--space-md)}
@media(min-width:600px){.pain-bullets{grid-template-columns:1fr 1fr}}
.pain-item{display:flex;align-items:flex-start;gap:10px;background:var(--bg-pink);border-radius:var(--radius-sm);padding:14px 16px;border-left:3px solid var(--rose)}
.pain-item::before{content:'✗';color:#C0392B;font-weight:700;font-size:16px;flex-shrink:0}
.pain-item p{font-size:15px;color:var(--brown);font-weight:500;margin:0}
.pain-close{text-align:center;background:var(--nude);border-radius:var(--radius-md);padding:var(--space-md);max-width:600px;margin:0 auto var(--space-md);border:1px solid var(--border)}
.pain-close p{font-size:17px;font-weight:600;color:var(--brown);margin:0}

/* ── Before/After ──────────────────────────────────────────────────────── */
.before-after{background:linear-gradient(180deg,var(--bg) 0%,var(--nude) 100%)}
.ba-grid{display:grid;grid-template-columns:1fr;gap:var(--space-md)}
@media(min-width:640px){.ba-grid{grid-template-columns:1fr 1fr}}
.ba-card{border-radius:var(--radius-md);overflow:hidden;box-shadow:0 8px 32px var(--shadow)}
.ba-card-header{padding:var(--space-sm) var(--space-md);font-weight:700;font-size:15px}
.ba-before .ba-card-header{background:#D9291C;color:var(--white)}
.ba-after .ba-card-header{background:#6E9B72;color:var(--white)}
.ba-card-body{background:var(--white);padding:var(--space-md)}
.ba-card-body li{padding:10px 0;border-bottom:1px solid var(--border);font-size:14px;display:flex;align-items:center;gap:8px}
.ba-card-body li:last-child{border:none}
.ba-before li{color:var(--text)}.ba-before li::before{content:'✗';color:#D9291C;font-weight:700}
.ba-after li{color:var(--text)}.ba-after li::before{content:'✓';color:#6E9B72;font-weight:700}
.ba-img-wrap{text-align:center;margin-top:var(--space-lg)}
.ba-img-wrap img{border-radius:var(--radius-md);box-shadow:0 12px 40px var(--shadow);max-height:400px;object-fit:contain;margin:0 auto}

/* ── Solution ──────────────────────────────────────────────────────────── */
.solution{background:var(--white)}
.solution-img{text-align:center;margin-top:var(--space-lg)}
.stack-card{max-width:520px;margin:0 auto;border-radius:var(--radius-lg);overflow:hidden;box-shadow:0 16px 48px var(--shadow);border:1px solid var(--border);text-align:left}
.stack-card-header{background:var(--brown);color:var(--gold-light);font-weight:700;font-size:14px;letter-spacing:.5px;text-align:center;padding:16px}
.stack-list{background:var(--white);padding:var(--space-md) var(--space-lg)}
.stack-list li{padding:12px 0;border-bottom:1px solid var(--border);font-size:16px;color:var(--text);font-weight:500}
.stack-list li:last-child{border:none}
.stack-list li em{color:var(--gold);font-style:normal;font-weight:700}

/* ── What's Included ───────────────────────────────────────────────────── */
.includes{background:linear-gradient(180deg,var(--nude) 0%,var(--bg-pink) 100%)}
.includes-grid{display:grid;grid-template-columns:1fr;gap:var(--space-md)}
@media(min-width:600px){.includes-grid{grid-template-columns:1fr 1fr}}
@media(min-width:900px){.includes-grid{grid-template-columns:repeat(4,1fr)}}
.include-card{background:var(--white);border-radius:var(--radius-md);padding:var(--space-md);box-shadow:0 4px 20px var(--shadow);border-top:4px solid var(--gold);transition:transform .2s ease,box-shadow .2s ease}
.include-card:hover{transform:translateY(-4px);box-shadow:0 12px 36px rgba(107,76,59,.16)}
.include-num{font-size:32px;font-weight:700;font-family:'Playfair Display',serif;color:var(--gold);margin-bottom:var(--space-xs)}
.include-card h3{font-size:17px;margin-bottom:8px}
.include-card p{font-size:13px}

/* ── Niches ────────────────────────────────────────────────────────────── */
.niches{background:var(--white)}
.niche-grid{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-bottom:var(--space-md)}
.niche-tag{background:var(--nude);border:1px solid var(--border);color:var(--brown);border-radius:var(--radius-xl);padding:12px 22px;font-size:15px;font-weight:600;display:flex;align-items:center;gap:8px;transition:background .15s,border-color .15s}
.niche-tag:hover{background:var(--rose);border-color:var(--rose);color:var(--white)}
.niche-note{text-align:center;max-width:600px;margin:0 auto;font-size:16px}

/* ── Templates Preview ─────────────────────────────────────────────────── */
.templates{background:linear-gradient(180deg,var(--bg-pink) 0%,var(--nude) 100%)}
.templates-bullets{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--space-xs);margin-bottom:var(--space-md)}
.t-bullet{background:var(--white);border:1px solid var(--border);border-radius:var(--radius-xl);padding:8px 18px;font-size:14px;color:var(--brown);font-weight:500}
.templates-img{text-align:center}
.templates-img img{border-radius:var(--radius-md);box-shadow:0 16px 48px var(--shadow);max-height:440px;object-fit:contain;margin:0 auto}

/* ── Captions ──────────────────────────────────────────────────────────── */
.captions{background:var(--white)}
.captions-inner{display:grid;grid-template-columns:1fr;gap:var(--space-lg);align-items:center}
@media(min-width:768px){.captions-inner{grid-template-columns:1fr 1fr}}
.captions-text h2{margin-bottom:var(--space-sm)}
.captions-text p{margin-bottom:var(--space-md)}
.captions-text-center{text-align:center;background:var(--bg-pink);border-radius:var(--radius-lg);padding:var(--space-lg);border:1px solid var(--border)}
.captions-text-center h2{font-size:clamp(26px,4vw,40px)}
.captions-text-center .caption-example{text-align:left}
.captions-text-center .btn{font-size:17px}
.caption-example{background:var(--bg-pink);border-radius:var(--radius-md);padding:var(--space-sm) var(--space-md);margin-bottom:12px;border-left:3px solid var(--rose);font-size:14px;color:var(--text);font-style:italic}
.captions-img img{border-radius:var(--radius-md);box-shadow:0 16px 48px var(--shadow);margin:0 auto}
.leyendas-table{background:var(--white);border-radius:var(--radius-lg);overflow:hidden;box-shadow:0 16px 48px var(--shadow);border:1px solid var(--border);max-width:600px;width:100%;margin:0 auto}
.leyendas-table-header{background:var(--rose);color:var(--white);font-weight:700;font-size:17px;text-align:center;padding:20px;letter-spacing:.3px}
.leyendas-row{display:flex;gap:14px;padding:20px 24px;border-bottom:1px solid var(--border);align-items:flex-start}
.leyendas-row:last-child{border:none}
.leyendas-num{color:var(--gold);font-weight:700;font-size:15px;flex-shrink:0;margin-top:1px}
.leyendas-text{font-size:16px;color:var(--text);line-height:1.6}

/* ── Calendar ──────────────────────────────────────────────────────────── */
.calendar{background:linear-gradient(180deg,var(--nude) 0%,var(--bg) 100%)}
.calendar-img{text-align:center}
.calendar-img img{border-radius:var(--radius-md);box-shadow:0 16px 48px var(--shadow);max-height:400px;object-fit:contain;margin:0 auto}
.calendar-note{text-align:center;max-width:580px;margin:var(--space-md) auto 0}

.calendar-table{max-width:760px;margin:0 auto;border-radius:var(--radius-lg);overflow:hidden;box-shadow:0 16px 48px var(--shadow);border:1px solid var(--border);background:var(--white)}
.calendar-table-header{background:var(--brown);color:var(--white);padding:18px 22px}
.calendar-table-title{font-family:'Playfair Display',serif;font-size:20px;font-weight:700}
.calendar-table-sub{font-size:13px;color:var(--gold-light);margin-top:2px}
.calendar-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:1px;background:var(--border)}
.cal-day-name{background:var(--rose);color:var(--white);font-size:11px;font-weight:700;text-align:center;padding:8px 2px;letter-spacing:.5px}
.cal-cell{background:var(--white);padding:8px 6px;min-height:64px;position:relative;font-size:11px}
.cal-cell b{display:block;color:var(--brown);font-size:11px;margin-bottom:2px}
.cal-cell span{color:var(--text-light);font-size:10px;line-height:1.3}
.cal-dot{position:absolute;top:8px;right:6px;width:6px;height:6px;border-radius:50%;background:var(--gold)}
.cal-c1{background:var(--white)}
.cal-c2{background:var(--white)}
.cal-c3{background:var(--nude)}
.cal-c4{background:#E4F0E5}
.cal-c5{background:var(--bg-pink)}
.cal-c6{background:var(--nude)}
.cal-c7{background:#EFEFEF}
@media(min-width:640px){
  .cal-day-name{font-size:12px;padding:10px 4px}
  .cal-cell{padding:10px 8px;min-height:78px;font-size:13px}
  .cal-cell b{font-size:13px}
  .cal-cell span{font-size:11px}
}

/* ── Bonuses ───────────────────────────────────────────────────────────── */
.bonuses{background:var(--white)}
.bonus-img{text-align:center;margin-bottom:var(--space-lg)}
.bonus-img img{border-radius:var(--radius-md);box-shadow:0 16px 48px var(--shadow);max-height:400px;object-fit:contain;margin:0 auto}
.bonus-grid{display:grid;grid-template-columns:1fr;gap:12px}
@media(min-width:600px){.bonus-grid{grid-template-columns:1fr 1fr}}
.bonus-card{background:var(--bg-pink);border-radius:var(--radius-md);padding:var(--space-sm) var(--space-md);display:flex;gap:var(--space-sm);align-items:center;border-left:4px solid var(--rose)}
.bonus-thumb{width:64px;height:64px;border-radius:var(--radius-sm);object-fit:cover;flex-shrink:0;box-shadow:0 4px 12px var(--shadow)}
@media(min-width:600px){.bonus-thumb{width:80px;height:80px}}
.bonus-card.super{background:var(--brown);border-color:var(--gold)}
.bonus-card.super h4,.bonus-card.super p{color:var(--white)}
.bonus-card.super p{color:rgba(255,255,255,.75)}
.bonus-badge{background:var(--rose);color:var(--brown);font-size:10px;font-weight:700;padding:3px 10px;border-radius:var(--radius-xl);text-transform:uppercase;letter-spacing:.5px;white-space:nowrap;margin-top:2px}
.bonus-card.super .bonus-badge{background:var(--gold);color:var(--brown-dark)}
.bonus-content h4{font-size:18px;margin-bottom:6px}
.bonus-content p{font-size:15px;margin:0}

/* ── Value Stack ───────────────────────────────────────────────────────── */
.value{background:linear-gradient(135deg,var(--nude),var(--bg-pink))}
.value-table{max-width:600px;margin:0 auto var(--space-md);border-radius:var(--radius-md);overflow:hidden;box-shadow:0 8px 32px var(--shadow)}
.value-row{display:flex;justify-content:space-between;padding:14px 24px;border-bottom:1px solid var(--border)}
.value-row:nth-child(odd){background:var(--white)}
.value-row:nth-child(even){background:var(--bg-pink)}
.value-row:last-child{border:none}
.value-label{font-size:15px;color:var(--text)}
.value-price{font-size:15px;font-weight:700;color:var(--text-light);text-decoration:line-through}
.value-total{background:var(--brown)!important;border:none}
.value-total .value-label{color:var(--white);font-weight:700}
.value-total .value-price{color:var(--gold);text-decoration:none}
.value-reveal{text-align:center;font-size:clamp(18px,3vw,24px);font-weight:700;color:var(--brown);margin:0 auto var(--space-md);max-width:600px}
.value-reveal span{color:var(--gold)}

/* ── Offer ─────────────────────────────────────────────────────────────── */
.offer{background:var(--brown)}
.offer .section-title h2{color:var(--white)}
.offer .section-title p{color:rgba(255,255,255,.7)}
.offer .gold-line{background:var(--gold)}
.offer-box{background:rgba(255,255,255,.06);border:1px solid rgba(201,169,110,.3);border-radius:var(--radius-lg);padding:var(--space-xl);max-width:700px;margin:0 auto}
.offer-list{margin-bottom:var(--space-lg)}
.offer-list li{padding:10px 0;border-bottom:1px solid rgba(255,255,255,.08);font-size:17px;color:var(--white);display:flex;align-items:center;gap:12px}
.offer-list li::before{content:'✓';color:var(--gold);font-weight:700;font-size:16px}
.price-block{text-align:center;margin-bottom:var(--space-md)}
.discount-badge{display:inline-block;background:#C0392B;color:var(--white);font-size:14px;font-weight:800;padding:8px 20px;border-radius:var(--radius-xl);margin-bottom:var(--space-sm);letter-spacing:.5px;box-shadow:0 4px 16px rgba(192,57,43,.4)}
.price-from{font-size:15px;color:rgba(255,255,255,.6);text-decoration:line-through;display:block}
.price-label{font-size:14px;color:rgba(255,255,255,.7);margin-bottom:4px}
.price-main{font-size:clamp(52px,9vw,78px);font-weight:700;font-family:'Playfair Display',serif;color:var(--gold);line-height:1}
.price-note{font-size:14px;color:rgba(255,255,255,.6);margin-top:8px}
.offer .cta-note{color:rgba(255,255,255,.5)}

/* ── Guarantee ─────────────────────────────────────────────────────────── */
.guarantee{background:linear-gradient(180deg,var(--bg-pink),var(--nude))}
.guarantee-inner{display:grid;grid-template-columns:1fr;gap:var(--space-lg);align-items:center;max-width:800px;margin:0 auto}
@media(min-width:640px){.guarantee-inner{grid-template-columns:200px 1fr}}
.guarantee-img{text-align:center}
.guarantee-img img{max-width:180px;margin:0 auto}
.guarantee-title{margin-top:var(--space-sm);text-align:center}
.guarantee-text p{font-size:17px}

/* ── FAQ ───────────────────────────────────────────────────────────────── */
.faq{background:var(--white)}
.faq-list{max-width:720px;margin:0 auto}
.faq-item{border-bottom:1px solid var(--border)}
.faq-q{width:100%;background:none;border:none;text-align:left;padding:var(--space-sm) 0;font-size:17px;font-weight:600;color:var(--brown);cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:var(--space-sm);font-family:'Inter',sans-serif}
.faq-q:focus{outline:2px solid var(--gold);outline-offset:2px}
.faq-icon{color:var(--gold);font-size:22px;flex-shrink:0;transition:transform .2s ease;font-weight:300}
.faq-item.open .faq-icon{transform:rotate(45deg)}
.faq-a{max-height:0;overflow:hidden;transition:max-height .3s ease,padding .3s ease}
.faq-item.open .faq-a{max-height:200px;padding-bottom:var(--space-sm)}
.faq-a p{font-size:16px;color:var(--text-light)}

/* ── Final CTA ─────────────────────────────────────────────────────────── */
.final-cta{background:linear-gradient(135deg,var(--nude),var(--rose),var(--beige));text-align:center;padding:var(--space-2xl) var(--space-sm)}
.final-cta h2{margin-bottom:var(--space-sm);max-width:700px;margin-left:auto;margin-right:auto}
.final-cta p{max-width:560px;margin:0 auto var(--space-lg)}

/* ── Footer ────────────────────────────────────────────────────────────── */
footer{background:var(--brown-dark);color:rgba(255,255,255,.5);text-align:center;padding:var(--space-md)}
footer p{font-size:13px;margin-bottom:4px}
footer a{color:var(--gold);text-decoration:underline}

/* ── Utility ───────────────────────────────────────────────────────────── */
.text-center{text-align:center}
.mt-sm{margin-top:var(--space-sm)}
.mt-md{margin-top:var(--space-md)}
.mt-lg{margin-top:var(--space-lg)}

/* ── Animations ────────────────────────────────────────────────────────── */
@media(prefers-reduced-motion:no-preference){
  .fade-up{opacity:0;transform:translateY(24px);transition:opacity .5s ease,transform .5s ease}
  .fade-up.visible{opacity:1;transform:none}
}
