*{box-sizing:border-box}
body{margin:0;font-family:Arial,sans-serif;color:#111;background:#f6f7fb}
a{text-decoration:none}
img{max-width:100%}
.nav{height:110px;background:white;display:flex;align-items:center;justify-content:space-between;padding:0 7%;box-shadow:0 2px 18px rgba(0,0,0,.06);position:sticky;top:0;z-index:10}
.brand{display:flex;align-items:center;gap:12px;font-weight:900}
.brand img{height:85px;width:auto;object-fit:contain}
.nav nav a{margin-left:22px;color:#f2f2f2;font-weight:700}
.btn{display:inline-block;padding:14px 24px;border-radius:999px;font-weight:900;margin-top:14px}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.card{background:white;padding:26px;border-radius:22px;box-shadow:0 10px 30px rgba(0,0,0,.08)}
footer{padding:50px 7%;background:#111827;color:white;display:grid;grid-template-columns:2fr 1fr 1fr;gap:24px}
@media(max-width:850px){.nav nav{display:none}.cards,footer{grid-template-columns:1fr}.hero h1{font-size:38px!important}}

.bizNav{background:#020617;color:white}.bizNav a{color:white}
.hero.biz{min-height:620px;padding:90px 7%;display:flex;align-items:center;color:white;background:linear-gradient(90deg,rgba(0,0,0,.75),rgba(0,0,0,.35)),url('images/hero.jpg');background-size:cover;background-position:center}
.hero h1{font-size:72px;line-height:.95;max-width:760px}.hero p{font-size:22px;max-width:680px}.btn{background:#f59e0b;color:#111}
.section{padding:80px 7%;background:#f8fafc}.section h2{font-size:44px}
.events{padding:80px 7%;background:white}.eventGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.eventGrid div{background:#020617;color:white;padding:40px;border-radius:24px;font-weight:900}
.cta{padding:80px 7%;text-align:center}.dark{background:#020617;color:white}

.svc img{width:100%;height:180px;object-fit:cover;border-radius:16px;margin-bottom:14px}

[data-hero-btn='0']{display:none!important}
html{scroll-behavior:smooth}

[data-hero-etiqueta]:empty{display:none!important}

.tag{color:inherit;}

.photoBox:empty{display:none!important}

.photoBox{
  overflow:hidden;
}
.photoBox img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  border-radius:inherit;
}
.photoBox img[src=""]{
  display:none!important;
}

/* bloque_img fix */
.photoBox{
  overflow:hidden!important;
}
.photoBox img{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  display:block!important;
  border-radius:inherit!important;
}
.photoBox img[src=""]{
  display:none!important;
}


/* testimonios dirmipack */
.testimonios{
  background:#f8fafc;
}
.testimonio{
  text-align:left;
}
.testimonio img{
  width:72px;
  height:72px;
  object-fit:cover;
  border-radius:50%;
  margin-bottom:14px;
}
.testimonio small:empty{
  display:none!important;
}
.testimonio small{
  display:block;
  opacity:.65;
  margin-top:4px;
}



/* CONTENEDOR PRINCIPAL */ 
.galeria { max-width: 1200px; margin: 0 auto; padding: 30px 20px; font-family: Arial, sans-serif; } 

/* TÍTULO */ 
.galeria h2 { text-align: center; font-size: 32px; color: #000000; margin-bottom: 10px; } 
.galeria p { text-align: center; color: #000000; margin-bottom: 35px; } 

/* CUADRÍCULA DE IMÁGENES */ 
.galeria-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; } 

/* CADA IMAGEN */ 
.galeria-item { position: relative; overflow: hidden; border-radius: 12px; aspect-ratio: 4 / 3; background: #eee; box-shadow: 0 5px 18px rgba(0,0,0,0.10); } 

/* IMAGEN */ 
.galeria-item img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform 0.5s ease; } 

/* EFECTO AL PASAR EL RATÓN */ 
.galeria-item:hover img { transform: scale(1.10); } 

/* CAPA OSCURA */ 
.galeria-overlay { position: absolute; inset: 0; display: flex; align-items: flex-end; padding: 20px; background: linear-gradient( transparent 40%, rgba(0,0,0,0.75) ); opacity: 0; transition: opacity 0.4s ease; } 

/* TEXTO SOBRE LA IMAGEN */ 
.galeria-overlay span { color: #fff; font-size: 18px; font-weight: bold; } 
/* MOSTRAR CAPA */ 
.galeria-item:hover .galeria-overlay { opacity: 1; } 

/* TABLET */ 
@media (max-width: 900px) { .galeria-grid { grid-template-columns: repeat(2, 1fr); gap: 15px; } } 
/* MÓVIL */ 
@media (max-width: 600px) { .galeria { padding: 20px 12px; } .galeria h2 { font-size: 25px; } .galeria-grid { grid-template-columns: 1fr; gap: 15px; } .galeria-overlay { opacity: 1; } } 

/* =========================================
   MENÚ RESPONSIVO PARA TABLETAS Y CELULARES
   ========================================= */

/* Botón hamburguesa oculto en escritorio */
.menu-toggle {
  display: none;
  background: transparent;
  border: 0;
  padding: 10px;
  cursor: pointer;
  flex-direction: column;
  justify-content: center;
  gap: 6px;
  z-index: 1001;
}

.menu-toggle span {
  display: block;
  width: 28px;
  height: 3px;
  background: #ffffff;
  border-radius: 3px;
  transition: transform 0.3s ease, opacity 0.3s ease;
}

/* Ajustes para tabletas y celulares */
@media (max-width: 850px) {

  .nav.bizNav {
    height: auto;
    min-height: 85px;
    padding: 10px 5%;
    position: sticky;
    top: 0;
    flex-wrap: wrap;
  }

  .nav.bizNav .brand img {
    height: 65px;
    max-width: 220px;
    object-fit: contain;
  }

  /* Mostrar botón hamburguesa */
  .nav.bizNav .menu-toggle {
    display: flex;
    margin-left: auto;
  }

  /* Menú desplegable */
  .nav.bizNav nav {
    display: none;
    flex-direction: column;
    align-items: stretch;
    width: 100%;
    flex-basis: 100%;
    padding: 10px 0 15px;
    gap: 0;
    background: #020617;
  }

  /* Mostrar menú al activarlo */
  .nav.bizNav nav.menu-abierto {
    display: flex;
  }

  .nav.bizNav nav a {
    display: block;
    margin: 0;
    padding: 15px 10px;
    color: #ffffff;
    text-align: left;
    border-bottom: 1px solid rgba(255,255,255,0.12);
  }

  .nav.bizNav nav a:last-child {
    border-bottom: none;
  }

  .nav.bizNav nav a:hover {
    color: #f59e0b;
  }

  /* Animación del botón hamburguesa */
  .nav.bizNav .menu-toggle.activo span:nth-child(1) {
    transform: translateY(9px) rotate(45deg);
  }

  .nav.bizNav .menu-toggle.activo span:nth-child(2) {
    opacity: 0;
  }

  .nav.bizNav .menu-toggle.activo span:nth-child(3) {
    transform: translateY(-9px) rotate(-45deg);
  }
}

/* Ajuste adicional para celulares pequeños */
@media (max-width: 480px) {
  .nav.bizNav {
    padding: 8px 4%;
  }

  .nav.bizNav .brand img {
    height: 55px;
    max-width: 190px;
  }

  .nav.bizNav nav a {
    padding: 14px 8px;
    font-size: 15px;
  }
}