/* Data Center page — extra layout on top of about.css */

.dc-hero-cta{ display:flex; flex-wrap:wrap; gap:12px; margin-top:28px; }
.dc-hero-cta .btn{ text-decoration:none; }

.dc-stats{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
  gap:14px;
  margin-top:44px;
}
.dc-stat{
  background:rgba(255,255,255,.05);
  border:1px solid var(--stroke);
  border-radius:16px;
  padding:20px 16px;
  text-align:center;
}
.dc-stat b{
  display:block;
  font-family:"Space Grotesk",sans-serif;
  font-size:26px;
  font-weight:700;
  color:var(--green);
  line-height:1.1;
}
.dc-stat span{ display:block; margin-top:8px; font-size:13px; color:var(--muted); line-height:1.35; }

.dc-ph{
  position:relative;
  background:
    linear-gradient(145deg,rgba(31,68,118,.4),rgba(14,31,58,.75)),
    repeating-linear-gradient(-45deg,transparent,transparent 12px,rgba(255,255,255,.03) 12px,rgba(255,255,255,.03) 13px);
}
.dc-ph::after{
  content:attr(data-label);
  position:absolute;
  inset:auto 14px 14px 14px;
  font-family:"JetBrains Mono",monospace;
  font-size:11px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:rgba(255,255,255,.72);
}

.dc-shot{ display:block; cursor:zoom-in; }
.dc-shot img{ display:block; width:100%; height:100%; object-fit:cover; }

.dc-gallery{ padding:90px 0; background:linear-gradient(180deg,#fff,var(--paper)); color:var(--ink); }
.dc-gallery .wrap{ max-width:1640px; }
.dc-gallery .sec-head h2{ color:var(--ink); }
.dc-gallery .sec-head p{ color:#5b6b85; }
.dc-gallery .kicker{ color:var(--navy)!important; }
.dc-g-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:16px;
  margin-top:40px;
}
.dc-g-item{
  position:relative;
  display:block;
  aspect-ratio:4/3;
  border-radius:18px;
  overflow:hidden;
  border:1px solid var(--line);
  background:#0e1f3a;
  box-shadow:0 12px 32px rgba(14,31,58,.08);
  cursor:zoom-in;
}
.dc-g-item img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .35s ease; }
.dc-g-item:hover img{ transform:scale(1.04); }
.dc-g-item.dc-ph{
  cursor:default;
  background:
    linear-gradient(145deg,#1f4476,#0a1226);
  border-color:rgba(14,31,58,.2);
}
.dc-g-item.dc-ph::after{ color:rgba(255,255,255,.8); }

.dc-video{ padding:90px 0; background:linear-gradient(180deg,var(--ink),var(--ink-2)); color:#fff; position:relative; overflow:hidden; }
.dc-video .tex-grid{ position:absolute; inset:0; opacity:.28; }
.dc-video .inner{ position:relative; }
.dc-video .sec-head h2{ color:#fff; }
.dc-video .sec-head p{ color:var(--muted); }
.dc-frame{
  margin-top:36px;
  border-radius:22px;
  overflow:hidden;
  border:1px solid var(--stroke);
  background:#06122e;
  box-shadow:0 28px 70px rgba(0,0,0,.45);
  aspect-ratio:16/9;
}
.dc-frame iframe,
.dc-frame video{ width:100%; height:100%; display:block; border:0; background:#000; }
.dc-video-ph{
  height:100%;
  display:grid;
  place-items:center;
  text-align:center;
  padding:32px;
  background:
    radial-gradient(circle at 50% 40%,rgba(153,212,32,.18),transparent 55%),
    linear-gradient(160deg,#0a1226,#1f4476);
}
.dc-video-ph .play{
  width:72px; height:72px; border-radius:50%;
  background:var(--green); color:var(--ink);
  display:grid; place-items:center; margin:0 auto 18px;
  box-shadow:0 12px 32px rgba(153,212,32,.35);
}
.dc-video-ph h3{ font-size:26px; }
.dc-video-ph p{ color:var(--muted); margin:12px auto 0; max-width:420px; font-size:15px; line-height:1.55; }

.dc-connect{ padding:90px 0; background:#fff; color:var(--ink); }
.dc-connect .sec-head h2{ color:var(--ink); }
.dc-connect .sec-head p{ color:#5b6b85; }
.dc-connect .kicker{ color:var(--navy)!important; }
.dc-c-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-top:40px; }
.dc-ccard{
  background:var(--paper);
  border:1px solid var(--line);
  border-radius:18px;
  padding:28px;
}
.dc-ccard h3{ font-size:20px; color:var(--ink); margin-top:4px; }
.dc-ccard p{ font-size:15px; color:#5b6b85; line-height:1.6; margin-top:10px; }
.dc-ccard .ic{
  width:46px; height:46px; border-radius:12px;
  background:#fff; border:1px solid var(--line);
  display:grid; place-items:center; color:var(--navy); margin-bottom:16px;
}

.dc-cta{
  padding:84px 0;
  background:linear-gradient(160deg,#06122e,#1f4476);
  color:#fff;
  text-align:center;
  position:relative;
  overflow:hidden;
}
.dc-cta .tex-grid{ position:absolute; inset:0; opacity:.35; }
.dc-cta .inner{ position:relative; }
.dc-cta h2{ font-size:40px; }
.dc-cta p{ color:var(--muted); font-size:17px; line-height:1.55; margin:16px auto 0; max-width:560px; }
.dc-cta .btns{ display:flex; justify-content:center; flex-wrap:wrap; gap:12px; margin-top:28px; }

.dc-gallery .faq-item.open .faq-a,
.faq .faq-item.open .faq-a{ max-height:420px; }

.dc-lb{
  position:fixed; inset:0; z-index:10050;
  background:rgba(6,10,22,.92);
  display:none;
  align-items:center;
  justify-content:center;
  padding:24px;
}
.dc-lb.on{ display:flex; }
.dc-lb img{
  max-width:min(1100px,92vw);
  max-height:86vh;
  border-radius:12px;
  box-shadow:0 30px 80px rgba(0,0,0,.5);
}
.dc-lb .dc-lb-close,
.dc-lb .dc-lb-nav{
  position:absolute;
  border:0;
  cursor:pointer;
  background:rgba(255,255,255,.1);
  color:#fff;
  border-radius:12px;
  width:48px; height:48px;
  font-size:28px;
  line-height:1;
}
.dc-lb .dc-lb-close{ top:20px; right:20px; }
.dc-lb .dc-lb-prev{ left:20px; top:50%; transform:translateY(-50%); }
.dc-lb .dc-lb-next{ right:20px; top:50%; transform:translateY(-50%); }
.dc-lb .dc-lb-cap{
  position:absolute; left:50%; bottom:18px; transform:translateX(-50%);
  color:rgba(255,255,255,.85); font-size:14px; max-width:80vw; text-align:center;
}

@media (max-width:1100px){
  .dc-g-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:980px){
  .dc-stats{ grid-template-columns:repeat(3,1fr); }
  .dc-c-grid{ grid-template-columns:1fr; }
  .dc-cta h2{ font-size:30px; }
}
@media (max-width:620px){
  .dc-stats{ grid-template-columns:1fr 1fr; }
  .dc-stats .dc-stat:last-child{ grid-column:span 2; }
  .dc-g-grid{ grid-template-columns:1fr; }
  .ab-hero .dc-stats{ margin-top:28px; }
}