/* ===========================================
   _categorias.css
   Estilos exclusivos para CATEGORIA-GASEX
   Estructura y secciones asociadas al producto individual.
=========================================== */

/* > CATEGORIA CILINDRO-GASEX
  ° ESTRUCTURA HEADER
    * SECCION: CABECERA-CATEGORIA
    * SECCION: BANNER-VOLUMEN
    * SECCION: IMAGEN-VOLUMEN
    * SECCION: OPINIONES
    * SECCION: SECCION-IMAGENES-2
    * SECCION: CILINDROS
    * SECCION: SECCION-BANNER
    * SECCION: DETALLE-REGULADORES
    * SECCION: BANNER-HERRAMIENTAS
    * SECCION: COMPARADOR-PRODUCTOS
    * SECCION: PRODUCTOS-RELACIONADOS-3
    * SECCION: BANNER-DESCUBRE
    * SECCION: COMPRATE
  ° SECCION: FOOTER */


/* > CATEGORIA EQUIPOS-GASEX
  ° ESTRUCTURA HEADER
    * SECCION: SECCION-EQUIPOS
    * SECCION: BANNER-EQUIPOS
    * SECCION: YA-CONOCES
    * SECCION: OPINIONES
    * SECCION: GRUPO-IMAGENES
    * SECCION: SECCION-BANNER
    * SECCION: TENEMOS-TODO
    * SECCION: COMPARADOR-PRODUCTOS
    * SECCION: DUO-IMAGENES
    * SECCION: NECESITAS
    * SECCION: BANNER-MEDICOS
    * SECCION: IMAGENES-MEDICAS
  ° SECCION: FOOTER */


/* > CATEGORIA GASEX-GASEX
  ° ESTRUCTURA HEADER
    * SECCION: CABECERA-GASEX
    * SECCION: BANNER-REGULADORES
    * SECCION: IMAGEN-VOLUMEN
    * SECCION: SECCION-IMAGENES-2
    * SECCION: BANNER-GASEX-CILINDROS
    * SECCION: DETALLE-REGULADORES
    * SECCION: OPINIONES
    * SECCION: SECCION-BANNER
    * SECCION: COMPARADOR-PRODUCTOS
    * SECCION: PRODUCTOS-RELACIONADOS-3
    * SECCION: IMAGENES-HAZTE-GASEX
  ° SECCION: FOOTER */


/* > CATEGORIA HERRAMIENTAS-GASEX
  ° ESTRUCTURA HEADER
    * SECCION: SECCION-HERRAMIENTAS
    * SECCION: HERRAMIENTAS
    * SECCION: OPINIONES
    * SECCION: SECCION-IMAGENES-1
    * SECCION: TENEMOS-TODO
    * SECCION: SECCION-IMAGENES-2
    * SECCION: POTENCIA
    * SECCION: BANNER-HERRAMIENTAS
    * SECCION: COMPARADOR-PRODUCTOS
    * SECCION: IMAGENES-HERRAMIENTAS
  ° SECCION: FOOTER */


  /* > CATEGORIA INSUMOS-GASEX
  ° ESTRUCTURA HEADER
    * SECCION: SECCION-HERRAMIENTAS
    * SECCION: INSUMOS-IMAGENES-4
    * SECCION: SEPARADOR
    * SECCION: BANNER-INSUMOS
    * SECCION: TENEMOS-TODO
    * SECCION: SECCION-IMAGENES-2
    * SECCION: SEPARADOR
    * SECCION: TEXTO
    * SECCION: UN-MUNDO
    * SECCION: BANNER-CARRUSEL
    * SECCION: INSUMOS-IMAGENES-2
    * SECCION: OPINIONES
  ° SECCION: FOOTER */


/************************************* > CATEGORIA CILINDRO-GASEX < *********************************

/* ================================
SECCION: CABECERA-CATEGORIA
================================== */
/* .cabecera-categoria {
  padding: 2rem 2rem;
  box-sizing: border-box;
  text-align: center;
  background: #fff;
}

.titulo-cabecera {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 2rem;
}

.titulo-box-cabecera {
  font-weight: bold;
  font-size: 1.875rem;
  color: #1C244B;
  background-color: #fff;
}

.categorias-cabecera {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 1rem;
}

.categorias-cabecera .cabecera-item {
  width: 80px;   
  text-align: center;
  font-weight: bold;
  font-size: 0.75rem;
  color: #000;
}

.categorias-cabecera .cabecera-item img {
  width: 100%;
  height: auto;
  margin-bottom: 0.5rem;
  display: block;
}


.categorias-cabecera .cabecera-item a { color: inherit; text-decoration: none; }
.categorias-cabecera .cabecera-item a:hover { text-decoration: none; } */


/* ================================
SECCION: BANNER-VOLUMEN
================================== */
/* .banner-volumen {
  background-image: url('../img/INFOGRAFIA.webp');
  background-size: cover;
  background-position: center;
  color: #ffffff;
  padding: 2rem;
}

.cabecera-volumen {
  max-width: 1140px;
  margin: 0 auto;
}

.cabecera-volumen img {
  width: 9.063rem;
}

.titulo-volumen {
  font-size: 1.875rem;
  font-weight: 800;
  text-decoration: underline;
  text-underline-offset: 10px;
  margin: 2rem 0 1rem;
  text-align: center;
}

.texto-volumen {
  font-size: 1rem;
  font-weight: bold;
  margin-bottom: 2rem;
  text-align: center;
}

.seccion-volumen { padding: 1rem 0; }

.contenedor-volumen {
  display: flex;
  flex-wrap: wrap;
  gap: 2rem;
  justify-content: space-between;
}

.columna-volumen { flex: 1 1 45%; font-size: 1rem; font-weight: bolder; line-height: 1.6; }

.columna-1-volumen { text-align: right; padding-right: 2rem; }

.formula-volumen {
  border: 2px solid white;
  padding: 15px;
  font-size: 1.5rem;
  font-weight: bold;
  text-align: center;
  margin: 10px 0;
  border-radius: 8px;
}

@media (max-width: 768px) {
  .contenedor-volumen { flex-direction: column; gap: 1.5rem; }
  .columna-1-volumen { text-align: center; padding-right: 0; }
  .titulo-volumen, .texto-volumen { text-align: center; }
  .formula-volumen { font-size: 1.25rem; }
} */


/* ================================
* SECCION: IMAGEN-VOLUMEN
================================== */
/* .imagen-volumen {
  padding: 2rem;
  max-width: 1140px;
  margin: 0 auto;
}

.titulo-imagen-volumen {
  text-align: center;
  font-size: 2.5rem;
  font-weight: 700;
  margin-bottom: 2rem;
}

.grid-imagen-volumen {
  display: grid;
  text-align: center;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
}

.imagen-rectangular {
  width: 100%;
  height: 12rem;
  overflow: hidden;
}


.contenido-imagen-volumen {
  padding: 1rem;
}

.contenido-imagen-volumen p {
  font-size: 1rem;
  font-weight: bold;
  color: #333333;
  text-align: center;
}

.separador-linea {
  margin: 2rem auto;
  height: 2px;
  background-color: #808080;
  width: 13.125rem;
} */

/* ================================
* SECCION: OPINIONES
================================== */

/* ================================
* SECCION: SECCION-IMAGENES-2
================================== */
/* .seccion-imagenes {
  margin: 0 auto;
  padding: 1rem 0rem;
  box-sizing: border-box;
}

.fila1 {
  display: flex;
  gap: 1.25rem;
  justify-content: space-between;
  margin-bottom: 1.25rem;
}

.fila1 .imagen1,
.fila1 .imagen2 {
  position: relative;
  height: 21.18rem;
  overflow: hidden;
}

.fila1 .imagen1 {
  flex: 1;
}

.fila1 .imagen2 {
  flex: 0 0 48.94rem;
  max-width: 48.94rem;
}

.fila1 img,
.fila2 img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  border-radius: 4px;
}

.fila2 .imagen-grande {
  width: 100%;
  position: relative;
  height: auto;
}

.fila2 .imagen-grande img {
  height: 21.18rem;
}

.fila3 {
  display: flex;
  gap: 1.25rem; 
  justify-content: space-between;
  margin-top: 1.25rem;
}

.fila3 .imagen4,
.fila3 .imagen3 {
  position: relative;
  height: 21.18rem;
  overflow: hidden;
}

.fila3 .imagen4 {
  flex: 1;
}

.fila3 .imagen3 {
  flex: 0 0 48.94rem;
  max-width: 48.94rem;
}

.fila3 img,
.fila4 img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  border-radius: 4px;
}

.texto-superpuesto {
  position: absolute;
  bottom: 0px;
  left: 0px;
  color: white;
  background-color: rgba(0, 0, 0, 0.6);
  padding: 1rem;
  font-weight: bold;
  border-radius: 4px;
  font-size: 1rem;
  text-align: center;
}

@media (max-width: 768px) {
  .seccion-imagenes {
    max-width: 100%;
    padding: 1rem;
  }

  .fila1 {
    flex-direction: column;
  }

  .fila1 .imagen1,
  .fila1 .imagen2 {
    height: auto;
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.seccion-imagenes.is-editor-preview {
  transform: scale(.8);
  transform-origin: top left;
  width: 125%;
} */

/* ================================
* SECCION: CILINDROS
================================== */
/* .titulo-cilindro {
font-size: 1.875rem;
font-weight: bold;
color: #292422;
}

.cilindro img {
    height: 337px;
    width: 100%;
}

.cilindro p {
    font-size: 0.875rem;
    text-align: center;
    color: #777777;
} */

/* ================================
* SECCION: SECCION-BANNER
================================== */

/* ================================
* SECCION: DETALLE-REGULADORES
================================== */
/* .contenedor-detalle-reguladores {

  margin: auto;
  display: flex;
  flex-wrap: wrap;
  gap: 2.5rem;
  justify-content: center;
  padding: 2rem;
}

.columna-detalle-reguladores h2{
  flex: 1 1;
  text-align: left;
  font-size: 1.75rem;
  font-weight: bolder;
  line-height: 1.6;
  gap: 3rem;
  text-align: center;
}

.contenedor-etiquetas-reguladores {
display: flex;
background-color: #DDDDDD;
padding: 1rem;
gap: 1rem;
width: 28.75rem;
justify-content: center;
}

.tarjeta-reguladores {
  width: 8.375rem;
  position: relative;
}

.descuento {
  position: absolute;
  top: 5px;
  left: 5px;
  background-color: #E60000;
  color: #fff;
  font-size: 0.75rem;
  font-weight: bold;
  padding: 3px 6px;
  border-radius: 4px;
  z-index: 10;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
}

.descuento-2 {
  position: absolute;
  top: 5px;
  left: 5px;
  background-color: #62B959;
  color: #fff;
  font-size: 0.75rem;
  font-weight: bold;
  padding: 3px 6px;
  border-radius: 4px;
  z-index: 10;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
}

.descuento-3 {
  position: absolute;
  top: 30px;
  left: 5px;
  background-color: #E60000;
  color: #fff;
  font-size: 0.75rem;
  font-weight: bold;
  padding: 3px 6px;
  border-radius: 4px;
  z-index: 10;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
}
.nombre-reguladores {
    font-size: 0.813rem;
    font-weight: 600;
    color: #222529;
}

.categoria-regulador {
    font-size: 0.625rem;
    color: #777777;
}

.precio-reguladores {
    font-size: 1.125rem;
    font-weight: bold;
    color: #444444;
}

.btn-reguladores {
    font-size: 0.625rem;
    font-weight: bolder;
    padding: 0.3rem 2rem;
}

.tachado {
    text-decoration: line-through;
    color: #A7A7A7;
} */

/* ================================
* SECCION: BANNER-HERRAMIENTAS
================================== */
/* .banner-herramientas {
  height: auto;
  background-image: url('img/BANNER-PARA-HERRAMIENTAS.webp');
  background-size: cover;
  position: relative;
}

.banner-herramientas-contenido {
  color: #ffffff;
  padding: 1rem 6rem 6rem 6rem;
  position: relative;
}

.banner-herramientas-contenido img {
  width: 9.063rem;
  position: absolute;
  bottom: 0;
  right: 0;
  padding: 2rem 2rem;
} */

/* .banner-herramientas-titulo {
  font-size: 2.5rem;
  font-weight: 800;
  text-shadow: 4px 4px 3px rgba(0, 0, 0, 0.667);
} */


/* ================================
* SECCION: COMPARADOR-PRODUCTOS
================================== */

/* ================================
* SECCION: PRODUCTOS-RELACIONADOS-3
================================== */
/* .productos-relacionados-3 {
  padding: 4rem 0rem;
  background-color: #fff;
  color: #1C244B;
  font-family: 'Montserrat', sans-serif;
}

.productos-relacionados-3 h2 {
  font-size: 1.4rem;
  font-weight: 700;
  margin-bottom: 1.5rem;
  margin-left: 3rem;
}

.contenedor-relacionados-3 {
  width: 100%;
  max-width: 100%;
  padding: 0 2rem;
  box-sizing: border-box;
  overflow-x: hidden;
}


.contenedor-relacionados-3::-webkit-scrollbar {
  display: none;
}

.carrusel-relacionados-3 {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 1rem;
}

.tarjeta-relacionados-3 {
  width: 9.375;
}

.tarjeta-relacionados-3 img {
  width: 100%;
  height: auto;
}

.contenido-relacionados-3 {
  padding: 0.75rem;
  margin-top: 0px;
  border: 2px solid #BCC1C3;
}

.nombre-relacionados-3 {
  font-size: 0.8rem;
  font-weight: 500;
  color: #1C244B;
  margin-bottom: 0.5rem;
  text-transform: uppercase;
}

.precio-relacionados-3 {
  font-size: 0.9rem;
  font-weight: 700;
  margin-bottom: 0.8rem;
}

.btn-relacionados-3{
  background-color: #0F1B31;
  border: 2px solid #fff;
  color: #fff;
  padding: 0.5rem;
  font-size: 0.8rem;
  border-radius: 22px;
  cursor: pointer;
  transition: all 0.3s ease;
}

.btn-relacionados-3:hover {
  background-color: #fff;
  color: #0F1B31;
  border-color: #0F1B31;
} */

/* ===== Overlay blanco por defecto en cada tarjeta ===== */
/* .productos-relacionados-3 .tarjeta-relacionados-3{
  position: relative;
  overflow: hidden;       
  display: flex;            
  flex-direction: column;
  height: 100%;
} */

/* Capa translúcida (visible por defecto) */
/* .productos-relacionados-3 .tarjeta-relacionados-3::before{
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(255,255,255,.65);
  opacity: 1;
  transition: opacity .25s ease;
  z-index: 2;
  pointer-events: none; 
} */

/* Quitar overlay al pasar el mouse o al navegar con teclado */
/* .productos-relacionados-3 .tarjeta-relacionados-3:hover::before,
.productos-relacionados-3 .tarjeta-relacionados-3:focus-within::before{
  opacity: 0;
} */

/* ===== Contenido y tipografía ===== */
/* .productos-relacionados-3 .contenido-relacionados-3{
  display: flex;
  flex-direction: column;
  gap: .5rem;
  text-align: center;
  flex: 1;             
} */

/* Opcional: normaliza altura del nombre para alinear botones */
/* .productos-relacionados-3 .nombre-relacionados-3{
  min-height: 3.2rem;  
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
} */

/* ===== Botón: tamaño y alineación uniformes ===== */
/* .productos-relacionados-3 .btn-relacionados-3{
  align-self: center;   
  margin-top: auto; 
  width: 80%;        
  max-width: 240px;
  padding: .5rem .9rem;  
  font-size: .78rem;               
  line-height: 1.1;
  border-radius: 999px;
} */

/* Hover existente (respetado) */
/* .productos-relacionados-3 .btn-relacionados-3:hover{
  background-color: #fff;
  color: #0F1B31;
  border-color: #0F1B31;
} */

/* ===== Imagen: asegura que no desborde ===== */
/* .productos-relacionados-3 .rel3-img-link img{
  display: block;
  width: 100%;
  height: auto;
} */


/* ================================
* SECCION: BANNER-DESCUBRE
================================== */
/* .banner-descubre {
  height: 19rem;
  width: auto;
  background-image: url('img/BANNER-ARGON.webp');
  background-size: cover;
  background-position: center;
  position: relative;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}

.contenido-descubre {
  padding: 2rem;
  gap: 1rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.contenido-descubre h2 {
  font-size: 1.875rem;
  font-weight: 700;
  padding-bottom: 4rem;
}

.contenido-descubre img {
width: 5.563rem;
}

.btn-descubre {
width: 5.563rem;
padding: 0.5rem 1.5rem;
background: #2A2A2A;
color: #fff;
font-weight: 600;
font-size: 1rem;
border-radius: 0.5rem;
text-decoration: none;
transition: background 0.3s;
display: flex;
justify-content: center;
}

.btn-descubre:hover {
  background: #fff;
  color: #003866;
} */


/* ================================
* SECCION: COMPRATE
================================== */
/* .seccion-comprate {
  margin: 0 auto;
  padding: 1rem;
  box-sizing: border-box;
}

.seccion-comprate h2 {
font-size: 1.875rem;
font-weight: bold;
text-align: center;
}


.comprate {
  display: flex;
  gap: 1rem;
  justify-content: space-between;
  margin-bottom: 1.25rem;

}

.comprate .imagen {
  position: relative;
  height: 14rem;
  overflow: hidden;
}


.comprate img {
  width: 14rem;
  height: 100%;
  object-fit: cover;
  display: block;
  border-radius: 0.25rem;

}


.texto-comprate {
  position: absolute;
  bottom: 0px;
  left: 0px;
  color: white;
  background-color: rgba(0, 0, 0, 0.6);
  padding: 1rem 1rem;
  font-weight: bold;
  border-radius: 4px;
  font-size: 1rem;
}


@media (max-width: 768px) {
  .seccion-imagenes {
    max-width: 100%;
    padding: 1rem;
  }

  .fila1 {
    flex-direction: column;
  }

  .fila1 .imagen1,
  .fila1 .imagen2 {
    height: auto;
    flex: 1 1 100%;
    max-width: 100%;
  }
} */









/************************************* > CATEGORIA EQUIPOS-GASEX < *********************************

/* ================================
* SECCION: SECCION EQUIPOS
================================== */
/* .seccion-equipos {
  padding: 2rem 0rem;
  box-sizing: border-box;
  text-align: center;
}

.titulo-equipos {
  display: flex;
  margin-bottom: 2rem;
}

.titulo-box-equipos {
  font-weight: bold;
  font-size: 2.25rem;
  background-color: #fff;
}

.categorias-equipos {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
}

.item-equipos {
  width: 10rem;
  font-weight: bold;
  font-size: 1rem;
  color: #000;
}

.item-equipos img {
  width: 100%;
  height: 6.063rem;
  margin-bottom: 0.5rem;
}

.seccion-equipos p {
text-align: left ;
text-decoration: none;
} */

/* ================================
* SECCION: BANNER-EQUIPOS
================================== */
    /* .banner-equipos {
      display: flex;
      width: auto;
      height: 28.3125rem;
      background-color: #003966;
      color: #fff;
      overflow: hidden;
      border-radius: 0.5rem;
    }

    .imagen-equipos {
      flex: 1;
      position: relative;
    }

    .imagen-equipos img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
    }

    .contenido-equipos {
      flex: 1;
      padding: 2rem;
      box-sizing: border-box;
      display: flex;
      flex-direction: column;
      justify-content: center;

    }

    .descripcion-equipos {
      font-size: 1rem;
      font-weight: 400;
      line-height: 1.5;
    } */

/* Texto superpuesto */
/* .texto-superpuesto {
  position: absolute;
  bottom: 0rem;
  left: 0rem;
  color: white;
  background-color: rgba(0, 0, 0, 0.6);
  padding: 1rem;
  font-weight: bold;
  border-radius: 4px;
  font-size: 1.063rem;
  text-align: center;
} */

/* ================================
* SECCION: YA-CONOCES
================================== */
.ya-conoces h2{
font-size: 2.25rem;
text-align: center;
}

.contenido-ya {
display: flex;
justify-content: center;
gap: 1rem;
}

/* Caja uniforme: cuadrado 232x232 (o relación 1:1 responsive) */
.ya-conoces .contenido-ya a{
  display: block;
  width: 22rem;              /* si prefieres fluido, quita esto */
  aspect-ratio: 1 / 1;       /* mantiene cuadrado sin fijar height */
  overflow: hidden;          /* recorta lo que sobresale */
  border-radius: 8px;        /* opcional */
}

.ya-conoces .contenido-ya img{
  width: 100%;
  height: 100%;
  object-fit: cover;         /* llena el cuadro sin deformar */
  object-position: center;   /* foco (cámbialo a 'top', '50% 30%', etc.) */
}


/* ================================
* SECCION: OPINIONES
================================== */

/* ================================
* SECCION: GRUPO-IMAGENES
================================== */
    /* .grid-principal {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 1rem;
      padding: 0rem 2rem;
    }

    .grupo-imagenes h2{
        font-size: 2.25rem;
        padding: 0rem 2rem;
    }

    .columna {
      display: flex;
      flex-direction: column;
      gap: 1rem;
    }

    .fila-superior img {
      width: 40rem;
      height: 42rem;
      display: block;
      border-radius: 8px;
        object-fit: cover;
  object-position: center; 
    }

    .fila-inferior {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 1rem;
    }

    .fila-inferior img {
      width: 100%;
      height: 16rem;
      display: block;
      border-radius: 8px;
        object-fit: cover;
  object-position: center;
    }

    @media (max-width: 768px) {
      .grid-principal {
        grid-template-columns: 1fr;
      }
    } */

/* ================================
* SECCION: SECCION-BANNER
================================== */

/* ================================
* SECCION: TENEMOS-TODO
================================== */

/* ================================
* SECCION: COMPARADOR-PRODUCTOS
================================== */

/* ================================
* SECCION: DUO-IMAGENES
================================== */
/* .duo-imagenes {
  margin: 0 auto;
  box-sizing: border-box;
}

.fila1 {
  display: flex;
  gap: 1.25rem;
  justify-content: space-between;
  margin-bottom: 1.25rem;
}

.fila1 .imagen1,
.fila1 .imagen2 {
  position: relative;
  overflow: hidden;
}

.fila1 .imagen1 {
  flex: 1;
}

.fila1 .imagen2 {
  flex: 1;
}

.fila1 img {
  object-fit: cover;
  display: block;
  border-radius: 4px;
}

.fila1 .titulo1 {
position: absolute;
bottom: 2rem;
left: 1rem;
font-size: 1.5rem;
font-weight: bolder;
color: #fff;
text-shadow: 4px 4px 3px rgba(0, 0, 0, 0.667);
}

.fila1 .titulo2 {
position: absolute;
top: 2rem;
left: 1rem;
font-size: 1.5rem;
font-weight: bolder;
color: #fff;
text-shadow: 4px 4px 3px rgba(0, 0, 0, 0.667);
}

.texto-superpuesto1 {
  position: absolute;
  top: 0rem;
  left: 0rem;
  color: white;
  background-color: rgba(0, 0, 0, 0.6);
  padding: 1rem;
  font-weight: bold;
  border-radius: 4px;
  font-size: 1.063rem;
  text-align: center;
}

.texto-superpuesto2 {
  position: absolute;
  bottom: 0rem;
  left: 0rem;
  color: white;
  background-color: rgba(0, 0, 0, 0.6);
  padding: 1rem;
  font-weight: bold;
  border-radius: 4px;
  font-size: 1.063rem;
  text-align: center;
}


.duo-imagenes .imagen1,
.duo-imagenes .imagen2{
  width: 32rem;
  height: 40rem;
  overflow: hidden;
}

.duo-imagenes .imagen1 img,
.duo-imagenes .imagen2 img{
  width: 100%;
  height: 100%;
  object-fit: cover; 
  object-position: center;
  display: block;
}

@media (max-width: 1024px){
  .duo-imagenes .imagen1,
  .duo-imagenes .imagen2{
    width: 100%;
    height: auto;
    aspect-ratio: 468 / 618;
  }
} */


/* ================================
* SECCION: NECESITAS
================================== */
/* .necesitas h2{
font-size: 2.25rem;
text-align: center;
}

.contenido-necesitas {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 1rem;
}

.necesitas img{
  width: 100%;
  height: auto;
}

.tarjeta-necesitas {
  width: 9.375;
}

.texto-necesitas {
  padding: 0.75rem;
  margin-top: -5px;
  text-align: center;
}

.nombre-necesitas {
    font-size: 0.813rem;
    font-weight: 600;
    color: #222529;
    text-align: left;
}

.categoria-necesitas {
    font-size: 0.625rem;
    color: #777777;
    text-align: left;
    text-transform: uppercase;
}

.precio-necesitas {
    font-size: 1.125rem;
    font-weight: bold;
    color: #444444;
    text-align: left;
}

.btn-necesitas {
    font-size: 0.625rem;
    font-weight: bolder;
    padding: 0.3rem 2rem;
    border: none;
}

.tachado {
    text-decoration: line-through;
    color: #A7A7A7;
} */

/* ================================
* SECCION: BANNER-MEDICOS
================================== */
/* .cabecera-medicos {
  height: auto;
  background-image: url('img/BANNER-PARA-EQUIPOS-MEDICOS.webp');
  background-size: cover;
  position: relative;
}

.medicos-contenido {
  color: #ffffff;
  padding: 1rem 6rem 6rem 6rem;
  position: relative;
}

.medicos-contenido img {
  width: 9.063rem;
  position: absolute;
  bottom: 0;
  left: 0;
  padding: 2rem 2rem;
}

.medicos-titulo {
  font-size: 2.5rem;
  font-weight: 800;
  text-shadow: 4px 4px 3px rgba(0, 0, 0, 0.667);
  text-align: right;
} */




/* Aplica a tu banner */
/* .cabecera-medicos{
  position: relative;
  background-size: cover;
  background-position: center;
} */

/* Tinte azul encima de cualquier fondo */
/* .cabecera-medicos::after{
  content: "";
  position: absolute;
  inset: 0;
  background: #0f4c81;  
  opacity: .55;    
  mix-blend-mode: multiply;
  pointer-events: none;
} */

/* Asegura que el contenido quede encima del overlay */
/* .cabecera-medicos > *{ position: relative; z-index: 1; } */

/* ================================
* SECCION: IMAGENES-MEDICAS
================================== */
/* .seccion-medicas {
  margin: 0 auto;
  padding: 1rem;
  box-sizing: border-box;
}

.medicas {
  display: flex;
  gap: 1rem;
  justify-content: space-between;
  margin-bottom: 1.25rem;
}

.medicas .imagen {
  position: relative;
  height: 22rem;
  width: 20rem;
  overflow: hidden;
}

.medicas img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  border-radius: 0.25rem;
}

.texto-medicas {
  position: absolute;
  bottom: 0px;
  left: 0px;
  color: white;
  background-color: rgba(0, 0, 0, 0.6);
  padding: 1rem 1rem;
  font-weight: bold;
  border-radius: 4px;
  font-size: 1rem;
} */








/************************************* > CATEGORIA GASEX-GASEX < *********************************

/* ================================
* SECCION: CABECERA-CATEGORIA
================================== */

/* ================================
* SECCION: BANNER-REGULADORES
================================== */
/* .banner-cilindros {
  text-align: center;
}

.titulo-cilindros {
  font-size: 2rem;
  font-weight: 800;
  color: #1C244B;
  margin-bottom: 1.5rem;
}

.contenedor-imagen {
  position: relative;
  overflow: hidden;
  height: 30rem;
}

.contenedor-imagen img {
  width: 100%;
  height: 100%;
  display: block;
} */

/* Texto superpuesto en parte inferior */
/* .texto-superpuesto {
  position: absolute;
  bottom: 0;
  height: 40%;
  background: rgba(0, 0, 0, 0.7);
  color: #ffffff;
  padding: 1rem 2rem;
  font-size: 1rem;
  line-height: 1.6;
  text-align: center;
  align-content: center;
}

@media (max-width: 768px) {
  .texto-superpuesto {
    font-size: 0.95rem;
    padding: 1rem;
  }

  .titulo-cilindros {
    font-size: 1.5rem;
  }
} */

/* ================================
* SECCION: IMAGEN-VOLUMEN
================================== */

/* ================================
* SECCION: SECCION-IMAGENES-2
================================== */

/* ================================
* SECCION: BANNER-GASEX-CILINDROS
================================== */

/* ================================
* SECCION: DETALLE-REGULADORES
================================== */

/* ================================
* SECCION: OPINIONES
================================== */

/* ================================
* SECCION: SECCION-BANNER
================================== */

/* ================================
* SECCION: COMPARADOR-PRODUCTOS
================================== */

/* ================================
* SECCION: PRODUCTOS-RELACIONADOS-3
================================== */

/* ================================
* SECCION: IMAGENES-HAZTE-GASEX
================================== */
/* .hazte-gasex {
  text-align: center;
}

.titulo-hazte {
  font-size: 1.875rem;
  font-weight: 800;
  color: #222529;
  margin-bottom: 2rem;
}

.grid-hazte {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1rem;
  margin: 0 auto;
}

.item {
  position: relative;
  overflow: hidden;
  height: 22rem;
}

.item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: filter 0.3s ease, transform 0.3s ease;
}

.item:hover img {
  filter: brightness(100%);
  transform: scale(1.05);
}

.etiqueta {
  position: absolute;
  bottom: 0rem;
  left: 0rem;
  background-color: rgba(0, 0, 0, 0.445);
  color: #fff;
  padding: 1rem;
  font-weight: bold;
  font-size: 0.9rem;
}

@media (max-width: 992px) {
  .grid-hazte {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 576px) {
  .grid-hazte {
    grid-template-columns: 1fr;
  }
} */















/************************************* > CATEGORIA HERRAMIENTAS-GASEX < *********************************

/* ================================
 * SECCION: SECCION-HERRAMIENTAS
 * ================================ */
/* .seccion-herramientas{
  padding: 2rem 0;
  box-sizing: border-box;
  text-align: center;
}

.titulo-herramientas{ display:flex; margin-bottom:2rem; }
.titulo-box-herramientas{ font-weight:700; font-size:2.25rem; background:#fff; }


.categorias-herramientas{
  display: flex;
  flex-wrap: nowrap; 
  justify-content: flex-start;
  align-items: stretch;
  gap: 1rem;
  width: 100%;
  min-width: 0;
}

.item-herramientas{
  flex: 0 1 15rem;       
  max-width: 15rem;  
  min-width: 9rem;   
  font-weight: 700;
  font-size: 1rem;
  color: #000;
  display: block;
  min-height: 0;    
}


.item-herramientas img{
  display:block;
  width:100%;
  height:9.188rem;    
  object-fit:cover;   
  margin-bottom:.5rem;
}

.seccion-herramientas p{ text-align:left; }

@media (max-width: 1024px){
  .categorias-herramientas{
    flex-wrap: wrap;  
  }
  .item-herramientas{
    flex: 1 1 15rem;   
    max-width: 15rem;
  }
}

@media (max-width: 700px){
  .item-herramientas{ flex-basis: 48%; max-width: none; }
  .item-herramientas img{ height:8.5rem; }
}

@media (max-width: 480px){
  .item-herramientas{ flex-basis: 100%; }
  .item-herramientas img{ height:9.188rem; }
} */


/* ================================
* SECCION: HERRAMIENTAS
================================== */
/* .herramientas {
  box-sizing: border-box;
}

.fila-herramientas .imagen-herramientas {
  position: relative;
  overflow: hidden;

} */

/* Imágenes */
/* .fila-herramientas img {
  width: 100%;
  height: 26.5rem;
  display: block;
  border-radius: 0.5rem;
  object-fit: cover; 
}

.texto-superpuesto-herramientas {
  position: absolute;
  bottom: 0rem;
  left: 0rem;
  color: white;
  background-color: rgba(0, 0, 0, 0.6);
  padding: 1rem;
  font-weight: bold;
  border-radius: 4px;
  font-size: 1.063rem;
  text-align: center;
}

.texto-inferior {
  background-color: #003966;
  color: #fff;
  padding: 2rem;
  margin-top: 2rem;
  border-radius: 0.5rem;
} */

/* ================================
* SECCION: OPINIONES
================================== */

/* ================================
* SECCION: SECCION-IMAGENES-1
================================== */

/* .titulo-seccion {
  text-align: center;
  font-weight: 700;
  font-size: 2rem;
  margin-bottom: 1rem;
}


.grid-imagenes {
  display: grid;
  grid-template-columns: 50% 25% 25%;
  grid-template-rows: 50% 50%;
  gap: 0.5rem;
  width: 98%;
  height: 26.25rem;
  position: relative;
}


.imagen {
  position: relative;
  overflow: hidden;
}

.imagen img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.etiqueta {
  position: absolute;
  bottom: 0;
  left: 0;
  background-color: rgba(0,0,0,0.7);
  color: white;
  padding: 0.3rem 0.8rem;
  font-size: 0.85rem;
  font-weight: 600;
  text-transform: uppercase;
}


.imagen-electricas {
  grid-column: 1 / 2;
  grid-row: 1 / 3;
}

.imagen-napoleon {
  grid-column: 2 / 4;
  grid-row: 1 / 2;
}

.imagen-chicharra {
  grid-column: 2 / 3;
  grid-row: 2 / 3;
}

.imagen-caiman {
  grid-column: 3 / 4;
  grid-row: 2 / 3;
}


@media (max-width: 960px) {
  .grid-imagenes {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto;
    grid-auto-rows: minmax(150px, auto);
    height: auto;
  }

  .imagen-electricas {
    grid-column: 1 / 3;
    grid-row: auto;
  }

  .imagen-napoleon {
    grid-column: 1 / 3;
    grid-row: auto;
  }

  .imagen-chicharra,
  .imagen-caiman {
    grid-column: span 1;
    grid-row: auto;
  }
}


@media (max-width: 600px) {
  .grid-imagenes {
    grid-template-columns: 1fr;
  }

  .imagen-electricas,
  .imagen-napoleon,
  .imagen-chicharra,
  .imagen-caiman {
    grid-column: 1 / 2;
  }
} */
/* ================================
* SECCION: TENEMOS-TODO
================================== */

/* ================================
* SECCION: SECCION-IMAGENES-3
================================== */
/* Estilos base: Desktop */
/* .grid-imagenes-3 {
  display: grid;
  grid-template-rows: 33% 33% 33%;
  gap: 0.5rem;
  width: 100%;
  height: 54rem;
  position: relative;
} */

/* Estilo base para todas las imágenes */
/* .imagen-3 {
  position: relative;
  overflow: hidden;
}

.imagen-3 img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.etiqueta-3 {
  position: absolute;
  bottom: 0;
  left: 0;
  background-color: rgba(0,0,0,0.7);
  color: white;
  padding: 0.3rem 0.8rem;
  font-size: 0.85rem;
  font-weight: 600;
  text-transform: uppercase;
} */

/* Posicionamiento por grid-area */
/* .imagen-multiproposito {
  grid-column: 11 / 20;
  grid-row: 1 / 3;
}

.imagen-caja-herramientas {
  grid-column: 1 / 10;
  grid-row: 1 / 2;
}

.imagen-set {
  grid-column: 5 / 10;
  grid-row: 2 / 3;
}

.imagen-diablo {
  grid-column: 1 / 5;
  grid-row: 2 / 3;
}

.imagen-inalambricos {
  grid-column: 1 / 6;
  grid-row: 3 / 4;
}
.imagen-manuales {
  grid-column: 6 / 20;
  grid-row: 3 / 4;
} */

/* RESPONSIVE: tablet y móviles */
/* @media (max-width: 960px) {
  .grid-imagenes-3 {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto;
    grid-auto-rows: minmax(150px, auto);
    height: auto;
  }

  .imagen-multiproposito {
    grid-column: 1 / 3;
    grid-row: auto;
  }

  .imagen-caja-herramientas {
    grid-column: 1 / 3;
    grid-row: auto;
  }

  .imagen-set,
  .imagen-diablo {
    grid-column: span 1;
    grid-row: auto;
  }

  .imagen-inalambricos,
  .imagen-manuales {
    grid-column: span 1;
    grid-row: auto;
  }
} */

/* EXTRA SMALL (mobile) */
/* @media (max-width: 600px) {
  .grid-imagenes {
    grid-template-columns: 1fr;
  }

  .imagen-multiproposito,
  .imagen-caja-herramientas,
  .imagen-set,
  .imagen-diablo,
  .imagen-inalambricos,
  .imagen-manuales {
    grid-column: 1 / 2;
  }
} */

/* ================================
* SECCION: POTENCIA
================================== */
/* .potencia h2{
font-size: 2.25rem;
text-align: center;
}

.contenido-potencia {
  display: flex;
  justify-content: center;
  gap: 0.5rem;
  width: 100%;
  height: 100%;
  position: relative;
  gap: 0.5rem;

}

.potencia img{
  width: 100%;
  height: auto;

}

.tarjeta-potencia {
  width: 12.5rem;

}

.tarjeta-potencia-0 {
  width: 19.5rem;
}

.texto-potencia {
  padding: 0.75rem;
  margin-top: -5px;
  text-align: center;
}

.nombre-potencia {
    font-size: 0.813rem;
    font-weight: 600;
    color: #222529;
    text-align: left;
}

.categoria-potencia {
    font-size: 0.625rem;
    color: #777777;
    text-align: left;
    text-transform: uppercase;
}

.precio-potencia {
    font-size: 1.125rem;
    font-weight: bold;
    color: #444444;
    text-align: left;
}

.btn-potencia {
    font-size: 0.625rem;
    font-weight: bolder;
    padding: 0.3rem 1rem;
    border: none;
    background: #dddddd;
}

.tachado {
    text-decoration: line-through;
    color: #A7A7A7;
} */

/* ================================
* SECCION: BANNER-HERRAMIENTAS
================================== */

/* ================================
* SECCION: COMPARADOR-PRODUCTOS
================================== */

/* ================================
* SECCION: IMAGENES-HERRAMIENTAS
================================== */
















/************************************* > CATEGORIA INSUMOS-GASEX < *********************************

 /* ================================
 * SECCION: INSUMOS-IMAGENES-4
 * ================================ */
/* .titulo-imagenes-4 {
  text-align: center;
  font-weight: 700;
  font-size: 2.25rem;
  margin-bottom: 1rem;
  text-align: left;
}

.grid-imagenes-4 {
  display: grid;
  grid-template-columns: 45% 55%;
  grid-template-rows: 50% 50%;
  gap: 0.5rem;
  width: 99%;
  height: 50rem;
  position: relative;
}

.imagen-imagenes-4 {
  position: relative;
  overflow: hidden;
}

.imagen-imagenes-4 img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.etiqueta-imagenes-4 {
  position: absolute;
  bottom: 0;
  left: 0;
  background-color: rgba(0,0,0,0.7);
  color: white;
  padding: 1rem;
  font-size: 1rem;
  font-weight: 600;
  text-transform: uppercase;
  width: 10rem;
  text-align: center;
}

.imagen-electricas {
  grid-column: 1 / 2;
  grid-row: 1 / 3;
}

.imagen-napoleon {
  grid-column: 2 / 4;
  grid-row: 1 / 2;
}

.imagen-chicharra {
  grid-column: 2 / 3;
  grid-row: 2 / 3;
}

@media (max-width: 960px) {
  .grid-imagenes-4 {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto;
    grid-auto-rows: minmax(150px, auto);
    height: auto;
  }

  .imagen-electricas {
    grid-column: 1 / 3;
    grid-row: auto;
  }

  .imagen-napoleon {
    grid-column: 1 / 3;
    grid-row: auto;
  }

  .imagen-chicharra,
  .imagen-caiman {
    grid-column: span 1;
    grid-row: auto;
  }
}

@media (max-width: 600px) {
  .grid-imagenes-4 {
    grid-template-columns: 1fr;
  }

  .imagen-electricas,
  .imagen-napoleon,
  .imagen-chicharra,
  .imagen-caiman {
    grid-column: 1 / 2;
  }
} */



 /* ================================
 * SECCION: SEPARADOR
 * ================================ */

 /* ================================
 * SECCION: BANNER-INSUMOS
 * ================================ */
/* .banner-insumos {
  height: 20.625rem;
  background-image: url('img/BANNER-2-1.webp');
  background-size: cover;
  position: relative;
}

.contenido-insumos {
  color: #ffffff;
  padding: 1rem 6rem 6rem 6rem;
  position: relative;
  justify-items: end;
}

.titulo-insumos {
  font-size: 2.5rem;
  font-weight: bold;
  color: #1C244B;
  text-shadow:
  -2px -2px 0 #ffffff,
    2px -2px 0 #ffffff,
  -2px  2px 0 #ffffff,
  2px  2px 0 #ffffff,
  0px  0px 15px #ffffff;
  text-align: right;
  width: 30rem;
}

.texto-insumos {
  text-shadow: 4px 4px 3px rgba(0, 0, 0, 0.3);
  text-align: center;
  font-weight: bold;
} */

 /* ================================
 * SECCION: TENEMOS-TODO
 * ================================ */

 /* ================================
 * SECCION: SECCION-IMAGENES-2
 * ================================ */

 /* ================================
 * SECCION: SEPARADOR
 * ================================ */

/* ================================
 * SECCION: TEXTO
 * ================================ */

/* ================================
 * SECCION: UN-MUNDO (ajustada)
 * ================================ */
/* .un-mundo { padding: 1.5rem 0 2rem; }
.un-mundo__title{
  font-weight: 800;
  font-size: clamp(1.8rem, 3.2vw + 1rem, 3.2rem);
  line-height: 1.1;
  margin: 0 0 1.25rem;
}

.un-mundo__grid{
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
  gap: 1.25rem;
  align-items: start;
}

.um-card{
  background: #fff;
}

.um-card__link{
  display: grid;
  grid-template-rows: auto auto auto auto;
  gap: .45rem;
  text-decoration: none;
  color: inherit;
}

.um-card__thumb{
  position: relative;
  width: 100%;
  aspect-ratio: 1 / 1; 
  border-radius: 8px;
  box-shadow: 0 10px 20px rgba(0,0,0,.08), 0 2px 6px rgba(0,0,0,.06);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.um-card__img{
  width: 100%;
  height: 100%;
  object-fit: cover;  
  filter: drop-shadow(0 8px 14px rgba(0,0,0,.18));
}

.um-card__cat{
  font-size: .72rem;
  color: #9aa1a9;
  text-transform: uppercase;
  letter-spacing: .02em;
  line-height: 1;
  margin-top: .15rem;
}

.um-card__name{
  font-size: .98rem;
  font-weight: 800;
  line-height: 1.25;
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  min-height: 2.5em;
}

.um-card__prices{
  display: flex;
  align-items: baseline;
  gap: .5rem;
  line-height: 1;
}
.um-card__old{
  color: #9aa1a9;
  text-decoration: line-through;
  font-size: .86rem;
  font-weight: 700;
}
.um-card__price{
  font-weight: 900;
  font-size: 1.05rem;
}
.um-card__iva{
  display: block;
  font-size: .85rem;
  font-weight: 700;
  margin-top: .15rem;
}

@media (max-width: 900px){
  .un-mundo__grid{
    grid-auto-flow: column;
    grid-auto-columns: minmax(170px, 1fr);
    overflow-x: auto;
    padding-bottom: .25rem;
    scroll-snap-type: x mandatory;
  }
  .um-card{ scroll-snap-align: start; }
} */


 /* ================================
 * SECCION: BANNER-CARRUSEL
 * ================================ */

 /* ================================
 * SECCION: INSUMOS-IMAGENES-2
 * ================================ */

  /* ================================
 * SECCION: OPINIONES
 * ================================ */



















 /************************************* > CATEGORIA MAQUINAS-GASEX < *********************************

 /* ================================
 * SECCION: SECCION-IMAGENES-4
 * ================================ */
/* .galeria-maquinas {
  margin: 0 auto;
  box-sizing: border-box;
}

.grid-maquinas {
  display: grid;
  gap: 0.5rem;
  width: 65rem;
  height: 74rem;
  position: relative;
}

.maquinas {
  position: relative;
  overflow: hidden;
}

.maquinas img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.etiqueta-maquinas1 {
  position: absolute;
  bottom: 0;
  left: 0;
  background-color: rgba(0,0,0,0.7);
  color: white;
  padding: 1rem;
  font-size: 1.063rem;
  font-weight: bold;
  border-radius: 4px;
  text-transform: uppercase;
  text-align: center;
}

.etiqueta-maquinas2 {
  position: absolute;
  top: 0;
  left: 0;
  background-color: rgba(0,0,0,0.7);
  color: white;
  padding: 1rem;
  font-size: 1.063rem;
  font-weight: bold;
  border-radius: 4px;
  text-transform: uppercase;
  text-align: center;
}

.imagen-1 {
  grid-column: 10 / 20;
  grid-row: 1 / 10;
}

.imagen-2 {
  grid-column: 1 / 10;
  grid-row: 1 / 10;
}

.imagen-3 {
  grid-column: 1 / 6;
  grid-row: 10 / 14;
}

.imagen-4 {
  grid-column: 1 / 6;
  grid-row: 14 / 16;
}
.imagen-5 {
  grid-column: 6 / 20;
  grid-row: 10 / 16
}

.titulo2 {
position: absolute;
bottom: 2rem;
left: 1rem;
font-size: 1.5rem;
font-weight: bolder;
color: #fff;
text-shadow: 4px 4px 3px rgba(0, 0, 0, 0.667);
}

.titulo1 {
position: absolute;
top: 2rem;
left: 1rem;
font-size: 1.5rem;
font-weight: bolder;
color: #fff;
text-shadow: 4px 4px 3px rgba(0, 0, 0, 0.667);
}

@media (max-width: 960px) {
  .grid-maquinas {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto;
    grid-auto-rows: minmax(150px, auto);
    height: auto;
  }

  .imagen-1 {
    grid-column: 1 / 3;
    grid-row: auto;
  }

  .imagen-2 {
    grid-column: 1 / 3;
    grid-row: auto;
  }

  .imagen-3,
  .imagen-4 {
    grid-column: span 1;
    grid-row: auto;
  }

  .imagen-5 {
    grid-column: 1 / 3;
    grid-row: auto;
  }
}

@media (max-width: 600px) {
  .grid-maquinas {
    grid-template-columns: 1fr;
  }

  .imagen-1,
  .imagen-2,
  .imagen-3,
  .imagen-4,
  .imagen-5 {
    grid-column: 1 / 2;
  }
} */

/* ================================
 * SECCION: PROPOSITO
 * ================================ */


/* .proposito {
  margin: 0 auto;
  box-sizing: border-box;
}


.proposito__title {
  font-size: 36px;
  line-height: 1.1;
  font-weight: 800;
  text-align: center;
}

.proposito-intro {
  font-size: 14px;
  text-align: left;
}


.proposito__grid {
  display: grid;
  grid-template-columns: 2fr 1.32fr;  
  grid-template-areas:
    "left top"
    "left mid"
    "left bot";
  gap: 18px;
  align-items: stretch;
}


.proposito__item {
  position: relative;
  overflow: hidden;
  border-radius: 6px;
  background: #e9eef3;
  min-height: 220px;    

.proposito__item img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;         
}


.proposito__item--left  { grid-area: left;  max-height: 55rem; }
.proposito__item--top   { grid-area: top;   max-height: 18.75rem; }
.proposito__item--mid   { grid-area: mid;   max-height: 18.75rem; }
.proposito__item--bot   { grid-area: bot;   max-height: 18.75rem; }


.proposito__badge {
  position: absolute;
  left: 0px;
  bottom: 0px;
  background: rgba(24, 24, 24, 0.75);
  color: #fff;
  padding: 10px 12px;
  border-radius: 4px;
  font-weight: 800;
  font-size: 14px;
  line-height: 1.1;
  letter-spacing: .2px;
  max-width: 80%;
}


.proposito__badge span { display: block; }
.proposito__badge .small { font-weight: 700; opacity: .95; }


@media (max-width: 1024px) {
  .proposito__item--left  { min-height: 520px; }
  .proposito__item--top,
  .proposito__item--mid,
  .proposito__item--bot   { min-height: 240px; }
}

@media (max-width: 800px) {
  .proposito__grid {
    grid-template-columns: 1fr;
    grid-template-areas:
      "left"
      "top"
      "mid"
      "bot";
  }
  .proposito__item--left { min-height: 420px; }
}

@media (max-width: 520px) {
  .proposito__title { font-size: 26px; }
  .proposito__item--left { min-height: 360px; }
  .proposito__item--top,
  .proposito__item--mid,
  .proposito__item--bot { min-height: 220px; }
  .proposito__badge { font-size: 13px; padding: 8px 10px; }
} */

/* ================================
 * SECCION: CON-GASEX
 * ================================ */
/* .contenedor-titulo {
  text-align: center;
  margin-bottom: 2rem;
}

.titulo-seccion {
  font-size: 2.25rem;
  font-weight: 700;
  color: #1C244B;
}

.grid-con-gasex {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1rem;
}

.grid-con-gasex .item {
  aspect-ratio: 1 / 1;
  overflow: hidden;
  border-radius: 6px;
  width: 20.5rem;
  height: 20.5rem;
}

.grid-con-gasex img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  filter: grayscale(100%);
  transition: transform 0.3s ease, filter 0.3s ease;
}

.grid-con-gasex img:hover {
  transform: scale(1.05);
  filter: grayscale(0%);
} */


/* Responsive */
/* @media (max-width: 992px) {
  .grid-con-gasex {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 576px) {
  .grid-con-gasex {
    grid-template-columns: 1fr;
  }
} */









/************************************* > CATEGORIA SERVICIOS-GASEX < *********************************

/* ================================
* SECCION:  GALERIA-SERVICIOS
* ================================ */
/* .contenedor-columnas {
  display: flex;
  margin: 0 auto;
  gap: 1rem;
}

.titulo-galeria {
text-align: center;
}

.subtitulo-galeria {
text-align: left;
}

.columna {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  flex: 1;
}

.columna-izquierda .guia {
  flex: 1;
}

.columna-izquierda {
  height: 1100px;
}

.columna-derecha .guia {
  flex: 1;
}

.columna-derecha {
  height: 1100px;
}

.guia {
  position: relative;
  overflow: hidden;
  border-radius: 6px;
  height: 100%;
}

.guia img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.3s ease;
}

.guia:hover img {
  transform: scale(1.03);
}

.etiqueta {
  position: absolute;
  bottom: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.434);
  color: #fff;
  padding: 1rem;
  font-weight: 600;
  font-size: 0.95rem;
  text-align: left;
}

@media (max-width: 768px) {
  .contenedor-columnas {
    flex-direction: column;
  }

  .columna {
    flex-direction: column;
  }

  .columna .guia {
    height: auto;
  }
}
 */










/************************************* > CATEGORIA PRODUCTO COMBO-GASEX < *********************************

/* ================================
* SECCION:  COMBOS-TITULO
* ================================ */
.hover-glow {
  font-size: 2.2rem;
  font-weight: 800;
  text-align: center;
  transition: all 0.3s ease;
  color: #1C244B;
}

.hover-glow:hover {
  color: #FBDA00;
  transform: scale(1.05);
  text-shadow: 0 0 15px #FBDA00;
}

/* ================================
* SECCION: GALERIA-COMBO
* ================================ */
.grid-combo {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1rem;
  padding-bottom: 2rem;
}

.item-combo {
  background: radial-gradient(circle at center, #00448f, #001d3d);
  border-radius: 8px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 1rem;
  height: 100%;
}

.item-combo img {
  max-width: auto;
  height: 198px;
  object-fit: contain;
  margin: 0 auto;
}

.etiqueta-combo {
  margin-top: 1rem;
  background-color: rgba(0, 0, 0, 0.43);
  color: white;
  padding: 1rem;
  font-size: 0.95rem;
  font-weight: 600;
  border-radius: 4px;
  text-align: center;
  height: 68.8px;
  align-content: center;
}

@media (max-width: 768px) {
  .grid-combo {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 480px) {
  .grid-combo {
    grid-template-columns: 1fr;
  }
}