/* ===== RESET & BASE ===== */
* { margin: 0; padding: 0; box-sizing: border-box; }
body { font-family: 'Poppins', sans-serif; color: #111111; background-color: #fff; line-height: 1.6; }

/* ===== CONTAINER ===== */
.container { width: 90%; max-width: 1200px; margin: auto; }

/* HEADER FLEX BICOLOR */
.header {
  display: flex;
  width: 100%;
  position: fixed;
  top: 0;
  z-index: 100;
  height: 60px; /* altura fija */
  box-shadow: 0 2px 5px rgba(0,0,0,0.1);
}

/* PARTE IZQUIERDA - LOGO SOBRE BLANCO */
.header-left {
  background: #FFFFFF;
  padding-left: 1rem;
  display: flex;
  align-items: center;
  border-right: 2px solid #F2B705; /* línea divisoria */
  flex: 0 0 auto; /* ancho según contenido */
}

/* LOGO */
.logo-img {
  height: 50px;
  width: auto;
  display: block;
}

/* PARTE DERECHA - MENÚ SOBRE AMARILLO */
.header-right {
  background: #F2B705;
  flex: 1; /* ocupa el resto del espacio */
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding-right: 2rem;
}

/* MENÚ */
.nav ul {
  display: flex;
  list-style: none;
  gap: 1.5rem;
  margin: 0;
  padding: 0;
}

.nav ul li a {
  color: #111111; /* letras negras */
  text-decoration: none;
  font-weight: 500;
  transition: color 0.3s;
}

.nav ul li a:hover {
  color: #D99A00;
}
/* HERO CON IMAGEN Y GRADIENTE CORPORATIVO */
/* KPIs INDEX */
/* VARIABLES DE MARCA */
:root {
  --negro-geosegal: #000000;
  --amarillo-geosegal: #f2b705;
}

/* KPIs ESTILO CORPORATIVO */

.kpis-nacional {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  background: var(--negro-geosegal);
  padding: 5rem 2rem;
  text-align: center;
}

.kpi-box {
  padding: 2rem;
  border-right: 1px solid rgba(255,255,255,0.08);
}

.kpi-box:last-child {
  border-right: none;
}

.kpi-box h2 {
  font-size: 3rem;
  margin-bottom: 0.5rem;
  color: var(--amarillo-geosegal);
  font-weight: bold;
}

.kpi-box span {
  font-size: 1rem;
  color: white;
  letter-spacing: 1px;
}
/* ===== SECCIONES ===== */
section { padding: 6rem 0; }
.about-content { display: flex; flex-wrap: wrap; gap: 3rem; align-items: center; }
.about-text { flex: 2; }
.about-image {  flex: 2;  display: flex;  justify-content: flex-end; /* Empuja la imagen a la derecha */}
.about-image img { width: 40%; border-radius: 20px; }

.vision-cards { display: flex;  flex-wrap: wrap;  gap: 2rem;  justify-content: center;  margin-top: 2rem;  align-items: stretch; /* Asegura misma altura */ }
.card { background: #F5F5F5; padding: 2rem; text-align: center; border-radius: 20px; flex: 1 1 250px; flex-direction: column; }
.card img { width: 200px;  height: 200px;  object-fit: contain;  margin-bottom: 1rem;}

.service-cards { display: flex; flex-wrap: wrap; gap: 2rem; margin-top: 2rem; }
.service-card { flex: 1 1 250px; background: rgba(242, 183, 5, 0.15); padding: 1.5rem; border: 1px solid #ddd; border-radius: 10px; transition: transform 0.3s; }
.service-card:hover { transform: translateY(-5px); }

.projects-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 1rem; margin-top: 2rem; }
.projects-grid img { width: 100%; border-radius: 10px; }

.cta { background: #111; color: #fff; text-align: center; padding: 4rem 2rem; }
.cta .btn-primary { color: #111; }

/* ===== FOOTER ===== */
.footer { background: #111; color: #fff; padding: 2rem 0; }
.footer-container { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 1rem; }
.footer a { color: #F2B705; text-decoration: none; }
.footer a:hover { color: #D99A00; }


 /* BOTÓN OCULTO EN DESKTOP */
.menu-toggle {
  display: none;
  background: none;
  border: none;
  font-size: 1.8rem;
  cursor: pointer;
  color: #111;
}

/* MENU NORMAL DESKTOP */
.nav {
  display: flex;
}



/* TOPOGRAFIA*/
/* ===================================
   HERO SLIDER - SOLO TOPOGRAFÍA
=================================== */

.topografia .hero-slider {
  position: relative;
  width: 100%;
  height: 100vh;
  overflow: hidden;
}

.topografia .slides {
  display: flex;
  width: 100%;
  height: 100%;
  transition: transform 2s ease-in-out;
}

.topografia .slide {
  width: 100%;
  flex-shrink: 0;
  position: relative;
}

.topografia .slide img {
  width: 100%;
  height: 100%;
  object-fit: contain;
background-color: rgba(0, 0, 0, 0.6); /* para que no quede blanco */;
}

.topografia .slide::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.45);
  top: 0;
  left: 0;
  z-index: 5;
}
.topografia .slide-content {
  position: absolute;
  z-index: 10;
  color: white;
  top: 50%;
  left: 30%;
  transform: translateY(-50%, 50%);
  text-align: center;

}

.topografia .slide-content h1 {
  font-size: 2rem;
  margin-bottom: 1rem;
}

.topografia .slide-content p {
  font-size: 1.2rem;
}



/* ====== TECNOLOGIA TOPOGRAFIA ====== */

.tecnologia-topografia {
  display: flex;
  gap: 2rem;
  justify-content: center;
  flex-wrap: wrap;
  padding: 4rem 2rem;
}

.tecnologia-card {
  background: #F5F5F5;
  border-radius: 20px;
  overflow: hidden;
  width: 320px;
  box-shadow: 0 5px 15px rgba(0,0,0,0.08);
  transition: transform 0.3s ease;
}

.tecnologia-card:hover {
  transform: translateY(-8px);
}

.tecnologia-card img {
  width: 100%;
  height: 200px;
  object-fit: contain;
}

.tecnologia-card h3 {
  margin: 1.2rem 1rem 0.5rem;
  font-size: 1.3rem;
}

.tecnologia-card p {
  margin: 0 1rem 1.5rem;
  font-size: 0.95rem;
  color: #444;
}


/* ===================================
   BLOQUE SERVICIOS TOPOGRAFÍA
=================================== */

.topografia .topo-services {
  max-width: 800px;
  margin: 3rem auto;
  list-style: none;
  padding: 0;
}

.topografia .topo-services li {
  background: rgba(242, 183, 5, 0.12);
  margin-bottom: 1rem;
  padding: 1rem 1.5rem;
  border-radius: 12px;
  font-weight: 500;
}

/* ===================================
   RESPONSIVE SLIDER
=================================== */



/* ==============================
   ARQUITECTURA
============================== */

.arquitectura .hero-arquitectura {
  height: 70vh;
  background:
    linear-gradient(rgba(0,0,0,0.6), rgba(0,0,0,0.6)),
    url("images/Plano4.jpeg") center/contain no-repeat;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  margin-top: 60px;
}

.arquitectura .hero-arq-overlay {
  color: #fff;
  max-width: 800px;
  padding: 2rem;
}

.arquitectura .hero-arq-overlay h1 {
  font-size: 2.5rem;
  margin-bottom: 1rem;
}

/* SERVICIOS */
.arquitectura .servicios-arquitectura {
  display: flex;
  flex-wrap: wrap;
  gap: 2rem;
  justify-content: center;
  padding: 4rem 2rem;
}

.arquitectura .arq-card {
  background: #F5F5F5;
  padding: 2rem;
  border-radius: 20px;
  width: 280px;
  box-shadow: 0 5px 15px rgba(0,0,0,0.08);
  transition: transform 0.3s;
}

.arquitectura .arq-card:hover {
  transform: translateY(-8px);
}



.arquitectura .proceso-arquitectura{
  text-align:center;
  margin:80px 0;
}

.arquitectura .hero-slider {
  width: 100%;
  height: 90vh;
  overflow: hidden;
  position: relative;
}

.arquitectura .slides {
  display: flex;
  width: 100%;
  height: 100%;
  transition: transform 1s ease;
}

.arquitectura .slide {
  min-width: 100%;
  height: 100%;
}

.arquitectura .slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}



/* PROCESO */
.arquitectura .proceso-arquitectura {
  background: #F2B705;
  padding: 4rem 2rem;
  text-align: center;
}

.arquitectura .proceso-steps {
  display: flex;
  justify-content: center;
  gap: 2rem;
  flex-wrap: wrap;
  margin-top: 2rem;
}

.arquitectura .proceso-steps div {
  background: #fff;
  padding: 1rem 2rem;
  border-radius: 12px;
}

.arquitectura .arq-card ul {
  margin-top: 1rem;
  padding-left: 1.2rem;
  color: #444;
}

.arquitectura .arq-card ul li {
  margin-bottom: 0.5rem;
  font-size: 0.9rem;
}



/* ==============================
   PROYECTOS
============================== */


/* ================= PROYECTOS SLIDER ================= */

.proyectos-hero {
  position: relative;
  width: 100%;
  height: 90vh;
  overflow: hidden;
  background: #e5e5e5;
}

.proyectos-slide {
  position: absolute;
  width: 100%;
  height: 100%;
  opacity: 0;
  transition: opacity 1.5s ease-in-out;
  display: flex;
  justify-content: center;
  align-items: center;
    z-index: 1;   /* 👈 debajo */

}

.proyectos-slide img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}

.proyectos-slide.active {
  opacity: 1;
}

.proyectos-content {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 3;
  text-align: center;
  color: white;
  width: 90%;
}

.proyectos-hero::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.35);
  top: 0;
  left: 0;
  z-index: 2;
}



.proyectos-content h1 {
  font-size: 2rem;
  margin-bottom: 1rem;
    z-index: 2;

}

.proyectos-content p {
  font-size: 1.2rem;
}



/* PROYECTOS DESTACADOS */

.proyectos-destacados {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 2rem;
  padding: 4rem 2rem;
  max-width: 1200px;
  margin: auto;
}

.proyecto-card {
  background: white;
  padding: 2rem;
  border-radius: 10px;
  box-shadow: 0 5px 15px rgba(0,0,0,0.08);
  transition: 0.3s;
}

.proyecto-card:hover {
  transform: translateY(-5px);
}

.experiencia-ejecucion {
  padding: 4rem 2rem;
  background: #f5f5f5;
}

.experiencia-ejecucion h2 {
  text-align: center;
  margin-bottom: 3rem;
}

.experiencia-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 2rem;
  max-width: 1200px;
  margin: auto;
}

.experiencia-item {
  background: white;
  padding: 2rem;
  border-radius: 10px;
  box-shadow: 0 5px 15px rgba(0,0,0,0.08);
}
/* MAPA */

.mapa-chile {
  padding: 4rem 2rem;
  text-align: center;
}



.mapa-container {
  width: 100%;
  max-width: 1100px;
  margin: 2rem auto 0;
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 5px 20px rgba(0,0,0,0.1);
}

.mapa-container iframe {
  width: 100%;
  height: 500px;
  border: 0;
}
/* EMPRESAS */

/* ================= EMPRESAS ================= */


.empresas-logos {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 70px;
  flex-wrap: wrap;
}

.empresas-logos img {
  width: 180px;        /* tamaño uniforme */
  height: 100px;        /* altura fija */
  object-fit: contain; /* mantiene proporción */
  background: white;   /* fondo uniforme */
  padding: 10px;       /* espacio interno */
  border-radius: 8px;  
  box-shadow: 0 2px 8px rgba(0,0,0,0.05);
  transition: 0.3s ease;
}

.empresas-logos img:hover {
  transform: scale(1.05);
}
/* RESPONSIVE */

/* FOOTER */

footer {
  background: #111;
  color: white;
  text-align: center;
  padding: 1rem;
}

/* RESPONSIVE */



/* ==============================
   BIBLIOTECA
============================== */

/* HERO BIBLIOTECA */

.hero-biblioteca {
  height: 50vh;
  background: #000000;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 80px;
  position: relative;
  color:  #f2b705
}

/* SECCIONES */

.biblioteca-seccion {
  padding: 4rem 2rem;
  max-width: 1200px;
  margin: auto;
}

.fondo-gris {
  background: #f5f5f5;
}

.biblioteca-seccion h2 {
  text-align: center;
  margin-bottom: 2.5rem;
}

/* GRID */

.biblioteca-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 2rem;
}

/* TARJETAS */

.archivo-card {
  background: white;
  padding: 2rem;
  border-radius: 10px;
  box-shadow: 0 5px 15px rgba(0,0,0,0.08);
  text-align: center;
}

.archivo-card h3 {
  margin-bottom: 1rem;
}

.btn-descarga {
  display: inline-block;
  margin-top: 1rem;
  padding: 0.7rem 1.5rem;
  background: #1f2d3d;
  color: white;
  text-decoration: none;
  border-radius: 5px;
  transition: 0.3s;
}

.btn-descarga:hover {
  background: #2e435c;
}



/* =====================================
   OPTIMIZACIÓN MÓVIL GEOSEGAL
===================================== */

@media (max-width: 768px) {

/* CONTAINER MÁS APROVECHADO */
.container{
width:95%;
}

/* ESPACIADO GENERAL */
section{
padding:4rem 0;
}

/* TITULOS MÁS LEGIBLES */
h1{
font-size:1.9rem;
}

h2{
font-size:1.6rem;
}

p{
font-size:0.95rem;
}


/* ===== HEADER ===== */

.header{
height:60px;
}

.header-right{
padding-right:1rem;
}


/* ===== HERO SLIDERS ===== */

.topografia .slide-content{
left:50%;
transform:translate(-50%, -50%);
width:90%;
padding:0 1rem;
}

.topografia .slide-content h1{
font-size:1.6rem;
}

.topografia .slide-content p{
font-size:1rem;
}


/* ===== KPI BLOQUE ===== */

.kpis-nacional{
padding:3rem 1rem;
}

.kpi-box{
padding:1.5rem 1rem;
}

.kpi-box h2{
font-size:2.2rem;
}


/* ===== ABOUT ===== */

.about-content{
gap:2rem;
}

.about-image img{
width:85%;
}


/* ===== TARJETAS GENERALES ===== */

.card,
.service-card,
.arq-card,
.tecnologia-card{
width:100%;
max-width:420px;
margin:auto;
}


/* ===== SERVICIOS ===== */

.service-cards{
flex-direction:column;
align-items:center;
}


/* ===== PROYECTOS ===== */

.proyectos-hero{
height:60vh;
}

.proyectos-content h1{
font-size:1.7rem;
}

.proyectos-content p{
font-size:1rem;
}


/* ===== EMPRESAS ===== */

.empresas-logos{
gap:20px;
}

.empresas-logos img{
width:90px;
height:60px;
}


/* ===== BIBLIOTECA ===== */

.biblioteca-grid{
grid-template-columns:1fr;
}

.archivo-card{
padding:1.5rem;
}

.btn-descarga{
width:100%;
display:block;
padding:0.9rem;
}


/* BOTÓN HAMBURGUESA */
.menu-toggle{
display:block;
font-size:2rem;
padding-right:10px;
}

/* MENÚ DESPLEGABLE */
.nav{
display:none;
position:absolute;
top:60px;
left:0;
width:100%;
background:#F2B705;
flex-direction:column;
padding:0;
box-shadow:0 5px 10px rgba(0,0,0,0.15);
}

.menu-toggle{
color:#111;
font-weight:bold;
}

/* LISTA */
.nav ul{
flex-direction:column;
align-items:stretch;
gap:0;
}

/* LINKS */
.nav ul li{
width:100%;
border-bottom:1px solid rgba(0,0,0,0.1);
}

/* BOTONES DEL MENÚ */
.nav ul li a{
display:block;
padding:1rem;
font-size:1rem;
text-align:center;
}

/* ESTADO HOVER */
.nav ul li a:hover{
background:rgba(0,0,0,0.05);
}

/* CUANDO EL MENU ESTA ABIERTO */
.nav.active{
display:flex;
}


.mapa-container iframe {
    height: 500px;
  }

}

@media (max-width:768px){

.slider-proceso{
  height:260px;
}

.slide span{
  font-size:12px;
  padding:6px 10px;
}

}

@media (max-width:768px){

.arquitectura .hero-arquitectura{
  height:45vh;
  background-position:center;
  background-size:cover;
}



}


@media (max-width:768px){

.hero-arq-overlay h1{
  font-size:1.8rem;
}

}

@media (max-width:768px){

.arquitectura .hero-slider{
  height:45vh;
  margin-top:60px;
}

.arquitectura .slide img{
  object-fit:cover;
  object-position:center;
}

.arquitectura .slides{
  transition: transform 1.2s ease-in-out;
}

}

/* =====================================================
   ACUMULADORES DE AGUA / TRANQUES AGRÍCOLAS
===================================================== */

.nav ul {
  gap: 1.1rem;
}

.nav ul li a {
  font-size: 0.95rem;
}

.btn-primary,
.btn-secondary,
.btn-servicio {
  display: inline-block;
  margin-top: 1.2rem;
  padding: 0.85rem 1.4rem;
  border-radius: 8px;
  text-decoration: none;
  font-weight: 600;
  transition: 0.3s ease;
}

.btn-primary {
  background: #F2B705;
  color: #111111 !important;
}

.btn-primary:hover {
  background: #D99A00;
  transform: translateY(-2px);
}

.btn-secondary {
  background: transparent;
  color: #F2B705;
  border: 1px solid #F2B705;
}

.btn-secondary:hover {
  background: #F2B705;
  color: #111111;
}

.btn-servicio {
  background: #111111;
  color: #FFFFFF;
  font-size: 0.9rem;
}

.btn-servicio:hover {
  background: #F2B705;
  color: #111111;
}

.service-card-destacado {
  background: #111111;
  color: #FFFFFF;
  border: 2px solid #F2B705;
  position: relative;
  overflow: hidden;
}

.service-card-destacado::before {
  content: "Nuevo servicio";
  position: absolute;
  top: 1rem;
  right: -2.8rem;
  background: #F2B705;
  color: #111111;
  font-size: 0.72rem;
  font-weight: 700;
  padding: 0.35rem 3rem;
  transform: rotate(35deg);
}

.service-card-destacado p {
  color: #f3f3f3;
}

.home-acumuladores {
  background: #f5f5f5;
  padding: 5rem 0;
}

.home-acumuladores-grid {
  display: grid;
  grid-template-columns: 1.35fr 1fr;
  gap: 3rem;
  align-items: center;
}

.etiqueta-seccion {
  display: inline-block;
  background: rgba(242, 183, 5, 0.2);
  color: #111111;
  border-left: 4px solid #F2B705;
  padding: 0.35rem 0.8rem;
  border-radius: 4px;
  font-weight: 700;
  font-size: 0.85rem;
  margin-bottom: 1rem;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.home-acumuladores h2 {
  font-size: 2.1rem;
  margin-bottom: 1rem;
}

.home-acumuladores p {
  margin-bottom: 1rem;
  color: #333333;
}

.home-acumuladores-actions {
  display: flex;
  gap: 1rem;
  flex-wrap: wrap;
}

.home-acumuladores-datos {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
}

.home-dato {
  background: #111111;
  color: #FFFFFF;
  border-radius: 16px;
  padding: 1.5rem;
  min-height: 145px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  border-bottom: 5px solid #F2B705;
  box-shadow: 0 8px 20px rgba(0,0,0,0.10);
}

.home-dato strong {
  color: #F2B705;
  font-size: 2rem;
  line-height: 1.1;
  margin-bottom: 0.5rem;
}

.home-dato span {
  font-size: 0.92rem;
  color: #f1f1f1;
}

.acumuladores-page {
  background: #ffffff;
}

.hero-acumuladores {
  margin-top: 60px;
  min-height: 78vh;
  display: flex;
  align-items: center;
  background:
    linear-gradient(110deg, rgba(0,0,0,0.88), rgba(0,0,0,0.64)),
    radial-gradient(circle at 80% 20%, rgba(242,183,5,0.45), transparent 28%),
    linear-gradient(135deg, #111111 0%, #2f2f2f 55%, #F2B705 160%);
  color: #FFFFFF;
  padding: 6rem 0;
}

.hero-acumuladores .container {
  max-width: 1120px;
}

.hero-acumuladores h1 {
  font-size: clamp(2.2rem, 5vw, 4.2rem);
  line-height: 1.08;
  margin-bottom: 1.2rem;
  max-width: 900px;
}

.hero-acumuladores p {
  max-width: 800px;
  font-size: 1.13rem;
  color: #f5f5f5;
  margin-bottom: 1rem;
}

.hero-acumuladores .etiqueta-seccion {
  background: #F2B705;
  color: #111111;
  border-left: none;
}

.hero-botones {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  margin-top: 1.5rem;
}

.seccion-intro-acumuladores {
  padding: 5rem 0;
}

.intro-grid-acumuladores {
  display: grid;
  grid-template-columns: 1.15fr 0.85fr;
  gap: 3rem;
  align-items: start;
}

.texto-destacado {
  font-size: 1.08rem;
  color: #333333;
  margin-bottom: 1rem;
}

.lista-alcance {
  background: #111111;
  color: #FFFFFF;
  border-radius: 18px;
  padding: 2rem;
  border-left: 8px solid #F2B705;
}

.lista-alcance h3 {
  color: #F2B705;
  margin-bottom: 1rem;
}

.lista-alcance ul {
  padding-left: 1.2rem;
}

.lista-alcance li {
  margin-bottom: 0.6rem;
}

.grid-acumuladores {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 1.5rem;
  margin-top: 2rem;
}

.acumulador-card {
  background: #F5F5F5;
  padding: 2rem;
  border-radius: 18px;
  border-top: 5px solid #F2B705;
  box-shadow: 0 5px 15px rgba(0,0,0,0.06);
}

.acumulador-card h3 {
  margin-bottom: 0.8rem;
}

.proceso-acumuladores {
  background: #F2B705;
  padding: 5rem 0;
}

.proceso-acumuladores h2,
.proceso-acumuladores .subtitulo-seccion {
  text-align: center;
}

.subtitulo-seccion {
  max-width: 780px;
  margin: 0.8rem auto 2rem;
  color: #444444;
}

.proceso-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 1.3rem;
  margin-top: 2rem;
}

.paso-acumulador {
  background: #FFFFFF;
  border-radius: 16px;
  padding: 1.6rem;
  box-shadow: 0 5px 16px rgba(0,0,0,0.08);
}

.paso-acumulador span {
  display: inline-flex;
  width: 42px;
  height: 42px;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: #111111;
  color: #F2B705;
  font-weight: 800;
  margin-bottom: 1rem;
}

.caso-bucalemu {
  background: #111111;
  color: #FFFFFF;
  padding: 5rem 0;
}

.caso-grid {
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: 3rem;
  align-items: center;
}

.caso-bucalemu h2 {
  color: #FFFFFF;
  margin-bottom: 1rem;
}

.caso-bucalemu p {
  color: #f2f2f2;
  margin-bottom: 1rem;
}

.caso-bucalemu .etiqueta-seccion {
  background: #F2B705;
  color: #111111;
  border-left: none;
}

.caso-datos {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
}

.caso-dato {
  background: #FFFFFF;
  color: #111111;
  padding: 1.5rem;
  border-radius: 16px;
  min-height: 130px;
  border-bottom: 5px solid #F2B705;
}

.caso-dato strong {
  display: block;
  color: #111111;
  font-size: 1.75rem;
  line-height: 1.1;
  margin-bottom: 0.5rem;
}

.caso-dato span {
  color: #444444;
  font-size: 0.92rem;
}

.alcance-final-acumuladores {
  background: #f5f5f5;
  padding: 5rem 0;
}

.alcance-box {
  max-width: 980px;
  margin: auto;
  background: #FFFFFF;
  padding: 2.5rem;
  border-radius: 18px;
  border-left: 8px solid #F2B705;
  box-shadow: 0 5px 18px rgba(0,0,0,0.08);
}

.cta-acumuladores {
  background: #111111;
  color: #FFFFFF;
  text-align: center;
  padding: 5rem 2rem;
}

.cta-acumuladores p {
  max-width: 720px;
  margin: 1rem auto 0;
  color: #f2f2f2;
}

@media (max-width: 980px) {
  .nav ul {
    gap: 0.75rem;
  }

  .nav ul li a {
    font-size: 0.88rem;
  }

  .home-acumuladores-grid,
  .intro-grid-acumuladores,
  .caso-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 768px) {
  .home-acumuladores-grid,
  .intro-grid-acumuladores,
  .caso-grid {
    gap: 2rem;
  }

  .home-acumuladores h2,
  .hero-acumuladores h1 {
    font-size: 1.9rem;
  }

  .home-acumuladores-datos,
  .caso-datos {
    grid-template-columns: 1fr;
  }

  .home-dato,
  .caso-dato {
    min-height: auto;
  }

  .hero-acumuladores {
    min-height: 70vh;
    padding: 4rem 0;
  }

  .hero-acumuladores p {
    font-size: 1rem;
  }

  .hero-botones,
  .home-acumuladores-actions {
    flex-direction: column;
  }

  .hero-botones a,
  .home-acumuladores-actions a {
    width: 100%;
    text-align: center;
  }

  .lista-alcance,
  .alcance-box {
    padding: 1.5rem;
  }
}