/* ============================================================
   Case study pages — shared layout
   Register change from the home page: serif body, documentation
   rather than argument. Reuses tokens/nav/footer from site.css.
   ============================================================ */

@font-face{
  font-family:'Source Serif 4';font-style:normal;font-weight:400;font-display:swap;
  src:url('../fonts/source-serif4-400.woff2') format('woff2');
}
@font-face{
  font-family:'Source Serif 4';font-style:italic;font-weight:400;font-display:swap;
  src:url('../fonts/source-serif4-400i.woff2') format('woff2');
}
@font-face{
  font-family:'Source Serif 4';font-style:normal;font-weight:600;font-display:swap;
  src:url('../fonts/source-serif4-600.woff2') format('woff2');
}

:root{ --f-serif:'Source Serif 4',Georgia,serif; }

.case{padding:40px 48px 96px}
.case-col{max-width:680px;margin:0 auto}

.case-back{
  font-family:var(--f-mono);font-size:12px;color:var(--ink-mid);
  display:inline-flex;align-items:center;gap:6px;margin-bottom:28px;
}
.case-back:hover{color:var(--link)}

/* Header spec block */
.case-header{border-bottom:1px solid var(--rule);padding-bottom:28px;margin-bottom:40px}
.case-eyebrow{font-family:var(--f-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-mid)}
.case-h1{
  font-family:var(--f-display);font-size:clamp(28px,4vw,40px);font-weight:700;
  letter-spacing:-.025em;color:var(--ink);margin-top:12px;line-height:1.15;
}
.case-oneline{font-family:var(--f-serif);font-size:19px;color:var(--ink-mid);margin-top:14px;font-style:italic}
.spec-table{display:grid;grid-template-columns:1fr 1fr;gap:16px 32px;margin-top:26px}
.spec-item dt{
  font-family:var(--f-mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--ink-mid);margin-bottom:4px;
}
.spec-item dd{font-size:14px;color:var(--ink)}
@media(max-width:640px){.spec-table{grid-template-columns:1fr}}

/* Long-form body */
.case-body{font-family:var(--f-serif);font-size:18.5px;line-height:1.6;color:var(--ink)}
.case-body h2{
  font-family:var(--f-display);font-size:22px;font-weight:700;letter-spacing:-.015em;
  color:var(--ink);margin-top:52px;margin-bottom:16px;
}
.case-body h2:first-child{margin-top:0}
.case-body p{margin-top:18px}
.case-body p:first-of-type{margin-top:0}
.case-body ul{margin-top:16px;padding-left:22px}
.case-body li{margin-top:8px}
.case-note{
  font-family:var(--f-mono);font-size:12.5px;color:var(--ink-mid);
  background:var(--paper-sunk);border-left:2px solid var(--ink-mid);
  padding:10px 14px;margin-top:14px;
}

/* Results */
.case-results{
  margin-top:20px;display:flex;flex-wrap:wrap;gap:14px;
}
.case-result-chip{
  border:1px solid var(--rule);border-radius:var(--radius);
  padding:16px 20px;flex:1;min-width:160px;background:var(--paper-sunk);
}
.case-result-n{font-family:var(--f-mono);font-weight:600;font-size:24px;color:var(--ink)}
.case-result-l{font-family:var(--f-mono);font-size:10.5px;color:var(--ink-mid);margin-top:6px;display:block}

/* Diagram placeholder — real diagram substituted per page */
.case-diagram{
  border:1px solid var(--rule);border-radius:var(--radius);
  background:var(--paper-sunk);padding:24px;margin-top:20px;
}

/* Footnote */
.case-footnote{
  margin-top:56px;padding-top:16px;border-top:1px solid var(--rule);
  font-family:var(--f-mono);font-size:11.5px;color:var(--ink-mid);
}

/* Stack tags */
.case-stack{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.case-stack .tag{font-family:var(--f-mono);font-size:11px;color:var(--ink-mid);border:1px solid var(--rule);border-radius:var(--radius);padding:5px 12px}

@media(max-width:640px){
  .case{padding:24px 22px 64px}
}

/* ── Print ──────────────────────────────────────────────────── */
@media print{
  .nav, .theme-toggle, footer, .case-back{display:none!important}
  body{background:#fff;color:#000}
  .case{padding:0}
  .case-col{max-width:100%}
  .case-body{font-size:12pt;line-height:1.5}
  .case-body h2{margin-top:24pt;page-break-after:avoid}
  .case-header{page-break-after:avoid}
  a{color:#000;text-decoration:none}
  .case-result-chip, .case-diagram, .case-note{
    background:#fff;border:1px solid #999;-webkit-print-color-adjust:exact;print-color-adjust:exact;
  }
  @page{margin:0.6in}
}