
/* DIFUSOR V112 · INFRAESTRUCTURA IA
   Base: V111.
   Las tarjetas de Infraestructura adoptan el mismo tamaño, grilla y efectos
   que las tarjetas de Servicios, usando las 6 imágenes IA aprobadas. */

body.v73-home #infraestructura{
  padding-top:72px!important;
  padding-bottom:72px!important;
}

body.v73-home #infraestructura > .wrap{
  width:min(1440px,calc(100% - 88px))!important;
  max-width:none!important;
  margin-inline:auto!important;
}

body.v73-home #infraestructura .head{
  display:grid!important;
  grid-template-columns:minmax(0,1.28fr) minmax(300px,.72fr)!important;
  align-items:end!important;
  gap:40px!important;
  margin-bottom:28px!important;
}

body.v73-home #infraestructura .head > div{min-width:0!important;}
body.v73-home #infraestructura .head h2{max-width:820px!important;margin-bottom:0!important;}
body.v73-home #infraestructura .head .lead{
  max-width:470px!important;
  margin:0 0 2px auto!important;
  text-align:left!important;
}

/* Misma grilla que Servicios */
body.v73-home #infraestructura .tech-grid{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:14px!important;
  align-items:stretch!important;
}

/* Mismo tamaño y estructura visual que Servicios */
body.v73-home #infraestructura .tech-item{
  position:relative!important;
  min-height:245px!important;
  padding:22px 22px 20px!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:space-between!important;
  align-items:flex-start!important;
  overflow:hidden!important;
  isolation:isolate!important;
  border-radius:16px!important;
  border:1px solid rgba(255,255,255,.12)!important;
  background-color:rgba(7,21,29,.88)!important;
  box-shadow:0 10px 28px rgba(0,0,0,.16)!important;
  color:#fff!important;
  text-align:left!important;
  cursor:pointer!important;
  transition:
    transform .28s ease,
    border-color .28s ease,
    box-shadow .28s ease!important;
}

/* Imágenes IA: mismo zoom base que Servicios (130%) */
body.v73-home #infraestructura .tech-item[data-infra="video"]{
  background:
    linear-gradient(180deg,rgba(4,13,18,.14) 0%,rgba(4,13,18,.28) 42%,rgba(3,10,15,.80) 100%),
    url("../infrastructure-ai/video.jpg") 50% 50% / 130% auto no-repeat!important;
}
body.v73-home #infraestructura .tech-item[data-infra="realizacion"]{
  background:
    linear-gradient(180deg,rgba(4,13,18,.14) 0%,rgba(4,13,18,.28) 42%,rgba(3,10,15,.80) 100%),
    url("../infrastructure-ai/realizacion.jpg") 50% 50% / 130% auto no-repeat!important;
}
body.v73-home #infraestructura .tech-item[data-infra="audio"]{
  background:
    linear-gradient(180deg,rgba(4,13,18,.14) 0%,rgba(4,13,18,.28) 42%,rgba(3,10,15,.80) 100%),
    url("../infrastructure-ai/audio.jpg") 50% 50% / 130% auto no-repeat!important;
}
body.v73-home #infraestructura .tech-item[data-infra="iluminacion"]{
  background:
    linear-gradient(180deg,rgba(4,13,18,.12) 0%,rgba(4,13,18,.26) 42%,rgba(3,10,15,.78) 100%),
    url("../infrastructure-ai/iluminacion.jpg") 50% 50% / 130% auto no-repeat!important;
}
body.v73-home #infraestructura .tech-item[data-infra="movimiento"]{
  background:
    linear-gradient(180deg,rgba(4,13,18,.12) 0%,rgba(4,13,18,.26) 42%,rgba(3,10,15,.78) 100%),
    url("../infrastructure-ai/movimiento.jpg") 50% 50% / 130% auto no-repeat!important;
}
body.v73-home #infraestructura .tech-item[data-infra="soporte"]{
  background:
    linear-gradient(180deg,rgba(4,13,18,.14) 0%,rgba(4,13,18,.28) 42%,rgba(3,10,15,.80) 100%),
    url("../infrastructure-ai/soporte.jpg") 50% 50% / 130% auto no-repeat!important;
}

/* Jerarquía equivalente a Servicios */
body.v73-home #infraestructura .tech-item b{
  display:block!important;
  margin:0 0 10px!important;
  font-size:22px!important;
  line-height:1.05!important;
  letter-spacing:-.03em!important;
  color:#fff!important;
  text-shadow:0 2px 15px rgba(0,0,0,.40)!important;
  position:relative!important;
  z-index:2!important;
}
body.v73-home #infraestructura .tech-item p{
  max-width:95%!important;
  margin:0!important;
  font-size:11px!important;
  line-height:1.52!important;
  color:rgba(255,255,255,.76)!important;
  text-shadow:0 1px 10px rgba(0,0,0,.34)!important;
  position:relative!important;
  z-index:2!important;
}
body.v73-home #infraestructura .tech-item span{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  width:100%!important;
  margin-top:24px!important;
  padding-top:13px!important;
  border-top:1px solid rgba(255,255,255,.18)!important;
  font-size:9px!important;
  font-weight:800!important;
  line-height:1.2!important;
  letter-spacing:.10em!important;
  text-transform:uppercase!important;
  color:rgba(255,255,255,.90)!important;
  position:relative!important;
  z-index:2!important;
}

/* Mismo hover que Servicios:
   elevación 2.5px y zoom de 130% a 136% */
body.v73-home #infraestructura .tech-item:hover,
body.v73-home #infraestructura .tech-item:focus-visible{
  transform:translateY(-2.5px)!important;
  border-color:rgba(118,205,239,.30)!important;
  box-shadow:0 18px 38px rgba(0,0,0,.22),0 0 18px rgba(67,166,207,.09)!important;
}

body.v73-home #infraestructura .tech-item[data-infra="video"]:hover,
body.v73-home #infraestructura .tech-item[data-infra="video"]:focus-visible{
  background:
    linear-gradient(180deg,rgba(4,13,18,.10) 0%,rgba(4,13,18,.24) 42%,rgba(3,10,15,.76) 100%),
    url("../infrastructure-ai/video.jpg") 50% 50% / 136% auto no-repeat!important;
}
body.v73-home #infraestructura .tech-item[data-infra="realizacion"]:hover,
body.v73-home #infraestructura .tech-item[data-infra="realizacion"]:focus-visible{
  background:
    linear-gradient(180deg,rgba(4,13,18,.10) 0%,rgba(4,13,18,.24) 42%,rgba(3,10,15,.76) 100%),
    url("../infrastructure-ai/realizacion.jpg") 50% 50% / 136% auto no-repeat!important;
}
body.v73-home #infraestructura .tech-item[data-infra="audio"]:hover,
body.v73-home #infraestructura .tech-item[data-infra="audio"]:focus-visible{
  background:
    linear-gradient(180deg,rgba(4,13,18,.10) 0%,rgba(4,13,18,.24) 42%,rgba(3,10,15,.76) 100%),
    url("../infrastructure-ai/audio.jpg") 50% 50% / 136% auto no-repeat!important;
}
body.v73-home #infraestructura .tech-item[data-infra="iluminacion"]:hover,
body.v73-home #infraestructura .tech-item[data-infra="iluminacion"]:focus-visible{
  background:
    linear-gradient(180deg,rgba(4,13,18,.08) 0%,rgba(4,13,18,.22) 42%,rgba(3,10,15,.74) 100%),
    url("../infrastructure-ai/iluminacion.jpg") 50% 50% / 136% auto no-repeat!important;
}
body.v73-home #infraestructura .tech-item[data-infra="movimiento"]:hover,
body.v73-home #infraestructura .tech-item[data-infra="movimiento"]:focus-visible{
  background:
    linear-gradient(180deg,rgba(4,13,18,.08) 0%,rgba(4,13,18,.22) 42%,rgba(3,10,15,.74) 100%),
    url("../infrastructure-ai/movimiento.jpg") 50% 50% / 136% auto no-repeat!important;
}
body.v73-home #infraestructura .tech-item[data-infra="soporte"]:hover,
body.v73-home #infraestructura .tech-item[data-infra="soporte"]:focus-visible{
  background:
    linear-gradient(180deg,rgba(4,13,18,.10) 0%,rgba(4,13,18,.24) 42%,rgba(3,10,15,.76) 100%),
    url("../infrastructure-ai/soporte.jpg") 50% 50% / 136% auto no-repeat!important;
}

/* CTA exterior se conserva limpio */
body.v73-home #infraestructura .infra-entry{
  width:100%!important;
  display:flex!important;
  justify-content:center!important;
  margin:26px 0 0!important;
  padding:0!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}
body.v73-home #infraestructura .infra-entry .cta{
  margin:0 auto!important;
}

/* Responsive idéntico a Servicios */
@media(max-width:1100px){
  body.v73-home #infraestructura .head{
    grid-template-columns:1fr!important;
    gap:14px!important;
  }
  body.v73-home #infraestructura .head .lead{
    max-width:650px!important;
    margin:0!important;
  }
  body.v73-home #infraestructura .tech-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}

@media(max-width:760px){
  body.v73-home #infraestructura{
    padding-top:60px!important;
    padding-bottom:62px!important;
  }
  body.v73-home #infraestructura > .wrap{
    width:min(720px,calc(100% - 36px))!important;
  }
  body.v73-home #infraestructura .tech-item{
    min-height:220px!important;
  }
}

@media(max-width:560px){
  body.v73-home #infraestructura > .wrap{
    width:calc(100% - 24px)!important;
  }
  body.v73-home #infraestructura .tech-grid{
    grid-template-columns:1fr!important;
    gap:12px!important;
  }
  body.v73-home #infraestructura .tech-item{
    min-height:0!important;
    padding:20px 18px 18px!important;
  }
}
