/* ============================================================
   aude.club · sistema "aude de noche" (03/10/2026)
   El mismo sistema que grupoaude.com ("aude de día"), con el fondo invertido:
   - Paleta del manual de marca: negro #111111, blanco y amarillo #F5C000.
   - Aileron para leer y para titulares; Unbounded (en minúsculas) solo en las frases que pegan.
   - Texto grande: 21 px en móvil, 23 px en ordenador. 8 tamaños.
   - Una idea por pantalla. Bandas de papel o amarillas para marcar el ritmo.
   ============================================================ */
@font-face{font-family:Aileron;src:url(/assets/v2/fonts/Aileron-Regular.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:Aileron;src:url(/assets/v2/fonts/Aileron-Bold.woff2) format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:Aileron;src:url(/assets/v2/fonts/Aileron-Black.woff2) format("woff2");font-weight:900;font-display:swap}
@font-face{font-family:Unbounded;src:url(/assets/v2/fonts/Unbounded.woff2) format("woff2");font-weight:200 900;font-display:swap}

:root{
  --noche:#111; --noche-2:#1b1b1b; --noche-3:#262626; --blanco:#fff; --papel:#F7F5EF;
  --texto-2:#d6d2c7; --gris:#a19c90; --linea:rgba(255,255,255,.14); --linea-papel:rgba(17,17,17,.14);
  --amarillo:#F5C000; --amarillo-2:#FFD23F;
  --t-texto:21px; --t-entradilla:24px; --t-etiqueta:14px; --t-h3:30px; --t-h2:38px; --t-h1:46px; --t-golpe:34px; --t-cifra:64px;
  --r:28px; --ancho:1180px; --e:cubic-bezier(.22,1,.36,1);
}
@media(min-width:900px){:root{--t-texto:23px;--t-entradilla:28px;--t-h3:40px;--t-h2:56px;--t-h1:86px;--t-golpe:64px;--t-cifra:100px}}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font:400 var(--t-texto)/1.45 Aileron,system-ui,sans-serif;background:var(--noche);color:var(--blanco);-webkit-font-smoothing:antialiased;overflow-x:hidden;overflow-x:clip}
img,video{display:block;max-width:100%}
a{color:inherit}
b,strong{font-weight:700}
.c{width:min(var(--ancho),calc(100% - 40px));margin-inline:auto}
section[id]{scroll-margin-top:84px}
h1,h2,h3{font-weight:900;letter-spacing:-.035em;word-spacing:.07em;line-height:1.02}
h1{font-size:var(--t-h1)} h2{font-size:var(--t-h2)} h3{font-size:var(--t-h3);line-height:1.06}
h2{max-width:20ch}
/* líneas repartidas: si una frase no cabe, se parte en trozos parecidos y no deja una palabra sola (06/10) */
h1,h2,h3,.entr,.checks li,.pasos li,.tarjeta p,.sino li,.miedos li,.garantia,.historia p,.cambio span,.q,.plazas{text-wrap:balance}
.golpe-f{font-family:Unbounded,sans-serif;font-weight:700;letter-spacing:-.045em;line-height:1.08}
.entr,.lead{font-size:var(--t-entradilla);line-height:1.38;color:var(--texto-2);max-width:34ch}
p+p{margin-top:14px}
.am{color:var(--amarillo)}
.nw{white-space:nowrap}

/* etiquetas */
.etq{display:inline-flex;align-items:center;gap:10px;font-weight:700;font-size:var(--t-etiqueta);letter-spacing:.14em;text-transform:uppercase;line-height:1.3;color:var(--amarillo)}
.cab .etq{margin-bottom:12px}
.pastilla{display:inline-flex;align-items:center;gap:10px;font-weight:700;font-size:var(--t-etiqueta);letter-spacing:.14em;text-transform:uppercase;line-height:1.3;background:var(--noche-2);border:1px solid var(--linea);padding:9px 16px;border-radius:99px;width:fit-content}
.pastilla i{width:9px;height:9px;border-radius:50%;background:var(--amarillo);box-shadow:0 0 0 4px rgba(245,192,0,.22);flex:none}
.subr{background:linear-gradient(transparent 78%,var(--amarillo) 78%,var(--amarillo) 91%,transparent 91%);-webkit-box-decoration-break:clone;box-decoration-break:clone;padding:0 .04em;color:var(--blanco)}
/* resaltado: sobre negro, texto amarillo en negrita (el subrayado apagado se leía mal, 03/10); sobre papel, subrayado amarillo */
.hl{font-weight:700;color:var(--amarillo)}
.papel .hl{color:var(--noche);background:linear-gradient(transparent 60%,rgba(245,192,0,.6) 60%,rgba(245,192,0,.6) 92%,transparent 92%)}
.amarilla .hl{color:var(--noche);text-decoration:underline;text-decoration-thickness:3px;text-underline-offset:5px}
.entr+.entr{margin-top:14px}
.aparte{display:block;font-size:var(--t-entradilla);font-weight:400;letter-spacing:0;word-spacing:normal;color:var(--gris);margin-top:.35em;line-height:1.3}

/* botones */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;font:700 18px/1.2 Aileron,sans-serif;padding:18px 26px;border-radius:99px;text-decoration:none;border:2px solid var(--amarillo);background:var(--amarillo);color:var(--noche);cursor:pointer;transition:transform .25s var(--e),box-shadow .25s var(--e),background .25s,color .25s}
.btn svg{width:20px;height:20px;flex:none}
.btn:hover{transform:translate(-2px,-2px);box-shadow:4px 4px 0 var(--blanco)}
.btn--borde{background:transparent;color:var(--blanco);border-color:currentColor}
.btn--borde:hover{background:var(--blanco);color:var(--noche);border-color:var(--blanco)}
.btns{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}
.papel .btn:hover,.amarilla .btn:hover{box-shadow:4px 4px 0 var(--noche)}
.amarilla .btn{background:var(--noche);border-color:var(--noche);color:var(--blanco)}

/* cabecera */
.nav{position:sticky;top:0;z-index:50;background:rgba(17,17,17,.9);backdrop-filter:saturate(1.3) blur(10px);border-bottom:1px solid var(--linea)}
.nav__in{display:flex;align-items:center;justify-content:space-between;gap:20px;height:72px}
.nav__logo{height:34px;width:auto}
.nav .btn{padding:11px 18px;font-size:15px}
@media(max-width:699px){.nav .btn{display:none}}

/* bandas */
.band{padding:clamp(80px,12vw,150px) 0}
.band--2{background:var(--noche-2)}
.papel{background:var(--papel);color:var(--noche)}
.papel .entr,.papel .lead{color:#2b2b2b}
.papel .etq{color:#5f5a52}
.amarilla{background:var(--amarillo);color:var(--noche)}
.amarilla .etq{color:var(--noche)}
.amarilla .entr{color:#1a1a1a;line-height:1.45}

/* ===== PORTADA ===== */
.hero{min-height:calc(100svh - 72px);display:flex;flex-direction:column;justify-content:center;padding:60px 0 50px}
@media(max-width:899px){.hero{justify-content:flex-start;padding:32px 0 28px}.hero .baja{margin-top:auto;padding-top:32px}}
.hero h1{max-width:15ch;margin:26px 0 24px;font-size:min(var(--t-h1),11vw)}
.datos{display:flex;flex-wrap:wrap;gap:8px 10px;margin-top:24px;list-style:none}
.datos li{font-size:16px;font-weight:700;padding:7px 14px;border-radius:99px;border:1.5px solid var(--linea);color:var(--texto-2)}
.baja{display:inline-flex;align-items:center;gap:10px;margin-top:40px;font-weight:700;font-size:16px;color:var(--gris);text-decoration:none;align-self:flex-start}
.baja svg{width:22px;height:22px;animation:bota 1.6s ease-in-out infinite}
@keyframes bota{50%{transform:translateY(6px)}}

/* foto grande */
.foto-xl{margin:0}
.foto-xl img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:var(--r)}
@media(min-width:900px){.foto-xl img{aspect-ratio:16/8}}
.foto-xl figcaption{margin-top:16px;color:var(--gris);font-size:18px;max-width:46ch}

/* pantalla que se ilumina línea a línea */
.golpe{background:var(--noche)}
.golpe__alto{height:280vh;position:relative}
.golpe__fijo{position:sticky;top:0;height:100svh;display:flex;flex-direction:column;justify-content:center}
.golpe .l{font-size:min(var(--t-golpe),calc((100vw - 44px) / 13.7));white-space:nowrap;color:#363636;transition:color .35s}
.golpe .l.on{color:var(--blanco)}
.golpe .l.on .cita{color:var(--amarillo)}
@media(max-width:899px){.golpe .l{line-height:1.25}.golpe .remate{font-size:var(--t-texto)}}
.golpe .remate{font-size:var(--t-entradilla);color:var(--amarillo);font-weight:700;margin-top:30px;max-width:30ch;opacity:0;transform:translateY(10px);transition:opacity .5s,transform .5s}
.golpe .remate.on{opacity:1;transform:none}

/* lista con marcas amarillas */
.checks{list-style:none;display:grid;gap:16px;margin-top:30px;max-width:44ch}
.checks li{position:relative;padding-left:44px}
.checks li::before{content:"✓";position:absolute;left:0;top:2px;font-weight:900;font-size:15px;width:28px;height:28px;border-radius:50%;background:var(--amarillo);color:var(--noche);display:grid;place-items:center}
.checks li span{color:var(--gris)}
.papel .checks li span{color:#5f5a52}

/* tarjetas */
.tarjetas{display:grid;gap:18px;margin-top:40px}
@media(min-width:900px){.tarjetas{grid-template-columns:repeat(2,1fr)}.tarjetas--3{grid-template-columns:repeat(3,1fr)}}
.tarjeta{border-radius:var(--r);border:2px solid var(--noche-3);background:var(--noche-2);padding:30px 26px;display:flex;flex-direction:column;gap:14px;transition:transform .35s var(--e),box-shadow .35s var(--e),border-color .35s}
@media(min-width:900px){.tarjeta{padding:40px}}
.tarjeta:hover{transform:translateY(-6px);box-shadow:8px 8px 0 var(--amarillo);border-color:var(--amarillo)}
.tarjeta .meta{font-size:var(--t-etiqueta);font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--amarillo)}
.tarjeta ul{list-style:none;display:grid;gap:10px;color:var(--texto-2);font-size:20px}
.tarjeta li{position:relative;padding-left:24px}
.tarjeta li::before{content:"";position:absolute;left:0;top:.55em;width:10px;height:10px;border-radius:50%;background:var(--amarillo)}
.papel .tarjeta{background:var(--blanco);border-color:var(--noche)}
.papel .tarjeta ul{color:#2b2b2b}

/* pasos numerados */
.pasos{list-style:none;counter-reset:paso;display:grid;gap:0;margin-top:34px;max-width:760px}
.pasos li{counter-increment:paso;position:relative;padding:20px 0 20px 64px;border-top:1px solid var(--linea)}
.pasos li:first-child{border-top:0}
.pasos li::before{content:counter(paso);position:absolute;left:0;top:18px;width:44px;height:44px;border-radius:50%;border:2px solid var(--amarillo);color:var(--amarillo);display:grid;place-items:center;font-weight:900;font-size:18px}
.pasos b{display:block;font-size:var(--t-entradilla);letter-spacing:-.02em;line-height:1.2}
.pasos span{color:var(--gris)}
.pasos .subr{color:var(--blanco)}
.papel .pasos li{border-color:var(--linea-papel)}
.papel .pasos li::before{border-color:var(--noche);color:var(--noche)}
.papel .pasos span{color:#5f5a52}

/* cifras */
.cifras .fila{display:grid;gap:40px 56px;margin-top:10px}
@media(min-width:900px){.cifras .fila{grid-template-columns:repeat(3,1fr)}}
.cifra b{display:block;font-family:Unbounded,sans-serif;font-weight:700;font-size:var(--t-cifra);line-height:.95;letter-spacing:-.06em}
.cifra b small{font-size:.45em;color:var(--amarillo);vertical-align:.6em;margin-left:4px}
.cifra .lab{display:block;margin-top:12px;color:var(--gris)}

/* testimonios: carrusel que mueve la persona, vídeo dentro de la página */
.fila-h{display:grid;grid-auto-flow:column;grid-auto-columns:78%;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding:26px 20px 8px;scroll-padding-inline:20px;margin:0 -20px;scrollbar-width:none}
.fila-h::-webkit-scrollbar{display:none}
@media(min-width:900px){.fila-h{grid-auto-columns:calc((100% - 32px) / 3);margin:0;padding:26px 0 8px;scroll-padding-inline:0}}
.vid{scroll-snap-align:start;border-radius:24px;overflow:hidden;background:var(--noche-2);border:2px solid var(--noche-3)}
.vid video{width:100%;aspect-ratio:9/14;object-fit:cover;background:#000;height:auto}
.vid figcaption{padding:16px 18px 18px;font-size:16px;line-height:1.35;color:var(--gris)}
.vid figcaption b{display:block;color:var(--blanco);font-size:18px}
.vid figcaption q{display:block;color:var(--texto-2);font-size:17px;margin-top:8px;quotes:"“" "”"}
.flechas{display:flex;gap:10px;margin-top:16px}
.flechas button{width:60px;height:60px;border-radius:50%;border:2px solid var(--blanco);background:transparent;font-size:24px;cursor:pointer;color:var(--blanco);transition:background .2s,color .2s}
.flechas button:hover{background:var(--blanco);color:var(--noche)}

/* foto pequeña (polaroid) */
.historia{display:grid;gap:40px;align-items:start}
@media(min-width:900px){.historia{grid-template-columns:320px 1fr;gap:70px}}
.foto{position:relative;width:min(300px,85%)}
@media(min-width:900px){.foto{width:100%}}
.foto img{border-radius:22px;border:2px solid var(--blanco);transform:rotate(-2.5deg);aspect-ratio:1/1;object-fit:cover;width:100%;height:auto}
.foto .cinta{position:absolute;top:-12px;left:50%;width:96px;height:26px;background:rgba(245,192,0,.85);transform:translateX(-50%) rotate(3deg);border-radius:3px;z-index:1}
.historia p{max-width:38ch;color:var(--texto-2)}
.historia h2{margin:12px 0 22px}

/* precio */
.precio{max-width:560px;border-radius:var(--r);border:2px solid var(--amarillo);background:var(--noche-2);padding:clamp(26px,4vw,44px);margin-top:36px}
.precio .cifra-precio{font-family:Unbounded,sans-serif;font-weight:700;font-size:var(--t-cifra);letter-spacing:-.06em;line-height:1}
.precio .cifra-precio small{font-family:Aileron,sans-serif;font-size:22px;letter-spacing:0;color:var(--gris);font-weight:700}
.precio .checks{margin-top:24px}
.precio .btn{width:100%;margin-top:30px}
.garantia{margin-top:24px;padding:18px 20px;border-left:5px solid var(--amarillo);background:rgba(245,192,0,.08);border-radius:0 16px 16px 0}
.garantia b{color:var(--amarillo)}
.nota{margin-top:26px;max-width:560px;color:var(--gris);font-size:19px}
.nota b{color:var(--blanco)}

/* preguntas */
.faq{margin-top:34px;display:grid;gap:14px;max-width:900px}
.faq details{border:2px solid var(--linea);border-radius:22px;padding:6px 26px;transition:border-color .2s}
.faq details[open]{border-color:var(--amarillo)}
.faq summary{cursor:pointer;list-style:none;font-weight:900;font-size:var(--t-entradilla);letter-spacing:-.02em;line-height:1.25;padding:20px 0;display:flex;justify-content:space-between;gap:16px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-weight:400;font-size:1.3em;line-height:.8;color:var(--amarillo);transition:transform .3s var(--e)}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq p{padding:0 0 22px;max-width:46ch;color:var(--texto-2)}

/* cierre */
.cierre{min-height:90svh;display:flex;align-items:center;padding:12vh 0}
.cierre h2{font-family:Unbounded,sans-serif;font-weight:700;letter-spacing:-.045em;line-height:1.08;font-size:var(--t-golpe);max-width:16ch;margin-top:14px}
.cierre .entr{margin-top:18px}

/* pie */
footer{border-top:1px solid var(--linea);color:var(--gris);padding:48px 0 40px;font-size:17px}
.pie{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;align-items:center}
.pie img{height:30px;width:auto}
.pie nav{display:flex;gap:20px;flex-wrap:wrap}
.pie a{text-decoration:none}.pie a:hover{color:var(--blanco)}

/* barra fija en el móvil (aparece al pasar la portada) */
.fija{position:fixed;left:0;right:0;bottom:0;z-index:60;padding:12px 16px calc(12px + env(safe-area-inset-bottom));background:rgba(17,17,17,.94);border-top:1px solid var(--linea);transform:translateY(110%);transition:transform .35s var(--e)}
.fija.on{transform:none}
.fija .btn{width:100%}
@media(min-width:700px){.fija{display:none}}
@media(max-width:699px){body{padding-bottom:84px}}

/* cursor de gota (el de la web de aude) */
.gota{pointer-events:none;position:fixed;top:0;left:0;z-index:1000;filter:url(#goo);mix-blend-mode:difference;opacity:0;transition:opacity .3s}
.gota.on{opacity:1}
.gota span{position:absolute;left:0;top:0;width:26px;height:26px;border-radius:50%;background:#fff;will-change:transform}

/* aparición suave */
.ap{opacity:0;transform:translateY(24px);transition:opacity .8s var(--e),transform .8s var(--e)}
.ap.on{opacity:1;transform:none}
.rise{animation:rise .9s var(--e) both}
.d1{animation-delay:.08s}.d2{animation-delay:.16s}.d3{animation-delay:.24s}.d4{animation-delay:.32s}
@keyframes rise{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.ap{opacity:1;transform:none}.golpe .l{color:var(--blanco)}.golpe .remate{opacity:1;transform:none}}

/* ===== PIEZAS DE LA LANDING DEL CLUB ===== */
/* portada en dos golpes: el titular y la promesa */
.hero .promesa{font-size:min(var(--t-h2),9vw);font-weight:900;letter-spacing:-.035em;line-height:1.02;color:var(--amarillo);margin-top:6px}
.hero .promesa .aparte{color:var(--gris)}
.hero h1 .aparte{font-size:var(--t-entradilla)}

/* vídeo de presentación (vertical) */
.vsl{display:grid;gap:34px;align-items:center}
@media(min-width:900px){.vsl{grid-template-columns:380px 1fr;gap:70px}}
.vsl__v{position:relative;width:min(380px,100%)}
.vsl video{width:100%;aspect-ratio:9/16;object-fit:cover;border-radius:var(--r);border:2px solid var(--noche-3);background:#000;height:auto}
/* portada del vídeo: botón grande y la invitación a darle (03/10) */
.vsl__play{position:absolute;inset:0;border:0;border-radius:var(--r);cursor:pointer;color:var(--blanco);font:inherit;text-align:left;display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;gap:16px;padding:28px 24px;background:linear-gradient(180deg,rgba(17,17,17,0) 45%,rgba(17,17,17,.9) 88%)}
.vsl__play .boton{width:72px;height:72px;flex:none;border-radius:50%;background:var(--amarillo);display:grid;place-items:center;animation:late 2s ease-in-out infinite;transition:transform .3s var(--e)}
.vsl__play .boton svg{width:28px;height:28px;margin-left:4px}
.vsl__play:hover .boton{transform:scale(1.08)}
.vsl__play b{font-size:28px;font-weight:900;letter-spacing:-.025em;line-height:1.12;max-width:13ch}
.vsl__play b span{color:var(--amarillo)}
.vsl__play.fuera{display:none}
@keyframes late{0%,100%{box-shadow:0 0 0 0 rgba(245,192,0,.45)}50%{box-shadow:0 0 0 16px rgba(245,192,0,0)}}

/* antes → después */
.cambio{list-style:none;display:grid;gap:14px;margin-top:34px;max-width:900px}
.cambio li{display:grid;gap:6px;padding:20px 22px;border-radius:20px;background:var(--noche-2);border:1px solid var(--linea)}
@media(min-width:900px){.cambio li{grid-template-columns:1fr 40px 1fr;align-items:center;gap:16px}}
.cambio .antes{color:var(--gris);text-decoration:line-through;text-decoration-color:rgba(255,255,255,.25)}
.cambio .flecha{color:var(--amarillo);font-weight:900}
.cambio .despues{font-weight:700}
.manifiesto{font-size:var(--t-entradilla);line-height:1.35;max-width:32ch;margin-top:40px}

/* para quién: sí / no */
.sino{display:grid;gap:18px;margin-top:36px}
@media(min-width:900px){.sino{grid-template-columns:1fr 1fr}}
.sino > div{border-radius:var(--r);padding:28px 26px;border:2px solid var(--linea)}
.sino .si{border-color:var(--amarillo)}
.sino h3{font-size:26px;margin-bottom:14px}
.sino ul{list-style:none;display:grid;gap:10px;font-size:20px;color:var(--texto-2)}
.sino li{position:relative;padding-left:30px}
.sino .si li::before{content:"✓";position:absolute;left:0;color:var(--amarillo);font-weight:900}
.sino .no li::before{content:"✕";position:absolute;left:0;color:var(--gris);font-weight:900}

/* garantía (banda amarilla) */
.amarilla h2{max-width:none;font-size:min(var(--t-h2),8.2vw)}
.miedos{list-style:none;display:grid;gap:12px;margin-top:34px}
@media(min-width:900px){.miedos{grid-template-columns:repeat(2,1fr)}}
/* tarjetas oscuras sobre el amarillo: se leen mucho mejor que las translúcidas (06/10) */
.miedos li{background:var(--noche);color:var(--texto-2);border-radius:18px;padding:18px 20px;font-size:19px;line-height:1.45}
.miedos b{display:block;font-size:21px;color:var(--amarillo);margin-bottom:4px}

/* opiniones escritas */
.citas{display:grid;grid-auto-flow:column;grid-auto-columns:82%;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;margin:30px -20px 0;padding:0 20px 6px;scrollbar-width:none}
.citas::-webkit-scrollbar{display:none}
@media(min-width:900px){.citas{grid-auto-columns:calc((100% - 28px) / 3);margin:30px 0 0;padding:0}}
.citas blockquote{scroll-snap-align:start;border-left:5px solid var(--amarillo);background:var(--noche-2);border-radius:0 18px 18px 0;padding:20px 22px;font-size:19px;line-height:1.4;color:var(--texto-2)}
.citas cite{display:block;margin-top:12px;font-style:normal;color:var(--gris);font-size:16px}
.citas cite b{color:var(--blanco)}

/* fundadores: fila que se desliza a mano */
.fundadores{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(200px,46%);gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;margin:34px -20px 0;padding:0 20px 8px;scrollbar-width:none}
.fundadores::-webkit-scrollbar{display:none}
@media(min-width:900px){.fundadores{grid-auto-columns:220px;margin:34px 0 0;padding:0 0 8px}}
.fcard{scroll-snap-align:start;border-radius:22px;background:var(--noche-2);border:1px solid var(--linea);padding:18px;display:flex;flex-direction:column;gap:4px;min-height:190px}
.fcard .logo{height:64px;border-radius:14px;background:#fff;display:grid;place-items:center;margin-bottom:10px;overflow:hidden;font-weight:900;color:var(--noche);font-size:22px}
.fcard .logo img{max-height:52px;max-width:80%;width:auto;height:auto}
.fcard .logo--oscuro{background:var(--noche-3)}
.fcard b{font-size:18px;line-height:1.2}
.fcard span{font-size:15px;color:var(--gris)}
.fcard--libre{border:2px dashed var(--amarillo);background:transparent}
.fcard--libre .logo{background:transparent;border:2px dashed var(--amarillo);color:var(--amarillo)}
.plazas{margin-top:22px;font-size:var(--t-entradilla);font-weight:700}
.plazas b{color:var(--amarillo)}
.precio .detalle{color:var(--gris);font-size:17px;margin-top:14px}
/* foto de grupo (La Mesa): cuadrada en el móvil, 4:3 y más estrecha en ordenador para no cortar cabezas */
.foto-xl--grupo{max-width:900px}
.foto-xl--grupo img{aspect-ratio:1/1;object-position:50% 30%}
@media(min-width:900px){.foto-xl--grupo img{aspect-ratio:4/3}}

/* ===== 03/10 (noche): ajustes pedidos por Sergio ===== */
/* etiqueta de la portada en una sola línea en el móvil */
@media(max-width:480px){.pastilla{font-size:12.5px;letter-spacing:.06em;padding:8px 14px;gap:8px}}
/* datos de la portada: los tres en la misma fila */
.datos--fila{flex-wrap:nowrap}
.datos--fila li{white-space:nowrap}
@media(max-width:480px){.datos--fila{gap:6px}.datos--fila li{font-size:14px;padding:6px 11px}}
/* subrayado amarillo sobre la banda clara: texto oscuro */
.papel .subr{color:var(--noche)}
/* pasos que se encienden al bajar, unidos por una línea */
.pasos--anim li{opacity:.35;transition:opacity .45s var(--e)}
.pasos--anim li.on{opacity:1}
.pasos--anim li::before{transition:background .45s,color .45s}
.pasos--anim li.on::before{background:var(--amarillo);color:var(--noche)}
.pasos--anim li:not(:last-child)::after{content:"";position:absolute;left:21px;top:66px;bottom:-18px;width:2px;background:var(--linea);transition:background .45s}
.pasos--anim li.on:not(:last-child)::after{background:var(--amarillo)}
.pasos--anim li{border-top:0}
@media(prefers-reduced-motion:reduce){.pasos--anim li{opacity:1}}
/* línea aparte dentro de una etiqueta de cifra */
.lab small{display:block;font-size:inherit}

/* portada: aclaración encima del botón, con aire */
.antes-boton{margin-top:34px;font-size:20px;color:var(--gris)}
.antes-boton+.btns{margin-top:12px}
/* pantalla negra: las primeras líneas ya en blanco; las tareas se encienden, se tachan y llega el remate */
.golpe .l--fija{color:var(--blanco)}
.golpe .tachable .cita{position:relative;transition:color .5s}
.golpe .tachable .cita::after{content:"";position:absolute;left:-1%;right:-1%;top:54%;height:.09em;border-radius:99px;background:var(--blanco);transform:scaleX(0);transform-origin:left;transition:transform .55s var(--e)}
.golpe .tachable.tachada .cita{color:#6b6b6b}
.golpe .tachable.tachada .cita::after{transform:scaleX(1)}
.golpe .tachable:nth-of-type(4) .cita::after,.golpe .tachable:nth-of-type(4) .cita{transition-delay:.18s}
.golpe .tachable:nth-of-type(5) .cita::after,.golpe .tachable:nth-of-type(5) .cita{transition-delay:.36s}
.golpe .remate--golpe{font-family:Unbounded,sans-serif;font-weight:700;letter-spacing:-.045em;line-height:1.08;font-size:min(var(--t-golpe),calc((100vw - 44px) / 13.7));max-width:none;margin-top:34px}
@media(max-width:899px){.golpe .remate--golpe{font-size:min(var(--t-golpe),calc((100vw - 44px) / 13.7))}}

/* ===== 04/10: aprendizajes de grupoaude.com (Web_aprendizajes_grupoaude.md) ===== */
/* más aire entre párrafos */
.entr+.entr,.historia p+p{margin-top:20px}
/* la frase que resume la sección, aparte, con la raya amarilla */
.porlo{margin-top:34px;padding:20px 22px;border-left:5px solid var(--amarillo);background:var(--noche-2);border-radius:0 16px 16px 0;font-weight:700;font-size:var(--t-entradilla);line-height:1.3;max-width:34ch}
/* títulos de tarjeta subrayados en amarillo */
.tarjeta h3{text-decoration:underline;text-decoration-color:var(--amarillo);text-decoration-thickness:.12em;text-underline-offset:.16em;text-decoration-skip-ink:none}
.tarjeta h3 .am{color:inherit}
/* bloques que se encienden al llegar a ellos (antes → después) */
.encender{opacity:.3;filter:grayscale(1);transition:opacity .5s var(--e),filter .5s}
.encender.on{opacity:1;filter:none}
@media(prefers-reduced-motion:reduce){.encender{opacity:1;filter:none}}
/* opiniones escritas con estrellas, como las reseñas de grupoaude.com */
.citas blockquote{border-left:0;border:1px solid var(--linea);border-radius:22px;padding:24px 22px;display:flex;flex-direction:column;gap:12px}
.citas blockquote::before{content:"★★★★★";color:var(--amarillo);letter-spacing:3px;font-size:17px}
/* fundadores: tira que avanza sola muy despacio y que se puede mover con el dedo (o arrastrando con el ratón).
   El movimiento lo hace club.js con el scroll (no con una animación CSS), para que el dedo pueda cogerla (06/10). */
.tira{overflow-x:auto;overflow-y:hidden;scrollbar-width:none;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;cursor:grab;margin:34px -20px 0;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 20px,#000 calc(100% - 20px),transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 20px,#000 calc(100% - 20px),transparent 100%)}
.tira::-webkit-scrollbar{display:none}
.tira.arrastrando{cursor:grabbing;user-select:none}
@media(min-width:900px){.tira{margin:34px 0 0}}
.tira__pista{display:flex;width:max-content;padding-left:20px}
.tira .fundadores{display:flex;margin:0;padding:0 14px 0 0;gap:14px;overflow:visible}
.tira .fcard{width:210px;flex:none}
.tira img{-webkit-user-drag:none;user-select:none;pointer-events:none}
.fcard .logo--texto{background:var(--noche-3)}
.fcard .logo--texto span{font:700 15px/1.1 Unbounded,sans-serif;text-transform:lowercase;letter-spacing:-.02em;color:var(--blanco)}
/* pantalla negra con frases más largas ("no me da tiempo a todo"): letra algo menor para que quepan en una línea */
.golpe--largo .l{font-size:min(var(--t-golpe),calc((100vw - 44px) / 15.6))}
/* foto del taller (La Mesa): 4:3 en todos los tamaños */
.foto-xl--taller img{aspect-ratio:4/3}
.foto-xl figcaption small{font-size:inherit;opacity:.75}

/* foco de lectura (06/10, idea de Sergio): en el móvil, lo que está de media pantalla para abajo se ve tenue y
   algo borroso, y se enciende al subir. Va con filter (no con opacity) para no chocar con las apariciones .ap/.rise.
   La clase la pone club.js solo en móvil y si no se pide menos movimiento. Los botones nunca se apagan. */
.foco{transition:filter .45s var(--e)}
.foco:not(.foco--on){filter:blur(1.5px) opacity(.32)}
.foco.foco--on{filter:blur(0) opacity(1)}