.security-ecosystem{display:block}.security-ecosystem>div+div{margin-top:55px;max-width:850px}.security-marquee{overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);margin-top:35px}.security-brand-track{display:flex;width:max-content;animation:security-marquee 45s linear infinite}.security-brand-set{display:flex;align-items:center;gap:65px;padding-right:65px;flex-shrink:0}.security-brand-set span{font-size:1.4rem;color:#bdc7d8;white-space:nowrap}.security-marquee:hover .security-brand-track{animation-play-state:paused}@keyframes security-marquee{to{transform:translateX(-50%)}}
.infrastructure-page .eyebrow{color:#fff}
.infrastructure-page .ba-benefits li{--benefit:#0095E5}.infrastructure-page .ba-benefits li:nth-child(2){--benefit:#00B0D1}.infrastructure-page .ba-benefits li:nth-child(3){--benefit:#CD0298}.infrastructure-page .ba-benefits li:nth-child(4){--benefit:#FFB500}.infrastructure-page .ba-benefits li:nth-child(5){--benefit:#FF8327}.infrastructure-page .ba-benefits svg{stroke:var(--benefit)}.infrastructure-page .ba-benefits .bi{border-color:color-mix(in srgb,var(--benefit) 35%,transparent);background:color-mix(in srgb,var(--benefit) 6%,transparent)}
.infrastructure-page .infra-retos{background:linear-gradient(180deg,#00010e 0%,#00010ecc 8%,transparent 30%,#00010e33 65%,#00010e 100%),linear-gradient(90deg,#00010ed9 0%,#00010e99 30%,#00010e33 62%,#00010e14),url('/assets/infraestructura-retos.png') center center/cover no-repeat}
@media(max-width:700px){.infrastructure-page .infra-retos{background:linear-gradient(180deg,#00010e,transparent 30%,#00010e 100%),linear-gradient(90deg,#00010ecc,#00010e77),url('/assets/infraestructura-retos.png') 65% center/cover no-repeat}}
@media(prefers-reduced-motion:reduce){.security-brand-track{animation:none}.security-marquee{overflow:auto}.security-brand-track>.security-brand-set[aria-hidden]{display:none}}
/* Hero: edificio en corte (oficinas, centro de datos, cableado y energía), fotografía completa sin recortes.
   Escritorio (>1100px): la imagen se ancla al borde derecho con su proporción real (1778×885) y un ancho que deja el
   edificio (≈49–96 % de la imagen) siempre a la derecha del texto: 124vw − 600px da ≈1100px a 1366 y llega al tope de
   1620px (≈ la altura del Hero) a 1780px. Su borde izquierdo y los bordes superior e inferior se funden con el fondo.
   Tablet y móvil: vuelve a cubrir todo el Hero, encuadrada en el centro de datos y la planta de energía, con un velo
   más denso para la lectura. */
@media(min-width:1101px){
  .infrastructure-page .security-hero-photo{left:auto;right:calc((100% - 100vw)/2);top:56%;bottom:auto;width:min(calc(124vw - 600px),1620px);height:auto;aspect-ratio:1778/885;transform:translateY(-50%);object-fit:cover;object-position:center;opacity:1;
    -webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 26%),linear-gradient(180deg,transparent 0%,rgba(0,0,0,.4) 6%,rgba(0,0,0,.8) 13%,#000 22%,#000 84%,transparent 100%);-webkit-mask-composite:source-in;
    mask-image:linear-gradient(90deg,transparent 0%,#000 26%),linear-gradient(180deg,transparent 0%,rgba(0,0,0,.4) 6%,rgba(0,0,0,.8) 13%,#000 22%,#000 84%,transparent 100%);mask-composite:intersect}
  .infrastructure-page .security-hero:after{background:linear-gradient(90deg,#00010e8c 0%,#00010e40 30%,transparent 50%)}
}
.infrastructure-page .security-hero .lead{color:#d5deeb}
@media(max-width:1100px){.infrastructure-page .security-hero-photo{object-position:80% 55%;opacity:.9}.infrastructure-page .security-hero:after{background:linear-gradient(90deg,#00010ee6 0%,#00010eb3 45%,#00010e59 75%,#00010e26 100%);mask-image:linear-gradient(#000 70%,transparent 100%)}}
@media(max-width:700px){.infrastructure-page .security-hero-photo{object-position:79% 55%;opacity:.85}.infrastructure-page .security-hero:after{background:linear-gradient(90deg,#00010ee0,#00010e99 70%,#00010e66);mask-image:linear-gradient(#000 70%,transparent 100%)}}
/* Fundido real de la fotografía: evita un borde de fondo entre Hero y Retos. */
.infrastructure-page .infra-retos{background:none;isolation:isolate}
.infrastructure-page .infra-retos:before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,#00010ed9 0%,#00010e99 30%,#00010e33 62%,#00010e14),url('/assets/infraestructura-retos.png') center center/cover no-repeat;mask-image:linear-gradient(180deg,transparent 0%,rgba(0,0,0,.08) 6%,rgba(0,0,0,.3) 14%,rgba(0,0,0,.7) 24%,#000 36%,#000 70%,transparent 100%);-webkit-mask-image:linear-gradient(180deg,transparent 0%,rgba(0,0,0,.08) 6%,rgba(0,0,0,.3) 14%,rgba(0,0,0,.7) 24%,#000 36%,#000 70%,transparent 100%)}
@media(max-width:700px){.infrastructure-page .infra-retos:before{background:linear-gradient(90deg,#00010ecc,#00010e77),url('/assets/infraestructura-retos.png') 65% center/cover no-repeat}}
/* Mayor contraste en Después, manteniendo visible la fotografía. */
.infrastructure-page .ba-caption--after .mini-label,.infrastructure-page .ba-legend .ba-caption--after .mini-label{color:#FF8327}
.infrastructure-page .ba-caption--after li::before,.infrastructure-page .ba-legend .ba-caption--after li::before{background:#FF8327;box-shadow:0 0 8px #ff832744}
.infrastructure-page .ba-caption--after h3,.infrastructure-page .ba-caption--after li{color:#fff;text-shadow:none}

