: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;
  overflow-x:hidden;
}

.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;}
.btn[disabled], .btn.is-disabled{
  opacity:.55; cursor:not-allowed; pointer-events:none; box-shadow:none;
}

/* Header */
.site-header{padding:20px 0; background:var(--crema);}
.header-inner{display:flex; justify-content:space-between; align-items:center; gap:12px 16px; flex-wrap:wrap;}
.logo-group{display:flex; align-items:center; gap:18px; flex-wrap:wrap;}
.logo{display:flex; align-items:center; gap:10px;}
.logo-img{height:72px; width:auto; max-width:180px; display:block; object-fit:contain; overflow:hidden;}

/* Hero */
.hero{background:var(--oro); padding:80px 24px 88px; text-align:center;}
.hero .wrap{max-width:44rem;}
.hero-eyebrow{
  display:inline-block; background:var(--marron); color:#fff;
  font-family:var(--font-display); font-weight:600; font-size:.85rem;
  letter-spacing:.04em; text-transform:uppercase; padding:8px 20px;
  border-radius:999px; margin-bottom:20px;
}
.hero h1{font-size:3.4rem; line-height:1.08; color:var(--marron); margin-bottom:.4em;}
.hero .sub{font-size:1.15rem; color:#fff; margin-bottom:28px;}
.hero-meta{
  display:flex; flex-wrap:wrap; justify-content:center; gap:12px 28px;
  font-family:var(--font-display); font-weight:600; font-size:.95rem;
  color:var(--marron); margin-bottom:32px;
}

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

/* Tags (elegir / participar / decidir / ser escuchado, Casa / Escuela / Terapia / Comunidad)
   Deliberadamente distintos de .btn: fondo claro, borde, esquinas menos redondeadas,
   sin sombra ni mayúscula-negrita de botón — para que no se lean como acciones clicables. */
.pill-row{display:flex; flex-wrap:wrap; gap:12px; justify-content:center; margin:32px 0;}
.pill{
  background:#fff; color:var(--marron); font-family:var(--font-display); font-weight:600;
  font-size:.95rem; padding:10px 22px; border-radius:var(--radius-sm); border:1.5px solid var(--oro);
}

.eyebrow-tag{
  display:inline-block; background:var(--marron); color:#fff;
  font-family:var(--font-display); font-size:.85rem; font-weight:600;
  padding:8px 18px; border-radius:8px; margin-bottom:16px;
}

/* Temario grid */
.temario-grid{display:grid; grid-template-columns:1fr 1fr; gap:20px; margin-top:32px;}
.temario-card{
  background:#fff; border-left:6px solid var(--oro); border-radius:var(--radius-md);
  padding:22px 26px; box-shadow:0 6px 16px rgba(0,0,0,.04);
}
.temario-card h4{color:var(--marron); font-size:1.05rem; margin-bottom:6px;}
.temario-card p{color:var(--texto-suave); font-size:.9rem; margin:0;}

/* De la teoría a la práctica */
.practica{max-width:40rem; margin:0 auto; text-align:center;}

/* Ponentes */
.ponentes-grid{display:grid; grid-template-columns:1fr 1fr; gap:40px; align-items:center; margin-top:32px;}
.ponentes-list{display:flex; flex-direction:column; gap:32px;}
.ponente{display:flex; gap:18px; align-items:flex-start;}
.ponente-photo{
  width:76px; height:76px; border-radius:50%; overflow:hidden; flex-shrink:0;
  border:4px solid #fff; box-shadow:0 6px 16px rgba(0,0,0,.1); background:var(--borde);
}
.ponente-photo img{width:100%; height:100%; object-fit:cover; display:block;}
.ponente-name{
  display:inline-block; background:var(--terracota); color:#fff; font-family:var(--font-display);
  font-weight:600; font-size:.9rem; padding:5px 14px; border-radius:8px; margin-bottom:6px;
}
.ponente-role{color:var(--marron); font-weight:600; font-size:.95rem; margin-bottom:4px;}
.ponente p{color:var(--texto-suave); font-size:.9rem; margin:0;}
.ponentes-photo{
  border-radius:var(--radius-lg); overflow:hidden; aspect-ratio:4/3; background:var(--borde);
  box-shadow:0 12px 30px rgba(0,0,0,.1);
}
.ponentes-photo img{width:100%; height:100%; object-fit:cover; display:block;}

/* Logística / dirigido a */
.logistica-box{
  background:var(--oro); border-radius:var(--radius-lg); max-width:var(--max-w); margin:0 auto;
  padding:40px; color:var(--marron);
}
.logistica-box h3{font-size:1.1rem; margin-bottom:8px;}
.logistica-box .dirigido-text{font-size:.95rem; margin-bottom:28px;}
.logistica-grid{display:grid; grid-template-columns:1fr 1fr; gap:24px 40px;}
.logistica-item h4{font-family:var(--font-display); font-weight:700; font-size:1rem; margin-bottom:2px;}
.logistica-item p{margin:0; font-size:.95rem;}

/* 3 pasos (estilo StoryBrand) */
.pasos-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:32px; margin-top:36px;}
.paso{text-align:center;}
.paso-num{
  display:flex; align-items:center; justify-content:center;
  width:48px; height:48px; margin:0 auto 16px; border-radius:50%;
  background:var(--terracota); color:#fff; font-family:var(--font-display);
  font-weight:700; font-size:1.3rem; box-shadow:0 6px 16px rgba(187,58,29,.2);
}
.paso h4{color:var(--marron); font-size:1.05rem; margin-bottom:6px;}
.paso p{color:var(--texto-suave); font-size:.9rem; margin:0;}

/* Price countdown timer */
.price-timer{
  background:#fff; border:2px solid var(--terracota); border-radius:var(--radius-lg);
  max-width:var(--max-w); margin:0 auto 20px; padding:20px 24px; text-align:center;
}
.price-timer-title{
  font-family:var(--font-display); font-weight:600; color:var(--marron);
  font-size:1rem; margin:0 0 14px;
}
.price-timer-grid{display:flex; justify-content:center; gap:16px;}
.price-timer-unit{display:flex; flex-direction:column; align-items:center; min-width:52px;}
.price-timer-num{
  font-family:var(--font-display); font-weight:700; font-size:1.8rem;
  color:#fff; background:var(--terracota); border-radius:var(--radius-sm);
  padding:6px 0; width:100%; line-height:1;
}
.price-timer-label{font-size:.7rem; color:var(--texto-tenue); margin-top:6px; text-transform:uppercase; letter-spacing:.03em;}
.price-timer[hidden]{display:none;}

/* Deadline banner */
.deadline-banner{
  background:var(--marron); color:#fff; text-align:center; border-radius:var(--radius-md);
  max-width:var(--max-w); margin:0 auto 24px; padding:14px 20px; font-size:.9rem; font-weight:600;
}
.deadline-banner.is-closed{background:var(--oliva);}

/* Inscripción / pago */
.inscripcion-grid{display:grid; grid-template-columns:1fr 1fr; gap:24px; margin-top:32px; align-items:start;}
.pago-card{
  background:#fff; border-radius:var(--radius-lg); padding:32px; border:1px solid var(--borde);
  text-align:center;
}
.pago-card h3{color:var(--marron); font-size:1.15rem; margin-bottom:6px;}
.pago-card p{font-size:.85rem; color:var(--texto-tenue); margin-bottom:20px;}

.transferencia-panel{
  max-width:var(--max-w); margin:24px auto 0; background:#fff; border-radius:var(--radius-lg);
  border:1px solid var(--borde); padding:32px; display:none;
}
.transferencia-panel.is-open{display:block;}
.transferencia-panel h3{color:var(--marron); font-size:1.1rem;}
.datos-bancarios{
  background:var(--crema); border-radius:var(--radius-md); padding:20px 24px; margin:16px 0 24px;
  font-size:.9rem;
}
.datos-bancarios p{margin:0 0 4px;}
.ghl-embed{width:100%; min-height:420px; margin-top:24px; position:relative;}
/* El script de GHL (form_embed.js) intenta medir el alto real del form vía
   postMessage y, si esa negociación falla, deja el iframe en un estado "de
   carga" permanente: oculto, movido fuera de pantalla y colapsado a unos
   pocos px. Además envuelve el iframe en sus propios divs (.ep-wrapper,
   .ep-iFrameContainer) que traen su propia altura fija, así que forzamos
   toda la cadena a ocupar el 100% del contenedor, con !important. */
.ghl-embed .ep-wrapper,
.ghl-embed .ep-iFrameContainer{
  height:100% !important;
  width:100% !important;
}
.ghl-embed iframe{
  height:100% !important;
  width:100% !important;
  position:relative !important;
  left:0 !important;
  opacity:1 !important;
  visibility:visible !important;
  pointer-events:auto !important;
}

/* 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);}
.inline-link{color:var(--terracota); font-weight:600; text-decoration:underline;}

/* Módulo genérico (usado en /gracias y 404) */
.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;}
.popup-icon{font-size:1.9rem; margin-bottom:8px;}

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

/* Responsive */
@media (max-width:820px){
  .temario-grid,.ponentes-grid,.logistica-grid,.inscripcion-grid,.pasos-grid{grid-template-columns:1fr;}
  .hero{padding:64px 24px 72px;}
  .hero h1{font-size:2.4rem;}
  .ponentes-photo{order:-1;}
}

@media (max-width:520px){
  .header-inner{justify-content:center; text-align:center;}
  .header-inner .btn{padding:10px 16px; font-size:.8rem; white-space:nowrap;}
  .logo-img{height:44px;}
  .logo-group{gap:12px;}
  .hero{padding:48px 20px 56px;}
  .hero h1{font-size:1.9rem;}
  .hero-meta{font-size:.85rem; gap:8px 16px;}
  .pill{font-size:.9rem; padding:12px 22px;}
  .modulo1-card{margin-left:-24px; margin-right:-24px;}
  .price-timer{padding:16px;}
  .price-timer-title{font-size:.85rem;}
  .price-timer-grid{gap:8px;}
  .price-timer-unit{min-width:44px;}
  .price-timer-num{font-size:1.3rem; padding:5px 0;}
  .price-timer-label{font-size:.6rem;}
}
