/* sitio.css · "Azul profundo técnico" -> fase 2 "A CLARO" con acento Azul Caribe (2026-10-08, skills
   professional-design-system, design-taste-frontend y web-design-guidelines). Antes: dirección B (2026-10-01).
   A claro: fondos claros y tranquilos; el marino pasa a tinta; UN solo tono vivo (--acento) reservado para la acción
   (botón principal, enlaces, frase clave del h1). Nunca en fondos grandes. Textura = líneas de distancia a la costa real.
   Reglas del sistema:
   - Un solo acento de marca: azul marino. Los colores del semáforo SOLO comunican riesgo (nunca en marca, botones ni foco).
   - Tipografía: Inter (autoalojada, OFL), dos pesos: 400 y 600.
   - Esquinas: 8 px en controles (botones, campos), 12 px en contenedores (formularios, tarjetas, ventana). Nada más.
   - Solo modo claro (2026-10-08): mismo aspecto que el mapa y que el reporte.
   - Movimiento solo con propósito y nunca con prefers-reduced-motion. */
@font-face{font-family:'Inter';src:url('/fuentes/inter-latin-var.woff2') format('woff2');font-weight:400 600;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}
:root{
  color-scheme:light;   /* sitio SOLO en claro (decisión 2026-10-08): continuidad con el mapa, que siempre es claro */
  /* acento Azul Caribe: botón 5.7:1 con blanco; --acento-tinta sobre --marca-suave 8.4:1 */
  --acento:#1d5fd6; --acento-hover:#174fb3; --acento-tinta:#123f8f; --acento-rgb:29 95 214;
  --marca:#1d5fd6; --marca-osc:#174fb3; --marca-suave:#e4eeff; --boton:var(--acento); --boton-hover:var(--acento-hover);
  --foco:#2563eb;
  /* neutros cálidos tipo piedra caliza: la temperatura contrasta con el acento frío y da profundidad (2026-10-08) */
  --tinta:#0b1630; --texto:#1f2a3d; --tenue:#4a5568; --linea:#e4dfd5; --linea-fuerte:#cfc8bb;
  --fondo:#fbfaf7; --fondo-2:#f3f0ea; --superficie:#ffffff; --cielo:#edf2f8;
  --enc:#ffffff; --enc-texto:#1f2a3d; --enc-marca:#0b1630; --enc-hover:#f3f0ea; --enc-borde:#e4dfd5;
  --pie:#0a1630; --pie-texto:#c3cee0; --pie-enlace:#e2e8f5;
  --textura:#0b1630; --textura-op:.06;
  /* elevación: sombras teñidas del fondo (marino), nunca negras */
  --e1:0 1px 2px rgb(10 22 48 / .06);
  --e2:0 1px 2px rgb(10 22 48 / .05),0 4px 12px -2px rgb(10 22 48 / .08);
  --e3:0 2px 4px rgb(10 22 48 / .06),0 14px 32px -8px rgb(10 22 48 / .16);
  --e-accion:0 1px 2px rgb(var(--acento-rgb) / .25),0 6px 16px -4px rgb(var(--acento-rgb) / .45);
  --e-acento:0 2px 4px rgb(10 22 48 / .05),0 22px 48px -14px rgb(var(--acento-rgb) / .30);
  --relieve:inset 0 1px 0 rgb(255 255 255 / .8);
  --sombra:var(--e2);
  --fuente:'Inter',system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --peso-fuerte:600;
  --r-control:8px; --r-caja:12px; --ancho:1160px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:76px}
body{margin:0;font-family:var(--fuente);color:var(--texto);background:var(--fondo);line-height:1.6;font-size:17px;font-weight:400;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto}
a{color:var(--marca);text-underline-offset:3px}
a:hover{color:var(--marca-osc)}
h1,h2,h3{color:var(--tinta);line-height:1.2;font-weight:var(--peso-fuerte);text-wrap:balance}
h1{font-size:clamp(2rem,3.6vw,2.75rem);letter-spacing:-.02em;margin:0 0 .75rem}
h2{font-size:clamp(1.45rem,2.4vw,1.9rem);letter-spacing:-.01em;margin:0 0 .9rem}
h3{font-size:1.06rem;margin:0 0 .3rem}
p{margin:0 0 1rem}
.ancho{max-width:var(--ancho);margin:0 auto;padding:0 20px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.saltar{position:absolute;left:-999px;top:8px;background:var(--superficie);color:var(--tinta);padding:8px 12px;border-radius:var(--r-control);z-index:20}
.saltar:focus{left:12px}
:focus-visible{outline:3px solid var(--foco);outline-offset:2px;border-radius:2px}
.tenue{color:var(--tenue)}
.nota{background:var(--fondo-2);border:1px solid var(--linea);border-radius:var(--r-caja);padding:12px 16px;color:var(--texto)}
.aviso-error{color:#b42318}
.ico{width:22px;height:22px;flex:none}

/* ---------- botones (nunca colores del semáforo) ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;border:1.5px solid transparent;border-radius:var(--r-control);
  padding:.6rem 1.1rem;font:inherit;font-weight:var(--peso-fuerte);text-decoration:none;cursor:pointer;line-height:1.2;white-space:nowrap;touch-action:manipulation}
.btn-primario{background:var(--boton);color:#fff}
.btn-primario:hover{background:var(--boton-hover);color:#fff}
.btn-primario,.btn-cta{background:linear-gradient(135deg,#174fb3 0%,#1d5fd6 55%,#2a6fe0 100%);color:#fff;border-color:transparent;
  box-shadow:inset 0 1px 0 rgb(255 255 255 / .2),0 1px 2px rgb(var(--acento-rgb) / .3),0 8px 20px -6px rgb(var(--acento-rgb) / .55)}
.btn-primario:hover,.btn-cta:hover{background:linear-gradient(135deg,#174fb3 0%,#1d5fd6 40%,#2a6fe0 100%);color:#fff;
  box-shadow:inset 0 1px 0 rgb(255 255 255 / .24),0 2px 4px rgb(var(--acento-rgb) / .3),0 14px 28px -8px rgb(var(--acento-rgb) / .6)}
.btn-cta{min-height:40px;padding:.45rem .9rem}
/* jerarquía: UNA acción principal por pantalla. El botón del encabezado va en peso secundario para no competir con el del hero. */
.sitio-enc .btn-cta{background:var(--superficie);color:var(--tinta);border:1px solid var(--linea-fuerte);box-shadow:var(--e1)}
.sitio-enc .btn-cta:hover{background:var(--superficie);color:var(--marca);border-color:var(--marca);box-shadow:var(--e2)}
.enlace-ico{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0;background:none;border:0;font:inherit;font-size:.94rem;font-weight:var(--peso-medio,500);
  color:var(--marca);text-decoration:none;cursor:pointer}
.enlace-ico:hover{text-decoration:underline;text-underline-offset:3px}
.enlace-ico .ico{width:16px;height:16px}
.enlace-sec{font-weight:var(--peso-fuerte);text-underline-offset:3px}
.cta-botones.izq{justify-content:flex-start;align-items:center;gap:12px 20px}
.cta-sec{margin:12px 0 0}
/* flecha que avanza en el botón principal (indica que lleva a otra pantalla) */
.btn-primario::after{content:"";width:16px;height:16px;flex:none;background:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3 8h10M9 4l4 4-4 4' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3 8h10M9 4l4 4-4 4' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat}
.btn-secundario{background:var(--superficie);color:var(--tinta);border:1px solid var(--linea-fuerte);box-shadow:var(--e1)}
.btn-secundario:hover{background:var(--superficie);color:var(--marca);border-color:var(--marca);box-shadow:var(--e2)}
@media (hover:hover) and (prefers-reduced-motion:no-preference){
  .btn-primario:hover,.btn-cta:hover,.btn-secundario:hover{transform:translateY(-2px)}
  .btn-primario:hover::after{transform:translateX(3px)}
  .btn-primario::after{transition:transform .2s ease}
}
@media (prefers-reduced-motion:no-preference){
  .btn{transition:background-color .15s ease,transform .1s ease,box-shadow .2s ease}
  .btn:active{transform:translateY(1px)}
}

/* ---------- encabezado ---------- */
.sitio-enc{position:sticky;top:0;z-index:10;background:var(--enc);color:var(--enc-texto);display:flex;align-items:center;gap:18px;padding:10px 20px;min-height:60px;border-bottom:1px solid var(--enc-borde)}
.marca{color:var(--enc-marca);font-weight:var(--peso-fuerte);font-size:1.06rem;text-decoration:none;white-space:nowrap;margin-right:auto;letter-spacing:.01em}
.nav-escritorio{display:flex;gap:2px}
.nav-escritorio a,.nav-movil nav a{color:var(--enc-texto);text-decoration:none;padding:.5rem .75rem;border-radius:var(--r-control);font-size:.94rem}
.nav-escritorio a:hover{background:var(--enc-hover);color:var(--enc-marca)}
.nav-escritorio a[aria-current="page"]{color:var(--enc-marca);font-weight:var(--peso-fuerte);box-shadow:inset 0 -2px 0 var(--acento)}
.idioma{color:var(--enc-texto);font-size:.9rem}
.nav-movil{display:none}
.nav-movil summary{list-style:none;cursor:pointer;color:var(--enc-marca);border:1px solid var(--enc-borde);border-radius:var(--r-control);padding:.5rem .8rem;min-height:44px;display:flex;align-items:center}
.nav-movil summary::-webkit-details-marker{display:none}
.nav-movil nav{position:absolute;right:12px;top:62px;background:var(--enc);border:1px solid var(--enc-borde);border-radius:var(--r-caja);padding:8px;display:flex;flex-direction:column;min-width:230px;box-shadow:var(--e3)}
.nav-movil nav a:hover{background:var(--enc-hover)}
@media (max-width:900px){
  .nav-escritorio,.idioma,.enc-cta{display:none}
  .nav-movil{display:block}
  .nav-movil nav a{padding:.8rem .9rem}
}

/* ---------- inicio: hero claro (cielo -> fondo) con líneas de distancia a la costa (sitio/textura_costa.py) ---------- */
.hero{position:relative;overflow:hidden;background:linear-gradient(160deg,var(--fondo) 0%,var(--fondo-2) 55%,var(--cielo) 100%);color:var(--texto);padding:56px 0 64px;isolation:isolate}
.hero::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--textura);opacity:var(--textura-op);pointer-events:none;
  -webkit-mask:url('/img/textura-costa.svg') 70% 40%/cover no-repeat;mask:url('/img/textura-costa.svg') 70% 40%/cover no-repeat}
.hero-contenido{position:relative}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:48px;align-items:center}
/* jerarquía tomada de ItziaWeb (2026-10-08): etiqueta en píldora, h1 grande y apretado, fila de confianza bajo el buscador.
   Regla de forma: píldora SOLO en etiquetas no interactivas; controles siguen en 8 px y contenedores en 12 px. */
.hero::after{content:"";position:absolute;z-index:-1;top:-240px;right:-120px;width:720px;height:720px;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle,rgb(var(--acento-rgb) / .09) 0%,transparent 62%)}
.hero-etiqueta{display:inline-flex;align-items:center;gap:8px;margin:0 0 1.1rem;padding:6px 14px;border-radius:999px;font-size:.75rem;font-weight:var(--peso-fuerte);
  letter-spacing:.08em;text-transform:uppercase;color:var(--tinta);background:var(--superficie);border:1px solid var(--linea);box-shadow:var(--e1)}
.hero h1{color:var(--tinta);max-width:18ch;font-size:clamp(2.3rem,4.6vw,3.6rem);letter-spacing:-.028em;line-height:1.06;margin-bottom:1rem}
.confianza{list-style:none;margin:22px 0 0;padding:18px 0 0;display:flex;flex-wrap:wrap;gap:10px 22px;border-top:1px solid var(--linea);max-width:640px}
.confianza li{display:inline-flex;align-items:center;gap:8px;font-size:.88rem;color:var(--tenue)}
.confianza .ico{width:16px;height:16px;color:var(--tinta)}
.hero h1 em{font-style:normal;color:var(--marca)}
.hero-sub{font-size:1.12rem;max-width:46ch;color:var(--tenue);margin-bottom:1.4rem}
.buscador{background:var(--superficie);color:var(--texto);border-radius:var(--r-caja);padding:16px;max-width:640px;box-shadow:var(--e-acento);border:1px solid var(--linea)}
.buscador-label{display:block;font-size:.9rem;font-weight:var(--peso-fuerte);color:var(--tinta);margin:0 2px 6px}
.buscador-fila{display:flex;gap:8px}
.buscador input{flex:1;min-width:0;min-height:48px;font:inherit;font-size:1rem;padding:.7rem .85rem;border:1px solid #94a3b8;border-radius:var(--r-control);color:var(--tinta);background:var(--superficie)}
.buscador input::placeholder{color:#6b7689}
.buscador input:focus-visible{outline:3px solid var(--foco);outline-offset:1px;border-color:var(--foco)}
.buscador-extra{display:flex;gap:4px 22px;align-items:center;flex-wrap:wrap;margin-top:6px;font-size:.95rem}
.ayuda{font-size:.86rem;color:var(--tenue);margin:8px 2px 0}
#resultados ul.res{list-style:none;padding:0;margin:8px 0 0}
#resultados ul.res a{display:block;padding:.65rem .75rem;border:1px solid var(--linea);border-radius:var(--r-control);margin-top:6px;text-decoration:none;color:var(--tinta)}
#resultados ul.res a:hover{background:var(--fondo-2)}
@media (max-width:600px){ .hero{padding:32px 0 40px} .buscador-fila{flex-direction:column} .buscador .btn{width:100%} }

/* ventana de ejemplo (captura de la herramienta: siempre clara) */
.ventana{position:relative;display:block;color:#1f2a3d;text-decoration:none;border-radius:var(--r-caja);overflow:hidden;background:#fff;box-shadow:0 0 0 1px var(--linea),var(--e-acento);outline-offset:4px}
.ventana-mapa{position:relative;display:block;aspect-ratio:16/10;background:#f2efe8}
.ventana-mapa img{display:block;width:100%;height:100%;object-fit:cover}
.ventana-tag{position:absolute;left:12px;top:12px;background:#0a1630d9;color:#fff;font-size:.76rem;font-weight:var(--peso-fuerte);border-radius:var(--r-control);padding:.2rem .55rem}
.ventana-pin{position:absolute;left:50%;top:50%;width:36px;height:46px;margin:-46px 0 0 -18px;filter:drop-shadow(0 3px 4px rgba(0,0,0,.35))}
.ventana-card{display:block;margin:-46px 14px 14px;position:relative;background:#fff;border:1px solid #dbe2ec;border-radius:var(--r-caja);padding:12px 14px;box-shadow:0 6px 18px rgba(10,22,48,.12);font-size:.86rem;line-height:1.35}
.vc-sem{display:inline-flex;align-items:center;gap:7px;font-weight:var(--peso-fuerte);color:#0b1630}
.vc-sem i,.vc-p i,.vc-alerta i{width:11px;height:11px;border-radius:50%;flex:none;display:inline-block}
.vc-tit{display:block;margin:4px 0 8px;color:#0b1630;font-weight:var(--peso-fuerte)}
.vc-puertas{display:grid;gap:3px;border-top:1px solid #dbe2ec;padding-top:7px}
.vc-p{display:flex;align-items:center;gap:7px}
.vc-p b{font-weight:var(--peso-fuerte);color:#0b1630;min-width:6.6em}
.vc-p span{color:#4a5568}
.vc-alerta{display:flex;align-items:center;gap:7px;margin-top:7px;border-top:1px solid #dbe2ec;padding-top:7px;color:#0b1630}
.vc-alerta em{margin-left:auto;font-style:normal;font-size:.78rem;color:#4a5568;border:1px solid #dbe2ec;border-radius:var(--r-control);padding:.05rem .5rem;white-space:nowrap}
.vc-pie{display:block;margin-top:8px;font-size:.78rem;color:#4a5568}
.vc-pie u{color:#123f8f;text-decoration-thickness:1px}
/* solo escritorio: en celular la tarjeta queda en la primera pantalla y animarla retrasa el Speed Index */
@media (prefers-reduced-motion:no-preference) and (min-width:901px){
  .ventana-pin{animation:vPinCae .5s cubic-bezier(.3,1.5,.6,1) .15s both}
  .ventana-card{animation:vCardSube .45s ease-out .5s both}
  .ventana{transition:transform .2s ease,box-shadow .2s ease} .ventana:hover{transform:translateY(-3px)}
}
@keyframes vPinCae{0%{transform:translateY(-36px);opacity:0}60%{opacity:1}100%{transform:none}}
@keyframes vCardSube{0%{transform:translateY(12px);opacity:0}100%{transform:none;opacity:1}}
@media (max-width:900px){ .hero-grid{grid-template-columns:1fr;gap:28px} .ventana{max-width:560px} }

/* franja de fuentes: insignias tipográficas propias (ícono neutro + fuente + organismo + año). SIN logotipos de
   dependencias. Escritorio: marquesina lenta, pausable (WCAG 2.2.2), detenida con foco/hover/fuera de pantalla.
   Celular y movimiento reducido: fila estática deslizable con scroll-snap. La copia de la lista va aria-hidden + inert. */
.franja{background:var(--superficie);border-top:1px solid var(--linea);border-bottom:1px solid var(--linea);padding:34px 0 30px}
.franja-cab{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px 16px;margin-bottom:20px;position:relative}
.franja-t{margin:0;font-size:.75rem;font-weight:var(--peso-fuerte);letter-spacing:.12em;text-transform:uppercase;color:var(--tenue);text-align:center}
.franja-pie{margin:20px auto 0;text-align:center;font-size:.875rem;color:var(--tenue)}
.franja-pie a{white-space:nowrap}
/* nombres de institución en gris (formato logo strip): texto, no logotipo; gris #5b6475 sobre blanco = 6.0:1 */
.marca-fuente{display:flex;align-items:center;flex:none;height:40px;margin-right:3.25rem;font-size:1.2rem;font-weight:var(--peso-fuerte);letter-spacing:.01em;
  color:#5b6475;white-space:nowrap;scroll-snap-align:start;transition:color .2s ease}
.marca-fuente:hover{color:var(--tinta)}
.marquesina{overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:0 20px;scroll-padding-inline:20px}
.marquesina::-webkit-scrollbar{display:none}
.riel{display:flex;width:max-content}
.pista{display:flex;list-style:none;margin:0;padding:0}
.insignia{display:flex;align-items:center;gap:10px;background:var(--superficie);border:1px solid var(--linea);border-radius:var(--r-control);padding:8px 14px 8px 8px;white-space:nowrap;scroll-snap-align:start;box-shadow:var(--e1),var(--relieve)}
.insignia .tile{width:34px;height:34px;border-radius:6px;display:grid;place-items:center;background:var(--marca-suave);color:var(--acento-tinta);flex:none}
.insignia .ico{width:20px;height:20px}
.insignia b{display:block;font-size:.875rem;font-weight:var(--peso-fuerte);color:var(--tinta);line-height:1.25}
.insignia small{display:block;font-size:.75rem;color:var(--tenue);line-height:1.3;font-variant-numeric:tabular-nums}
.insignia small span{color:var(--tinta);font-weight:var(--peso-fuerte)}
.pista[aria-hidden]{display:none}
@media (min-width:641px) and (prefers-reduced-motion:no-preference){
  .franja.anima .marquesina{overflow:hidden;padding:0;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 128px,#000 calc(100% - 128px),transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 128px,#000 calc(100% - 128px),transparent 100%)}
  .franja.anima .pista[aria-hidden]{display:flex}
  .franja.anima .riel{animation:desliza var(--dur,60s) linear infinite}
  .franja.anima .marquesina:hover .riel,.franja.anima .marquesina:focus-within .riel,.franja.anima[data-visible="no"] .riel{animation-play-state:paused}
}
@keyframes desliza{to{transform:translateX(-50%)}}

/* bloques */
.bloque{padding:64px 20px}
.banda{background:var(--fondo-2)}
/* pasos en línea (sin tarjetas) */
.pasos-linea{list-style:none;margin:8px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:32px;position:relative}
.pasos-linea::before{content:"";position:absolute;left:22px;right:22px;top:22px;border-top:1.5px solid var(--linea)}
.pasos-linea li{position:relative}
.paso-ico{position:relative;display:inline-grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--superficie);border:1px solid var(--linea);color:var(--tinta);margin-bottom:12px;box-shadow:var(--e2),var(--relieve)}
.pasos-linea p{color:var(--tenue);margin:0}
.paso-num{display:block;font-size:.75rem;font-weight:var(--peso-fuerte);letter-spacing:.1em;color:var(--tenue);font-variant-numeric:tabular-nums;margin-bottom:4px}
@media (max-width:820px){
  .pasos-linea{grid-template-columns:1fr;gap:22px}
  .pasos-linea::before{left:21px;right:auto;top:22px;bottom:22px;border-top:0;border-left:1.5px solid var(--linea)}
  .pasos-linea li{display:grid;grid-template-columns:44px 1fr;column-gap:16px}
  .paso-ico{grid-row:span 3;margin:0}
}
/* lista con íconos en dos columnas */
.lista-ico{list-style:none;margin:8px 0 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:26px 48px}
.lista-ico li{display:flex;gap:14px;align-items:flex-start}
.lista-ico .ico,.alcance-serv .ico{width:42px;height:42px;padding:10px;border-radius:var(--r-control);background:var(--superficie);border:1px solid var(--linea);color:var(--tinta);box-shadow:var(--e2),var(--relieve)}
.lista-ico p,.alcance-serv p{color:var(--tenue);margin:0}
@media (max-width:760px){ .lista-ico{grid-template-columns:1fr} }
/* alcance: mensaje + servicios */
.alcance{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px;align-items:start}
.alcance-txt p{font-size:1.05rem;max-width:52ch}
.alcance-serv{list-style:none;margin:6px 0 0;padding:0;display:grid;gap:22px}
.alcance-serv li{display:flex;gap:14px;align-items:flex-start}
@media (max-width:860px){ .alcance{grid-template-columns:1fr;gap:28px} }
/* preguntas frecuentes plegables (el texto está en el DOM) */
.faq{max-width:820px}
.faq details{border-bottom:1px solid var(--linea)}
.faq summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 2px;min-height:44px}
.faq summary::-webkit-details-marker{display:none}
.faq summary h3{margin:0;font-size:1.04rem}
.faq summary::after{content:"";width:9px;height:9px;flex:none;border-right:2px solid var(--tenue);border-bottom:2px solid var(--tenue);transform:rotate(45deg);margin-top:-4px}
.faq details[open] summary::after{transform:rotate(-135deg);margin-top:4px}
.faq details p{color:var(--texto);margin:0 2px 18px;max-width:70ch}
@media (prefers-reduced-motion:no-preference){ .faq summary::after{transition:transform .15s ease} }
/* guías */
.lista-guias{list-style:none;padding:0;margin:0}
.lista-guias li{border-top:1px solid var(--linea);padding:16px 0}
.lista-guias a{font-weight:var(--peso-fuerte);font-size:1.06rem}
.lista-guias p{margin:.3rem 0 0;color:var(--tenue)}
/* llamada final */
.cta-banda{background:var(--fondo-2);border-top:1px solid var(--linea)}
.cta-final{text-align:center;padding-top:56px;padding-bottom:60px}
.cta-final p{color:var(--tenue)}
.cta-botones{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:18px}
/* tarjetas genéricas (Cómo funciona, Contacto): contenedores de 12 px */
.rejilla{list-style:none;padding:0;margin:0 0 1.2rem;display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.rejilla li{background:var(--superficie);border:1px solid var(--linea);border-radius:var(--r-caja);padding:18px;box-shadow:var(--e2),var(--relieve)}
.rejilla li p:last-child{margin:0}
.rejilla.tres{grid-template-columns:repeat(3,1fr)}
.pasos{list-style:none;padding:0;margin:0 0 1rem;display:grid;gap:12px;counter-reset:paso}
.pasos li{counter-increment:paso;display:grid;grid-template-columns:36px 1fr;column-gap:14px}
.pasos li::before{content:counter(paso);grid-row:span 2;display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--marca-suave);color:var(--marca);font-weight:var(--peso-fuerte)}
.pasos li p{margin:0;color:var(--tenue)}
@media (max-width:860px){ .rejilla,.rejilla.tres{grid-template-columns:1fr} .bloque{padding:44px 20px} }

/* páginas de texto */
.texto{max-width:820px;padding-top:28px;padding-bottom:56px}
.texto section{margin-top:2.2rem}
.entradilla{font-size:1.12rem;color:var(--texto)}
.migas{font-size:.9rem;color:var(--tenue);margin-bottom:.8rem}
.indice{background:var(--fondo-2);border:1px solid var(--linea);border-radius:var(--r-caja);padding:12px 18px;margin:1rem 0}
.indice ul{display:flex;flex-wrap:wrap;gap:6px 18px;list-style:none;padding:0;margin:0}
.indice-t{font-size:1rem;margin:0 0 .4rem}
.indice ol{margin:0;padding-left:20px}
.etiq{font-size:.82rem;color:var(--tenue);margin:0 0 .3rem}
.semaforo{display:grid;grid-template-columns:auto 1fr;gap:12px 18px;align-items:start}
.semaforo dd{margin:0}
.chip{display:inline-flex;align-items:center;gap:8px;min-width:170px;font-weight:var(--peso-fuerte);color:var(--tinta);border:1px solid var(--linea);border-radius:var(--r-control);padding:6px 10px 6px 6px;background:var(--superficie)}
.chip i{width:22px;height:22px;border-radius:6px;flex:none}
@media (max-width:640px){ .semaforo{grid-template-columns:1fr} }
.tabla{overflow-x:auto}
table{width:100%;border-collapse:collapse;font-size:.9rem;font-variant-numeric:tabular-nums}
th{text-align:left;color:var(--tenue);border-bottom:2px solid var(--linea);padding:8px 7px;font-weight:var(--peso-fuerte)}
td{border-bottom:1px solid var(--linea);padding:8px 7px;vertical-align:top}
tr.grp th{background:var(--fondo-2);color:var(--tinta)}
td .rev{display:block;color:var(--tenue);font-size:.85rem}
.conf{font-weight:var(--peso-fuerte)}
.conf-alta{color:#166534}.conf-media{color:#92400e}.conf-baja{color:#991b1b}
@media (max-width:640px){ th:nth-child(3),td:nth-child(3){display:none} }
.contacto-vias{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:10px}

/* pie */
.sitio-pie{background:var(--pie);color:var(--pie-texto);padding:30px 0;font-size:.92rem}
.sitio-pie a{color:var(--pie-enlace)}
.sitio-pie :focus-visible{outline-color:#8fb0ff}
.pie-enlaces{margin:0;display:flex;flex-wrap:wrap;gap:6px 22px}

/* ---- Embudo (2026-10-02): pregunta opcional "¿Qué vas a hacer?" en el buscador del inicio ---- */
.intencion-f{border:0;margin:12px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.intencion-f legend{float:left;margin:0 6px 0 2px;padding:0;font-size:.86rem;color:var(--tenue)}
.intencion-f legend small{font-size:.8rem}
.intencion-f label{position:relative;display:inline-flex}
.buscador .intencion-f input{position:absolute;opacity:0;width:1px;height:1px;min-height:0;margin:0;padding:0;border:0}
.intencion-f span{display:inline-block;font-size:.86rem;padding:6px 12px;border:1px solid var(--linea-fuerte);border-radius:999px;color:var(--texto);background:var(--superficie);cursor:pointer;min-height:34px;line-height:1.5}
.intencion-f input:checked+span{background:var(--tinta);border-color:var(--tinta);color:var(--superficie);font-weight:var(--peso-fuerte)}
.intencion-f input:focus-visible+span{outline:3px solid var(--foco);outline-offset:2px}
.intencion-f label:hover span{border-color:var(--marca)}

/* ---- /servicios: cuatro etapas ---- */
.etapas{list-style:none;margin:28px 0;padding:0;display:grid;gap:30px;counter-reset:etapa}
.etapas>li{border-top:1px solid var(--linea);padding-top:22px;scroll-margin-top:84px}
.etapa-h{display:flex;gap:14px;align-items:flex-start;margin-bottom:10px}
.etapa-h .ico{flex:none;width:42px;height:42px;padding:10px;border-radius:var(--r-control);background:var(--superficie);border:1px solid var(--linea);color:var(--tinta);box-shadow:var(--e2)}
.etapa-h h2{margin:0 0 .2rem}.etapa-h p{margin:0;color:var(--tenue)}
.etapas ul{list-style:none;margin:14px 0 0 54px;padding:0;display:grid;gap:16px}
.etapas ul li{scroll-margin-top:84px}
.etapas ul h3{margin:0 0 .2rem}.etapas ul p{margin:0;color:var(--texto)}
@media (max-width:640px){ .etapas ul{margin-left:0} }
.guia-servicio{margin-top:10px;font-weight:var(--peso-fuerte)}

/* campos pendientes en textos legales (se ven resaltados hasta llenarse) */
.texto mark{background:#fef3c7;color:#713f12;padding:0 4px;border-radius:4px}