/* Santitos de Luz — sitio */
@font-face{font-family:Figtree;src:url(../fonts/Figtree-Medium.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:Figtree;src:url(../fonts/Figtree-Bold.woff2) format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:Figtree;src:url(../fonts/Figtree-ExtraBold.woff2) format("woff2");font-weight:800;font-display:swap}

:root{
  --cielo:#2E9BFF; --rayo:#6CBBFF; --sol:#FFC93C; --coral:#FF5D73; --noche:#1B2559; --nube:#FFFFFF;
  --crema:#FFF3C9; --piel:#FFD8B5; --tinta-suave:#3B4778;
  --linea:3px; --linea-g:4px;
  --r-s:12px; --r-m:20px; --r-l:28px;
  --ease-out:cubic-bezier(0.22,1,0.36,1);
  --sombra:0 10px 24px -8px rgba(27,37,89,.45);
  --pad:clamp(16px,4vw,40px);
  --ancho:1180px;
  --modal-open-dur:250ms; --modal-close-dur:150ms; --modal-scale:.96; --modal-scale-close:.96; --modal-ease:cubic-bezier(0.22,1,0.36,1);
  --acc-expand:250ms; --acc-collapse:250ms; --acc-chevron:250ms; --acc-ease:cubic-bezier(0.22,1,0.36,1);
  --check-opacity-dur:500ms; --check-rotate-dur:500ms; --check-rotate-from:80deg; --check-bob-dur:500ms; --check-y-amount:40px;
  --check-blur-dur:500ms; --check-blur-from:10px; --check-path-dur:500ms; --check-path-delay:80ms;
  --check-ease-out:cubic-bezier(0.22,1,0.36,1); --check-ease-bob:cubic-bezier(0.34,1.35,0.64,1);
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scrollbar-color:var(--noche) var(--crema)}
body{margin:0;font-family:Figtree,system-ui,sans-serif;font-weight:500;font-size:clamp(17px,1.1vw + 12px,19px);line-height:1.5;color:var(--noche);background:var(--cielo)}
img,svg,video{display:block;max-width:100%}
h1,h2,h3{margin:0;font-weight:800;line-height:1.02;letter-spacing:-.02em;text-wrap:balance}
p{margin:0}
a{color:inherit;text-underline-offset:.18em;text-decoration-thickness:2px}
::selection{background:var(--sol);color:var(--noche)}
:focus-visible{outline:var(--linea-g) solid var(--sol);outline-offset:3px;box-shadow:0 0 0 calc(var(--linea-g) + 3px) var(--noche)}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* Cielo con rayos, como el logo */
.cielo{position:relative;isolation:isolate;background:var(--cielo);overflow:hidden}
.cielo::before{content:"";position:absolute;inset:-40%;z-index:-1;
  background:repeating-conic-gradient(from -4deg at 50% 50%,rgba(108,187,255,.55) 0 9deg,transparent 9deg 25.7deg);
  transform:translateY(var(--rayos-y,-30%))}

/* Letra con contorno, como el logo */
.trazo{color:var(--nube);-webkit-text-stroke:.16em var(--noche);paint-order:stroke fill}
.trazo-sol{color:var(--sol);-webkit-text-stroke:.16em var(--noche);paint-order:stroke fill}

/* Cabecera */
.cab{position:relative;z-index:5;display:flex;align-items:center;justify-content:space-between;gap:16px;max-width:var(--ancho);margin:0 auto;padding:14px var(--pad)}
.cab .marca img{height:clamp(46px,6vw,64px);width:auto}
.nav{display:flex;gap:6px;align-items:center}
.nav a{font-weight:800;text-decoration:none;padding:9px 16px;border-radius:99px;border:var(--linea) solid transparent;transition:background-color 160ms var(--ease-out),border-color 160ms var(--ease-out)}
.nav a:hover{background:var(--nube);border-color:var(--noche)}
.nav a[aria-current="page"]{background:var(--sol);border-color:var(--noche)}
.menu-btn{display:none}
@media (max-width:1040px){
  .menu-btn{display:grid;place-items:center;width:48px;height:48px;border-radius:14px;background:var(--nube);border:var(--linea) solid var(--noche);cursor:pointer;color:var(--noche)}
  .nav{position:absolute;right:var(--pad);top:calc(100% - 4px);flex-direction:column;align-items:stretch;min-width:220px;padding:10px;
    background:var(--nube);border:var(--linea) solid var(--noche);border-radius:var(--r-m);box-shadow:var(--sombra);
    transform-origin:top right;transform:scale(.96);opacity:0;pointer-events:none;transition:transform 150ms var(--ease-out),opacity 150ms var(--ease-out)}
  .nav.abierto{transform:scale(1);opacity:1;pointer-events:auto;transition-duration:220ms}
  .nav a{font-size:20px;padding:12px 16px}
}

/* Botones */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:12px 24px;border-radius:99px;
  font:800 clamp(17px,1vw + 12px,20px)/1.1 Figtree,sans-serif;text-decoration:none;cursor:pointer;
  background:var(--coral);color:var(--noche);border:var(--linea) solid var(--noche);box-shadow:0 6px 14px -6px rgba(27,37,89,.6);
  transition:transform 180ms var(--ease-out),box-shadow 180ms var(--ease-out),background-color 180ms var(--ease-out)}
.btn:hover{transform:translateY(-2px);box-shadow:0 10px 20px -8px rgba(27,37,89,.65)}
.btn:active{transform:translateY(1px) scale(.98);box-shadow:0 3px 8px -4px rgba(27,37,89,.6)}
.btn.sol{background:var(--sol)}
.btn.blanco{background:var(--nube)}
.btn .precio{background:var(--nube);border:2px solid var(--noche);border-radius:99px;padding:3px 10px;font-size:.85em}
.btn.sol .precio,.btn.blanco .precio{background:var(--crema)}
.btn[disabled]{opacity:.55;cursor:not-allowed;transform:none}
.btn.pronto,.btn.pronto:hover,.btn.pronto:active{background:var(--crema);border-style:dashed;box-shadow:none;transform:none;cursor:default;white-space:nowrap}
.btn .flecha{transition:transform 200ms var(--ease-out)}
.btn:hover .flecha{transform:translateX(4px)}

/* ===== Calendario (inicio) ===== */
.calendario-wrap{max-width:var(--ancho);margin:0 auto;padding:8px var(--pad) clamp(40px,7vw,80px)}
.tablero{background:var(--noche);border-radius:var(--r-l);padding:clamp(16px,2.4vw,30px);box-shadow:0 24px 50px -24px rgba(10,16,48,.7)}
.tablero-cab{display:flex;flex-wrap:wrap;align-items:end;justify-content:space-between;gap:10px 24px;margin-bottom:clamp(14px,2vw,24px)}
.tablero h1{font-size:clamp(40px,6.4vw,84px)}
.tablero-cab p{color:var(--crema);font-weight:700;max-width:34ch;font-size:clamp(17px,1.2vw + 10px,21px)}
.aviso{margin-top:6px;color:var(--sol);font-weight:800}
.puertas{display:grid;grid-template-columns:repeat(8,1fr);gap:clamp(8px,1vw,14px);perspective:900px}
@media (max-width:760px){.puertas{grid-template-columns:repeat(4,1fr)}}
.puerta{position:relative;aspect-ratio:1;border:0;padding:0;background:transparent;cursor:pointer;font:inherit;color:var(--noche);border-radius:var(--r-s)}
.puerta .dentro{position:absolute;inset:0;border-radius:var(--r-s);background:var(--crema);border:var(--linea) solid var(--nube);display:grid;place-items:center;overflow:hidden}
.puerta .dentro img{width:78%;height:auto;transform:translateY(12%)}
.puerta .hoja{position:absolute;inset:0;border-radius:var(--r-s);background:var(--nube);border:var(--linea) solid var(--noche);
  display:grid;place-items:center;transform-origin:left center;transform-style:preserve-3d;backface-visibility:hidden;
  box-shadow:inset 0 0 0 5px var(--nube),inset 0 0 0 7px rgba(27,37,89,.12)}
.puerta .num{font-weight:800;font-size:clamp(24px,3vw,40px);letter-spacing:-.03em}
.puerta .pomo{position:absolute;right:12%;top:50%;width:9%;aspect-ratio:1;border-radius:50%;background:var(--sol);border:2px solid var(--noche)}
.puerta.abierta .hoja{transform:rotateY(-108deg);box-shadow:none}
.puerta.abierta .dentro{background:var(--crema)}
.puerta.cerrada{cursor:default;white-space:nowrap}
.puerta.cerrada .hoja{background:#E8EEFF}
.puerta.cerrada .num{opacity:.55}
.puerta.cerrada .pomo{background:#C9D3F2}
.puerta.hoy{grid-column:span 2;grid-row:span 2;aspect-ratio:auto}
.puerta.hoy .hoja{background:var(--sol);border-width:var(--linea-g)}
.puerta.hoy .num{font-size:clamp(56px,8vw,110px)}
.puerta.hoy .hoja::after{content:"¡Ábreme!";position:absolute;bottom:10%;font-weight:800;font-size:clamp(15px,1.4vw,20px);background:var(--nube);border:2px solid var(--noche);border-radius:99px;padding:3px 12px}
.puerta.hoy:not(.abierta) .hoja{animation:latido 2.4s var(--ease-out) infinite}
@keyframes latido{0%,70%,100%{transform:rotateY(0)}80%{transform:rotateY(-14deg)}90%{transform:rotateY(-4deg)}}
.puerta:not(.cerrada):hover .hoja{transform:rotateY(-18deg)}
.puerta.abierta:hover .hoja{transform:rotateY(-108deg)}
.puerta.sacude{animation:sacude 360ms cubic-bezier(.36,.07,.19,.97)}
@keyframes sacude{20%{transform:translateX(-5px)}40%{transform:translateX(5px)}60%{transform:translateX(-3px)}80%{transform:translateX(2px)}}
.puerta .hoja{transition:transform 420ms var(--ease-out)}

/* Toast */
.toast{position:fixed;left:50%;bottom:24px;z-index:60;translate:-50% 0;max-width:min(92vw,460px);padding:14px 20px;border-radius:var(--r-m);
  background:var(--noche);color:var(--nube);font-weight:700;border:var(--linea) solid var(--nube);box-shadow:var(--sombra);
  opacity:0;transform:translateY(16px);filter:blur(4px);pointer-events:none;transition:opacity 160ms ease,transform 160ms ease,filter 160ms ease}
.toast.ve{opacity:1;transform:none;filter:none;transition:opacity 280ms var(--ease-out),transform 280ms var(--ease-out),filter 280ms var(--ease-out)}

/* Ventana del santo (dialog) */
.santo-dlg{border:0;padding:0;background:transparent;max-width:min(94vw,560px);width:100%;max-height:92vh;overflow:visible}
.santo-dlg::backdrop{background:rgba(27,37,89,.72)}
.t-modal{transform-origin:center;transform:scale(var(--modal-scale));opacity:0;transition:transform var(--modal-open-dur) var(--modal-ease),opacity var(--modal-open-dur) var(--modal-ease)}
.t-modal.is-open{transform:scale(1);opacity:1}
.t-modal.is-closing{transform:scale(var(--modal-scale-close));opacity:0;transition:transform var(--modal-close-dur) var(--modal-ease),opacity var(--modal-close-dur) var(--modal-ease)}
.ficha{position:relative;background:var(--nube);border:var(--linea-g) solid var(--noche);border-radius:var(--r-l);overflow:auto;max-height:92vh}
.ficha-arte{position:relative;display:grid;place-items:center;padding:28px 0 0;height:220px;overflow:hidden}
.ficha-arte img{width:200px;height:auto;position:relative;transform:translateY(14px)}
.ficha-arte .fecha{position:absolute;left:16px;top:14px;background:var(--sol);border:var(--linea) solid var(--noche);border-radius:99px;padding:4px 14px;font-weight:800;font-size:16px}
.ficha-texto{padding:20px clamp(18px,4vw,30px) 26px;border-top:var(--linea-g) solid var(--noche)}
.ficha h2{font-size:clamp(30px,5vw,40px)}
.ficha .cuento{margin-top:10px;font-size:19px}
.oracion{margin-top:16px;background:var(--crema);border-radius:var(--r-m);padding:14px 18px;font-weight:700;font-size:19px}
.oracion b{display:block;font-size:15px;letter-spacing:.02em;color:var(--tinta-suave);margin-bottom:2px}
.cerrar{position:absolute;right:12px;top:12px;z-index:2;width:48px;height:48px;border-radius:50%;background:var(--nube);border:var(--linea) solid var(--noche);display:grid;place-items:center;cursor:pointer;color:var(--noche)}
.cerrar:hover{background:var(--sol)}
.ficha .acciones{margin-top:18px;display:grid;gap:12px}
.ficha .kit-link{font-weight:700;text-align:center}

/* Lámina por correo */
.lamina{border:var(--linea) solid var(--noche);border-radius:var(--r-m);background:var(--nube)}
.lamina .t-acc-head{width:100%;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 18px;border:0;background:transparent;font:800 19px/1.2 Figtree,sans-serif;color:var(--noche);cursor:pointer;text-align:left}
.t-acc-panel{display:grid;grid-template-rows:0fr;transition:grid-template-rows var(--acc-collapse) var(--acc-ease)}
.t-acc[data-open="true"] .t-acc-panel{grid-template-rows:1fr;transition:grid-template-rows var(--acc-expand) var(--acc-ease)}
.t-acc-panel-inner{overflow:hidden;opacity:0;filter:blur(2px);transition:opacity var(--acc-collapse) var(--acc-ease),filter var(--acc-collapse) var(--acc-ease)}
.t-acc[data-open="true"] .t-acc-panel-inner{opacity:1;filter:blur(0);transition:opacity var(--acc-expand) var(--acc-ease),filter var(--acc-expand) var(--acc-ease)}
.t-acc-chevron{display:inline-flex;transform:scaleY(1);transition:transform var(--acc-chevron) var(--acc-ease)}
.t-acc-chevron svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.t-acc-chevron path{vector-effect:non-scaling-stroke}
.t-acc[data-open="true"] .t-acc-chevron{transform:scaleY(-1)}
.form-correo{display:grid;gap:10px;padding:0 18px 18px}
.form-correo label{font-weight:700;font-size:16px}
.campo{width:100%;min-height:52px;padding:12px 18px;border-radius:99px;border:var(--linea) solid var(--noche);font:600 18px Figtree,sans-serif;color:var(--noche);background:var(--nube);caret-color:var(--coral)}
.campo::placeholder{color:#5C6690}
.campo:focus-visible{outline:none;box-shadow:0 0 0 4px var(--sol)}
.campo.error{border-color:#C8102E;animation:sacude 360ms cubic-bezier(.36,.07,.19,.97)}
.form-msg{font-weight:700;font-size:16px;min-height:1.4em}
.form-msg.mal{color:#B00020}
.nota{font-size:15px;color:var(--tinta-suave)}
.listo{display:flex;align-items:center;gap:12px;padding:6px 0;font-weight:800}
.t-success-check{display:inline-block;transform-origin:center;opacity:0}
.t-success-check svg{display:block;overflow:visible;width:44px;height:44px}
.t-success-check svg path{stroke-dasharray:40;stroke-dashoffset:40}
.t-success-check[data-state="in"]{animation:t-check-fade var(--check-opacity-dur) var(--check-ease-out) forwards,t-check-rotate var(--check-rotate-dur) var(--check-ease-out) forwards,t-check-blur var(--check-blur-dur) var(--check-ease-out) forwards,t-check-bob var(--check-bob-dur) var(--check-ease-bob) forwards}
.t-success-check[data-state="in"] svg path{animation:t-check-draw var(--check-path-dur) var(--check-ease-out) var(--check-path-delay) forwards}
@keyframes t-check-fade{from{opacity:0}to{opacity:1}}
@keyframes t-check-rotate{from{transform:rotate(var(--check-rotate-from))}to{transform:rotate(0)}}
@keyframes t-check-blur{from{filter:blur(var(--check-blur-from))}to{filter:blur(0)}}
@keyframes t-check-bob{from{translate:0 var(--check-y-amount)}to{translate:0 0}}
@keyframes t-check-draw{to{stroke-dashoffset:0}}

/* ===== Secciones ===== */
.seccion{padding:clamp(64px,9vw,120px) var(--pad)}
.seccion .caja{max-width:var(--ancho);margin:0 auto}
.seccion h2{font-size:clamp(36px,5vw,64px)}
.seccion .bajada{margin-top:14px;max-width:46ch;font-size:clamp(18px,1vw + 12px,21px)}
.sol-bg{background:var(--sol)}
.crema-bg{background:var(--crema)}
.noche-bg{background:var(--noche);color:var(--nube)}
.noche-bg .bajada{color:var(--crema)}

/* Kit de Adviento */
.kit{display:grid;grid-template-columns:1.05fr 1fr;gap:clamp(28px,5vw,72px);align-items:center}
@media (max-width:860px){.kit{grid-template-columns:1fr}}
.kit-hoja{transform:rotate(-3deg);filter:drop-shadow(0 22px 26px rgba(27,37,89,.35))}
.kit ul{list-style:none;padding:0;margin:20px 0 26px;display:grid;gap:10px}
.kit li{display:flex;gap:12px;align-items:flex-start;font-weight:700}
.kit li svg{flex:none;width:26px;height:26px;margin-top:1px}

/* El santo de tu nombre */
.nombre{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(28px,5vw,72px);align-items:center}
@media (max-width:860px){.nombre{grid-template-columns:1fr}}
.escena{position:relative;aspect-ratio:1;max-width:520px;width:100%;margin:0 auto;border-radius:50%;background:var(--cielo);border:var(--linea-g) solid var(--nube);overflow:hidden;isolation:isolate}
.escena::before{content:"";position:absolute;inset:-20%;z-index:-1;background:repeating-conic-gradient(from 0deg at 50% 60%,rgba(108,187,255,.6) 0 9deg,transparent 9deg 25.7deg)}
.escena img{position:absolute;left:50%;bottom:-6%;width:62%;translate:-50% 0}
.globo{position:absolute;left:50%;top:7%;translate:-50% 0;max-width:86%;background:var(--nube);border:var(--linea-g) solid var(--noche);border-radius:26px;padding:10px 22px;
  font-weight:800;font-size:clamp(24px,3.6vw,40px);line-height:1.05;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.globo::after{content:"";position:absolute;left:50%;bottom:-16px;width:24px;height:24px;background:var(--nube);border-right:var(--linea-g) solid var(--noche);border-bottom:var(--linea-g) solid var(--noche);transform:translateX(-50%) rotate(45deg)}
.nombre-form{margin-top:24px;display:flex;flex-wrap:wrap;gap:10px}
.nombre-form .campo{flex:1 1 220px}
.ejemplo{margin-top:10px;font-size:15px;color:var(--crema)}
.precios{margin-top:22px;display:flex;flex-wrap:wrap;gap:12px}

/* Último video */
.video-bloque{display:grid;grid-template-columns:minmax(0,360px) 1fr;gap:clamp(28px,5vw,72px);align-items:center}
@media (max-width:760px){.video-bloque{grid-template-columns:1fr}}
.pantalla{border:var(--linea-g) solid var(--noche);border-radius:var(--r-l);overflow:hidden;background:var(--noche);aspect-ratio:9/16;max-width:360px;width:100%;margin:0 auto}
.pantalla video{width:100%;height:100%;object-fit:cover}

/* Pie */
.pie{background:var(--noche);color:var(--nube);padding:56px var(--pad) 40px}
.pie .caja{max-width:var(--ancho);margin:0 auto;display:flex;flex-wrap:wrap;gap:28px;justify-content:space-between;align-items:center}
.pie .adios{font-size:clamp(26px,3.4vw,40px)}
.pie nav{display:flex;flex-wrap:wrap;gap:8px 20px;font-weight:700}
.pie small{display:block;width:100%;color:#C9D3F2;font-size:14px;margin-top:8px}

/* Páginas internas */
.portada{padding:clamp(28px,5vw,60px) var(--pad) clamp(48px,7vw,90px)}
.portada .caja{max-width:var(--ancho);margin:0 auto}
.portada h1{font-size:clamp(44px,7vw,92px)}
.portada .bajada{margin-top:14px;max-width:44ch;font-size:clamp(18px,1vw + 12px,22px);font-weight:700;color:var(--noche)}

/* Tienda: filas de producto, no tarjetas iguales */
.productos{list-style:none;margin:0;padding:0}
.producto{display:grid;grid-template-columns:140px 1fr auto;gap:clamp(16px,3vw,40px);align-items:center;padding:clamp(24px,3vw,36px) 0;border-top:var(--linea) solid var(--noche)}
.producto:last-child{border-bottom:var(--linea) solid var(--noche)}
.producto h2{font-size:clamp(28px,3vw,40px)}
.producto p{margin-top:6px;max-width:52ch}
.producto .ico{width:140px;height:140px}
@media (max-width:760px){.producto{grid-template-columns:84px 1fr}.producto .ico{width:84px;height:84px}.producto .btn{grid-column:1 / -1}}
.preguntas{max-width:760px;display:grid;gap:12px;margin-top:28px}
.preguntas .t-acc{background:var(--nube);border:var(--linea) solid var(--noche);border-radius:var(--r-m);color:var(--noche)}
.preguntas .t-acc-panel-inner p{padding:0 18px 18px}

/* Santo (página) */
.santo-pag{display:grid;grid-template-columns:minmax(0,380px) 1fr;gap:clamp(28px,5vw,72px);align-items:start}
@media (max-width:860px){.santo-pag{grid-template-columns:1fr}}
.santo-pag .historia{display:grid;gap:14px;max-width:60ch;font-size:19px}
.santo-pag .historia h2{font-size:clamp(28px,3vw,38px);margin-top:12px}
.lista-santos{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:clamp(16px,2vw,28px)}
.estampa{display:block;text-decoration:none;background:var(--nube);border:var(--linea-g) solid var(--noche);border-radius:var(--r-m);overflow:hidden;transition:transform 220ms var(--ease-out),box-shadow 220ms var(--ease-out)}
.estampa:hover{transform:translateY(-4px) rotate(-1deg);box-shadow:var(--sombra)}
.estampa img{display:block;aspect-ratio:4/5;object-fit:cover;object-position:top;width:100%;height:auto}
.estampa span{display:block;padding:12px 16px;font-weight:800;font-size:22px;border-top:var(--linea-g) solid var(--noche)}
.estampa.pronto{display:grid;place-items:center;min-height:300px;background:transparent;border-style:dashed;border-color:var(--noche);color:var(--noche);font-weight:800;font-size:20px;text-align:center;padding:20px}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  .t-success-check{opacity:1}.t-success-check svg path{stroke-dashoffset:0!important}
}
.preguntas .t-acc-head{width:100%;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:16px 18px;border:0;background:none;font:800 19px/1.25 Figtree,sans-serif;color:inherit;cursor:pointer;text-align:left}

/* Ajustes tras la primera revisión */
.tablero h1{color:var(--nube);-webkit-text-stroke:0}
.tablero h1 em{font-style:normal;color:var(--sol)}
.tablero-cab{display:grid;grid-template-columns:1fr;gap:10px}
.tablero-cab .lineas{display:flex;flex-wrap:wrap;gap:8px 28px;align-items:baseline}
.aviso:empty{display:none}
.aviso{margin:0;background:var(--sol);color:var(--noche);border-radius:99px;padding:6px 16px;font-size:clamp(15px,1vw + 8px,18px)}
.puertas{grid-template-columns:repeat(9,1fr);grid-auto-flow:row dense}
@media (max-width:760px){.puertas{grid-template-columns:repeat(4,1fr)}}
.puerta .hoja,.puerta .dentro{border-radius:46% 46% 10px 10px / 30% 30% 10px 10px}
.puerta .hoja{background:var(--c,var(--nube));box-shadow:inset 0 0 0 5px rgba(255,255,255,.35)}
.puerta:nth-child(4n+2){--c:var(--coral)}
.puerta:nth-child(4n+3){--c:var(--rayo)}
.puerta:nth-child(4n){--c:var(--crema)}
.puerta.cerrada .hoja{background:var(--c,var(--nube))}
.puerta.cerrada .num{opacity:1}
.puerta .num{transform:translateY(8%)}
.puerta .pomo{right:13%;width:12%;background:var(--sol);border:2.5px solid var(--noche)}
.puerta.cerrada .pomo{background:var(--sol)}
.puerta.hoy .hoja{background:var(--sol)}
.puerta.hoy .pomo{background:var(--nube)}
.estrella{display:none}
@media (max-width:760px){.estrella{display:grid;place-items:center}.estrella svg{width:62%}}
.tablero-cab .aviso{color:var(--noche);max-width:none}
.puerta .num{transform:translate(-12%,8%)}
.puerta.hoy .num{transform:translate(-8%,-4%)}
.puerta.abierta .hoja{visibility:hidden}
.escena{overflow:visible;border:0;background:none}
.escena::before{content:none}
.disco{position:absolute;inset:0;border-radius:50%;overflow:hidden;background:var(--cielo);border:var(--linea-g) solid var(--nube);isolation:isolate}
.disco::before{content:"";position:absolute;inset:-20%;z-index:-1;background:repeating-conic-gradient(from 0deg at 50% 60%,rgba(108,187,255,.6) 0 9deg,transparent 9deg 25.7deg)}
.disco img{position:absolute;left:50%;bottom:-8%;width:58%;translate:-50% 0}
.globo{color:var(--noche);top:-4%;z-index:2}
.crema-bg .oracion{background:var(--nube);border:var(--linea) solid var(--noche)}
.btn .precio{font-size:15px}
.lamina .t-acc-head,.preguntas .t-acc-head{line-height:1.32}
.nombre-label{display:block;width:100%;font-weight:700;color:var(--crema);font-size:17px}

/* Páginas de texto (privacidad) */
.texto-legal{max-width:720px}
.texto-legal h2{font-size:clamp(1.25rem,2.4vw,1.6rem);font-weight:800;margin:2rem 0 .5rem}
.texto-legal h2:first-child{margin-top:0}
.texto-legal p{font-size:1.05rem;line-height:1.6;margin:0 0 .8rem}
.texto-legal a{color:inherit;font-weight:700}
.form-correo .nota a{color:inherit;font-weight:700}

/* Packs de santos: la colección destacada y una tarjeta por pack */
.packs-sec{background:var(--nube)}
.coleccion{margin-top:clamp(28px,4vw,48px);display:grid;grid-template-columns:minmax(0,1.1fr) 1fr;gap:clamp(24px,4vw,56px);align-items:center;background:var(--sol);border:var(--linea-g) solid var(--noche);border-radius:var(--r-l);padding:clamp(18px,3vw,36px);box-shadow:0 18px 40px -22px rgba(27,37,89,.6)}
@media (max-width:860px){.coleccion{grid-template-columns:1fr}}
.coleccion>img{width:100%;height:auto;border:var(--linea) solid var(--noche);border-radius:var(--r-m);transform:rotate(-1.5deg);background:var(--nube)}
.coleccion h3{font-size:clamp(28px,3vw,40px);line-height:1.08;font-weight:800;margin:0}
.coleccion .sello{display:inline-block;margin:0 0 12px;background:var(--coral);color:var(--noche);font-weight:800;font-size:16px;border:var(--linea) solid var(--noche);border-radius:99px;padding:4px 14px;transform:rotate(-2deg)}
.coleccion ul{list-style:none;padding:0;margin:18px 0 24px;display:grid;gap:10px}
.coleccion li{display:flex;gap:12px;align-items:flex-start;font-weight:700}
.coleccion li img{flex:none;width:26px;height:26px;margin-top:1px}
.packs{list-style:none;padding:0;margin:clamp(24px,3vw,36px) 0 0;display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:clamp(16px,2vw,28px)}
.pack-card{background:var(--tono,var(--crema));border:var(--linea-g) solid var(--noche);border-radius:var(--r-m);overflow:hidden;display:flex;flex-direction:column;transition:transform 220ms var(--ease-out),box-shadow 220ms var(--ease-out)}
.pack-card:hover{transform:translateY(-4px);box-shadow:var(--sombra)}
.pack-card img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border-bottom:var(--linea-g) solid var(--noche)}
.pack-txt{padding:18px 20px 22px;display:flex;flex-direction:column;gap:6px;flex:1}
.pack-txt h3{font-size:24px;line-height:1.1;font-weight:800;margin:0}
.pack-txt p{flex:1;margin:0}
.pack-txt .btn{align-self:flex-start;margin-top:10px}
/* El pack en la página de cada santo */
.pack-santo{margin-top:18px;display:grid;grid-template-columns:200px 1fr;gap:20px;align-items:center;background:var(--nube);border:var(--linea) solid var(--noche);border-radius:var(--r-m);padding:16px}
@media (max-width:560px){.pack-santo{grid-template-columns:1fr}}
.pack-santo img{display:block;width:100%;height:auto;border-radius:12px;border:var(--linea) solid var(--noche)}
.pack-santo h3{font-size:24px;font-weight:800;margin:0}
.pack-santo p{margin:6px 0 0;font-size:17px}
.pack-santo .acciones-pack{display:flex;flex-wrap:wrap;gap:10px 18px;align-items:center;margin-top:12px}
.mas-link{color:inherit;font-weight:700;font-size:16px}
.santo-img{margin:0 auto;border:var(--linea-g) solid var(--noche);border-radius:var(--r-l);overflow:hidden;max-width:380px;width:100%;box-shadow:var(--sombra);transform:rotate(-1.5deg)}
.santo-img img{display:block;width:100%;height:auto}

/* ===== Conexión con las familias (2026-11-12) ===== */
.pie .escribenos{margin-top:10px;max-width:46ch;color:var(--crema);font-weight:700}
.pie .escribenos a{color:var(--sol)}

/* Tu santo amigo: el resultado del buscador */
.amigo-res{display:grid;gap:6px;margin-top:14px;background:var(--nube);color:var(--noche);border:var(--linea) solid var(--noche);border-radius:var(--r-m);padding:16px 18px;box-shadow:var(--sombra)}
.amigo-res.corto{display:block;width:100%;margin-top:4px;padding:10px 16px;font-size:17px;box-shadow:none}
.amigo-res.entra{animation:amigo-entra 420ms var(--ease-out)}
@keyframes amigo-entra{from{opacity:0;transform:translateY(8px) scale(.98);filter:blur(3px)}to{opacity:1;transform:none;filter:none}}
.amigo-de{font-weight:700;color:var(--tinta-suave);font-size:16px}
.amigo-santo{font-size:clamp(24px,2.4vw,32px);font-weight:800;line-height:1.1}
.amigo-frase{font-size:18px}
.amigo-fiesta{justify-self:start;background:var(--sol);border:2px solid var(--noche);border-radius:99px;padding:3px 12px;font-weight:800;font-size:15px}
.amigo-pag{font-weight:800}
.amigo-top{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(28px,5vw,72px);align-items:center}
@media (max-width:860px){.amigo-top{grid-template-columns:1fr}.amigo-top .escena{max-width:300px}}
.amigo-top .escena{margin-top:40px}
.buscador{margin-top:26px;max-width:520px;display:grid;gap:8px}
.buscador label{font-weight:800;font-size:19px}

/* Lo que vive en su video */
.momentos{list-style:none;counter-reset:m;padding:0;margin:clamp(24px,3vw,40px) 0 0;display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:clamp(14px,2vw,24px)}
.momentos li{counter-increment:m;position:relative;background:var(--nube);border:var(--linea) solid var(--noche);border-radius:var(--r-m);padding:52px 18px 20px;font-size:17px}
.momentos li::before{content:counter(m);position:absolute;left:16px;top:-18px;width:52px;height:52px;display:grid;place-items:center;border-radius:50%;background:var(--sol);border:var(--linea) solid var(--noche);font-weight:800;font-size:24px}
.momentos b{display:block;font-size:20px;margin-bottom:4px}
.para-ti{margin-top:24px;display:flex;gap:12px;align-items:flex-start;font-size:18px;max-width:60ch}
.para-ti img{flex:none;margin-top:2px}

/* Las tres opciones */
.niveles{list-style:none;padding:0;margin:clamp(28px,4vw,48px) 0 0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2vw,28px);align-items:stretch}
@media (max-width:900px){.niveles{grid-template-columns:1fr;max-width:520px}}
.nivel{position:relative;display:flex;flex-direction:column;background:var(--crema);border:var(--linea-g) solid var(--noche);border-radius:var(--r-l);padding:28px 24px 24px}
.nivel.destacado{background:var(--sol);box-shadow:0 18px 40px -22px rgba(27,37,89,.6)}
@media (min-width:901px){.nivel.destacado{transform:translateY(-12px)}}
.nivel .sello{position:absolute;top:-18px;left:20px;background:var(--coral);border:var(--linea) solid var(--noche);border-radius:99px;padding:4px 14px;font-weight:800;font-size:15px;transform:rotate(-2deg)}
.nivel h3{font-size:clamp(24px,2.2vw,30px)}
.nivel-precio{margin-top:10px;font-weight:800;font-size:18px}
.nivel-precio b{font-size:clamp(44px,4vw,56px);letter-spacing:-.03em;line-height:1}
.nivel-cuando{font-weight:700;color:var(--tinta-suave)}
.nivel ul{list-style:none;padding:0;margin:16px 0 22px;display:grid;gap:8px;flex:1;align-content:start}
.nivel li{display:flex;gap:10px;align-items:flex-start;font-weight:700;font-size:17px}
.nivel li img{flex:none;width:22px;height:22px;margin-top:2px}
.nivel .btn{align-self:stretch}

/* Cómo lo hacemos */
.pasos{list-style:none;padding:0;margin:clamp(24px,3vw,40px) 0 0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,3vw,40px)}
@media (max-width:860px){.pasos{grid-template-columns:1fr}}
.pasos h3{font-size:24px;margin:12px 0 6px}
.paso-n{display:grid;place-items:center;width:56px;height:56px;border-radius:50%;background:var(--nube);border:var(--linea) solid var(--noche);font-weight:800;font-size:26px}
.promesa{margin-top:clamp(28px,4vw,44px);background:var(--nube);border:var(--linea) solid var(--noche);border-radius:var(--r-m);padding:16px 20px;font-size:19px;max-width:60ch}
.cara{max-width:760px}
.cara .bajada{max-width:56ch}

/* Para rezar esta noche */
.noche-caja{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(28px,5vw,72px);align-items:center}
@media (max-width:860px){.noche-caja{grid-template-columns:1fr}}
.tres{margin:20px 0 26px;padding:0;list-style:none;display:grid;gap:10px;counter-reset:t}
.tres li{counter-increment:t;display:flex;gap:12px;align-items:baseline;font-size:19px;color:var(--crema)}
.tres li::before{content:counter(t);flex:none;display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--sol);color:var(--noche);font-weight:800;transform:translateY(-2px)}
.tres b{color:var(--nube)}
.oracion.grande{margin:0;background:var(--crema);color:var(--noche);border:var(--linea-g) solid var(--nube);border-radius:var(--r-l);padding:clamp(22px,3vw,36px);font-size:clamp(21px,1.6vw + 10px,28px);line-height:1.35}
.oracion.grande b{font-size:16px}

/* Hecho con cariño (inicio) */
.carino{display:grid;grid-template-columns:minmax(0,260px) 1fr;gap:clamp(24px,5vw,64px);align-items:center}
.carino img{width:100%;max-width:260px;height:auto;margin:0 auto}
@media (max-width:760px){.carino{grid-template-columns:1fr}.carino img{max-width:170px}}

/* Oraciones */
.oraciones{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:clamp(16px,2vw,28px)}
.ora{background:var(--nube);border:var(--linea) solid var(--noche);border-radius:var(--r-m);padding:22px 22px 24px}
.ora-cuando{display:inline-block;background:var(--sol);border:2px solid var(--noche);border-radius:99px;padding:2px 12px;font-weight:800;font-size:15px}
.ora h3{font-size:clamp(24px,2.2vw,30px);margin:12px 0 8px}
.ora p:last-child{font-size:19px;font-weight:600;line-height:1.55}

/* Nosotros */
.carta{position:relative;max-width:720px;margin:0 auto;background:var(--nube);border:var(--linea-g) solid var(--noche);border-radius:var(--r-l);padding:clamp(26px,5vw,56px) clamp(22px,5vw,60px) clamp(120px,14vw,150px);box-shadow:var(--sombra);display:grid;gap:16px;font-size:clamp(18px,1vw + 12px,21px);line-height:1.6;transform:rotate(-.6deg)}
.carta .saludo{font-weight:800;font-size:1.15em}
.carta .firma{margin-top:8px}
.carta img{position:absolute;right:clamp(14px,4vw,40px);bottom:-10px;width:clamp(100px,14vw,140px);height:auto}
.promesas{list-style:none;padding:0;margin:clamp(24px,3vw,40px) 0 0;display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:clamp(20px,3vw,36px) clamp(20px,4vw,48px)}
.promesas li{border-top:var(--linea-g) solid var(--noche);padding-top:16px}
.promesas h3{font-size:clamp(22px,2vw,26px);margin-bottom:6px}
.tres li{display:block;position:relative;padding-left:46px}
.tres li::before{position:absolute;left:0;top:-2px;transform:none}
.amigo-res[hidden]{display:none}

/* ===== Estampas de santos: animación al pasar (2026-11-12) ===== */
.lista-santos{perspective:900px}
.estampa{position:relative;isolation:isolate;transform-style:preserve-3d;
  transform:rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) translateY(var(--ty,0px));
  transition:transform 380ms var(--ease-out),box-shadow 380ms var(--ease-out)}
.estampa:hover{--ty:-8px;transform:rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) translateY(var(--ty));box-shadow:0 22px 34px -14px rgba(27,37,89,.55)}
.estampa.siguiendo{transition:transform 90ms linear,box-shadow 380ms var(--ease-out)}
.estampa img{transition:transform 600ms var(--ease-out),filter 600ms var(--ease-out)}
.estampa:hover img{transform:scale(1.06);filter:saturate(1.15)}
/* El brillo que cruza la estampa */
.estampa::before{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;border-radius:inherit;
  background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,.55) 45%,rgba(255,243,201,.35) 52%,transparent 66%);
  transform:translateX(-120%);opacity:0}
.estampa:hover::before{animation:brillo 900ms var(--ease-out) forwards}
@keyframes brillo{0%{transform:translateX(-120%);opacity:1}100%{transform:translateX(120%);opacity:1}}
/* La aureola y las estrellitas */
.estampa .aura{position:absolute;left:50%;top:10px;z-index:3;width:46%;aspect-ratio:3.2;translate:-50% 0;border-radius:50%;
  border:6px solid var(--sol);box-shadow:0 0 0 3px var(--noche),0 0 26px 8px rgba(255,201,60,.75);
  opacity:0;transform:translateY(14px) scale(.6);transition:opacity 260ms var(--ease-out),transform 520ms cubic-bezier(.34,1.56,.64,1);pointer-events:none}
.estampa:hover .aura{opacity:1;transform:translateY(0) scale(1);animation:flota 2.2s ease-in-out 520ms infinite}
@keyframes flota{50%{transform:translateY(-5px) scale(1.02)}}
.estampa .chispa{position:absolute;z-index:3;width:22px;height:22px;pointer-events:none;opacity:0;transform:scale(0) rotate(-40deg);
  transition:opacity 200ms ease,transform 460ms cubic-bezier(.34,1.56,.64,1)}
.estampa .chispa svg{width:100%;height:100%;overflow:visible}
.estampa .chispa.c1{left:12%;top:16%}
.estampa .chispa.c2{right:12%;top:26%;width:16px;height:16px;transition-delay:80ms}
.estampa .chispa.c3{right:22%;top:8%;width:12px;height:12px;transition-delay:150ms}
.estampa:hover .chispa{opacity:1;transform:scale(1) rotate(0)}
.estampa:hover .chispa.c1{animation:titila 1.4s ease-in-out 500ms infinite}
.estampa:hover .chispa.c2{animation:titila 1.4s ease-in-out 800ms infinite}
@keyframes titila{50%{transform:scale(.7) rotate(20deg)}}
.estampa span{position:relative;z-index:3;background:var(--nube);transition:background-color 260ms var(--ease-out)}
.estampa:hover span{background:var(--sol)}
.estampa span::after{content:" →";display:inline-block;opacity:0;transform:translateX(-6px);transition:opacity 220ms ease,transform 260ms var(--ease-out)}
.estampa:hover span::after{opacity:1;transform:none}
/* En el celular: las estampas entran saltando al aparecer */
.lista-santos.anima li{opacity:0;transform:translateY(26px) scale(.94) rotate(-1.5deg)}
.lista-santos.anima li.ve{opacity:1;transform:none;transition:opacity 420ms var(--ease-out),transform 620ms cubic-bezier(.34,1.56,.64,1);transition-delay:calc(var(--i,0) * 90ms)}
.lista-santos.anima li.ve .estampa .aura{animation:aura-entra 1.6s var(--ease-out) calc(var(--i,0) * 90ms + 300ms) 1}
@keyframes aura-entra{0%{opacity:0;transform:translateY(14px) scale(.6)}35%{opacity:1;transform:none}75%{opacity:1}100%{opacity:0}}
@media (prefers-reduced-motion:reduce){.lista-santos.anima li{opacity:1;transform:none}}

/* ===== El santo de hoy (inicio) ===== */
.hoy-wrap{max-width:var(--ancho);margin:0 auto;padding:0 var(--pad) clamp(48px,7vw,90px)}
.hoy-wrap[hidden]{display:none}
.hoy{display:grid;grid-template-columns:minmax(0,260px) 1fr;gap:clamp(20px,4vw,56px);align-items:center;background:var(--nube);border:var(--linea-g) solid var(--noche);border-radius:var(--r-l);padding:clamp(20px,3vw,36px);box-shadow:0 24px 50px -24px rgba(10,16,48,.7)}
@media (max-width:760px){.hoy{grid-template-columns:1fr;text-align:center}.hoy .escena{max-width:190px}.hoy-acciones{justify-content:center}}
.hoy .escena{max-width:260px}
.hoy .disco img{width:66%}
.hoy-fecha{display:inline-block;background:var(--sol);border:var(--linea) solid var(--noche);border-radius:99px;padding:4px 14px;font-weight:800;font-size:16px}
.hoy-que{margin-top:12px;font-weight:800;color:var(--tinta-suave);font-size:17px;letter-spacing:.02em}
.hoy-quien{font-size:clamp(32px,4.4vw,56px);margin-top:2px}
.hoy-frase{margin-top:10px;font-size:clamp(18px,1vw + 12px,21px);max-width:52ch}
@media (max-width:760px){.hoy-frase{margin-inline:auto}}
.hoy-acciones{margin-top:20px;display:flex;flex-wrap:wrap;gap:12px}
a.estampa{height:100%;display:flex;flex-direction:column}
a.estampa span{flex:1}
.estampa span::after{content:"→";margin-left:.3em}
.hoy .disco img{width:54%;bottom:-22%}

/* Menú del celular: por encima de todo y sin recortarse (el cielo recorta sus rayos con overflow:hidden) */
.cielo:has(.nav.abierto){z-index:20}
@media (max-width:1040px){
  .nav{position:fixed;top:var(--nav-top,84px);right:var(--pad);z-index:60;max-height:calc(100dvh - var(--nav-top,84px) - 16px);overflow-y:auto;overscroll-behavior:contain;min-width:min(260px,calc(100vw - 2 * var(--pad)))}
  .nav a{padding:11px 16px}
}

/* ===== Revisión completa (2026-11-12): suavidad, orden y sin saltos ===== */
/* El calendario guarda su sitio antes de dibujarse (evita que la página salte al cargar) */
.puertas:empty{aspect-ratio:9/3.15}
@media (max-width:760px){.puertas:empty{aspect-ratio:4/7.3}}

/* Secciones con bordes redondeados que se montan suavemente sobre la anterior */
.seccion,.pie{--curva:clamp(28px,4vw,48px);position:relative;border-radius:var(--curva) var(--curva) 0 0;margin-top:calc(-1 * var(--curva));
  padding-top:calc(clamp(64px,9vw,120px) + var(--curva) * .5);box-shadow:0 -14px 30px -18px rgba(27,37,89,.28)}
.pie{padding-top:calc(56px + var(--curva) * .5)}
.noche-bg,.pie{box-shadow:0 -14px 30px -16px rgba(10,16,48,.45)}

/* Encabezado de sección con su enlace a un lado */
.cab-seccion{display:flex;flex-wrap:wrap;align-items:end;justify-content:space-between;gap:16px 24px;margin-bottom:clamp(24px,3vw,40px)}
.cab-seccion .bajada{margin-top:10px}

/* «Hecho con cariño»: franja tranquila, sin competir con lo demás */
.carino-franja{background:var(--nube);padding-bottom:calc(clamp(48px,6vw,80px) + 48px)}
.carino-franja .carino{grid-template-columns:120px 1fr auto;gap:clamp(18px,3vw,40px)}
.carino-franja .carino img{max-width:120px}
.carino-franja h2{font-size:clamp(28px,3vw,40px)}
.carino-franja .bajada{max-width:58ch}
@media (max-width:760px){.carino-franja .carino{grid-template-columns:1fr;text-align:center;justify-items:center}.carino-franja .carino img{max-width:100px}}

/* Toques cómodos en el celular: enlaces del pie y enlaces sueltos */
.pie nav a{display:inline-block;padding:8px 2px}
.mas-link{display:inline-block;padding:10px 0}

/* Entrada suave al aparecer (solo con JavaScript y sin «movimiento reducido») */
.js-revela .revela{opacity:0;transform:translateY(22px);transition:opacity 700ms var(--ease-out),transform 800ms var(--ease-out)}
.js-revela .revela.visto{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.js-revela .revela{opacity:1;transform:none}}

/* Botones: un brillo suave al pasar */
.btn{position:relative;overflow:hidden}
.btn::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 35%,rgba(255,255,255,.45) 50%,transparent 65%);transform:translateX(-130%);pointer-events:none}
.btn:not(.pronto):hover::after{transform:translateX(130%);transition:transform 700ms var(--ease-out)}
/* Inicio: los santos en 3 columnas; en el celular, en fila que se desliza */
.cab-seccion + .lista-santos{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:760px){
  .cab-seccion + .lista-santos{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:72%;overflow-x:auto;scroll-snap-type:x mandatory;
    padding:14px var(--pad) 18px;margin:0 calc(-1 * var(--pad));scrollbar-width:none}
  .cab-seccion + .lista-santos::-webkit-scrollbar{display:none}
  .cab-seccion + .lista-santos li{scroll-snap-align:center}
}

/* ===== El calendario del Kit, animado (inicio) ===== */
.ka{position:relative;width:100%;max-width:470px;margin:0 auto;padding:clamp(14px,2vw,22px);border:var(--linea-g) solid var(--noche);border-radius:var(--r-l);
  background:var(--cielo);isolation:isolate;overflow:hidden;transform:rotate(-2deg);box-shadow:0 26px 40px -18px rgba(27,37,89,.55)}
.ka::before{content:"";position:absolute;inset:-30%;z-index:-1;background:repeating-conic-gradient(from -4deg at 50% 60%,rgba(108,187,255,.55) 0 9deg,transparent 9deg 25.7deg)}
.ka-tit{font-weight:800;font-size:clamp(30px,4vw,44px);line-height:1;letter-spacing:-.02em;color:var(--nube);-webkit-text-stroke:.16em var(--noche);paint-order:stroke fill;margin:2px 0 clamp(12px,1.6vw,18px) 4px}
.ka-rejilla{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(7px,1vw,11px)}
.ka-celda{position:relative;aspect-ratio:46/36;perspective:520px}
.ka-dentro,.ka-puerta{position:absolute;inset:0;border-radius:46% 46% 9px 9px / 34% 34% 9px 9px;border:3px solid var(--noche)}
.ka-dentro{background:var(--crema);display:grid;place-items:center;overflow:hidden}
.ka-dentro svg{width:92%;height:92%;transform-origin:50% 80%}
.ka-puerta{background:var(--c);display:grid;place-items:center;transform-origin:left center;backface-visibility:hidden;box-shadow:inset 0 0 0 4px rgba(255,255,255,.35)}
.ka-puerta b{font-weight:800;font-size:clamp(17px,2.2vw,24px);transform:translate(-10%,10%)}
.ka-pomo{position:absolute;right:12%;top:52%;width:12%;aspect-ratio:1;border-radius:50%;background:var(--sol);border:2px solid var(--noche)}
.ka-celda[data-n="24"] .ka-pomo{background:var(--nube)}
.ka-chispa{position:absolute;right:-6%;top:-14%;z-index:3;width:38%;aspect-ratio:1;opacity:0;pointer-events:none}
.ka-chispa svg{width:100%;height:100%;overflow:visible}
.ka-rotulo{position:absolute;left:50%;bottom:14px;z-index:4;translate:-50% 0;display:flex;gap:8px;align-items:center;white-space:nowrap;
  background:var(--nube);border:var(--linea) solid var(--noche);border-radius:99px;padding:6px 14px;font-weight:800;font-size:clamp(14px,1.4vw,17px);
  box-shadow:0 10px 20px -10px rgba(27,37,89,.6);opacity:0}
.ka-dia{background:var(--sol);border:2px solid var(--noche);border-radius:99px;padding:1px 9px;font-size:.9em}
/* Sin animación: dos puertitas abiertas, quietas */
.ka.quieta .abre[data-n="3"] .ka-puerta,.ka.quieta .abre[data-n="24"] .ka-puerta{transform:rotateY(-112deg)}
.ka-rotulo{position:static;translate:none;margin:clamp(12px,1.6vw,16px) auto 2px;width:max-content;max-width:100%}
/* La puertita queda entreabierta (se ve su canto) y el santo sale en grande */
.ka-puerta{backface-visibility:visible}
.ka-zoom{position:absolute;left:50%;top:50%;z-index:5;width:68%;translate:-50% -50%;background:var(--nube);border:var(--linea-g) solid var(--noche);border-radius:26px;
  padding:14px 14px 12px;box-shadow:0 24px 40px -14px rgba(10,16,48,.6);opacity:0;visibility:hidden;pointer-events:none}
.ka-zoom-arte{aspect-ratio:600/640;background:var(--crema);border:3px solid var(--noche);border-radius:18px;display:grid;place-items:center;overflow:hidden}
.ka-zoom-arte svg{width:96%;height:96%}
.ka-zoom .ka-rotulo{opacity:1;margin:10px auto 0;box-shadow:none;border-width:2px;font-size:clamp(13px,1.3vw,16px);white-space:normal;text-align:center;justify-content:center;flex-wrap:wrap}
.ka-pie{margin:clamp(12px,1.6vw,16px) auto 2px;width:max-content;max-width:100%;background:var(--nube);border:var(--linea) solid var(--noche);border-radius:99px;padding:6px 14px;font-weight:800;font-size:clamp(13px,1.3vw,16px);text-align:center}
.ka.quieta .abre[data-n="3"] .ka-puerta,.ka.quieta .abre[data-n="24"] .ka-puerta{transform:rotateY(-72deg)}
/* Puertitas con candado: se ven, pero solo se abren con el Kit */
.ka-candado{position:absolute;right:9%;top:44%;width:17%;height:auto;filter:drop-shadow(0 1px 0 rgba(27,37,89,.25))}
.ka-celda.cerrada{cursor:pointer}
.ka-celda.cerrada .ka-puerta{filter:saturate(.85)}
.ka-celda.cerrada:hover .ka-puerta{transform:rotateY(-6deg)}
.ka-celda.cerrada .ka-puerta{transition:transform 260ms var(--ease-out)}
.ka-pie.aviso-kit{background:var(--sol)}
.ka-puerta.sacude{animation:sacude 380ms cubic-bezier(.36,.07,.19,.97)}

/* Video de YouTube ligero */
.yt{position:relative;aspect-ratio:16/9;border:var(--linea-g) solid var(--noche);border-radius:var(--r-l);overflow:hidden;background:var(--noche);margin:0 0 16px}
.yt-play{position:absolute;inset:0;width:100%;height:100%;padding:0;border:0;background:none;cursor:pointer}
.yt-play img,.yt iframe{width:100%;height:100%;object-fit:cover;display:block;border:0}
.yt-boton{position:absolute;left:50%;top:50%;width:72px;height:72px;margin:-36px 0 0 -36px;border-radius:50%;background:#fff;box-shadow:0 4px 0 var(--noche);transition:transform .2s}
.yt-boton::after{content:"";position:absolute;left:29px;top:21px;border-left:24px solid var(--noche);border-top:15px solid transparent;border-bottom:15px solid transparent}
.yt-play:hover .yt-boton,.yt-play:focus-visible .yt-boton{transform:scale(1.08)}
.yt-sub{margin:0 0 24px}
.yt-dos{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:clamp(16px,2vw,28px)}.yt-dos .yt{margin:0}