:root{
  --azul:#2a62ae;
  --azul-osc:#173a6b;
  --celeste:#1fa5df;
  --amarillo:#f6d23a;
  --tinta:#1b2433;
  --gris:#5b6678;
  --fondo:#f4f7fb;
  --radio:14px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:100px}
body{font-family:"Segoe UI",system-ui,-apple-system,Roboto,Helvetica,Arial,sans-serif;color:var(--tinta);line-height:1.65;background:#fff}
img{max-width:100%;display:block}
a{color:inherit}
.wrap{width:min(1120px,92%);margin-inline:auto}

/* Encabezado */
header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.96);backdrop-filter:blur(8px);border-bottom:1px solid #e3e9f2}
.nav{display:flex;align-items:center;justify-content:space-between;height:92px}
.nav img{height:66px;width:auto}
.nav ul{display:flex;gap:26px;list-style:none}
.nav a{text-decoration:none;font-weight:600;font-size:.95rem;color:var(--azul-osc)}
.nav a:hover{color:var(--celeste)}
.btn{display:inline-block;background:var(--azul);color:#fff!important;padding:13px 26px;border-radius:999px;font-weight:700;text-decoration:none;transition:.2s;border:2px solid var(--azul)}
.btn:hover{background:var(--azul-osc);border-color:var(--azul-osc);transform:translateY(-1px)}
.btn.sec{background:transparent;color:var(--azul)!important}
.btn.sec:hover{background:var(--azul);color:#fff!important}
#menu-btn{display:none;background:none;border:0;font-size:1.7rem;color:var(--azul-osc);cursor:pointer}

/* Portada */
.hero{background:linear-gradient(135deg,#eef4fc 0%,#fff 55%,#e6f5fc 100%);overflow:hidden}
.hero .wrap{display:grid;grid-template-columns:1.05fr 1fr;align-items:center;gap:30px;padding:70px 0 60px}
.etiqueta{display:inline-block;font-size:.8rem;letter-spacing:.12em;text-transform:uppercase;font-weight:700;color:var(--celeste);margin-bottom:14px}
.hero h1{font-size:clamp(2rem,4.6vw,3.3rem);line-height:1.12;color:var(--azul-osc);margin-bottom:18px}
.hero h1 span{color:var(--azul)}
.hero p{font-size:1.12rem;color:var(--gris);max-width:520px;margin-bottom:28px}
.hero .acciones{display:flex;gap:14px;flex-wrap:wrap}
.hero img{width:100%;filter:drop-shadow(0 24px 30px rgba(23,58,107,.25))}

/* Cifras */
.cifras{background:var(--azul-osc);color:#fff}
.cifras .wrap{display:grid;grid-template-columns:repeat(4,1fr);text-align:center;padding:34px 0;gap:10px}
.cifras b{display:block;font-size:2.2rem;line-height:1.1;color:var(--amarillo)}
.cifras span{font-size:.92rem;opacity:.9}

/* Secciones */
section{padding:84px 0}
section.alt{background:var(--fondo)}
.titulo{text-align:center;max-width:680px;margin:0 auto 48px}
.titulo h2{font-size:clamp(1.6rem,3.2vw,2.3rem);color:var(--azul-osc);margin-bottom:10px}
.titulo p{color:var(--gris)}
.titulo h2::after{content:"";display:block;width:56px;height:4px;border-radius:4px;background:linear-gradient(90deg,var(--azul),var(--celeste));margin:14px auto 0}

/* Empresa */
.dos{display:grid;grid-template-columns:1fr 1fr;gap:46px;align-items:center}
.dos p{margin-bottom:14px;color:#364156}
.dos .fotos{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.dos .fotos img{border-radius:var(--radio);height:100%;min-height:260px;object-fit:cover;box-shadow:0 10px 26px rgba(23,58,107,.15)}
.dos .fotos img:nth-child(2){margin-top:30px}
.valores{list-style:none;margin-top:18px;display:grid;gap:8px}
.valores li::before{content:"✔";color:var(--celeste);font-weight:700;margin-right:10px}

/* Proceso */
.pasos{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.paso{background:#fff;border-radius:var(--radio);overflow:hidden;box-shadow:0 6px 22px rgba(23,58,107,.09);display:flex;flex-direction:column}
.paso img{height:200px;width:100%;object-fit:cover}
.paso div{padding:20px 20px 24px}
.num{display:inline-grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--celeste);color:#fff;font-weight:700;font-size:.9rem;margin-bottom:10px}
.paso h3{color:var(--azul-osc);margin-bottom:6px;font-size:1.1rem}
.paso p{font-size:.93rem;color:var(--gris)}

/* Instalaciones */
.inst{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.card{background:#fff;border-radius:var(--radio);overflow:hidden;box-shadow:0 6px 22px rgba(23,58,107,.09)}
.card img{height:230px;width:100%;object-fit:cover}
.card div{padding:22px}
.card h3{color:var(--azul-osc);margin-bottom:8px}
.card ul{list-style:none;color:var(--gris);font-size:.95rem}
.card li{padding:3px 0}
.card li::before{content:"•";color:var(--celeste);font-weight:700;margin-right:8px}

/* Galería */
.galeria{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.galeria img{width:100%;height:240px;object-fit:cover;border-radius:12px}

/* Contacto */
.contacto{display:grid;grid-template-columns:1fr 1.2fr;gap:36px;align-items:stretch}
.caja{background:var(--azul-osc);color:#fff;border-radius:var(--radio);padding:36px}
.caja h3{font-size:1.4rem;margin-bottom:14px;color:#fff}
.caja p{margin-bottom:16px;opacity:.92}
.caja a{color:var(--amarillo);font-weight:700;word-break:break-all}
.caja .btn{background:var(--amarillo);color:var(--azul-osc)!important;border-color:var(--amarillo);margin-top:6px}
.caja .btn:hover{background:#fff;border-color:#fff}
.mapa{border-radius:var(--radio);overflow:hidden;min-height:340px;box-shadow:0 6px 22px rgba(23,58,107,.12)}
.mapa iframe{width:100%;height:100%;min-height:340px;border:0}

footer .logo-pie{height:64px;width:auto;margin:0 auto 18px;background:#fff;padding:10px 18px;border-radius:10px}
footer{background:#0f2444;color:#b8c5db;text-align:center;padding:30px 0;font-size:.9rem}
footer b{color:#fff}

/* Responsive */
@media(max-width:960px){
  .hero .wrap,.dos,.contacto{grid-template-columns:1fr}
  .hero .wrap{padding:44px 0}
  .pasos{grid-template-columns:repeat(2,1fr)}
  .inst{grid-template-columns:1fr}
  .galeria{grid-template-columns:repeat(2,1fr)}
  .cifras .wrap{grid-template-columns:repeat(2,1fr);gap:22px}
  #menu-btn{display:block}
  .nav{height:76px}
  .nav img{height:54px}
  .nav ul{display:none;position:absolute;top:76px;left:0;right:0;background:#fff;flex-direction:column;gap:0;border-bottom:1px solid #e3e9f2;padding:8px 4%}
  .nav ul.abierto{display:flex}
  .nav li a{display:block;padding:12px 0}
  section{padding:60px 0}
  html{scroll-padding-top:84px}
}
@media(max-width:560px){
  .pasos{grid-template-columns:1fr}
  .dos .fotos img{min-height:200px}
}
