/* =========================================================
   Neurohealth — hoja de estilos única
   ---------------------------------------------------------
   PALETA OFICIAL (tomada del isotipo). Usar SIEMPRE por nombre, nunca el hex suelto:
     --verde        #1a9d86  "azul verdoso" de la marca: botones principales, etiquetas, acentos
     --verde-oscuro #157c6a  el mismo verde, más oscuro: enlaces y texto pequeño sobre blanco (contraste AA)
     --aqua         #4cc1af  aqua claro del isotipo: bordes y detalles suaves
     --azul         #19a1c3  azul del isotipo: foco de teclado, detalles
     --navy         #1e6788  azul marino del isotipo: TÍTULOS, botones secundarios, fondo de la sección de autoevaluaciones
     --navy-oscuro  #17506a  navy más oscuro: pie de página, caja "Solicita tu cita"
     --ocre         #fdcc8d  ocre del centro del isotipo: solo acentos pequeños (flechas, botón "ver todos", eyebrow sobre navy)
     --ocre-suave   #fff3e0  ocre muy claro: avisos
     --crema        #fbf8f2  fondo de sección (equipo)
     --menta        #e7f3ef  fondo claro verde (etiqueta activa del menú)
     --menta-suave  #f3f8f6  fondo de sección (quiénes somos)
     --tinta        #32323c  texto principal
     --gris         #5e5e66  texto secundario
     --gris-claro   #d8dde0  bordes de formularios
   Fondos de sección en el inicio: banners (foto + degradado navy→verde) · blanco (servicios) ·
   menta-suave (quiénes somos) · navy (equipo) · verde (autoevaluaciones) · blanco (cita).
   Tipografía: Univia Pro (títulos) + Nunito (texto). Si Univia Pro no está, cae a Nunito.
   ========================================================= */

/* Nunito (texto) alojada en el propio sitio: sin llamadas a Google Fonts (más rápido y sin terceros). Fuente variable, subconjunto latín. */
@font-face { font-family: "Nunito"; src: url("/assets/fonts/Nunito-latin.woff2") format("woff2-variations"); font-weight: 200 1000; font-style: normal; font-display: swap; unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: "Nunito"; src: url("/assets/fonts/Nunito-latin-italic.woff2") format("woff2-variations"); font-weight: 200 1000; font-style: italic; font-display: swap; unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
/* Univia Pro (títulos): archivos en /assets/fonts/ (woff2). */
/* Pendiente: archivo UniviaPro-Bold. @font-face { font-family: "Univia Pro"; src: url("/assets/fonts/UniviaPro-Bold.woff2") format("woff2"); font-weight: 700; font-style: normal; font-display: swap; } */
@font-face { font-family: "Univia Pro"; src: url("/assets/fonts/UniviaPro-Medium.woff2") format("woff2"); font-weight: 500 700; /* hasta recibir la Bold, la Medium cubre también los títulos */ font-style: normal; font-display: swap; }

:root {
  --aqua: #4cc1af;
  --verde: #1a9d86;
  --verde-oscuro: #12735f;   /* verde con contraste AA sobre blanco (5.8:1) y sobre menta (5.1:1) para texto y enlaces */
  --verde-fondo: #14836c;    /* verde para fondos con texto blanco (4.6:1, AA) */
  --azul: #19a1c3;
  --navy: #1e6788;
  --navy-oscuro: #17506a;
  --ocre: #fdcc8d;
  --ocre-suave: #fff3e0;
  --crema: #fbf8f2;
  --menta: #e7f3ef;
  --menta-suave: #f3f8f6;
  --tinta: #32323c;
  --gris: #5e5e66;
  --gris-claro: #d8dde0;
  --blanco: #ffffff;

  --fuente-titulos: "Univia Pro", "Nunito", system-ui, sans-serif;
  --fuente-texto: "Nunito", system-ui, -apple-system, "Segoe UI", sans-serif;

  --radio: 18px;
  --radio-sm: 10px;
  --linea: #e6ecee;
  --sombra: 0 6px 24px rgba(30, 103, 136, .10);
  --ancho: 1120px;
  --ancho-texto: 68ch;
  --transicion: .18s ease;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { transition: none !important; animation: none !important; } }

body {
  margin: 0;
  font-family: var(--fuente-texto);
  font-size: 1.0625rem;      /* 17px: cómodo de leer */
  line-height: 1.6;
  color: var(--tinta);
  background: var(--blanco);
}

h1, h2, h3, h4 { font-family: var(--fuente-titulos); font-weight: 700; line-height: 1.2; color: var(--navy); margin: 0 0 .5em; letter-spacing: -.01em; }
h1 { font-size: clamp(2rem, 4.5vw, 3rem); }
h2 { font-size: clamp(1.6rem, 3vw, 2.15rem); }
h3 { font-size: clamp(1.2rem, 2vw, 1.4rem); }
p { margin: 0 0 1em; }
p:last-child { margin-bottom: 0; }
a { color: var(--verde-oscuro); text-decoration-thickness: .08em; text-underline-offset: .15em; }
a:hover { color: var(--navy); }
img { max-width: 100%; height: auto; display: block; }
ul, ol { padding-left: 1.25em; }
address { font-style: normal; }
strong { font-weight: 700; }

:focus-visible { outline: 3px solid var(--azul); outline-offset: 3px; border-radius: 4px; }

.wrap { width: min(100% - 2.5rem, var(--ancho)); margin-inline: auto; }
.wrap--texto { max-width: var(--ancho-texto); }
.visually-hidden { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.skip-link { position: absolute; left: 1rem; top: -4rem; background: var(--navy); color: #fff; padding: .6rem 1rem; border-radius: var(--radio-sm); z-index: 100; }
.skip-link:focus { top: 1rem; }

/* ---------- Botones ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
  padding: .8rem 1.4rem; border-radius: 999px; border: 2px solid transparent;
  font-family: var(--fuente-texto); font-weight: 700; font-size: 1rem; line-height: 1.2;
  text-decoration: none; cursor: pointer; transition: background var(--transicion), color var(--transicion), transform var(--transicion);
  min-height: 48px;
}
.btn:hover { transform: translateY(-1px); }
.btn--primary { background: var(--verde-fondo); color: #fff; }
.btn--primary:hover { background: var(--verde-oscuro); color: #fff; }
.btn--navy { background: var(--navy); color: #fff; }
.btn--navy:hover { background: var(--navy-oscuro); color: #fff; }
.btn--outline { background: transparent; color: var(--navy); border-color: var(--navy); }
.btn--outline:hover { background: var(--navy); color: #fff; }
.btn--ghost { background: var(--menta); color: var(--verde-oscuro); }
.btn--ghost:hover { background: #d7ebe4; color: var(--verde-oscuro); }
.btn-row { display: flex; flex-wrap: wrap; gap: .75rem; }

/* ---------- Header ---------- */
.site-header { position: sticky; top: 0; z-index: 50; background: rgba(255,255,255,.92); backdrop-filter: blur(10px); border-bottom: 1px solid var(--linea); }
.site-header .wrap { width: min(100% - 2.5rem, 1480px); }
.site-header__inner { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 72px; }
.brand { flex: 0 0 auto; }
.brand img { width: 200px; height: auto; }
.site-nav ul { list-style: none; margin: 0; padding: 0; display: flex; align-items: center; gap: .25rem; }
.site-nav a:not(.btn) { display: block; padding: .6rem .5rem; border-radius: var(--radio-sm); color: var(--tinta); font-weight: 600; text-decoration: none; white-space: nowrap; }
.site-nav a:not(.btn):hover { background: var(--menta-suave); color: var(--navy); }
.site-nav a[aria-current="page"] { color: var(--verde-oscuro); background: var(--menta); }
.site-nav__cta { margin-left: .5rem; }
.site-nav__cta .btn { padding: .6rem 1.1rem; min-height: 42px; white-space: nowrap; }

.nav-toggle { display: none; align-items: center; gap: .5rem; background: none; border: 1.5px solid var(--gris-claro); border-radius: 999px; padding: .5rem .9rem; font: inherit; font-weight: 700; color: var(--navy); cursor: pointer; min-height: 44px; }
.nav-toggle__bar { position: relative; width: 20px; height: 2px; background: currentColor; border-radius: 2px; }
.nav-toggle__bar::before, .nav-toggle__bar::after { content: ""; position: absolute; left: 0; width: 20px; height: 2px; background: currentColor; border-radius: 2px; }
.nav-toggle__bar::before { top: -6px; } .nav-toggle__bar::after { top: 6px; }

@media (max-width: 1800px) and (min-width: 1481px) {
  .site-nav a:not(.btn) { font-size: .9rem; padding: .55rem .34rem; }
  .site-nav ul { gap: .1rem; }
  .site-nav__cta .btn { padding: .55rem .9rem; font-size: .95rem; }
  .brand img { width: 170px; }
}
@media (max-width: 1480px) {
  .nav-toggle { display: inline-flex; }
  .site-nav { display: none; position: absolute; left: 0; right: 0; top: 100%; background: #fff; border-bottom: 1px solid #eef1f2; box-shadow: var(--sombra); }
  .site-nav.is-open { display: block; }
  .site-nav ul { flex-direction: column; align-items: stretch; padding: .75rem 1.25rem 1.25rem; gap: .15rem; }
  .site-nav a:not(.btn) { padding: .85rem 1rem; font-size: 1.05rem; }
  .site-nav__cta { margin: .5rem 0 0; }
  .site-nav__cta .btn { width: 100%; }
  .brand img { width: 160px; }
}

/* ---------- Submenús desplegables ---------- */
.site-nav .has-sub { position: relative; display: flex; align-items: center; }
.site-nav > ul { position: relative; }
@media (min-width: 1161px) { .site-nav .has-sub:has(> .sub--ancho) { position: static; } .site-nav ul.sub--ancho { left: 0; right: 0; min-width: 0; } }
.sub-toggle { display: inline-grid; place-items: center; width: 26px; height: 26px; margin-left: -.35rem; padding: 0; border: 0; background: none; color: var(--gris); cursor: pointer; border-radius: 6px; }
.sub-toggle svg { width: 16px; height: 16px; transition: transform var(--transicion); }
.sub-toggle[aria-expanded="true"] svg { transform: rotate(180deg); }
.site-nav ul.sub { list-style: none; margin: 0; padding: .5rem; position: absolute; top: calc(100% + 6px); left: 0; min-width: 260px; background: #fff; border: 1px solid var(--linea); border-radius: var(--radio-sm); box-shadow: var(--sombra); display: none; z-index: 60; }
.sub li { margin: 0; }
.sub a { display: block; padding: .5rem .75rem; border-radius: 6px; color: var(--tinta); font-weight: 500; font-size: .95rem; text-decoration: none; white-space: nowrap; }
.sub a:hover { background: var(--menta-suave); color: var(--navy); }
.sub__todos a { color: var(--verde-oscuro); font-weight: 700; border-top: 1px solid var(--linea); border-radius: 0; margin-top: .25rem; padding-top: .7rem; }
.site-nav ul.sub--ancho { min-width: 0; display: none; column-count: 3; column-gap: 1.5rem; padding: 1rem 1.5rem 1.25rem; box-sizing: border-box; }
.sub--ancho .sub__grupo { break-inside: avoid; margin-bottom: .75rem; }
.site-nav .sub__grupo ul { display: block; }
.sub--ancho .sub__grupo > a { font-family: var(--fuente-titulos); font-weight: 700; color: var(--navy); font-size: .8rem; letter-spacing: .04em; text-transform: uppercase; white-space: normal; }
.sub--ancho .sub__grupo ul { list-style: none; margin: 0 0 .5rem; padding: 0; }
.sub--ancho .sub__grupo ul a { font-size: .9rem; padding: .35rem .75rem; white-space: normal; }
@media (min-width: 1161px) {
  .site-nav .has-sub:hover > ul.sub, .site-nav .has-sub.is-hover > ul.sub, .site-nav .has-sub:focus-within > ul.sub, .site-nav .has-sub.is-open > ul.sub { display: block; }
  .site-nav .has-sub:hover > ul.sub--ancho, .site-nav .has-sub.is-hover > ul.sub--ancho, .site-nav .has-sub:focus-within > ul.sub--ancho, .site-nav .has-sub.is-open > ul.sub--ancho { display: block; }
  .site-nav ul.sub::before { content: ""; position: absolute; left: 0; right: 0; top: -12px; height: 12px; } /* puente invisible entre el enlace y el submenú */
}
@media (max-width: 1480px) {
  .site-nav .has-sub { flex-wrap: wrap; }
  .site-nav .has-sub > a { flex: 1; }
  .sub-toggle { width: 44px; height: 44px; margin: 0; color: var(--navy); }
  .site-nav ul.sub { position: static; display: none; width: 100%; box-shadow: none; border: 0; border-left: 2px solid var(--menta); border-radius: 0; margin: 0 0 .5rem .75rem; padding: 0 0 0 .5rem; min-width: 0; }
  .site-nav .has-sub.is-open > ul.sub { display: block; }
  .site-nav ul.sub--ancho { column-count: 1; min-width: 0; }
  .site-nav .has-sub.is-open > ul.sub--ancho { display: block; }
  .sub a { white-space: normal; }
}

/* ---------- Secciones ---------- */
.section { padding-block: clamp(3.25rem, 7vw, 6rem); }
.section--menta { background: var(--menta-suave); }
.section--crema { background: var(--crema); }
.section--navy { background: var(--navy); color: #fff; }
.section--navy h1, .section--navy h2, .section--navy h3 { color: #fff; }
.section--navy a, .cta a:not(.btn), .section--verde a:not(.btn):not(.tile) { color: #fff; }
.section__head { max-width: var(--ancho-texto); margin-bottom: 2rem; }
.section__head--center { margin-inline: auto; text-align: center; }
.eyebrow { display: inline-block; font-family: var(--fuente-titulos); font-weight: 500; letter-spacing: .12em; text-transform: uppercase; font-size: .8rem; color: var(--verde-oscuro); margin-bottom: .6rem; }
.section--navy .eyebrow { color: var(--ocre); }
.lead { font-size: 1.15rem; color: var(--gris); line-height: 1.6; }
.section--navy .lead { color: rgba(255,255,255,.85); }

/* ---------- Banners (carrusel con foto + degradado) ---------- */
.banners { position: relative; overflow: hidden; background: var(--navy); }
.banners__track { display: flex; transition: transform .7s cubic-bezier(.22,.61,.36,1); }
.banner { position: relative; flex: 0 0 100%; min-height: clamp(440px, 46vw, 620px); display: grid; align-items: center; color: #fff; isolation: isolate; }
.banner__bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 70% center; z-index: -2; }
/* Degradado de marca: opaco a la izquierda (donde va el texto), transparente a la derecha (donde está la persona) */
.banner::before { content: ""; position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(90deg, rgba(23,80,106,.92) 0%, rgba(26,157,134,.72) 38%, rgba(26,157,134,.28) 62%, rgba(26,157,134,0) 85%); }
.banner--sinfoto { background: linear-gradient(135deg, var(--navy-oscuro), var(--verde)); }
.banner .eyebrow { color: var(--ocre); }
.banner h1, .banner h2 { color: #fff; font-size: clamp(1.9rem, 3.8vw, 2.9rem); text-shadow: 0 1px 2px rgba(0,0,0,.15); }
.banner .lead { color: rgba(255,255,255,.92); max-width: 46ch; margin-bottom: 1.6rem; }
.banner--marca h1 { font-size: clamp(2.6rem, 6vw, 4.6rem); letter-spacing: .02em; margin-bottom: .2rem; }
.banner__tagline { font-size: clamp(1.25rem, 2.2vw, 1.7rem); font-weight: 400; margin-bottom: .6rem !important; }
.banner__sub { color: rgba(255,255,255,.88); max-width: 46ch; margin-bottom: 1.6rem; }
.banner__text { max-width: 620px; padding-block: 3.5rem 4.5rem; }
.banner .btn--primary { background: #fff; color: var(--navy); }
.banner .btn--primary:hover { background: var(--ocre); color: var(--navy-oscuro); }
.banners__controls { position: absolute; left: 0; right: 0; bottom: 1.25rem; display: flex; justify-content: center; align-items: center; gap: .6rem; pointer-events: none; }
.banners__controls > * { pointer-events: auto; }
.banners__dot { position: relative; width: 24px; height: 24px; border-radius: 50%; border: 0; padding: 0; background: transparent; cursor: pointer; }
.banners__dot::before { content: ""; position: absolute; inset: 6px; border-radius: 50%; border: 1.5px solid rgba(255,255,255,.9); background: rgba(255,255,255,.25); transition: background var(--transicion), transform var(--transicion); }
.banners__dot[aria-current="true"]::before { background: #fff; transform: scale(1.2); }
.banners__btn { width: 40px; height: 40px; border-radius: 50%; border: 1.5px solid rgba(255,255,255,.7); background: rgba(23,80,106,.35); color: #fff; display: grid; place-items: center; cursor: pointer; backdrop-filter: blur(4px); }
.banners__btn:hover { background: rgba(255,255,255,.9); color: var(--navy); }
.banners__btn svg { width: 18px; height: 18px; }
.banners__pause { font: inherit; font-size: .8rem; font-weight: 700; color: #fff; background: rgba(23,80,106,.35); border: 1.5px solid rgba(255,255,255,.7); border-radius: 999px; padding: .35rem .75rem; cursor: pointer; backdrop-filter: blur(4px); }
.banners__pause:hover { background: rgba(255,255,255,.9); color: var(--navy); }
@media (max-width: 800px) {
  .banner { min-height: 0; }
  .banner__bg { object-position: 75% center; }
  .banner::before { background: linear-gradient(180deg, rgba(23,80,106,.30) 0%, rgba(23,80,106,.78) 45%, rgba(26,157,134,.92) 100%); }
  .banner__text { padding-block: 11rem 4.5rem; }
  .banners__btn { display: none; }
}
@media (prefers-reduced-motion: reduce) { .banners__track { transition: none; } }

/* ---------- Franja de confianza ---------- */
.strip { border-block: 1px solid var(--linea); padding-block: 1.1rem; }
.strip ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: .6rem 2.5rem; color: var(--gris); font-size: .95rem; }
.strip li::before { content: ""; display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: var(--verde); margin-right: .6rem; vertical-align: middle; }

/* ---------- Lista de servicios (inicio) ---------- */
.svc { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2.5rem 3rem; }
@media (max-width: 900px) { .svc { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .svc { grid-template-columns: 1fr; gap: 2rem; } }
.svc__group { border-top: 2px solid var(--verde); padding-top: 1rem; }
.svc__group h3 { margin-bottom: .6rem; }
.svc__group ul { list-style: none; margin: 0; padding: 0; }
.svc__group li { padding: .42rem 0; border-bottom: 1px solid #eef2f4; color: var(--tinta); display: flex; justify-content: space-between; gap: 1rem; }
.svc__group li:last-child { border-bottom: 0; }
.svc__group li .price { font-size: .95rem; color: var(--gris); font-weight: 500; }
.svc__group a.more { display: inline-block; margin-top: .8rem; font-weight: 700; text-decoration: none; }
.svc__group a.more:hover { text-decoration: underline; }

/* ---------- Chips (autoevaluaciones) ---------- */
.chips { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .6rem; }
.chips a { display: inline-block; padding: .55rem 1rem; border-radius: 999px; border: 1px solid #cfe0e6; background: #fff; color: var(--navy); font-weight: 600; font-size: .95rem; text-decoration: none; transition: border-color var(--transicion), background var(--transicion); }
.chips a:hover { border-color: var(--verde); background: var(--menta-suave); color: var(--verde-oscuro); }

/* ---------- Mosaico de autoevaluaciones ---------- */
.tiles { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; }
@media (max-width: 900px) { .tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 600px) { .tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .7rem; } }
.tile { display: flex; align-items: center; justify-content: space-between; gap: .5rem; min-height: 72px; padding: 1rem 1.2rem; border-radius: var(--radio-sm); background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.22); color: #fff; font-weight: 700; text-decoration: none; transition: background var(--transicion), border-color var(--transicion), transform var(--transicion); }
.tile::after { content: "→"; color: var(--ocre); font-weight: 800; }
.tile:hover { background: rgba(255,255,255,.16); border-color: var(--aqua); color: #fff; transform: translateY(-2px); }
.tile--todos { background: var(--ocre); color: var(--navy-oscuro); border-color: var(--ocre); }
.tile--todos::after { content: none; }
.tile--todos:hover { background: #ffd9a3; color: var(--navy-oscuro); }
.section--navy { background: linear-gradient(160deg, var(--navy-oscuro) 0%, var(--navy) 70%, #226f8f 100%); }
.section--verde { background: linear-gradient(160deg, #126b58 0%, #14836c 100%); color: #fff; }
.section--verde h1, .section--verde h2, .section--verde h3 { color: #fff; }
.section--verde .eyebrow { color: var(--ocre); }
.section--verde .lead { color: rgba(255,255,255,.9); }
.section--verde .tile--todos { color: var(--navy-oscuro); }
/* tarjetas del equipo sobre fondo navy */
.section--navy .card { border-color: transparent; box-shadow: 0 6px 20px rgba(0,0,0,.18); }
.section--navy .card h2, .section--navy .card h3 { color: var(--navy); }
.section--navy .pro-card--dir, .section--navy a.pro-card--dir { border: 2px solid var(--aqua); }

/* ---------- Círculos (quiénes somos) ---------- */
.grid--quienes { align-items: center; gap: 4rem; }
@media (max-width: 900px) { .grid.grid--quienes { grid-template-columns: minmax(0, 1fr); gap: 2.5rem; } }
.circles { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.5rem; text-align: center; }
@media (max-width: 640px) { .circles { grid-template-columns: minmax(0, 1fr); } }
.circle__disc { width: 150px; height: 150px; margin: 0 auto 1rem; border-radius: 50%; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 1rem; background: linear-gradient(145deg, var(--verde) 0%, var(--aqua) 100%); color: #fff; font-family: var(--fuente-titulos); font-weight: 700; font-size: 1.05rem; line-height: 1.2; box-shadow: 0 10px 24px rgba(26,157,134,.28); }
.circle__disc span { font-size: 2.6rem; line-height: 1; margin-bottom: .1rem; }
.circle p { color: var(--gris); font-size: .97rem; max-width: 26ch; margin-inline: auto; }

/* ---------- Datos (quiénes somos) ---------- */
.facts { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.5rem 2rem; }
.facts div { border-left: 2px solid var(--aqua); padding-left: 1rem; }
.facts strong { display: block; font-family: var(--fuente-titulos); color: var(--navy); font-size: 1.1rem; margin-bottom: .2rem; }
.facts p { color: var(--gris); font-size: .97rem; }

/* ---------- Tarjetas ---------- */
.grid { display: grid; gap: 1.25rem; }
.grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.grid--3-2 { grid-template-columns: repeat(6, 1fr); }
.grid--3-2 > * { grid-column: span 2; }
.grid--3-2 > :nth-child(4) { grid-column: 2 / span 2; }
.grid--3-2 > :nth-child(5) { grid-column: 4 / span 2; }
@media (max-width: 760px) { .grid--3-2 { grid-template-columns: 1fr 1fr; } .grid--3-2 > *, .grid--3-2 > :nth-child(4), .grid--3-2 > :nth-child(5) { grid-column: span 1; } }
@media (max-width: 480px) { .grid--3-2 { grid-template-columns: 1fr; } }
.grid--direccion { margin-bottom: 1.25rem; }
.pro-card__cargo { display: inline-block; white-space: nowrap; font-size: .7rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #fff; background: var(--verde-fondo); border: 1px solid var(--verde-fondo); border-radius: 999px; padding: .15rem .6rem; margin-bottom: .45rem; }
.grid--parejo { grid-auto-rows: auto; }
.grid--auto { grid-template-columns: repeat(5, 1fr); }
@media (max-width: 1100px) { .grid--auto { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 760px) { .grid--auto { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px) { .grid--auto { grid-template-columns: 1fr; } }
@media (max-width: 900px) { .grid--3, .grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .grid--2, .grid--3, .grid--4 { grid-template-columns: minmax(0, 1fr); } }

.card { background: #fff; border: 1px solid var(--linea); border-radius: var(--radio); padding: 1.5rem; box-shadow: 0 2px 10px rgba(30,103,136,.05); transition: box-shadow var(--transicion), transform var(--transicion); }
.card:hover { box-shadow: var(--sombra); }
a.card, .card--link { text-decoration: none; color: inherit; display: block; }
a.card:hover, .card--link:hover { transform: translateY(-2px); color: inherit; }
.card h3 { margin-bottom: .4rem; }
.card p { color: var(--gris); }
.card__icon { width: 52px; height: 52px; border-radius: 14px; display: grid; place-items: center; margin-bottom: 1rem; background: var(--menta); color: var(--verde-oscuro); }
.card__icon--azul { background: #e3f4f9; color: var(--navy); }
.card__icon--ocre { background: var(--ocre-suave); color: #9a6a1e; }
.card__icon svg { width: 28px; height: 28px; }
.grid--3-2 > .card { display: flex; flex-direction: column; }
.grid--3-2 > .card .card__more { margin-top: auto; padding-top: .75rem; }
.card__more { display: inline-block; margin-top: .75rem; font-weight: 700; color: var(--verde-oscuro); }
.card__list { list-style: none; padding: 0; margin: .6rem 0 0; }
.card__list li { position: relative; padding: .3rem 0 .3rem 1.1rem; color: var(--tinta); }
.card__list li::before { content: ""; position: absolute; left: 0; top: .78rem; width: 7px; height: 7px; border-radius: 50%; background: var(--aqua); }
.card--servicios { display: flex; flex-direction: column; background: #fff; }
.card--servicios .card__list { flex: 1; }
.card--servicios .card__more { margin-top: auto; padding-top: .9rem; }
.card--servicios h3 a { color: inherit; text-decoration: none; }
.card--servicios .card__list a { color: var(--tinta); text-decoration: none; display: block; }
.card--servicios .card__list a:hover { color: var(--verde-oscuro); text-decoration: underline; }
.card__more:hover { text-decoration: underline; }

/* ---------- Equipo (tarjetas) ---------- */
.pro-card, a.pro-card { display: grid; grid-template-columns: 72px 1fr; gap: .9rem; align-items: start; padding: 1.25rem; }
.pro-card--sinfoto, a.pro-card--sinfoto { grid-template-columns: 1fr; border-top: 2px solid var(--aqua); border-radius: 0 0 var(--radio) var(--radio); }
.pro-card__foto { width: 72px; height: 72px; aspect-ratio: 1 / 1; flex: 0 0 auto; border-radius: 50%; object-fit: cover; background: var(--menta); box-shadow: 0 0 0 3px #fff, 0 0 0 4px var(--aqua); }
.pro-card h3, .pro-card h2 { font-size: 1.15rem; margin-bottom: .5em; }
@media (min-width: 900px) { .pro-card h3, .pro-card h2 { white-space: nowrap; } }
.pro-card__dia { display: block; }
@media (min-width: 900px) { .pro-card__dia { white-space: nowrap; } .pro-card__horario { font-size: .88rem; } }
.pro-card__rol { color: var(--verde-oscuro); font-weight: 700; margin-bottom: .3rem; }
.pro-card__horario { font-size: .95rem; color: var(--gris); }
@media (max-width: 480px) { .pro-card { grid-template-columns: 1fr; } }
/* Dirección: foto más grande (después de las reglas base para ganar en cascada) */
.pro-card--dir, a.pro-card--dir { grid-template-columns: 110px minmax(0, 1fr); min-width: 0; border-color: var(--aqua); background: #fff; }
.pro-card--dir .pro-card__foto { width: 110px; height: 110px; }
@media (max-width: 480px) { .pro-card--dir, a.pro-card--dir { grid-template-columns: 1fr; } }

/* ---------- Precios ---------- */
.price { font-family: var(--fuente-titulos); font-weight: 700; color: var(--navy); white-space: nowrap; }
.table-wrap { overflow-x: auto; border-radius: var(--radio); border: 1px solid #e6ecee; background: #fff; }
table.precios { width: 100%; border-collapse: collapse; font-size: 1rem; table-layout: fixed; }
table.precios td.price { white-space: normal; overflow-wrap: anywhere; }
table.precios th, table.precios td { padding: .85rem 1rem; text-align: left; border-bottom: 1px solid #edf1f3; vertical-align: top; }
table.precios th { background: var(--menta-suave); font-family: var(--fuente-titulos); font-weight: 500; color: var(--navy); font-size: .9rem; letter-spacing: .04em; text-transform: uppercase; }
table.precios tr:last-child td { border-bottom: 0; }
table.precios td.price { text-align: right; width: 38%; }

/* ---------- Contacto ---------- */
.contact-grid { display: grid; grid-template-columns: 1.1fr .9fr; gap: 2.5rem; align-items: start; }
@media (max-width: 860px) { .contact-grid { grid-template-columns: 1fr; } }
.contact-list { list-style: none; padding: 0; margin: 0; display: grid; gap: .75rem; }
.contact-list li { display: grid; grid-template-columns: 44px 1fr; gap: .9rem; align-items: start; }
.contact-list__icon { width: 44px; height: 44px; border-radius: 12px; background: var(--menta); color: var(--verde-oscuro); display: grid; place-items: center; }
.contact-list__icon svg { width: 22px; height: 22px; }
.contact-list strong { display: block; color: var(--navy); }
.map { border: 0; width: 100%; height: 320px; border-radius: var(--radio); background: var(--menta-suave); }

form.form { display: grid; gap: 1rem; }
.form__row { display: grid; gap: .35rem; }
.form label { font-weight: 700; color: var(--navy); }
.form input, .form select, .form textarea {
  font: inherit; padding: .75rem .9rem; border: 2px solid var(--gris-claro); border-radius: var(--radio-sm); background: #fff; color: var(--tinta); width: 100%; min-height: 48px;
}
.form input:focus, .form select:focus, .form textarea:focus { border-color: var(--azul); outline: none; box-shadow: 0 0 0 3px rgba(25,161,195,.2); }
.form textarea { min-height: 140px; resize: vertical; }
.form__hint { font-size: .9rem; color: var(--gris); }
.form__ok { background: var(--menta); border-radius: var(--radio-sm); padding: 1rem; color: var(--verde-oscuro); font-weight: 700; }

/* ---------- Bloque CTA ---------- */
.cta { border-radius: var(--radio); background: var(--navy); color: #fff; padding: clamp(2rem, 5vw, 3.5rem); display: grid; grid-template-columns: 1fr auto; gap: 1.5rem; align-items: center; }
.cta h2 { color: #fff; margin-bottom: .35rem; }
.cta p { color: rgba(255,255,255,.85); }
@media (max-width: 700px) { .cta { grid-template-columns: 1fr; } }

/* ---------- Aviso / nota ---------- */
.note { background: var(--ocre-suave); border-left: 4px solid var(--ocre); border-radius: var(--radio-sm); padding: 1rem 1.25rem; color: #5a4a2e; }
.note--menta { background: var(--menta); border-left-color: var(--verde); color: var(--verde-oscuro); }

/* ---------- Prosa (páginas de contenido) ---------- */
.prose { max-width: var(--ancho-texto); }
.prose h2 { margin-top: 2.2rem; }
.prose h3 { margin-top: 1.6rem; }
.prose ul li, .prose ol li { margin-bottom: .35rem; }

/* ---------- Breadcrumb ---------- */
.crumbs { font-size: .9rem; color: var(--gris); margin-bottom: 1rem; }
.crumbs ol { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: .35rem; }
.crumbs li + li::before { content: "›"; margin-right: .35rem; color: var(--gris-claro); }
.crumbs a { color: var(--gris); }

/* ---------- Footer ---------- */
.site-footer { background: var(--navy-oscuro); color: rgba(255,255,255,.88); padding-top: 3.5rem; margin-top: 2rem; font-size: .97rem; }
.site-footer a { color: #fff; }
.site-footer a:hover { color: var(--ocre); }
.site-footer__grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 2rem; }
@media (max-width: 900px) { .site-footer__grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .site-footer__grid { grid-template-columns: 1fr; } }
.site-footer__brand img { width: 180px; margin-bottom: 1rem; }
.site-footer__brand p { color: rgba(255,255,255,.75); max-width: 40ch; }
.site-footer__title { font-size: .85rem; letter-spacing: .12em; text-transform: uppercase; color: var(--ocre); font-weight: 500; margin-bottom: .9rem; }
.site-footer__list { list-style: none; margin: 0; padding: 0; display: grid; gap: .5rem; }
.site-footer__address { margin-bottom: .6rem; }
.site-footer__bottom { border-top: 1px solid rgba(255,255,255,.14); margin-top: 2.5rem; padding-block: 1.25rem 1.5rem; font-size: .88rem; color: rgba(255,255,255,.7); display: flex; flex-wrap: wrap; justify-content: space-between; gap: .5rem 2rem; }
.site-footer__bottom p { margin: 0; }

/* ---------- WhatsApp flotante ---------- */
.wa-float { position: fixed; right: 1.1rem; bottom: 1.1rem; width: 58px; height: 58px; border-radius: 50%; background: #25d366; color: #fff; display: grid; place-items: center; box-shadow: 0 8px 24px rgba(0,0,0,.22); z-index: 60; transition: transform var(--transicion); }
.wa-float:hover { transform: scale(1.06); color: #fff; }
.menu-abierto .wa-float { display: none; }
@media print { .wa-float, .site-header, .site-footer { display: none; } }

/* ---------- Páginas interiores ---------- */
.h3 { font-size: clamp(1.1rem, 1.6vw, 1.25rem); }
.page-hero { padding-top: clamp(2rem, 4vw, 3rem); }
.crumbs--claro, .crumbs--claro a { color: rgba(255,255,255,.75); }
.crumbs--claro li + li::before { color: rgba(255,255,255,.4); }
.section--navy .section__head .lead { color: rgba(255,255,255,.88); }

/* ---------- Perfil de profesional: cabecera con foto + cuerpo con lateral fijo ---------- */
.perfil { background: linear-gradient(160deg, var(--navy-oscuro) 0%, var(--navy) 70%, #226f8f 100%); padding-block: clamp(1.5rem, 3vw, 2.5rem) clamp(2.5rem, 5vw, 4rem); color: #fff; }
.perfil .crumbs, .perfil .crumbs a { color: rgba(255,255,255,.75); }
.perfil__cab { display: grid; grid-template-columns: 390px minmax(0, 1fr); gap: 3rem; align-items: center; }
.perfil__foto { position: relative; max-width: 380px; margin: .75rem auto 0; }
.perfil__foto::before { content: ""; position: absolute; inset: 16px -16px -16px 16px; border-radius: var(--radio); background: linear-gradient(145deg, var(--aqua), var(--verde)); opacity: .6; }
.perfil__foto img { position: relative; display: block; width: 100%; aspect-ratio: 3 / 4; object-fit: cover; object-position: center; border-radius: var(--radio); border: 6px solid #fff; box-shadow: 0 24px 50px rgba(0,0,0,.35); background: var(--menta-suave); }
.perfil__cab h1 { color: #fff; font-size: clamp(1.8rem, 3.6vw, 2.6rem); margin: .5rem 0 .2rem; }
.perfil__rol { color: var(--ocre); font-family: var(--fuente-titulos); font-weight: 500; font-size: 1.15rem; margin-bottom: 1rem; }
.perfil__resumen { font-size: 1.12rem; color: rgba(255,255,255,.92); max-width: 56ch; margin-bottom: 1.25rem; }
.perfil__rapido { display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; margin: 0 0 1.5rem; padding: 0; list-style: none; color: rgba(255,255,255,.85); font-size: .95rem; }
.perfil__rapido strong { color: #fff; }
.perfil .btn--outline { color: #fff; border-color: rgba(255,255,255,.6); }
.perfil .btn--outline:hover { background: rgba(255,255,255,.12); color: #fff; border-color: #fff; }
@media (max-width: 800px) { .perfil__cab { grid-template-columns: 1fr; } .perfil__foto { max-width: 280px; margin-bottom: 1rem; } }
.perfil-grid { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 3rem; align-items: start; }
@media (max-width: 900px) { .perfil-grid { grid-template-columns: minmax(0, 1fr); } }
.perfil-grid h2 { font-size: 1.35rem; margin-top: 2rem; }
.perfil-grid h2:first-child { margin-top: 0; }
.perfil-aside { display: grid; gap: 1.25rem; position: sticky; top: 90px; }
.perfil-aside h2 { font-size: 1.1rem; margin-top: 0; }
.perfil-aside .btn { margin-top: .75rem; width: 100%; }
.perfil-aside table.precios td { padding: .55rem 0; border-bottom: 1px dashed #eef2f4; }
.perfil-aside table.precios td.price { padding-left: 1rem; white-space: normal; }
.perfil-aside table.precios tr:last-child td { border-bottom: 0; }
.lista-check { list-style: none; padding: 0; }
.lista-check li { padding: .35rem 0 .35rem 1.6rem; position: relative; }
.lista-check li::before { content: "✓"; position: absolute; left: 0; color: var(--verde); font-weight: 800; }

/* ---------- Servicios ---------- */
.chips--claro { margin-top: 1.25rem; }
.chips--claro a { background: transparent; border-color: rgba(255,255,255,.45); color: #fff; }
.chips--claro a:hover { background: rgba(255,255,255,.14); border-color: #fff; color: #fff; }
.srv-cat { margin-bottom: 2.5rem; scroll-margin-top: 90px; }
.pro-card[id] { scroll-margin-top: 90px; }
.srv-cat h2 { font-size: 1.5rem; margin-bottom: .9rem; }
table.precios--servicios th { background: var(--menta-suave); color: var(--navy); font-family: var(--fuente-titulos); font-weight: 700; font-size: .85rem; letter-spacing: .04em; text-transform: uppercase; }
table.precios--servicios td { vertical-align: middle; }
table.precios--servicios .srv-nombre { width: 46%; border-right: 1px solid #edf1f3; }
table.precios--servicios .srv-nombre a { font-family: var(--fuente-titulos); font-weight: 700; color: var(--navy); text-decoration: none; display: block; }
table.precios--servicios .srv-nombre a:hover { color: var(--verde-oscuro); text-decoration: underline; }
table.precios--servicios .srv-nombre small { display: block; color: var(--gris); font-size: .85rem; margin-top: .15rem; }
table.precios--servicios .price, table.precios--servicios th:last-child { white-space: nowrap; text-align: right; }
@media (max-width: 640px) {
  table.precios--servicios { font-size: .92rem; }
  table.precios--servicios th, table.precios--servicios td { padding: .6rem .7rem; }
  table.precios--servicios .srv-nombre { width: 44%; }
}
.servicio-hero__grid { display: grid; grid-template-columns: minmax(0, 1fr) 260px; gap: 2.5rem; align-items: center; }
@media (max-width: 800px) { .servicio-hero__grid { grid-template-columns: 1fr; gap: 1.5rem; } }
.servicio-hero h1 { font-size: clamp(1.7rem, 3.4vw, 2.5rem); }
.servicio-hero .btn--outline { color: #fff; border-color: rgba(255,255,255,.6); }
.servicio-hero .btn--outline:hover { background: rgba(255,255,255,.12); color: #fff; border-color: #fff; }
.servicio-hero__precio { background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.25); border-radius: var(--radio); padding: 1.25rem 1.5rem; text-align: center; }
.servicio-hero__label { display: block; font-size: .8rem; letter-spacing: .08em; text-transform: uppercase; color: var(--ocre); font-weight: 700; margin-bottom: .3rem; }
.servicio-hero__precio strong { display: block; font-family: var(--fuente-titulos); font-size: 1.9rem; line-height: 1.1; color: #fff; }
.servicio-hero__precio a { display: inline-block; margin-top: .4rem; font-size: .9rem; color: rgba(255,255,255,.85); }
.servicio-hero__seg { display: block; margin-top: .35rem; font-size: .95rem; color: rgba(255,255,255,.9); }
.pasos { list-style: none; padding: 0; counter-reset: paso; display: grid; gap: .9rem; }
.pasos li { position: relative; padding-left: 3rem; counter-increment: paso; }
.pasos li::before { content: counter(paso); position: absolute; left: 0; top: 0; width: 2.1rem; height: 2.1rem; border-radius: 50%; background: var(--verde); color: #fff; font-family: var(--fuente-titulos); font-weight: 700; display: flex; align-items: center; justify-content: center; }
.pasos li strong { display: block; color: var(--navy); margin-bottom: .15rem; }
.pasos li span { color: var(--gris); }
.aviso { background: #fff8ec; border-left: 4px solid var(--ocre); padding: .9rem 1.1rem; border-radius: 0 var(--radio) var(--radio) 0; color: var(--tinta); margin-top: 1.5rem; }
.aviso--menta { background: var(--menta-suave); border-left-color: var(--verde); }
.datos { display: grid; gap: .6rem; }
.datos div { display: grid; grid-template-columns: 1fr; gap: .1rem; padding-bottom: .6rem; border-bottom: 1px dashed #eef2f4; }
.datos div:last-child { border-bottom: 0; padding-bottom: 0; }
.datos dt { font-size: .78rem; letter-spacing: .06em; text-transform: uppercase; color: var(--verde-oscuro); font-weight: 700; }
.datos dd { margin: 0; color: var(--tinta); }
.pros-mini { list-style: none; padding: 0; display: grid; gap: .6rem; }
.pros-mini a { display: flex; align-items: center; gap: .7rem; text-decoration: none; color: var(--tinta); }
.pros-mini a:hover strong { color: var(--verde-oscuro); text-decoration: underline; }
.pros-mini img { width: 44px; height: 44px; aspect-ratio: 1 / 1; flex: 0 0 auto; border-radius: 50%; object-fit: cover; box-shadow: 0 0 0 2px #fff, 0 0 0 3px var(--aqua); }
.pros-mini strong { display: block; font-family: var(--fuente-titulos); color: var(--navy); font-size: .98rem; }
.pros-mini small { display: block; color: var(--gris); font-size: .82rem; }
.srv-card { display: flex; flex-direction: column; gap: .4rem; text-decoration: none; color: var(--tinta); }
.srv-card h3 { font-size: 1.1rem; margin: 0; }
.srv-card p { color: var(--gris); font-size: .95rem; margin: 0; flex: 1; }
.srv-card__precio { font-family: var(--fuente-titulos); font-weight: 700; color: var(--verde-oscuro); }

/* ---------- Página TDAH ---------- */
.banners--fija .banner { min-height: clamp(400px, 40vw, 540px); }
.banners--fija .banner__text { padding-block: 2.5rem 3.5rem; }
.banners--fija .crumbs { margin-bottom: 1rem; }
.btn--outline-claro { background: transparent; color: #fff; border-color: rgba(255,255,255,.7); }
.btn--outline-claro:hover { background: rgba(255,255,255,.14); border-color: #fff; color: #fff; }
.btn--claro { background: #fff; color: var(--verde-oscuro); }
.btn--claro:hover { background: var(--ocre); color: var(--navy-oscuro); }
.card--menta { background: var(--menta-suave); border-color: #d7ebe4; }
.card--menta h3 { margin-bottom: .6rem; }
.faq { border-bottom: 1px solid #e6ecee; padding: .2rem 0; }
.faq summary { cursor: pointer; padding: .9rem 2rem .9rem 0; font-family: var(--fuente-titulos); font-weight: 700; color: var(--navy); list-style: none; position: relative; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; position: absolute; right: .2rem; top: 50%; transform: translateY(-50%); width: 1.6rem; height: 1.6rem; border-radius: 50%; background: var(--menta); color: var(--verde-oscuro); display: flex; align-items: center; justify-content: center; font-weight: 800; }
.faq[open] summary::after { content: "–"; }
.faq p { margin: 0 0 1rem; color: var(--gris); }
.srv-card .eyebrow { margin-bottom: .1rem; font-size: .72rem; }

/* ---------- Autoevaluaciones ---------- */
.test { margin-top: 2rem; }
.test__marco { font-weight: 700; color: var(--navy); margin-bottom: 1rem; }
.test__items { list-style: none; padding: 0; margin: 0; counter-reset: q; }
.test__item { counter-increment: q; padding: 1.1rem 1.2rem 1.1rem 3.2rem; position: relative; border: 1px solid #e6ecee; border-radius: var(--radio); background: #fff; margin-bottom: .8rem; }
.test__item::before { content: counter(q); position: absolute; left: .9rem; top: 1.05rem; width: 1.7rem; height: 1.7rem; border-radius: 50%; background: var(--menta); color: var(--verde-oscuro); font-weight: 800; font-size: .85rem; display: flex; align-items: center; justify-content: center; }
.test__item--falta { border-color: var(--ocre); background: #fff8ec; }
.test__pregunta { margin: 0 0 .7rem; font-weight: 600; color: var(--tinta); }
.test__opciones { display: grid; grid-template-columns: repeat(4, 1fr); gap: .45rem; }
@media (max-width: 640px) { .test__opciones { grid-template-columns: repeat(2, 1fr); } }
.test__opcion { position: relative; display: block; }
.test__opcion input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.test__opcion span { display: block; text-align: center; padding: .55rem .5rem; border: 1px solid #d9e3e6; border-radius: 999px; font-size: .88rem; color: var(--gris); cursor: pointer; transition: background var(--transicion), border-color var(--transicion), color var(--transicion); }
.test__opcion:hover span { border-color: var(--verde); color: var(--verde-oscuro); }
.test__opcion input:checked + span { background: var(--verde-fondo); border-color: var(--verde-fondo); color: #fff; font-weight: 700; }
.test__opcion input:focus-visible + span { outline: 3px solid var(--aqua); outline-offset: 2px; }
.test__error { color: #9a5b00; background: #fff8ec; border-left: 4px solid var(--ocre); padding: .7rem 1rem; border-radius: 0 var(--radio) var(--radio) 0; }
.resultado { margin-top: 2.5rem; border: 1px solid #e6ecee; border-radius: var(--radio); overflow: hidden; background: #fff; scroll-margin-top: 90px; }
.resultado__cab { padding: 1.75rem 1.75rem 1.5rem; color: #fff; background: linear-gradient(145deg, var(--navy-oscuro), var(--navy)); }
.resultado__cab .eyebrow { color: var(--ocre); }
.resultado__cab h2 { color: #fff; margin-bottom: .2rem; }
.resultado__cab { background: linear-gradient(145deg, var(--navy-oscuro), var(--navy)); }
.resultado__puntaje { color: rgba(255,255,255,.85); margin-bottom: .8rem; }
.resultado__barra { height: 10px; border-radius: 999px; background: rgba(255,255,255,.25); overflow: hidden; }
.resultado__barra span { display: block; height: 100%; background: #fff; border-radius: 999px; transition: width .6s ease; }
.resultado__urgencia { padding: 1.25rem 1.75rem; background: #fdecec; border-bottom: 1px solid #f3c9c9; color: #6b1f1f; }
.resultado__urgencia h3 { color: #8c2b2b; margin-bottom: .4rem; font-size: 1.15rem; }
.resultado__urgencia a:not(.btn) { color: #8c2b2b; font-weight: 700; }
.resultado__urgencia .btn--primary { color: #fff; }
.resultado__cuerpo { padding: 1.5rem 1.75rem 1.75rem; }
.resultado__cuerpo h3 { font-size: 1.2rem; margin: 1.5rem 0 .5rem; }
.resultado__rol { font-size: .78rem; letter-spacing: .08em; text-transform: uppercase; color: var(--verde-oscuro); font-weight: 700; margin: 1rem 0 .4rem; }
.pros-lista { list-style: none; padding: 0; margin: 0; display: grid; gap: .6rem; }
.pros-lista__item { display: flex; gap: .9rem; align-items: flex-start; padding: .9rem 1rem; border: 1px solid #e6ecee; border-radius: var(--radio); background: var(--menta-suave); }
.pros-lista__item img { width: 56px; height: 56px; aspect-ratio: 1 / 1; flex: 0 0 auto; border-radius: 50%; object-fit: cover; box-shadow: 0 0 0 2px #fff, 0 0 0 3px var(--aqua); }
.pros-lista__nombre { display: block; font-family: var(--fuente-titulos); font-weight: 700; color: var(--navy); text-decoration: none; }
.pros-lista__rol { display: block; color: var(--verde-oscuro); font-size: .9rem; font-weight: 600; }
.pros-lista__horario { display: block; color: var(--gris); font-size: .88rem; margin: .15rem 0 .5rem; }
.pros-lista__acciones { display: flex; flex-wrap: wrap; gap: .4rem; }
.btn--sm { padding: .4rem .9rem; font-size: .85rem; }
.resultado__servicio { margin-top: 1.25rem; }
.resultado__ahora { margin-top: 1.25rem; padding: .9rem 1.1rem; border-radius: var(--radio); background: var(--menta); color: var(--tinta); }
.section[id] { scroll-margin-top: 80px; }

/* ---------- Aviso de emergencias (pie) ---------- */
.aviso-emergencia { background: #fff8ec; border-top: 3px solid var(--ocre); color: var(--tinta); font-size: .92rem; padding: .8rem 0; }
.aviso-emergencia a { color: var(--navy); font-weight: 700; }
.resultado__urgencia-lineas { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .8rem; }
.resultado__urgencia .btn--ghost { background: #fff; color: #8c2b2b; }
.cuando { margin-top: 1.5rem; }
.cuando__item { background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.25); border-radius: var(--radio); padding: 1.1rem 1.3rem; }
.cuando__item strong { display: block; font-family: var(--fuente-titulos); font-size: 1.8rem; color: var(--ocre); line-height: 1; margin-bottom: .4rem; }
.cuando__item p { color: rgba(255,255,255,.9); margin-bottom: .8rem; }
.prose-lead p { font-size: 1.15rem; line-height: 1.65; color: var(--navy-oscuro); }
.prose-lead p:first-child { font-weight: 600; }
.form__check { display: flex; gap: .6rem; align-items: flex-start; font-size: .9rem; color: var(--gris); margin: .5rem 0 1rem; }
.form__check input { margin-top: .25rem; width: 18px; height: 18px; flex: 0 0 auto; accent-color: var(--verde); }
.site-footer__aviso a { color: rgba(255,255,255,.85); }
.site-footer__version { margin-left: .6rem; font-size: .72rem; letter-spacing: .04em; color: #a9c6d3; }

/* ---------- Newsletter ---------- */
.newsletter__box { display: grid; grid-template-columns: 1fr 1fr; gap: 2.5rem; align-items: center; background: #fff; border: 1px solid #e6ecee; border-radius: var(--radio); padding: 2rem 2.25rem; }
@media (max-width: 800px) { .newsletter__box { grid-template-columns: 1fr; gap: 1.25rem; padding: 1.5rem; } }
.newsletter__box h2 { font-size: 1.5rem; margin-bottom: .5rem; }
.newsletter__box p { color: var(--gris); margin: 0; }
.newsletter__row { display: flex; gap: .6rem; }
.newsletter__row input { flex: 1; min-width: 0; padding: .8rem 1rem; border: 1.5px solid #cfe0e6; border-radius: 999px; font: inherit; }
.newsletter__row input:focus { outline: 3px solid var(--aqua); outline-offset: 1px; border-color: var(--verde); }
@media (max-width: 480px) { .newsletter__row { flex-direction: column; } .newsletter__row .btn { width: 100%; } }
.newsletter__form .form__hint { margin-top: .6rem; }

/* Navegación entre áreas de atención */
.areas-nav { background: #fff; border-bottom: 1px solid var(--borde, #e3ebe8); }
.areas-nav__row { display: flex; gap: .4rem; overflow-x: auto; padding-block: .7rem; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.areas-nav__row::-webkit-scrollbar { display: none; }
.areas-nav a { flex: 0 0 auto; font-size: .82rem; font-weight: 600; color: var(--navy); background: var(--menta-suave, #f3f8f6); border-radius: 999px; padding: .35rem .8rem; text-decoration: none; white-space: nowrap; }
.areas-nav a:hover { background: var(--menta, #e7f3ef); }
.areas-nav a[aria-current="page"] { background: var(--verde-fondo); color: #fff; }
.areas-nav__all { border: 1px solid var(--verde); background: #fff !important; color: var(--verde-oscuro) !important; }
/* Legibilidad del texto superior del banner sobre la foto */
.banner::after { content: ""; position: absolute; inset: 0 0 auto 0; height: 38%; z-index: -1; background: linear-gradient(180deg, rgba(23,80,106,.55) 0%, rgba(23,80,106,0) 100%); pointer-events: none; }

/* ---------- Artículos ---------- */
.articulo-hero__head { max-width: 46rem; }
.articulo-hero__meta { color: rgba(255,255,255,.8); font-size: .95rem; margin-top: -.4rem; }
.articulo-hero__meta a { color: #fff; }
.articulo-portada { margin-top: -2.5rem; position: relative; z-index: 1; }
.articulo-portada img { width: 100%; height: auto; border-radius: var(--radio); box-shadow: var(--sombra); display: block; background: var(--menta-suave); }
.articulo__cuerpo { font-size: 1.08rem; }
.articulo__cuerpo h2 { margin-top: 2rem; }
.articulo__cuerpo h3 { margin-top: 1.5rem; }
.articulo__cuerpo ul, .articulo__cuerpo ol { padding-left: 1.3rem; }
.articulo__cita { margin: 1.8rem 0; padding: 1rem 1.4rem; border-left: 4px solid var(--verde); background: var(--menta-suave); border-radius: 0 var(--radio-sm) var(--radio-sm) 0; font-family: var(--fuente-titulos); font-size: 1.15rem; color: var(--navy); }
.articulo__cita p { margin: 0; }
.articulo__figura { margin: 1.8rem 0; }
.articulo__figura img { width: 100%; height: auto; border-radius: var(--radio); display: block; }
.articulo__figura figcaption { font-size: .9rem; color: var(--gris); margin-top: .5rem; font-style: italic; }
.lectura-relacionada { display: block; margin: 1.6rem 0; padding: .9rem 1.2rem; border: 1px solid var(--aqua); border-radius: var(--radio-sm); background: var(--menta); text-decoration: none; }
.lectura-relacionada__eyebrow { display: block; font-size: .75rem; letter-spacing: .08em; text-transform: uppercase; color: var(--verde-oscuro); font-weight: 700; }
.lectura-relacionada__titulo { display: block; color: var(--navy); font-weight: 700; }
.articulo__areas { margin: 2rem 0 1rem; color: var(--gris); }
.articulo__areas .chip { display: inline-block; margin: .2rem .2rem 0 0; padding: .3rem .8rem; border-radius: 999px; background: var(--menta-suave); color: var(--navy); font-weight: 600; font-size: .9rem; text-decoration: none; }
.articulo__autor { display: flex; gap: 1rem; align-items: flex-start; margin-top: 2rem; }
.articulo__autor img { width: 72px; height: 72px; border-radius: 50%; object-fit: cover; flex: 0 0 auto; }
.articulo__autor p { margin: 0 0 .3rem; }
.articulo__autor-nombre { font-family: var(--fuente-titulos); font-weight: 700; color: var(--navy); }
.articulo__autor-rol { color: var(--gris); font-size: .92rem; }
.articulo__cta { margin-top: 2rem; }
.articulo-card { display: flex; flex-direction: column; padding: 0; overflow: hidden; text-decoration: none; color: inherit; }
.articulo-card__img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; display: block; background: var(--menta-suave); }
.articulo-card__body { padding: 1.1rem 1.25rem 1.25rem; display: flex; flex-direction: column; gap: .35rem; flex: 1; }
.articulo-card__body h2, .articulo-card__body h3 { margin: 0; font-size: 1.12rem; }
.articulo-card__body p { margin: 0; color: var(--gris); font-size: .95rem; }
.articulo-card__meta { margin-top: auto; padding-top: .5rem; font-size: .82rem; color: var(--gris); }
.articulos-filtros { display: flex; flex-direction: column; gap: .8rem; margin-top: .5rem; }
.articulos-buscar { width: min(100%, 420px); padding: .7rem 1rem; border-radius: 999px; border: 1px solid rgba(255,255,255,.4); background: rgba(255,255,255,.12); color: #fff; font: inherit; }
.articulos-buscar::placeholder { color: rgba(255,255,255,.7); }
.chips a[aria-current="true"] { background: var(--verde-fondo); border-color: var(--verde-fondo); color: #fff; }

/* Enlace adultos → sección infantil en las áreas compartidas */
.banner__nota { margin-top: 1rem; font-size: .95rem; }
.banner__nota a { color: #fff; text-decoration: underline; text-underline-offset: .2em; opacity: .92; }
.banner__nota a:hover { opacity: 1; }

/* Submenú de áreas: dos columnas (adultos / niñas, niños y adolescentes) */
@media (min-width: 1161px) { .site-nav ul.sub--areas { column-count: 2; left: auto; right: auto; width: min(640px, 100%); } }

.link-flecha { font-weight: 700; color: var(--navy); text-decoration: none; }
.link-flecha:hover { text-decoration: underline; }

/* Listado de servicios en tarjetas */
.srv-card--lista { position: relative; transition: transform var(--transicion), box-shadow var(--transicion), border-color var(--transicion); }
.srv-card--lista:hover, .srv-card--lista:focus-visible { transform: translateY(-2px); box-shadow: var(--sombra); border-color: var(--aqua); }
.srv-card--lista h3 { color: var(--navy); }
.srv-card--lista .srv-card__precio, .srv-card__mas, .srv-card__cta { display: block; }
.srv-card--lista p { flex: 0 0 auto; }
.srv-card__mas { font-size: .82rem; color: var(--gris); }
.srv-card__cta { margin-top: auto; padding-top: .6rem; font-weight: 700; font-size: .9rem; color: var(--verde-oscuro); }
.srv-card--lista:hover .srv-card__cta { text-decoration: underline; }
.srv-cat + .srv-cat { margin-top: 2.5rem; }

.srv-card--area { padding: 0; }
.srv-card--area .srv-card__link { display: flex; flex-direction: column; gap: .4rem; padding: 1.5rem; color: inherit; text-decoration: none; flex: 1; }
.srv-card--area .srv-card__link p { flex: 1; }
.card__list--sub { margin: 0; padding: .6rem 1.5rem 1.1rem; border-top: 1px dashed #e3e9eb; }
.card__list--sub li { padding: .2rem 0 .2rem 1.1rem; font-size: .92rem; }
.card__list--sub a { color: var(--navy); text-decoration: none; }
.card__list--sub a:hover { text-decoration: underline; }
.sub__sub { list-style: none; margin: 0 0 .2rem .9rem; padding: 0; border-left: 2px solid var(--menta); }
.sub__sub a { font-size: .85rem; padding: .3rem .6rem; color: var(--gris); }
.card__list--sub a { display: block; }
.srv-card__precio--sub { display: block; margin-top: .2rem; }

.galeria figure { margin: 0; }
.galeria img { width: 100%; height: auto; border-radius: var(--radio); display: block; box-shadow: 0 2px 10px rgba(30,103,136,.08); }
.galeria figcaption { font-size: .88rem; color: var(--gris); margin-top: .55rem; }

.price--linea { font-size: 1.4rem; white-space: normal; }
.btn-row .btn--sm { white-space: normal; text-align: center; }

.pruebas__grupo { background: #fff; border: 1px solid var(--linea); border-radius: var(--radio); padding: 1.2rem 1.5rem .6rem; margin-bottom: 1.25rem; }
.pruebas__grupo h3 { margin-bottom: .4rem; }
.prueba summary { display: grid; grid-template-columns: auto 1fr auto; gap: .4rem 1rem; align-items: baseline; padding-right: 2.4rem; }
.prueba__sigla { font-family: var(--fuente-titulos); font-weight: 700; color: var(--navy); white-space: nowrap; }
.prueba__nombre { font-family: var(--fuente-base); font-weight: 400; color: var(--gris); font-size: .95rem; }
.prueba__precio { font-weight: 700; color: var(--verde-oscuro); white-space: nowrap; }
@media (max-width: 640px) { .prueba summary { grid-template-columns: 1fr auto; } .prueba__nombre { grid-column: 1 / -1; } }

/* ---------- Buscador ---------- */
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.header-acciones { display: flex; align-items: center; gap: .5rem; }
.buscar-toggle { display: inline-flex; align-items: center; gap: .45rem; background: none; border: 1.5px solid var(--gris-claro); border-radius: 999px; padding: .5rem .9rem; font: inherit; font-weight: 700; color: var(--navy); cursor: pointer; min-height: 44px; }
.buscar-toggle:hover, .buscar-toggle[aria-expanded="true"] { background: var(--menta-suave); }
@media (max-width: 560px) { .buscar-toggle__label { display: none; } .buscar-toggle { padding: .5rem .7rem; } }
@media (min-width: 1481px) { .header-acciones { order: 3; } .site-nav { order: 2; } }
.buscador { border-top: 1px solid var(--linea); background: #fff; box-shadow: var(--sombra); }
.buscador[hidden] { display: none; }
.buscador .wrap { padding: 1rem 0 1.25rem; max-width: 960px; }
.buscador__form { display: flex; gap: .5rem; align-items: center; }
.buscador__input { flex: 1 1 auto; min-width: 0; font: inherit; font-size: 1.05rem; padding: .75rem 1rem; border: 1.5px solid var(--gris-claro); border-radius: var(--radio-sm); }
.buscador__input:focus { outline: 2px solid var(--navy); outline-offset: 1px; border-color: var(--navy); }
.buscador__btn { min-height: 46px; }
.buscador__cerrar { background: none; border: 0; font-size: 1.8rem; line-height: 1; color: var(--navy); cursor: pointer; padding: .25rem .5rem; }
@media (max-width: 560px) { .buscador .buscador__btn { display: none; } }
.buscador__resultados:not(:empty) { margin-top: .75rem; max-height: min(60vh, 520px); overflow: auto; }
.bsq { list-style: none; margin: 0; padding: 0; display: grid; gap: .35rem; }
.bsq__item a { display: block; padding: .7rem .9rem; border-radius: var(--radio-sm); text-decoration: none; color: var(--tinta); border: 1px solid transparent; }
.bsq__item a:hover, .bsq__item a:focus { background: var(--menta-suave); border-color: var(--linea); }
.bsq__seccion { display: inline-block; font-size: .72rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--verde-oscuro); margin-bottom: .15rem; }
.bsq__titulo { display: block; font-weight: 700; color: var(--navy); font-size: 1.02rem; }
.bsq__frag { display: block; font-size: .92rem; color: var(--gris); margin-top: .15rem; }
.bsq__item mark { background: #fff1b8; color: inherit; padding: 0 .1em; border-radius: 3px; }
.bsq__aviso { font-size: .95rem; color: var(--gris); padding: .5rem .9rem; }
.bsq__mas { text-align: center; padding: .6rem; }
.buscar-pagina .buscador__resultados { max-height: none; margin-top: 1.5rem; min-height: 40vh; }
.buscar-pagina .bsq__item a { padding: 1rem 1.1rem; background: #fff; border-color: var(--linea); }
/* Banners de índices (servicios, artículos, empresas): el texto puede ser un poco más ancho por los chips */
.banner__text--ancho { max-width: 680px; }
/* Franja bajo el banner con los filtros/categorías (fondo de marca, chips claros) */
/* Banner con personas hacia el centro: degradado más cubierto a la izquierda para que el texto se lea */
.banner--denso::before { background: linear-gradient(90deg, rgba(23,80,106,.96) 0%, rgba(23,80,106,.88) 30%, rgba(26,157,134,.62) 52%, rgba(26,157,134,.22) 72%, rgba(26,157,134,0) 90%); }
@media (max-width: 800px) {
  .banner--denso::before { background: linear-gradient(180deg, rgba(23,80,106,.62) 0%, rgba(23,80,106,.86) 40%, rgba(26,157,134,.94) 100%); }
}
.banner-franja { background: var(--navy); color: #fff; padding: 1.1rem 0 1.25rem; }
.banner-franja .chips--claro { margin-top: 0; }
.banner-franja .articulos-filtros { margin-top: 0; }
