/* =========================================================================
   Estudio Lumbre · sistema «Alta gama» con puente a la marca Laura G.Arias
   Fuente de verdad: docs/DECISIONES.md, sección SISTEMA DE DISEÑO.
   Ningún color fuera de :root. Un solo acento. Doble bisel en contenedores.
   ========================================================================= */

:root{
  --paper:#fdfbf7; --paper-2:#f2f1f5; --ink:#222c58; --ink-2:#5a6180;
  --hair:rgba(34,44,88,.10); --hair-2:rgba(34,44,88,.06);
  --ember:#b4380a; --ember-soft:#f7ece3; --card:#fffefb;
  --shell:rgba(34,44,88,.038); --campo-borde:#8b90a5;
  --curva:cubic-bezier(.32,.72,0,1);
  --ro:32px;                /* radio exterior de la carcasa */
  --ri:calc(32px - 7px);    /* radio interior concéntrico */
  --wrap:1420px;
}
@media (prefers-color-scheme:dark){
  :root{ --paper:#101322; --paper-2:#161a2e; --ink:#eef0f7; --ink-2:#9aa2c0;
         --hair:rgba(238,240,247,.11); --hair-2:rgba(238,240,247,.06);
         --ember:#f0863f; --ember-soft:#2b1a10; --card:#191d31;
         --shell:rgba(238,240,247,.05); --campo-borde:#7c85a8; }
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);
  font:400 17px/1.6 "Lexend Deca",system-ui,-apple-system,sans-serif;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block;height:auto}
a{color:inherit}
h1,h2,h3{margin:0;font-family:"Plus Jakarta Sans","Lexend Deca",sans-serif;font-weight:800;
  letter-spacing:-.035em;line-height:1.03}
p{margin:0}
:focus-visible{outline:2px solid var(--ember);outline-offset:4px}
.wrap{max-width:var(--wrap);margin:0 auto;padding-inline:28px}

/* Grano de película: fijo, sin eventos, nunca sobre contenido con scroll */
body::after{content:"";position:fixed;inset:0;z-index:40;pointer-events:none;opacity:.032;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='140' height='140'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/></filter><rect width='140' height='140' filter='url(%23n)'/></svg>")}

.saltar{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.saltar:focus{position:fixed;left:12px;top:12px;z-index:50;width:auto;height:auto;clip-path:none;
  background:var(--ember);color:#fff;padding:12px 20px;border-radius:999px;text-decoration:none}

/* --- Navegación isla ----------------------------------------------------- */
.isla{position:sticky;top:22px;z-index:30;margin:22px auto 0;width:max-content;
  max-width:calc(100% - 40px);display:flex;align-items:center;gap:26px;
  padding:9px 9px 9px 22px;border-radius:999px;background:rgba(253,251,247,.72);
  backdrop-filter:blur(20px) saturate(160%);-webkit-backdrop-filter:blur(20px) saturate(160%);
  box-shadow:0 1px 0 rgba(255,255,255,.7) inset,0 10px 40px -12px rgba(34,44,88,.20),0 0 0 1px var(--hair)}
@media (prefers-color-scheme:dark){.isla{background:rgba(22,26,46,.7);
  box-shadow:0 1px 0 rgba(255,255,255,.06) inset,0 10px 40px -12px rgba(0,0,0,.6),0 0 0 1px var(--hair)}}
@media (prefers-reduced-transparency:reduce){.isla{background:var(--card);backdrop-filter:none;-webkit-backdrop-filter:none}}
.marca{font-family:"Plus Jakarta Sans",sans-serif;font-weight:800;letter-spacing:-.045em;
  font-size:19px;text-decoration:none;white-space:nowrap}
.marca span{color:var(--ember)}
/* --- El asterisco, firma de la marca -----------------------------------------
   Gira al pasar por encima y entra girando al cargar.

   La entrada SOLO rota, no toca la opacidad ni la escala. Es deliberado: el
   asterisco de ocho puntas es simétrico cada 45 grados, así que una vuelta
   completa empieza y acaba idéntica. Si la animación no llega a correr
   —sin JavaScript, o con la pestaña abierta en segundo plano, donde el
   navegador congela las animaciones— el asterisco se ve exactamente igual
   que si hubiera terminado. Ningún estado intermedio puede dejarlo raro.

   Sin fill, además, al acabar no queda nada pisando el transform y el efecto
   de hover funciona siempre.

   Nada de bucles infinitos: gastan batería y cansan a la tercera visita.    */
.asterisco{display:inline-block;color:var(--ember);font-weight:400;
  transform-origin:50% 55%;
  transition:transform .8s var(--curva)}
.js .asterisco{animation:llega-asterisco 1.1s var(--curva)}
@keyframes llega-asterisco{
  from{transform:rotate(-360deg)}
  to{transform:none}
}

/* Media vuelta al pasar por el logotipo */
.marca:hover .asterisco{transform:rotate(180deg) scale(1.18)}
.marca:active .asterisco{transform:rotate(180deg) scale(1)}

/* Y un cuarto de vuelta en los distintivos */
.distintivo>span[aria-hidden]{display:inline-block;transform-origin:50% 55%;
  transition:transform .7s var(--curva)}
.distintivo:hover>span[aria-hidden]{transform:rotate(90deg) scale(1.15)}

@media (prefers-reduced-motion:reduce){
  .js .asterisco{animation:none}
  .marca:hover .asterisco,.distintivo:hover>span[aria-hidden]{transform:none}
}
.isla ul{display:flex;gap:24px;list-style:none;margin:0;padding:0;font-size:14.5px}
.isla a{text-decoration:none;color:var(--ink-2);transition:color .5s var(--curva)}
.isla a:hover,.isla a[aria-current=page]{color:var(--ink)}
.isla .btn{padding:7px 7px 7px 20px;font-size:14.5px}
.isla .btn .glifo{width:28px;height:28px}
.etiqueta-corta{display:none}
@media(max-width:900px){.isla ul{display:none}}
/* A 375 px la etiqueta completa no cabe en la isla: se acorta, misma acción */
@media(max-width:560px){
  .isla{gap:12px;padding:7px 7px 7px 16px}
  .isla .btn{padding:7px 7px 7px 15px;font-size:13.5px;gap:9px}
  .etiqueta-larga{display:none}
  .etiqueta-corta{display:inline}
}

/* --- Botón isla con icono anidado ---------------------------------------- */
.btn{display:inline-flex;align-items:center;gap:12px;white-space:nowrap;
  padding:9px 9px 9px 24px;border-radius:999px;font:600 15px/1 "Lexend Deca",sans-serif;
  text-decoration:none;border:0;cursor:pointer;
  transition:transform .5s var(--curva),background .5s var(--curva),box-shadow .5s var(--curva)}
.btn .glifo{width:32px;height:32px;border-radius:999px;display:grid;place-items:center;
  transition:transform .5s var(--curva),background .5s var(--curva)}
.btn .glifo svg{width:14px;height:14px;stroke-width:1.25;fill:none;stroke:currentColor}
.btn:hover .glifo{transform:translate(3px,-1px) scale(1.06)}
.btn:active{transform:scale(.978)}
.btn-primario{background:var(--ember);color:#fff;
  box-shadow:0 1px 0 rgba(255,255,255,.22) inset,0 12px 30px -10px rgba(180,56,10,.55)}
.btn-primario .glifo{background:rgba(255,255,255,.18)}
.btn-primario:hover{background:#9c3008}
.btn-fantasma{background:var(--shell);color:var(--ink);box-shadow:0 0 0 1px var(--hair)}
.btn-fantasma .glifo{background:var(--shell)}
.btn-fantasma:hover{background:var(--paper-2)}
/* El color de enlace del contenedor no puede pisar el del botón */
.isla a.btn-primario,footer a.btn-primario,.cookies a.btn-primario{color:#fff}

/* --- Doble bisel --------------------------------------------------------- */
.bisel{background:var(--shell);border-radius:var(--ro);padding:7px;box-shadow:0 0 0 1px var(--hair)}
.bisel>.nucleo{border-radius:var(--ri);overflow:hidden;background:var(--card);
  box-shadow:0 1px 1px rgba(255,255,255,.7) inset,0 0 0 1px var(--hair-2)}
@media (prefers-color-scheme:dark){
  .bisel>.nucleo{box-shadow:0 1px 1px rgba(255,255,255,.07) inset,0 0 0 1px var(--hair-2)}}

.distintivo{display:inline-flex;align-items:center;gap:8px;border-radius:999px;padding:6px 14px;
  font-size:10.5px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;
  color:var(--ember);background:var(--ember-soft);box-shadow:0 0 0 1px var(--hair-2)}

/* --- Portada ------------------------------------------------------------- */
.portada{display:grid;grid-template-columns:minmax(0,43%) minmax(0,57%);gap:56px;align-items:center;
  padding-block:64px 88px}
.portada h1{font-size:clamp(42px,5.2vw,74px);margin-top:26px}
.entradilla{margin-top:26px;font-size:19px;color:var(--ink-2);max-width:40ch}
.acciones{margin-top:38px;display:flex;gap:12px;flex-wrap:wrap}
/* Variantes de cabecera de página interior */
.portada.breve{padding-block:64px 84px}
.portada.breve h1{font-size:clamp(36px,4.3vw,58px)}
.portada.solo-texto{display:block}
.portada.solo-texto>div{max-width:62ch}
@media(max-width:900px){.portada{grid-template-columns:1fr;gap:44px;padding-block:52px 72px}
  .portada.breve{padding-block:40px 56px}}

/* Ruta de pasos numerada */
.ruta{margin:56px 0 0;padding:0;list-style:none;counter-reset:paso;display:grid;gap:16px}
.ruta li{counter-increment:paso}
.ruta .nucleo{padding:30px 34px;display:grid;grid-template-columns:auto 1fr;gap:6px 26px;align-items:baseline}
.ruta .nucleo::before{content:counter(paso);grid-row:1 / span 2;font-family:"Plus Jakarta Sans",sans-serif;
  font-size:34px;font-weight:800;letter-spacing:-.04em;line-height:1;color:var(--ember);opacity:.55}
.ruta h3{font-size:20px;letter-spacing:-.025em}
.ruta p{font-size:15.5px;color:var(--ink-2);max-width:74ch}
@media(max-width:700px){.ruta .nucleo{grid-template-columns:1fr;gap:10px;padding:26px 24px}
  .ruta .nucleo::before{grid-row:auto;font-size:28px}}

/* Dos tarjetas enfrentadas */
.comparativa{margin-top:52px;display:grid;grid-template-columns:1fr 1fr;gap:18px}
.comparativa .nucleo{padding:36px 34px;height:100%}
.comparativa .etiqueta{font-size:10.5px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-2)}
.comparativa .grande{margin-top:14px;font-family:"Plus Jakarta Sans",sans-serif;font-size:29px;
  font-weight:800;letter-spacing:-.035em;line-height:1.1}
.comparativa p:last-child{margin-top:16px;font-size:15.5px;color:var(--ink-2)}
.comparativa .revela+.revela .grande,.comparativa>div:last-child .grande{color:var(--ember)}
@media(max-width:860px){.comparativa{grid-template-columns:1fr}}

.marco{position:relative}
.marco .nucleo img{width:100%;aspect-ratio:3/2;object-fit:cover}
.inserto{position:absolute;left:-26px;bottom:-40px;width:35%;max-width:246px;margin:0;
  background:var(--shell);border-radius:22px;padding:6px;
  box-shadow:0 0 0 1px var(--hair),0 26px 50px -18px rgba(34,44,88,.30)}
.inserto .nucleo{border-radius:16px;overflow:hidden;background:var(--card);padding-bottom:7px}
.inserto img{aspect-ratio:2/1;object-fit:cover}
.inserto figcaption{margin-top:8px;padding-inline:10px;font-size:10px;font-weight:600;
  letter-spacing:.2em;text-transform:uppercase;color:var(--ink-2)}
.pie-foto{margin-top:56px;font-size:14px;color:var(--ink-2)}
@media(max-width:900px){.inserto{left:-6px;bottom:-28px;width:42%}.pie-foto{margin-top:46px}}

/* --- Banda --------------------------------------------------------------- */
.banda{padding-block:30px}
.banda .nucleo{display:flex;gap:38px;align-items:center;flex-wrap:wrap;padding:24px 30px;
  background:var(--paper-2)}
.banda strong{font-size:15px;font-weight:600}
.banda ul{display:flex;gap:30px;list-style:none;margin:0;padding:0;flex-wrap:wrap;
  font-size:15px;color:var(--ink-2)}

/* --- Secciones ----------------------------------------------------------- */
.seccion{padding-block:120px}
.seccion.pegada{padding-block-start:0}
.seccion h2{font-size:clamp(32px,3.7vw,50px);max-width:18ch;margin-top:22px}
.sumario{margin-top:22px;font-size:18.5px;color:var(--ink-2);max-width:58ch}

.pasos{margin-top:64px;display:grid;grid-template-columns:1.35fr 1fr 1fr;gap:18px}
.pasos .nucleo{padding:34px 30px;height:100%}
.paso h3{font-size:21px;letter-spacing:-.025em}
.paso p{margin-top:12px;font-size:15.5px;color:var(--ink-2)}
@media(max-width:860px){.pasos{grid-template-columns:1fr}}

.galeria{display:grid;grid-template-columns:1.55fr 1fr;gap:18px;margin-top:60px}
.galeria figure{margin:0}
.galeria .columna{display:grid;gap:18px}
.galeria figcaption{margin-top:12px;padding-inline:8px;font-size:14px;color:var(--ink-2)}
@media(max-width:860px){.galeria{grid-template-columns:1fr}}

/* --- Precios -------------------------------------------------------------- */
.precios{display:grid;grid-template-columns:1.22fr 1fr;gap:18px;margin-top:60px;align-items:start}
.pack .nucleo{padding:38px 34px}
.pack.destacado>.bisel{background:var(--ember-soft);box-shadow:0 0 0 1px rgba(180,56,10,.18)}
.pack .nombre{font-size:10.5px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-2)}
.pack.destacado .nombre{color:var(--ember)}
.pack .precio{margin-top:16px;font-family:"Plus Jakarta Sans",sans-serif;font-size:50px;
  font-weight:800;letter-spacing:-.045em;line-height:1}
.pack .precio small{font-size:17px;font-weight:500;color:var(--ink-2);letter-spacing:0}
.pack ul{margin:24px 0 0;padding:0;list-style:none;display:grid;gap:12px;font-size:15.5px;color:var(--ink-2)}
.pack li{display:flex;gap:12px;align-items:flex-start}
.pack li svg{flex:0 0 auto;width:15px;height:15px;margin-top:4px;stroke:var(--ember);
  stroke-width:1.25;fill:none}
.pack .btn{margin-top:30px;width:100%;justify-content:space-between}
.columna-packs{display:grid;gap:18px}
.columna-packs .nucleo{padding:30px 28px}
.columna-packs .precio{font-size:36px}
.letra-pequena{margin-top:26px;font-size:14px;color:var(--ink-2);max-width:70ch}
@media(max-width:860px){.precios{grid-template-columns:1fr}}

/* --- Quién está detrás ----------------------------------------------------- */
.quien .nucleo{display:grid;grid-template-columns:.72fr 1.15fr .9fr;gap:52px;align-items:center;
  padding:64px 56px;background:var(--paper-2)}
.retrato{margin:0}
.retrato img{width:100%;max-width:300px;filter:drop-shadow(0 22px 34px rgba(34,44,88,.16))}
.quien h2{font-size:clamp(27px,2.9vw,38px);margin-top:0}
.quien p{margin-top:20px;color:var(--ink-2);font-size:17px}
.firma{font-size:15px}
.firma a{color:var(--ink);text-decoration:underline;text-underline-offset:3px;
  text-decoration-color:var(--ember)}
.cifras{display:grid;grid-template-columns:1fr 1fr;gap:36px 26px}
.cifra b{display:block;font-family:"Plus Jakarta Sans",sans-serif;font-size:46px;font-weight:800;
  letter-spacing:-.045em;line-height:1;color:var(--ember)}
.cifra span{display:block;margin-top:9px;font-size:14px;color:var(--ink-2)}
@media(max-width:1080px){.quien .nucleo{grid-template-columns:.8fr 1.2fr;gap:44px}
  .quien .cifras{grid-column:1 / -1}}
@media(max-width:860px){.quien .nucleo{grid-template-columns:1fr;gap:36px;padding:44px 28px}
  .retrato img{max-width:220px}}

/* --- Preguntas (summary es hijo directo de details, obligatorio) ----------- */
.preguntas{margin-top:56px;display:grid;gap:14px}
.preguntas details{background:var(--shell);border-radius:var(--ro);padding:7px;
  box-shadow:0 0 0 1px var(--hair)}
.preguntas summary{list-style:none;cursor:pointer;padding:26px 62px 26px 30px;position:relative;
  font-size:18.5px;font-weight:600;letter-spacing:-.02em;background:var(--card);
  border-radius:var(--ri);box-shadow:0 1px 1px rgba(255,255,255,.7) inset,0 0 0 1px var(--hair-2);
  transition:border-radius .5s var(--curva)}
.preguntas summary::-webkit-details-marker{display:none}
.preguntas details[open] summary{border-radius:var(--ri) var(--ri) 0 0;box-shadow:none}
.preguntas .cuerpo{background:var(--card);border-radius:0 0 var(--ri) var(--ri)}
.preguntas summary::after{content:"";position:absolute;right:26px;top:50%;width:26px;height:26px;
  margin-top:-13px;border-radius:999px;background:var(--shell);box-shadow:0 0 0 1px var(--hair)}
.preguntas summary::before{content:"";position:absolute;right:33px;top:50%;width:12px;height:12px;
  margin-top:-6px;z-index:1;background:
    linear-gradient(var(--ember),var(--ember)) center/12px 1.4px no-repeat,
    linear-gradient(var(--ember),var(--ember)) center/1.4px 12px no-repeat;
  transition:transform .5s var(--curva)}
.preguntas details[open] summary::before{transform:rotate(135deg)}
.preguntas p{padding:0 30px 30px;color:var(--ink-2);max-width:68ch}

/* --- Texto legal ----------------------------------------------------------- */
.texto-legal{margin-top:22px;max-width:74ch}
.texto-legal p{font-size:16.5px;color:var(--ink-2);margin-bottom:16px}
.texto-legal p:last-child{margin-bottom:0}
.texto-legal strong{color:var(--ink);font-weight:600}
.texto-legal a{color:var(--ink);text-decoration:underline;text-underline-offset:3px;
  text-decoration-color:var(--ember)}
.texto-legal ul{margin:0 0 16px;padding:0;list-style:none;display:grid;gap:9px}
.texto-legal ul li{font-size:16.5px;color:var(--ink-2);padding-left:16px;
  border-left:2px solid var(--hair)}
.tabla-legal{width:100%;border-collapse:collapse;margin-bottom:16px;font-size:15.5px}
.tabla-legal th{text-align:left;font-size:11px;font-weight:600;letter-spacing:.16em;
  text-transform:uppercase;color:var(--ink-2);padding:0 14px 10px 0}
.tabla-legal td{padding:12px 14px 12px 0;color:var(--ink-2);
  border-top:1px solid var(--hair);vertical-align:top}
@media(max-width:620px){.tabla-legal,.tabla-legal tbody,.tabla-legal tr,.tabla-legal td{display:block;width:100%}
  .tabla-legal thead{display:none}
  .tabla-legal tr{border-top:1px solid var(--hair);padding:12px 0}
  .tabla-legal td{border:0;padding:2px 0}
  .tabla-legal td:first-child{color:var(--ink);font-weight:600}}

/* --- Formularios ---------------------------------------------------------- */
.formulario .nucleo{padding:38px 34px}
.campo{margin-bottom:22px}
.campo:last-of-type{margin-bottom:26px}
.campo label{display:block;font-size:14.5px;font-weight:600;margin-bottom:8px}
.campo .opcional{font-weight:400;color:var(--ink-2)}
.campo .ayuda{font-size:14px;color:var(--ink-2);margin:-2px 0 10px}
.campo input[type=text],.campo input[type=email],.campo input[type=tel],
.campo select,.campo textarea{
  width:100%;font:400 16px/1.5 "Lexend Deca",sans-serif;color:var(--ink);
  background:var(--paper);border:0;border-radius:12px;padding:13px 15px;
  box-shadow:0 0 0 1px var(--campo-borde);transition:box-shadow .3s var(--curva)}
.campo textarea{resize:vertical;min-height:120px}
.campo input:focus,.campo select:focus,.campo textarea:focus{
  outline:none;box-shadow:0 0 0 2px var(--ember)}
.campo input::placeholder,.campo textarea::placeholder{color:var(--ink-2)}
.fila{display:grid;grid-template-columns:1fr 1fr;gap:18px}
@media(max-width:620px){.fila{grid-template-columns:1fr}}

.casilla label{display:flex;gap:12px;align-items:flex-start;font-weight:400;
  font-size:15px;line-height:1.5;cursor:pointer}
.casilla input[type=checkbox]{flex:0 0 auto;width:20px;height:20px;margin-top:2px;
  accent-color:var(--ember);cursor:pointer}
.casilla .opcional{display:block;font-size:13.5px;margin-top:3px}

.campo.con-error input,.campo.con-error select,.campo.con-error textarea{
  box-shadow:0 0 0 2px var(--ember)}
.error{margin-top:7px;font-size:14px;font-weight:500;color:var(--ember)}
.aviso-error{margin-bottom:22px;padding:14px 16px;border-radius:12px;font-size:15px;
  background:var(--ember-soft);color:var(--ink);box-shadow:0 0 0 1px rgba(180,56,10,.22)}

.formulario button{width:100%;justify-content:space-between}
.trampa{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);
  white-space:nowrap;pointer-events:none}

.legal-primera-capa{margin-top:24px;padding-top:22px;border-top:1px solid var(--hair)}
.legal-primera-capa p{font-size:13px;line-height:1.6;color:var(--ink-2)}
.legal-primera-capa a{color:var(--ink);text-decoration:underline;
  text-underline-offset:2px;text-decoration-color:var(--ember)}

.promesas{margin:32px 0 0;padding:0;list-style:none;display:grid;gap:12px;font-size:15.5px;
  color:var(--ink-2)}
.promesas li{display:flex;gap:12px;align-items:flex-start}
.promesas li svg{flex:0 0 auto;width:16px;height:16px;margin-top:4px;stroke:var(--ember);
  stroke-width:1.25;fill:none}

/* --- Cierre y pie ---------------------------------------------------------- */
.cierre .nucleo{padding:96px 62px;background:var(--paper-2)}
.cierre h2{font-size:clamp(34px,4.3vw,58px);max-width:15ch;margin-top:22px}
footer{padding-block:56px 44px;font-size:14px;color:var(--ink-2)}
footer .wrap{display:flex;justify-content:space-between;gap:26px;flex-wrap:wrap}
footer ul{display:flex;gap:22px;list-style:none;margin:0;padding:0;flex-wrap:wrap}
footer a{text-decoration:none;transition:color .5s var(--curva)}
footer a:hover{color:var(--ink)}

/* --- Banner de cookies ------------------------------------------------------ */
.cookies{position:fixed;left:16px;right:16px;bottom:16px;z-index:35;background:var(--card);
  border-radius:var(--ro);padding:20px 26px;display:flex;gap:24px;align-items:center;
  justify-content:space-between;flex-wrap:wrap;font-size:15px;
  box-shadow:0 0 0 1px var(--hair),0 22px 50px -18px rgba(34,44,88,.34)}
.cookies-btn{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.cookies-btn a{font-size:14px;color:var(--ink-2)}

/* --- La primera pantalla no se anima ----------------------------------------
   `.entra` existe pero no hace nada, y es a propósito. Esconder el titular,
   la entradilla o el formulario detrás de una animación significa que si esa
   animación no corre (pestaña abierta en segundo plano, JavaScript lento,
   navegador que la ignora) el visitante ve una página vacía justo donde se
   decide la visita. Lo de arriba aparece y punto. El movimiento empieza por
   debajo del primer pantallazo, donde fallar no cuesta nada.                 */

/* --- Revelado al entrar en pantalla -----------------------------------------
   Para lo que está por debajo del primer pantallazo. Solo se oculta si hay
   JavaScript: sin JS todo se ve, que es lo que importa para quien no lo tenga
   y para los rastreadores.                                                   */
.js .revela{opacity:0;transform:translateY(46px);filter:blur(9px);
  transition:opacity .85s var(--curva),transform .85s var(--curva),filter .85s var(--curva)}
.js .revela.dentro{opacity:1;transform:none;filter:none}
@media (prefers-reduced-motion:reduce){
  *{transition:none!important;animation:none!important}
  .js .revela{opacity:1!important;transform:none!important;filter:none!important}
}