/* ============================================================
   RECUPERATIO — Sistema de diseño
   Marino + cian · Fraunces (display) + Manrope (texto)
   ============================================================ */

/* ---------- Tokens ---------- */
:root{
  --acento:#12b5e6;      /* cian (se sobreescribe desde header) */
  --marino:#0b1560;      /* azul marino */
  --marino-2:#0a1048;    /* marino profundo (pie) */
  --tinta:#0e1a44;       /* texto principal */
  --tinta-60:#4a5578;    /* texto secundario */
  --linea:#e6ecf5;       /* bordes suaves */
  --hueso:#f4f8fc;       /* fondo claro */
  --nube:#eaf4fb;        /* fondo azulado */
  --blanco:#ffffff;
  --acento-d:#0e93bd;    /* cian oscuro (hover) */
  --acento-l:#7fdcff;    /* cian claro */

  --r-s:12px; --r-m:18px; --r-l:26px; --r-xl:34px; --r-pill:999px;
  --sombra-s:0 2px 10px rgba(11,21,96,.06);
  --sombra-m:0 14px 40px -18px rgba(11,21,96,.28);
  --sombra-l:0 40px 90px -40px rgba(11,21,96,.45);
  --sombra-acento:0 18px 40px -14px rgba(18,181,230,.55);
  --ease:cubic-bezier(.22,1,.36,1);
  --ease-2:cubic-bezier(.65,0,.35,1);
  --wrap:1180px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  margin:0;font-family:"Manrope",system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  color:var(--tinta);background:var(--blanco);line-height:1.6;
  font-size:clamp(15px,.55vw + 13.5px,17px);
  overflow-x:hidden;
}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;cursor:pointer;border:0;background:none;color:inherit}
.wrap{width:min(100% - 2.4rem,var(--wrap));margin-inline:auto}
h1,h2,h3,h4{font-family:"Fraunces",Georgia,serif;font-weight:400;line-height:1.08;letter-spacing:-.01em;color:var(--marino);margin:0}
h1 strong,h2 strong,h3 strong{font-weight:700;color:var(--marino)}
p{margin:0 0 1rem}
.skip-link{position:absolute;left:-999px;top:0;background:var(--marino);color:#fff;padding:.6rem 1rem;z-index:200;border-radius:0 0 8px 0}
.skip-link:focus{left:0}
:focus-visible{outline:3px solid var(--acento);outline-offset:2px;border-radius:6px}

/* ---------- Iconos ----------
   El trazo se define aquí (no en el <g> del sprite): al usar <use> solo se
   clona el <symbol>, no su <g> padre, así que el stroke debe venir por CSS. */
.ico{width:1.35em;height:1.35em;flex:none;vertical-align:middle;
  fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.ico--xs{width:1em;height:1em}

/* ---------- Utilidades de sección ---------- */
.seccion{padding:clamp(3.5rem,7vw,6.5rem) 0}
.eyebrow{display:inline-flex;align-items:center;gap:.45rem;font-family:"Fraunces",Georgia,serif;font-weight:600;
  font-size:.9rem;letter-spacing:.01em;color:var(--acento-d);margin:0 0 .8rem}
.titular{font-size:clamp(1.9rem,4vw,3.1rem);margin-bottom:1rem}
.entradilla{font-size:clamp(1.02rem,1.4vw,1.18rem);color:var(--tinta-60);max-width:60ch}
.centro{text-align:center;margin-inline:auto}
.centro .entradilla{margin-inline:auto}

/* ============================================================
   Botones
   ============================================================ */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.6rem;
  font-family:"Manrope";font-weight:700;font-size:1rem;line-height:1.1;
  padding:.95rem 1.6rem;border-radius:var(--r-pill);position:relative;
  transition:transform .35s var(--ease),box-shadow .35s var(--ease),background .3s;
  will-change:transform}
.btn:hover{transform:translateY(-3px)}
.btn:active{transform:translateY(-1px)}
/* Texto blanco sobre un cian algo más profundo: sobre el cian claro el blanco
   se quedaba en 2,4:1 de contraste, por debajo del mínimo legible. Así sube a
   4,6:1 y el botón mantiene el color de marca. */
.btn--acento{background:#0a8fc0;color:#fff;box-shadow:var(--sombra-acento)}
.btn--acento:hover{background:#0a7fa8}
.btn--acento small{color:rgba(255,255,255,.82)}
.btn--acento strong{color:#fff}
.btn--marino{background:var(--marino);color:#fff}
.btn--marino:hover{background:#152080}
.btn--claro{background:#fff;color:var(--marino);box-shadow:var(--sombra-m)}
.btn--fantasma{background:transparent;border:2px solid var(--linea);color:var(--marino)}
.btn--fantasma:hover{border-color:var(--acento);color:var(--acento-d)}
.btn--bloque{width:100%}
.btn--grande{padding:1.15rem 2rem;font-size:1.08rem}
.btn--tel{padding:.5rem 1.4rem .5rem .55rem;text-align:left;gap:.7rem}
.btn--tel .ico{width:2.1rem;height:2.1rem;padding:.48rem;border-radius:50%;
  background:rgba(255,255,255,.55)}
.btn--tel span{display:flex;flex-direction:column;line-height:1.15}
.btn--tel small{font-size:.7rem;font-weight:700;opacity:.9;letter-spacing:.03em}
.btn--tel strong{font-size:1.12rem;letter-spacing:.02em}
.btn--claro.btn--tel .ico{background:var(--nube)}
/* CTA compacto en la cabecera */
.cab__cta{padding:.32rem .95rem .32rem .4rem;gap:.45rem}
.cab__cta .ico{width:1.55rem;height:1.55rem;padding:.34rem}
.cab__cta span{line-height:1.05}
.cab__cta small{font-size:.56rem;opacity:.85}
.cab__cta strong{font-size:.9rem}

/* Efecto glow pulsante en el CTA de teléfono */
.btn-glow::after{content:"";position:absolute;inset:0;border-radius:inherit;
  box-shadow:0 0 0 0 var(--acento);opacity:.6;animation:glow 2.6s var(--ease) infinite;z-index:-1}
@keyframes glow{0%{box-shadow:0 0 0 0 rgba(18,181,230,.5)}70%{box-shadow:0 0 0 16px rgba(18,181,230,0)}100%{box-shadow:0 0 0 0 rgba(18,181,230,0)}}

/* ============================================================
   Barra superior + Cabecera
   ============================================================ */
.topbar{background:var(--marino);color:#dfe6ff;font-size:.85rem}
.topbar__in{display:flex;justify-content:space-between;align-items:center;height:40px}
.topbar__sello{display:inline-flex;align-items:center;gap:.45rem;font-weight:600;letter-spacing:.03em}
.topbar__sello .ico{color:var(--acento-l);width:1.05em;height:1.05em}
.topbar__tel{display:inline-flex;align-items:center;gap:.4rem;font-weight:700;color:#fff}
.topbar__tel:hover{color:var(--acento-l)}

.cab{position:sticky;top:0;z-index:100;background:rgba(255,255,255,.86);
  backdrop-filter:saturate(1.4) blur(14px);border-bottom:1px solid var(--linea);
  transition:box-shadow .3s,background .3s}
.cab.is-stuck{box-shadow:var(--sombra-m)}
.cab>.wrap{width:min(100% - 1.6rem,1280px)}
.cab__in{display:flex;align-items:center;gap:1rem;height:76px}
.cab__logo{flex:none}
.cab__logo img{height:50px;width:auto;max-width:none}
.nav{margin-left:auto}
.nav__list{display:flex;gap:.05rem;list-style:none;margin:0;padding:0}
.nav__item{position:relative}
.nav__link{display:inline-flex;align-items:center;gap:.2rem;padding:.5rem .62rem;
  font-weight:600;font-size:.9rem;color:var(--marino);border-radius:10px;white-space:nowrap;
  transition:color .2s,background .2s}
.nav__link:hover,.nav__item:hover>.nav__link{color:var(--acento-d);background:var(--nube)}
.nav__link[aria-current]{color:var(--acento-d)}
.nav__caret{transition:transform .3s var(--ease)}
.nav__item:hover .nav__caret{transform:rotate(180deg)}

/* Mega menús */
.mega{position:absolute;top:calc(100% + 12px);left:50%;transform:translate(-50%,10px);
  background:#fff;border:1px solid var(--linea);border-radius:var(--r-l);
  box-shadow:var(--sombra-l);padding:.55rem;opacity:0;visibility:hidden;
  transition:opacity .28s var(--ease),transform .28s var(--ease);z-index:60}
.mega::before{content:"";position:absolute;top:-12px;left:0;right:0;height:12px}
.nav__item:hover .mega,.nav__item:focus-within .mega{opacity:1;visibility:visible;transform:translate(-50%,0)}
.mega__grid{display:grid;grid-template-columns:repeat(2,minmax(172px,1fr));gap:.1rem;width:376px}
.mega__card{display:flex;align-items:center;gap:.55rem;padding:.42rem .5rem;border-radius:11px;transition:background .2s,transform .2s}
.mega__card:hover{background:var(--nube);transform:translateX(3px)}
.mega__ico{display:grid;place-items:center;width:32px;height:32px;border-radius:9px;
  background:var(--nube);color:var(--acento-d);flex:none}
.mega__ico .ico{width:1.15rem;height:1.15rem}
.mega__card:hover .mega__ico{background:var(--acento);color:#fff}
.mega__txt strong{font-family:"Manrope";font-weight:700;color:var(--marino);font-size:.88rem}

.mega--prov{left:auto;right:0;transform:translate(0,10px)}
/* Desplegable por columnas (Familias, Recursos) y grupos con título dentro
   del de Tratamientos. */
.mega--cols{left:50%}
.mega--der{left:auto;right:0;transform:translate(0,10px)}
/* Entradas con foto: la miniatura ayuda a distinguir de un vistazo. */
.mega__trat--foto{align-items:center;gap:.7rem}
.mega__foto{flex:none;display:block;width:52px;height:52px;border-radius:11px;overflow:hidden;
  box-shadow:0 3px 10px rgba(11,21,96,.16)}
.mega__foto img{width:100%;height:100%;object-fit:cover;display:block;
  transition:transform .35s var(--ease)}
.mega__trat--foto:hover .mega__foto img{transform:scale(1.08)}

/* Menú móvil: las secciones con desplegable se abren como acordeón. */
.movil__grupo summary{cursor:pointer;list-style:none;display:flex;align-items:center;
  justify-content:space-between;gap:.6rem}
.movil__grupo summary::-webkit-details-marker{display:none}
.movil__grupo summary::after{content:"";width:9px;height:9px;flex:none;
  border-right:2px solid currentColor;border-bottom:2px solid currentColor;
  transform:rotate(45deg);transition:transform .25s var(--ease)}
.movil__grupo[open] summary::after{transform:rotate(-135deg)}
.movil__grupo > a{padding-left:1rem;font-size:.95rem;opacity:.85}
.movil__todo{font-weight:700;opacity:1!important}
.nav__item:hover .mega--der,.nav__item:focus-within .mega--der{transform:translate(0,0)}
.mega__grupos{display:grid;grid-template-columns:repeat(2,minmax(248px,1fr));gap:1.3rem;width:548px}
.mega__grupo{display:flex;flex-direction:column;gap:.1rem}
.mega__grupo-t{font-size:.72rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;
  color:var(--tinta-60);margin:.5rem 0 .35rem;padding:0 .45rem}
.mega__grupo-t:first-child{margin-top:0}
.mega__enlace{display:block;padding:.34rem .45rem;border-radius:9px;font-size:.9rem;
  font-weight:600;color:var(--marino);transition:background .2s,transform .2s}
.mega__enlace:hover{background:var(--nube);color:var(--acento-d);transform:translateX(3px)}
.nav__item:hover .mega--prov,.nav__item:focus-within .mega--prov{transform:translate(0,0)}
.mega__cols{display:grid;grid-template-columns:1fr .95fr;gap:1.1rem;width:580px}
.mega__trats{display:flex;flex-direction:column;gap:.1rem}
.mega__trat{display:flex;gap:.55rem;padding:.45rem;border-radius:11px;transition:background .2s}
.mega__trat:hover{background:var(--nube)}
.mega__trat .ico{color:var(--acento-d);margin-top:.15rem}
.mega__trat span{display:flex;flex-direction:column}
.mega__trat strong{font-family:"Manrope";font-weight:700;color:var(--marino);font-size:.95rem}
.mega__trat small{color:var(--tinta-60);font-size:.82rem;line-height:1.35}
.mega__prov{border-left:1px solid var(--linea);padding-left:1.2rem}
.mega__prov-t{font-family:"Manrope";font-weight:700;font-size:.85rem;letter-spacing:.01em;color:var(--tinta-60);margin:.3rem 0 .6rem}
.mega__prov-list{display:flex;flex-direction:column;gap:.1rem}
.mega__prov-list a{display:flex;align-items:center;gap:.4rem;padding:.35rem .4rem;border-radius:9px;font-weight:600;font-size:.92rem;color:var(--marino);transition:background .2s,color .2s}
.mega__prov-list a:hover{background:var(--nube);color:var(--acento-d)}
.mega__prov-list .ico{color:var(--acento)}
.mega__prov-all{color:var(--acento-d)!important;font-weight:700}

.cab__cta{margin-left:.3rem;flex:none;align-items:center}
.cab__burger{display:none;width:46px;height:46px;border-radius:12px;background:var(--nube);color:var(--marino);margin-left:auto}

/* Menú móvil */
.movil{position:fixed;inset:0;z-index:200}
.movil::before{content:"";position:absolute;inset:0;background:rgba(10,16,72,.5);
  opacity:0;transition:opacity .3s}
.movil.is-open::before{opacity:1}
.movil__panel{position:absolute;top:0;right:0;height:100%;width:min(88vw,360px);
  background:#fff;padding:1.4rem;display:flex;flex-direction:column;gap:1rem;
  transform:translateX(100%);transition:transform .4s var(--ease);overflow-y:auto}
.movil.is-open .movil__panel{transform:none}
.movil__top{display:flex;justify-content:space-between;align-items:center}
.movil__close{width:44px;height:44px;border-radius:12px;background:var(--nube);color:var(--marino);display:grid;place-items:center}
.movil__nav{display:flex;flex-direction:column;margin-top:.5rem}
.movil__nav a{padding:.9rem .4rem;font-weight:700;font-size:1.05rem;color:var(--marino);border-bottom:1px solid var(--linea)}
.movil__nav a:hover{color:var(--acento-d)}

/* ============================================================
   HERO
   ============================================================ */
.hero{position:relative;background:
    radial-gradient(120% 120% at 85% -10%,#12336e 0%,var(--marino) 45%,var(--marino-2) 100%);
  color:#eaf1ff;overflow:hidden;padding:clamp(2.4rem,5vw,4.2rem) 0 clamp(3.5rem,6vw,5rem)}
.hero__in{position:relative;z-index:2;display:grid;grid-template-columns:1.05fr .95fr;
  gap:clamp(1.5rem,4vw,3.5rem);align-items:center}
.hero__eyebrow{color:var(--acento-l)}
.hero__titulo{font-size:clamp(2.3rem,5.2vw,4rem);color:#fff;margin-bottom:1.1rem}
.hero__titulo strong{color:var(--acento-l)}
.hero__p{font-size:clamp(1.05rem,1.5vw,1.28rem);color:#c7d4f5;max-width:52ch;margin-bottom:1.8rem}
.hero__acc{display:flex;flex-wrap:wrap;gap:1rem;align-items:center;margin-bottom:1.9rem}
.hero__tel-txt{display:flex;flex-direction:column}
.hero__tel-txt small{color:#aebbe6;font-size:.85rem}
.hero__tel-txt a{font-family:"Fraunces";font-size:clamp(1.6rem,3vw,2.1rem);color:#fff;font-weight:600}
.hero__tel-txt a:hover{color:var(--acento-l)}
.hero__trust{display:flex;align-items:center;gap:1rem;flex-wrap:wrap;
  padding-top:1.4rem;border-top:1px solid rgba(255,255,255,.14)}
.hero__trust-chip{display:inline-flex;background:#fff;border-radius:14px;padding:.55rem .8rem;box-shadow:var(--sombra-m)}
.hero__trust-chip img{width:auto;height:auto;max-height:42px;max-width:100%}
.hero__trust span{font-size:.82rem;color:#aebbe6;max-width:24ch;line-height:1.4}

.hero__form{position:relative;z-index:2}

/* Burbujas decorativas (motivo del logo) */
.burbujas{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden}
/* Mismo motivo que el logo: círculo relleno con un aro concéntrico separado.
   El aro se hace con outline + outline-offset, que no ocupa espacio. */
.burbuja{position:absolute;border-radius:50%;opacity:.55;
  background:radial-gradient(circle at 35% 30%,var(--acento-l),var(--acento) 70%);
  outline:2px solid rgba(127,220,255,.45);outline-offset:6px;
  animation:flota var(--dur,14s) ease-in-out infinite;filter:blur(.3px)}
/* La contraria del logo: relleno marino con el aro en cian. */
.burbuja--o{background:radial-gradient(circle at 35% 30%,rgba(18,51,110,.95),rgba(8,14,44,.8) 70%);
  outline-color:rgba(127,220,255,.6);outline-offset:7px;opacity:.62}
/* Variantes para el pie: blanca y azul oscura, además de la cian de siempre. */
.burbuja--b{background:radial-gradient(circle at 35% 30%,#fff,rgba(226,238,255,.85) 70%);
  outline-color:rgba(255,255,255,.45);opacity:.5}
.burbuja--d{background:radial-gradient(circle at 35% 30%,#0c1550,#070c2e 70%);
  outline-color:rgba(127,220,255,.28);opacity:.85}
/* Que no vayan todas a la vez. */
.burbujas .burbuja:nth-child(2n){animation-name:flota2}
.burbujas .burbuja:nth-child(3n){animation-direction:reverse}
.burbujas .burbuja:nth-child(4n){animation-delay:-3s}

@keyframes flota{
  0%,100%{transform:translate(0,0) scale(1)}
  30%{transform:translate(16px,-34px) scale(1.06)}
  62%{transform:translate(-12px,-58px) scale(.95)}
}
@keyframes flota2{
  0%,100%{transform:translate(0,0) scale(1)}
  35%{transform:translate(-22px,-30px) scale(1.07)}
  70%{transform:translate(14px,-50px) scale(.94)}
}

/* Tarjeta de formulario */
.form-llamada{background:#fff;color:var(--tinta);border-radius:var(--r-xl);
  padding:clamp(1.4rem,2.5vw,2rem);box-shadow:var(--sombra-l);position:relative}
.form-llamada--hero{border:1px solid rgba(255,255,255,.5)}
.form-llamada__head{margin-bottom:1.1rem}
.form-llamada__eyebrow{display:inline-block;font-size:.72rem;font-weight:800;letter-spacing:.03em;
  color:var(--acento-d);background:var(--nube);padding:.35rem .7rem;border-radius:var(--r-pill);margin-bottom:.7rem}
.form-llamada__titulo{font-size:1.55rem;margin-bottom:.35rem}
.form-llamada__sub{color:var(--tinta-60);font-size:.95rem;margin:0}
.campo{margin-bottom:.9rem}
.campo label{display:block;font-weight:700;font-size:.85rem;color:var(--marino);margin-bottom:.35rem}
.campo__tel{display:flex;align-items:stretch;border:2px solid var(--linea);border-radius:var(--r-m);
  overflow:hidden;transition:border-color .25s,box-shadow .25s}
.campo__tel:focus-within{border-color:var(--acento);box-shadow:0 0 0 4px rgba(18,181,230,.15)}
.campo__pre{display:grid;place-items:center;padding:0 .9rem;background:var(--hueso);
  font-weight:800;color:var(--tinta-60)}
/* min-width:0 es imprescindible: por defecto un input no encoge por debajo de
   su tamaño intrínseco (~20 caracteres) y en móvil ensanchaba el formulario
   entero por encima del ancho de la pantalla. */
.campo__tel input{flex:1 1 0;min-width:0;width:100%;border:0;padding:.85rem 1rem;font-size:1.1rem;font-weight:700;letter-spacing:.03em;background:none}
.campo__tel input:focus{outline:none}
/* "¿No puedes hablar ahora?" — plegado para no recargar el formulario. */
.form-cita{margin:0 0 .9rem}
.form-cita summary{cursor:pointer;font-size:.86rem;font-weight:600;color:var(--acento-d);
  list-style:none;display:inline-flex;align-items:center;gap:.4rem;padding:.15rem 0}
.form-cita summary::-webkit-details-marker{display:none}
.form-cita summary::before{content:"";width:7px;height:7px;border-right:2px solid currentColor;
  border-bottom:2px solid currentColor;transform:rotate(-45deg);transition:transform .25s var(--ease)}
.form-cita[open] summary::before{transform:rotate(45deg)}
.form-cita summary:hover{color:var(--acento)}
.form-cita__campos{display:grid;grid-template-columns:1fr 1fr;gap:.7rem;margin-top:.7rem}
.form-cita__campos .campo{margin-bottom:0;min-width:0}
.form-cita__campos select{width:100%;min-width:0;border:2px solid var(--linea);border-radius:var(--r-m);
  padding:.7rem .8rem;font:inherit;font-size:.95rem;background:#fff;color:var(--marino)}
.form-cita__campos select:focus{outline:none;border-color:var(--acento)}
@media (max-width:420px){.form-cita__campos{grid-template-columns:1fr}}

.campo-check{display:flex;gap:.6rem;align-items:flex-start;font-size:.85rem;color:var(--tinta-60);margin-bottom:1.1rem;cursor:pointer}
.campo-check input{margin-top:.2rem;width:1.1rem;height:1.1rem;accent-color:var(--acento)}
.campo-check a{color:var(--acento-d);font-weight:600;text-decoration:underline}
.hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.form-llamada__error{background:#fdecec;color:#a3252b;border:1px solid #f3c6c6;border-radius:var(--r-m);
  padding:.6rem .9rem;font-size:.85rem;font-weight:600;margin:0 0 1rem}
.form-llamada__pie{text-align:center;font-size:.86rem;color:var(--tinta-60);margin:.9rem 0 0}
.form-llamada__pie a{color:var(--acento-d);font-weight:700}

/* ============================================================
   Franja de confianza
   ============================================================ */
.confia{background:var(--hueso);border-bottom:1px solid var(--linea)}
.confia__in{display:flex;align-items:center;justify-content:center;gap:clamp(1.5rem,4vw,3.5rem);
  flex-wrap:wrap;padding:1.6rem 0}
.confia__txt{font-weight:600;color:var(--tinta-60);max-width:34ch;font-size:.95rem}
.confia__logos{display:flex;align-items:center;gap:2rem;flex-wrap:wrap}
.confia__logos img{width:auto;height:auto;max-height:56px;max-width:100%}

/* ============================================================
   Proceso (4 pasos)
   ============================================================ */
.proceso__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.2rem;margin-top:2.5rem}
.paso{position:relative;background:#fff;border:1px solid var(--linea);border-radius:var(--r-l);
  padding:1.6rem 1.4rem;transition:transform .4s var(--ease),box-shadow .4s var(--ease),border-color .3s}
.paso:hover{transform:translateY(-6px);box-shadow:var(--sombra-m);border-color:transparent}
.paso__n{font-family:"Fraunces";font-size:2.4rem;font-weight:700;color:var(--acento);line-height:1;opacity:.5}
.paso:hover .paso__n{opacity:1}
.paso__t{font-family:"Manrope";font-weight:800;font-size:1.12rem;color:var(--marino);margin:.7rem 0 .5rem}
.paso__p{color:var(--tinta-60);font-size:.95rem;margin:0}
.paso__link{margin-top:2.5rem;display:inline-flex}

/* ============================================================
   Qué es Recuperatio (dos columnas)
   ============================================================ */
.quees{background:var(--hueso)}
.quees__in{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,4rem);align-items:center}
.quees__media{position:relative}
.quees__card{background:linear-gradient(135deg,var(--marino),#152a63);border-radius:var(--r-xl);
  padding:clamp(1.8rem,3vw,2.6rem);color:#fff;box-shadow:var(--sombra-l);position:relative;overflow:hidden}
.quees__card::after{content:"";position:absolute;width:220px;height:220px;border-radius:50%;
  right:-70px;bottom:-70px;background:radial-gradient(circle at 40% 40%,var(--acento-l),var(--acento) 70%);opacity:.35}
.quees__stat{display:flex;gap:1rem;align-items:center;margin-bottom:1.2rem;position:relative;z-index:1}
.quees__stat b{font-family:"Fraunces";font-size:2.6rem;color:var(--acento-l);font-weight:700;line-height:.9;flex:none}
.quees__stat span{color:#c7d4f5}
.quees__cita{font-family:"Fraunces";font-size:1.3rem;line-height:1.4;position:relative;z-index:1;margin:0}
.ventajas{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-top:1.8rem}
.ventaja{display:flex;gap:.8rem;align-items:flex-start}
.ventaja__ico{display:grid;place-items:center;width:44px;height:44px;border-radius:13px;
  background:var(--nube);color:var(--acento-d);flex:none}
.ventaja h3,.ventaja h4{font-family:"Manrope";font-weight:800;font-size:1rem;color:var(--marino);margin:.15rem 0 .2rem}
.ventaja p{font-size:.9rem;color:var(--tinta-60);margin:0}

/* ============================================================
   Mapa interactivo
   ============================================================ */
.mapa__in{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(2rem,4vw,3.5rem);align-items:center}
.mapa__svg-wrap{position:relative}
.mapa-es{width:100%;height:auto;overflow:visible}
.mapa-es path{fill:#dde8f5;stroke:#fff;stroke-width:1.2;transition:fill .25s,transform .25s var(--ease);
  transform-origin:center;transform-box:fill-box;cursor:pointer}
.mapa-es path:hover{fill:var(--acento)}
.mapa-es path.tiene-pagina{fill:#bcd6f0}
.mapa-es path.tiene-pagina:hover{fill:var(--acento-d)}
.mapa-es path.activa{fill:var(--acento);transform:scale(1.04)}
.mapa-es #canary-islands{fill:#a9c8e8;stroke:#fff;stroke-width:1}
.mapa-es #canary-islands:hover{fill:var(--acento)}
.mapa-inset-bg{pointer-events:none}
.mapa-inset-t{pointer-events:none}
.mapa__tip{position:absolute;pointer-events:none;background:var(--marino);color:#fff;
  padding:.4rem .75rem;border-radius:var(--r-pill);font-weight:700;font-size:.85rem;
  transform:translate(-50%,-140%);opacity:0;transition:opacity .2s;white-space:nowrap;z-index:5}
.mapa__tip.on{opacity:1}
.mapa__aside .lista-prov{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1.2rem}
.chip{display:inline-flex;align-items:center;gap:.35rem;padding:.5rem .9rem;border-radius:var(--r-pill);
  background:#fff;border:1px solid var(--linea);font-weight:700;font-size:.9rem;color:var(--marino);
  transition:transform .25s var(--ease),border-color .25s,background .25s,color .25s}
.chip:hover{transform:translateY(-2px);border-color:var(--acento);color:var(--acento-d);background:var(--nube)}
.chip .ico{color:var(--acento)}

/* ============================================================
   Adicciones (grid de tarjetas)
   ============================================================ */
.adic__grid{display:grid;grid-template-columns:repeat(5,1fr);gap:1rem;margin-top:2.5rem}
.adic-card{position:relative;display:flex;flex-direction:column;gap:.7rem;padding:1.4rem;
  background:#fff;border:1px solid var(--linea);border-radius:var(--r-l);overflow:hidden;
  transition:transform .4s var(--ease),box-shadow .4s var(--ease),border-color .3s}
.adic-card::before{content:"";position:absolute;inset:0;background:linear-gradient(160deg,var(--acento),var(--acento-d));
  opacity:0;transition:opacity .4s;z-index:0}
.adic-card:hover{transform:translateY(-7px);box-shadow:var(--sombra-l);border-color:transparent}
.adic-card:hover::before{opacity:1}
.adic-card>*{position:relative;z-index:1}
.adic-card__ico{display:grid;place-items:center;width:52px;height:52px;border-radius:15px;
  background:var(--nube);color:var(--acento-d);transition:background .35s,color .35s}
.adic-card__ico .ico{width:1.7em;height:1.7em}
.adic-card:hover .adic-card__ico{background:rgba(255,255,255,.25);color:#fff}
.adic-card h2,.adic-card h3{font-family:"Manrope";font-weight:800;font-size:1.1rem;color:var(--marino);transition:color .35s}
.adic-card p{font-size:.86rem;color:var(--tinta-60);margin:0;transition:color .35s}
.adic-card__mas{display:inline-flex;align-items:center;gap:.3rem;font-weight:700;font-size:.86rem;color:var(--acento-d);margin-top:auto;transition:color .35s}
.adic-card:hover h2,.adic-card:hover h3,.adic-card:hover p,.adic-card:hover .adic-card__mas{color:#fff}
.adic-card:hover .adic-card__mas .ico{transform:translateX(3px)}
.adic-card__mas .ico{transition:transform .3s}

/* ============================================================
   Vídeo (fachada)
   ============================================================ */
.video{background:linear-gradient(180deg,var(--hueso),#fff)}
.video__marco{position:relative;max-width:900px;margin:2.2rem auto 0;aspect-ratio:16/9;
  border-radius:var(--r-xl);overflow:hidden;box-shadow:var(--sombra-l);cursor:pointer;background:#0a1048}
.video__marco img{width:100%;height:100%;object-fit:cover;opacity:.8;transition:transform .6s var(--ease),opacity .4s}
.video__marco:hover img{transform:scale(1.05);opacity:.65}
.video__play{position:absolute;inset:0;display:grid;place-items:center}
.video__play span{display:grid;place-items:center;width:84px;height:84px;border-radius:50%;
  background:var(--acento);color:#04283a;box-shadow:0 0 0 0 rgba(18,181,230,.5);animation:glow 2.6s infinite}
.video__play .ico{width:2.4rem;height:2.4rem}
.video iframe{width:100%;height:100%;border:0;display:block}

/* ============================================================
   Testimonios (slider)
   ============================================================ */
.testi{background:var(--marino);color:#eaf1ff;position:relative;overflow:hidden}
.testi .titular,.testi h2{color:#fff}
.testi .titular strong,.testi h2 strong{color:var(--acento-l)}
.testi .eyebrow{color:var(--acento-l)}
.testi__marquee{margin-top:2.5rem;overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);
          mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent)}
.testi__track{display:flex;width:max-content;animation:marquee 55s linear infinite}
.testi__marquee:hover .testi__track{animation-play-state:paused}
@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.testi-card{flex:0 0 380px;margin-right:1.4rem;background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.14);border-radius:var(--r-xl);padding:1.8rem}
.testi-card__q{font-size:2.6rem;font-family:"Fraunces";color:var(--acento-l);line-height:.6}
.testi-card p{font-family:"Fraunces";font-size:1.12rem;line-height:1.5;color:#eef5fb;margin:.6rem 0 1.2rem}
.testi-card__autor{display:flex;align-items:center;gap:.7rem;font-weight:700;color:#cfe0f5;font-size:.95rem}
.testi-card__ava{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;
  background:rgba(127,220,255,.15);color:var(--acento-l);flex:none}
.testi-card__ava .ico{width:1.2rem;height:1.2rem}

/* ============================================================
   FAQ (acordeón)
   ============================================================ */
.faq__in{max-width:820px;margin-inline:auto;margin-top:2.2rem;display:flex;flex-direction:column;gap:.8rem}
.faq-item{background:#fff;border:1px solid var(--linea);border-radius:var(--r-m);overflow:hidden;transition:box-shadow .3s,border-color .3s}
.faq-item[open]{box-shadow:var(--sombra-m);border-color:transparent}
.faq-item summary{list-style:none;display:flex;justify-content:space-between;align-items:center;gap:1rem;
  padding:1.15rem 1.3rem;font-family:"Manrope";font-weight:700;font-size:1.05rem;color:var(--marino);cursor:pointer}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary .ico{flex:none;color:var(--acento-d);transition:transform .3s var(--ease)}
.faq-item[open] summary .ico{transform:rotate(180deg)}
.faq-item__a{padding:0 1.3rem 1.2rem;color:var(--tinta-60)}
.faq-item__a p{margin:0}

/* ============================================================
   CTA final + Pie
   ============================================================ */
.cta-final{background:radial-gradient(120% 140% at 15% 0%,#12336e,var(--marino) 55%,var(--marino-2));
  color:#eaf1ff;padding:clamp(3rem,6vw,5rem) 0;position:relative;overflow:hidden}
.cta-final__bg{position:absolute;inset:0;z-index:0}
/* Velo: oscuro donde va el texto y casi transparente a la derecha, para que la
   foto se vea y se note el cambio de una a otra. */
.cta-final__bg::after{content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(90deg,rgba(8,14,44,.88),rgba(8,14,44,.7) 34%,rgba(8,14,44,.34) 64%,rgba(8,14,44,.18))}
.cta-final__in{position:relative;z-index:2;display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(2rem,4vw,3.5rem);align-items:center}
.cta-final__txt{text-shadow:0 1px 14px rgba(6,10,36,.55)}
.cta-final .eyebrow{color:var(--acento-l)}
.cta-final__t{font-size:clamp(1.9rem,3.5vw,2.8rem);color:#fff;margin-bottom:.8rem}
.cta-final__t strong{color:var(--acento-l)}
.cta-final__p{color:#c7d4f5;font-size:1.1rem;margin-bottom:1.6rem}

.pie{background:var(--marino-2);color:#c4cdec;position:relative;overflow:hidden}
/* El contenido, por encima de los círculos decorativos. */
.pie__in,.pie__base{position:relative;z-index:2}
/* Los círculos del pie solo aparecen cuando sobra margen a la izquierda del
   contenido: si no, quedan por detrás del texto y lo hacen ilegible. El wrap
   mide 1180px, así que el margen real empieza a partir de ~1400px de pantalla. */
.burbujas--pie{display:none}
@media (min-width:1400px){
  .burbujas--pie{display:block;right:auto;width:calc((100vw - 1180px) / 2 - 12px)}
  .burbujas--pie .burbuja{opacity:.4}
  .burbujas--pie .burbuja--b{opacity:.32}
  .burbujas--pie .burbuja--d{opacity:.7}
}
.pie__in{display:grid;grid-template-columns:1.3fr .85fr 1.7fr 1.05fr;gap:2rem;padding:clamp(2.6rem,5vw,4rem) 0 2.5rem}
.pie__marca p{color:#9aa6d4;font-size:.92rem;margin:.9rem 0}
.pie__marca img{filter:brightness(0) invert(1)}
.pie__tel{display:inline-flex;align-items:center;gap:.5rem;font-family:"Fraunces";font-size:1.5rem;color:#fff;font-weight:600}
.pie__tel:hover{color:var(--acento-l)}
.pie__tel .ico{color:var(--acento-l)}
.pie__sello{font-size:.75rem;letter-spacing:.08em;color:var(--acento-l);font-weight:700;margin-top:.6rem}
.pie__col-t{font-family:"Manrope";font-weight:800;font-size:.95rem;letter-spacing:.01em;color:#fff;margin:0 0 .85rem}
.pie__col ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.28rem}
/* Tratamientos acumula el doble de enlaces que el resto: a una sola columna
   estiraba el pie y descolgaba las demás. */
.pie__col--doble ul{display:block;columns:2;column-gap:1.5rem}
.pie__col--doble li{break-inside:avoid;padding-bottom:.28rem}
.pie__col a{display:inline-flex;align-items:center;gap:.55rem;color:#c4cdec;font-size:.9rem}
.pie__col a::before{content:"";flex:0 0 auto;width:6px;height:6px;border-radius:50%;background:var(--acento-l);transition:transform var(--ease),box-shadow var(--ease)}
.pie__col a:hover{color:var(--acento-l)}
.pie__col a:hover::before{transform:scale(1.55);box-shadow:0 0 8px var(--acento-l)}
.pie__cert img{background:#fff;border-radius:12px;padding:.6rem .8rem;margin-bottom:.7rem}
/* Alto máximo en vez de alto fijo: con `height` clavado, el ancho lo marcaban
   el atributo del HTML o el max-width, y el logo salía aplastado.
   El alto incluye el relleno blanco de .pie__cert img (9,6px arriba y abajo),
   así que el máximo es 58 + 19,2 para que el sello se vea a 58px reales. */
.pie__min{width:auto;height:auto;max-height:78px;max-width:100%}
.pie__adec{width:auto;height:auto;max-height:72px;max-width:100%}
.pie__legal-note{font-size:.8rem;color:#8f9bc9;line-height:1.5}
.pie__base{border-top:1px solid rgba(255,255,255,.1)}
.pie__base-in{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1.2rem 0;font-size:.86rem;color:#8f9bc9;flex-wrap:wrap}
.pie__legal{display:flex;gap:1.3rem}
.pie__legal a:hover{color:var(--acento-l)}

/* ============================================================
   Barra de llamada fija + botón arriba
   ============================================================ */
.callbar{display:none;position:fixed;left:0;right:0;bottom:0;z-index:90;
  box-shadow:0 -8px 24px rgba(11,21,96,.2)}
.callbar__btn{flex:1;display:flex;align-items:center;justify-content:center;gap:.55rem;
  padding:.75rem .6rem;font-weight:800;font-size:.92rem;line-height:1.15}
.callbar__btn span{display:flex;flex-direction:column;font-weight:600;font-size:.72rem;opacity:.85}
.callbar__btn span strong{font-size:.98rem;font-weight:800;opacity:1}
.callbar__btn--tel{background:var(--acento);color:#04283a}
.callbar__btn--wa{background:#25d366;color:#053b1b}

/* La banda del carrusel necesita más aire que una sección de texto: pegada a la
   de arriba parecía continuación de ella. Mismo espacio arriba y abajo. */
.seccion--banda{padding-top:clamp(3.6rem,7.5vw,6rem);padding-bottom:clamp(3.6rem,7.5vw,6rem)}

/* ============================================================
   Páginas de guía
   ============================================================ */
.lista-marca{list-style:none;margin:0 0 1.4rem;padding:0;display:grid;gap:.6rem}
.lista-marca li{display:grid;grid-template-columns:auto 1fr;gap:.7rem;align-items:baseline;
  color:var(--tinta-60);line-height:1.65}
.lista-marca li::before{content:"";width:7px;height:7px;border-radius:50%;
  background:var(--acento);align-self:center}
.lista-marca li strong{color:var(--marino)}

.destacado-txt{background:var(--nube);border-left:3px solid var(--acento);
  border-radius:0 var(--r-l) var(--r-l) 0;padding:1.1rem 1.4rem;margin:1.6rem 0}
.destacado-txt p{margin:0;color:var(--marino);font-size:1.02rem}

.rel-guias{margin-top:2.6rem;padding-top:1.7rem;border-top:1px solid var(--linea)}
.rel-guias__t{font-size:1.2rem;margin:0 0 1rem}
.rel-guias__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(215px,1fr));gap:.8rem}
.rel-guia{display:flex;flex-direction:column;gap:.25rem;padding:1rem 1.1rem;
  background:var(--nube);border:1px solid var(--linea);border-radius:var(--r-l);
  transition:border-color var(--ease),transform var(--ease)}
.rel-guia:hover{border-color:var(--acento);transform:translateY(-2px)}
.rel-guia strong{color:var(--marino);font-size:.98rem}
.rel-guia span{color:var(--tinta-60);font-size:.86rem;line-height:1.45}
.nota-datos{font-size:.9rem;color:var(--tinta-60)}

/* ============================================================
   Ficha de centro público
   ============================================================ */
.ficha-datos{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:.9rem;
  margin:0 0 2rem}
.ficha-dato{display:flex;gap:.85rem;align-items:flex-start;background:var(--nube);
  border:1px solid var(--linea);border-radius:var(--r-l);padding:1rem 1.1rem;min-width:0}
.ficha-dato__ico{display:grid;place-items:center;width:40px;height:40px;border-radius:11px;
  background:#fff;color:var(--acento-d);flex:none;box-shadow:var(--sombra-s)}
.ficha-dato small{display:block;font-size:.76rem;color:var(--tinta-60);margin-bottom:.15rem}
.ficha-dato p{margin:0;font-weight:700;color:var(--marino);font-size:1rem;overflow-wrap:anywhere}
.ficha-dato a{color:var(--marino)}
.ficha-dato a:hover{color:var(--acento-d)}

.rel-centros{margin-top:2.4rem;padding-top:1.6rem;border-top:1px solid var(--linea)}
.rel-centros__t{font-size:1.15rem;margin:0 0 .9rem}
.rel-centros__lista{list-style:none;margin:0 0 1rem;padding:0;
  display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:.4rem .9rem}
.rel-centros__lista a{display:inline-flex;gap:.5rem;font-size:.94rem;color:var(--tinta-60)}
.rel-centros__lista a::before{content:"";flex:0 0 auto;width:6px;height:6px;border-radius:50%;
  background:var(--acento);align-self:center}
.rel-centros__lista a:hover{color:var(--acento-d)}
.rel-centros__todos{font-weight:700;color:var(--acento-d)}
.recurso-card__t a{color:inherit}
.recurso-card__t a:hover{color:var(--acento-d)}

/* Botón de contacto flotante: la marca abre las tres vías (llamar, WhatsApp y
   formulario) desde cualquier página. */
.cflot{position:fixed;right:1.2rem;bottom:1.4rem;z-index:95;display:flex;
  flex-direction:column;align-items:flex-end;gap:.7rem}
.cflot__btn{display:inline-flex;align-items:center;gap:.6rem;padding:.6rem 1.1rem .6rem .6rem;
  border-radius:999px;background:var(--marino);color:var(--acento);font-weight:800;font-size:.94rem;
  box-shadow:0 12px 30px rgba(8,16,60,.34);transition:transform .25s var(--ease),box-shadow .25s var(--ease)}
.cflot__btn:hover{transform:translateY(-2px);box-shadow:0 16px 36px rgba(8,16,60,.42)}
.cflot__marca{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;
  background:rgba(255,255,255,.1);flex:none}
.cflot__marca svg{width:26px;height:26px}
.cflot__btn-t{color:#fff;letter-spacing:.01em}
.cflot__cerrar{display:none;color:#fff}
.cflot__cerrar .ico{width:20px;height:20px}
.cflot[data-abierto] .cflot__btn-t,.cflot[data-abierto] .cflot__marca{display:none}
.cflot[data-abierto] .cflot__cerrar{display:grid;place-items:center;width:38px;height:38px}
.cflot[data-abierto] .cflot__btn{padding:.6rem;border-radius:50%}

.cflot__panel{display:flex;flex-direction:column;gap:.5rem;align-items:flex-end}
.cflot__panel[hidden]{display:none}
.cflot__op{display:flex;align-items:center;gap:.7rem;padding:.65rem .95rem;border-radius:var(--r-l);
  background:#fff;border:1px solid var(--linea);box-shadow:0 10px 26px rgba(8,16,60,.16);
  min-width:225px;animation:cflot-entra .28s var(--ease) both}
.cflot__op:nth-child(2){animation-delay:.05s}
.cflot__op:nth-child(3){animation-delay:.1s}
.cflot__op:hover{border-color:var(--acento);transform:translateX(-2px)}
.cflot__ico{display:grid;place-items:center;width:36px;height:36px;border-radius:10px;flex:none;
  background:var(--nube);color:var(--acento-d)}
.cflot__op--wa .cflot__ico{background:#e3f9ec;color:#128c46}
.cflot__txt{display:flex;flex-direction:column;line-height:1.25;min-width:0}
.cflot__txt strong{color:var(--marino);font-size:.95rem}
.cflot__txt small{color:var(--tinta-60);font-size:.8rem}
@keyframes cflot-entra{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* En móvil se coloca sobre la barra de llamada y el botón queda solo redondo. */
@media (max-width:900px){
  .cflot{right:.8rem;bottom:5rem}
  .cflot__btn-t{display:none}
  .cflot__btn{padding:.6rem;border-radius:50%}
  .cflot__op{min-width:210px}
}
@media (prefers-reduced-motion:reduce){.cflot__op{animation:none}}

/* Aviso de cookies. Va por encima de la barra de llamada (z-index 90) y en
   móvil deja hueco para ella. */
.cookies{position:fixed;left:0;right:0;bottom:0;z-index:120;padding:1rem;
  background:#fff;border-top:1px solid var(--linea);box-shadow:0 -10px 34px rgba(11,21,96,.16)}
.cookies[hidden]{display:none}
.cookies__in{max-width:1180px;margin:0 auto;display:flex;align-items:center;gap:1.4rem;flex-wrap:wrap}
.cookies__txt{flex:1 1 420px;min-width:0}
.cookies__t{font-family:"Fraunces",Georgia,serif;font-weight:600;color:var(--marino);
  font-size:1.08rem;margin:0 0 .2rem}
.cookies__txt p{margin:0;font-size:.9rem;color:#4a5578;line-height:1.5}
.cookies__txt a{color:var(--acento-d);text-decoration:underline}
.cookies__btns{display:flex;gap:.7rem;flex:0 0 auto}
.cookies__btns .btn{padding:.7rem 1.5rem;font-size:.92rem}
@media (max-width:720px){
  .cookies{padding:1rem 1rem calc(1rem + 56px)}
  .cookies__btns{width:100%}
  .cookies__btns .btn{flex:1}
}

.arriba{position:fixed;right:1.1rem;bottom:1.4rem;z-index:80;width:48px;height:48px;border-radius:50%;
  background:var(--marino);color:#fff;display:grid;place-items:center;box-shadow:var(--sombra-m);
  opacity:0;visibility:hidden;transform:translateY(12px);transition:all .35s var(--ease)}
.arriba.on{opacity:1;visibility:visible;transform:none}
.arriba .ico{transform:rotate(180deg)}

/* ============================================================
   Slider "aero" (crossfade + ken-burns + cristal esmerilado)
   ============================================================ */
.aero{position:relative;overflow:hidden;border-radius:var(--r-xl);isolation:isolate;background:var(--marino)}
.aero__slides{position:absolute;inset:0;z-index:0}
.aero__slide{position:absolute;inset:0;background-size:cover;background-position:center;
  opacity:0;transition:opacity 1.6s var(--ease);will-change:opacity,transform}
.aero__slide.on{opacity:1;animation:kenburns 9s ease-out both}
@keyframes kenburns{from{transform:scale(1.14)}to{transform:scale(1)}}
.aero::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(160deg,rgba(11,21,96,.25),rgba(10,16,72,.62))}
.aero__inner{position:relative;z-index:2;display:flex;align-items:flex-end;min-height:inherit;padding:clamp(1.4rem,3vw,2.4rem)}
.aero__glass{backdrop-filter:blur(12px) saturate(1.3);-webkit-backdrop-filter:blur(12px) saturate(1.3);
  background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.3);border-radius:var(--r-l);
  padding:clamp(1.1rem,2vw,1.6rem) clamp(1.3rem,2.4vw,1.9rem);color:#fff;box-shadow:var(--sombra-m);max-width:min(100%,560px)}
.aero__glass .eyebrow{color:var(--acento-l)}
.aero__glass h2,.aero__glass h3{color:#fff;margin:.1rem 0 .5rem}
.aero__glass h2 strong,.aero__glass h3 strong{color:var(--acento-l)}
.aero__glass p{color:#eaf1ff;margin:0 0 1rem;font-size:.98rem}
.aero__dots{position:absolute;z-index:3;right:1rem;bottom:1rem;display:flex;gap:.4rem}
.aero__dot{width:9px;height:9px;border-radius:50%;background:rgba(255,255,255,.4);border:0;transition:all .3s}
.aero__dot.on{background:#fff;width:24px;border-radius:5px}
.aero--hero{min-height:clamp(340px,46vw,520px)}
.aero--banda{min-height:clamp(220px,30vw,340px)}
@media (prefers-reduced-motion:reduce){.aero__slide.on{animation:none}}

/* ============================================================
   Páginas interiores
   ============================================================ */
.pageheader{position:relative;overflow:hidden;color:#eaf1ff;
  background:radial-gradient(120% 130% at 85% -20%,#12336e 0%,var(--marino) 48%,var(--marino-2) 100%);
  padding:clamp(1.6rem,4vw,2.6rem) 0 clamp(2.2rem,4vw,3rem)}
.pageheader__in{position:relative;z-index:2;max-width:760px}
.pageheader h1{color:#fff;font-size:clamp(1.9rem,4.2vw,3rem);margin:.5rem 0 .6rem}
.pageheader h1 strong{color:var(--acento-l)}
.pageheader p{color:#c7d4f5;font-size:clamp(1rem,1.4vw,1.15rem);margin:0;max-width:60ch}

.migas{font-size:.86rem;margin-bottom:.2rem}
.migas ol{list-style:none;display:flex;flex-wrap:wrap;gap:.15rem;margin:0;padding:0}
.migas li{display:flex;align-items:center}
.migas li:not(:last-child)::after{content:"/";margin:0 .5rem;color:#7f8ec0}
.migas a{color:#aebbe6}
.migas a:hover{color:var(--acento-l)}
.migas span{color:#eaf1ff;font-weight:600}
.pageheader .migas a{color:#aebbe6}

.interior{display:grid;grid-template-columns:minmax(0,1fr) 322px;gap:clamp(1.8rem,3.5vw,3rem);
  align-items:start;padding:clamp(2.4rem,5vw,4rem) 0}
.interior__main{min-width:0}
.interior__aside{position:sticky;top:96px}
.interior--solo{grid-template-columns:minmax(0,780px);justify-content:center}

/* Contenido de artículo (prosa) */
.prose{color:var(--tinta)}
.prose>*+*{margin-top:1.1rem}
.prose h2{font-size:clamp(1.5rem,2.6vw,2rem);margin-top:2.4rem;color:var(--marino)}
.prose h2 strong{color:var(--marino)}
.prose h3{font-size:1.25rem;margin-top:1.8rem;font-family:"Manrope";font-weight:800;color:var(--marino)}
.prose p{color:var(--tinta-70,#3f4a6b);line-height:1.7}
.prose strong{color:var(--marino);font-weight:700}
.prose a{color:var(--acento-d);font-weight:600;text-decoration:underline;text-underline-offset:2px}
.prose ul{list-style:none;padding:0;display:flex;flex-direction:column;gap:.6rem;margin:1.2rem 0}
.prose ul li{position:relative;padding-left:1.9rem;color:var(--tinta-60)}
.prose ul li::before{content:"";position:absolute;left:0;top:.15rem;width:1.25rem;height:1.25rem;border-radius:50%;
  background:var(--nube) url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230e93bd' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5 9-11'/%3E%3C/svg%3E") center/.8rem no-repeat}
.prose blockquote{border-left:4px solid var(--acento);background:var(--hueso);padding:1.1rem 1.4rem;
  border-radius:0 var(--r-m) var(--r-m) 0;font-family:"Fraunces";font-size:1.2rem;color:var(--marino);margin:1.6rem 0}

/* Bloque destacado dentro del contenido */
.callout{display:flex;gap:1rem;align-items:center;flex-wrap:wrap;justify-content:space-between;
  background:linear-gradient(135deg,var(--marino),#152a63);color:#fff;border-radius:var(--r-xl);
  padding:clamp(1.4rem,2.5vw,2rem);margin:2.2rem 0;box-shadow:var(--sombra-m)}
.callout__t{font-family:"Fraunces";font-size:1.35rem;margin:0 0 .2rem;color:#fff}
.callout__t strong{color:var(--acento-l)}
.callout p{margin:0;color:#c7d4f5;font-size:.95rem}

/* --- Menú lateral (aside) --- */
.lado{display:flex;flex-direction:column;gap:1.1rem}
.lado-tel{background:linear-gradient(150deg,var(--marino),var(--marino-2));color:#fff;
  border-radius:var(--r-l);padding:1.4rem;box-shadow:var(--sombra-m)}
.lado-tel__eyebrow{display:inline-flex;align-items:center;gap:.4rem;font-size:.72rem;font-weight:700;
  color:var(--acento-l);letter-spacing:.02em;margin-bottom:.5rem}
.lado-tel__num{display:block;font-family:"Fraunces";font-size:1.9rem;font-weight:700;color:#fff;margin-bottom:.4rem}
.lado-tel__num:hover{color:var(--acento-l)}
.lado-tel p{font-size:.86rem;color:#c7d4f5;margin:0 0 1rem}

.lado-box{background:#fff;border:1px solid var(--linea);border-radius:var(--r-l);padding:1.2rem 1.3rem}
.lado-box__t{display:flex;align-items:center;gap:.45rem;font-family:"Manrope";font-weight:800;font-size:1rem;
  color:var(--marino);margin:0 0 .9rem}
.lado-box__t .ico{color:var(--acento-d)}
.lado-prov{display:flex;flex-wrap:wrap;gap:.35rem;max-height:240px;overflow:auto;padding-right:.2rem}
.lado-prov a{font-size:.82rem;font-weight:600;color:var(--tinta-60);background:var(--hueso);
  padding:.32rem .6rem;border-radius:var(--r-pill);transition:background .2s,color .2s}
.lado-prov a:hover{background:var(--nube);color:var(--acento-d)}
.lado-prov a.on{background:var(--acento);color:#04283a}
.lado-prov__all{display:inline-block;margin-top:.9rem;font-weight:700;font-size:.85rem;color:var(--acento-d)}
.lado-ventajas{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:.7rem}
.lado-ventajas li{display:flex;gap:.6rem;align-items:center;font-weight:600;font-size:.9rem;color:var(--marino)}
.lado-ventajas .ico{color:var(--acento-d);flex:none}
.lado-links{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:.2rem}
.lado-links a{display:flex;align-items:center;gap:.5rem;padding:.5rem .2rem;font-weight:600;font-size:.92rem;
  color:var(--marino);border-bottom:1px solid var(--linea)}
.lado-links li:last-child a{border-bottom:0}
.lado-links a:hover{color:var(--acento-d)}
.lado-links .ico{color:var(--acento)}

/* Rejilla de tarjetas de adicciones en el índice */
.adic-index{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:1rem}

/* Recursos públicos */
.prov-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:.7rem}
.prov-chip{display:flex;align-items:center;gap:.5rem;padding:.85rem 1.1rem;background:#fff;
  border:1px solid var(--linea);border-radius:var(--r-m);font-weight:700;color:var(--marino);
  transition:transform .25s var(--ease),border-color .25s,box-shadow .25s,color .25s}
.prov-chip:hover{transform:translateY(-3px);border-color:var(--acento);color:var(--acento-d);box-shadow:var(--sombra-m)}
.prov-chip .ico{color:var(--acento)}
.recursos-nota{background:var(--nube);border-radius:var(--r-m);padding:.9rem 1.1rem;font-size:.9rem;color:var(--tinta-60);margin:0 0 1.6rem}
.recursos-nota a{color:var(--acento-d);font-weight:700}
.recursos-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:1rem}
.recurso-card{background:#fff;border:1px solid var(--linea);border-radius:var(--r-l);padding:1.2rem 1.3rem;
  transition:transform .3s var(--ease),box-shadow .3s,border-color .3s}
.recurso-card:hover{transform:translateY(-4px);box-shadow:var(--sombra-m);border-color:transparent}
.recurso-card__t{font-family:"Manrope";font-weight:800;font-size:1rem;color:var(--marino);margin:0 0 .7rem;line-height:1.25}
.recurso-card__datos{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.5rem}
.recurso-card__datos li{display:flex;gap:.55rem;align-items:flex-start;font-size:.88rem;color:var(--tinta-60);line-height:1.4}
.recurso-card__datos .ico{color:var(--acento-d);margin-top:.15rem;flex:none}
.recurso-card__datos a{color:var(--marino);font-weight:600;word-break:break-word}
.recurso-card__datos a:hover{color:var(--acento-d)}

/* Blog / Noticias */
.blog-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1.4rem}
.post-card{background:#fff;border:1px solid var(--linea);border-radius:var(--r-l);overflow:hidden;
  transition:transform .4s var(--ease),box-shadow .4s var(--ease),border-color .3s}
.post-card:hover{transform:translateY(-6px);box-shadow:var(--sombra-l);border-color:transparent}
.post-card__link{display:block;height:100%}
.post-card__img{height:186px;background-size:cover;background-position:center;transition:transform .5s var(--ease)}
.post-card:hover .post-card__img{transform:scale(1.05)}
.post-card__body{padding:1.5rem}
.post-hero{width:100%;aspect-ratio:16/8;background-size:cover;background-position:center;
  border-radius:var(--r-l);margin-bottom:1.6rem;box-shadow:var(--sombra-m)}
.post-card__fecha{display:inline-block;font-size:.76rem;font-weight:700;letter-spacing:.02em;
  color:var(--acento-d);background:var(--nube);padding:.28rem .65rem;border-radius:var(--r-pill);margin-bottom:.8rem}
.post-card__t{font-family:"Fraunces";font-size:1.3rem;line-height:1.2;color:var(--marino);margin:0 0 .6rem}
.post-card:hover .post-card__t{color:var(--acento-d)}
.post-card__ex{font-size:.92rem;color:var(--tinta-60);margin:0 0 1rem;line-height:1.55}
.post-card__mas{display:inline-flex;align-items:center;gap:.35rem;font-weight:700;font-size:.88rem;color:var(--acento-d)}
.post-card:hover .post-card__mas .ico{transform:translateX(3px)}
.post-card__mas .ico{transition:transform .3s}
.post-fecha{display:inline-flex;align-items:center;gap:.4rem;color:#aebbe6;font-size:.9rem;font-weight:600;margin:0 0 .4rem}
.post-fecha .ico{color:var(--acento-l)}
.post-volver{display:inline-flex;align-items:center;gap:.4rem;font-weight:700;color:var(--acento-d);text-decoration:none!important}

/* Tests de adicciones */
.test__prog{position:sticky;top:82px;z-index:20;height:8px;border-radius:99px;background:var(--linea);overflow:hidden;margin-bottom:.5rem}
.test__prog-bar{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--acento),var(--acento-d));transition:width .4s var(--ease)}
.test__count{font-weight:700;font-size:.88rem;color:var(--tinta-60);margin:0 0 1.4rem}
.test__preguntas{list-style:none;counter-reset:q;padding:0;margin:0;display:flex;flex-direction:column;gap:.8rem}
.test__q{counter-increment:q;background:#fff;border:1px solid var(--linea);border-radius:var(--r-l);padding:1.1rem 1.3rem;transition:border-color .25s,box-shadow .25s}
.test__q.done{border-color:var(--acento);box-shadow:var(--sombra-s)}
.test__q-txt{margin:0 0 .8rem;font-weight:600;color:var(--marino);line-height:1.4}
.test__q-txt::before{content:counter(q) ". ";color:var(--acento-d);font-family:"Fraunces",serif;font-weight:700}
.test__opts{display:flex;gap:.7rem}
.test__opt{flex:1;display:flex;align-items:center;justify-content:center;gap:.5rem;padding:.6rem 1rem;
  border:2px solid var(--linea);border-radius:var(--r-pill);font-weight:700;color:var(--tinta-60);cursor:pointer;transition:all .2s}
.test__opt:hover{border-color:var(--acento-l)}
.test__opt input{accent-color:var(--acento);width:1.1rem;height:1.1rem}
.test__opt:has(input:checked){border-color:var(--acento);background:var(--nube);color:var(--acento-d)}
/* Modo wizard (pregunta a pregunta) — activado por JS */
.test.is-wizard .test__q{display:none}
.test.is-wizard .test__q.active{display:block;animation:qin .35s var(--ease)}
.test.is-wizard .test__lead{display:none}
.test.is-wizard .test__lead.active{display:block;animation:qin .35s var(--ease)}
@keyframes qin{from{opacity:0;transform:translateX(18px)}to{opacity:1;transform:none}}
.test.is-wizard .test__q{padding:1.6rem 1.5rem}
.test.is-wizard .test__q-txt{font-size:1.15rem}
.test__back{margin:1rem 0 0;background:none;border:0;color:var(--tinta-60);font-weight:700;cursor:pointer;
  display:inline-flex;align-items:center;gap:.3rem;font-size:.92rem}
.test__back:hover{color:var(--acento-d)}
.test__back[hidden]{display:none}
.test__lead{margin-top:2rem;background:var(--hueso);border:1px solid var(--linea);border-radius:var(--r-xl);padding:clamp(1.4rem,3vw,2rem)}
.test__campos{display:grid;grid-template-columns:1fr 1fr;gap:.9rem;margin-bottom:1rem}
.test__campos .campo:first-child{grid-column:1/-1}
.test__campos input[type=text],.test__campos input[type=email]{width:100%;border:2px solid var(--linea);border-radius:var(--r-m);padding:.8rem 1rem;font:inherit;font-weight:600}
.test__campos input:focus{outline:none;border-color:var(--acento);box-shadow:0 0 0 4px rgba(18,181,230,.15)}
.test__resultado{text-align:center;padding:0 0 1.6rem;margin-bottom:1.6rem;border-bottom:1px solid var(--linea)}
.test__res-badge{display:inline-block;padding:.5rem 1.4rem;border-radius:var(--r-pill);background:var(--marino);
  color:#fff;font-weight:800;font-size:1.25rem;margin-bottom:.8rem}
.test__res-txt{color:var(--tinta-70,#3f4a6b);font-size:1.02rem;line-height:1.6;max-width:56ch;margin:0 auto}
.test__leadform h2{margin-top:0}
.test__nota{text-align:center;font-size:.82rem;color:var(--tinta-60);margin:.9rem 0 0}
@media (max-width:560px){.test__campos{grid-template-columns:1fr}}

/* Página de contacto */
.contacto{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,4vw,3.5rem);align-items:start}
.contacto__dato{display:flex;align-items:center;gap:.9rem;margin-top:1rem;padding:.9rem 1.1rem;
  background:#fff;border:1px solid var(--linea);border-radius:var(--r-l);transition:border-color .25s,transform .25s var(--ease),box-shadow .25s}
.contacto__dato:hover{border-color:var(--acento);transform:translateY(-2px);box-shadow:var(--sombra-m)}
.contacto__ico{display:grid;place-items:center;width:46px;height:46px;border-radius:13px;background:var(--nube);color:var(--acento-d);flex:none}
.contacto__dato span span,.contacto__dato>span{display:flex;flex-direction:column}
.contacto__dato small{font-size:.78rem;color:var(--tinta-60)}
.contacto__dato strong{font-family:"Fraunces";font-size:1.3rem;color:var(--marino)}
@media (max-width:800px){.contacto{grid-template-columns:1fr}.contacto>*{min-width:0}}

/* ============================================================
   Animaciones de aparición
   ============================================================ */
.reveal{opacity:1;transform:none}
html.js .reveal{opacity:0;transform:translateY(26px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
html.js .reveal.is-in{opacity:1;transform:none}
.reveal[data-delay="1"]{transition-delay:.08s}
.reveal[data-delay="2"]{transition-delay:.16s}
.reveal[data-delay="3"]{transition-delay:.24s}
.reveal[data-delay="4"]{transition-delay:.32s}

/* ============================================================
   Responsive
   ============================================================ */
/* Menú: colapsa a hamburguesa cuando no cabe holgado */
@media (max-width:1240px){
  .nav,.cab__cta{display:none}
  .cab__burger{display:grid;place-items:center}
}
@media (max-width:1080px){
  .adic__grid{grid-template-columns:repeat(3,1fr)}
  .proceso__grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:900px){
  .hero__in,.quees__in,.mapa__in,.cta-final__in{grid-template-columns:1fr}
  /* Sin esto, un hijo con contenido ancho (un input, una tabla) estira la
     columna por encima del ancho de la pantalla y el resto se sale. */
  .hero__in>*,.quees__in>*,.mapa__in>*,.cta-final__in>*,.interior>*{min-width:0}
  .interior{grid-template-columns:1fr}
  .interior__aside{position:static;order:2}
  .hero__form{max-width:460px}
  .quees__media{order:-1}
  /* El mapa, centrado y con aire por debajo: pegado al titular se leía como si
     fuese parte del texto. */
  .mapa__svg-wrap{max-width:520px;margin-inline:auto;margin-bottom:1.2rem}
  .mapa__in{gap:clamp(2rem,6vw,3rem)}
  .callbar{display:flex}
  .arriba{bottom:5rem;right:.8rem}
  body{padding-bottom:64px}
  .pie__base{padding-bottom:8px}
}
@media (max-width:700px){
  .topbar__sello{display:none}
  .topbar__in{justify-content:center}
  .adic__grid{grid-template-columns:repeat(2,1fr)}
  .ventajas{grid-template-columns:1fr}
  .pie__in{grid-template-columns:1fr 1fr}
  .pie__marca{grid-column:1/-1}
  .pie__col--doble{grid-column:1/-1}
  /* A dos columnas el sello oficial se quedaba en 177px y apenas se leía. */
  .pie__cert{grid-column:1/-1}
  .confia__in{flex-direction:column;text-align:center}
  /* En una sola columna el velo tiene que ir de arriba abajo: el horizontal
     dejaba el final del texto sobre la parte clara de la foto. */
  .cta-final__bg::after{background:linear-gradient(180deg,rgba(8,14,44,.92),rgba(8,14,44,.86) 55%,rgba(8,14,44,.6))}
  /* El teléfono del botón se partía en dos líneas ("621 32 67 / 05"). */
  .aero__glass .btn{white-space:nowrap;font-size:.92rem;padding-inline:1.1rem}
}
@media (max-width:460px){
  .adic__grid{grid-template-columns:1fr 1fr;gap:.7rem}
  .proceso__grid{grid-template-columns:1fr}
  .pie__in{grid-template-columns:1fr}
}

/* ---------- Movimiento reducido ---------- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;
    transition-duration:.01ms!important;scroll-behavior:auto!important}
  .reveal,html.js .reveal{opacity:1;transform:none}
  .burbuja{animation:none}
  .testi__track{animation:none}
  .testi__marquee{overflow-x:auto}
}

.lista-marca--dos{grid-template-columns:1fr 1fr;column-gap:1.4rem}
.lista-marca__loc{color:var(--tinta-60);font-size:.88em}
@media (max-width:640px){.lista-marca--dos{grid-template-columns:1fr}}

/* ============================================================
   Guía descargable
   ============================================================ */
.guia-descarga{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(1.6rem,4vw,3rem);
  padding:clamp(2rem,5vw,3.4rem) 0 1rem;align-items:start}
.guia-descarga__form{position:sticky;top:96px}
.guia-card{background:#fff;border:1px solid var(--linea);border-radius:var(--r-xl);
  padding:1.2rem;box-shadow:var(--sombra-l)}
.guia-card__portada{display:flex;flex-direction:column;gap:.5rem;padding:1.6rem 1.4rem 1.8rem;
  border-radius:var(--r-l);margin-bottom:1.2rem;
  background:linear-gradient(150deg,var(--marino),#12336e 70%,var(--acento-d));color:#fff}
.guia-card__bolas svg{width:34px;height:34px}
.guia-card__t{font-family:"Fraunces",Georgia,serif;font-size:1.32rem;line-height:1.2;margin-top:.4rem}
.guia-card__t em{color:var(--acento-l);font-style:normal}
.guia-card__pie{font-size:.86rem;color:#c3d3f2}
.guia-card .form-llamada{box-shadow:none;border:0;padding:0;background:none}
.guia-card .campo input[type=email]{width:100%;min-width:0;border:2px solid var(--linea);
  border-radius:var(--r-m);padding:.8rem .95rem;font:inherit;font-size:1rem;background:#fff}
.guia-card .campo input[type=email]:focus{outline:none;border-color:var(--acento)}
@media (max-width:900px){
  .guia-descarga{grid-template-columns:1fr}
  .guia-descarga__form{position:static;order:-1}
}

/* Tabla de precios */
.tabla-envoltura{overflow-x:auto;margin:0 0 1rem}
.tabla-precios{width:100%;border-collapse:collapse;font-size:.94rem;min-width:560px}
.tabla-precios th{text-align:left;padding:.7rem .6rem;font-size:.76rem;letter-spacing:.06em;
  text-transform:uppercase;color:var(--tinta-60);border-bottom:2px solid var(--linea)}
.tabla-precios td{padding:.85rem .6rem;border-bottom:1px solid var(--linea);vertical-align:top;
  color:var(--tinta-60)}
.tabla-precios td.num{white-space:nowrap}
.tabla-precios td.num strong{display:block;color:var(--marino);font-size:1.02rem}
.tabla-precios td.num small{color:var(--tinta-60);font-size:.8rem}
.tabla-precios tr.es-gratis td{background:var(--nube)}
.tabla-precios tr.es-gratis td.num strong{color:var(--acento-d)}
.tabla-precios a{font-weight:600;color:var(--marino)}
.tabla-precios a:hover{color:var(--acento-d)}

/* ============================================================
   Buscador interno
   ============================================================ */
.cab__busca{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;
  color:var(--marino);background:var(--nube);transition:background .2s,color .2s;flex:none}
.cab__busca:hover{background:var(--acento);color:#fff}
.movil__busca{display:flex;align-items:center;gap:.6rem;width:100%;padding:.8rem 0;
  color:var(--marino);font-weight:700;font-size:1.05rem;border-bottom:1px solid var(--linea)}

.busca{position:fixed;inset:0;z-index:200;background:rgba(8,14,44,.55);
  backdrop-filter:blur(3px);padding:clamp(1rem,6vh,5rem) 1rem;overflow-y:auto}
.busca[hidden]{display:none}
.busca__caja{max-width:640px;margin:0 auto;background:#fff;border-radius:var(--r-xl);
  box-shadow:0 30px 80px rgba(8,16,60,.4);overflow:hidden}
.busca__form{display:flex;align-items:center;gap:.7rem;padding:.9rem 1.1rem;
  border-bottom:1px solid var(--linea)}
.busca__lupa{color:var(--tinta-60);flex:none}
.busca__input{flex:1;min-width:0;border:0;font:inherit;font-size:1.05rem;color:var(--marino);
  background:none;padding:.35rem 0}
.busca__input:focus{outline:none}
.busca__input::placeholder{color:var(--tinta-60)}
.busca__cerrar{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;
  color:var(--tinta-60);background:var(--nube);flex:none}
.busca__cerrar:hover{background:var(--linea)}
.busca__res{max-height:min(60vh,520px);overflow-y:auto;padding:.6rem}
.busca__pista{color:var(--tinta-60);font-size:.92rem;padding:1rem;margin:0;line-height:1.55}
.busca__pista a{color:var(--acento-d);font-weight:600}
.busca__cuenta{font-size:.78rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;
  color:var(--tinta-60);padding:.5rem .8rem;margin:0}
.busca__lista{list-style:none;margin:0;padding:0}
.busca__lista a{display:grid;gap:.15rem;padding:.7rem .85rem;border-radius:var(--r-m);
  transition:background .18s}
.busca__lista a:hover{background:var(--nube)}
.busca__tipo{font-size:.68rem;font-weight:800;letter-spacing:.07em;text-transform:uppercase;
  color:var(--acento-d)}
.busca__lista strong{color:var(--marino);font-size:.98rem;line-height:1.3}
.busca__lista span:not(.busca__tipo){color:var(--tinta-60);font-size:.86rem;line-height:1.45}
.busca__mas{padding:.6rem .85rem 1rem;margin:0}
.busca__mas a{color:var(--acento-d);font-weight:700;font-size:.92rem}

.busca-pag__form{display:flex;align-items:center;gap:.6rem;background:#fff;border-radius:999px;
  padding:.4rem .5rem .4rem 1.1rem;margin-top:1.2rem;max-width:600px;box-shadow:var(--sombra-m)}
.busca-pag__form .ico{color:var(--tinta-60);flex:none}
.busca-pag__form input{flex:1;min-width:0;border:0;font:inherit;font-size:1rem;
  color:var(--marino);background:none;padding:.5rem 0}
.busca-pag__form input:focus{outline:none}
.busca__lista--pag{display:grid;gap:.3rem;margin-bottom:1.5rem}
.busca__lista--pag a{border:1px solid var(--linea)}
@media (max-width:900px){.cab__busca{display:none}}

/* Firma del artículo */
.post-firma{display:flex;align-items:center;gap:.9rem;flex-wrap:wrap;
  font-size:.88rem;color:var(--tinta-60);margin:0 0 1.2rem;padding-bottom:.9rem;
  border-bottom:1px solid var(--linea)}
.post-firma span{display:inline-flex;align-items:center;gap:.35rem}
.post-firma__autor{font-weight:700;color:var(--marino)}
.post-firma__quienes{margin-left:auto;color:var(--acento-d);font-weight:600}
.post-firma__quienes:hover{text-decoration:underline}
@media (max-width:520px){.post-firma__quienes{margin-left:0}}

/* Aviso de que el contenido no sustituye a un profesional sanitario */
.aviso-medico{margin-top:2rem;padding-top:1rem;border-top:1px solid var(--linea,#e3e8ef);font-size:.85rem;color:var(--tinta);opacity:.7;font-style:italic}

/* Bloque de descarga de la guía para familias dentro de los artículos.
   Va en claro para no competir con el callout del teléfono, que es oscuro. */
.post-guia{display:flex;gap:1rem;align-items:center;flex-wrap:wrap;justify-content:space-between;
  background:var(--nube);border:1px solid var(--linea);border-radius:var(--r-s);
  padding:1.3rem 1.5rem;margin:2rem 0}
.post-guia__t{font-family:"Fraunces",Georgia,serif;font-size:1.2rem;margin:0 0 .25rem;color:var(--marino)}
.post-guia p{margin:0;font-size:.95rem}
.post-guia>div{flex:1 1 18rem;min-width:0}
/* .prose subraya todos sus enlaces; el boton no debe llevarlo. */
.post-guia .btn{text-decoration:none}
.post-guia .btn:hover{text-decoration:none}
@media (max-width:560px){.post-guia .btn{width:100%;justify-content:center}}
