/* Escencia · presentación (/escencia/, landing v3 del 22-oct-2026, docs/ESCENCIA.md → "Landing v3 (22-oct-2026)") y base de /escencia/catalogo/
   (que suma catalogo.css). Venta sobria: blanco o negro, tinta, UN acento azul, Instrument Serif + Geist, capturas reales, aire; sin degradados,
   pastillas, contadores ni urgencias. Movimiento propio sin bibliotecas (entrada por desplazamiento, cabecera compacta, fundido de la vitrina),
   todo apagado con prefers-reduced-motion. La presentación usa solo el estilo A; el B (?estilo=b) sigue para el catálogo y marca.css (registro,
   entrar, términos, montaje), con estas mismas variables: si se cambia una, se cambia la otra (tools/test-escencia-landing.mjs las compara). */

/* ---------- estilos ----------
   --f fondo · --s superficie · --s2 franja · --t tinta · --t2 tinta suave · --l línea · --l2 borde de control (≥ 3:1) · --p relleno del botón principal
   · --pt su letra · --ac acento como texto (enlaces) · --fin-* franja del cierre · --fh letra de los títulos */
:root,:root[data-estilo=a]{--f:#FFFFFF;--s:#FFFFFF;--s2:#F6F6F4;--t:#0E0E10;--t2:#55565C;--l:#E7E7E4;--l2:#8A8B92;--p:#1B3A8C;--pt:#FFFFFF;--ac:#1B3A8C;--ok:#1D6B43;--mal:#A3261B;
  --marco:#E2E2DF;--sombra:0 1px 2px rgba(14,14,16,.05),0 28px 56px -28px rgba(14,14,16,.22);--fin-f:#0E0E10;--fin-t:#F3F3F1;--fin-t2:#A9A9B0;--fin-p:#FFFFFF;--fin-pt:#0E0E10;color-scheme:light}
@media (prefers-color-scheme:dark){
  :root:not([data-tema=claro]),:root[data-estilo=a]:not([data-tema=claro]){--f:#0C0C0E;--s:#141417;--s2:#111114;--t:#F3F3F1;--t2:#A3A3AA;--l:#26262B;--l2:#6E6E76;--p:#AFC1F2;--pt:#0C0C0E;--ac:#AFC1F2;--ok:#8FD3A8;--mal:#FFA99C;
    --marco:#2A2A30;--sombra:0 28px 56px -28px rgba(0,0,0,.7);--fin-f:#15151A;--fin-t:#F3F3F1;--fin-t2:#A3A3AA;--fin-p:#AFC1F2;--fin-pt:#0C0C0E;color-scheme:dark}
}
:root[data-tema=oscuro],:root[data-estilo=a][data-tema=oscuro]{--f:#0C0C0E;--s:#141417;--s2:#111114;--t:#F3F3F1;--t2:#A3A3AA;--l:#26262B;--l2:#6E6E76;--p:#AFC1F2;--pt:#0C0C0E;--ac:#AFC1F2;--ok:#8FD3A8;--mal:#FFA99C;
  --marco:#2A2A30;--sombra:0 28px 56px -28px rgba(0,0,0,.7);--fin-f:#15151A;--fin-t:#F3F3F1;--fin-t2:#A3A3AA;--fin-p:#AFC1F2;--fin-pt:#0C0C0E;color-scheme:dark}
:root[data-estilo=b]{--f:#0B0B0A;--s:#151513;--s2:#111110;--t:#EDEAE4;--t2:#A6A096;--l:#272623;--l2:#75706A;--p:#EDEAE4;--pt:#0B0B0A;--ac:#93BBA0;--ok:#93BBA0;--mal:#FFA99C;
  --marco:#2A2926;--sombra:0 28px 56px -28px rgba(0,0,0,.75);--fin-f:#151513;--fin-t:#EDEAE4;--fin-t2:#A6A096;--fin-p:#EDEAE4;--fin-pt:#0B0B0A;color-scheme:dark}
:root[data-estilo=b][data-tema=claro]{--f:#FAF9F6;--s:#FFFFFF;--s2:#F2F0EB;--t:#191816;--t2:#5B574F;--l:#E4E1DA;--l2:#8C877D;--p:#191816;--pt:#FAF9F6;--ac:#2E5C43;--ok:#2E5C43;--mal:#A3261B;
  --marco:#E0DDD5;--sombra:0 1px 2px rgba(25,24,22,.05),0 28px 56px -28px rgba(25,24,22,.22);--fin-f:#191816;--fin-t:#FAF9F6;--fin-t2:#B9B4AA;--fin-p:#FAF9F6;--fin-pt:#191816;color-scheme:light}
/* letra de cada dirección */
:root{--fh:'Instrument Serif',Georgia,'Times New Roman',serif;--fhw:400;--fhl:-.012em;--h1:clamp(42px,11.2vw,88px);--h2:clamp(32px,7.6vw,54px);--h3:23px;--r:8px;--logo:30px}

/* ---------- base ---------- */
*{box-sizing:border-box}html{background:var(--f);scroll-behavior:smooth;-webkit-text-size-adjust:100%}html,body{overflow-x:clip}
body{margin:0;background:var(--f);color:var(--t);font:400 16px/1.6 'Geist',system-ui,-apple-system,'Segoe UI',sans-serif;-webkit-font-smoothing:antialiased;font-feature-settings:'ss01'}
img{max-width:100%;display:block}a{color:var(--ac);text-underline-offset:3px;text-decoration-thickness:1px}
:focus-visible{outline:2px solid var(--ac);outline-offset:3px;border-radius:4px}
.ancho{width:min(1160px,100%);margin:0 auto;padding:0 16px}@media (min-width:760px){.ancho{padding:0 24px}}.angosto{max-width:820px}
.saltar{position:absolute;left:12px;top:-60px;z-index:50;padding:10px 14px;border-radius:8px;background:var(--s);color:var(--t)}.saltar:focus{top:10px}
h1,h2,h3{margin:0;color:var(--t);font-family:var(--fh);font-weight:var(--fhw);letter-spacing:var(--fhl);text-wrap:balance}
h2{font-size:var(--h2);line-height:1.05;margin-bottom:16px}
h3{font-size:var(--h3);line-height:1.2;margin-bottom:8px}
p{margin:0}
.sub{margin:0 0 32px;max-width:56ch;color:var(--t2);font-size:17px;line-height:1.55;text-wrap:pretty}
section{padding:40px 0;scroll-margin-top:64px}@media (min-width:900px){section{padding:104px 0}}
section.alt{background:var(--s2);border-top:1px solid var(--l);border-bottom:1px solid var(--l)}

/* botones: un solo principal por bloque; el resto contorneado (docs/UX.md §2.5) */
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 22px;border-radius:var(--r);border:1px solid var(--p);background:var(--p);color:var(--pt);text-decoration:none;font:500 16px/1 'Geist',system-ui,sans-serif;letter-spacing:-.005em;cursor:pointer;transition:opacity .2s ease-out}
.btn:hover{opacity:.88}
.btn.sec{background:transparent;color:var(--t);border-color:var(--l2)}.btn.sec:hover{opacity:1;border-color:var(--t)}
.btn.chico{min-height:40px;padding:0 16px;font-size:14.5px}
.acc{display:flex;flex-wrap:wrap;gap:12px}


/* ---------- cabecera: se compacta al bajar (landing.js pone .compacta cuando #centinela sale de la vista) ---------- */
.cab{position:sticky;top:0;z-index:30;background:color-mix(in srgb,var(--f) 86%,transparent);-webkit-backdrop-filter:saturate(1.2) blur(14px);backdrop-filter:saturate(1.2) blur(14px);border-bottom:1px solid transparent;transition:border-color .3s ease-out}
.cab .ancho{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:72px;transition:min-height .3s ease-out}
.cab.compacta{border-bottom-color:var(--l)}.cab.compacta .ancho{min-height:56px}
.logo{color:var(--t);text-decoration:none;font:var(--fhw) var(--logo)/1 var(--fh);letter-spacing:-.02em;transition:font-size .3s ease-out}
.cab.compacta .logo{font-size:24px}
.cab nav{display:flex;align-items:center;gap:2px}
.cab nav a:not(.btn){display:inline-flex;align-items:center;min-height:44px;padding:0 12px;color:var(--t2);text-decoration:none;font-size:15px;font-weight:450}
.cab nav a:not(.btn):hover{color:var(--t)}
.cab nav .btn{margin-left:8px}
@media (max-width:760px){.cab nav a.n-l{display:none}}
#centinela{height:1px;margin-top:-1px}

/* ---------- portada ---------- */
.heroe{padding:40px 0 36px}@media (min-width:900px){.heroe{padding:112px 0 80px}}
.h-txt{max-width:900px}
.cejilla{margin:0 0 18px;color:var(--t2);font-size:15px;font-weight:450;letter-spacing:.01em}
h1{font-size:var(--h1);line-height:1;margin:0 0 20px;max-width:16ch}
.lead{margin:0 0 32px;max-width:46ch;font-size:clamp(17px,4.4vw,21px);line-height:1.5;color:var(--t2);text-wrap:pretty}
.letra{margin:16px 0 0;font-size:14.5px;color:var(--t2)}
.cupo{margin:8px 0 0;font-size:14.5px;color:var(--t2);font-variant-numeric:tabular-nums}.cupo[hidden]{display:none}.cupo b{font-weight:550;color:var(--t)}
@media (max-width:519px){.heroe .acc{flex-wrap:nowrap;gap:10px}.heroe .acc .btn{flex:1 1 0;padding:0 10px;font-size:15.5px}}

/* la vitrina: dos capturas con pestañas y fundido (landing.js) */
.vitrina{margin:36px 0 0}@media (min-width:900px){.vitrina{margin-top:80px}}
.pest{display:flex;gap:4px;margin:0 0 16px;border-bottom:1px solid var(--l)}
.pest button{flex:0 0 auto;min-height:44px;padding:0 14px;border:0;background:none;color:var(--t2);font:450 15px/1 'Geist',system-ui,sans-serif;cursor:pointer;box-shadow:inset 0 -2px 0 transparent;transition:color .2s ease-out,box-shadow .2s ease-out}
.pest button:first-child{padding-left:0}
.pest button[aria-selected=true]{color:var(--t);box-shadow:inset 0 -2px 0 var(--t)}
.marco{position:relative;aspect-ratio:16/9;overflow:hidden;border:1px solid var(--marco);border-radius:12px;background:var(--s2);box-shadow:var(--sombra)}
@media (max-width:599px){.marco{aspect-ratio:4/3}}
.marco picture{position:absolute;inset:0;opacity:0;transition:opacity .3s ease-out}.marco img{width:100%;height:100%;object-fit:cover;object-position:top left}
.vitrina[data-v=pos] picture.v-pos,.vitrina[data-v=ti] picture.v-ti{opacity:1}
.vitrina figcaption{margin-top:14px;font-size:13.5px;line-height:1.5;color:var(--t2)}
.vitrina figcaption span{display:none}.vitrina[data-v=pos] figcaption .v-pos,.vitrina[data-v=ti] figcaption .v-ti{display:inline}
.usan{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 28px;margin:36px 0 0;padding:20px 0 0;border-top:1px solid var(--l);font-size:14.5px;color:var(--t2)}
.usan b{font-weight:450}
.usan a{color:var(--t);text-decoration:none;font:var(--fhw) 21px/1.2 var(--fh);letter-spacing:var(--fhl)}
.usan a:hover{text-decoration:underline}
.usan span span{margin-left:8px}@media (max-width:599px){.usan{margin-top:24px;padding-top:16px;gap:4px 20px}.usan b{flex:1 0 100%}.usan span span{display:none}}

/* ---------- lo que hace: cinco bloques, texto a un lado y pantalla al otro ---------- */
.bloque{display:grid;gap:24px;padding:40px 0 0;margin-top:40px;border-top:1px solid var(--l)}
@media (min-width:900px){.bloque{grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:72px;align-items:center;padding-top:64px;margin-top:64px}.bloque:nth-child(odd) .b-txt{order:2}}
#hace .sub{margin-bottom:8px}
.bloque .cejilla{margin-bottom:12px}
.bloque h3{font-size:clamp(26px,6.4vw,38px);line-height:1.1;margin-bottom:20px;max-width:18ch}
.lista{list-style:none;margin:0;padding:0}
.lista li{padding:10px 0;border-top:1px solid var(--l);font-size:15.5px;line-height:1.45;color:var(--t)}
.lista li:last-child{border-bottom:1px solid var(--l)}
.lista b{font-weight:550}.lista li small{display:block;font-size:14.5px;color:var(--t2);max-width:44ch}
.mas{display:inline-flex;align-items:center;gap:6px;min-height:44px;margin-top:12px;font-weight:500;text-decoration:none}
.mas:hover{text-decoration:underline}
.captura{margin:0}.captura picture{display:block;aspect-ratio:16/9;overflow:hidden;border:1px solid var(--marco);border-radius:12px;background:var(--s2);box-shadow:var(--sombra)}
@media (max-width:599px){.captura picture{aspect-ratio:4/3}}
.captura img{width:100%;height:100%;object-fit:cover;object-position:top left}
.captura figcaption,.chat figcaption,.lectura figcaption{margin-top:12px;font-size:13.5px;line-height:1.5;color:var(--t2)}
.chat,.lectura{margin:0;width:min(420px,100%);justify-self:center}
.chat p,.lectura p{margin:0}
.chat .de-cliente,.chat .de-bot{max-width:84%;padding:10px 14px;border-radius:14px;font-size:14.5px;line-height:1.45}
.chat .de-cliente{margin:0 0 8px auto;background:var(--p);color:var(--pt);border-bottom-right-radius:4px}
.chat .de-bot{margin:0 auto 8px 0;background:var(--s);border:1px solid var(--marco);color:var(--t);border-bottom-left-radius:4px}
.lectura{padding:18px 20px;border:1px solid var(--marco);border-radius:14px;background:var(--s);box-shadow:var(--sombra)}
.lectura .l-cab{display:flex;justify-content:space-between;gap:12px;margin-bottom:12px;padding-bottom:10px;border-bottom:1px solid var(--l);font-size:14.5px}
.lectura .l-cab b{font-weight:550}.lectura .l-cab span{color:var(--t2)}
.lectura p:not(.l-cab){padding:6px 0;font-size:15px;line-height:1.5;color:var(--t)}
.lectura figcaption{padding-top:10px;border-top:1px solid var(--l)}

/* ---------- para quién es ---------- */
.tres{display:grid;gap:24px}@media (min-width:900px){.tres{grid-template-columns:repeat(3,minmax(0,1fr));gap:48px}}
.tres article{padding-top:20px;border-top:1px solid var(--t)}
.tres h3{font-size:clamp(23px,5.6vw,30px);line-height:1.15;margin-bottom:10px}
.tres p{color:var(--t2);font-size:16px;line-height:1.55;max-width:40ch;margin-bottom:12px}
.tres a{display:inline-flex;align-items:center;gap:6px;min-height:44px;font-weight:500;text-decoration:none}.tres a:hover{text-decoration:underline}

/* ---------- cómo empezamos ---------- */
.pasos{list-style:none;margin:0;padding:0;display:grid;gap:0;counter-reset:p}
@media (min-width:900px){.pasos{grid-template-columns:repeat(3,minmax(0,1fr));gap:48px}}
.pasos li{counter-increment:p;display:grid;grid-template-columns:36px minmax(0,1fr);gap:0 8px;padding:14px 0;border-top:1px solid var(--l)}
@media (min-width:900px){.pasos li{grid-template-columns:1fr;padding:20px 0 0;border-top-color:var(--t)}}
.pasos li::before{content:counter(p,decimal-leading-zero);grid-row:span 2;font:500 14px/1.6 'Geist',sans-serif;color:var(--t2);font-variant-numeric:tabular-nums}
@media (min-width:900px){.pasos li::before{grid-row:auto;margin-bottom:12px}}
.pasos b{font-weight:550;font-size:16.5px}.pasos>li>span{font-size:15px;line-height:1.5;color:var(--t2)}
.demo-d{scroll-margin-top:72px}
.demo-d>summary>span{display:grid;gap:2px}.demo-d>summary b{font-weight:550;font-size:16.5px}.demo-d>summary small{font-size:14.5px;font-weight:400;color:var(--t2)}
@media (min-width:900px){.demo-d{border:1px solid var(--l)!important;border-radius:16px;background:var(--s);padding:12px 32px 32px}.demo-d>summary{pointer-events:none}.demo-d>summary::after{display:none}.demo-d>summary b{font:var(--fhw) var(--h3)/1.2 var(--fh);letter-spacing:var(--fhl)}}
.demo{display:grid;gap:20px;align-items:center;padding:4px 0 24px}
@media (min-width:900px){.demo{grid-template-columns:minmax(0,1fr) 280px;gap:28px;padding:12px 0 0}#b-restobar{grid-template-columns:minmax(0,1fr) minmax(0,1.35fr)}}
@media (max-width:899px){.detras{display:none}}
.detras{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.detras li{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 8px;font-size:15px;color:var(--t2);transition:color .3s ease-out}
.detras li::before{content:'';flex:0 0 auto;align-self:center;width:8px;height:8px;border-radius:50%;border:1px solid var(--l2);transition:background .3s ease-out,border-color .3s ease-out}
.detras b{font-weight:500;color:var(--t)}.detras span{font-size:13.5px}
.detras li.on::before{background:var(--ok);border-color:var(--ok)}

/* ---------- movimiento: entrada por desplazamiento solo con opacity/transform, 300 ms, cascada ≤ 6 × 45 ms (landing.js pone .on) ---------- */
@media (prefers-reduced-motion:no-preference){
  html.js .rev{opacity:0;transform:translateY(14px);transition:opacity .3s ease-out,transform .3s ease-out;transition-delay:calc(var(--i,0) * 45ms)}
  html.js .rev.on{opacity:1;transform:none}
}
/* el punto de venta en miniatura (escencia/landing.js) */
.cel{justify-self:center;width:min(340px,100%);min-height:340px;padding:14px;border:1px solid var(--marco);border-radius:20px;background:var(--s);box-shadow:var(--sombra);display:flex;flex-direction:column;gap:10px;font-size:14px}
.cel button{font:inherit;color:inherit;cursor:pointer}
.p-cab{display:flex;align-items:center;gap:10px;padding:2px 2px 10px;border-bottom:1px solid var(--l)}
.p-cab b{font-weight:600;flex:1}.p-cab span{font-size:12.5px;color:var(--t2)}
.p-atras{width:36px;height:36px;border-radius:8px;border:1px solid var(--l2);background:none;font-size:20px!important;line-height:1}
.p-mesas{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.p-mesas button{display:grid;gap:4px;padding:14px 4px;border:1px solid var(--l2);border-radius:10px;background:var(--f);text-align:center;transition:border-color .2s ease-out}
.p-mesas button b{font-weight:600;font-size:16px}.p-mesas small{font-size:11.5px;color:var(--t2)}
.p-mesas button:not(.ocu):hover{border-color:var(--t)}
.p-mesas .ocu{background:var(--s2);border-style:dashed;cursor:default}
.p-pista{margin:auto 0 4px;text-align:center;font-weight:500;color:var(--t2)}
.p-prods{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.p-prods button{display:grid;gap:2px;padding:10px;border:1px solid var(--l2);border-radius:8px;background:var(--f);text-align:left}
.p-prods button:active{transform:scale(.98)}.p-prods b{font-weight:550}.p-prods small{font-size:12.5px;color:var(--t2)}
.p-lineas{list-style:none;margin:0;padding:0;display:grid;gap:6px;flex:1;align-content:start;min-height:80px}
.p-lineas li{display:grid;grid-template-columns:1fr auto auto;gap:8px;align-items:center;padding:6px 8px;border-radius:6px;background:var(--s2);font-size:13.5px}
.p-lineas em{font-style:normal;font-size:12px;color:var(--t2);white-space:nowrap}.p-lineas b{font-weight:550;font-variant-numeric:tabular-nums}
.p-lineas .vacio{display:block;text-align:center;color:var(--t2);background:none}
.p-lineas .nuevo{animation:entra .35s ease-out}
@keyframes entra{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.p-cobrar{min-height:46px;border-radius:var(--r);border:1px solid var(--p)!important;background:var(--p)!important;color:var(--pt)!important;font-weight:500!important}
.p-cobrar[disabled]{opacity:.4;cursor:default}
.p-total{display:grid;gap:2px;text-align:center;padding:8px 0}.p-total small,.p-ops small{font-size:12.5px;color:var(--t2)}
.p-total b{font:600 32px/1.1 'Geist',sans-serif;letter-spacing:-.03em;font-variant-numeric:tabular-nums}.p-total em{font-style:normal;font-size:12.5px;color:var(--t2)}
.p-ops{display:grid;gap:6px}.p-ops div{display:flex;flex-wrap:wrap;gap:6px}
.p-ops button{flex:1 1 auto;min-height:40px;padding:0 10px;border:1px solid var(--l2);border-radius:8px;background:none;font-size:13px!important}
.p-ops button.on{background:var(--t);color:var(--f);border-color:var(--t)}
.p-fin{margin:auto 0;display:grid;gap:8px;justify-items:center;text-align:center}
.p-fin i{width:48px;height:48px;display:grid;place-items:center;border-radius:50%;border:1px solid var(--ok);color:var(--ok);font-style:normal;font-size:22px}
.p-fin b{font:600 21px/1.2 'Geist',sans-serif;letter-spacing:-.02em}.p-fin span{color:var(--t2)}.p-fin p{margin:0;color:var(--t2);font-size:13.5px}
.p-otra{min-height:40px;padding:0 14px;border:1px solid var(--l2);border-radius:8px;background:none}

/* ---------- precio: tabla sobria ---------- */
.tabla{border-top:1px solid var(--t)}
.fila{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 16px;padding:20px 0;border-bottom:1px solid var(--l)}
@media (min-width:760px){.fila{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) 200px;gap:32px;padding:28px 0;align-items:baseline}}
.c-plan b{display:block;font-weight:550;font-size:17px}.c-plan span{display:block;margin-top:2px;font-size:14.5px;line-height:1.5;color:var(--t2)}
.c-precio{text-align:right}@media (min-width:760px){.c-precio{text-align:left}}
.c-precio>b{display:block;font:var(--fhw) 30px/1.1 var(--fh);letter-spacing:var(--fhl);font-variant-numeric:tabular-nums;white-space:nowrap}
:root[data-estilo=a] .c-precio>b{font-size:36px}
.c-precio>b small{font:400 14px/1 'Geist',system-ui,sans-serif;letter-spacing:0;color:var(--t2)}
.c-precio>span{display:block;font-size:13.5px;line-height:1.45;color:var(--t2);max-width:30ch;margin-left:auto}@media (min-width:760px){.c-precio>span{margin-left:0}}
@media (max-width:759px){.fila{gap:2px 16px;padding:16px 0;align-items:center}.c-precio,.c-plan{display:contents}.c-plan b{grid-row:1;grid-column:1}.c-precio>b{grid-row:1;grid-column:2;text-align:right}.c-plan>span{grid-row:2;grid-column:1/-1}.c-precio>span{grid-row:3;grid-column:1;max-width:none;margin:0;text-align:left}.c-acc{grid-row:3;grid-column:2;text-align:right}}
.c-acc a{display:inline-flex;align-items:center;gap:6px;min-height:44px;font-weight:500;text-decoration:none}.c-acc a:hover{text-decoration:underline}
@media (min-width:760px){.c-acc{text-align:right}}
.nota{margin-top:20px;font-size:14px;color:var(--t2)}.nota[hidden]{display:none}

/* ---------- preguntas ---------- */
details{border-bottom:1px solid var(--l)}details:first-of-type{border-top:1px solid var(--l)}
summary{display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:56px;padding:12px 0;cursor:pointer;list-style:none;font-weight:500;font-size:16.5px}
summary::-webkit-details-marker{display:none}
summary::after{content:'';flex:0 0 auto;width:10px;height:10px;border-right:1.5px solid var(--t2);border-bottom:1.5px solid var(--t2);transform:translateY(-3px) rotate(45deg);transition:transform .25s ease-out}
details[open] summary::after{transform:translateY(2px) rotate(-135deg)}
details p{margin:0 0 18px;max-width:64ch;color:var(--t2);font-size:15.5px}

/* ---------- cierre y pie ---------- */
.final{text-align:center;background:var(--fin-f);color:var(--fin-t)}@media (min-width:900px){.final{padding:128px 0}}
.final h2{color:var(--fin-t);margin-bottom:10px}.final p{color:var(--fin-t2);font-size:17px}
.final .btn{margin-top:28px;background:var(--fin-p);color:var(--fin-pt);border-color:var(--fin-p)}
.final .chico{margin-top:20px;font-size:14.5px}.final .chico a{color:var(--fin-t)}
footer{padding:24px 0 84px;color:var(--t2);font-size:14px;border-top:1px solid var(--l)}
footer .ancho{display:flex;flex-wrap:wrap;gap:8px 24px;justify-content:space-between}footer a{color:var(--t2)}
@media (min-width:761px){footer{padding-bottom:32px}}

/* barra pegajosa del celular: aparece cuando el botón de la portada ya no se ve (landing.js) */
.fija{position:fixed;left:0;right:0;bottom:0;z-index:25;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 16px calc(10px + env(safe-area-inset-bottom));background:color-mix(in srgb,var(--f) 94%,transparent);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-top:1px solid var(--l);font-size:14px;color:var(--t2);transform:translateY(110%);transition:transform .3s ease-out}
.fija.on{transform:none}.fija .btn{min-height:44px;flex:0 0 auto}
@media (min-width:761px){.fija{display:none}}

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