/* Thinking Datacenters R13 — independent editorial layout for Defense and MSP.
   This separate versioned asset prevents older cached site.css copies from
   stripping the layout on newly introduced use-case pages. */

main.usecase-page { display:block; width:100%; min-width:0; overflow:hidden; background:#fff; }
.usecase-page *, .usecase-page *::before, .usecase-page *::after { box-sizing:border-box; }

/* Same centered page geometry and white-canvas rhythm as Docs/Company. */
.usecase-page > .usecase-masthead,
.usecase-page > .usecase-section {
  width:100%; max-width:var(--page, 1500px); margin-inline:auto;
  border-bottom:1px solid var(--line, #d8d8d8);
}
.usecase-page .usecase-masthead {
  display:grid; grid-template-columns:minmax(0, 2.1fr) minmax(245px, .9fr);
  gap:clamp(26px, 4.6vw, 66px); align-items:end;
  padding:clamp(48px, 5vw, 72px) clamp(24px, 5vw, 80px) 62px;
}
.usecase-page .usecase-masthead-main, .usecase-page .usecase-masthead-aside,
.usecase-page .usecase-section-heading > div, .usecase-page .usecase-media-copy { min-width:0; }
.usecase-page .usecase-masthead .eyebrow {font-size:14px; line-height:1.25; margin-bottom:15px;}
.usecase-page .usecase-masthead h1 {
  font-size:clamp(47px, 5.2vw, 83px); line-height:.98;
  letter-spacing:-.055em; max-width:910px; margin:0 0 24px;
  overflow-wrap:normal;
}
.usecase-page .usecase-deck {
  font-size:clamp(18px, 1.85vw, 24px); line-height:1.35;
  font-weight:500; letter-spacing:-.025em; color:#252525;
  max-width:800px; margin:0;
}
.usecase-page .usecase-masthead-aside { border-top:1px solid #888; padding-top:16px; }
.usecase-page .usecase-masthead-aside span {
  display:block; color:var(--red, #EC3A3A); font-weight:800;
  font-size:14px; letter-spacing:.04em;
}
.usecase-page .usecase-masthead-aside p {
  font-size:16px; line-height:1.5; color:#414141;
  max-width:430px; margin:12px 0 0;
}

/* Editorial 180px label rail, mirroring the documentation guide sections. */
.usecase-page > .usecase-section { padding:56px clamp(24px,5vw,80px) 65px; }
.usecase-page .usecase-section-heading {
  display:grid; grid-template-columns:180px minmax(0,1fr);
  align-items:start; gap:42px; margin:0 0 30px;
}
.usecase-page .usecase-section-heading .section-label {
  color:var(--red,#EC3A3A); font:800 14px/1.2 Arial,sans-serif;
  letter-spacing:.04em; padding-top:7px;
}
.usecase-page .usecase-section-heading h2 {
  font-size:clamp(34px,3.5vw,54px); line-height:1.02;
  letter-spacing:-.049em; max-width:950px; margin:0 0 15px;
}
.usecase-page .usecase-section-intro {
  color:#2a2a2a; max-width:850px; margin:0;
  font-size:clamp(17px,1.55vw,21px); line-height:1.42;
  font-weight:500; letter-spacing:-.015em;
}

/* Keep original high-resolution diagrams fully inside the editorial canvas. */
.usecase-page figure.usecase-graphic {display:block; width:100%; max-width:1160px; min-width:0; margin:0 auto;}
.usecase-page figure.usecase-graphic > a {
  display:block; width:100%; max-width:100%; overflow:hidden;
  border:1px solid #dedede; background:#fbfbfb; padding:12px;
}
.usecase-page figure.usecase-graphic img {
  display:block; width:100%; max-width:100%; height:auto;
  object-fit:contain; margin:0 auto;
}
.usecase-page figure.usecase-graphic figcaption {
  margin:12px 0 0; font-size:14px; line-height:1.5; color:#666;
  display:flex; justify-content:space-between; align-items:baseline; gap:15px;
}
.usecase-page figure.usecase-graphic figcaption a {
  font-size:14px; color:var(--red,#EC3A3A); font-weight:800;
  letter-spacing:.02em; white-space:nowrap;
}

/* Text content follows the same compact but readable 15–17px site typography. */
.usecase-page .usecase-cards {display:grid; column-gap:34px; row-gap:24px;}
.usecase-page .usecase-cards.two-cols {grid-template-columns:repeat(2,minmax(0,1fr));}
.usecase-page .usecase-cards.three-cols {grid-template-columns:repeat(3,minmax(0,1fr));}
.usecase-page .usecase-card {border-top:1px solid #555; padding:20px 0 24px; min-width:0;}
.usecase-page .usecase-card h3 {font-size:clamp(23px,2vw,29px);line-height:1.08;margin:0 0 12px;letter-spacing:-.035em;}
.usecase-page .usecase-card h4 {font-size:16px;line-height:1.4;font-weight:750;margin:0 0 11px;letter-spacing:-.012em;}
.usecase-page .usecase-card p {font-size:15px;line-height:1.65;color:#484848;letter-spacing:0;margin:0;max-width:620px;}
.usecase-page .usecase-pqc-layout {display:grid;grid-template-columns:minmax(0,1.55fr) minmax(235px,.7fr);gap:clamp(26px,4vw,60px);align-items:start;}
.usecase-page .usecase-prose p {font-size:16px;line-height:1.68;color:#343434;letter-spacing:0;margin:0 0 22px;max-width:780px;}
.usecase-page .usecase-prose .editorial-link {margin-top:9px;}
.usecase-page .usecase-pqc-stats {display:grid;border-top:1px solid #777;min-width:0;}
.usecase-page .usecase-pqc-stats > div {border-bottom:1px solid #ddd;padding:18px 0;display:flex;justify-content:space-between;align-items:baseline;gap:10px;}
.usecase-page .usecase-pqc-stats strong {font-size:clamp(24px,2.8vw,34px);letter-spacing:-.04em;line-height:1;}
.usecase-page .usecase-pqc-stats span {color:#555;font-size:14px;}
.usecase-page .usecase-media-split {display:grid;grid-template-columns:minmax(0,1.1fr) minmax(260px,.85fr);gap:38px;align-items:center;}
.usecase-page .usecase-media-split figure.usecase-graphic {max-width:100%;}
.usecase-page .usecase-media-copy h3 {font-size:clamp(30px,3vw,43px);line-height:1.08;margin:0 0 17px;}
.usecase-page .usecase-media-copy p {font-size:17px;line-height:1.55;margin:0 0 21px;max-width:470px;}
.usecase-page .editorial-link {color:var(--red,#EC3A3A);font-size:14px;}

@media (max-width:1050px) {
  .usecase-page .usecase-cards.three-cols {grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (max-width:850px) {
  .usecase-page .usecase-masthead {grid-template-columns:1fr;gap:25px;padding-top:46px;padding-bottom:45px;}
  .usecase-page .usecase-masthead-aside {max-width:650px;}
  .usecase-page > .usecase-section {padding-top:42px;padding-bottom:46px;}
  .usecase-page .usecase-section-heading {grid-template-columns:1fr;gap:14px;}
  .usecase-page .usecase-pqc-layout,.usecase-page .usecase-media-split {grid-template-columns:1fr;gap:28px;}
  .usecase-page .usecase-pqc-stats {max-width:620px;}
}
@media (max-width:600px) {
  .usecase-page .usecase-masthead h1 {font-size:clamp(44px,11vw,58px);}
  .usecase-page .usecase-masthead .usecase-deck {font-size:19px;}
  .usecase-page .usecase-section-heading h2 {font-size:clamp(31px,8.2vw,44px);}
  .usecase-page .usecase-cards.two-cols,.usecase-page .usecase-cards.three-cols {grid-template-columns:1fr;row-gap:0;}
  .usecase-page figure.usecase-graphic > a {padding:5px;}
  .usecase-page figure.usecase-graphic figcaption {display:block;}
  .usecase-page figure.usecase-graphic figcaption a {display:block;margin-top:8px;}
}
