/* Grupo HP · WEB6: logo real, ajustes visuales para todos los dispositivos */
/* Logo vectorial (nítido en cualquier pantalla), sin la caja gris */
.brand img{height:40px;width:auto;display:block}
.footer-logo{height:44px;width:auto}
@media (max-width:760px){.brand img{height:32px}}
/* Encabezado: logo con aire, enlaces legibles */
.site-header .brand{padding:6px 0}
.nav-link{transition:color .15s ease,opacity .15s ease}
/* Títulos equilibrados en varias líneas, sin palabras sueltas */
h1,h2,h3{text-wrap:balance}
p{text-wrap:pretty}
/* Las anclas no quedan tapadas por el encabezado fijo */
[id]{scroll-margin-top:96px}
/* Foco visible para teclado */
a:focus-visible,button:focus-visible{outline:3px solid #2f80ed;outline-offset:2px;border-radius:4px}
::selection{background:#25589F;color:#fff}
img{image-rendering:auto}
/* Celular: el cuadro de indicadores del inicio ya no queda cortado */
@media (max-width:760px){
  .hero-metrics{transform:none!important;margin:28px 0 0!important}
  .trust-strip{padding-top:44px!important}
  .vivo-band .stats-grid{grid-template-columns:1fr 1fr!important;gap:18px 14px!important}
  .vivo-band .stat strong{font-size:2rem}
  .vivo-band .stat span{font-size:.8rem}
  .mapa-obras{height:360px}
  .section-heading h2{font-size:clamp(1.5rem,6.4vw,1.9rem)}
  .obra-body h3{font-size:1rem}
  .button{min-height:48px}
}
/* Tablet: tarjetas de obras en dos columnas con buen margen */
@media (min-width:761px) and (max-width:1120px){.obras-grid{gap:16px}.galeria-grid{gap:10px}}
/* Pantallas grandes: el mapa más alto */
@media (min-width:1400px){.mapa-obras{height:600px}}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important;animation:none!important}}