.collaboration-page .eyebrow{color:#fff}.collaboration-page .gradient{background-image:linear-gradient(90deg,#0688ff,#8447ff 52%,#da1fff)}.collaboration-page .security-hero-copy{width:65%;max-width:800px}.collaboration-page .security-hero-photo{object-position:70% center}.collaboration-page .security-hero{padding-bottom:150px}.collaboration-page .security-hero:after{background:linear-gradient(90deg,#00010ee8,#00010e9c 40%,#00010e20 75%,transparent)}
.collab-retos{position:relative;isolation:isolate;margin-top:70px;background:#00010e;overflow:hidden}.collab-retos:before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,#00010e 0%,transparent 20%,#00010e22 50%,#00010e 100%),linear-gradient(90deg,#00010e88,transparent 65%),url('/assets/colaboracion-retos.png') center right/cover no-repeat}.collab-retos-heading{max-width:670px}.collab-retos-heading h2{font-size:clamp(2rem,3vw,2.8rem)}.collab-retos-heading>p:last-child{font-size:.94rem;line-height:1.85;max-width:530px;color:#bfcadd;margin-top:28px}.collab-room{display:none}.collab-capabilities{margin-top:32px}
@media(max-width:1100px){.collaboration-page .security-hero-copy{width:80%}.collab-retos-heading{max-width:610px}}
@media(max-width:700px){.collaboration-page .security-hero-copy{width:100%}.collaboration-page .security-hero{padding-bottom:110px}.collaboration-page .security-hero-photo{object-position:75% center;opacity:.65}.collaboration-page .security-hero:after{background:linear-gradient(90deg,#00010ee6,#00010e88)}.collab-retos{margin-top:35px}.collab-retos:before{display:none}.collab-retos-heading h2{font-size:1.9rem}.collab-retos-heading>p:last-child{font-size:.88rem}.collab-room{display:block;height:220px;margin-top:28px;background:linear-gradient(180deg,#00010e,transparent 22%,transparent 75%,#00010e),url('/assets/colaboracion-retos.png') 85% center/auto 100% no-repeat}}

/* ---------- Retos: mismo carrusel que Infraestructura (infraestructura-retos.css/.js), en fucsia ---------- */
.collab-carousel .infra-carousel-group{width:calc(6 * (var(--card-width) + 16px))}   /* 6 tarjetas (Infraestructura tiene 7) */
.collab-carousel .infra-challenge-icon{color:#cd0298}
.collab-carousel .infra-challenge-number{color:#df33b3}
.collab-carousel .infra-carousel-viewport:focus-visible{outline-color:#cd0298}
@media(hover:hover){
  .collab-carousel .infra-challenge:hover{border-color:#d967c15c}
  .collab-carousel .infra-challenge:hover .infra-challenge-icon{box-shadow:0 0 16px #cd029826;border-color:#cd029866}
}
@media(max-width:700px){.collab-carousel{margin-top:12px}}

/* ---------- Capacidades: patrón común de órbita (solution-orbit.css), en fucsia ---------- */
.collab-capacities{background:radial-gradient(ellipse at 25% 50%,#cd02981a,transparent 70%)}
.collab-capacities .security-explorer{--orbit-color:#cd0298;--orbit-text:#e548bd}

/* ---------- Integración: misma sección que Seguridad Física (security-flow.css/.js) ---------- */
/* <main> tiene overflow:hidden en el sitio; clip permite que la trayectoria quede fija (sticky). */
.collaboration-page main{overflow:clip}
/* Impacto (comparador de Codex) · acento fucsia #CD0298 = Colaboración */
.collab-impacto{background:radial-gradient(ellipse at 70% 60%,#cd029814,transparent 65%)}
/* Tarjetas: un color por beneficio + hover (iluminación y ligera escala), igual que en Codex (security-details.css / infraestructura-continuidad.css) */
.collab-impacto .ba-benefits li{--benefit:#0095E5;transition:transform .35s cubic-bezier(.22,.61,.36,1),border-color .35s,box-shadow .35s,background .35s;transform-origin:center}.collab-impacto .ba-benefits li:nth-child(2){--benefit:#00B0D1}.collab-impacto .ba-benefits li:nth-child(3){--benefit:#CD0298}.collab-impacto .ba-benefits li:nth-child(4){--benefit:#FFB500}.collab-impacto .ba-benefits li:nth-child(5){--benefit:#FF8327}
.collab-impacto .ba-benefits svg{stroke:var(--benefit)}.collab-impacto .ba-benefits .bi{border-color:color-mix(in srgb,var(--benefit) 35%,transparent);background:color-mix(in srgb,var(--benefit) 6%,transparent)}
@media(hover:hover) and (pointer:fine){.collab-impacto .ba-benefits li:hover{transform:translateY(-3px) scale(1.025);border-color:color-mix(in srgb,var(--benefit) 65%,transparent);background:color-mix(in srgb,var(--benefit) 9%,#040614);box-shadow:0 0 24px -8px color-mix(in srgb,var(--benefit) 45%,transparent)}}
@media(prefers-reduced-motion:reduce){.collab-impacto .ba-benefits li{transition:none}.collab-impacto .ba-benefits li:hover{transform:none}}
/* Después: etiqueta y bullets en fucsia (mismo criterio que Infraestructura con naranja) */
.collab-impacto .ba-caption--after .mini-label,.collab-impacto .ba-legend .ba-caption--after .mini-label{color:#e548bd}
.collab-impacto .ba-caption--after li::before,.collab-impacto .ba-legend .ba-caption--after li::before{background:#cd0298;box-shadow:0 0 8px #cd029866}
.collab-impacto .ba-caption--after h3,.collab-impacto .ba-caption--after li{color:#fff}
/* Divisor y handle en fucsia */
.collab-impacto .ba-divider{background:linear-gradient(180deg,transparent,#cd0298 14%,#f39ad9 50%,#cd0298 86%,transparent);box-shadow:0 0 16px #cd0298b3}
.collab-impacto .ba-handle{border-color:#f39ad980;box-shadow:0 0 0 6px #cd029814,0 0 24px -4px #cd0298}
.collab-impacto .ba-handle:hover,.collab-impacto .ba.is-dragging .ba-handle{box-shadow:0 0 0 8px #cd02981f,0 0 30px -4px #cd0298}
.collab-impacto .ba-handle:focus-visible{outline-color:#cd0298}
.collab-impacto .ba-after::after{background:linear-gradient(270deg,#00010ef0 0%,#00010eb3 30%,#00010e33 52%,transparent 68%)}.collab-impacto .ba-caption{text-shadow:0 1px 14px #00010e}@media(max-width:700px){.collab-impacto .ba-after::after{background:linear-gradient(180deg,#00010e80 0%,transparent 30%)}}