/* =====================================================================
   DGT-Permiso · Hoja de estilos principal
   ===================================================================== */
:root{
  --tinta:#05142b;
  --marca-50:#eef4ff; --marca-100:#dbe7ff; --marca-200:#b9d0ff; --marca-300:#86b0ff;
  --marca-400:#4f86f7; --marca-500:#2a63e3; --marca-600:#1749c2; --marca-700:#0f3898;
  --marca-800:#0a2a72; --marca-900:#071d4f;
  --rojo:#d81b3c; --rojo-oscuro:#a90f2b; --dorado:#f5a524; --verde:#0f9d76;
  --gris-fondo:#f4f6fb; --borde:#e3e9f4; --borde-fuerte:#cdd7e8;
  --radio:18px; --sombra:0 12px 32px -18px rgba(5,20,43,.35);
  --fuente:'Inter','Segoe UI',system-ui,-apple-system,'Helvetica Neue',Arial,sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--fuente);background:var(--gris-fondo);color:var(--tinta);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
h1,h2,h3,h4{margin:0;line-height:1.15;letter-spacing:-.02em}
p{margin:0}
ul,ol{margin:0;padding:0;list-style:none}
::selection{background:var(--marca-700);color:#fff}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--dorado);outline-offset:2px}

/* ---------- Utilidades de texto y color ---------- */
.blanco{color:#fff}.dorado{color:var(--dorado)}.rojo{color:var(--rojo)}.verde{color:var(--verde)}
.marca-500{color:var(--marca-500)}.marca-600{color:var(--marca-600)}
.atenue{color:#5b6b85;font-size:.925rem;line-height:1.7;margin-top:8px}
.atenue-claro{color:var(--marca-200);font-size:.925rem;line-height:1.7;margin-top:8px}
.fuerte{font-weight:700}.centrado-texto{text-align:center}.derecha-texto{text-align:right}
.ancho-lg{max-width:44rem;margin-top:10px}
.tres-lineas{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.monoespaciado{font-family:ui-monospace,'SFMono-Regular',Menlo,Consolas,monospace;letter-spacing:.03em}
.sin-subrayado{text-decoration:none}
.ic,.ic-mini,.ic-miga,.ic-xl,.ic-xxl{width:1.25rem;height:1.25rem;flex:none}
.ic-mini{width:1rem;height:1rem}.ic-miga{width:.75rem;height:.75rem}.ic-xl{width:1.5rem;height:1.5rem}.ic-xxl{width:3rem;height:3rem}
.ocultar-movil{display:none}.solo-movil{display:inline-flex}
@media(min-width:1024px){.ocultar-movil{display:inline-flex}.solo-movil{display:none}}

.contenedor{width:100%;max-width:1240px;margin:0 auto;padding:0 16px}
@media(min-width:768px){.contenedor{padding:0 32px}}
.contenedor.estrecho{max-width:900px}
.seccion{padding:64px 0}
.seccion-final{padding:0 0 80px}
.bloque{padding:28px}
.bloque.compacta{padding:20px}
.alto-medio{min-height:60vh;justify-content:center;align-items:center;display:flex;flex-direction:column}

.saltar{position:absolute;left:-9999px}
.saltar:focus{position:fixed;left:16px;top:16px;z-index:200;background:var(--marca-900);color:#fff;padding:10px 16px;border-radius:10px}

/* ---------- Titulares ---------- */
.titulo-xl{font-size:1.9rem;font-weight:900}
.titulo-xxl{font-size:2.1rem;font-weight:900;line-height:1.08}
.titulo-lg{font-size:1.25rem;font-weight:900;color:var(--marca-900);display:flex;align-items:center;gap:8px}
.titulo-tarjeta{font-size:1.05rem;font-weight:900;color:var(--marca-900);line-height:1.35}
.titulo-tarjeta.grande{font-size:1.5rem}
@media(min-width:768px){.titulo-xl{font-size:2.1rem}.titulo-xxl{font-size:2.6rem}}
.sobretitulo{font-size:.7rem;font-weight:900;letter-spacing:.28em;text-transform:uppercase;margin-bottom:8px}
.mini-fecha{font-size:.75rem;color:#94a3b8;font-weight:600;letter-spacing:.02em;margin:0}
.mini-marca{font-size:.7rem;color:var(--marca-500);font-weight:800;text-transform:uppercase;letter-spacing:.05em;display:block}

/* ---------- Chips y etiquetas ---------- */
.chip{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:4px 12px;font-size:.68rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase;width:fit-content}
.chip.suave{background:var(--marca-50);color:var(--marca-700)}
.chip.blanco{background:rgba(255,255,255,.92);color:var(--marca-800)}
.chip.rojo{background:var(--rojo);color:#fff}
.chip.verde{background:rgba(15,157,118,.12);color:var(--verde)}
.chip.verde-suave{background:rgba(15,157,118,.12);color:var(--verde)}
.chip.rojo-suave{background:#fee9ec;color:var(--rojo)}
.chip.amarillo-suave{background:rgba(245,165,36,.18);color:#8a5a06}
.chip.gris{background:#f1f5f9;color:#64748b}
.chip.dorado-suave{background:rgba(245,165,36,.2);color:var(--dorado)}
.fila-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}

/* ---------- Botones ---------- */
.boton{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:999px;font-weight:800;font-size:.9rem;padding:12px 24px;border:1px solid transparent;cursor:pointer;transition:transform .15s,background-color .15s,border-color .15s;line-height:1.1;text-align:center}
.boton:hover{transform:translateY(-1px)}
.boton:disabled{opacity:.6;cursor:not-allowed;transform:none}
.boton.azul{background:var(--marca-700);color:#fff}
.boton.azul:hover{background:var(--marca-800)}
.boton.rojo{background:var(--rojo);color:#fff}
.boton.rojo:hover{background:var(--rojo-oscuro)}
.boton.contorno{background:#fff;color:var(--marca-800);border-color:#c3d1ea}
.boton.contorno:hover{border-color:var(--marca-500);color:var(--marca-600)}
.boton.fantasma{background:rgba(255,255,255,.12);color:#fff;border-color:rgba(255,255,255,.45)}
.boton.fantasma:hover{background:rgba(255,255,255,.22)}
.boton.ancho{width:100%}
.fila-botones{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}
.fila-botones.separada{border-top:1px solid var(--borde);padding-top:24px}
.centrado-botones{justify-content:center}
.enlace-fuerte{display:inline-flex;align-items:center;gap:4px;font-size:.8rem;font-weight:900;color:var(--marca-600)}
.enlace-suave{font-size:.75rem;color:#94a3b8;font-weight:700}
.enlace-suave:hover{color:var(--rojo)}

/* ---------- Cabecera ---------- */
.cabecera{position:sticky;top:0;z-index:60;box-shadow:0 10px 30px -24px rgba(5,20,43,.8)}
.supra{background:var(--tinta);color:var(--marca-100);font-size:.75rem}
.supra-fila{display:flex;align-items:center;justify-content:space-between;gap:16px;height:36px}
.supra-izq{display:flex;align-items:center;gap:16px}
.supra-izq a:hover{color:#fff}
.supra-der{display:flex;align-items:center;gap:12px}
.supra-der .fuerte:hover{color:var(--dorado)}
.idioma{display:inline-flex;align-items:center;gap:6px;background:rgba(255,255,255,.1);border-radius:999px;padding:3px 10px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;font-size:.68rem}
.principal{background:#fff}
.principal-fila{display:flex;flex-wrap:wrap;align-items:center;gap:16px;padding:14px 0}
.logo{display:flex;align-items:center;gap:12px}
.logo-escudo{position:relative;width:44px;height:44px;border-radius:12px;background:#fff;display:grid;place-items:center;box-shadow:0 4px 14px -6px rgba(5,20,43,.5);color:#fff;flex:none}
.logo-escudo::before{content:'';position:absolute;inset:3px;border-radius:9px;background:linear-gradient(135deg,var(--marca-600),var(--marca-900))}
.logo-escudo svg{position:relative;width:24px;height:24px}
.logo-texto{display:flex;flex-direction:column;line-height:1.15}
.logo-texto b{font-size:1.1rem;font-weight:900;letter-spacing:-.02em}
.logo-texto small{font-size:.6rem;font-weight:800;letter-spacing:.22em;text-transform:uppercase}

.buscador{position:relative;order:3;width:100%;flex:1;min-width:260px;display:flex;align-items:center;gap:8px;border:1px solid var(--marca-100);background:var(--marca-50);border-radius:999px;padding:10px 16px}
.buscador:focus-within{border-color:var(--marca-500);background:#fff}
.buscador input{border:0;background:transparent;outline:none;width:100%;font-size:.9rem}
.buscador .limpiar{border:0;background:transparent;cursor:pointer;display:grid;place-items:center}
@media(min-width:1024px){.buscador{order:2;width:auto}}
.acciones{order:2;margin-left:auto;display:flex;gap:8px}
@media(min-width:1024px){.acciones{order:3}}

.resultados{position:absolute;top:calc(100% + 8px);left:0;right:0;background:#fff;border:1px solid var(--borde);border-radius:16px;box-shadow:0 24px 48px -20px rgba(5,20,43,.4);overflow:hidden;z-index:70}
.resultados-cabecera{background:var(--marca-50);padding:8px 16px;font-size:.65rem;font-weight:900;text-transform:uppercase;letter-spacing:.1em;color:var(--marca-600);border-bottom:1px solid var(--marca-50)}
.resultados a{display:block;padding:12px 16px;border-bottom:1px solid #f1f5f9}
.resultados a:hover{background:var(--marca-50)}
.resultados .cat{font-size:.6rem;font-weight:900;text-transform:uppercase;letter-spacing:.08em;color:var(--rojo)}
.resultados b{display:block;font-size:.875rem;color:var(--marca-900)}
.resultados small{color:#64748b;font-size:.75rem}
.resultados-vacio{padding:14px 16px;font-size:.85rem;color:#64748b}

.nav{background:var(--marca-900)}
.nav-fila{display:none;align-items:stretch;gap:4px}
@media(min-width:1024px){.nav-fila{display:flex}}
.nav-item{position:relative}
.nav-item>a{display:flex;align-items:center;gap:4px;padding:14px 16px;font-size:.85rem;font-weight:700;color:#fff}
.nav-item:hover>a,.nav-item>a:focus{background:var(--marca-800)}
.atenuado{opacity:.7}
.desplegable{position:absolute;left:0;top:100%;width:430px;background:#fff;border:1px solid var(--borde);border-top:0;border-radius:0 0 16px 16px;padding:8px;box-shadow:0 24px 48px -20px rgba(5,20,43,.4);display:none;z-index:70}
.nav-item:hover .desplegable,.nav-item:focus-within .desplegable{display:block}
.desplegable a{display:flex;gap:12px;padding:10px 12px;border-radius:12px;color:#33415c}
.desplegable a:hover{background:var(--marca-50)}
.desplegable b{display:block;font-size:.875rem;color:var(--marca-900)}
.desplegable small{display:block;font-size:.75rem;color:#64748b}
.nav-area{margin-left:auto;display:inline-flex;align-items:center;gap:8px;align-self:center;background:rgba(255,255,255,.1);color:#fff;padding:6px 16px;border-radius:999px;font-size:.82rem;font-weight:800}
.nav-area:hover{background:rgba(255,255,255,.2)}
.nav.abierto .nav-fila{display:flex;flex-direction:column;align-items:stretch;max-height:70vh;overflow-y:auto;padding:12px 0}
.nav.abierto .desplegable{position:static;width:100%;box-shadow:none;border:0;display:block;background:rgba(255,255,255,.05);margin-bottom:8px}

/* ---------- Héroes ---------- */
.carrusel{position:relative;isolation:isolate;overflow:hidden;background:var(--marca-900);color:#fff}
.diapositiva{position:absolute;inset:0;opacity:0;transition:opacity 1s ease}
.diapositiva.activa{opacity:1}
.diapositiva img{width:100%;height:100%;object-fit:cover;transform:scale(1.06);transition:transform 9s ease-out}
.diapositiva.activa img{transform:scale(1)}
.diapositiva-velo{position:absolute;inset:0;background:linear-gradient(90deg,var(--marca-900),rgba(7,29,79,.88) 45%,rgba(7,29,79,.3))}
.carrusel-contenido{position:relative;display:grid;gap:32px;padding-top:64px;padding-bottom:64px}
@media(min-width:1024px){.carrusel-contenido{grid-template-columns:1.05fr .95fr;align-items:center;padding-top:96px;padding-bottom:96px}}
.carrusel-texto h1{font-size:1.9rem;font-weight:900;margin-top:16px}
.carrusel-texto p{margin-top:16px;color:var(--marca-100);font-size:1.05rem;max-width:34rem}
.carrusel-tarjetas{display:grid;gap:12px;grid-template-columns:1fr}
@media(min-width:640px){.carrusel-tarjetas{grid-template-columns:1fr 1fr}}
.tarjeta-flotante{display:flex;flex-direction:column;gap:4px;border:1px solid rgba(255,255,255,.15);background:rgba(255,255,255,.1);border-radius:16px;padding:16px;backdrop-filter:blur(4px);transition:transform .15s,border-color .15s,background-color .15s;color:#fff}
.tarjeta-flotante:hover{transform:translateY(-3px);border-color:rgba(245,165,36,.6);background:rgba(255,255,255,.16)}
.tarjeta-flotante b{font-size:.875rem}
.tarjeta-flotante small{font-size:.75rem;color:var(--marca-200)}
.tarjeta-flotante.plana small{color:var(--marca-200);font-weight:800;text-transform:uppercase;letter-spacing:.06em;font-size:.65rem}
.puntos-carrusel{display:flex;align-items:center;gap:10px;margin-top:32px}
.puntos-carrusel button{width:16px;height:6px;border:0;border-radius:999px;background:rgba(255,255,255,.4);cursor:pointer;transition:width .2s,background-color .2s}
.puntos-carrusel button.activo{width:40px;background:var(--dorado)}

.heroe-azul{background:var(--marca-900);color:#fff;padding:56px 0}
.miga{display:flex;align-items:center;gap:8px;font-size:.72rem;font-weight:700;color:var(--marca-200)}
.miga a:hover{color:#fff}
.miga.claro{color:var(--marca-200)}
.heroe-texto{margin-top:12px;max-width:48rem;font-size:.925rem;line-height:1.75;color:var(--marca-100)}
.fondo-oscuro{background:var(--tinta);color:#fff}
.fondo-blanco{background:#fff}
.fondo-marca-900{background:var(--marca-900);color:#fff}
.fondo-gris{background:var(--gris-fondo)}

.banda-accesos{margin-top:-40px;position:relative;z-index:10}
.accesos{display:grid;gap:8px;padding:16px;grid-template-columns:1fr}
@media(min-width:640px){.accesos{grid-template-columns:1fr 1fr}}
@media(min-width:1024px){.accesos{grid-template-columns:repeat(3,1fr)}}
@media(min-width:1280px){.accesos{grid-template-columns:repeat(6,1fr)}}
.acceso{display:flex;align-items:center;gap:12px;padding:12px;border-radius:12px;transition:background-color .15s}
.acceso:hover{background:var(--marca-50)}
.acceso b{display:block;font-size:.875rem;color:var(--marca-900)}
.acceso small{display:block;font-size:.72rem;color:#64748b}

/* ---------- Tarjetas ---------- */
.tarjeta{background:#fff;border:1px solid var(--borde);border-radius:var(--radio);box-shadow:var(--sombra);display:block}
.tarjeta.bloque{padding:28px}
.tarjeta.horizontal{display:flex;gap:16px;padding:16px;align-items:flex-start}
.tarjeta.horizontal img{width:112px;height:96px;object-fit:cover;border-radius:12px;flex:none}
.tarjeta.horizontal>span{display:flex;flex-direction:column;gap:8px}
.tarjeta.horizontal b{font-size:.9rem;color:var(--marca-900);line-height:1.35}
.tarjeta.horizontal.compacta{padding:16px}
.tarjeta.vertical{display:flex;flex-direction:column;gap:10px;padding:20px;transition:transform .18s,border-color .18s}
.tarjeta.vertical:hover{transform:translateY(-4px);border-color:var(--marca-300)}
.tarjeta.con-imagen{overflow:hidden;display:block}
.tarjeta.con-imagen:hover .marco-imagen img{transform:scale(1.06)}
.tarjeta-cuerpo{padding:20px;display:flex;flex-direction:column;gap:10px}
.tarjeta-pie{display:flex;align-items:center;justify-content:space-between;gap:8px;border-top:1px solid #f1f5f9;padding-top:12px;margin-top:auto;font-size:.75rem;color:#64748b}
.tarjeta.oscura{background:linear-gradient(135deg,var(--marca-800),var(--tinta));color:#fff;border:0;padding:24px;display:flex;flex-direction:column;gap:12px}
.tarjeta.oscura .atenue{color:var(--marca-200)}
.tarjeta.acento-suave{background:var(--marca-50);border-color:var(--marca-100)}
.tarjeta.estrecha{max-width:440px;margin:0 auto}
.tarjeta.centrada{margin:0 auto}
.centrado{display:flex;flex-direction:column;align-items:center;gap:12px}

.marco-imagen{position:relative;display:block;height:160px;overflow:hidden}
.marco-imagen img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.marco-imagen .chip{position:absolute;left:16px;bottom:12px}
.marco-imagen.alta{height:224px}
.marco-imagen.media{height:176px}
.marco-imagen.baja{height:128px}
.imagen-articulo{width:100%;height:288px;object-fit:cover}
.marco-imagen .chip{top:16px;bottom:auto}

.rejilla-2{display:grid;gap:16px}
.rejilla-3{display:grid;gap:20px;margin-top:32px}
.rejilla-4{display:grid;gap:16px}
@media(min-width:640px){.rejilla-2,.rejilla-4{grid-template-columns:1fr 1fr}.rejilla-3{grid-template-columns:1fr 1fr}}
@media(min-width:1024px){.rejilla-3{grid-template-columns:repeat(3,1fr)}.rejilla-4{grid-template-columns:repeat(4,1fr)}}
.rejilla-asimetrica{display:grid;gap:32px}
@media(min-width:1024px){.rejilla-asimetrica{grid-template-columns:1.25fr .75fr}}
.rejilla-detalle{display:grid;gap:32px}
@media(min-width:1024px){.rejilla-detalle{grid-template-columns:1.35fr .65fr}}
.rejilla-asimetrica .pila,.pila{display:flex;flex-direction:column;gap:16px}
.rejilla-noticia{display:grid;gap:0}
@media(min-width:1024px){.rejilla-noticia{grid-template-columns:1fr 1fr}}

.fila-cabecera{display:flex;flex-direction:column;gap:16px;justify-content:space-between}
@media(min-width:768px){.fila-cabecera{flex-direction:row;align-items:flex-end}}
.fila-cabecera.compacta{align-items:flex-end;margin-bottom:24px}
.fila-entre{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.fila-usuario{display:flex;align-items:center;gap:16px}
.iniciales{width:64px;height:64px;border-radius:16px;background:rgba(255,255,255,.1);color:var(--dorado);display:grid;place-items:center;font-size:1.5rem;font-weight:900;flex:none}
.fila-mini-kpi{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.mini-kpi{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.15);border-radius:16px;padding:10px 18px;text-align:center;color:#fff}
.mini-kpi b{display:block;font-size:1.5rem;font-weight:900}
.mini-kpi small{font-size:.62rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:var(--marca-200)}

.icono-cuadro{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;flex:none}
.icono-cuadro.oscuro{background:var(--marca-900);color:var(--dorado)}
.icono-cuadro.suave{background:var(--marca-50);color:var(--marca-600)}

.animar{animation:aparecer .6s cubic-bezier(.22,1,.36,1) both}
@keyframes aparecer{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}

/* ---------- Formularios ---------- */
.campo{display:flex;flex-direction:column;gap:6px;margin-bottom:14px}
.campo label{font-size:.7rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:#40536f}
.campo input,.campo select,.campo textarea{width:100%;border-radius:10px;border:1px solid var(--borde-fuerte);background:#fff;padding:11px 14px;font-size:.92rem;transition:border-color .15s,box-shadow .15s}
.campo textarea{resize:vertical}
.campo input:focus,.campo select:focus,.campo textarea:focus{border-color:var(--marca-500);box-shadow:0 0 0 4px rgba(42,99,227,.15);outline:none}
.campo.completa{grid-column:1/-1}
.pista{font-size:.75rem;color:#94a3b8;margin-top:12px}
.caja-suave{background:var(--marca-50);border-radius:12px;padding:12px;color:#33415c}
.caja-aviso{background:rgba(245,165,36,.14);border-radius:12px;padding:12px;font-size:.9rem;font-weight:700;margin:12px 0}
.aviso-form{font-size:.85rem;font-weight:700;min-height:0;margin-top:10px}
.aviso-form.ok{color:var(--verde)}.aviso-form.error{color:var(--rojo)}
.aviso-error{background:#fee9ec;color:var(--rojo);border-radius:12px;padding:12px;font-size:.85rem;font-weight:700;margin-top:16px}
.aviso-error.visible{display:block}
.aviso-caja{background:rgba(245,165,36,.14);border-radius:12px;padding:14px;margin:16px 0}

.buscador-inline{display:flex;align-items:center;gap:8px;border:1px solid var(--marca-100);background:var(--marca-50);border-radius:999px;padding:10px 16px;flex:1;min-width:200px}
.buscador-inline input{border:0;background:transparent;outline:none;width:100%;font-size:.9rem}
.filtros{padding:20px}
.filtros-fila{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.filtros-fila select,.filtros-fila .campo{min-width:170px}
.filtros-fila.tres{align-items:flex-end}
.casilla{display:inline-flex;align-items:center;gap:8px;font-size:.85rem;font-weight:700;color:#475569;cursor:pointer}
.casilla input{width:16px;height:16px;accent-color:var(--marca-700)}

.formulario-consulta{height:fit-content}
.panel-resultado{min-height:280px;display:flex}
.panel-vacio{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;text-align:center;color:#64748b;font-size:.9rem;padding:24px;flex:1}
.rejilla-consulta{display:grid;gap:24px}
@media(min-width:1024px){.rejilla-consulta{grid-template-columns:.85fr 1.15fr}}

.gauge{position:relative;width:160px;height:160px}
.gauge svg{width:100%;height:100%;transform:rotate(-90deg)}
.gauge-valor{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center}
.gauge-valor b{font-size:2.4rem;font-weight:900;line-height:1}
.gauge-valor small{font-size:.62rem;font-weight:800;text-transform:uppercase;letter-spacing:.14em;color:#94a3b8}

/* ---------- Tablas ---------- */
.tabla-envoltura{overflow-x:auto;margin-top:16px;border:1px solid var(--borde);border-radius:16px;background:#fff}
.tabla{width:100%;border-collapse:collapse;font-size:.9rem}
.tabla th{text-align:left;padding:12px 16px;background:#f8fafc;font-size:.65rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:#64748b}
.tabla td{padding:12px 16px;border-top:1px solid #f1f5f9;color:#33415c;vertical-align:middle}
.tabla .derecha{text-align:right}
.lista-definicion div{border-bottom:1px solid #f1f5f9;padding-bottom:10px;margin-bottom:10px}
.lista-definicion dt{font-size:.65rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:#94a3b8}
.lista-definicion dd{margin:2px 0 0;color:#33415c;font-size:.9rem}

.lista-puntos{display:flex;flex-direction:column;gap:8px;margin-top:12px;font-size:.9rem;color:#475569}
.lista-puntos li{position:relative;padding-left:16px}
.lista-puntos li::before{content:'';position:absolute;left:0;top:.6em;width:6px;height:6px;border-radius:999px}
.lista-puntos.verde li::before{background:var(--verde)}
.lista-puntos.azul li::before{background:var(--marca-500)}
.lista-puntos.con-texto{margin-top:16px;margin-bottom:20px}
.lista-flechas a,.lista-iconos li{display:flex;align-items:flex-start;gap:8px;font-size:.9rem;color:#475569}
.lista-flechas li{margin-bottom:10px}
.lista-flechas a:hover{color:var(--marca-600)}
.lista-iconos{display:flex;flex-direction:column;gap:8px;margin:12px 0}
.lista-rapida{display:flex;flex-direction:column;gap:8px;margin-top:12px}
.lista-rapida a{display:flex;align-items:center;justify-content:space-between;background:rgba(255,255,255,.1);color:#fff;padding:8px 12px;border-radius:12px;font-size:.875rem}
.lista-rapida a:hover{background:rgba(255,255,255,.2)}

/* ---------- Detalle de trámite ---------- */
.cabecera-tramite{position:relative;overflow:hidden;color:#fff}
.cabecera-tramite-fondo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.35}
.cabecera-tramite-velo{position:relative;background:linear-gradient(90deg,var(--tinta),rgba(5,20,43,.9) 50%,rgba(7,29,79,.55));padding:64px 0}
.datos-tramite{margin-top:32px}
.columna-principal{display:flex;flex-direction:column;gap:32px}
.columna-principal .rejilla-2{gap:20px}
.columna-lateral{display:flex;flex-direction:column;gap:20px}
.texto-largo p{margin-bottom:16px;line-height:1.8;color:#33415c}
.entradilla{font-size:1.05rem;font-weight:600;color:var(--marca-900);line-height:1.7}
.lista-pasos{display:flex;flex-direction:column;gap:18px;margin-top:20px}
.lista-pasos li{display:flex;gap:16px}
.numero-paso{width:36px;height:36px;border-radius:999px;background:var(--marca-700);color:#fff;display:grid;place-items:center;font-size:.85rem;font-weight:900;flex:none}
.lista-pasos b{display:block;color:var(--tinta)}
.lista-pasos p{margin-top:4px}

/* ---------- Asistente de cita previa ---------- */
.pasos{display:flex;gap:4px;overflow-x:auto;background:#f8fafc;border-bottom:1px solid var(--borde);padding:12px 16px;border-radius:var(--radio) var(--radio) 0 0}
.paso{display:flex;align-items:center;gap:8px;min-width:max-content;padding:0 8px}
.paso span{width:28px;height:28px;border-radius:999px;background:#fff;color:#94a3b8;display:grid;place-items:center;font-size:.72rem;font-weight:900;box-shadow:inset 0 0 0 1px #e2e8f0}
.paso b{font-size:.7rem;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:#94a3b8}
.paso.activo span{background:var(--marca-700);color:#fff;box-shadow:none}
.paso.activo b{color:var(--marca-800)}
.cuerpo-asistente{padding:24px}
.opciones{margin-top:20px}
.opcion{display:flex;flex-direction:column;align-items:flex-start;gap:6px;text-align:left;background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:14px;cursor:pointer;transition:border-color .15s,background-color .15s,box-shadow .15s}
.opcion:hover{border-color:var(--marca-300)}
.opcion.activa{border-color:var(--marca-500);background:var(--marca-50);box-shadow:0 0 0 3px rgba(42,99,227,.18)}
.opcion b{font-size:.875rem;color:var(--marca-900)}
.opcion small{font-size:.75rem;color:#64748b}
.opcion .ic{color:#94a3b8}
.opcion.activa .ic{color:var(--marca-600)}
.fila-dias{display:flex;gap:8px;overflow-x:auto;padding-bottom:8px;margin-top:20px}
.dia{min-width:92px;border:1px solid #e2e8f0;background:#fff;border-radius:12px;padding:10px;text-align:center;cursor:pointer;transition:background-color .15s,border-color .15s,color .15s}
.dia small{display:block;font-size:.65rem;text-transform:uppercase;letter-spacing:.06em;opacity:.8}
.dia b{display:block;font-size:1.1rem;font-weight:900}
.dia:hover{border-color:var(--marca-300)}
.dia.activo,.dia.seleccionado{background:var(--marca-700);border-color:var(--marca-700);color:#fff}
.rejilla-horas{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:8px}
@media(min-width:640px){.rejilla-horas{grid-template-columns:repeat(6,1fr)}}
.hora{border:1px solid #e2e8f0;background:#fff;border-radius:10px;padding:8px 4px;font-size:.85rem;font-weight:800;color:#475569;cursor:pointer;transition:background-color .15s,border-color .15s,color .15s}
.hora:hover:not(:disabled){border-color:var(--marca-400)}
.hora.activa{background:var(--marca-700);border-color:var(--marca-700);color:#fff}
.hora:disabled{background:#f1f5f9;border-color:#f1f5f9;color:#cbd5e1;text-decoration:line-through;cursor:not-allowed}
.chip.seleccionada{background:var(--marca-700);color:#fff}
.pie-asistente{display:flex;align-items:center;justify-content:space-between;gap:12px;border-top:1px solid #f1f5f9;padding-top:20px;margin-top:24px}
.resumen-lista li{margin-bottom:12px}
.resumen-lista small{display:block;color:var(--marca-200);font-size:.75rem}
.resumen-lista b{color:#fff;font-size:.875rem}

.tarjeta-resultado-examen{border-radius:16px;padding:24px;color:#fff}
.tarjeta-resultado-examen small{display:block;font-size:.68rem;font-weight:800;text-transform:uppercase;letter-spacing:.2em;opacity:.85}
.tarjeta-resultado-examen b{display:block;font-size:2.4rem;font-weight:900;margin-top:8px}
.tarjeta-resultado-examen p{font-size:.85rem;opacity:.92;margin-top:8px}

/* ---------- Noticias y paneles ---------- */
.seccion .tarjeta.horizontal img{width:112px;height:96px}
.mini-fecha{color:#94a3b8}
.mini-fecha.claro{color:var(--marca-200)}
.panorama{position:relative;overflow:hidden;border-radius:24px}
.panorama img{height:340px;width:100%;object-fit:cover}
.panorama-velo{position:absolute;inset:0;background:linear-gradient(90deg,var(--tinta),rgba(5,20,43,.85) 45%,transparent)}
.panorama-texto{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;padding:0 16px;color:#fff}
@media(min-width:768px){.panorama-texto{padding:0 48px}}
.panorama-texto .ancho-lg{max-width:38rem;color:var(--marca-100)}

.tarjeta-cifra{border:1px solid rgba(255,255,255,.15);background:rgba(255,255,255,.07);border-radius:16px;padding:20px;transition:border-color .2s}
.tarjeta-cifra:hover{border-color:rgba(245,165,36,.5)}
.cifra{font-size:1.9rem;font-weight:900;color:#fff;line-height:1.1}
@media(min-width:768px){.cifra{font-size:2.2rem}}
.cifra-etiqueta{font-size:.8rem;font-weight:800;color:var(--dorado);margin-top:6px}
.cifra-nota{font-size:.72rem;color:var(--marca-200);margin-top:4px;line-height:1.6}

/* ---------- Área personal y admin ---------- */
.fila-sancion{display:flex;align-items:center;justify-content:space-between;gap:12px;border:1px solid #e2e8f0;border-radius:12px;padding:14px;margin-bottom:10px;flex-wrap:wrap}
.fila-sancion.vertical{flex-direction:column;align-items:stretch}
.fila-sancion b{display:block;font-size:.9rem;color:var(--tinta)}
.fila-sancion small{display:block}
.importe{font-size:1.1rem;font-weight:900;display:block}
.derecha-texto{text-align:right}
.kpi{display:flex;flex-direction:column;gap:6px}
.kpi-valor{font-size:1.6rem;font-weight:900;color:var(--tinta)}
.fila-barra{margin-bottom:14px}
.barra{height:8px;background:#f1f5f9;border-radius:999px;overflow:hidden;margin-top:6px}
.barra span{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,var(--marca-500),var(--marca-800));min-width:6%}
.sin-resultados{margin-top:24px;padding:40px;text-align:center;color:#64748b;background:#fff;border:1px dashed var(--borde-fuerte);border-radius:16px}
.sin-resultados[hidden]{display:none}

/* ---------- Pestañas ---------- */
.pestanas{display:flex;gap:4px;background:#f1f5f9;border-radius:999px;padding:4px;margin-bottom:20px}
.pestana{flex:1;border:0;background:transparent;border-radius:999px;padding:9px;font-size:.85rem;font-weight:800;color:#64748b;cursor:pointer;transition:background-color .15s,color .15s}
.pestana.activa{background:var(--marca-700);color:#fff;box-shadow:0 4px 12px -6px rgba(15,56,152,.7)}
.panel-pestana.activo{display:block}

/* ---------- Pie ---------- */
.pie{margin-top:80px;background:var(--tinta);color:var(--marca-100)}
.boletin{border-bottom:1px solid rgba(255,255,255,.1);background:rgba(10,42,114,.6)}
.boletin-fila{display:grid;gap:28px;padding:40px 16px}
@media(min-width:1024px){.boletin-fila{grid-template-columns:1.1fr 1fr;align-items:center;padding:40px 32px}}
.boletin h3{font-size:1.4rem;font-weight:900;color:#fff;margin-top:8px}
.boletin-form{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.boletin-form input{flex:1;min-width:220px;border-radius:999px;border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.1);color:#fff;padding:11px 18px;font-size:.9rem;outline:none}
.boletin-form input::placeholder{color:var(--marca-200)}
.boletin-form input:focus{border-color:var(--dorado)}
.boletin-form .aviso-form{width:100%;color:var(--marca-200)}
.boletin-form .aviso-form.ok{color:#6ee7b7}.boletin-form .aviso-form.error{color:#fca5a5}
.pie-fila{display:grid;gap:40px;padding:48px 16px}
@media(min-width:1024px){.pie-fila{grid-template-columns:1.2fr repeat(3,1fr);padding:48px 32px}}
.pie-marca{display:flex;flex-direction:column;gap:16px}
.pie h4{font-size:.8rem;font-weight:900;text-transform:uppercase;letter-spacing:.08em;color:#fff;margin-bottom:16px}
.pie ul{display:flex;flex-direction:column;gap:10px}
.pie ul a{font-size:.875rem;color:var(--marca-200)}
.pie ul a:hover{color:var(--dorado)}
.pie-legal{border-top:1px solid rgba(255,255,255,.1);background:rgba(10,42,114,.7)}
.pie-legal-fila{display:flex;flex-direction:column;gap:12px;padding:20px 16px;font-size:.75rem;color:var(--marca-200)}
@media(min-width:768px){.pie-legal-fila{flex-direction:row;align-items:center;justify-content:space-between;padding:20px 32px}}
.pie-legal a{margin-right:16px}
.pie-legal a:hover{color:#fff}

/* =====================================================================
   Botón flotante de WhatsApp
   ===================================================================== */
.wa-flotante{position:fixed;right:20px;bottom:20px;z-index:95;display:flex;flex-direction:column;align-items:flex-end;gap:12px}
.wa-tarjeta{width:290px;background:#fff;border:1px solid var(--borde);border-radius:18px;overflow:hidden;box-shadow:0 24px 48px -20px rgba(5,20,43,.45);animation:aparecer .35s cubic-bezier(.22,1,.36,1) both}
.wa-cabecera{display:flex;align-items:center;gap:12px;background:#075E54;color:#fff;padding:12px 16px}
.wa-avatar{width:40px;height:40px;border-radius:999px;background:rgba(255,255,255,.15);display:grid;place-items:center;flex:none}
.wa-titulo{display:flex;flex-direction:column;line-height:1.2}
.wa-titulo b{font-size:.875rem}
.wa-titulo small{font-size:.68rem;color:#a7f3d0}
.wa-cerrar{margin-left:auto;border:0;background:transparent;color:#a7f3d0;cursor:pointer;display:grid;place-items:center}
.wa-cerrar:hover{color:#fff}
.wa-cuerpo{padding:16px}
.wa-cuerpo p{font-size:.875rem;color:#475569;line-height:1.6;margin:0}
.wa-boton{display:flex;align-items:center;justify-content:center;gap:8px;background:#25D366;color:#fff;border-radius:999px;padding:12px;font-size:.875rem;font-weight:800;margin-top:14px;text-decoration:none}
.wa-boton:hover{background:#1da851}
.wa-datos{display:flex;flex-direction:column;gap:6px;margin:14px 0 0;padding-top:12px;border-top:1px solid #f1f5f9;font-size:.75rem;color:#64748b;list-style:none}
.wa-datos a{text-decoration:none;color:#33415c}
.wa-datos a:hover{color:var(--marca-600)}
.wa-boton-flotante{width:56px;height:56px;border-radius:999px;background:#25D366;color:#fff;display:grid;place-items:center;box-shadow:0 10px 30px -8px rgba(37,211,102,.7);transition:transform .18s,background-color .18s}
.wa-boton-flotante:hover{transform:scale(1.06);background:#1da851}
.wa-enlace-pie{display:inline-flex;width:fit-content;align-items:center;gap:8px;margin-top:8px;background:#25D366;color:#fff;border-radius:999px;padding:8px 14px;font-size:.875rem;font-weight:800}
.wa-enlace-pie:hover{background:#1da851;color:#fff}
@media(max-width:640px){.wa-flotante{right:14px;bottom:14px}.wa-tarjeta{width:calc(100vw - 28px)}}
.wa-tarjeta-lateral{background:#25D366;border:0;transition:background-color .15s}
.wa-tarjeta-lateral:hover{background:#1da851}
.wa-tarjeta-lateral small{display:block}
#registro-confirmado .ic-xxl{color:#fff}

/* Registro 2.1 · confirmation serveur et erreurs accessibles. */
.registro-error-campo{display:block;color:#b91c3b;font-size:.78rem;font-weight:600;margin-top:4px}
#formulario-registro [aria-invalid="true"]{border-color:#d81b3c;box-shadow:0 0 0 3px rgba(216,27,60,.1)}
.registro-confirmacion{overflow:hidden;scroll-margin-top:150px}
.registro-confirmacion-cabecera{background:linear-gradient(135deg,#10b981,#0f9d76);color:#fff;padding:32px}
.registro-confirmacion-cabecera .ic-xxl{color:#fff}
.registro-confirmacion-cabecera h3{font-size:1.6rem;font-weight:900;margin-top:12px}
.registro-confirmacion-cabecera p{opacity:.94;margin-top:6px;line-height:1.6}
#reg-enviar[disabled]{opacity:.65;cursor:wait}