:root{
  --terracota:#BB3A1D;
  --marron:#63190E;
  --oliva:#6A6E5F;
  --oro:#CF9645;
  --crema:#EEE1CF;
  --blanco:#FFFFFF;
  --texto:#3A2B22;
  --texto-suave:#5B4A3E;
  --texto-tenue:#8A7A6C;
  --borde:#E7D9C3;
  --radius-lg:24px;
  --radius-md:16px;
  --radius-sm:10px;
  --max-w:60rem;
  --font-display:'Fredoka', sans-serif;
  --font-body:'Fredoka', sans-serif;
}

*{box-sizing:border-box;}

html{scroll-behavior:smooth;}

body{
  margin:0;
  font-family:var(--font-body);
  font-weight:500;
  background:var(--crema);
  color:var(--texto);
  line-height:1.55;
}

.wrap{max-width:var(--max-w); margin:0 auto; padding:0 24px;}

h1,h2,h3,h4{font-family:var(--font-display); font-weight:600; margin:0 0 .5em;}
p{margin:0 0 1em;}

a{color:inherit;}

.center{text-align:center;}
.subtext{color:var(--texto-tenue); font-size:.95rem; margin-top:-.5em;}

/* Buttons */
.btn{
  display:inline-block;
  font-weight:600;
  font-family:var(--font-display);
  font-size:.95rem;
  padding:14px 28px;
  border-radius:999px;
  text-decoration:none;
  border:2px solid transparent;
  cursor:pointer;
  transition:transform .15s ease, box-shadow .15s ease;
}
.btn:hover{transform:translateY(-1px);}
.btn:focus-visible{outline:3px solid var(--oro); outline-offset:2px;}

.btn-terracota{background:var(--terracota); color:#fff; box-shadow:0 6px 16px rgba(187,58,29,.25);}
.btn-oro{background:var(--oro); color:#fff; box-shadow:0 6px 16px rgba(207,150,69,.3);}
.btn-outline{background:transparent; border-color:var(--terracota); color:var(--terracota);}
.btn-block{width:100%; text-align:center;}

/* Header */
.site-header{padding:20px 0; background:var(--crema);}
.header-inner{display:flex; justify-content:space-between; align-items:center;}
.logo{display:flex; align-items:center; gap:10px;}
.logo-img{height:92px; width:auto; display:block;}

/* Hero */
.hero{padding:20px 24px 48px;}
.hero-grid{display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:center;}
.eyebrow{
  display:inline-block; background:#fff; border:1px solid var(--oro); color:var(--marron);
  font-family:var(--font-display); font-size:.85rem; font-weight:600; padding:6px 16px; border-radius:999px; margin-bottom:14px;
}
.hero h1{font-size:2.5rem; line-height:1.15; color:var(--marron);}
.hero .sub{font-size:1.05rem; color:var(--texto-suave); margin-bottom:26px;}
.hero-img{width:100%; height:auto; display:block; border-radius:var(--radius-lg);}

/* Tagline */
.tagline-section{padding:51px 24px 64px; text-align:center; position:relative;}
.tagline-icon{display:block; font-size:1.6rem; margin-bottom:12px;}
.tagline{
  font-family:var(--font-display); font-size:2.1rem; line-height:1.3; font-weight:700;
  color:var(--marron); max-width:36rem; margin:0 auto;
}
.tagline-highlight{
  color:var(--terracota); text-decoration:underline; text-decoration-color:var(--oro);
  text-decoration-style:wavy; text-decoration-thickness:3px; text-underline-offset:6px;
}

section.section{padding:56px 24px;}

/* Check lists */
.check-list{list-style:none; padding:0; margin:0; display:grid; gap:14px;}
.check-list li{position:relative; padding-left:26px; font-size:.95rem;}
.check-list li::before{content:"✓"; position:absolute; left:0; color:var(--terracota); font-weight:700;}
.check-list--dark li{color:#fff; opacity:.95;}
.check-list--dark li::before{color:var(--oro);}

/* Para ti si */
.para-si{
  background:linear-gradient(180deg, rgba(99,25,14,.88), rgba(74,18,9,.93)), url('img/para-ti-bg.jpg') center/cover no-repeat;
  color:#fff; border-radius:var(--radius-lg); padding:56px 40px; max-width:var(--max-w); margin:0 auto;
}
.para-si h2{font-size:1.6rem; margin-bottom:24px;}
.para-si .btn{margin-top:28px;}

/* Pricing */
.pricing-grid{display:grid; grid-template-columns:1fr 1fr; gap:24px; margin-top:40px; align-items:stretch;}
.price-card{
  background:#fff; border-radius:var(--radius-lg); padding:32px;
  border:1px solid var(--borde); position:relative;
  display:flex; flex-direction:column;
}
.price-card--reco{
  border:2px solid var(--terracota);
  box-shadow:0 12px 30px rgba(187,58,29,.15);
}
.price-card .check-list{flex:1;}
.badge-reco{
  position:absolute; top:-14px; left:50%; transform:translateX(-50%);
  background:var(--terracota); color:#fff; font-family:var(--font-display); font-size:.75rem; font-weight:600;
  padding:6px 16px; border-radius:999px; white-space:nowrap;
}
.price-card h3{font-size:1.25rem; color:var(--marron); margin-bottom:2px;}
.price-card .desc{font-size:.85rem; color:var(--texto-tenue); margin-bottom:18px;}
.price{font-family:var(--font-display); font-size:2.1rem; font-weight:700; color:var(--terracota); margin-bottom:8px;}
.price small{font-size:.85rem; color:var(--texto-tenue); font-weight:500;}
.price-card .check-list{margin:18px 0 24px;}
.payplan{font-size:.75rem; color:var(--oliva); margin-top:10px; text-align:center;}
.payplan-link{color:var(--terracota); font-weight:600; text-decoration:underline;}

/* Garantia */
.garantia{
  background:var(--crema); border:2px dashed var(--oro); border-radius:var(--radius-lg);
  max-width:38rem; margin:48px auto; padding:40px; text-align:center;
}
.garantia-icon{font-size:2.25rem; margin-bottom:10px;}
.garantia h3{color:var(--marron); font-size:1.35rem;}
.garantia p{max-width:36rem; margin:0 auto .5em; font-size:.95rem; color:var(--texto-suave);}
.garantia .fine{font-size:.75rem; color:var(--texto-tenue); margin-top:10px;}

/* Modulos */
.modulos-title{color:var(--marron); font-size:1.25rem; margin:48px 0 16px;}
.modulos-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:16px;}
.mod-card{background:#fff; border-radius:var(--radius-md); padding:20px; text-align:center; border:1px solid var(--borde);}
.mod-n{color:var(--oro); font-family:var(--font-display); font-weight:700; font-size:.75rem; text-transform:uppercase; letter-spacing:.03em;}
.mod-card h4{font-size:.95rem; color:var(--marron); margin:6px 0 8px;}
.mod-card p{font-size:.8rem; color:var(--texto-tenue); margin:0;}

/* Diseñamos */
.disenamos{
  background:linear-gradient(180deg, var(--marron), #4A1209); color:#fff; border-radius:var(--radius-lg); max-width:var(--max-w); margin:0 auto;
  padding:56px 40px; display:grid; grid-template-columns:.8fr 1.2fr; gap:40px; align-items:center;
}
.disenamos h2{font-size:1.6rem; line-height:1.3; margin:0;}

/* Sara */
.sara{display:grid; grid-template-columns:1fr .6fr; gap:40px; align-items:center;}
.sara h2{font-size:1.6rem; color:var(--marron); margin-bottom:14px;}
.sara p{font-size:.95rem; color:var(--texto-suave);}
.sara-photo{
  aspect-ratio:1; border-radius:50%; overflow:hidden;
  border:8px solid #fff; box-shadow:0 10px 24px rgba(0,0,0,.1);
}
.sara-photo img{width:100%; height:100%; object-fit:cover; object-position:top center; display:block;}

/* FAQ */
.faq{max-width:48rem; margin:0 auto;}
.faq h2{color:var(--marron); font-size:1.6rem; margin-bottom:28px;}
.faq details{
  background:#fff; border:1px solid var(--borde); border-radius:14px;
  margin-bottom:10px; padding:16px 20px;
}
.faq summary{
  font-weight:600; font-size:.95rem; color:var(--marron); cursor:pointer;
  list-style:none; display:flex; justify-content:space-between; align-items:center; gap:12px;
}
.faq summary::-webkit-details-marker{display:none;}
.faq summary::after{content:"+"; font-size:1.3rem; color:var(--terracota); flex-shrink:0;}
.faq details[open] summary::after{content:"–";}
.faq details p{margin-top:10px; font-size:.9rem; color:var(--texto-suave);}
.inline-link{color:var(--terracota); font-weight:600; text-decoration:underline;}

/* Testimonios */
.testi{background:var(--oliva); border-radius:var(--radius-lg); max-width:var(--max-w); margin:0 auto; padding:56px 40px; color:#fff;}
.testi h2{font-size:1.6rem; margin-bottom:24px;}
.testi-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:20px;}
.t-card{background:rgba(255,255,255,.08); border-radius:var(--radius-md); padding:18px; font-size:.85rem;}
.t-card p{margin-bottom:0;}
.t-card .stars{color:var(--oro); margin-top:10px; font-size:.8rem;}
.t-card b{display:block; margin-top:8px;}

/* Footer */
.site-footer{text-align:center; padding:40px 24px 20px;}
.footer-inner{display:flex; flex-wrap:wrap; justify-content:center; gap:12px 24px; font-size:.9rem; margin-bottom:8px;}
.footer-inner a{text-decoration:none; white-space:nowrap;}
.copyright{font-size:.75rem; color:var(--texto-tenue);}

/* Popup */
.popup-overlay{
  position:fixed; inset:0; background:rgba(0,0,0,.55);
  display:flex; align-items:center; justify-content:center;
  padding:20px; z-index:1000;
}
.popup-overlay[hidden]{display:none;}
.popup{
  background:#fff; border-radius:var(--radius-lg); max-width:26rem; width:100%;
  padding:32px; text-align:center; position:relative;
  box-shadow:0 20px 50px rgba(0,0,0,.25);
  animation:popup-in .25s ease;
}
@keyframes popup-in{
  from{opacity:0; transform:translateY(12px) scale(.98);}
  to{opacity:1; transform:translateY(0) scale(1);}
}
.popup-close{
  position:absolute; top:12px; right:12px; background:none; border:none;
  font-size:1.1rem; color:var(--texto-tenue); cursor:pointer; line-height:1;
  width:32px; height:32px; border-radius:50%;
}
.popup-close:hover{background:var(--crema);}
.popup-icon{font-size:1.9rem; margin-bottom:8px;}
.popup h3{color:var(--marron); font-size:1.25rem; margin-bottom:10px;}
.popup > p{font-size:.9rem; color:var(--texto-suave); margin-bottom:20px;}
/* Embed de GHL (popup y sección fija del Módulo 1) */
.ghl-embed{width:100%; min-height:491px;}

/* Módulo 1 gratis (versión fija, no-popup) */
.modulo1-card{
  background:#fff; border-radius:var(--radius-lg); max-width:26rem; margin:0 auto;
  padding:40px 32px; text-align:center; border:1px solid var(--borde);
  box-shadow:0 12px 30px rgba(0,0,0,.06);
}
.modulo1-card h1, .modulo1-card h2{color:var(--marron); font-size:1.4rem; margin-bottom:10px;}
.modulo1-card > p{font-size:.9rem; color:var(--texto-suave); margin-bottom:20px;}
.modulo1-card .fine{font-size:.75rem; color:var(--texto-tenue); margin:14px 0 0;}

/* Reduced motion */
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  .popup{animation:none;}
  .btn{transition:none;}
}

/* Responsive */
@media (max-width:820px){
  .hero-grid,.pricing-grid,.disenamos,.sara,.testi-grid{grid-template-columns:1fr;}
  .modulos-grid{grid-template-columns:1fr 1fr;}
  .hero h1{font-size:1.9rem;}
  .para-si,.disenamos,.testi{padding:40px 24px;}
  .sara-photo{order:-1; width:200px; margin:0 auto 8px;}
  .pricing-grid{margin-left:-24px; margin-right:-24px;}
  .hero-copy{text-align:center;}
  .sara-copy{text-align:center;}
}

@media (max-width:520px){
  .modulos-grid{grid-template-columns:1fr;}
  .header-inner .btn{padding:10px 16px; font-size:.8rem; white-space:nowrap;}
  .logo-img{height:60px;}
  .modulo1-card{margin-left:-24px; margin-right:-24px;}
}

@media (min-width:821px){
  /* Espacio nav → hero: +15% (20px+20px de padding = 40px -> 46px) */
  .site-header{padding-bottom:23px;}
  .hero{padding-top:23px;}
}
