/* OCTI — Enterprise Infrastructure Portfolio 27.1 */
.page-infra .page-hero__in{max-width:46rem}
.page-infra .page-hero__highlights{
  display:flex;flex-wrap:wrap;gap:10px;margin-top:22px;padding:0;list-style:none
}
.page-infra .page-hero__highlights li{
  padding:8px 14px;border:1px solid rgba(255,255,255,.28);border-radius:999px;
  font:600 .82rem/1.2 var(--font-body);color:var(--on-dark);background:rgba(15,14,31,.35);
  backdrop-filter:blur(8px)
}

.infra-exp{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(28px,5vw,64px);align-items:start}
.infra-exp__chips{display:flex;flex-wrap:wrap;gap:10px;margin:0;padding:0;list-style:none}
.infra-exp__chips li{
  padding:10px 14px;border-radius:12px;background:var(--light);border:1px solid var(--border-soft);
  font:600 .9rem/1.3 var(--font-body);color:var(--dark)
}

.infra-case{padding-block:clamp(64px,9vw,112px)}
.infra-case--tint{background:var(--light)}
.infra-case--dark{background:var(--ink-900);color:var(--on-dark)}
.infra-case--dark h2,
.infra-case--dark h3,
.infra-case--dark .page-section__head h2{color:#fff}
.infra-case--dark .lead,
.infra-case--dark .infra-case__copy p,
.infra-case--dark .infra-case__body p{color:var(--on-dark-muted)}
.infra-case--dark .eyebrow{color:var(--secondary)}
.infra-case--dark .infra-case__copy{color:var(--on-dark)}
.infra-case__grid{
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);
  gap:clamp(28px,5vw,56px);align-items:start
}
.infra-case__grid--flip{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr)}
.infra-case__grid--flip .infra-case__copy{order:2}
.infra-case__grid--flip .infra-case__media{order:1}
.infra-case__kicker{
  display:inline-flex;align-items:center;gap:10px;margin-bottom:10px;
  font:700 .78rem/1 var(--font-body);letter-spacing:.14em;text-transform:uppercase;color:var(--primary)
}
.infra-case--dark .infra-case__kicker{color:var(--secondary)}
.infra-case__stat{
  display:flex;flex-direction:column;gap:4px;margin:22px 0 8px;padding:18px 20px;
  border-radius:16px;background:rgba(46,46,132,.08);border:1px solid var(--border-soft)
}
.infra-case--dark .infra-case__stat{background:rgba(0,209,255,.08);border-color:rgba(0,209,255,.2)}
.infra-case__stat strong{
  font:800 clamp(2.4rem,5vw,3.6rem)/1 var(--font-head);letter-spacing:-.04em;color:var(--primary)
}
.infra-case--dark .infra-case__stat strong{color:var(--secondary)}
.infra-case__stat span{font:600 .95rem/1.4 var(--font-body);color:var(--text-muted)}
.infra-case--dark .infra-case__stat span{color:var(--on-dark-muted)}
.infra-case__tags{display:flex;flex-wrap:wrap;gap:8px;margin:20px 0 0;padding:0;list-style:none}
.infra-case__tags li{
  padding:7px 12px;border-radius:999px;font:600 .78rem/1 var(--font-body);
  background:rgba(46,46,132,.08);color:var(--primary)
}
.infra-case--dark .infra-case__tags li{background:rgba(255,255,255,.08);color:var(--on-dark)}
.infra-case__badge{
  display:inline-flex;align-items:center;margin:4px 0 18px;padding:8px 14px;
  border-radius:999px;font:700 .78rem/1.2 var(--font-body);letter-spacing:.02em;
  background:rgba(0,209,255,.12);border:1px solid rgba(0,209,255,.28);color:var(--secondary)
}

.infra-gallery{
  display:grid;grid-template-columns:1.2fr 1fr;grid-template-rows:auto auto;gap:12px
}
.infra-gallery figure{margin:0;position:relative;overflow:hidden;border-radius:18px;background:#111}
.infra-gallery figure:first-child{grid-row:1 / span 2;min-height:100%}
.infra-gallery img{
  display:block;width:100%;height:100%;object-fit:cover;aspect-ratio:4/3;
  transition:transform .7s var(--ease-out)
}
.infra-gallery figure:first-child img{aspect-ratio:3/4;min-height:420px}
.infra-gallery figure.is-wide{grid-column:1 / -1;grid-row:auto}
.infra-gallery figure.is-wide img{aspect-ratio:16/9;min-height:0;max-height:420px}
.infra-gallery figure:hover img{transform:scale(1.03)}
.infra-gallery figcaption{
  position:absolute;left:0;right:0;bottom:0;padding:14px 16px;
  font:600 .78rem/1.35 var(--font-body);color:#fff;
  background:linear-gradient(transparent,rgba(15,14,31,.82))
}
.infra-gallery--wide{grid-template-columns:1fr 1fr;grid-template-rows:auto}
.infra-gallery--wide figure:first-child{grid-row:auto}
.infra-gallery--wide figure:first-child img{aspect-ratio:16/10;min-height:0}

.infra-flowmap{
  margin:28px 0 0;padding:22px 20px 18px;border-radius:22px;
  background:
    radial-gradient(90% 70% at 50% 8%, rgba(0,209,255,.1), transparent 52%),
    linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.015));
  border:1px solid rgba(0,209,255,.2);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06)
}
.infra-flowmap__head{margin-bottom:18px;text-align:center}
.infra-flowmap__title{
  margin:0;font:700 .72rem/1.2 var(--font-body);
  letter-spacing:.16em;text-transform:uppercase;color:var(--secondary)
}
.infra-flowmap__subtitle{
  margin:8px 0 0;font:600 .88rem/1.35 var(--font-body);color:var(--on-dark)
}
.infra-flowmap__stage{
  display:grid;gap:0;justify-items:stretch;width:100%;max-width:560px;margin-inline:auto
}
.infra-flowmap__layer{display:grid;gap:10px}
.infra-flowmap__layer-label{
  margin:0;font:650 .7rem/1 var(--font-body);letter-spacing:.12em;
  text-transform:uppercase;color:var(--on-dark-muted);text-align:center
}
.infra-flowmap__units{
  display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;width:100%
}
.infra-flowmap__units span{
  position:relative;display:grid;place-items:center;min-height:44px;border-radius:12px;
  border:1px solid rgba(0,209,255,.3);background:rgba(15,14,31,.62);
  font:800 .8rem/1 var(--font-head);letter-spacing:.05em;color:var(--on-dark)
}
.infra-flowmap__units span::after{
  content:"";position:absolute;left:50%;bottom:-9px;width:1px;height:9px;
  background:rgba(0,209,255,.45);transform:translateX(-50%)
}
.infra-flowmap__funnel{
  position:relative;height:34px;margin:0 4px 8px;display:grid;place-items:center
}
.infra-flowmap__rail{
  position:absolute;left:4%;right:4%;top:0;height:2px;border-radius:999px;
  background:linear-gradient(90deg, rgba(0,209,255,.15), #00D1FF, rgba(0,209,255,.15))
}
.infra-flowmap__trunk{
  position:absolute;top:0;bottom:0;left:50%;width:2px;border-radius:999px;
  background:linear-gradient(180deg, #00D1FF, rgba(0,209,255,.25));transform:translateX(-50%)
}
.infra-flowmap__core{
  width:100%;padding:18px 14px 14px;border-radius:18px;
  background:linear-gradient(145deg, #3a3a9a 0%, #2E2E84 48%, #1b6f95 100%);
  border:1px solid rgba(0,209,255,.38)
}
.infra-flowmap__core-label{
  margin:0 0 12px;text-align:center;font:800 1.05rem/1.2 var(--font-head);
  letter-spacing:-.02em;color:#fff
}
.infra-flowmap__services{
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;
  margin:0;padding:0;list-style:none
}
.infra-flowmap__services li{
  display:grid;gap:4px;align-content:center;min-height:58px;padding:10px 8px;border-radius:14px;
  background:rgba(15,14,31,.32);border:1px solid rgba(255,255,255,.14);text-align:center
}
.infra-flowmap__services strong{
  font:750 .78rem/1.2 var(--font-body);color:#fff
}
.infra-flowmap__services span{
  font:500 .68rem/1.25 var(--font-body);color:rgba(232,232,246,.78)
}
.infra-flowmap__note{
  margin:14px 0 0;font:500 .78rem/1.45 var(--font-body);color:var(--on-dark-muted);text-align:center
}

@media (max-width:720px){
  .infra-flowmap{padding:18px 14px 14px}
  .infra-flowmap__units{grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}
  .infra-flowmap__units span{min-height:40px;font-size:.76rem}
  .infra-flowmap__services{grid-template-columns:repeat(2,minmax(0,1fr))}
  .infra-flowmap__services li{min-height:54px}
}

.infra-dims{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;
  margin:0 0 clamp(28px,4vw,40px)
}
.infra-dims p{
  margin:0;padding:18px 20px;border-radius:16px;background:var(--light);
  border:1px solid var(--border-soft);font:500 .95rem/1.5 var(--font-body);color:var(--text-muted)
}
.infra-dims p::first-line{
  font-weight:700;color:var(--dark)
}

.infra-av{
  display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);
  gap:clamp(28px,5vw,56px);align-items:start
}
.infra-av__copy{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.infra-av__card{
  padding:22px 20px;border-radius:18px;background:#fff;border:1px solid var(--border-soft);
  box-shadow:var(--shadow-sm)
}
.infra-av__card h3{font-size:1.02rem;margin:0 0 12px}
.infra-av__card ul{margin:0;padding:0;list-style:none;display:grid;gap:8px}
.infra-av__card li{
  position:relative;padding-left:16px;font-size:.9rem;color:var(--text-muted);line-height:1.45
}
.infra-av__card li::before{
  content:"";position:absolute;left:0;top:.55em;width:7px;height:7px;border-radius:50%;
  background:var(--secondary-deep)
}
.infra-av__media{display:grid;gap:12px}
.infra-av__hero,.infra-av__pair figure{
  margin:0;position:relative;overflow:hidden;border-radius:18px;background:#111
}
.infra-av__hero img,.infra-av__pair img{
  display:block;width:100%;height:100%;object-fit:cover;aspect-ratio:16/10;
  transition:transform .7s var(--ease-out)
}
.infra-av__pair{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.infra-av__pair img{aspect-ratio:4/3}
.infra-av__hero:hover img,.infra-av__pair figure:hover img{transform:scale(1.03)}
.infra-av__hero figcaption,.infra-av__pair figcaption{
  position:absolute;left:0;right:0;bottom:0;padding:14px 16px;
  font:600 .78rem/1.35 var(--font-body);color:#fff;
  background:linear-gradient(transparent,rgba(15,14,31,.82))
}

.infra-caps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.infra-caps--7{
  grid-template-columns:repeat(12,minmax(0,1fr))
}
.infra-caps--7 .infra-cap{grid-column:span 4}
.infra-caps--7 .infra-cap:nth-child(7){grid-column:span 12}
.infra-cap{
  padding:24px;border-radius:18px;background:#fff;border:1px solid var(--border-soft);
  box-shadow:var(--shadow-sm)
}
.infra-cap--featured{
  background:linear-gradient(135deg,rgba(46,46,132,.06),rgba(0,209,255,.08));
  border-color:rgba(46,46,132,.18)
}
.infra-cap--featured ul{
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:10px 18px
}
.infra-cap h3{font-size:1.05rem;margin-bottom:12px}
.infra-cap ul{margin:0;padding:0;list-style:none;display:grid;gap:8px}
.infra-cap li{
  position:relative;padding-left:16px;font-size:.92rem;color:var(--text-muted);line-height:1.45
}
.infra-cap li::before{
  content:"";position:absolute;left:0;top:.55em;width:7px;height:7px;border-radius:50%;
  background:var(--secondary-deep)
}

.infra-flow{
  display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:14px;counter-reset:infra-step
}
.infra-flow__item{
  position:relative;padding:22px 18px;border-radius:16px;background:var(--light);
  border:1px solid var(--border-soft);min-height:100%
}
.infra-flow__item::before{
  counter-increment:infra-step;content:counter(infra-step, decimal-leading-zero);
  display:block;margin-bottom:12px;font:800 1.35rem/1 var(--font-head);color:var(--primary);
  letter-spacing:-.03em
}
.infra-flow__item h3{font-size:1rem;margin:0 0 8px}
.infra-flow__item p{margin:0;font-size:.9rem;color:var(--text-muted);line-height:1.5}

@media (max-width:1024px){
  .infra-exp,.infra-case__grid,.infra-case__grid--flip,.infra-av{grid-template-columns:1fr}
  .infra-case__grid--flip .infra-case__copy,
  .infra-case__grid--flip .infra-case__media{order:initial}
  .infra-dims{grid-template-columns:1fr 1fr}
  .infra-caps{grid-template-columns:repeat(2,minmax(0,1fr))}
  .infra-caps--7{grid-template-columns:repeat(2,minmax(0,1fr))}
  .infra-caps--7 .infra-cap,
  .infra-caps--7 .infra-cap:nth-child(7){grid-column:auto}
  .infra-flow{grid-template-columns:repeat(3,minmax(0,1fr))}
  .infra-gallery figure:first-child img{min-height:280px;aspect-ratio:4/3}
}
@media (max-width:720px){
  .infra-caps,.infra-caps--7,.infra-flow,.infra-gallery,.infra-gallery--wide,
  .infra-av__copy,.infra-av__pair,.infra-dims{grid-template-columns:1fr}
  .infra-caps--7 .infra-cap,
  .infra-caps--7 .infra-cap:nth-child(7){grid-column:auto}
  .infra-cap--featured ul{grid-template-columns:1fr}
  .infra-gallery figure:first-child{grid-row:auto}
  .infra-gallery figure:first-child img{min-height:0}
}
