:root{
  --papel:#FBFAFD;
  --velo:#F2EFF8;
  --linea:#E3DEED;
  --tinta:#241B3A;
  --tinta-2:#5E5775;
  --pulso:#B4235A;
  --pulso-velo:#FBEAF1;
  --serif:"Cormorant Garamond", Georgia, serif;
  --sans:"Figtree", system-ui, -apple-system, sans-serif;
  --abas:64px;
  --seguro:env(safe-area-inset-bottom, 0px);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;overflow-x:clip}
body{margin:0;background:var(--papel);color:var(--tinta);font:400 17px/1.6 var(--sans);overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
button,input,textarea,select{font:inherit;color:inherit}
a{color:inherit}
:focus-visible{outline:2px solid var(--pulso);outline-offset:2px;border-radius:6px}
[hidden]{display:none!important}

main{position:relative;isolation:isolate;max-width:680px;margin:0 auto;padding:0 20px calc(var(--abas) + var(--seguro) + 32px);outline:none}

/* ---------- tipografia ---------- */
h1,h2,h3{font-family:var(--serif);font-weight:600;line-height:1.08;margin:0;letter-spacing:-.01em}
h1{font-size:clamp(40px,11vw,56px)}
h2{font-size:30px}
h3{font-size:23px}
.chico{font-size:14.5px;color:var(--tinta-2);line-height:1.45}
.frase{font-family:var(--serif);font-style:italic;font-weight:500;font-size:clamp(24px,6.6vw,30px);line-height:1.22}
p{margin:0}

/* ---------- topo ---------- */
.marca{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:calc(18px + env(safe-area-inset-top,0px)) 0 4px}
.marca b{font:600 21px/1 var(--serif);letter-spacing:.01em}
.marca span{font-size:14px;color:var(--tinta-2)}

/* ---------- inicio: hoy (destaque imersivo) ---------- */
.hoy{position:relative;isolation:isolate;overflow:hidden;display:grid;grid-template-columns:minmax(0,1fr) 108px;gap:14px;align-items:center;margin:14px 0 4px;padding:22px 18px 22px 22px;border-radius:28px;text-decoration:none;background:var(--tinta);color:#fff;box-shadow:0 24px 48px -28px rgba(36,27,58,.55)}
.hoy-velo{position:absolute;inset:-30%;width:160%;height:160%;max-width:none;object-fit:cover;filter:blur(38px) saturate(1.5);opacity:.62;z-index:-1;transform:scale(1.1)}
.hoy::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(110deg,rgba(28,20,46,.86) 30%,rgba(28,20,46,.35))}
.hoy-eti{font-size:14px;font-weight:500;color:rgba(255,255,255,.78)}
.hoy .frase{font-size:clamp(22px,6vw,27px);margin-top:6px;color:#fff}
.hoy .quien{margin-top:12px;font-weight:600;font-size:15px;color:#FFD3E3}
.hoy-arte{width:108px;height:108px;border-radius:50%;object-fit:cover;box-shadow:0 0 0 1px rgba(255,255,255,.25),0 12px 30px -8px rgba(0,0,0,.45)}

/* ---------- mapa del cuerpo ---------- */
.mapa{position:relative;margin:26px auto 6px;max-width:330px}
.mapa svg{max-width:290px;margin-left:auto;margin-right:auto}
.mapa h2{text-align:center}
.mapa > p{text-align:center;margin:6px auto 0;max-width:30ch}
.mapa svg{display:block;width:100%;height:auto;margin-top:8px;overflow:visible}
.silueta{fill:url(#relleno);stroke:var(--tinta);stroke-width:.7;stroke-opacity:.45}
.nodo{cursor:pointer}
.nodo .halo{fill:var(--pulso);opacity:.16;transform-box:fill-box;transform-origin:center;animation:latir 3.2s ease-in-out infinite}
.nodo .punto{fill:var(--pulso)}
.nodo text{font:600 8.2px var(--sans);fill:var(--tinta);paint-order:stroke;stroke:var(--papel);stroke-width:3px}
.nodo:hover .punto,.nodo:focus-visible .punto{fill:var(--tinta)}
.nodo:focus{outline:none}
.nodo:focus-visible .halo{opacity:.4}
@keyframes latir{0%,100%{transform:scale(.7)}50%{transform:scale(1.15)}}

.sistemas{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin:4px 0 30px}
.pastilla{border:1px solid var(--linea);background:#fff;border-radius:999px;padding:8px 14px;font-size:15px;cursor:pointer;text-decoration:none;line-height:1.3}
.pastilla:hover{border-color:var(--tinta-2)}
.pastilla.on{background:var(--tinta);color:#fff;border-color:var(--tinta)}

/* ---------- lista de órganos ---------- */
.seccion-titulo{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin:30px 0 4px}
.seccion-titulo .chico{white-space:nowrap}
.filas{list-style:none;margin:0;padding:0}
.fila{display:grid;grid-template-columns:56px minmax(0,1fr);gap:14px;align-items:center;padding:12px 0;border-bottom:1px solid var(--linea);text-decoration:none}
.fila img,.fila .sin-arte{width:56px;height:56px;border-radius:50%;object-fit:cover;background:var(--velo)}
.fila b{display:block;font:600 21px/1.15 var(--serif)}
.fila span{display:block;font-size:14.5px;color:var(--tinta-2);line-height:1.4;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.fila mark{background:var(--pulso-velo);color:inherit;border-radius:3px;padding:0 2px}

/* ---------- ficha ---------- */
.volver{display:inline-flex;align-items:center;gap:6px;margin:16px 0 0;padding:6px 0;background:none;border:0;cursor:pointer;color:var(--tinta-2);font-size:15px;text-decoration:none}
.ficha-cabeza{text-align:center;padding:6px 0 24px}
.ficha-cabeza img{width:min(78vw,300px);margin:0 auto -6px;aspect-ratio:1;object-fit:cover;border-radius:50%}
.ficha-cabeza .chico{margin-top:14px}
.ficha-cabeza h1{margin-top:4px}
.ficha-cabeza .extra{font:500 20px/1.2 var(--serif);color:var(--tinta-2);margin-top:4px}
.acciones{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-top:18px}
.boton{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:10px 18px;border-radius:999px;border:1px solid var(--linea);background:#fff;cursor:pointer;font-weight:500;font-size:15.5px;text-decoration:none;line-height:1.25;text-align:center}
.boton svg{width:18px;height:18px;flex:none;fill:none;stroke:currentColor;stroke-width:1.7}
.boton.lleno{background:var(--tinta);border-color:var(--tinta);color:#fff}
.boton.on{border-color:var(--pulso);color:var(--pulso)}
.boton.ancho{width:100%}

.raiz{padding:26px 0;border-top:1px solid var(--linea)}
.raiz .chico{margin-bottom:8px}
.raiz .frase{margin-top:18px;color:var(--pulso)}

.bloque{padding:22px 0;border-top:1px solid var(--linea)}
.bloque h3{margin-bottom:8px}
.bloque ul{margin:0;padding:0 0 0 1.1em}
.bloque li{margin:3px 0}
.bloque li::marker{color:var(--pulso)}
.dos{display:grid;grid-template-columns:minmax(0,1fr);gap:0}
@media (min-width:560px){.dos{grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:28px}}
.etiquetas{display:flex;flex-wrap:wrap;gap:8px}
.etiquetas a{font-size:15px;padding:6px 12px}

.clave{margin:6px 0 4px;padding:22px;border-radius:20px;background:var(--pulso-velo)}
.clave h3{color:var(--pulso)}

/* reproductor */
.sonido{display:grid;grid-template-columns:96px minmax(0,1fr);gap:18px;align-items:center;padding:22px 0;border-top:1px solid var(--linea)}
.respira{position:relative;width:96px;height:96px;border-radius:50%;border:1px solid var(--linea);display:grid;place-items:center;cursor:pointer;background:#fff;padding:0}
.respira::before{content:"";position:absolute;inset:14px;border-radius:50%;background:radial-gradient(circle,var(--pulso) 0,rgba(180,35,90,.35) 55%,transparent 72%);opacity:.35;transform:scale(.55);transition:opacity .4s}
.respira.on::before{opacity:.9;animation:respirar 10s ease-in-out infinite}
.respira svg{position:relative;width:26px;height:26px;fill:var(--tinta)}
@keyframes respirar{0%{transform:scale(.55)}40%{transform:scale(1.05)}100%{transform:scale(.55)}}
.sonido b{font:600 30px/1 var(--serif)}
.sonido-ctrl{display:flex;flex-direction:column;align-items:center;gap:8px}
.sonido-btn-txt{font-size:13.5px;font-weight:600;color:var(--pulso);text-align:center}
.sonido-desc{margin-top:6px;font-size:15px;line-height:1.45;color:var(--tinta)}
.sonido-nota{margin-top:6px}
.sonido .guia{margin-top:6px;font-weight:600;font-size:14.5px;color:var(--pulso);min-height:1.4em}

.vecinos{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px;margin-top:10px}
.vecinos a{display:block;padding:14px;border:1px solid var(--linea);border-radius:16px;text-decoration:none;background:#fff;min-width:0}
.vecinos a:last-child{text-align:right}
.vecinos b{display:block;font:600 20px/1.15 var(--serif);overflow-wrap:anywhere}

/* páginas especiales */
.especial-bloque{padding:16px 0;border-top:1px solid var(--linea)}
.especial-bloque h3{font-size:21px;margin-bottom:4px}

/* ---------- buscar ---------- */
.campo{display:flex;align-items:center;gap:10px;margin:18px 0 14px;padding:0 16px;border:1px solid var(--linea);border-radius:999px;background:#fff;min-height:52px}
.campo svg{width:20px;height:20px;flex:none;fill:none;stroke:var(--tinta-2);stroke-width:1.8}
.campo input{flex:1;min-width:0;border:0;outline:0;background:none;font-size:17px;padding:12px 0}
.vacio{padding:36px 0;text-align:center;color:var(--tinta-2)}

/* ---------- formularios ---------- */
label.rot{display:block;font-weight:600;font-size:15px;margin:18px 0 6px}
.entrada,select.entrada,textarea.entrada{width:100%;border:1px solid var(--linea);border-radius:14px;background:#fff;padding:12px 14px;font-size:17px;min-height:48px}
textarea.entrada{min-height:110px;resize:vertical;line-height:1.5}
.intensidad{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
.intensidad button{min-height:46px;border-radius:12px;border:1px solid var(--linea);background:#fff;cursor:pointer;font-weight:600}
.intensidad button.on{background:var(--tinta);color:#fff;border-color:var(--tinta)}

/* ---------- sesiones ---------- */
.tarjeta{display:block;padding:16px 0;border-bottom:1px solid var(--linea);text-decoration:none}
.tarjeta b{font:600 22px/1.2 var(--serif);display:block}
.paso{padding:6px 0 0}
.paso-cab{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:18px 0 6px}
.progreso{height:4px;background:var(--linea);border-radius:4px;overflow:hidden;margin-top:14px}
.progreso i{display:block;height:100%;background:var(--pulso)}
.contenido-paso{padding:18px 0;font-size:18px}
.contenido-paso ul{padding-left:1.1em;margin:0}
.ayuda{margin:6px 0 4px;padding:16px;border-radius:16px;background:var(--velo)}
.ayuda p+p{margin-top:8px}
.navpasos{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px;margin-top:18px}

/* ---------- agenda ---------- */
.semana{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px;margin:14px 0 6px}
.dia{display:flex;flex-direction:column;align-items:center;gap:2px;padding:10px 0 8px;border-radius:16px;text-decoration:none;color:var(--tinta-2);background:#fff;box-shadow:inset 0 0 0 1px var(--linea);min-height:72px;transition:transform .15s ease}
.dia span{font-size:12.5px;text-transform:capitalize}
.dia b{font:600 22px/1 var(--serif);color:var(--tinta)}
.dia i{font-style:normal;font-size:12px;line-height:1;height:10px;color:var(--pulso);letter-spacing:1px}
.dia.on{background:var(--tinta);box-shadow:none;color:rgba(255,255,255,.75)}
.dia.on b{color:#fff}
.dia.on i{color:var(--rosa,#FFC4DE)}
.dia:active{transform:scale(.95)}
.cita{display:grid;grid-template-columns:62px minmax(0,1fr) auto;gap:12px;align-items:center;padding:14px 16px;margin-top:10px;border-radius:18px;background:#fff;box-shadow:inset 0 0 0 1px var(--linea);text-decoration:none;transition:transform .15s ease}
.cita:active{transform:scale(.985)}
.cita-hora{font:600 22px/1 var(--serif);color:var(--pulso)}
.cita-txt b{display:block;font:600 19px/1.2 var(--serif)}
.cita-txt span{display:block;font-size:14px;color:var(--tinta-2);line-height:1.35;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.cita-arte{width:42px;height:42px;border-radius:50%;object-fit:cover}
.vacio-dia{padding:16px 0 2px;color:var(--tinta-2)}
.dia-sep{margin-top:14px}
.seccion-titulo a{text-decoration:none;color:var(--pulso);font-weight:600;white-space:nowrap}
.cita-cab{padding:14px 0 18px}
.cita-hora-g{font:600 54px/1 var(--serif);color:var(--pulso);margin-top:6px}
.cita-hora-g span{font-size:22px;color:var(--tinta-2)}
.cita-cab h2{margin-top:10px}
.cita-motivo{margin-top:8px;color:var(--tinta-2)}
.acciones-cita{display:grid;gap:10px;margin-top:20px}
.dos-botones{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px}
.dos-campos{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px}
.opcional{font-weight:400;color:var(--tinta-2)}
.ayuda-campo{margin-top:6px;font-size:14px;color:var(--tinta-2)}
.error{margin-top:6px;font-size:14.5px;font-weight:600;color:#B42318}
.boton-buscar{min-height:40px;padding:8px 14px;font-size:14.5px;flex:none}
.fila-btn{width:100%;background:none;border:0;border-bottom:1px solid var(--linea);text-align:left;cursor:pointer;font:inherit;color:inherit}
.proxima{display:flex;align-items:baseline;gap:10px;margin:12px 0 0;padding:12px 16px;border-radius:16px;text-decoration:none;color:#fff;background:rgba(255,255,255,.07);box-shadow:inset 0 0 0 1px rgba(255,255,255,.14)}
.proxima span:first-child{font-size:14px;color:rgba(255,255,255,.7)}
.proxima b{font:600 22px/1 var(--serif);color:#FFC4DE}
.proxima span:last-child{font-weight:600;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ---------- mas ---------- */
.texto-largo p{margin:0 0 14px}
.texto-largo h2{margin:22px 0 14px}

/* ---------- hoja ---------- */
.hoja{position:fixed;inset:0;z-index:50}
.hoja-fondo{position:absolute;inset:0;background:rgba(36,27,58,.32)}
.hoja-panel{position:absolute;left:0;right:0;bottom:0;max-height:82vh;overflow:auto;background:var(--papel);border-radius:24px 24px 0 0;padding:6px 20px calc(24px + var(--seguro));max-width:680px;margin:0 auto;animation:subir .28s ease-out}
.hoja-asa{display:block;width:44px;height:5px;border-radius:5px;border:0;background:var(--linea);margin:6px auto 14px;cursor:pointer;padding:0}
@keyframes subir{from{transform:translateY(40px);opacity:.4}to{transform:none;opacity:1}}

/* ---------- abas ---------- */
.abas{position:fixed;left:0;right:0;bottom:0;z-index:40;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));background:rgba(251,250,253,.94);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-top:1px solid var(--linea);padding-bottom:var(--seguro)}
.abas a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;height:var(--abas);text-decoration:none;color:var(--tinta-2);font-size:12px;font-weight:500}
.abas svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.abas a[aria-current="page"]{color:var(--pulso)}

/* ---------- explorar ---------- */
.explorar{margin-top:8px}
.mosaico{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 12px;margin-top:16px}
@media (min-width:560px){.mosaico{grid-template-columns:repeat(4,minmax(0,1fr))}}
.tesela{display:flex;flex-direction:column;align-items:center;text-align:center;gap:2px;background:none;border:0;padding:0;cursor:pointer;min-width:0}
.tesela img{width:min(112px,34vw);aspect-ratio:1;border-radius:50%;object-fit:cover;margin-bottom:8px;box-shadow:0 14px 30px -18px rgba(36,27,58,.6);transition:transform .25s cubic-bezier(.2,.8,.2,1)}
.tesela b{font:600 19px/1.15 var(--serif);overflow-wrap:anywhere}
.tesela span{font-size:13.5px;color:var(--tinta-2)}
.tesela:active img{transform:scale(.95)}
@media (hover:hover){.tesela:hover img{transform:scale(1.04)}}

/* ---------- ficha: halo e barra ---------- */
.ficha-arte{box-shadow:0 30px 60px -30px rgba(36,27,58,.55)}
.barra{position:fixed;left:0;right:0;top:0;z-index:30;display:flex;align-items:center;gap:6px;padding:calc(6px + env(safe-area-inset-top,0px)) 12px 6px;background:rgba(251,250,253,.86);backdrop-filter:blur(14px) saturate(1.4);-webkit-backdrop-filter:blur(14px) saturate(1.4);border-bottom:1px solid var(--linea);transform:translateY(-110%);transition:transform .25s ease-out}
.barra.on{transform:none}
.barra a{display:grid;place-items:center;width:44px;height:44px;font-size:26px;text-decoration:none;color:var(--tinta)}
.barra b{font:600 21px/1.1 var(--serif);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* ---------- bienvenida ---------- */
.intro{position:fixed;inset:0;z-index:100;display:flex;flex-direction:column;justify-content:space-between;overflow-x:hidden;overflow-y:auto;color:#fff;background:radial-gradient(120% 80% at 50% 30%,#4A2D73 0,#2A1C45 45%,#160F26 100%);transition:opacity .45s ease,transform .45s ease}
.intro.sale{opacity:0;transform:scale(1.04)}
.intro-orbita{--t:min(23vw,12.5vh,104px);--r:min(36vw,19vh,170px);position:relative;flex:none;height:calc(2*var(--r) + var(--t) + 8px);margin-top:calc(28px + env(safe-area-inset-top,0px));animation:girar 80s linear infinite}
.intro-orbita span{position:absolute;left:50%;top:50%;width:var(--t);aspect-ratio:1;margin:calc(var(--t)/-2) 0 0 calc(var(--t)/-2);transform:rotate(calc(var(--k)*45deg)) translateY(calc(var(--r)*-1)) rotate(calc(var(--k)*-45deg))}
.intro-orbita img{width:100%;height:100%;border-radius:50%;object-fit:cover;box-shadow:0 0 0 1px rgba(255,255,255,.18),0 18px 40px -12px rgba(0,0,0,.6);animation:girar 80s linear infinite reverse}
.intro-orbita::after{content:"";position:absolute;left:50%;top:50%;width:120px;height:120px;margin:-60px 0 0 -60px;border-radius:50%;background:radial-gradient(circle,rgba(255,190,220,.55),transparent 70%);animation:latir 5s ease-in-out infinite}
@keyframes girar{to{transform:rotate(360deg)}}
.intro-texto{padding:0 24px calc(28px + env(safe-area-inset-bottom,0px));max-width:520px;margin:0 auto;width:100%;animation:subir .7s .15s cubic-bezier(.2,.8,.2,1) both}
.intro h1{font-size:clamp(36px,min(12vw,6.4vh),58px);color:#fff}
.intro-lema{margin-top:10px;font-size:18px;line-height:1.5;color:rgba(255,255,255,.82)}
.intro-hechos{list-style:none;margin:20px 0 24px;padding:0;display:grid;gap:8px;font-size:15.5px;color:rgba(255,255,255,.78)}
.intro-hechos b{color:#fff;font-weight:600}
.intro-boton{width:100%;min-height:54px;background:#fff;color:var(--tinta);border:0;font-size:17px;font-weight:600}
.intro-boton:focus-visible{outline-color:#FFD3E3}
@media (max-height:720px){
  .intro-orbita{--t:min(20vw,10vh,90px);--r:min(32vw,15vh,150px)}
  .intro-hechos{display:none}
  .intro-lema{margin-bottom:22px}
}

/* ---------- palco noturno (início) ---------- */
.escenario{--noche:#1B1230;position:relative;isolation:isolate;margin:0 -20px;padding:0 20px 30px;color:#fff;border-radius:0 0 36px 36px;
  background:
    radial-gradient(1.2px 1.2px at 12% 18%,rgba(255,255,255,.7),transparent),
    radial-gradient(1px 1px at 78% 12%,rgba(255,255,255,.55),transparent),
    radial-gradient(1.4px 1.4px at 88% 46%,rgba(255,220,240,.6),transparent),
    radial-gradient(1px 1px at 8% 62%,rgba(255,255,255,.5),transparent),
    radial-gradient(1.2px 1.2px at 92% 78%,rgba(255,255,255,.45),transparent),
    radial-gradient(1px 1px at 22% 88%,rgba(255,255,255,.4),transparent),
    radial-gradient(90% 55% at 50% 62%,#4A2D73 0,rgba(74,45,115,0) 70%),
    radial-gradient(120% 70% at 50% 0,#33214F 0,var(--noche) 70%)}
.escenario .marca b{color:#fff}
.escenario .marca span{color:rgba(255,255,255,.66)}
.escenario .hoy{background:rgba(255,255,255,.07);box-shadow:inset 0 0 0 1px rgba(255,255,255,.14),0 30px 60px -30px rgba(0,0,0,.6)}
.escenario .hoy::after{background:linear-gradient(110deg,rgba(27,18,48,.82) 30%,rgba(27,18,48,.25))}
.escenario .mapa h2{color:#fff}
.escenario .mapa > p{color:rgba(255,255,255,.7)}
.escenario .mapa svg{max-width:330px}
.cuerpo-luz{fill:url(#cuerpo);stroke:url(#trazo);stroke-width:1.1}
.eje{stroke:rgba(255,205,232,.38);stroke-width:.8;stroke-dasharray:2 4}
.haz{animation:barrer 6.5s cubic-bezier(.45,0,.55,1) infinite}
@keyframes barrer{0%{transform:translateY(0)}100%{transform:translateY(520px)}}
.escenario .nodo .halo{fill:#FF7EB6;opacity:.25;animation-delay:var(--d)}
.escenario .nodo .punto{fill:url(#orbe)}
.nodo .centro{fill:#fff}
.escenario .nodo text{fill:#fff;font-weight:600;stroke:rgba(27,18,48,.85);stroke-width:3px}
.escenario .nodo:hover .punto,.escenario .nodo:focus-visible .punto{fill:url(#orbe)}
.escenario .nodo:focus-visible .halo{opacity:.6}
.escenario .pastilla{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.2);color:#fff;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.escenario .pastilla:hover{border-color:rgba(255,255,255,.5)}
.escenario .sistemas{margin-bottom:0}
.escenario + .explorar{margin-top:30px}

/* ---------- ficha em cena ---------- */
.escena{position:relative;isolation:isolate;margin:0 -20px;padding:calc(10px + env(safe-area-inset-top,0px)) 20px 30px;color:#fff;border-radius:0 0 36px 36px;overflow:hidden;
  background:radial-gradient(80% 60% at 50% 38%,#3E2763 0,rgba(62,39,99,0) 70%),radial-gradient(130% 80% at 50% 0,#2C1D48 0,#1B1230 75%)}
.escena .volver{display:flex;width:max-content;margin:0;color:rgba(255,255,255,.78);min-height:44px}
.arte-escena{position:relative;width:min(80vw,320px);aspect-ratio:1;margin:4px auto 0}
.ficha-cabeza .arte-escena img{position:absolute;inset:0;width:100%;height:100%;margin:0;border-radius:50%;object-fit:cover}
.ficha-cabeza .arte-escena .arte-aura{inset:-14%;width:128%;height:128%;filter:blur(34px) saturate(1.7);opacity:.75;border-radius:50%;animation:respirar-aura 7s ease-in-out infinite}
@keyframes respirar-aura{0%,100%{transform:scale(.94);opacity:.6}50%{transform:scale(1.04);opacity:.85}}
.ficha-arte{box-shadow:0 0 0 1px rgba(255,255,255,.18),0 30px 60px -20px rgba(0,0,0,.6)}
.escena .chico{color:rgba(255,255,255,.7);margin-top:22px}
.escena h1{color:#fff}
.escena .extra{color:rgba(255,255,255,.75)}
.escena .boton{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.22);color:#fff;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.escena .boton.on{border-color:#FFB3D1;color:#FFD3E3;background:rgba(255,126,182,.14)}
.escena + .raiz{border-top:0;padding-top:30px}

/* ---------- toque e transição ---------- */
a,button,.nodo{-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.fila,.boton,.pastilla,.vecinos a,.tarjeta{transition:transform .15s ease,background-color .2s ease,border-color .2s ease}
.fila:active,.vecinos a:active,.tarjeta:active{transform:scale(.985)}
.boton:active,.pastilla:active{transform:scale(.96)}
.hoy{transition:transform .2s ease}
.hoy:active{transform:scale(.985)}
main.entra{animation:entrar .26s cubic-bezier(.2,.8,.2,1)}
@keyframes entrar{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.abas a{position:relative}
.abas a::before{content:"";position:absolute;top:7px;left:50%;width:54px;height:30px;margin-left:-27px;border-radius:999px;background:var(--pulso-velo);opacity:0;transform:scale(.6);transition:opacity .2s ease,transform .25s cubic-bezier(.2,.8,.2,1);z-index:-1}
.abas a[aria-current="page"]::before{opacity:1;transform:none}
.abas{isolation:isolate}
.hoja-fondo{background:rgba(22,15,38,.45);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}

.aviso-corto{margin:28px 0 0;font-size:13.5px;color:var(--tinta-2);line-height:1.5}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
}

/* ---------- demo da página de vendas ---------- */
main{padding-top:47px!important;padding-bottom:calc(64px + 54px)!important}
.escenario,.escena{margin-top:-47px!important}.escenario{padding-top:47px!important}.escena{padding-top:57px!important}.barra{padding-top:47px!important}
.abas{padding-bottom:22px!important}.hoja-panel{padding-bottom:44px!important}
.demo-candado{position:relative;margin-top:8px;border-top:1px solid var(--linea)}
.demo-velo{filter:blur(6px);opacity:.5;user-select:none;pointer-events:none;padding:8px 0 20px}
.demo-velo h3{margin-top:18px}
.demo-candado-txt{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:20px;text-align:center;background:linear-gradient(180deg,rgba(251,250,253,.3),rgba(251,250,253,.95) 40%)}
.demo-candado-txt svg{width:44px;height:44px;padding:11px;border-radius:50%;fill:none;stroke:#fff;stroke-width:1.8;stroke-linejoin:round;background:var(--tinta)}
.demo-candado-txt p{max-width:30ch;color:var(--tinta-2);font-size:15.5px}
