/* =========================================================
   HASTA LA ÚLTIMA VEREDA — estilos
   Paleta tomada del logo: azul profundo, verde monte, sol.
   ========================================================= */
:root{
  --azul:#153B6B;
  --azul-osc:#0D2747;
  --azul-claro:#E8EFF8;
  --verde:#4F8F3A;
  --verde-osc:#3B6F2A;
  --verde-claro:#EAF3E4;
  --sol:#F2B233;
  --sol-claro:#FEF4E0;
  --rojo:#C0392B;
  --rojo-claro:#FBEAE7;
  --tinta:#122234;
  --gris:#5D6E7E;
  --gris-claro:#EDF1F4;
  --linea:#DCE4EA;
  --blanco:#FFFFFF;
  --crema:#F6F9FB;
  --sombra:0 2px 4px rgba(18,34,52,.04), 0 12px 32px rgba(18,34,52,.07);
  --sombra-alta:0 18px 50px rgba(18,34,52,.16);
  --r-s:12px; --r-m:18px; --r-l:28px; --r-full:999px;
  --contenedor:1220px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0; background:var(--blanco); color:var(--tinta);
  font-family:'Montserrat',system-ui,-apple-system,'Segoe UI',sans-serif;
  font-size:18px; line-height:1.65; -webkit-font-smoothing:antialiased;
}
img{max-width:100%; display:block}
a{color:var(--azul); text-decoration:none}
button{font-family:inherit; cursor:pointer}
:focus-visible{outline:3px solid var(--sol); outline-offset:3px; border-radius:6px}
.contenedor{width:100%; max-width:var(--contenedor); margin:0 auto; padding:0 22px}

h1,h2,h3,h4{font-weight:800; letter-spacing:-.02em; line-height:1.12; margin:0 0 14px}
h1{font-size:clamp(34px,5.6vw,66px); letter-spacing:-.035em}
h2{font-size:clamp(28px,3.8vw,46px)}
h3{font-size:clamp(20px,2.2vw,26px)}
p{margin:0 0 16px}
.plomo{font-size:clamp(17.5px,1.5vw,21px); color:var(--gris); font-weight:500}
.etiqueta{
  display:inline-flex; align-items:center; gap:9px; font-size:14px; font-weight:700;
  letter-spacing:.16em; text-transform:uppercase; color:var(--verde-osc);
  background:var(--verde-claro); padding:8px 16px; border-radius:var(--r-full); margin-bottom:18px;
}
.etiqueta.sol{color:#8A5B00; background:var(--sol-claro)}
.etiqueta.claro{color:var(--blanco); background:rgba(255,255,255,.16); backdrop-filter:blur(6px)}

/* ---------- botones ---------- */
/* botones */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  border:2px solid transparent; border-radius:var(--r-full);
  padding:17px 30px; font-size:17px; font-weight:800; letter-spacing:-.01em;
  transition:transform .18s cubic-bezier(.2,.8,.3,1), box-shadow .18s, background .18s, color .18s;
  text-align:center;
}
.btn:hover{transform:translateY(-2px)}
.btn:active{transform:translateY(0)}
.btn-sol{background:var(--sol); color:#3B2B00; box-shadow:0 10px 26px rgba(242,178,51,.4)}
.btn-sol:hover{background:#FFC24D}
.btn-azul{background:var(--azul); color:#fff; box-shadow:0 10px 26px rgba(21,59,107,.28)}
.btn-azul:hover{background:var(--azul-osc)}
.btn-verde{background:var(--verde); color:#fff; box-shadow:0 10px 26px rgba(79,143,58,.3)}
.btn-borde{border-color:var(--azul); color:var(--azul); background:transparent}
.btn-borde:hover{background:var(--azul); color:#fff}
.btn-blanco{background:#fff; color:var(--azul)}
.btn-fantasma{border-color:rgba(255,255,255,.55); color:#fff}
.btn-fantasma:hover{background:#fff; color:var(--azul); border-color:#fff}
.btn-bloque{width:100%}
.btn-chico{padding:12px 20px; font-size:15px}
.btn + .btn{margin-left:10px}
@media (max-width:640px){ .btn + .btn{margin-left:0; margin-top:10px} .portada-botones .btn + .btn, .barra-movil .btn + .btn{margin-top:0} }
.btn-mini{
  display:inline-flex; align-items:center; gap:7px; border:1.5px solid var(--linea); background:#fff; color:var(--tinta);
  border-radius:var(--r-full); padding:10px 17px; font-size:15px; font-weight:700; text-decoration:none;
  transition:border-color .15s, background .15s, color .15s;
}
.btn-mini:hover{border-color:var(--azul); color:var(--azul)}
.btn-mini.verde:hover{border-color:var(--verde); color:var(--verde)}
.btn-mini.rojo:hover{border-color:var(--rojo); color:var(--rojo)}

/* ---------- encabezado ---------- */
.cabecera{
  position:sticky; top:0; z-index:60; background:rgba(255,255,255,.92);
  backdrop-filter:saturate(180%) blur(14px); border-bottom:1px solid var(--linea);
  transition:box-shadow .2s;
}
.cabecera{position:sticky}
.cabecera-in{position:relative}
.cabecera.flota{box-shadow:0 6px 24px rgba(18,34,52,.08)}
.cabecera-in{display:flex; align-items:center; justify-content:space-between; gap:20px; padding:12px 0}
.logo img{height:52px; width:auto}
.menu{display:flex; align-items:center; gap:30px}
.menu a{font-size:16.5px; font-weight:700; color:var(--tinta); opacity:.8}
.menu a:hover{opacity:1; color:var(--azul)}
.cab-acciones{display:flex; align-items:center; gap:12px}
.hamburguesa{display:none; border:none; background:var(--gris-claro); border-radius:var(--r-s); padding:12px; line-height:0}
.hamburguesa span{display:block; width:20px; height:2px; background:var(--tinta); border-radius:2px}
.hamburguesa span+span{margin-top:5px}

/* ---------- barra en vivo ---------- */
.envivo{background:var(--azul-osc); color:#fff; font-size:15px; font-weight:600; overflow:hidden}
.envivo-in{display:flex; align-items:center; gap:16px; padding:10px 0}
.pulso{display:inline-flex; align-items:center; gap:8px; white-space:nowrap; font-weight:800; letter-spacing:.1em; text-transform:uppercase; font-size:13px; color:var(--sol)}
.punto{width:9px; height:9px; border-radius:50%; background:var(--sol); box-shadow:0 0 0 0 rgba(242,178,51,.7); animation:latido 2s infinite}
@keyframes latido{70%{box-shadow:0 0 0 12px rgba(242,178,51,0)} 100%{box-shadow:0 0 0 0 rgba(242,178,51,0)}}
.envivo-texto{flex:1; min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; opacity:.92}
.envivo-texto b{color:var(--sol)}

/* ---------- portada ---------- */
.portada{position:relative; color:#fff; overflow:hidden; isolation:isolate}
.portada picture, .portada img.fondo{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-2}
.portada::after{
  content:""; position:absolute; inset:0; z-index:-1;
  background:linear-gradient(100deg, rgba(13,39,71,.94) 0%, rgba(13,39,71,.82) 44%, rgba(13,39,71,.30) 100%);
}
.portada-in{padding:96px 0 104px; max-width:820px}
.portada h1{color:#fff; margin-bottom:22px}
.portada h1 span{color:var(--sol)}
.portada p{font-size:clamp(17px,1.7vw,21px); color:rgba(255,255,255,.9); max-width:60ch; font-weight:500}
.portada-botones{display:flex; gap:14px; flex-wrap:wrap; margin-top:34px}
.portada-nota{display:flex; align-items:center; gap:10px; margin-top:30px; font-size:14.5px; color:rgba(255,255,255,.78); font-weight:600}

/* ---------- tarjetas de cifras ---------- */
.cifras{margin-top:-58px; position:relative; z-index:5}
.cifras-caja{
  background:#fff; border-radius:var(--r-l); box-shadow:var(--sombra-alta);
  padding:32px 20px; display:grid; grid-template-columns:repeat(5,1fr); gap:14px;
}
.cifra{text-align:center; padding:8px 10px; border-right:1px solid var(--linea)}
.cifra:last-child{border-right:none}
.cifra b{display:block; font-size:clamp(30px,3.6vw,46px); font-weight:800; letter-spacing:-.04em; line-height:1; font-variant-numeric:tabular-nums; color:var(--azul)}
.cifra.verde b{color:var(--verde)}
.cifra.sol b{color:#D89400}
.cifra span{display:block; margin-top:8px; font-size:12.5px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--gris)}

/* ---------- secciones ---------- */
.seccion{padding:88px 0}
.seccion.crema{background:var(--crema)}
.seccion-cab{max-width:720px; margin-bottom:44px}
.seccion-cab.centro{margin-left:auto; margin-right:auto; text-align:center}

.pasos{display:grid; grid-template-columns:repeat(3,1fr); gap:24px}
.paso-tarjeta{background:#fff; border:1px solid var(--linea); border-radius:var(--r-l); padding:36px 32px; box-shadow:var(--sombra); position:relative; overflow:hidden}
.paso-tarjeta .num{
  width:52px; height:52px; border-radius:var(--r-full); display:grid; place-items:center;
  background:var(--azul-claro); color:var(--azul); font-weight:800; font-size:20px; margin-bottom:20px;
}
.paso-tarjeta:nth-child(2) .num{background:var(--sol-claro); color:#B07908}
.paso-tarjeta:nth-child(3) .num{background:var(--verde-claro); color:var(--verde-osc)}
.paso-tarjeta h3{margin-bottom:10px}
.paso-tarjeta p{color:var(--gris); font-size:16.5px; margin:0}

/* ---------- bloque imagen + texto ---------- */
.duo{display:grid; grid-template-columns:1.05fr 1fr; gap:56px; align-items:center}
.duo-foto{border-radius:var(--r-l); overflow:hidden; box-shadow:var(--sombra-alta); position:relative}
.duo-foto img{width:100%; height:100%; object-fit:cover; aspect-ratio:16/11}
.duo-sello{
  position:absolute; left:22px; bottom:22px; background:rgba(255,255,255,.95);
  border-radius:var(--r-m); padding:14px 18px; box-shadow:var(--sombra); font-size:14px; font-weight:700;
}
.duo-sello b{display:block; font-size:26px; color:var(--verde); letter-spacing:-.03em}
.lista-check{list-style:none; padding:0; margin:0}
.lista-check li{display:flex; gap:14px; align-items:flex-start; margin-bottom:18px; font-size:17px; color:var(--gris); font-weight:500}
.lista-check .tic{
  flex:none; width:26px; height:26px; border-radius:50%; background:var(--verde-claro); color:var(--verde-osc);
  display:grid; place-items:center; font-size:14px; font-weight:900; margin-top:2px;
}
.lista-check b{color:var(--tinta)}

/* ---------- banner ancho ---------- */
.banner{position:relative; color:#fff; overflow:hidden; isolation:isolate}
.banner img.fondo{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-2}
.banner::after{content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(90deg, rgba(13,39,71,.9), rgba(13,39,71,.55))}
.banner-in{padding:84px 0; max-width:700px}
.banner h2{color:#fff}
.banner p{color:rgba(255,255,255,.88)}

/* ---------- filtros y tablero ---------- */
.barra-tablero{display:flex; gap:14px; justify-content:space-between; align-items:center; flex-wrap:wrap; margin-bottom:26px}
.pastillas{display:flex; gap:9px; flex-wrap:wrap}
.pastilla{
  border:1.5px solid var(--linea); background:#fff; color:var(--gris); border-radius:var(--r-full);
  padding:12px 22px; font-size:16px; font-weight:700; transition:all .16s;
}
.pastilla:hover{border-color:var(--azul); color:var(--azul)}
.pastilla[aria-pressed="true"]{background:var(--azul); border-color:var(--azul); color:#fff}
.buscar{position:relative; flex:1 1 260px; max-width:360px}
.buscar input{
  width:100%; border:1.5px solid var(--linea); border-radius:var(--r-full);
  padding:14px 20px 14px 50px; font-size:16.5px; font-family:inherit; background:#fff; color:var(--tinta);
}
.buscar input:focus{border-color:var(--azul); outline:none}
.buscar svg{position:absolute; left:17px; top:50%; transform:translateY(-50%); opacity:.45}

.rejilla{display:grid; grid-template-columns:repeat(auto-fill,minmax(340px,1fr)); gap:24px}
.zona{
  background:#fff; border:1px solid var(--linea); border-radius:var(--r-l); padding:26px;
  box-shadow:var(--sombra); display:flex; flex-direction:column; gap:16px; position:relative; overflow:hidden;
  animation:aparece .5s cubic-bezier(.2,.8,.3,1) both;
}
@keyframes aparece{from{opacity:0; transform:translateY(16px)} to{opacity:1; transform:none}}
.zona::before{content:""; position:absolute; left:0; top:0; height:5px; width:100%; background:var(--linea)}
.zona[data-estado="por_verificar"]::before{background:var(--sol)}
.zona[data-estado="verificada"]::before{background:var(--verde)}
.zona[data-estado="en_ruta"]::before{background:linear-gradient(90deg,var(--verde),var(--azul))}
.zona[data-estado="entregada"]::before{background:var(--azul)}
.zona[data-estado="descartada"]{opacity:.6}
.zona-cab{display:flex; justify-content:space-between; align-items:flex-start; gap:14px}
.folio{font-size:12px; font-weight:800; letter-spacing:.12em; color:var(--gris); text-transform:uppercase}
.zona h3{margin:4px 0 2px; font-size:23px}
.zona-lugar{font-size:14px; color:var(--gris); font-weight:600}
.estado{
  flex:none; display:inline-flex; align-items:center; gap:7px; border-radius:var(--r-full);
  padding:8px 14px; font-size:12.5px; font-weight:800; letter-spacing:.02em; white-space:nowrap;
}
.estado::before{content:""; width:8px; height:8px; border-radius:50%; background:currentColor}
.est-por_verificar{background:var(--sol-claro); color:#9A6B00}
.est-verificada{background:var(--verde-claro); color:var(--verde-osc)}
.est-en_ruta{background:#E4F2FF; color:#1465A8}
.est-entregada{background:var(--azul-claro); color:var(--azul)}
.est-descartada{background:var(--gris-claro); color:var(--gris)}

.censo{display:grid; grid-template-columns:repeat(3,1fr); background:var(--crema); border-radius:var(--r-m); padding:16px 8px}
.censo div{text-align:center; border-right:1px solid var(--linea)}
.censo div:last-child{border-right:none}
.censo b{display:block; font-size:25px; font-weight:800; letter-spacing:-.03em; color:var(--azul); line-height:1.1}
.censo span{font-size:11.5px; font-weight:700; text-transform:uppercase; letter-spacing:.05em; color:var(--gris)}
.necesidades{display:flex; flex-wrap:wrap; gap:8px}
.nec{background:var(--gris-claro); border-radius:var(--r-full); padding:9px 16px; font-size:15px; font-weight:600; color:#44586A}
.especial{display:flex; gap:11px; align-items:flex-start; background:var(--rojo-claro); border-left:4px solid var(--rojo); border-radius:0 var(--r-m) var(--r-m) 0; padding:15px 18px; font-size:16px; font-weight:600; color:#7C2B20; margin:0}
.zona-pie{margin-top:auto; padding-top:16px; border-top:1px solid var(--linea); display:flex; justify-content:space-between; align-items:center; gap:10px; font-size:14.5px; color:var(--gris); font-weight:600; flex-wrap:wrap}
.con-video{display:inline-flex; align-items:center; gap:6px; color:var(--verde-osc)}
.admin-caja{border-top:1px dashed var(--linea); padding-top:16px; display:flex; flex-direction:column; gap:12px}
.admin-datos{font-size:14px; line-height:1.9; color:var(--gris); word-break:break-word}
.admin-datos i{font-style:normal; font-weight:800; color:var(--tinta); display:inline-block; min-width:78px}
.admin-botones{display:flex; gap:8px; flex-wrap:wrap}
.vacio{grid-column:1/-1; text-align:center; padding:64px 24px; border:2px dashed var(--linea); border-radius:var(--r-l); color:var(--gris)}
.vacio b{display:block; font-size:21px; color:var(--tinta); margin-bottom:8px}
.cargando{grid-column:1/-1; text-align:center; padding:60px; color:var(--gris); font-weight:600}

/* ---------- necesidades más pedidas ---------- */
.top-nec{display:flex; flex-wrap:wrap; gap:12px; margin-top:8px}
.top-nec span{
  background:#fff; border:1.5px solid var(--linea); border-radius:var(--r-full);
  padding:11px 18px; font-size:14.5px; font-weight:700; display:inline-flex; gap:10px; align-items:center;
}
.top-nec b{background:var(--sol-claro); color:#8A5B00; border-radius:var(--r-full); padding:2px 10px; font-size:13px}

/* ---------- formularios / panel lateral ---------- */
.telon{position:fixed; inset:0; background:rgba(13,39,71,.55); backdrop-filter:blur(3px); z-index:80; opacity:0; pointer-events:none; transition:opacity .25s}
.telon.abierto{opacity:1; pointer-events:auto}
.hoja{
  position:fixed; top:0; right:0; bottom:0; width:min(620px,100%); background:#fff; z-index:81;
  transform:translateX(102%); transition:transform .32s cubic-bezier(.3,.9,.3,1); overflow-y:auto; box-shadow:var(--sombra-alta);
}
.hoja.abierta{transform:none}
.hoja-cab{position:sticky; top:0; background:#fff; border-bottom:1px solid var(--linea); padding:22px 30px; display:flex; justify-content:space-between; align-items:center; gap:16px; z-index:2}
.hoja-cab h3{margin:0; font-size:23px}
.hoja-cab p{margin:2px 0 0; font-size:14px; color:var(--gris); font-weight:600}
.cerrar{border:none; background:var(--gris-claro); width:44px; height:44px; border-radius:50%; font-size:20px; color:var(--tinta); line-height:1; flex:none}
.cerrar:hover{background:var(--linea)}
.hoja-cuerpo{padding:26px 30px 60px}

.campo{margin-bottom:20px}
.campo label{display:block; font-size:16px; font-weight:800; margin-bottom:9px; color:var(--tinta)}
.campo .pista{font-size:15px; color:var(--gris); font-weight:500; margin:7px 0 0}
.campo input[type=text], .campo input[type=tel], .campo input[type=email], .campo input[type=number], .campo input[type=url], .campo input[type=password], .campo input[type=search], .campo textarea, .campo select{
  width:100%; border:1.5px solid var(--linea); border-radius:var(--r-m); padding:15px 17px;
  font-family:inherit; font-size:16px; color:var(--tinta); background:var(--crema); transition:border-color .15s, background .15s;
}
.campo input:focus, .campo textarea:focus, .campo select:focus{border-color:var(--azul); background:#fff; outline:none}
.campo textarea{min-height:104px; resize:vertical}
.campo input[type=file]{width:100%; font-size:14px; padding:14px; border:1.5px dashed var(--linea); border-radius:var(--r-m); background:var(--crema)}
.obligatorio::after{content:" *"; color:var(--rojo)}
.fila2{display:grid; grid-template-columns:1fr 1fr; gap:16px}
.fila3{display:grid; grid-template-columns:repeat(3,1fr); gap:16px}
.opciones{display:grid; grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:10px}
.opcion{
  display:flex; align-items:center; gap:11px; border:1.5px solid var(--linea); border-radius:var(--r-m);
  padding:13px 15px; font-size:14.5px; font-weight:600; cursor:pointer; background:var(--crema); transition:all .15s;
}
.opcion:hover{border-color:var(--azul)}
.opcion input{width:19px; height:19px; accent-color:var(--verde); flex:none; margin:0}
.opcion:has(input:checked){border-color:var(--verde); background:var(--verde-claro); color:var(--verde-osc)}
.trampa{position:absolute; left:-9999px}
.aviso{
  display:flex; gap:12px; background:var(--azul-claro); border-radius:var(--r-m); padding:16px 18px;
  font-size:14px; color:#254B77; font-weight:600; margin-bottom:24px; line-height:1.55;
}
.alerta{display:none; background:var(--rojo-claro); color:#8C2A1D; border-radius:var(--r-m); padding:14px 18px; font-size:15px; font-weight:700; margin-bottom:20px}
.alerta.visible{display:block}
.exito{text-align:center; padding:40px 10px}
.exito .sello{width:88px; height:88px; border-radius:50%; background:var(--verde-claro); color:var(--verde); display:grid; place-items:center; font-size:44px; margin:0 auto 22px}
.exito h3{font-size:26px}
.exito p{color:var(--gris)}
.exito .folio-grande{font-size:30px; font-weight:800; color:var(--azul); letter-spacing:.04em; margin:14px 0}

/* ---------- pie ---------- */
.pie{background:var(--azul-osc); color:rgba(255,255,255,.78); padding:66px 0 30px; font-size:16px}
.pie-rejilla{display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:44px; margin-bottom:44px}
.pie h4{color:#fff; font-size:15px; letter-spacing:.1em; text-transform:uppercase; margin-bottom:16px}
.pie a{color:rgba(255,255,255,.72); display:block; margin-bottom:10px}
.pie a:hover{color:var(--sol)}
.pie-logo{background:#fff; border-radius:var(--r-m); padding:14px 18px; display:inline-block; margin-bottom:18px}
.pie-logo img{height:46px}
.pie-abajo{border-top:1px solid rgba(255,255,255,.14); padding-top:22px; display:flex; justify-content:space-between; gap:18px; flex-wrap:wrap; font-size:15px}

/* ---------- aviso flotante ---------- */
.aviso-flotante{
  position:fixed; left:50%; bottom:26px; transform:translate(-50%,24px); z-index:120;
  background:var(--tinta); color:#fff; padding:16px 26px; border-radius:var(--r-full);
  font-weight:700; font-size:15px; box-shadow:var(--sombra-alta); opacity:0; pointer-events:none;
  transition:opacity .22s, transform .22s; max-width:92vw; text-align:center;
}
.aviso-flotante.visible{opacity:1; transform:translate(-50%,0)}
.aviso-flotante.error{background:var(--rojo)}

/* ---------- barra móvil ---------- */
.barra-movil{
  display:none; position:fixed; left:0; right:0; bottom:0; z-index:70; background:#fff;
  border-top:1px solid var(--linea); padding:12px 16px calc(12px + env(safe-area-inset-bottom)); gap:10px;
  box-shadow:0 -8px 30px rgba(18,34,52,.1);
}
.barra-movil .btn{flex:1; padding:15px 12px; font-size:15px}

/* =========================================================
   PANEL DE COORDINACIÓN
   ========================================================= */
.panel-cab{background:var(--azul-osc); color:#fff; padding:18px 0}
.panel-cab-in{display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap}
.panel-cab .logo{background:#fff; border-radius:var(--r-s); padding:8px 12px}
.panel-cab .logo img{height:38px}
.panel-usuario{display:flex; align-items:center; gap:14px; font-size:14px; font-weight:600}
.panel-cuerpo{background:var(--crema); min-height:100vh; padding:34px 0 80px}
.tarjetas-panel{display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:16px; margin-bottom:30px}
.tarjeta-panel{background:#fff; border:1px solid var(--linea); border-radius:var(--r-m); padding:20px 22px; box-shadow:var(--sombra)}
.tarjeta-panel b{display:block; font-size:34px; font-weight:800; letter-spacing:-.04em; line-height:1; color:var(--azul)}
.tarjeta-panel span{font-size:12.5px; font-weight:700; text-transform:uppercase; letter-spacing:.06em; color:var(--gris)}
.tarjeta-panel.sol b{color:#D89400}
.tarjeta-panel.verde b{color:var(--verde)}
.pestanas{display:flex; gap:10px; margin-bottom:22px; flex-wrap:wrap}
.pestana{border:none; background:#fff; border:1.5px solid var(--linea); border-radius:var(--r-full); padding:11px 22px; font-weight:700; font-size:14.5px; color:var(--gris)}
.pestana[aria-selected="true"]{background:var(--azul); border-color:var(--azul); color:#fff}
.tabla-caja{background:#fff; border:1px solid var(--linea); border-radius:var(--r-m); overflow:auto; box-shadow:var(--sombra)}
table.datos{width:100%; border-collapse:collapse; font-size:15.5px; min-width:760px}
table.datos th{background:var(--crema); text-align:left; padding:14px 16px; font-size:12px; letter-spacing:.08em; text-transform:uppercase; color:var(--gris); border-bottom:1px solid var(--linea); white-space:nowrap}
table.datos td{padding:14px 16px; border-bottom:1px solid var(--linea); vertical-align:top}
table.datos tr:last-child td{border-bottom:none}
table.datos tr:hover td{background:#FAFCFD}
.acceso{min-height:100vh; display:grid; place-items:center; background:var(--crema); padding:24px}
.acceso-caja{background:#fff; border-radius:var(--r-l); box-shadow:var(--sombra-alta); padding:44px 40px; width:100%; max-width:430px; text-align:center}
.acceso-caja img{height:64px; margin:0 auto 24px}
.acceso-caja .campo{text-align:left}

/* ---------- responsive ---------- */
@media (max-width:980px){
  .cifras-caja{grid-template-columns:repeat(3,1fr); row-gap:26px}
  .cifra:nth-child(3){border-right:none}
  .pasos{grid-template-columns:1fr}
  .duo{grid-template-columns:1fr; gap:34px}
  .pie-rejilla{grid-template-columns:1fr 1fr}
  .menu{
    position:absolute; top:calc(100% + 12px); left:0; right:0; background:#fff; flex-direction:column; align-items:stretch;
    gap:0; padding:10px 22px 22px; border-bottom:1px solid var(--linea); box-shadow:var(--sombra);
    display:none;
  }
  .menu.abierto{display:flex}
  .menu a{padding:15px 0; border-bottom:1px solid var(--linea); font-size:17px}
  .hamburguesa{display:block}
  .cab-acciones .btn{display:none}
  .barra-movil{display:flex}
  body{padding-bottom:76px}
}
@media (max-width:640px){
  body{font-size:16px}
  .seccion{padding:60px 0}
  .portada-in{padding:64px 0 78px}
  .cifras{margin-top:-40px}
  .cifras-caja{grid-template-columns:repeat(2,1fr); padding:24px 12px; border-radius:var(--r-m)}
  .cifra{border-right:none}
  .fila2,.fila3{grid-template-columns:1fr}
  .rejilla{grid-template-columns:1fr}
  .hoja-cab,.hoja-cuerpo{padding-left:20px; padding-right:20px}
  .pie-rejilla{grid-template-columns:1fr; gap:30px}
  .duo-foto img{aspect-ratio:4/3}
}
@media (prefers-reduced-motion:reduce){
  *{animation:none !important; transition:none !important; scroll-behavior:auto !important}
}
@media print{ .cabecera,.barra-movil,.telon,.hoja{display:none !important} }

/* =========================================================
   MODAL / ASISTENTE PASO A PASO
   ========================================================= */
.modal-fondo{
  position:fixed; inset:0; z-index:90; display:flex; align-items:center; justify-content:center;
  padding:24px; background:rgba(13,39,71,.62); backdrop-filter:blur(4px);
  opacity:0; pointer-events:none; transition:opacity .24s;
}
.modal-fondo.abierto{opacity:1; pointer-events:auto}
.modal{
  background:#fff; border-radius:var(--r-l); width:min(680px,100%); max-height:min(92vh,860px);
  display:flex; flex-direction:column; overflow:hidden; box-shadow:var(--sombra-alta);
  transform:translateY(22px) scale(.98); transition:transform .28s cubic-bezier(.2,.9,.3,1);
}
.modal-fondo.abierto .modal{transform:none}
.modal-cab{display:flex; justify-content:space-between; align-items:flex-start; gap:18px; padding:26px 30px 18px}
.modal-cab h3{margin:6px 0 4px; font-size:clamp(22px,3vw,29px)}
.modal-cab p{margin:0; font-size:16px; color:var(--gris); font-weight:500}
.paso-num{font-size:13px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; color:var(--verde-osc); background:var(--verde-claro); padding:6px 13px; border-radius:var(--r-full)}
.progreso{height:5px; background:var(--gris-claro); overflow:hidden; flex:none}
.progreso span{display:block; height:100%; width:12%; background:linear-gradient(90deg,var(--verde),var(--sol)); border-radius:0 4px 4px 0; transition:width .35s cubic-bezier(.3,.9,.3,1)}
.modal-cuerpo{padding:26px 30px 10px; overflow-y:auto; flex:1; -webkit-overflow-scrolling:touch}
.modal-pie{
  display:flex; gap:12px; align-items:center; padding:18px 30px 24px; border-top:1px solid var(--linea);
  background:#fff; flex:none;
}
.modal-pie .btn-borde{margin-right:auto}
.modal-pie .btn + .btn{margin-left:0}

.paso{display:none; animation:entraPaso .34s cubic-bezier(.2,.85,.3,1) both}
.paso.activo{display:block}
.paso.atras{animation-name:entraPasoAtras}
@keyframes entraPaso{from{opacity:0; transform:translateX(34px)} to{opacity:1; transform:none}}
@keyframes entraPasoAtras{from{opacity:0; transform:translateX(-34px)} to{opacity:1; transform:none}}

/* contadores */
.contadores{display:flex; flex-direction:column; gap:18px}
.contador label{display:block; font-size:15px; font-weight:800; margin-bottom:10px}
.contador-ctrl{display:flex; align-items:center; gap:12px}
.contador-ctrl input{
  flex:1; text-align:center; font-size:26px; font-weight:800; letter-spacing:-.02em;
  border:1.5px solid var(--linea); border-radius:var(--r-m); padding:12px; background:var(--crema);
  -moz-appearance:textfield; color:var(--tinta); font-family:inherit;
}
.contador-ctrl input::-webkit-outer-spin-button,.contador-ctrl input::-webkit-inner-spin-button{-webkit-appearance:none; margin:0}
.paso-btn{
  width:54px; height:54px; flex:none; border-radius:50%; border:1.5px solid var(--linea); background:#fff;
  font-size:26px; font-weight:700; color:var(--azul); line-height:1; transition:all .15s;
}
.paso-btn:hover{background:var(--azul); border-color:var(--azul); color:#fff}
.paso-btn:active{transform:scale(.93)}

/* fichas de necesidades */
.fichas-nec{display:grid; grid-template-columns:repeat(auto-fill,minmax(178px,1fr)); gap:10px}
.ficha-nec{position:relative; cursor:pointer}
.ficha-nec input{position:absolute; opacity:0; width:0; height:0}
.ficha-nec span{
  display:flex; align-items:center; min-height:60px; padding:14px 17px; border-radius:var(--r-m);
  border:1.5px solid var(--linea); background:var(--crema); font-size:16px; font-weight:600;
  transition:all .16s; line-height:1.35;
}
.ficha-nec span::before{
  content:""; width:20px; height:20px; border-radius:6px; border:2px solid var(--linea);
  margin-right:11px; flex:none; transition:all .16s;
}
.ficha-nec:hover span{border-color:var(--azul)}
.ficha-nec input:checked + span{border-color:var(--verde); background:var(--verde-claro); color:var(--verde-osc)}
.ficha-nec input:checked + span::before{background:var(--verde); border-color:var(--verde); content:"✓"; color:#fff; font-size:13px; display:grid; place-items:center}
.ficha-nec input:focus-visible + span{outline:3px solid var(--sol); outline-offset:2px}
.contador-sel{margin:16px 0 0; font-size:14px; font-weight:700; color:var(--gris)}
.contador-sel.hay{color:var(--verde-osc)}

/* atajos de texto */
.atajos{display:flex; flex-wrap:wrap; gap:8px}
.atajo{border:1.5px dashed var(--linea); background:#fff; border-radius:var(--r-full); padding:11px 17px; font-size:15px; font-weight:700; color:var(--gris)}
.atajo:hover{border-color:var(--verde); color:var(--verde-osc); border-style:solid}

/* zona de evidencia */
.soltar{
  border:2px dashed var(--linea); border-radius:var(--r-l); background:var(--crema);
  padding:30px 24px; text-align:center; cursor:pointer; transition:all .18s;
}
.soltar:hover, .soltar.encima{border-color:var(--verde); background:var(--verde-claro)}
.soltar-icono{font-size:38px; margin-bottom:10px}
.soltar-vacio b{display:block; font-size:17px; margin-bottom:5px}
.soltar-vacio span{font-size:13.5px; color:var(--gris)}
.soltar-lleno{display:flex; align-items:center; gap:16px; text-align:left}
.soltar-lleno img, .soltar-lleno video{width:96px; height:96px; object-fit:cover; border-radius:var(--r-m); flex:none; background:#000}
.archivo-datos{flex:1; min-width:0}
.archivo-datos b{display:block; font-size:15px; word-break:break-all}
.archivo-datos span{font-size:13.5px; color:var(--gris)}

/* resumen final */
.resumen{border:1px solid var(--linea); border-radius:var(--r-m); overflow:hidden; margin-top:8px}
.resumen div{display:flex; gap:14px; padding:14px 18px; font-size:16px; border-bottom:1px solid var(--linea)}
.resumen div:last-child{border-bottom:none}
.resumen b{flex:none; width:118px; color:var(--gris); font-size:13.5px; text-transform:uppercase; letter-spacing:.05em}
.resumen span{font-weight:600}
.resumen .falta{color:var(--rojo)}
.subiendo{margin-top:20px}
.subiendo .progreso{border-radius:var(--r-full)}
.subiendo p{margin:10px 0 0; font-size:14px; font-weight:700; color:var(--gris)}

.banner-centro{max-width:760px; margin:0 auto; text-align:center; padding:96px 22px}
.banner-cierre::after{background:linear-gradient(180deg, rgba(13,39,71,.72), rgba(13,39,71,.88))}

@media (max-width:640px){
  .modal-fondo{padding:0; align-items:flex-end}
  .modal{max-height:100vh; height:100%; border-radius:0; width:100%}
  .modal-cab{padding:20px 20px 14px}
  .modal-cuerpo{padding:22px 20px 10px}
  .modal-pie{padding:14px 20px calc(14px + env(safe-area-inset-bottom))}
  .modal-pie .btn{padding:15px 18px; font-size:15px}
  .fichas-nec{grid-template-columns:1fr 1fr}
  .ficha-nec span{font-size:13.5px; min-height:64px}
  .banner-centro{padding:64px 20px}
}

/* =========================================================
   ICONOS
   ========================================================= */
.ic{width:1.15em; height:1.15em; flex:none; vertical-align:-.18em}
.ic.grande{width:52px; height:52px; opacity:.35}
.btn .ic{width:1.25em; height:1.25em}
.etiqueta .ic{width:16px; height:16px}

/* números con icono en los pasos */
.paso-tarjeta .num{position:relative}
.paso-tarjeta .num .ic{width:24px; height:24px}
.paso-tarjeta .num i{
  position:absolute; right:-6px; bottom:-6px; width:26px; height:26px; border-radius:50%;
  background:var(--tinta); color:#fff; font-style:normal; font-size:13px; font-weight:800;
  display:grid; place-items:center; border:3px solid #fff;
}
.lista-check .tic .ic{width:15px; height:15px}

/* =========================================================
   CIFRAS CON JERARQUÍA
   ========================================================= */
.cifras-caja{display:block; padding:0; overflow:hidden}
.cifra-principal{
  display:flex; align-items:center; gap:24px; padding:34px 38px;
  background:linear-gradient(115deg,var(--azul) 0%, var(--azul-osc) 100%); color:#fff;
}
.cifra-icono{
  width:76px; height:76px; flex:none; border-radius:24px; background:rgba(255,255,255,.14);
  display:grid; place-items:center;
}
.cifra-icono .ic{width:38px; height:38px}
.cifra-principal b{
  display:block; font-size:clamp(46px,7vw,76px); font-weight:800; letter-spacing:-.045em;
  line-height:.95; font-variant-numeric:tabular-nums;
}
.cifra-principal span{display:block; margin-top:8px; font-size:clamp(16px,1.6vw,19px); font-weight:600; color:rgba(255,255,255,.86); max-width:26ch}
.cifras-secundarias{display:grid; grid-template-columns:repeat(4,1fr); background:#fff}
.cifras-secundarias .cifra{
  display:flex; flex-direction:column; align-items:flex-start; gap:2px; text-align:left;
  padding:24px 26px; border-right:1px solid var(--linea);
}
.cifras-secundarias .cifra:last-child{border-right:none}
.cifras-secundarias .cifra .ic{width:24px; height:24px; margin-bottom:8px; color:var(--azul)}
.cifras-secundarias .cifra b{font-size:clamp(30px,3.4vw,42px); color:var(--azul)}
.cifras-secundarias .cifra span{font-size:14.5px; letter-spacing:0; text-transform:none; font-weight:700; color:var(--gris)}
.cifra.roja b,.cifra.roja .ic{color:var(--rojo)}
.cifra.ocre b,.cifra.ocre .ic{color:#C98A0B}
.cifra.verde b,.cifra.verde .ic{color:var(--verde)}

/* =========================================================
   NOTICIAS OFICIALES
   ========================================================= */
.seccion-corta{padding:56px 0}
.noticias-caja{background:var(--crema); border:1px solid var(--linea); border-radius:var(--r-l); padding:38px 38px 34px}
.noticias-cab{margin-bottom:26px}
.noticias-cab h2{font-size:clamp(24px,3vw,36px); margin-bottom:10px}
.noticias-cab .plomo{font-size:17.5px; margin:0; max-width:70ch}
.noticias-rejilla{display:grid; grid-template-columns:1.5fr 1fr; gap:26px}
.noticias-lista h3, .canales h3{display:flex; align-items:center; gap:10px; font-size:15px; text-transform:uppercase; letter-spacing:.1em; color:var(--gris); margin-bottom:16px}
.noticia{
  display:flex; flex-direction:column; gap:4px; background:#fff; border:1px solid var(--linea);
  border-radius:var(--r-m); padding:16px 52px 16px 20px; margin-bottom:10px; position:relative; transition:all .16s;
}
.noticia:hover{border-color:var(--azul); transform:translateX(3px)}
.noticia-medio{font-size:13.5px; font-weight:800; letter-spacing:.05em; text-transform:uppercase; color:var(--verde-osc)}
.noticia b{font-size:17px; font-weight:700; color:var(--tinta); line-height:1.4}
.noticia .ic-ir{position:absolute; right:20px; top:50%; transform:translateY(-50%); width:20px; height:20px; color:var(--linea)}
.noticia:hover .ic-ir{color:var(--azul)}
.noticias-vacio{background:#fff; border:1px dashed var(--linea); border-radius:var(--r-m); padding:22px; color:var(--gris); font-size:16px}
.canal{display:block; background:#fff; border:1px solid var(--linea); border-radius:var(--r-m); padding:16px 20px; margin-bottom:10px}
.canal:hover{border-color:var(--verde)}
.canal b{display:block; font-size:16.5px; color:var(--tinta)}
.canal span{font-size:14.5px; color:var(--gris); font-weight:500; line-height:1.45; display:block; margin-top:3px}
.linea-emergencia{
  display:flex; align-items:center; justify-content:space-between; gap:12px; background:var(--rojo);
  color:#fff; border-radius:var(--r-m); padding:16px 20px; font-weight:700; font-size:15.5px;
}
.linea-emergencia b{font-size:30px; letter-spacing:-.02em}

/* =========================================================
   TARJETAS CON PRIORIDAD
   ========================================================= */
.herramientas{display:flex; gap:12px; align-items:center; flex-wrap:wrap; flex:1 1 420px; justify-content:flex-end}
.buscar{flex:1 1 240px; max-width:340px}
.orden{display:flex; align-items:center; gap:10px; font-size:15px; font-weight:700; color:var(--gris); white-space:nowrap}
.orden select{
  border:1.5px solid var(--linea); border-radius:var(--r-full); padding:12px 16px; font-family:inherit;
  font-size:15.5px; font-weight:700; color:var(--tinta); background:#fff;
}
.zona{padding-top:52px}
.cinta{
  position:absolute; top:0; left:0; right:0; display:flex; align-items:center; gap:8px;
  padding:11px 24px; font-size:14px; font-weight:800; letter-spacing:.02em;
}
.zona.p-alta .cinta{background:var(--rojo); color:#fff}
.zona.p-media .cinta{background:var(--sol-claro); color:#8A5B00}
.zona.p-ruta .cinta{background:#E4F2FF; color:#1465A8}
.zona.p-normal .cinta{background:var(--gris-claro); color:var(--gris)}
.zona.p-entregada .cinta{background:var(--verde-claro); color:var(--verde-osc)}
.zona::before{display:none}
.zona.p-alta{border-color:rgba(192,57,43,.35); box-shadow:0 2px 4px rgba(192,57,43,.06), 0 14px 34px rgba(192,57,43,.1)}
.folio{display:flex; align-items:center; gap:6px; font-size:13.5px}
.zona h3{font-size:26px}
.zona-lugar{font-size:15.5px}
.cifra-fuerte{display:flex; align-items:center; gap:16px; background:var(--azul-claro); border-radius:var(--r-m); padding:18px 22px}
.cifra-fuerte b{font-size:46px; font-weight:800; letter-spacing:-.045em; line-height:1; color:var(--azul); font-variant-numeric:tabular-nums}
.cifra-fuerte span{font-size:16px; font-weight:700; color:#2A4C74; line-height:1.35}
.cifra-fuerte i{font-style:normal; font-weight:600; color:var(--gris); font-size:14.5px}
.censo{grid-template-columns:1fr 1fr; padding:14px 8px}
.censo div{display:flex; flex-direction:column; align-items:center; gap:2px}
.censo .ic{width:22px; height:22px; color:var(--gris); margin-bottom:2px}
.censo b{font-size:27px}
.censo span{font-size:13.5px}
.bloque h4{display:flex; align-items:center; gap:8px; font-size:13.5px; text-transform:uppercase; letter-spacing:.09em; color:var(--gris); margin:0 0 10px}
.nec.mas{background:var(--azul-claro); color:var(--azul); font-weight:800}
.admin-datos p{display:flex; align-items:flex-start; gap:10px; margin:0 0 9px; font-size:15.5px; color:var(--tinta)}
.admin-datos .ic{color:var(--gris); margin-top:3px}
.admin-datos .falta{color:var(--rojo); font-weight:800}
.zona-pie .con-video{color:var(--verde-osc); font-weight:800}
.zona-pie .sin-video{color:#B07908; font-weight:800}
.zona-pie span{display:inline-flex; align-items:center; gap:6px}
.vacio{display:flex; flex-direction:column; align-items:center; gap:10px; font-size:17px}
.vacio b{font-size:22px}
.vacio .btn{margin-top:10px}

/* input con error en el asistente */
.malo{border-color:var(--rojo) !important; background:var(--rojo-claro) !important; animation:tiembla .32s}
@keyframes tiembla{25%{transform:translateX(-6px)}50%{transform:translateX(6px)}75%{transform:translateX(-3px)}}
.contador-ctrl input.late{border-color:var(--verde); background:var(--verde-claro)}
.soltar-lleno video{pointer-events:none}

@media (max-width:980px){
  .noticias-rejilla{grid-template-columns:1fr}
  .cifras-secundarias{grid-template-columns:1fr 1fr}
  .cifras-secundarias .cifra:nth-child(2){border-right:none}
  .cifras-secundarias .cifra:nth-child(1),.cifras-secundarias .cifra:nth-child(2){border-bottom:1px solid var(--linea)}
  .herramientas{justify-content:flex-start}
}
@media (max-width:640px){
  .noticias-caja{padding:26px 20px}
  .cifra-principal{flex-direction:column; align-items:flex-start; gap:16px; padding:28px 24px}
  .cifra-icono{width:60px; height:60px; border-radius:18px}
  .cifras-secundarias .cifra{padding:20px}
  .cifra-fuerte b{font-size:40px}
  .orden{width:100%; justify-content:space-between}
  .orden select{flex:1; margin-left:10px}
}

/* balance oficial */
.balance{background:#fff; border:1px solid var(--linea); border-radius:var(--r-l); padding:26px 28px; margin-bottom:26px}
.balance-cab{display:flex; justify-content:space-between; align-items:center; gap:16px; flex-wrap:wrap; margin-bottom:20px}
.balance-cab span{display:inline-flex; align-items:center; gap:9px; font-size:15px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:var(--azul)}
.balance-cab b{font-size:15px; font-weight:700; color:var(--gris); background:var(--gris-claro); padding:7px 14px; border-radius:var(--r-full)}
.balance-cifras{display:grid; grid-template-columns:repeat(5,1fr); gap:14px}
.balance-cifras div{background:var(--crema); border-radius:var(--r-m); padding:16px 18px}
.balance-cifras b{display:block; font-size:clamp(24px,2.6vw,32px); font-weight:800; letter-spacing:-.035em; line-height:1.05; color:var(--tinta); font-variant-numeric:tabular-nums}
.balance-cifras span{display:block; margin-top:4px; font-size:14px; font-weight:700; color:var(--gris)}
.balance-cifras .grave b{color:var(--rojo)}
.balance-cifras .bueno b{color:var(--verde)}
.balance-cifras .ancho{background:var(--azul-claro)}
.balance-cifras .ancho b{color:var(--azul)}
.balance-pie{margin:18px 0 0; font-size:15px; color:var(--gris)}
.balance-pie a{font-weight:800; white-space:nowrap}
@media (max-width:980px){ .balance-cifras{grid-template-columns:repeat(3,1fr)} }
@media (max-width:640px){ .balance{padding:22px 18px} .balance-cifras{grid-template-columns:repeat(2,1fr); gap:10px} }


/* =========================================================
   PORTADA — barra de acción con solapas (reportar / buscar / ayudar)
   ========================================================= */
.portada-in{padding:78px 0 88px; max-width:1000px; margin:0 auto; text-align:center}
.portada h1{font-size:clamp(36px,5.6vw,64px); margin:0 auto 16px; max-width:18ch}
.portada h1 span{display:inline; color:var(--sol)}
.portada p{font-size:clamp(18px,1.7vw,22px); margin:0 auto 34px; max-width:60ch}
.portada .etiqueta{margin-bottom:22px}

.buscador-reporte{position:relative; max-width:900px; margin:0 auto; text-align:left}

.solapas{display:flex; gap:6px; background:rgba(9,28,52,.55); backdrop-filter:blur(8px); border-radius:var(--r-full); padding:6px; margin:0 auto 14px; width:max-content; max-width:100%; flex-wrap:wrap; justify-content:center}
.solapa{
  display:inline-flex; align-items:center; gap:9px; border:none; background:transparent; color:rgba(255,255,255,.86);
  border-radius:var(--r-full); padding:13px 26px; font-size:16.5px; font-weight:700; transition:all .18s;
}
.solapa:hover{color:#fff; background:rgba(255,255,255,.12)}
.solapa[aria-selected="true"]{background:#fff; color:var(--azul); box-shadow:0 4px 14px rgba(6,22,42,.25)}
.solapa .ic{width:19px; height:19px}

.buscador-caja{
  display:flex; align-items:stretch; gap:10px; background:#fff; border-radius:var(--r-l);
  padding:10px; box-shadow:0 26px 64px rgba(6,22,42,.4);
}
.selector{position:relative; flex:none; display:flex; align-items:center; border-right:1px solid var(--linea); padding-right:6px}
.selector select{
  appearance:none; border:none; background:transparent; font-family:inherit; font-size:16.5px; font-weight:700;
  color:var(--tinta); padding:16px 34px 16px 16px; max-width:210px; cursor:pointer; outline:none;
}
.ic-flecha-abajo{position:absolute; right:14px; top:50%; width:16px; height:16px; transform:translateY(-50%) rotate(90deg); color:var(--gris); pointer-events:none}
.buscador-caja input{
  flex:1; min-width:0; border:none; outline:none; background:transparent; font-family:inherit;
  font-size:19px; font-weight:600; color:var(--tinta); padding:16px 8px;
}
.buscador-caja input::placeholder{color:#8FA0AE; font-weight:500}
.buscador-caja .btn{flex:none; padding:18px 34px; font-size:17.5px; border-radius:var(--r-m); box-shadow:none}
.buscador-caja .btn .ic{width:20px; height:20px}
.buscador-caja.modo-buscar .btn{background:var(--azul); color:#fff}
.buscador-caja.modo-ayudar .btn{background:var(--verde); color:#fff}

.buscador-pie{display:flex; align-items:center; justify-content:space-between; gap:18px; flex-wrap:wrap; margin-top:18px}
.enlace-secundario{
  display:inline-flex; align-items:center; gap:9px; background:rgba(255,255,255,.14); border:1.5px solid rgba(255,255,255,.3);
  color:#fff; border-radius:var(--r-full); padding:11px 20px; font-size:15.5px; font-weight:700; backdrop-filter:blur(6px);
}
.enlace-secundario:hover{background:#fff; color:var(--azul); border-color:#fff}
.buscador-nota{display:flex; gap:22px; flex-wrap:wrap; margin:0; font-size:15.5px; font-weight:600; color:rgba(255,255,255,.86)}
.buscador-nota span{display:inline-flex; align-items:center; gap:8px}
.buscador-nota .ic{color:var(--sol); width:17px; height:17px}

.sugerencias{
  position:absolute; left:0; right:0; top:calc(100% + 10px); background:#fff; border-radius:var(--r-l);
  box-shadow:var(--sombra-alta); overflow:hidden; z-index:30; padding:8px;
}
.sugerencia{
  display:flex; align-items:center; gap:14px; width:100%; border:none; background:transparent; text-align:left;
  padding:15px 18px; border-radius:var(--r-m); font-family:inherit; font-size:17px; color:var(--tinta);
}
.sugerencia:hover, .sugerencia:focus-visible{background:var(--crema)}
.sugerencia .ic{width:22px; height:22px; color:var(--gris); flex:none}
.sugerencia b{font-weight:800}
.sugerencia small{display:block; font-size:14.5px; color:var(--gris); font-weight:600; margin-top:2px}
.sugerencia.nueva{background:var(--verde-claro); color:var(--verde-osc)}
.sugerencia.nueva .ic{color:var(--verde)}
.sugerencia.nueva:hover{background:#DDEED4}
.sugerencias-titulo{font-size:13px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; color:var(--gris); padding:12px 18px 6px}

@media (max-width:860px){
  .portada-in{padding:48px 0 60px}
  .solapas{width:100%; justify-content:stretch; border-radius:var(--r-m)}
  .solapa{flex:1; justify-content:center; padding:13px 10px; font-size:15px; border-radius:var(--r-s)}
  .solapa .ic{display:none}
  .buscador-caja{flex-direction:column; padding:12px; gap:10px}
  .selector{border-right:none; border-bottom:1px solid var(--linea); padding:0 0 4px}
  .selector select{width:100%; max-width:none; padding:15px 34px 15px 14px}
  .buscador-caja input{border:1.5px solid var(--linea); border-radius:var(--r-m); background:var(--crema); padding:16px 18px; font-size:17px}
  .buscador-caja .btn{width:100%; justify-content:center; padding:17px}
  .buscador-pie{flex-direction:column; align-items:stretch; gap:14px}
  .enlace-secundario{justify-content:center}
  .buscador-nota{justify-content:center; gap:14px; font-size:14.5px}
  .sugerencias{position:static; margin-top:12px}
}

/* =========================================================
   WHATSAPP FLOTANTE
   ========================================================= */
.wa-flotante{position:fixed; right:22px; bottom:22px; z-index:75; display:flex; flex-direction:column; align-items:flex-end; gap:12px}
.wa-boton{
  display:inline-flex; align-items:center; gap:11px; background:#25D366; color:#0B3B23; border:none;
  border-radius:var(--r-full); padding:16px 24px; font-size:16.5px; font-weight:800;
  box-shadow:0 14px 34px rgba(37,211,102,.45); transition:transform .18s, box-shadow .18s;
}
.wa-boton:hover{transform:translateY(-2px); box-shadow:0 18px 40px rgba(37,211,102,.55)}
.wa-boton .ic{width:24px; height:24px}
.wa-menu{
  background:#fff; border-radius:var(--r-l); box-shadow:var(--sombra-alta); padding:10px; width:min(320px,86vw);
  animation:aparece .22s ease both;
}
.wa-titulo{margin:8px 12px 10px; font-size:14px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:var(--gris)}
.wa-opcion{display:flex; align-items:center; gap:14px; padding:14px 14px; border-radius:var(--r-m); color:var(--tinta)}
.wa-opcion:hover{background:var(--verde-claro)}
.wa-opcion .ic{width:24px; height:24px; color:#25D366; flex:none}
.wa-opcion b{display:block; font-size:16.5px; font-weight:800}
.wa-opcion small{display:block; font-size:14px; color:var(--gris); font-weight:600}

@media (max-width:980px){
  .wa-flotante{right:16px; bottom:96px}
  .wa-boton{padding:15px; border-radius:50%}
  .wa-boton span{display:none}
}