/* Casa de Liberación — multi-page site styles (built on colors_and_type.css) */
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--ink-900);color:var(--fg-on-dark);font-family:var(--font-body);
  -webkit-font-smoothing:antialiased;overflow-x:hidden}
.ico{display:inline-flex;align-items:center;justify-content:center}
.ico svg{display:block}
.gold{color:var(--gold-500)}
a{color:inherit;text-decoration:none}
/* height:auto evita que los atributos width/height (anti-CLS) deformen
   las imágenes cuando el CSS solo fija el ancho */
img{max-width:100%;height:auto}
.wrap{max-width:var(--wrap-max,1200px);margin:0 auto;padding:0 40px}
.wrap--wide{max-width:1320px}

/* ---------- shared text ---------- */
.eyebrow{font-family:var(--font-display);font-weight:600;font-size:12.5px;letter-spacing:.16em;
  text-transform:uppercase;display:inline-block}
.eyebrow--cap{color:var(--gold-300);border:1.5px solid var(--hairline-gold);border-radius:999px;padding:8px 18px}
.eyebrow--out{color:var(--gold-700)}
.eyebrow--ondark{color:var(--gold-400)}
.h2{font-family:var(--font-display);font-weight:700;font-size:clamp(28px,4vw,44px);line-height:1.05;margin:14px 0 0;letter-spacing:-.01em;color:var(--fg-on-light)}
.h2--light{color:var(--fg-on-dark)}
.lead{font-size:17px;line-height:1.7;color:var(--fg-on-light-muted);max-width:46ch}
.lead--light{color:var(--fg-on-dark-muted)}
.scripture{font-family:var(--font-serif);font-style:italic;font-weight:500}
.scripture-ref{font-family:var(--font-display);font-weight:600;font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--gold-500)}
.diamond-rule{display:flex;align-items:center;gap:14px;color:var(--gold-500);margin:26px 0;max-width:420px}
.diamond-rule span{height:1px;background:var(--hairline-gold);flex:1}.diamond-rule i{font-style:normal;font-size:13px}

/* ---------- buttons ---------- */
.btn{font-family:var(--font-display);font-weight:700;font-size:15px;letter-spacing:.02em;border-radius:999px;
  padding:14px 26px;border:none;cursor:pointer;display:inline-flex;gap:9px;align-items:center;justify-content:center;
  transition:transform .12s ease, filter .15s ease, box-shadow .2s ease, background .2s ease}
.btn--sm{padding:10px 18px;font-size:13.5px}
.btn--lg{padding:17px 34px;font-size:17px}
.btn--block{width:100%}
.btn--gold{background:var(--grad-gold);color:var(--on-grad-gold,#231b06);box-shadow:var(--glow-gold-sm)}
.btn--gold:hover{filter:brightness(1.07);box-shadow:var(--glow-gold)}
.btn--gold:active{transform:scale(.98)}
.btn--ghost{background:transparent;color:var(--gold-300);border:1.5px solid var(--hairline-gold)}
.btn--ghost:hover{background:rgba(203,164,55,.1)}
.btn--paper{background:var(--paper-50);color:var(--fg-on-light)}
.btn--paper:hover{background:#fff;transform:translateY(-1px)}
.btn--line{background:rgba(255,255,255,.05);color:var(--fg-on-dark);border:1.5px solid var(--border-on-dark-soft)}
.btn--line:hover{border-color:var(--hairline-gold);background:rgba(203,164,55,.09)}
.btn--dark{background:var(--ink-800);color:var(--fg-on-dark);border:1.5px solid var(--border-on-dark-soft)}
.btn--dark:hover{border-color:var(--hairline-gold)}

/* ---------- nav ---------- */
.nav{position:fixed;top:0;left:0;right:0;z-index:50;display:flex;align-items:center;gap:20px;
  padding:24px 40px;transition:padding .28s ease, background .28s ease, border-color .28s ease, box-shadow .28s ease}
.nav--scrolled{background:rgba(7,10,22,.8);backdrop-filter:blur(18px);border-bottom:1px solid var(--border-on-dark-soft);
  padding:14px 40px;box-shadow:0 12px 34px rgba(0,0,0,.4)}
.nav__brand{display:flex;align-items:center;gap:11px;flex:none}
.nav__mark{height:44px;width:auto}
.nav__name{font-family:var(--font-display);font-weight:800;font-size:16px;line-height:1.06;letter-spacing:-.01em}
.nav__name b{display:block;font-weight:800}
.nav__pill{margin:0 auto;display:flex;align-items:center;gap:28px;background:rgba(20,26,56,.4);backdrop-filter:blur(14px);
  border:1px solid var(--border-on-dark-soft);border-radius:999px;padding:13px 30px;transition:background .28s ease}
.nav--scrolled .nav__pill{background:rgba(20,26,56,.2)}
.nav__pill a{font-family:var(--font-body);font-size:15px;color:var(--fg-on-dark-muted);font-weight:500;transition:.15s;position:relative;white-space:nowrap}
.nav__pill a:hover{color:var(--gold-300)}
.nav__pill a.is-active{color:var(--gold-300)}
.nav__pill a.is-active::after{content:"";position:absolute;left:0;right:0;bottom:-7px;height:2px;border-radius:2px;background:var(--gold-500)}
.nav__right{display:flex;align-items:center;gap:13px;flex:none}
.nav__radio{display:inline-flex;align-items:center;gap:9px;background:rgba(20,26,56,.4);backdrop-filter:blur(14px);
  border:1px solid var(--border-on-dark-soft);border-radius:999px;padding:11px 18px;cursor:pointer;color:var(--fg-on-dark);
  font-family:var(--font-display);font-weight:600;font-size:13.5px;letter-spacing:.005em;transition:.18s}
.nav__radio:hover{border-color:var(--hairline-gold);background:rgba(20,26,56,.66)}
.nav__radio.is-live{border-color:var(--hairline-gold);box-shadow:var(--glow-gold-sm)}
.lang{background:rgba(20,26,56,.4);border:1px solid var(--border-on-dark-soft);border-radius:999px;padding:10px 14px;
  color:var(--fg-on-dark-faint);font-family:var(--font-display);font-weight:600;font-size:12.5px;cursor:pointer;letter-spacing:.05em;backdrop-filter:blur(14px)}
.lang .on{color:var(--gold-400)}.lang .sep{margin:0 6px;opacity:.45}
.nav__burger{display:none;background:rgba(20,26,56,.4);border:1px solid var(--border-on-dark-soft);border-radius:12px;
  width:44px;height:44px;color:var(--fg-on-dark);cursor:pointer;align-items:center;justify-content:center}
/* mobile drawer */
.drawer{position:fixed;inset:0;z-index:70;background:rgba(7,10,22,.97);backdrop-filter:blur(10px);
  display:flex;flex-direction:column;padding:90px 32px 40px;gap:6px;transform:translateY(-100%);transition:transform .35s cubic-bezier(.2,.8,.2,1);visibility:hidden}
.drawer.is-open{transform:translateY(0);visibility:visible}
.drawer a{font-family:var(--font-display);font-weight:600;font-size:24px;padding:14px 4px;border-bottom:1px solid var(--border-on-dark-soft);color:var(--fg-on-dark)}
.drawer a.is-active{color:var(--gold-300)}
.drawer__close{position:absolute;top:24px;right:24px;background:none;border:none;color:var(--fg-on-dark);cursor:pointer}

/* ---------- live dot / equalizer ---------- */
.livedot{width:9px;height:9px;border-radius:50%;background:var(--wine-400);flex:none;animation:livepulse 1.9s ease-in-out infinite}
@keyframes livepulse{0%,100%{box-shadow:0 0 0 0 rgba(179,78,126,.55)}50%{box-shadow:0 0 0 5px rgba(179,78,126,0)}}
.eq{display:flex;align-items:flex-end;gap:3px;height:22px}
.eq span{width:3.5px;background:var(--gold-400);border-radius:2px;height:7px;animation:bar 1s ease-in-out infinite}
.eq span:nth-child(2){animation-delay:.2s}.eq span:nth-child(3){animation-delay:.4s}.eq span:nth-child(4){animation-delay:.1s}.eq span:nth-child(5){animation-delay:.3s}
@keyframes bar{0%,100%{height:6px}50%{height:22px}}
.eq.is-paused span{animation:none;height:5px}
.is-editing:focus{outline:2px solid var(--gold-500);background:rgba(203,164,55,.08)}

/* ---------- floating radio bar ---------- */
.radiobar{position:fixed;bottom:24px;left:50%;z-index:60;display:flex;align-items:center;gap:16px;
  background:rgba(7,10,22,.86);backdrop-filter:blur(18px);border:1px solid var(--border-on-dark-soft);border-radius:999px;
  padding:11px 22px 11px 11px;box-shadow:var(--shadow-dark);
  transform:translate(-50%,0);opacity:1;transition:transform .4s cubic-bezier(.2,.8,.2,1), opacity .35s ease}
.radiobar.is-hidden{transform:translate(-50%,160%);opacity:0;pointer-events:none}
.radiobar__play{width:48px;height:48px;flex:none;border-radius:50%;border:1.5px solid var(--hairline-gold);background:transparent;
  color:var(--gold-300);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:.18s}
.radiobar__play:hover{background:var(--grad-gold);color:#231b06;border-color:transparent}
.radiobar__now{display:flex;flex-direction:column;line-height:1.3;padding-right:2px}
.radiobar__live{display:inline-flex;align-items:center;gap:7px;color:var(--gold-400);font-family:var(--font-display);
  font-weight:700;font-size:11.5px;letter-spacing:.12em;text-transform:uppercase}
.radiobar__live b{color:var(--fg-on-dark);font-weight:600;letter-spacing:0;text-transform:none;font-size:14px;margin-left:3px}
.radiobar__now span{font-size:12px;color:var(--fg-on-dark-muted);max-width:250px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.radiobar__x{background:transparent;color:var(--fg-on-dark-faint);border:none;width:30px;height:30px;cursor:pointer;display:flex;align-items:center;justify-content:center;border-radius:50%}
.radiobar__x:hover{color:var(--fg-on-dark);background:rgba(255,255,255,.06)}

/* ---------- HOME hero ---------- */
.hero{position:relative;min-height:100vh;overflow:hidden;display:flex}
.hero__bg{position:absolute;inset:0;z-index:0}
.hero__bg img{width:100%;height:100%;object-fit:cover;object-position:62% center}
.hero__scrim{position:absolute;inset:0;z-index:1;opacity:var(--hero-scrim,1);background:
  linear-gradient(95deg, rgba(7,10,22,.95) 0%, rgba(7,10,22,.78) 34%, rgba(7,10,22,.38) 66%, rgba(10,8,18,.55) 100%),
  linear-gradient(180deg, rgba(7,10,22,.55) 0%, rgba(7,10,22,0) 20%, rgba(7,10,22,0) 52%, rgba(7,10,22,.9) 100%)}
.hero__glow{position:absolute;top:-14%;left:-10%;width:720px;height:720px;border-radius:50%;z-index:1;
  background:radial-gradient(circle, rgba(203,164,55,.16), transparent 62%);filter:blur(22px);pointer-events:none}
.hero__wrap{position:relative;z-index:2;width:100%;max-width:1440px;margin:0 auto;padding:152px 48px 44px;
  display:flex;flex-direction:column;min-height:100vh}
.hero__kicker{font-family:var(--font-serif);font-style:italic;font-weight:500;font-size:clamp(19px,1.9vw,26px);
  color:var(--gold-200);margin:0;opacity:.92}
.hero__headline{font-family:var(--font-display);font-weight:800;letter-spacing:-.022em;line-height:.96;
  font-size:clamp(48px, 9.4vw, 132px);margin:26px 0 0;max-width:15ch;text-wrap:balance;color:var(--fg-on-dark)}
.hero__headline .mut{color:rgba(246,243,234,.5);white-space:nowrap}
.hero__headline .em{font-family:var(--font-serif);font-style:italic;font-weight:600;color:var(--gold-400);letter-spacing:0}
.hero__rot{display:block;transition:opacity .4s ease,transform .4s ease}
.hero__rot.is-swapping{opacity:0;transform:translateY(-12px)}
.hero__rest{display:block;font-size:.78em;line-height:1.04;margin-top:.1em;letter-spacing:-.012em}
.hero__rest .rest2{white-space:nowrap}
@keyframes rotin{0%{opacity:0;filter:blur(9px);transform:translateY(.1em)}45%{opacity:1;filter:blur(0)}100%{opacity:1;filter:blur(0);transform:none}}
.hero__foot{display:flex;align-items:flex-end;justify-content:space-between;gap:40px;flex-wrap:wrap;margin-top:auto;padding-top:48px}
.hero__lead{max-width:62ch}
.hero__lead p{font-size:16.5px;line-height:1.6;color:var(--fg-on-dark-muted);margin:0 0 24px;text-wrap:balance}
.hero__cta{display:flex;gap:13px;flex-wrap:wrap}

/* in-hero radio capsule */
.heroradio{display:flex;align-items:center;gap:16px;background:rgba(7,10,22,.5);backdrop-filter:blur(16px);
  border:1px solid var(--border-on-dark-soft);border-radius:999px;padding:12px 26px 12px 12px;cursor:pointer;
  text-align:left;transition:.2s;box-shadow:var(--shadow-dark)}
.heroradio:hover{border-color:var(--hairline-gold);background:rgba(7,10,22,.7)}
.heroradio__play{width:56px;height:56px;flex:none;border-radius:50%;border:1.5px solid var(--hairline-gold);
  background:transparent;color:var(--gold-300);display:flex;align-items:center;justify-content:center;transition:.18s}
.heroradio:hover .heroradio__play{background:var(--grad-gold);color:#231b06;border-color:transparent}
.heroradio__txt{display:flex;flex-direction:column;gap:3px;padding-right:4px}
.heroradio__top{display:flex;align-items:center;gap:11px;font-family:var(--font-display);font-size:15px;white-space:nowrap}
.heroradio__live{display:inline-flex;align-items:center;gap:7px;color:var(--gold-400);font-weight:700;font-size:12.5px;letter-spacing:.11em;text-transform:uppercase}
.heroradio__name{color:var(--fg-on-dark);font-weight:600}
.heroradio__sub{font-size:13px;color:var(--fg-on-dark-muted)}
.heroradio__eq{margin-left:6px}

/* ---------- INTERIOR page hero ---------- */
.pagehero{position:relative;padding:170px 0 64px;overflow:hidden;background:var(--grad-midnight)}
.pagehero--photo{padding:0}
.pagehero__inner{position:relative;z-index:2;max-width:1200px;margin:0 auto;padding:0 40px}
.pagehero__glow{position:absolute;top:-30%;right:-8%;width:640px;height:640px;border-radius:50%;z-index:1;
  background:radial-gradient(circle,rgba(203,164,55,.14),transparent 62%);filter:blur(24px);pointer-events:none}
.pagehero__crumb{font-family:var(--font-display);font-weight:600;font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--fg-on-dark-faint);display:flex;gap:10px;align-items:center}
.pagehero__crumb .gold{color:var(--gold-400)}
.pagehero__title{font-family:var(--font-display);font-weight:800;letter-spacing:-.02em;line-height:1.04;
  font-size:clamp(44px,7vw,92px);margin:22px 0 0;color:var(--fg-on-dark);max-width:16ch;text-wrap:balance}
.pagehero__title .em{font-family:var(--font-serif);font-style:italic;font-weight:600;color:var(--gold-400);letter-spacing:0}
.pagehero__sub{font-size:18px;line-height:1.65;color:var(--fg-on-dark-muted);max-width:56ch;margin:22px 0 0}

/* split page-hero with portrait */
.pagehero--split .pagehero__inner{display:grid;grid-template-columns:1.15fr .85fr;gap:56px;align-items:center}
.pagehero__portrait{position:relative}
.pagehero__portrait img{width:100%;border-radius:24px;box-shadow:var(--shadow-dark);display:block;aspect-ratio:4/5;object-fit:cover;object-position:center 22%}
/* Badge del icono: flotante y transparente (como en header/footer),
   anulando el recorte que hereda de las reglas img del retrato */
.pagehero__badge{position:absolute;left:-12px;bottom:-12px;display:flex;align-items:center;justify-content:center}
.pagehero__badge img{width:54px;height:auto;aspect-ratio:auto;object-fit:contain;border-radius:0;box-shadow:none;
  filter:drop-shadow(0 3px 8px rgba(0,0,0,.28))}

/* ---------- section scaffolding ---------- */
.section{padding:var(--section-pad,96px) 0}
.section--dark{background:var(--ink-900)}
.section--ink{background:var(--ink-950)}
.section--paper{background:var(--paper-50);color:var(--fg-on-light)}
.section--grad{background:var(--grad-midnight)}
.section-head{max-width:680px;margin:0 0 48px}
.section-head--center{margin-left:auto;margin-right:auto;text-align:center}

/* ---------- verse band ---------- */
.verseband{background:var(--ink-950);text-align:center;padding:74px 30px;border-top:1px solid var(--border-on-dark);border-bottom:1px solid var(--border-on-dark)}
.verseband__star{color:var(--gold-500);letter-spacing:.5em;margin-bottom:16px}
.verseband .scripture{font-size:clamp(24px,3.4vw,38px);line-height:1.3;max-width:820px;margin:0 auto;color:var(--fg-on-dark)}
.verseband .scripture-ref{margin-top:18px}

/* ---------- pillars (3-up) ---------- */
.pillars{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.pillar{background:rgba(255,255,255,.025);border:1px solid var(--border-on-dark-soft);border-radius:20px;padding:34px 30px;transition:transform .18s ease,border-color .2s}
.pillar:hover{transform:translateY(-4px);border-color:var(--hairline-gold)}
.pillar__circ{width:54px;height:54px;border-radius:999px;border:1.6px solid var(--hairline-gold);display:flex;align-items:center;justify-content:center;color:var(--gold-400);margin-bottom:20px}
.pillar__t{font-family:var(--font-display);font-weight:700;font-size:21px;margin:0 0 8px;color:var(--fg-on-dark)}
.pillar__d{font-size:15px;line-height:1.6;color:var(--fg-on-dark-muted);margin:0}

/* ---------- teaser split (home about / books strip) ---------- */
.split{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center}
.split--photo-left .split__media{order:-1}
.split__media img{width:100%;border-radius:24px;box-shadow:var(--shadow-dark);display:block}
.split__media{position:relative}
.split__badge{position:absolute;right:-12px;bottom:-12px;display:flex;align-items:center;justify-content:center}
.split__badge img{width:50px;height:auto;aspect-ratio:auto;object-fit:contain;border-radius:0;box-shadow:none;
  filter:drop-shadow(0 3px 8px rgba(0,0,0,.28))}
.split__pillars{margin-top:24px;font-family:var(--font-display);font-weight:600;letter-spacing:.08em;color:var(--gold-400);font-size:15px}

/* ---------- services / cards ---------- */
.svcgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.svcgrid--5{grid-template-columns:repeat(5,1fr);gap:18px}
.svc{background:#fff;border-radius:18px;padding:30px 26px;box-shadow:var(--shadow-light-sm);transition:transform .18s ease,box-shadow .2s;display:flex;flex-direction:column}
.svc--dark{background:rgba(255,255,255,.025);border:1px solid var(--border-on-dark-soft);box-shadow:none}
.svc:hover{transform:translateY(-4px);box-shadow:var(--shadow-light)}
.svc--dark:hover{box-shadow:none;border-color:var(--hairline-gold)}
.svc__circ{width:54px;height:54px;border-radius:999px;border:1.6px solid var(--gold-500);display:flex;align-items:center;justify-content:center;color:var(--gold-600);margin-bottom:18px}
.svc--dark .svc__circ{border-color:var(--hairline-gold);color:var(--gold-400)}
.svc__t{font-family:var(--font-display);font-weight:700;font-size:19px;margin:0 0 8px;color:var(--fg-on-light)}
.svc--dark .svc__t{color:var(--fg-on-dark)}
.svc__d{font-size:14.5px;line-height:1.6;color:var(--fg-on-light-muted);margin:0 0 16px}
.svc--dark .svc__d{color:var(--fg-on-dark-muted)}
.svc__meta{margin-top:auto;display:flex;align-items:center;gap:8px;font-family:var(--font-display);font-weight:600;font-size:12.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--gold-600)}
.svc--dark .svc__meta{color:var(--gold-400)}

/* ---------- formats / steps ---------- */
.formats{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
.format{display:flex;gap:18px;align-items:flex-start;background:rgba(255,255,255,.025);border:1px solid var(--border-on-dark-soft);border-radius:18px;padding:26px}
.format__circ{width:48px;height:48px;flex:none;border-radius:14px;background:rgba(203,164,55,.12);border:1px solid var(--hairline-gold);display:flex;align-items:center;justify-content:center;color:var(--gold-400)}
.format__t{font-family:var(--font-display);font-weight:700;font-size:18px;margin:0 0 6px;color:var(--fg-on-dark)}
.format__d{font-size:14.5px;line-height:1.6;color:var(--fg-on-dark-muted);margin:0}

/* ---------- ciclo de conferencias (talleres detail) ---------- */
/* ---------- Ciclo de conferencias (panel izq. + tarjetas der.) ---------- */
.ciclo{display:flex;flex-direction:column;gap:26px}
.cyc{display:grid;grid-template-columns:minmax(0,0.92fr) minmax(0,1.25fr);gap:40px;align-items:center;
  background:linear-gradient(180deg,#fff,#FBFAF5);border:1px solid var(--border-on-light);border-radius:26px;
  padding:42px;box-shadow:var(--shadow-light)}
.cyc--carousel{border-color:var(--hairline-gold);box-shadow:var(--glow-gold-sm),var(--shadow-light)}
.cyc__title{font-family:var(--font-display);font-weight:800;font-size:clamp(26px,3vw,34px);line-height:1.08;letter-spacing:-.01em;color:var(--fg-on-light);margin:0}
.cyc__desc{font-size:15.5px;line-height:1.7;color:var(--fg-on-light-muted);margin:18px 0 0;max-width:44ch}
.cyc__meta{display:flex;align-items:center;gap:9px;margin:22px 0 0;font-family:var(--font-display);font-weight:600;font-size:12.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--gold-700)}
.cyc__meta .ico{color:var(--gold-600)}
.cyc__cta{margin-top:24px}
.cyc__main{min-width:0}
.cyc__viewport{overflow:hidden}
.cyc__track{display:flex;transition:transform .45s cubic-bezier(.2,.8,.2,1)}
.cyc__page{flex:0 0 100%;display:grid;grid-template-columns:1fr 1fr;gap:14px;align-content:start}
.cyc__card{background:#fff;border:1px solid var(--border-on-light);border-radius:16px;padding:18px 18px 20px;transition:transform .16s ease,box-shadow .2s ease,border-color .2s ease}
.cyc__card:hover{border-color:var(--hairline-gold);box-shadow:var(--shadow-light-sm)}
.cyc__num{font-family:var(--font-serif);font-style:italic;font-weight:600;font-size:22px;color:var(--gold-600);display:block;line-height:1;margin-bottom:8px}
.cyc__t{font-family:var(--font-display);font-weight:700;font-size:16px;line-height:1.2;color:var(--fg-on-light);margin:0 0 6px}
.cyc__d{font-size:13px;line-height:1.55;color:var(--fg-on-light-muted);margin:0;text-wrap:pretty}
.cyc__nav{display:flex;align-items:center;gap:14px;margin-top:22px}
.cyc__arrow{width:42px;height:42px;border-radius:50%;border:1px solid var(--border-on-light);background:#fff;color:var(--gold-700);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:.18s}
.cyc__arrow:hover:not(:disabled){border-color:var(--hairline-gold);background:rgba(203,164,55,.1)}
.cyc__arrow:disabled{opacity:.38;cursor:default}
.cyc__dots{display:flex;gap:7px;margin-left:2px}
.cyc__dots span{width:8px;height:8px;border-radius:99px;background:rgba(66,62,55,.22);transition:.25s}
.cyc__dots span.is-active{width:22px;background:var(--gold-500)}
.cyc__count{margin-left:auto;font-family:var(--font-display);font-weight:600;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--fg-on-light-muted)}
.cyc__list{display:flex;flex-direction:column;gap:12px}
.cyc__card--row{display:flex;gap:16px;align-items:flex-start}
.cyc__card--row .cyc__num{margin-bottom:0;flex:none;min-width:1.5em;padding-top:2px}
@media(max-width:860px){
  .cyc{grid-template-columns:1fr;gap:26px;padding:28px}
  .cyc__page{gap:10px}
}
@media(max-width:460px){
  .cyc__page{grid-template-columns:1fr}
}
.ciclo-note{display:flex;align-items:center;gap:20px;flex-wrap:wrap;margin-top:52px;
  background:var(--grad-midnight);border:1px solid var(--border-on-dark);border-radius:20px;padding:24px 30px;box-shadow:var(--glow-gold-sm)}
.ciclo-note .ico{color:var(--gold-400);flex:none}
.ciclo-note p{flex:1;min-width:260px;margin:0;font-family:var(--font-serif);font-style:italic;
  font-size:18px;line-height:1.5;color:var(--fg-on-dark)}
.ciclo-note .btn{flex:none}

/* ---------- prédicas / themes ---------- */
.themes{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.theme{background:rgba(255,255,255,.025);border:1px solid var(--border-on-dark-soft);border-radius:20px;padding:30px;transition:transform .18s ease,border-color .2s;display:flex;flex-direction:column}
.theme:hover{transform:translateY(-4px);border-color:var(--hairline-gold)}
.theme__no{font-family:var(--font-serif);font-style:italic;font-size:30px;color:var(--gold-500);line-height:1}
.theme__t{font-family:var(--font-display);font-weight:700;font-size:21px;margin:16px 0 8px;color:var(--fg-on-dark)}
.theme__ref{font-family:var(--font-serif);font-style:italic;font-size:16px;color:var(--gold-300);margin:0 0 12px}
.theme__d{font-size:14.5px;line-height:1.6;color:var(--fg-on-dark-muted);margin:0}
/* light-surface variant of the theme cards */
.section--paper .theme{background:#fff;border-color:var(--border-on-light);box-shadow:var(--shadow-light-sm)}
.section--paper .theme:hover{border-color:var(--gold-500);box-shadow:var(--shadow-light)}
.section--paper .theme__t{color:var(--fg-on-light)}
.section--paper .theme__ref{color:var(--gold-700)}
.section--paper .theme__d{color:var(--fg-on-light-muted)}
.section--paper .btn--ghost{color:var(--gold-700);border-color:var(--border-on-light)}
.section--paper .btn--ghost:hover{background:rgba(203,164,55,.12)}

/* radio promo */
.radiopromo{position:relative;background:var(--ink-950);text-align:center;padding:100px 40px;overflow:hidden}
.radiopromo__glow{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:560px;height:560px;border-radius:50%;
  background:radial-gradient(circle,rgba(158,42,99,.22),transparent 60%);filter:blur(20px)}
.radiopromo__inner{position:relative;z-index:2;max-width:640px;margin:0 auto;display:flex;flex-direction:column;align-items:center}
.radiopromo__mic{width:72px;height:72px;border-radius:50%;border:1.6px solid var(--hairline-gold);display:flex;align-items:center;justify-content:center;color:var(--gold-400);margin-bottom:24px;box-shadow:var(--glow-gold-sm)}
.radiopromo__body{font-size:17px;color:var(--fg-on-dark-muted);line-height:1.6;margin:14px 0 30px}

/* ---------- books ---------- */
.bookgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px}
.book{display:flex;flex-direction:column;align-items:center;text-align:center}
/* Los mockups de libros traen fondo transparente y sombra propia:
   sin caja, sin recorte (la proporción 4/5 coincide con la imagen) */
.book__imgwrap{width:100%;max-width:188px;aspect-ratio:4/5;display:flex;align-items:center;justify-content:center;margin:0 auto 18px;transition:transform .2s}
.book:hover .book__imgwrap{transform:translateY(-6px)}
.book__imgwrap img{width:100%;height:100%;object-fit:contain}
.book__t{font-family:var(--font-display);font-weight:700;font-size:17px;margin:0 0 4px;color:var(--fg-on-dark)}
.book__s{font-size:12.5px;color:var(--gold-300);letter-spacing:.04em}

/* book detail rows */
.bookdetail{display:grid;grid-template-columns:.85fr 1.15fr;gap:48px;align-items:center;padding:44px 0;border-bottom:1px solid var(--border-on-dark-soft)}
.bookdetail:last-child{border-bottom:none}
.bookdetail--flip .bookdetail__media{order:2}
.bookdetail__media{max-width:205px;margin:0 auto;width:100%}
.bookdetail__media img{width:100%;height:auto;display:block}
.bookdetail__lang{font-family:var(--font-display);font-weight:600;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-400)}
.bookdetail__t{font-family:var(--font-display);font-weight:800;font-size:clamp(26px,3.4vw,38px);line-height:1.05;margin:12px 0 4px;color:var(--fg-on-dark)}
.bookdetail__sub{font-family:var(--font-serif);font-style:italic;font-size:19px;color:var(--gold-300);margin:0 0 18px}
.bookdetail__body{font-size:16px;line-height:1.7;color:var(--fg-on-dark-muted);margin:0 0 24px;max-width:54ch}

/* ---------- about / pastor bio ---------- */
.prose{max-width:62ch}
.prose p{font-size:17px;line-height:1.75;color:var(--fg-on-dark-muted);margin:0 0 20px}
.prose p .gold{color:var(--gold-300)}
/* Galería del pastor: cinta continua hacia la izquierda (ver initGallery).
   Sin snap ni scroll suave: el movimiento lo lleva requestAnimationFrame. */
.gallery{display:flex;gap:18px;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.gallery::-webkit-scrollbar{display:none}
.gallery img{flex:0 0 calc((100% - 36px)/3);width:calc((100% - 36px)/3);
  border-radius:16px;box-shadow:var(--shadow-dark);display:block;aspect-ratio:4/5;object-fit:cover;object-position:center 20%}
@media(max-width:860px){
  .gallery img{flex-basis:78%;width:78%}
}
.statrow{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:8px}
.stat{border-left:2px solid var(--hairline-gold);padding-left:20px}
.stat__n{font-family:var(--font-display);font-weight:800;font-size:36px;color:var(--gold-400);line-height:1}
.stat__l{font-size:14px;color:var(--fg-on-dark-muted);margin-top:8px}

/* ---------- contact ---------- */
.contactgrid{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:start}
.contact__list{list-style:none;padding:0;margin:28px 0 0;display:flex;flex-direction:column;gap:8px}
.contact__list li{display:flex;align-items:center;gap:14px;font-size:16px;color:var(--fg-on-dark);background:rgba(255,255,255,.025);border:1px solid var(--border-on-dark-soft);border-radius:14px;padding:16px 18px}
.contact__list .ico{color:var(--gold-400);flex:none}
.contact__list small{font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--fg-on-dark-faint);font-family:var(--font-display);font-weight:600}
.contact__list a,.contact__list li>div{display:flex;flex-direction:row;align-items:baseline;gap:10px;white-space:nowrap}
.fbf{font-family:var(--font-display);font-weight:800;font-size:16px;color:var(--gold-400);width:18px;height:18px;display:flex;align-items:center;justify-content:center}
.contact__form{display:flex;flex-direction:column;gap:16px;background:rgba(255,255,255,.03);border:1px solid var(--border-on-dark-soft);border-radius:22px;padding:32px}
.contact__form label{font-family:var(--font-display);font-weight:600;font-size:12.5px;letter-spacing:.04em;color:var(--fg-on-dark-muted);display:flex;flex-direction:column;gap:8px}
.field{display:flex;align-items:center;gap:10px;background:rgba(7,10,22,.5);border:1.5px solid var(--border-on-dark-soft);border-radius:12px;padding:13px 14px}
.field .ico{color:var(--gold-400);flex:none}
.field--area{align-items:flex-start}
.field input,.field textarea{border:none;background:none;outline:none;font-family:var(--font-body);font-size:15px;color:var(--fg-on-dark);width:100%;resize:none}
.field input::placeholder,.field textarea::placeholder{color:var(--fg-on-dark-faint)}
.field:focus-within{border-color:var(--gold-500);box-shadow:0 0 0 3px rgba(203,164,55,.18)}
.phone-row{display:flex;gap:10px}
.phone-row .field--num{flex:1}
.field--cc{flex:none;padding:0;position:relative}
.field--cc::after{content:"";position:absolute;right:13px;top:50%;width:8px;height:8px;border-right:1.5px solid var(--fg-on-dark-muted);border-bottom:1.5px solid var(--fg-on-dark-muted);transform:translateY(-65%) rotate(45deg);pointer-events:none}
.phone-cc{appearance:none;-webkit-appearance:none;background:none;border:none;outline:none;color:var(--fg-on-dark);font-family:var(--font-body);font-size:15px;line-height:1;padding:13px 32px 13px 14px;cursor:pointer}
.phone-cc option{background:var(--bg-dark);color:var(--fg-on-dark)}

/* hours / cta band */
.ctaband{background:var(--grad-midnight);text-align:center;padding:90px 40px;border-top:1px solid var(--border-on-dark)}

/* ---------- footer ---------- */
.footer{background:var(--ink-950);padding:64px 40px 36px;border-top:1px solid var(--border-on-dark);text-align:left}
.footer__top{max-width:1200px;margin:0 auto;display:flex;align-items:flex-start;justify-content:space-between;gap:48px;flex-wrap:wrap}
.footer__left{max-width:440px}
.footer__brand{display:flex;align-items:center;gap:14px;margin-bottom:22px}
.footer__mark{height:46px}
.footer__min{font-family:var(--font-display);font-weight:600;font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--fg-on-dark-muted)}
.footer__name{font-family:var(--font-display);font-weight:800;font-size:22px}
.footer__tag{font-size:20px;color:var(--gold-300);margin:0;white-space:nowrap}
.footer__right{display:flex;flex-direction:column;align-items:flex-start;gap:14px}
.footer__follow{font-family:var(--font-display);font-weight:600;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--fg-on-dark-faint)}
.footer__social{display:flex;gap:12px}
.footer__social a{width:46px;height:46px;border-radius:50%;border:1.5px solid var(--border-on-dark-soft);display:flex;align-items:center;justify-content:center;color:var(--gold-300);transition:.18s}
.footer__social a:hover{border-color:var(--hairline-gold);background:rgba(203,164,55,.1);color:var(--gold-200);transform:translateY(-2px)}
.footer__contact{display:flex;flex-direction:column;gap:4px;margin-top:6px}
.footer__contact a{font-size:14.5px;color:var(--fg-on-dark-muted)}
.footer__contact a:hover{color:var(--gold-300)}
.footer__bottom{max-width:1200px;margin:40px auto 0;display:flex;justify-content:space-between;gap:16px;padding-top:22px;border-top:1px solid var(--border-on-dark-soft);font-size:12.5px;color:var(--fg-on-dark-faint)}

/* ---------- video player (prédicas) ---------- */
.vsec{position:relative;overflow:hidden}
.vsec::before{content:"";position:absolute;left:50%;top:38%;width:720px;height:720px;transform:translate(-50%,-50%);background:radial-gradient(circle,rgba(203,164,55,.16),transparent 64%);pointer-events:none;z-index:0}
.vsec .wrap{position:relative;z-index:1}
.vplayer{display:grid;grid-template-columns:minmax(0,1fr) 344px;gap:20px;margin-top:46px;padding:18px;border-radius:24px;background:rgba(248,245,238,.055);border:1px solid rgba(203,164,55,.22);box-shadow:0 30px 90px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,255,255,.07);backdrop-filter:blur(26px) saturate(1.25);-webkit-backdrop-filter:blur(26px) saturate(1.25)}
.vplayer__main{display:flex;flex-direction:column;gap:13px;min-width:0}
.vstage{position:relative;aspect-ratio:16/9;border-radius:16px;overflow:hidden;background:#05070f;border:1px solid rgba(203,164,55,.16)}
.vstage iframe,.vstage__media{position:absolute;inset:0;width:100%;height:100%;border:0}
.vstage__big{position:absolute;left:50%;top:50%;z-index:2;transform:translate(-50%,-50%);width:80px;height:80px;border-radius:50%;border:1px solid rgba(203,164,55,.5);background:rgba(12,17,38,.42);color:var(--gold-300);display:grid;place-items:center;cursor:pointer;box-shadow:0 0 32px rgba(203,164,55,.32);backdrop-filter:blur(6px);transition:transform .2s,background .2s,box-shadow .2s}
.vstage__big .ico{margin-left:4px;display:grid;place-items:center}
.vstage__big:hover{background:rgba(12,17,38,.62);transform:translate(-50%,-50%) scale(1.06);box-shadow:0 0 46px rgba(203,164,55,.46)}
.vstage.is-playing .vstage__big{opacity:0;pointer-events:none}

/* Portada propia del video: oculta la UI de YouTube hasta reproducir */
.vcover{position:absolute;inset:0;z-index:3;border:0;padding:0;cursor:pointer;display:block;overflow:hidden;background:#05070f;text-align:left}
.vstage.is-playing .vcover{display:none}
.vcover__img{position:absolute;inset:0;background-size:cover;background-position:center}
.vcover__shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,10,22,.15),rgba(7,10,22,.5))}
.vcover__play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:74px;height:74px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#231b06;background:var(--grad-gold);box-shadow:0 0 36px rgba(203,164,55,.5);transition:transform .2s}
.vcover__play .ico{margin-left:4px;display:grid;place-items:center}
.vcover:hover .vcover__play{transform:translate(-50%,-50%) scale(1.07)}
.vcover__title{position:absolute;left:0;right:0;bottom:0;padding:16px 18px;font-family:var(--font-display);font-weight:700;font-size:16px;line-height:1.25;color:#F6F3EA;text-shadow:0 1px 5px rgba(0,0,0,.7)}
/* Opción B — portada de marca (sin la miniatura de YouTube) */
.vcover--brand .vcover__img{filter:blur(4px) saturate(.5) brightness(.4)}
.vcover--brand .vcover__shade{background:linear-gradient(135deg,rgba(26,34,73,.92),rgba(12,17,38,.96));opacity:1}
.vcover--brand .vcover__title{font-size:18px}

/* Pantalla completa nativa del video */
.vstage:fullscreen,.vstage:-webkit-full-screen{aspect-ratio:auto;width:100vw;height:100vh;border-radius:0;border:none}
.vstage:fullscreen iframe,.vstage:-webkit-full-screen iframe{width:100%;height:100%}

/* Pantalla completa por CSS (fallback universal: llena la ventana) */
.vstage.is-pseudofs{position:fixed;inset:0;z-index:9999;width:100vw;height:100vh;max-width:none;aspect-ratio:auto;border-radius:0;border:0;background:#000}
.vstage.is-pseudofs iframe,.vstage.is-pseudofs .vstage__media{width:100%;height:100%}
body.has-pseudofs{overflow:hidden}
/* el backdrop-filter de .vplayer crearía un bloque contenedor para position:fixed;
   se desactiva durante la pantalla completa por CSS para que el video llene la ventana */
body.has-pseudofs .vplayer{backdrop-filter:none;-webkit-backdrop-filter:none}
/* ocultar elementos fijos (nav, chat, barra de radio) durante la pantalla completa por CSS */
body.has-pseudofs .nav,body.has-pseudofs .chatwidget,body.has-pseudofs .radiobar,body.has-pseudofs .drawer{display:none!important}
.vfsexit{position:absolute;top:14px;right:14px;z-index:5;width:42px;height:42px;border-radius:50%;border:1px solid rgba(255,255,255,.28);background:rgba(7,10,22,.55);color:#fff;display:none;align-items:center;justify-content:center;cursor:pointer;backdrop-filter:blur(6px);transition:background .18s}
.vfsexit:hover{background:rgba(7,10,22,.8)}
.vstage.is-pseudofs .vfsexit{display:flex}
.vtitle{font-family:var(--font-display);font-weight:600;font-size:20px;line-height:1.28;color:var(--fg-on-dark);margin:2px 4px 0}
.vctrls{display:flex;align-items:center;gap:13px;padding:10px 15px;border-radius:13px;background:rgba(255,255,255,.05);border:1px solid rgba(203,164,55,.16)}
.vctrls button{flex:none;width:34px;height:34px;border-radius:9px;border:0;background:transparent;color:var(--fg-on-dark);display:grid;place-items:center;cursor:pointer;transition:color .18s,background .18s}
.vctrls button .ico{display:grid;place-items:center}
.vctrls__pp .ico{margin-left:1px}
.vctrls button:hover{color:var(--gold-300);background:rgba(203,164,55,.12)}
.vbar{flex:1;height:6px;border-radius:99px;background:rgba(255,255,255,.16);position:relative;cursor:pointer}
.vbar__buf{position:absolute;left:0;top:0;bottom:0;width:0;background:rgba(255,255,255,.12);border-radius:99px}
.vbar__fill{position:absolute;left:0;top:0;bottom:0;width:0;border-radius:99px;background:var(--grad-gold)}
.vbar__dot{position:absolute;right:0;top:50%;width:13px;height:13px;border-radius:50%;background:var(--gold-200);transform:translate(50%,-50%);box-shadow:0 0 10px rgba(203,164,55,.65);opacity:0;transition:opacity .15s}
.vbar:hover .vbar__dot{opacity:1}
.vtime{flex:none;font-family:var(--font-body);font-size:13px;color:var(--fg-on-dark-muted);font-variant-numeric:tabular-nums;letter-spacing:.02em;white-space:nowrap}
.vtime__cur{color:var(--fg-on-dark)}
.vplaylist{position:relative;display:flex;flex-direction:column;min-height:0;border-radius:16px;background:rgba(255,255,255,.04);border:1px solid rgba(203,164,55,.14);overflow:hidden}
.vplaylist__head{display:flex;align-items:center;gap:9px;padding:15px 18px;font-family:var(--font-display);font-weight:600;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--fg-on-dark-muted);border-bottom:1px solid rgba(203,164,55,.12)}
.vplaylist__head .ico{color:var(--gold-400);display:grid;place-items:center}
.vlist{position:absolute;inset:49px 0 0 0;display:flex;flex-direction:column;gap:3px;padding:8px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:rgba(203,164,55,.3) transparent}
.vlist::-webkit-scrollbar{width:7px}
.vlist::-webkit-scrollbar-thumb{background:rgba(203,164,55,.28);border-radius:99px}
.vitem{display:flex;gap:11px;align-items:center;padding:8px;border-radius:11px;border:0;background:transparent;cursor:pointer;text-align:left;transition:background .18s}
.vitem:hover{background:rgba(203,164,55,.08)}
.vitem.is-active{background:rgba(203,164,55,.14)}
.vitem__thumb{position:relative;flex:none;width:108px;aspect-ratio:16/9;border-radius:8px;overflow:hidden;background:#05070f}
.vitem__thumb img{width:100%;height:100%;object-fit:cover;display:block}
.vitem__badge{position:absolute;right:4px;bottom:4px;padding:1px 5px;border-radius:5px;background:rgba(5,7,15,.82);color:#fff;font-family:var(--font-body);font-size:11px;font-variant-numeric:tabular-nums}
.vitem__eq{position:absolute;left:5px;bottom:5px;display:none;gap:2px;align-items:flex-end;height:12px}
.vitem.is-active .vitem__eq{display:flex}
.vitem__eq span{width:3px;border-radius:2px;background:var(--gold-200);height:40%;animation:veq 900ms ease-in-out infinite}
.vitem__eq span:nth-child(2){animation-delay:.2s;height:90%}
.vitem__eq span:nth-child(3){animation-delay:.45s;height:60%}
@keyframes veq{0%,100%{height:30%}50%{height:100%}}
.vitem__body{min-width:0;display:flex;flex-direction:column;gap:3px}
.vitem__t{font-family:var(--font-display);font-weight:600;font-size:14px;line-height:1.3;color:var(--fg-on-dark);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.vitem.is-active .vitem__t{color:var(--gold-300)}
.vitem__meta{font-family:var(--font-body);font-size:12px;color:var(--fg-on-dark-faint)}
.vstage:fullscreen,.vstage:-webkit-full-screen{border-radius:0;border:0}

/* ---------- donations ---------- */
.donategrid{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:start}
.donate__impact{list-style:none;padding:0;margin:28px 0 0;display:flex;flex-direction:column;gap:20px}
.donate__impact li{display:flex;gap:15px;align-items:flex-start}
.donate__impact .ico{flex:none;width:48px;height:48px;border-radius:50%;display:grid;place-items:center;color:var(--gold-300);border:1px solid var(--hairline-gold);background:rgba(203,164,55,.06)}
.donate__impact h3{font-family:var(--font-display);font-weight:600;font-size:17px;color:var(--fg-on-dark);margin:2px 0 4px}
.donate__impact p{font-size:14.5px;line-height:1.6;color:var(--fg-on-dark-muted);margin:0;max-width:42ch}
.donate__verse{margin:34px 0 0;padding:20px 24px;border-left:2px solid var(--hairline-gold);background:rgba(203,164,55,.05);border-radius:0 12px 12px 0}
.donate__verse p{font-family:var(--font-serif);font-style:italic;font-size:18px;line-height:1.5;color:var(--fg-on-dark);margin:0}
.donate__verse span{display:block;margin-top:8px;font-family:var(--font-display);font-weight:600;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-400)}

.donatecard{padding:8px;border-radius:22px;background:rgba(248,245,238,.055);border:1px solid rgba(203,164,55,.22);box-shadow:0 30px 90px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,255,255,.07);backdrop-filter:blur(26px) saturate(1.25);-webkit-backdrop-filter:blur(26px) saturate(1.25)}
.dtabs{display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:6px;border-radius:16px}
.dtab{display:flex;align-items:center;justify-content:center;gap:8px;padding:13px;border-radius:11px;border:0;background:transparent;cursor:pointer;font-family:var(--font-display);font-weight:600;font-size:14.5px;color:var(--fg-on-dark-muted);transition:.18s}
.dtab .ico{display:grid;place-items:center}
.dtab:hover{color:var(--fg-on-dark)}
.dtab.is-active{background:var(--grad-gold);color:var(--ink-900);box-shadow:0 6px 20px rgba(203,164,55,.28)}
.dpanel{padding:6px 22px 24px}
.dpanel.is-hidden{display:none}
.dform.is-hidden,.dpay.is-hidden,.dthanks.is-hidden{display:none}
.dlabel{font-family:var(--font-display);font-weight:600;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--fg-on-dark-faint);margin:20px 0 11px}
.dfreq,.dcur{display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:5px;background:rgba(7,10,22,.4);border:1px solid var(--border-on-dark-soft);border-radius:12px}
.dfreq button,.dcur button{padding:11px;border-radius:8px;border:0;background:transparent;cursor:pointer;font-family:var(--font-body);font-weight:600;font-size:14px;color:var(--fg-on-dark-muted);transition:.16s}
.dfreq button.is-active,.dcur button.is-active{background:rgba(203,164,55,.16);color:var(--gold-200)}
.damts{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}
.damt{padding:15px 8px;border-radius:12px;border:1.5px solid var(--border-on-dark-soft);background:rgba(7,10,22,.4);cursor:pointer;font-family:var(--font-display);font-weight:600;font-size:18px;color:var(--fg-on-dark);transition:.16s}
.damt:hover{border-color:var(--hairline-gold)}
.damt.is-active{border-color:var(--gold-500);background:rgba(203,164,55,.14);color:var(--gold-200);box-shadow:0 0 0 3px rgba(203,164,55,.14)}
.damt--other{font-size:14.5px;letter-spacing:.02em}
.dcustom{margin-top:10px;display:none}
.dcustom.is-shown{display:block}
.dcustom .field{font-size:18px}
.dcustom .field span.cur{color:var(--gold-300);font-family:var(--font-display);font-weight:700;font-size:19px}
.dcustom input{font-size:18px}
.ddonate{margin-top:20px;white-space:nowrap}
.dnote{font-size:13.5px;line-height:1.5;color:var(--fg-on-dark-muted);margin:16px 0 4px}
/* Paso de pago incrustado (Stripe Elements) */
.dpay__head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.dpay__back{background:transparent;border:0;color:var(--fg-on-dark-muted);font-family:var(--font-body);font-weight:600;font-size:14px;cursor:pointer;display:inline-flex;align-items:center;gap:6px;padding:4px 2px}
.dpay__back:hover{color:var(--gold-300)}
.dpay__amt{font-family:var(--font-display);font-weight:700;font-size:17px;color:var(--gold-300)}
.dpay__element{margin-bottom:16px;min-height:40px}
.dpay__submit{margin-top:2px}
.dpay__msg{margin-top:10px;font-size:13.5px;line-height:1.45;color:var(--wine-300);text-align:center;min-height:16px}
.dthanks{text-align:center;padding:26px 8px}
.dthanks__ico{width:64px;height:64px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;background:rgba(203,164,55,.16);color:var(--gold-300);margin-bottom:16px}
.dthanks__t{font-family:var(--font-display);font-weight:700;font-size:22px;color:var(--fg-on-dark);margin:0 0 8px}
.dthanks__d{font-size:15px;line-height:1.6;color:var(--fg-on-dark-muted);margin:0 auto;max-width:38ch}
.dsecure{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:14px;font-size:12.5px;color:var(--fg-on-dark-faint)}
.dsecure .ico{display:grid;place-items:center;color:var(--gold-400)}
.dcards{display:flex;align-items:center;justify-content:center;gap:7px;margin-top:13px;opacity:.8}
.dcards span{font-family:var(--font-display);font-weight:700;font-size:11px;letter-spacing:.06em;color:var(--fg-on-dark-muted);border:1px solid var(--border-on-dark-soft);border-radius:5px;padding:3px 7px}
.zelle__logo{display:flex;align-items:center;gap:11px;padding:16px 0 4px}
.zelle__logo b{display:grid;place-items:center;width:44px;height:44px;border-radius:11px;background:#6d1ed4;color:#fff;font-family:var(--font-display);font-weight:700;font-size:24px;line-height:1}
.zelle__logo div{font-family:var(--font-display)}
.zelle__logo .zt{font-weight:600;font-size:16px;color:var(--fg-on-dark)}
.zelle__logo .zs{font-size:13px;color:var(--fg-on-dark-muted)}
.zfield{display:flex;align-items:center;gap:12px;margin-top:10px;padding:14px 16px;border-radius:13px;background:rgba(7,10,22,.5);border:1.5px solid var(--border-on-dark-soft)}
.zfield>div:first-child{min-width:0}
.zfield .zk{display:block;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--fg-on-dark-faint);font-family:var(--font-display);font-weight:600;margin-bottom:3px}
.zfield .zv{font-size:14.5px;color:var(--fg-on-dark);font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.zfield__copy{margin-left:auto;flex:none;display:flex;align-items:center;gap:6px;padding:8px 13px;border-radius:9px;border:1px solid var(--hairline-gold);background:transparent;color:var(--gold-300);cursor:pointer;font-family:var(--font-display);font-weight:600;font-size:13px;transition:.16s}
.zfield__copy:hover{background:rgba(203,164,55,.12)}
.zfield__copy.is-copied{color:var(--gold-200);border-color:var(--gold-500)}
.zfield__copy .ico{display:grid;place-items:center}
.zsteps{list-style:none;counter-reset:z;padding:0;margin:20px 0 0;display:flex;flex-direction:column;gap:12px}
.zsteps li{counter-increment:z;display:flex;gap:12px;align-items:flex-start;font-size:14px;line-height:1.55;color:var(--fg-on-dark-muted)}
.zsteps li::before{content:counter(z);flex:none;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font-family:var(--font-display);font-weight:700;font-size:12px;color:var(--gold-200);background:rgba(203,164,55,.14);border:1px solid var(--hairline-gold)}

/* ---------- responsive ---------- */
@media(max-width:1000px){
  .svcgrid--5{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:920px){
  .wrap{padding:0 22px}
  .nav__pill{display:none}
  .hero__rest .rest2{white-space:normal}
  .nav{padding:16px 20px}
  .nav--scrolled{padding:12px 20px}
  .nav__radio span.txt{display:none}.nav__radio{padding:11px 13px}
  .nav__burger{display:flex}
  .hero__wrap{padding:128px 24px 36px}
  .hero__foot{flex-direction:column;align-items:flex-start;gap:30px}
  .heroradio{width:100%}
  .pagehero{padding:130px 0 52px}
  .pagehero--split .pagehero__inner{grid-template-columns:1fr;gap:40px}
  .pagehero__portrait{max-width:420px}
  .section{padding:64px 0}
  .pillars,.themes,.svcgrid,.formats,.bookgrid,.gallery,.statrow{grid-template-columns:1fr}
  .svcgrid--5{grid-template-columns:1fr 1fr}
  .vplayer{grid-template-columns:1fr;gap:16px}
  .vplaylist{height:430px}
  .split,.contactgrid,.donategrid{grid-template-columns:1fr;gap:36px}
  .split--photo-left .split__media{order:0}
  .bookdetail{grid-template-columns:1fr;gap:28px}
  .bookdetail--flip .bookdetail__media{order:0}
  .footer__top{gap:32px}
  .footer__right{align-items:flex-start}
  .footer__bottom{flex-direction:column;gap:8px}
  /* logo y lema más pequeños para que el lema quepa en una sola línea */
  .footer__mark{height:38px}
  .footer__name{font-size:19px}
  .footer__tag{white-space:nowrap;font-size:16px}
}
@media(max-width:560px){
  .svcgrid--5{grid-template-columns:1fr}
}

/* ============================================================
   CHAT WIDGET — "Consulta con el pastor" (lleva a WhatsApp)
   Diseño inspirado en un asistente flotante, re-vestido con el
   branding de Casa de Liberación (midnight + oro + llama).
   El contenido (preguntas) se define en site.js (initChat).
   ============================================================ */
.chatwidget{position:fixed;right:24px;bottom:24px;z-index:80;font-family:var(--font-body);transition:bottom .4s cubic-bezier(.2,.8,.2,1)}
.chatwidget__fab{
  position:relative;width:62px;height:62px;border-radius:var(--r-pill);border:1.5px solid rgba(255,255,255,.18);
  display:flex;align-items:center;justify-content:center;cursor:pointer;color:#1B1B17;
  background:var(--grad-gold);box-shadow:var(--glow-gold),0 10px 28px rgba(0,0,0,.45);
  transition:transform .35s cubic-bezier(.34,1.56,.64,1),box-shadow .35s ease}
.chatwidget__fab::after{content:"";position:absolute;inset:0;border-radius:var(--r-pill);
  background:linear-gradient(180deg,rgba(255,255,255,.35),transparent 60%);opacity:.5;pointer-events:none}
.chatwidget__fab:hover{transform:scale(1.07) rotate(-3deg);box-shadow:0 0 46px rgba(203,164,55,.45),0 14px 34px rgba(0,0,0,.5)}
.chatwidget__fab .ico,.chatwidget__fab svg{position:relative;z-index:1}
.chatwidget__pulse{position:absolute;inset:0;border-radius:var(--r-pill);background:var(--gold-400);
  opacity:.35;animation:cwPing 2.4s cubic-bezier(0,0,.2,1) infinite;pointer-events:none}
@keyframes cwPing{75%,100%{transform:scale(1.55);opacity:0}}
.chatwidget[data-open="1"] .chatwidget__pulse{display:none}

.chatwidget__panel{
  position:absolute;right:0;bottom:78px;width:min(360px,calc(100vw - 36px));
  display:flex;flex-direction:column;overflow:hidden;
  border-radius:var(--r-xl);border:1px solid var(--hairline-gold);
  background:var(--grad-midnight);box-shadow:var(--shadow-dark),0 0 60px rgba(7,10,22,.6);
  transform-origin:bottom right;animation:cwPop .3s cubic-bezier(.175,.885,.32,1.275) forwards}
@keyframes cwPop{from{opacity:0;transform:scale(.9) translateY(14px)}to{opacity:1;transform:scale(1) translateY(0)}}

.chatwidget__head{display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:16px 18px;border-bottom:1px solid var(--border-on-dark-soft)}
.chatwidget__id{display:flex;align-items:center;gap:12px;min-width:0}
.chatwidget__avatar{width:42px;height:42px;border-radius:var(--r-pill);flex:none;display:flex;align-items:center;justify-content:center;
  background:rgba(203,164,55,.12);border:1px solid var(--border-on-dark);overflow:hidden}
.chatwidget__avatar img{width:26px;height:26px;object-fit:contain}
.chatwidget__name{font-family:var(--font-display);font-weight:700;font-size:15px;color:var(--fg-on-dark);line-height:1.1}
.chatwidget__status{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--fg-on-dark-muted);margin-top:3px}
.chatwidget__dot{width:7px;height:7px;border-radius:50%;background:#34D27B;box-shadow:0 0 8px rgba(52,210,123,.8);animation:cwBlink 2s ease-in-out infinite}
@keyframes cwBlink{50%{opacity:.45}}
.chatwidget__close{flex:none;width:32px;height:32px;border-radius:var(--r-pill);border:1px solid var(--border-on-dark-soft);
  background:transparent;color:var(--fg-on-dark-muted);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:.2s}
.chatwidget__close:hover{background:rgba(255,255,255,.06);color:var(--fg-on-dark)}

.chatwidget__body{padding:18px;display:flex;flex-direction:column;gap:14px}
.chatwidget__bubble{font-size:14.5px;line-height:1.6;color:var(--fg-on-dark);
  background:rgba(255,255,255,.05);border:1px solid var(--border-on-dark-soft);
  padding:16px 18px;margin:4px 0 6px;border-radius:4px 16px 16px 16px}
.chatwidget__opts{display:flex;flex-direction:column;gap:9px}
.chatwidget__opt{display:flex;align-items:center;justify-content:space-between;gap:10px;text-align:left;
  font-family:var(--font-body);font-size:14px;font-weight:500;color:var(--fg-on-dark);cursor:pointer;
  padding:12px 15px;border-radius:var(--r-pill);
  background:rgba(203,164,55,.08);border:1px solid var(--border-on-dark);transition:.22s}
.chatwidget__opt:hover{background:rgba(203,164,55,.16);border-color:var(--hairline-gold);transform:translateX(2px)}
.chatwidget__opt .ico,.chatwidget__opt svg{flex:none;color:var(--brand)}

/* Segunda pantalla: formulario de nombre / mensaje */
.chatwidget__panel[data-screen="form"] .chatwidget__menu{display:none}
.chatwidget__form{display:none}
.chatwidget__panel[data-screen="form"] .chatwidget__form{display:block}
.chatwidget__back{background:transparent;border:0;color:var(--fg-on-dark-muted);font-family:var(--font-body);font-weight:600;font-size:13px;cursor:pointer;display:inline-flex;align-items:center;gap:5px;padding:0;margin-bottom:14px}
.chatwidget__back:hover{color:var(--fg-on-dark)}
.chatwidget__formtitle{font-family:var(--font-display);font-weight:700;font-size:15px;color:var(--fg-on-dark);margin-bottom:12px}
.chatwidget__name,.chatwidget__msg{width:100%;box-sizing:border-box;background:rgba(255,255,255,.06);border:1px solid var(--border-on-dark-soft);border-radius:12px;padding:12px 14px;color:var(--fg-on-dark);font-family:var(--font-body);font-size:14px;margin-bottom:10px;outline:none;transition:border-color .18s}
.chatwidget__name:focus,.chatwidget__msg:focus{border-color:var(--hairline-gold)}
.chatwidget__name::placeholder,.chatwidget__msg::placeholder{color:var(--fg-on-dark-faint)}
.chatwidget__msg{display:none;resize:vertical;min-height:78px;line-height:1.5}
.chatwidget__msg.is-shown{display:block}
.chatwidget__err{font-size:12.5px;color:var(--wine-300);min-height:14px;margin-bottom:6px}
.chatwidget__send{display:flex;align-items:center;justify-content:center;gap:9px;width:100%;border:0;cursor:pointer;
  border-radius:var(--r-pill);padding:13px 18px;font-family:var(--font-display);font-weight:600;font-size:14px;color:#072312;
  background:linear-gradient(135deg,#3ED27E,#1FAE60);box-shadow:0 8px 22px rgba(31,174,96,.32);transition:.22s}
.chatwidget__send:hover{transform:translateY(-1px);box-shadow:0 12px 28px rgba(31,174,96,.42)}
.chatwidget__foot{display:flex;align-items:center;justify-content:center;gap:6px;
  padding:0 18px 16px;font-size:11.5px;color:var(--fg-on-dark-faint)}

.chatwidget[data-open="0"] .chatwidget__panel{display:none}
@media(max-width:560px){
  .chatwidget{right:16px;bottom:16px}
  .chatwidget__panel{bottom:74px}
}

/* ============================================================
   MÓVIL — controles del nav y menú desplegable (mejora visual)
   Solo CSS · se aplica a todas las páginas y ambos idiomas.
   ============================================================ */
@keyframes drawerIn{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:920px){
  /* --- Controles del nav: mismo tamaño, alineados y limpios --- */
  /* En móvil ocultamos el botón de radio del nav (la radio sigue en el
     capsule del hero y en la barra flotante) para que quepan ES·EN,
     el cambio de tema y el menú sin salirse de pantalla. */
  .nav__right{gap:10px}
  .nav__radio{display:none}
  .lang{height:46px;display:inline-flex;align-items:center;padding:0 15px;font-size:13px;letter-spacing:.04em}
  .nav__burger{width:46px;height:46px;border-radius:999px}
  .nav__burger:hover{border-color:var(--hairline-gold);background:rgba(20,26,56,.66)}

  /* --- Menú desplegable --- */
  .drawer{background:var(--grad-midnight);padding:100px 26px 34px;justify-content:center;gap:2px;overflow-y:auto}
  .drawer::before{content:"";position:absolute;inset:0;pointer-events:none;
    background:radial-gradient(120% 55% at 100% 0%,rgba(203,164,55,.12),transparent 60%)}
  .drawer a{position:relative;display:flex;align-items:center;justify-content:space-between;
    font-size:22px;padding:17px 6px;border-bottom:1px solid var(--border-on-dark-soft);transition:.2s}
  .drawer a::after{content:"";width:9px;height:9px;flex:none;transform:rotate(-45deg);transition:.2s;opacity:.55;
    border-right:2px solid var(--fg-on-dark-faint);border-bottom:2px solid var(--fg-on-dark-faint)}
  .drawer a:hover,.drawer a:active{color:var(--gold-300);padding-left:14px}
  .drawer a:hover::after{border-color:var(--gold-400);opacity:1}
  .drawer a.is-active::after{border-color:var(--gold-400);opacity:1}

  /* "Donar" como botón dorado destacado (último enlace) */
  .drawer a:last-child{justify-content:center;margin-top:24px;padding:16px 22px;border-bottom:none;
    background:var(--grad-gold);color:#1B1B17;border-radius:999px;font-weight:700;box-shadow:var(--glow-gold-sm)}
  .drawer a:last-child::after{display:none}
  .drawer a:last-child:hover{padding-left:22px;color:#1B1B17;transform:translateY(-1px);box-shadow:var(--glow-gold)}

  /* Botón cerrar: circular, a juego con el nav */
  .drawer__close{top:22px;right:22px;width:46px;height:46px;border-radius:999px;
    display:flex;align-items:center;justify-content:center;
    border:1px solid var(--border-on-dark-soft);background:rgba(20,26,56,.5);transition:.2s}
  .drawer__close:hover{border-color:var(--hairline-gold);background:rgba(20,26,56,.85)}

  /* Entrada escalonada de los enlaces */
  .drawer.is-open a{animation:drawerIn .45s cubic-bezier(.2,.8,.2,1) both}
  .drawer.is-open a:nth-child(2){animation-delay:.05s}
  .drawer.is-open a:nth-child(3){animation-delay:.10s}
  .drawer.is-open a:nth-child(4){animation-delay:.15s}
  .drawer.is-open a:nth-child(5){animation-delay:.20s}
  .drawer.is-open a:nth-child(6){animation-delay:.25s}
  .drawer.is-open a:nth-child(7){animation-delay:.30s}
  .drawer.is-open a:nth-child(8){animation-delay:.35s}

  /* El chat flotante no debe tapar el menú abierto */
  .drawer.is-open ~ .chatwidget{display:none}
}

/* ---------- Fondo con imagen en el hero de Talleres (CC0) ---------- */
.pagehero__bg{position:absolute;inset:0;z-index:0;background-size:cover;background-position:center;
  background-repeat:no-repeat}
.pagehero__bg::after{content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(7,10,22,.92) 0%,rgba(7,10,22,.78) 42%,rgba(7,10,22,.45) 100%),
             linear-gradient(0deg,var(--ink-900) 2%,transparent 32%)}

/* ============================================================
   TEMA CLARO (predeterminado) — "Claro como el flyer"
   (lavanda/plata + oro + vino). Replica el diseño aprobado en
   Claude Design: TODO claro, incluido el hero. Se aplica salvo
   cuando <html data-theme="dark">, que conserva el tema oscuro.
   ============================================================ */
:root:not([data-theme="dark"]){
  --fg-on-dark:#222842; --fg-on-dark-muted:#555C77; --fg-on-dark-faint:#646B89;
  --bg-dark:#E9EAF5; --bg-dark-2:#E2E3F1; --surface-dark:#FFFFFF;
  --bg-light:#FBFBFE; --surface-light:#FFFFFF;
  --brand:var(--gold-600); --brand-strong:var(--gold-700);
  --border-on-dark:rgba(120,110,150,.24); --border-on-dark-soft:rgba(40,44,80,.13);
  --hairline-gold:rgba(172,135,34,.5);
  --glow-gold:0 10px 34px rgba(203,164,55,.30); --glow-gold-sm:0 6px 20px rgba(203,164,55,.24);
  --shadow-dark:0 20px 50px rgba(60,55,110,.18);
  --grad-midnight:radial-gradient(120% 90% at 72% 0%, #FBFBFF 0%, #ECEDF8 46%, #E1E3F1 100%);
}
/* base + superficies */
:root:not([data-theme="dark"]) body{background:#E6E7F3}
:root:not([data-theme="dark"]) .section--dark{background:#E9EAF5}
:root:not([data-theme="dark"]) .section--ink{background:#E3E4F0}
:root:not([data-theme="dark"]) .section--paper{background:#FBFBFE;color:var(--fg-on-light)}
:root:not([data-theme="dark"]) .verseband{background:linear-gradient(180deg,#E7E5F1,#E1DFEC)}
:root:not([data-theme="dark"]) .verseband__star{color:var(--gold-700)}
:root:not([data-theme="dark"]) .radiopromo{background:#E7E8F4}
:root:not([data-theme="dark"]) .footer{background:#E0E1EE}
:root:not([data-theme="dark"]) .gold{color:var(--gold-700)}
:root:not([data-theme="dark"]) .eq span{background:var(--gold-600)}
/* nav / drawer / lang / burger / toggle — frosted claro */
:root:not([data-theme="dark"]) .nav--scrolled{background:rgba(248,248,253,.82);box-shadow:0 10px 30px rgba(50,50,90,.10)}
:root:not([data-theme="dark"]) .nav__pill{background:rgba(255,255,255,.55)}
:root:not([data-theme="dark"]) .nav--scrolled .nav__pill{background:rgba(255,255,255,.4)}
:root:not([data-theme="dark"]) .nav__pill a:hover,:root:not([data-theme="dark"]) .nav__pill a.is-active{color:var(--gold-700)}
:root:not([data-theme="dark"]) .nav__pill a.is-active::after{background:var(--gold-600)}
:root:not([data-theme="dark"]) .nav__radio{background:rgba(255,255,255,.55)}
:root:not([data-theme="dark"]) .nav__radio:hover{background:rgba(255,255,255,.82)}
:root:not([data-theme="dark"]) .lang{background:rgba(255,255,255,.55)}
:root:not([data-theme="dark"]) .lang .on{color:var(--gold-700)}
:root:not([data-theme="dark"]) .nav__burger{background:rgba(255,255,255,.6)}
:root:not([data-theme="dark"]) .themetoggle{background:rgba(255,255,255,.55);color:var(--gold-700)}
:root:not([data-theme="dark"]) .themetoggle:hover{background:rgba(255,255,255,.82)}
:root:not([data-theme="dark"]) .drawer{background:rgba(244,244,251,.98)}
:root:not([data-theme="dark"]) .drawer a.is-active{color:var(--gold-700)}
/* radiobar flotante */
:root:not([data-theme="dark"]) .radiobar{background:rgba(250,250,254,.9);box-shadow:0 16px 40px rgba(50,50,90,.16)}
:root:not([data-theme="dark"]) .radiobar__play{color:var(--gold-700)}
:root:not([data-theme="dark"]) .radiobar__live{color:var(--gold-700)}
:root:not([data-theme="dark"]) .radiobar__x:hover{background:rgba(0,0,0,.05)}
/* eyebrows — pastilla vino del flyer */
:root:not([data-theme="dark"]) .eyebrow--cap{color:#F8F5EE;background:var(--wine-500);border-color:transparent}
:root:not([data-theme="dark"]) .eyebrow--out{color:var(--wine-700)}
:root:not([data-theme="dark"]) .eyebrow--ondark{color:var(--wine-600)}
/* HERO claro */
:root:not([data-theme="dark"]) .hero__scrim{background:
  linear-gradient(95deg, rgba(243,242,250,.96) 0%, rgba(236,237,247,.86) 34%, rgba(236,237,247,.4) 66%, rgba(236,237,247,.55) 100%),
  linear-gradient(180deg, rgba(243,242,250,.55) 0%, rgba(236,237,247,0) 22%, rgba(236,237,247,0) 50%, rgba(232,233,244,.92) 100%)}
:root:not([data-theme="dark"]) .hero__kicker{color:var(--gold-700);opacity:1}
:root:not([data-theme="dark"]) .hero__headline .mut{color:rgba(34,40,66,.42)}
:root:not([data-theme="dark"]) .hero__headline .em{color:var(--gold-700)}
:root:not([data-theme="dark"]) .heroradio{background:rgba(255,255,255,.6)}
:root:not([data-theme="dark"]) .heroradio:hover{background:rgba(255,255,255,.82)}
:root:not([data-theme="dark"]) .heroradio__play{color:var(--gold-700)}
:root:not([data-theme="dark"]) .heroradio__live{color:var(--gold-700)}
/* page-hero */
:root:not([data-theme="dark"]) .pagehero__crumb .gold{color:var(--gold-700)}
:root:not([data-theme="dark"]) .pagehero__title .em{color:var(--gold-700)}
:root:not([data-theme="dark"]) .pagehero__bg::after{background:linear-gradient(90deg, rgba(243,242,250,.95), rgba(236,237,247,.72) 55%, rgba(236,237,247,.34)),linear-gradient(0deg,#E1E3F1 2%,transparent 34%)}
/* tarjetas sobre claro */
:root:not([data-theme="dark"]) .pillar,:root:not([data-theme="dark"]) .svc--dark,:root:not([data-theme="dark"]) .format,:root:not([data-theme="dark"]) .theme{background:#fff;border-color:var(--border-on-dark-soft);box-shadow:var(--shadow-light-sm)}
:root:not([data-theme="dark"]) .pillar:hover,:root:not([data-theme="dark"]) .svc--dark:hover,:root:not([data-theme="dark"]) .theme:hover{border-color:var(--hairline-gold);box-shadow:var(--shadow-light)}
:root:not([data-theme="dark"]) .svc{border:1px solid var(--border-on-dark-soft)}
:root:not([data-theme="dark"]) .pillar__circ,:root:not([data-theme="dark"]) .svc--dark .svc__circ,:root:not([data-theme="dark"]) .svc__circ{color:var(--gold-700);border-color:var(--hairline-gold)}
:root:not([data-theme="dark"]) .format__circ{color:var(--gold-700);background:rgba(203,164,55,.12)}
:root:not([data-theme="dark"]) .split__pillars{color:var(--gold-700)}
:root:not([data-theme="dark"]) .svc--dark .svc__meta,:root:not([data-theme="dark"]) .svc__meta{color:var(--gold-700)}
:root:not([data-theme="dark"]) .theme__no,:root:not([data-theme="dark"]) .theme__ref{color:var(--gold-700)}
/* libros */
:root:not([data-theme="dark"]) .book__s{color:var(--gold-700)}
:root:not([data-theme="dark"]) .bookdetail__lang{color:var(--wine-600)}
:root:not([data-theme="dark"]) .bookdetail__sub{color:var(--gold-700)}
/* radio promo / stats */
:root:not([data-theme="dark"]) .radiopromo__mic{color:var(--gold-700)}
:root:not([data-theme="dark"]) .prose p .gold{color:var(--gold-700)}
:root:not([data-theme="dark"]) .stat__n{color:var(--gold-700)}
/* reglas/refs/diamante */
:root:not([data-theme="dark"]) .diamond-rule{color:var(--wine-500)}
:root:not([data-theme="dark"]) .diamond-rule span{background:rgba(158,42,99,.32)}
:root:not([data-theme="dark"]) .scripture-ref{color:var(--gold-700)}
:root:not([data-theme="dark"]) .ciclo-note .ico{color:var(--gold-700)}
/* contacto */
:root:not([data-theme="dark"]) .contact__list li{background:#fff;border-color:var(--border-on-dark-soft)}
:root:not([data-theme="dark"]) .contact__list .ico,:root:not([data-theme="dark"]) .fbf{color:var(--gold-700)}
:root:not([data-theme="dark"]) .contact__form{background:#fff;border-color:var(--border-on-dark-soft)}
:root:not([data-theme="dark"]) .field{background:#F4F5FA;border-color:var(--border-on-dark-soft)}
:root:not([data-theme="dark"]) .field .ico{color:var(--gold-700)}
:root:not([data-theme="dark"]) .phone-cc option{background:#fff;color:var(--fg-on-dark)}
/* botones */
:root:not([data-theme="dark"]) .btn--paper{background:var(--wine-500);color:#F8F5EE}
:root:not([data-theme="dark"]) .btn--paper:hover{background:var(--wine-600)}
:root:not([data-theme="dark"]) .btn--line{background:#fff;color:var(--fg-on-dark);border-color:var(--border-on-dark-soft)}
:root:not([data-theme="dark"]) .btn--line:hover{border-color:var(--hairline-gold);background:rgba(203,164,55,.08)}
:root:not([data-theme="dark"]) .btn--dark{background:var(--ink-800);color:#F6F3EA;border-color:transparent}
:root:not([data-theme="dark"]) .btn--ghost{color:var(--gold-700)}
/* footer */
:root:not([data-theme="dark"]) .footer__tag{color:var(--gold-700)}
:root:not([data-theme="dark"]) .footer__social a{color:var(--gold-700)}
:root:not([data-theme="dark"]) .footer__social a:hover{color:var(--gold-800);background:rgba(203,164,55,.12)}
:root:not([data-theme="dark"]) .footer__contact a:hover{color:var(--gold-700)}
/* donaciones */
:root:not([data-theme="dark"]) .donatecard{background:#fff;border-color:var(--border-on-dark-soft);box-shadow:var(--shadow-light)}
:root:not([data-theme="dark"]) .dfreq,:root:not([data-theme="dark"]) .dcur{background:#F4F5FA;border-color:var(--border-on-dark-soft)}
:root:not([data-theme="dark"]) .dfreq button.is-active,:root:not([data-theme="dark"]) .dcur button.is-active{background:rgba(203,164,55,.18);color:var(--gold-800)}
:root:not([data-theme="dark"]) .damt{background:#F4F5FA;border-color:var(--border-on-dark-soft);color:var(--fg-on-dark)}
:root:not([data-theme="dark"]) .damt.is-active{border-color:var(--gold-600);background:rgba(203,164,55,.16);color:var(--gold-800);box-shadow:0 0 0 3px rgba(203,164,55,.14)}
:root:not([data-theme="dark"]) .donate__impact .ico{color:var(--gold-700)}
:root:not([data-theme="dark"]) .donate__verse{background:rgba(203,164,55,.08)}
:root:not([data-theme="dark"]) .donate__verse span{color:var(--gold-700)}
:root:not([data-theme="dark"]) .dsecure .ico{color:var(--gold-700)}
:root:not([data-theme="dark"]) .dcustom .field span.cur{color:var(--gold-700)}
:root:not([data-theme="dark"]) .zfield{background:#F4F5FA;border-color:var(--border-on-dark-soft)}
:root:not([data-theme="dark"]) .zfield__copy{color:var(--gold-700)}
/* reproductor de video (prédicas) */
:root:not([data-theme="dark"]) .vplayer{background:#fff;border-color:var(--border-on-dark-soft);box-shadow:var(--shadow-light)}
:root:not([data-theme="dark"]) .vplaylist{background:#F4F5FA;border-color:var(--border-on-dark-soft)}
:root:not([data-theme="dark"]) .vctrls{background:#F1F2F8;border-color:var(--border-on-dark-soft)}
:root:not([data-theme="dark"]) .vctrls button:hover{color:var(--gold-700);background:rgba(203,164,55,.12)}
:root:not([data-theme="dark"]) .vbar{background:rgba(34,40,66,.14)}
:root:not([data-theme="dark"]) .vbar__buf{background:rgba(34,40,66,.1)}
:root:not([data-theme="dark"]) .vplaylist__head{border-bottom-color:var(--border-on-dark-soft)}
:root:not([data-theme="dark"]) .vitem:hover{background:rgba(203,164,55,.1)}
:root:not([data-theme="dark"]) .vitem.is-active{background:rgba(203,164,55,.14)}
:root:not([data-theme="dark"]) .vitem.is-active .vitem__t{color:var(--gold-700)}
/* chat widget en claro (no existe en el bundle; lo armonizamos) */
:root:not([data-theme="dark"]) .chatwidget__bubble{background:#fff;border-color:var(--border-on-dark-soft)}
:root:not([data-theme="dark"]) .chatwidget__opt{background:rgba(203,164,55,.10);border-color:var(--hairline-gold)}
:root:not([data-theme="dark"]) .chatwidget__name,:root:not([data-theme="dark"]) .chatwidget__msg{background:#fff;border-color:var(--border-on-dark-soft)}

/* ---------- Botón de cambio de tema (sol/luna) ----------
   Fiel al diseño de los controles del nav (píldora translúcida). */
.themetoggle{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;flex:none;
  background:rgba(20,26,56,.4);backdrop-filter:blur(14px);border:1px solid var(--border-on-dark-soft);
  border-radius:999px;color:var(--gold-300);cursor:pointer;transition:.18s}
.themetoggle:hover{border-color:var(--hairline-gold);background:rgba(20,26,56,.66);color:var(--gold-200)}
.themetoggle .ico{transition:transform .4s cubic-bezier(.34,1.56,.64,1)}
.themetoggle:hover .ico{transform:rotate(-25deg)}
@media(max-width:920px){ .themetoggle{width:46px;height:46px} }

/* ============================================================
   MÓVIL — reproductor de radio del hero (heroradio)
   Separarlo del botón de arriba y evitar que el texto / las ondas
   se salgan del borde en pantallas pequeñas.
   ============================================================ */
@media(max-width:560px){
  /* Cápsula delgada, del mismo grosor que en escritorio: "EN VIVO" en una
     línea y el nombre en otra. Se oculta el subtítulo largo; el botón de
     play se reduce un poco para dejar hueco a unas ondas más pequeñas. */
  .heroradio{margin-top:24px;gap:12px;padding:12px 14px 12px 12px;min-width:0}
  .heroradio__play{width:44px;height:44px}
  .heroradio__txt{min-width:0;flex:1;padding-right:0;gap:2px}
  .heroradio__top{flex-direction:column;align-items:flex-start;gap:3px;white-space:nowrap;font-size:13px}
  .heroradio__name{font-size:13px;letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
  .heroradio__sub{display:none}
  .heroradio__eq{flex:none;margin-left:4px}
  .heroradio__eq.eq{height:16px;gap:2.5px}
  .heroradio__eq.eq span{width:3px}
}

/* ============================================================
   MÓVIL — título del hero a tamaño completo (es parte del título,
   no un subtítulo). Las líneas envuelven solas para no salirse nunca
   del margen; "ocultismo." puede caer en una línea extra.
   Solo afecta a móvil; escritorio queda igual.
   ============================================================ */
@media(max-width:560px){
  .hero__headline{font-size:44px;line-height:1.04;max-width:none}
  .hero__rest{font-size:40px;margin-top:-.04em;line-height:1.05}
  .hero__rest .mut,.hero__rest .rest2{white-space:normal}
}

/* ============================================================
   MÓVIL — barra de radio fija (aparece al dar play)
   No debe salirse del margen ni tapar el chat. Cuando está visible,
   el botón del chat sube; al cerrarse, vuelve a su sitio.
   ============================================================ */
@media(max-width:560px){
  .radiobar{left:14px;right:14px;bottom:16px;transform:translateY(0);gap:11px;padding:9px 12px 9px 9px;max-width:none}
  .radiobar.is-hidden{transform:translateY(200%)}
  .radiobar .eq{height:16px;gap:2.5px;flex:none}
  .radiobar .eq span{width:3px}
  .radiobar__play{width:42px;height:42px}
  .radiobar__now{flex:1;min-width:0;padding-right:0}
  .radiobar__live{min-width:0;padding-left:6px}
  .radiobar__live b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .radiobar__now span{max-width:100%;font-size:11.5px}
  .radiobar__x{flex:none}
  /* el chat sube mientras la barra está visible */
  .radiobar:not(.is-hidden) ~ .chatwidget{bottom:84px}
}

/* ============================================================
   LOGO DE MARCA (logo completo Oviedo, PNG con fondo transparente)
   Transparente en tema claro. En modo oscuro el texto navy quedaría
   ilegible, así que solo ahí se muestra sobre una tarjeta blanca.
   ============================================================ */
.nav__brand{gap:0}
.nav__logo{box-sizing:border-box;height:42px;width:auto;display:block}
.footer__logo{box-sizing:border-box;height:54px;width:auto;display:block}
/* variante por tema: navy (claro) / crema (oscuro), ambas transparentes */
.nav__logo--on-dark,.footer__logo--on-dark{display:none}
:root[data-theme="dark"] .nav__logo--on-light,
:root[data-theme="dark"] .footer__logo--on-light{display:none}
:root[data-theme="dark"] .nav__logo--on-dark,
:root[data-theme="dark"] .footer__logo--on-dark{display:block}
@media(max-width:560px){
  .nav__logo{height:38px}
  .footer__logo{height:48px}
}

/* ============================================================
   ACCESIBILIDAD Y COMPATIBILIDAD (auditoría de producción)
   ============================================================ */
/* Foco visible para navegación por teclado */
:focus-visible{outline:2px solid var(--gold-500);outline-offset:3px;border-radius:4px}
.nav__pill a:focus-visible,.drawer a:focus-visible{outline-offset:5px}

/* Enlace "saltar al contenido" (visible solo con foco de teclado) */
.skiplink{position:absolute;left:-9999px;top:14px;z-index:200;background:var(--ink-900);color:#F6F3EA;
  padding:12px 22px;border-radius:999px;font-family:var(--font-display);font-weight:600;font-size:14px}
.skiplink:focus{left:14px}

/* Respeto a usuarios que prefieren menos movimiento */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  html{scroll-behavior:auto}
}

/* iOS: altura estable con la barra del navegador (svh con fallback vh) */
.hero{min-height:100svh}
.hero__wrap{min-height:100svh}
.vstage.is-pseudofs{height:100svh}

/* iOS: evitar zoom automático al enfocar campos (mínimo 16px) */
@media(max-width:560px){
  input,select,textarea{font-size:16px}
}

/* ---------- Banner y preferencias de cookies (RGPD / ePrivacy) ----------
   Estructura común; los colores se adaptan a cada tema (claro / oscuro) más
   abajo, para que cada banner combine con su fondo y el texto siempre se lea. */
.cookiebar{position:fixed;left:14px;right:14px;bottom:14px;z-index:95;display:flex;align-items:center;gap:14px 22px;flex-wrap:wrap;
  border:1px solid transparent;border-radius:16px;padding:18px 22px}
.cookiebar__txt{flex:1;min-width:260px;margin:0;font-family:var(--font-body);font-size:13.5px;line-height:1.55;text-wrap:pretty}
.cookiebar__btns{display:flex;gap:10px;flex-wrap:wrap}
.cookiebar__btn{border-radius:999px;padding:10px 20px;font-family:var(--font-display);font-weight:600;font-size:13.5px;cursor:pointer;transition:.18s;border:1px solid transparent;white-space:nowrap}
.cookiebar__yes{background:linear-gradient(135deg,#E9D38C,#CBA437 45%,#AC8722);color:#231b06}
.cookiebar__yes:hover{filter:brightness(1.07)}
.cookiebar__no{background:transparent}
.cookiebar__cfg{background:transparent;text-decoration:underline;text-underline-offset:3px}
@media(min-width:880px){ .cookiebar{left:auto;right:24px;bottom:24px;max-width:560px} }

/* Modal de preferencias (estructura) */
.cookieprefs{position:fixed;inset:0;z-index:96;display:flex;align-items:center;justify-content:center;padding:20px;
  background:rgba(7,10,22,.55);backdrop-filter:blur(3px)}
.cookieprefs__card{width:100%;max-width:480px;max-height:88vh;overflow:auto;border:1px solid transparent;border-radius:20px;padding:26px 24px}
.cookieprefs__title{font-family:var(--font-display);font-weight:700;font-size:20px;margin:0 0 8px}
.cookieprefs__intro{font-size:13.5px;line-height:1.55;margin:0 0 18px}
.cookieprefs__row{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:14px 0;border-top:1px solid transparent}
.cookieprefs__info strong{display:block;font-family:var(--font-display);font-weight:600;font-size:14.5px;margin-bottom:3px}
.cookieprefs__info span{font-size:12.5px;line-height:1.5}
.cookieprefs__always{flex:none;font-size:12px;font-weight:600;white-space:nowrap;padding-top:2px}
.cookieprefs__actions{display:flex;gap:10px;justify-content:flex-end;margin-top:22px;flex-wrap:wrap}
.cookieswitch{flex:none;position:relative;display:inline-block;width:46px;height:26px;cursor:pointer}
.cookieswitch input{position:absolute;opacity:0;width:100%;height:100%;margin:0;cursor:pointer}
.cookieswitch__ui{position:absolute;inset:0;border-radius:999px;transition:.2s}
.cookieswitch__ui::before{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;transition:.2s;box-shadow:0 1px 3px rgba(0,0,0,.25)}
.cookieswitch input:checked + .cookieswitch__ui{background:#CBA437}
.cookieswitch input:checked + .cookieswitch__ui::before{transform:translateX(20px)}
.cookieswitch input:focus-visible + .cookieswitch__ui{outline:2px solid #CBA437;outline-offset:2px}
.cookielink{background:none;border:0;padding:0;cursor:pointer;font:inherit;color:inherit;text-decoration:underline;text-underline-offset:3px;opacity:.85}
.cookielink:hover{opacity:1}

/* --- Colores en TEMA CLARO: fondo claro, texto oscuro legible --- */
[data-theme="light"] .cookiebar{background:#FFFFFF;border-color:rgba(22,24,40,.12);color:#22252E;box-shadow:0 18px 50px rgba(22,28,52,.18)}
[data-theme="light"] .cookiebar__txt{color:#3C404C}
[data-theme="light"] .cookiebar__no{border-color:rgba(22,24,40,.22);color:#22252E}
[data-theme="light"] .cookiebar__no:hover{border-color:rgba(22,24,40,.5)}
[data-theme="light"] .cookiebar__cfg{color:#6A6E7C}
[data-theme="light"] .cookiebar__cfg:hover{color:#22252E}
[data-theme="light"] .cookieprefs__card{background:#FFFFFF;color:#22252E;border-color:rgba(22,24,40,.12);box-shadow:0 24px 60px rgba(22,28,52,.28)}
[data-theme="light"] .cookieprefs__title{color:#181B22}
[data-theme="light"] .cookieprefs__intro{color:#5A5E6C}
[data-theme="light"] .cookieprefs__row{border-top-color:rgba(22,24,40,.1)}
[data-theme="light"] .cookieprefs__info strong{color:#22252E}
[data-theme="light"] .cookieprefs__info span{color:#6A6E7C}
[data-theme="light"] .cookieprefs__always{color:#9A7A1F}
[data-theme="light"] .cookieswitch__ui{background:rgba(22,24,40,.2)}

/* --- Colores en TEMA OSCURO: fondo oscuro, texto claro --- */
[data-theme="dark"] .cookiebar{background:#0C1126;border-color:rgba(203,164,55,.42);color:#F1EFE7;box-shadow:0 18px 50px rgba(0,0,0,.5)}
[data-theme="dark"] .cookiebar__txt{color:#E7E4DA}
[data-theme="dark"] .cookiebar__no{border-color:rgba(255,255,255,.28);color:#F1EFE7}
[data-theme="dark"] .cookiebar__no:hover{border-color:rgba(255,255,255,.55)}
[data-theme="dark"] .cookiebar__cfg{color:#C9CEE0}
[data-theme="dark"] .cookiebar__cfg:hover{color:#fff}
[data-theme="dark"] .cookieprefs__card{background:#0C1126;color:#F1EFE7;border-color:rgba(203,164,55,.42);box-shadow:0 24px 60px rgba(0,0,0,.6)}
[data-theme="dark"] .cookieprefs__title{color:#fff}
[data-theme="dark"] .cookieprefs__intro{color:#C9CEE0}
[data-theme="dark"] .cookieprefs__row{border-top-color:rgba(255,255,255,.1)}
[data-theme="dark"] .cookieprefs__info strong{color:#F6F3EA}
[data-theme="dark"] .cookieprefs__info span{color:#AEB4CB}
[data-theme="dark"] .cookieprefs__always{color:#CBA437}
[data-theme="dark"] .cookieswitch__ui{background:rgba(255,255,255,.18)}

/* ---------- Barra de progreso al navegar sin recarga ---------- */
body.is-navigating::after{content:"";position:fixed;top:0;left:0;height:3px;width:100%;z-index:200;
  background:linear-gradient(90deg,transparent,#CBA437 45%,#E9D38C 55%,transparent);
  animation:cdlnavbar 900ms linear infinite}
@keyframes cdlnavbar{0%{transform:translateX(-100%)}100%{transform:translateX(100%)}}
@media(prefers-reduced-motion:reduce){ body.is-navigating::after{animation:none;opacity:.6} }

/* ============================================================
   DINAMISMO DE SCROLL
   1) Hero (inicio): la foto queda ESTÁTICA — es fija al viewport y
      recortada al área del hero con clip-path — mientras el texto y
      los botones suben con el scroll; al agotarse el hero, la
      siguiente sección lo cubre de forma natural.
   2) Apariciones de secciones (.rv → .rv-in): las clases las añade
      site.js (initReveal); sin JavaScript todo queda visible.
   ============================================================ */
.hero{clip-path:inset(0);-webkit-clip-path:inset(0)}
.hero__bg,.hero__scrim{position:fixed;top:0;left:0;width:100%;height:100vh;height:100lvh}
.hero__glow{position:fixed}

.rv{opacity:0;transform:translateY(26px);
  transition:opacity .7s cubic-bezier(.2,.7,.3,1),transform .7s cubic-bezier(.2,.7,.3,1);
  transition-delay:var(--rvd,0ms)}
.rv.rv-in{opacity:1;transform:none}
@media (prefers-reduced-motion: reduce){
  .rv{opacity:1;transform:none;transition:none}
}
