/* =========================================================
   30 Días de Paz para el Alma — Lennifu
   Sistema de diseño
   ========================================================= */

:root{
  /* Papel y tinta (tomados de la portada del libro) */
  --paper:        #F7F1E6;
  --paper-warm:   #F0E7D7;
  --paper-deep:   #E4D8C3;
  --card:         #FDFAF4;

  --ink:          #2E2118;
  --ink-soft:     #4A3728;
  --ink-mid:      #6B5745;
  --ink-mute:     #8C7862;
  --rule:         #DCCDB4;

  /* Acentos */
  --brown:        #6B4A2F;
  --brown-dk:     #4A3220;
  --gold:         #C08F3C;
  --gold-soft:    #DCB672;
  --gold-wash:    #F5E9D2;

  /* Acción (el color que empuja al clic) */
  --action:       #8C2F1E;
  --action-dk:    #6E2214;

  --serif: 'Playfair Display', 'Cormorant Garamond', Georgia, 'Times New Roman', serif;
  --sans:  'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;

  --container: 1180px;
  --gutter: 24px;

  --shadow-cover: 0 34px 60px -22px rgba(46,33,24,.45), 0 12px 24px -10px rgba(46,33,24,.30);
  --shadow-card:  0 2px 4px rgba(46,33,24,.04), 0 12px 32px -16px rgba(46,33,24,.18);
  --shadow-pop:   0 40px 80px -20px rgba(46,33,24,.45);
}

*,*::before,*::after{ box-sizing:border-box; }

html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }

body{
  margin:0;
  background:var(--paper);
  color:var(--ink-soft);
  font-family:var(--sans);
  font-size:17px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  overflow-x:clip;
}

img{ max-width:100%; height:auto; display:block; }

h1,h2,h3,h4{
  font-family:var(--serif);
  color:var(--ink);
  line-height:1.12;
  margin:0 0 .5em;
  font-weight:600;
  letter-spacing:-.015em;
}
h1{ font-size:clamp(2.4rem, 6vw, 4.15rem); }
h2{ font-size:clamp(1.85rem, 4.2vw, 2.9rem); }
h3{ font-size:clamp(1.2rem, 2.2vw, 1.5rem); }
p{ margin:0 0 1.1em; }
a{ color:inherit; }

.wrap{ width:100%; max-width:var(--container); margin:0 auto; padding:0 var(--gutter); }
.narrow{ max-width:760px; margin-left:auto; margin-right:auto; }

section{ padding:clamp(56px, 8vw, 108px) 0; position:relative; }

/* ---------- Piezas tipográficas reutilizables ---------- */

.eyebrow{
  font-family:var(--sans);
  font-size:.72rem;
  font-weight:700;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--gold);
  margin:0 0 1.1em;
}
.eyebrow--ink{ color:var(--ink-mute); }

.numeral{
  font-family:var(--serif);
  font-size:1.05rem;
  letter-spacing:.3em;
  color:var(--gold);
  display:block;
  margin-bottom:.6em;
}

.lede{
  font-size:clamp(1.05rem, 1.7vw, 1.22rem);
  color:var(--ink-mid);
  line-height:1.7;
}

.rule{
  height:1px;
  background:linear-gradient(90deg, transparent, var(--rule) 20%, var(--rule) 80%, transparent);
  border:0;
  margin:0;
}

.section-head{ max-width:720px; margin-bottom:clamp(36px,5vw,60px); }
.section-head.center{ margin-left:auto; margin-right:auto; text-align:center; }

/* ---------- Botones ---------- */

.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.6em;
  font-family:var(--sans);
  font-size:.82rem;
  font-weight:700;
  letter-spacing:.13em;
  text-transform:uppercase;
  text-decoration:none;
  padding:1.15em 2.1em;
  border-radius:3px;
  border:1px solid transparent;
  cursor:pointer;
  transition:transform .18s ease, box-shadow .18s ease, background .18s ease, color .18s ease;
  text-align:center;
  line-height:1.25;
}
.btn--primary{
  background:var(--action);
  color:#FDF8F0;
  box-shadow:0 10px 24px -12px rgba(140,47,30,.75);
}
.btn--primary:hover{ background:var(--action-dk); transform:translateY(-2px); box-shadow:0 16px 30px -12px rgba(140,47,30,.8); }
.btn--ghost{
  background:transparent;
  color:var(--ink-soft);
  border-color:var(--rule);
}
.btn--ghost:hover{ border-color:var(--brown); color:var(--ink); transform:translateY(-2px); }
.btn--block{ width:100%; }
.btn--lg{ padding:1.35em 2.4em; font-size:.9rem; }

/* Blindaje: si se activa el widget de Hotmart (CONFIG.HOTMART_POPUP),
   sus clases no deben repintar los botones de la página. */
a.btn.hotmart-fb,
a.btn.hotmart__button-checkout{
  background:var(--action) !important;
  color:#FDF8F0 !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  border:1px solid transparent !important;
  border-radius:3px !important;
  font-family:var(--sans) !important;
  text-decoration:none !important;
  box-shadow:0 10px 24px -12px rgba(140,47,30,.75) !important;
}
a.btn.btn--block.hotmart-fb{ width:100% !important; }
a.btn.hotmart-fb img{ display:none !important; }

.btn-note{
  font-size:.74rem;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--ink-mute);
  margin:.95em 0 0;
}

/* =========================================================
   Barra superior + cuenta atrás
   ========================================================= */

.topbar{
  position:sticky; top:0; z-index:50;
  background:var(--ink);
  color:var(--paper-warm);
  font-size:.7rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  border-bottom:1px solid rgba(220,205,180,.18);
}
.topbar__in{
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  min-height:44px; padding:6px var(--gutter);
  max-width:var(--container); margin:0 auto;
}
.topbar__brand{ color:var(--gold-soft); font-weight:700; white-space:nowrap; }
.topbar__deal{ display:flex; align-items:center; gap:12px; flex-wrap:wrap; justify-content:center; }
.topbar__label{ color:rgba(240,231,215,.7); }
.countdown{
  font-family:var(--sans);
  font-variant-numeric:tabular-nums;
  font-weight:700;
  letter-spacing:.08em;
  color:var(--gold-soft);
  background:rgba(192,143,60,.12);
  border:1px solid rgba(192,143,60,.35);
  padding:.25em .7em;
  border-radius:2px;
  white-space:nowrap;
}
.topbar__cta{
  color:var(--paper);
  text-decoration:none;
  border-bottom:1px solid var(--gold);
  padding-bottom:2px;
  font-weight:700;
  white-space:nowrap;
}
.topbar__cta:hover{ color:var(--gold-soft); }
@media (max-width:820px){
  .topbar__brand, .topbar__cta{ display:none; }
  .topbar__in{ justify-content:center; }
}

/* =========================================================
   Hero
   ========================================================= */

.hero{
  padding:clamp(48px,7vw,92px) 0 clamp(40px,6vw,72px);
  background:
    radial-gradient(1200px 600px at 12% -5%, rgba(220,182,114,.20), transparent 60%),
    radial-gradient(900px 500px at 95% 10%, rgba(107,74,47,.10), transparent 62%),
    var(--paper);
  overflow:hidden;
}
.hero__grid{
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:clamp(32px,5vw,72px);
  align-items:center;
}
.hero__kicker{
  font-size:.72rem; font-weight:700; letter-spacing:.2em; text-transform:uppercase;
  color:var(--brown); margin:0 0 1.4em; max-width:34ch; line-height:1.7;
}
.hero h1{ margin-bottom:.34em; }
.hero h1 em{
  font-style:italic;
  font-weight:500;
  color:var(--brown);
  display:block;
}
.hero__sub{
  font-size:clamp(1.05rem,1.6vw,1.2rem);
  color:var(--ink-mid);
  max-width:52ch;
  margin-bottom:1.6em;
}
.hero__actions{ display:flex; gap:14px; flex-wrap:wrap; align-items:center; }

.hero__trust{
  display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(16px,2vw,28px);
  margin-top:clamp(32px,4vw,48px);
  padding-top:clamp(24px,3vw,32px);
  border-top:1px solid var(--rule);
}
.trust__item{ min-width:0; }
.trust__num{
  font-family:var(--serif); font-size:1.7rem; color:var(--ink); line-height:1; display:block;
}
.trust__num--sm{ font-size:1.15rem; line-height:1.25; }
.trust__lbl{
  font-size:.6rem; letter-spacing:.13em; text-transform:uppercase; color:var(--ink-mute);
  display:block; margin-top:.55em;
}

/* Maqueta 3D del libro */
.bookstage{ perspective:1800px; display:flex; justify-content:center; }
.book{
  position:relative;
  width:min(340px, 78%);
  transform:rotateY(-19deg) rotateX(3deg);
  transform-style:preserve-3d;
  transition:transform .7s cubic-bezier(.2,.7,.3,1);
  filter:drop-shadow(0 40px 44px rgba(46,33,24,.34));
}
.book:hover{ transform:rotateY(-9deg) rotateX(1deg) translateY(-6px); }
.book img{
  width:100%; border-radius:2px 5px 5px 2px;
  box-shadow:var(--shadow-cover);
}
/* lomo */
.book::before{
  content:''; position:absolute; left:0; top:0; bottom:0; width:22px;
  background:linear-gradient(90deg, rgba(46,33,24,.42), rgba(46,33,24,.06) 55%, rgba(255,255,255,.28));
  border-radius:2px 0 0 2px;
}
/* brillo */
.book::after{
  content:''; position:absolute; inset:0; border-radius:2px 5px 5px 2px;
  background:linear-gradient(105deg, rgba(255,255,255,.28) 0%, rgba(255,255,255,0) 34%, rgba(255,255,255,0) 76%, rgba(255,255,255,.12) 100%);
  pointer-events:none;
}
.book__badge{
  position:absolute; right:-12px; bottom:-14px;
  background:var(--action); color:#FDF8F0;
  font-size:.64rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
  padding:.75em 1.1em; border-radius:2px;
  box-shadow:0 14px 26px -12px rgba(140,47,30,.8);
  transform:translateZ(40px);
}

@media (max-width:900px){
  .hero{ padding-top:clamp(28px,5vw,48px); }
  .hero__grid{ grid-template-columns:1fr; gap:28px; }
  .hero__col--art{ order:-1; }
  .book{ width:min(210px,52%); transform:rotateY(-14deg); }
  .book__badge{ font-size:.56rem; padding:.6em .85em; right:-8px; bottom:-10px; }
  .hero__actions .btn{ flex:1 1 220px; }
  .hero__trust{ gap:14px; }
  .trust__num{ font-size:1.35rem; }
  .trust__lbl{ font-size:.55rem; letter-spacing:.1em; }
}

/* =========================================================
   Bandas y bloques
   ========================================================= */

.band{ background:var(--paper-warm); }
.band--deep{ background:var(--ink); color:rgba(240,231,215,.86); }
.band--deep h2,.band--deep h3{ color:var(--paper); }
.band--deep .eyebrow{ color:var(--gold-soft); }
.band--deep .lede{ color:rgba(240,231,215,.78); }

.quote-band{
  background:var(--ink);
  color:var(--paper-warm);
  padding:clamp(48px,6vw,84px) 0;
  text-align:center;
}
.quote-band p{
  font-family:var(--serif);
  font-size:clamp(1.4rem,3vw,2.15rem);
  font-style:italic;
  line-height:1.4;
  color:var(--gold-soft);
  max-width:24ch;
  margin:0 auto;
}

/* ---------- Lista de dolores ---------- */

.pains{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--rule); border:1px solid var(--rule); }
@media (max-width:900px){ .pains{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px){ .pains{ grid-template-columns:1fr; } }
.pain{
  background:var(--card);
  padding:clamp(24px,3vw,34px);
}
.pain__mark{
  font-family:var(--serif); font-size:1.1rem; color:var(--gold); display:block; margin-bottom:.7em;
}
.pain p{ margin:0; color:var(--ink-mid); font-size:1rem; }

/* ---------- Los 30 días ---------- */

.days{
  display:grid;
  /* 30 días: 5 / 3 / 2 / 1 columnas dividen exacto y no dejan huecos vacíos */
  grid-template-columns:repeat(5,1fr);
  gap:1px;
  background:var(--rule);
  border:1px solid var(--rule);
}
@media (max-width:1080px){ .days{ grid-template-columns:repeat(3,1fr); } }
@media (max-width:720px){  .days{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:460px){  .days{ grid-template-columns:1fr; } }
.day{
  background:var(--card);
  padding:16px 18px;
  display:flex; gap:14px; align-items:baseline;
  transition:background .18s ease;
}
.day:hover{ background:var(--gold-wash); }
.day__n{
  font-family:var(--serif);
  font-size:.86rem;
  color:var(--gold);
  font-weight:600;
  letter-spacing:.06em;
  min-width:2.6em;
  flex:0 0 auto;
}
.day__t{ font-size:.95rem; color:var(--ink-soft); line-height:1.4; }

/* ---------- Anatomía del día ---------- */

.anatomy{ display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:clamp(20px,3vw,34px); }
.anat{
  border-top:2px solid var(--gold);
  padding-top:22px;
}
.anat h3{ font-size:1.22rem; margin-bottom:.45em; }
.anat p{ margin:0; color:var(--ink-mid); font-size:.98rem; }

/* ---------- Vistazo por dentro (página de muestra) ---------- */

.peek{
  display:grid; grid-template-columns:1fr 1fr; gap:clamp(28px,4vw,60px); align-items:center;
}
.page-sample{
  background:var(--card);
  border:1px solid var(--rule);
  box-shadow:var(--shadow-card);
  padding:clamp(28px,4vw,46px);
  position:relative;
  border-radius:2px;
}
/* Sin degradado de recorte: el Día 1 se muestra entero, como dice el texto. */
.page-sample__day{
  font-size:.66rem; letter-spacing:.24em; text-transform:uppercase; color:var(--gold); font-weight:700;
  text-align:center; margin:0 0 .8em;
}
.page-sample h3{ text-align:center; font-size:clamp(1.5rem,2.6vw,2rem); margin-bottom:1.3em; }
.page-sample h4{
  font-family:var(--sans); font-size:.68rem; letter-spacing:.2em; text-transform:uppercase;
  color:var(--brown); margin:1.8em 0 .7em; font-weight:700;
}
.page-sample h4:first-of-type{ margin-top:0; }
.page-sample p{ font-size:.98rem; color:var(--ink-mid); }
.page-sample blockquote{
  margin:0; padding:1.1em 1.3em;
  background:var(--gold-wash);
  border-left:3px solid var(--gold);
  font-size:.98rem; color:var(--ink-soft);
}
.page-sample cite{
  display:block; text-align:right; font-style:normal;
  font-size:.7rem; letter-spacing:.14em; text-transform:uppercase; color:var(--gold);
  margin-top:1em;
}
@media (max-width:860px){ .peek{ grid-template-columns:1fr; } }

/* ---------- Para quién / no es para quién ---------- */

.fit{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(20px,3vw,34px); }
.fit__col{
  background:var(--card); border:1px solid var(--rule); padding:clamp(26px,3.4vw,38px); border-radius:2px;
}
.fit__col--no{ background:transparent; border-style:dashed; }
.fit h3{ font-size:1.32rem; margin-bottom:1em; }
.fit ul{ list-style:none; margin:0; padding:0; }
.fit li{
  position:relative; padding-left:1.9em; margin-bottom:.95em; font-size:1rem; color:var(--ink-mid); line-height:1.55;
}
.fit li::before{
  position:absolute; left:0; top:0;
  font-weight:700;
}
.fit__col--yes li::before{ content:'✓'; color:var(--gold); }
.fit__col--no li::before{ content:'—'; color:var(--ink-mute); }
@media (max-width:760px){ .fit{ grid-template-columns:1fr; } }

/* ---------- Bono ---------- */

.bonus{ display:grid; grid-template-columns:.9fr 1.1fr; gap:clamp(32px,5vw,68px); align-items:center; }
.bonus__tag{
  display:inline-block; background:var(--gold); color:var(--ink);
  font-size:.66rem; font-weight:700; letter-spacing:.18em; text-transform:uppercase;
  padding:.55em 1em; border-radius:2px; margin-bottom:1.4em;
}

/* Portada del Kit + una hoja asomando por detrás */
.kitart{ position:relative; padding:10px 26px 26px 10px; }
.kitart img{
  border:1px solid var(--rule);
  border-radius:2px;
  background:var(--card);
}
.kitart__back{
  position:absolute; top:0; right:0; width:78%;
  transform:rotate(5deg);
  box-shadow:0 18px 40px -20px rgba(46,33,24,.4);
  opacity:.92;
}
.kitart__front{
  position:relative; width:88%;
  box-shadow:var(--shadow-cover);
}
.tools{ display:grid; gap:1px; background:var(--rule); border:1px solid var(--rule); }
.tool{ background:var(--card); padding:20px 22px; display:flex; gap:16px; align-items:flex-start; }
.tool__n{
  font-family:var(--serif); color:var(--gold); font-size:1.4rem; line-height:1; flex:0 0 auto; min-width:1.4em;
}
.tool h4{ font-family:var(--serif); font-size:1.05rem; color:var(--ink); margin:0 0 .3em; }
.tool p{ margin:0; font-size:.92rem; color:var(--ink-mute); }
@media (max-width:860px){ .bonus{ grid-template-columns:1fr; } }

/* ---------- Oferta ---------- */

.offer{
  background:var(--card);
  border:1px solid var(--rule);
  border-top:4px solid var(--gold);
  box-shadow:var(--shadow-card);
  border-radius:2px;
  overflow:hidden;
  max-width:660px;
  margin:0 auto;
}
.offer__head{ padding:clamp(28px,4vw,40px) clamp(24px,4vw,42px) 0; text-align:center; }
.offer__covers{
  display:flex; align-items:flex-end; justify-content:center; gap:14px;
  margin-bottom:clamp(20px,3vw,28px);
}
.offer__covers img{
  border:1px solid var(--rule); border-radius:2px;
  box-shadow:0 16px 30px -16px rgba(46,33,24,.45);
}
.offer__covers img:first-child{ width:104px; }
.offer__covers img:last-child{ width:84px; }
.offer__eyebrow{
  font-size:.64rem; letter-spacing:.22em; text-transform:uppercase; color:var(--ink-mute); font-weight:700; margin:0 0 1.2em;
}
.offer h3{ font-size:clamp(1.5rem,3vw,2rem); margin-bottom:.5em; }
.offer__desc{ font-size:.98rem; color:var(--ink-mid); margin-bottom:1.6em; }

.price{ display:flex; align-items:baseline; justify-content:center; gap:14px; margin-bottom:.4em; }
.price__now{ font-family:var(--serif); font-size:clamp(3rem,7vw,4.2rem); color:var(--action); line-height:1; }
.price__was{ font-family:var(--serif); font-size:1.6rem; color:var(--ink-mute); text-decoration:line-through; }
.price__tag{
  font-size:.66rem; letter-spacing:.2em; text-transform:uppercase; color:var(--gold); font-weight:700; text-align:center;
  margin:0 0 1.8em;
}

.stack{ list-style:none; margin:0; padding:0 clamp(24px,4vw,42px); }
.stack li{
  display:flex; gap:16px; align-items:baseline; justify-content:space-between;
  padding:.95em 0; border-bottom:1px solid var(--rule); font-size:.95rem; color:var(--ink-mid);
}
.stack li span:first-child{ flex:1; }
.stack__val{ font-family:var(--serif); color:var(--ink-mute); white-space:nowrap; font-size:1rem; }
.stack li.total{ font-weight:700; color:var(--ink); border-bottom:1px solid var(--rule); }
.stack li.pay{
  border-bottom:0; font-weight:700; color:var(--action); font-size:1.05rem;
}
.stack li.pay .stack__val{ color:var(--action); font-size:1.35rem; }

.offer__foot{ padding:clamp(22px,3vw,32px) clamp(24px,4vw,42px) clamp(28px,4vw,40px); }
.paylogos{
  display:flex; gap:14px; justify-content:center; flex-wrap:wrap;
  font-size:.62rem; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-mute);
  margin-top:1.4em; padding-top:1.2em; border-top:1px solid var(--rule);
}

/* ---------- Promesa: acceso instantáneo · pago único · para siempre ---------- */

.promise{
  display:grid; grid-template-columns:repeat(3,1fr); gap:1px;
  background:var(--gold-soft); border:1px solid var(--gold-soft);
  max-width:900px; margin:0 auto; border-radius:2px; overflow:hidden;
}
.promise__item{ background:var(--gold-wash); padding:clamp(24px,3vw,32px); text-align:center; }
.promise__icon{
  display:block; font-size:1.5rem; color:var(--gold); line-height:1; margin-bottom:.6em;
}
.promise__item h3{
  font-size:1.08rem; margin-bottom:.45em;
  font-family:var(--sans); font-weight:700; letter-spacing:.05em; text-transform:uppercase;
}
.promise__item p{ margin:0; font-size:.93rem; color:var(--ink-mid); }
@media (max-width:760px){ .promise{ grid-template-columns:1fr; } }

/* ---------- Prueba social del canal ---------- */

.proof{
  display:grid; grid-template-columns:repeat(4,1fr); gap:1px;
  background:var(--rule); border:1px solid var(--rule);
}
.proof__item{ background:var(--card); padding:clamp(22px,3vw,32px) 14px; text-align:center; }
.proof__item b{
  display:block; font-family:var(--serif); font-size:clamp(1.5rem,3.2vw,2.2rem);
  color:var(--ink); line-height:1;
}
.proof__item span{
  display:block; margin-top:.7em;
  font-size:.63rem; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-mute);
}
.proof__note{
  text-align:center; margin:1.4em 0 0;
  font-size:.72rem; letter-spacing:.08em; color:var(--ink-mute);
}
@media (max-width:720px){ .proof{ grid-template-columns:repeat(2,1fr); } }

/* ---------- Testimonios ---------- */

.quotes{ display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:clamp(20px,3vw,32px); }
.quote{
  background:var(--card); border:1px solid var(--rule); padding:clamp(24px,3vw,32px); border-radius:2px;
}
.quote__stars{ color:var(--gold); letter-spacing:.2em; font-size:.85rem; margin-bottom:1em; }
.quote p{ font-size:.98rem; color:var(--ink-mid); font-style:italic; }
.quote footer{
  font-size:.68rem; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-mute); margin-top:1.2em;
}

/* ---------- Autor ---------- */

.author{ display:grid; grid-template-columns:.85fr 1.15fr; gap:clamp(28px,4vw,60px); align-items:center; }
.author__mark{
  aspect-ratio:1; border:1px solid rgba(220,182,114,.35); border-radius:2px;
  display:grid; place-items:center; text-align:center; padding:30px;
  background:linear-gradient(160deg, rgba(192,143,60,.14), rgba(107,74,47,.06));
}
.author__mark b{ font-family:var(--serif); font-size:clamp(1.8rem,4vw,2.6rem); letter-spacing:.16em; color:var(--paper); display:block; }
.author__mark span{ font-size:.62rem; letter-spacing:.24em; text-transform:uppercase; color:var(--gold-soft); display:block; margin-top:.9em; }
@media (max-width:860px){ .author{ grid-template-columns:1fr; } }

/* ---------- FAQ ---------- */

.faq{ max-width:820px; margin:0 auto; border-top:1px solid var(--rule); }
.faq details{ border-bottom:1px solid var(--rule); }
.faq summary{
  cursor:pointer; list-style:none; padding:1.35em 2.4em 1.35em 0; position:relative;
  font-family:var(--serif); font-size:1.12rem; color:var(--ink); font-weight:600;
}
.faq summary::-webkit-details-marker{ display:none; }
.faq summary::after{
  content:'+'; position:absolute; right:.2em; top:50%; transform:translateY(-50%);
  font-family:var(--sans); font-size:1.4rem; color:var(--gold); font-weight:400; transition:transform .2s ease;
}
.faq details[open] summary::after{ content:'−'; }
.faq details > div{ padding:0 0 1.5em; color:var(--ink-mid); font-size:.99rem; }
.faq details > div p:last-child{ margin-bottom:0; }
.faq ol{ margin:.6em 0 0; padding-left:1.3em; }
.faq li{ margin-bottom:.4em; }

/* ---------- Cierre ---------- */

.finale{ text-align:center; }
.finale h2{ max-width:16ch; margin-left:auto; margin-right:auto; }
.finale .lede{ max-width:56ch; margin-left:auto; margin-right:auto; margin-bottom:2em; }
.finale__bonus{
  margin:1.6em auto 0; max-width:46ch;
  font-size:.95rem; color:var(--ink-mid);
  border-top:1px solid var(--rule); padding-top:1.4em;
}
.finale__bonus b{ color:var(--brown); }

/* ---------- Footer ---------- */

.footer{
  background:var(--ink); color:rgba(240,231,215,.62);
  padding:clamp(44px,5vw,64px) 0 clamp(28px,3vw,40px);
  font-size:.86rem;
}
.footer__top{
  display:flex; justify-content:space-between; gap:24px; flex-wrap:wrap; align-items:flex-start;
  padding-bottom:28px; border-bottom:1px solid rgba(220,205,180,.16); margin-bottom:24px;
}
.footer__brand b{ font-family:var(--serif); font-size:1.25rem; color:var(--paper); letter-spacing:.14em; display:block; }
.footer__brand span{ font-size:.64rem; letter-spacing:.22em; text-transform:uppercase; color:var(--gold-soft); }
.footer__brand p{ max-width:42ch; margin:1em 0 0; color:rgba(240,231,215,.55); font-size:.86rem; }
.footer__nav{ display:flex; gap:22px; flex-wrap:wrap; font-size:.68rem; letter-spacing:.16em; text-transform:uppercase; }
.footer__nav a{ color:rgba(240,231,215,.72); text-decoration:none; }
.footer__nav a:hover{ color:var(--gold-soft); }
.footer__legal{ font-size:.74rem; color:rgba(240,231,215,.42); line-height:1.6; }

/* =========================================================
   Barra fija móvil (CTA siempre a la vista)
   ========================================================= */

.stickybuy{
  position:fixed; left:0; right:0; bottom:0; z-index:45;
  background:var(--card);
  border-top:1px solid var(--rule);
  box-shadow:0 -8px 24px -12px rgba(46,33,24,.3);
  padding:10px 16px calc(10px + env(safe-area-inset-bottom));
  display:none; align-items:center; gap:10px;
  transform:translateY(110%);
  transition:transform .3s ease;
}
.stickybuy.is-in{ transform:translateY(0); }
.stickybuy__price{ flex:0 0 auto; }
.stickybuy__price b{ font-family:var(--serif); font-size:1.5rem; color:var(--action); display:block; line-height:1; }
.stickybuy__price s{ font-size:.78rem; color:var(--ink-mute); }
.stickybuy__bonus{
  flex:0 0 auto; font-size:.6rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase;
  color:var(--brown); background:var(--gold-wash); border:1px solid var(--gold-soft);
  padding:.35em .5em; border-radius:2px; white-space:nowrap; line-height:1.2;
}
@media (max-width:330px){ .stickybuy__bonus{ display:none; } }
.stickybuy .btn{ flex:1 1 0; min-width:0; padding:1em .8em; font-size:.72rem; letter-spacing:.08em; }
@media (max-width:820px){
  .stickybuy{ display:flex; }
  body{ padding-bottom:76px; }
}

/* =========================================================
   Modal de salida
   ========================================================= */

.modal[hidden]{ display:none !important; }
.modal{
  position:fixed; inset:0; z-index:100;
  background:rgba(30,21,15,.72);
  display:grid; place-items:center;
  padding:20px;
  animation:fade .25s ease;
}
@keyframes fade{ from{opacity:0} to{opacity:1} }
.modal__box{
  background:var(--card);
  border-top:4px solid var(--gold);
  border-radius:3px;
  box-shadow:var(--shadow-pop);
  max-width:760px; width:100%;
  display:grid; grid-template-columns:.8fr 1.2fr;
  overflow:hidden;
  animation:rise .3s cubic-bezier(.2,.8,.3,1);
  max-height:92vh;
}
@keyframes rise{ from{opacity:0; transform:translateY(18px) scale(.98)} to{opacity:1; transform:none} }
.modal__art{
  background:linear-gradient(160deg, var(--paper-warm), var(--paper-deep));
  display:grid; place-items:center; padding:28px; position:relative;
}
.modal__art img{
  width:100%; max-width:190px; border:1px solid var(--rule);
  box-shadow:var(--shadow-cover); border-radius:2px;
}
.modal__ribbon{
  position:absolute; top:16px; left:0;
  background:var(--action); color:#FDF8F0;
  font-size:.6rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase;
  padding:.5em .9em; border-radius:0 2px 2px 0;
  box-shadow:0 8px 18px -10px rgba(140,47,30,.8);
}
.modal__price{
  margin:0 0 1.3em; padding:.75em 1em;
  background:var(--gold-wash); border:1px solid var(--gold-soft); border-radius:2px;
  font-size:.9rem; color:var(--ink-soft); text-align:center;
}
.modal__price b{ color:var(--action); font-size:1.05rem; }
.modal__body{ padding:clamp(26px,3.4vw,40px); overflow:auto; }
.modal__body .eyebrow{ color:var(--action); }
.modal__body h3{ font-size:clamp(1.4rem,3vw,1.9rem); margin-bottom:.5em; }
.modal__body p{ font-size:.98rem; color:var(--ink-mid); }
.modal__close{
  position:absolute; top:14px; right:16px;
  background:none; border:0; font-size:1.9rem; line-height:1; color:var(--ink-mute); cursor:pointer; padding:4px 10px;
}
.modal__close:hover{ color:var(--ink); }
.modal__box{ position:relative; }
.modal__second{
  display:block; margin-top:1.2em; text-align:center;
  font-size:.72rem; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-mute); text-decoration:underline;
}
@media (max-width:700px){
  .modal__box{ grid-template-columns:1fr; }
  .modal__art{ padding:22px; }
  .modal__art img{ max-width:130px; }
}

/* =========================================================
   Animación de entrada
   ========================================================= */

.reveal{ opacity:0; transform:translateY(22px); transition:opacity .7s ease, transform .7s cubic-bezier(.2,.7,.3,1); }
.reveal.is-in{ opacity:1; transform:none; }

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{ animation-duration:.01ms !important; transition-duration:.01ms !important; scroll-behavior:auto !important; }
  .reveal{ opacity:1; transform:none; }
}