/* Preserve the case-study content while sharing the marketing site's light design. */
.case-page { background: #fff; }
.case-page .content-box { border: 0; border-radius: 0; background: transparent; backdrop-filter: none; padding: 0; }
.case-page .case-hero { padding: 68px 0 52px; background-image: radial-gradient(#dededd .7px, transparent .7px); background-size: 20px 20px; }
.case-page .case-hero .content-box { padding: 0; }
.case-page .case-title { max-width: 1000px; font-family: var(--font); font-weight: 400; font-size: clamp(36px, 4.8vw, 64px); line-height: 1.1; letter-spacing: -2.5px; margin-bottom: 24px; }
.case-page .case-label { font-family: monospace; font-weight: 400; color: var(--text-secondary); font-size: 11px; }
.case-page .case-client { margin-bottom: 36px; }
.case-page .case-description { max-width: 870px; font-size: 17px; line-height: 1.85; }
.case-page .back-link { margin-bottom: 32px; font-size: 12px; }
.case-page .stats-banner { background: #f1f2df; border: 1px solid #e1e3ce; border-radius: 6px; padding: 32px; gap: 24px; }
.case-page .stat-value { color: var(--text-primary); font-size: 46px; font-weight: 400; letter-spacing: -1.5px; }
.case-page .stat-label { font-size: 11px; }
.case-page .case-section { padding: 44px 0; }
.case-page .case-section .content-box { padding: 0; }
.case-page .case-section .content-box[style*="background:"] { padding: 40px; border-radius: 6px; }
.case-page .section-title { font-family: var(--font); font-weight: 400; letter-spacing: -1.2px; font-size: clamp(28px, 3vw, 38px); line-height: 1.2; }
.case-page .section-text { max-width: 870px; }
.case-page .col-title, .case-page .impact-card h3, .case-page .feature-card h3 { font-family: var(--font); letter-spacing: -.4px; }
.case-page .impact-card, .case-page .result-card, .case-page .tech-card, .case-page .feature-card { background: var(--bg-secondary); border-color: #e5e2df; border-radius: 6px; }
.case-page .tech-card, .case-page .result-card, .case-page .lighthouse-card { min-width: 0; overflow-wrap: anywhere; }
.case-page .result-metric { flex-wrap: wrap; }
.case-page .impact-card-icon, .case-page .feature-card-icon { background: white; color: var(--text-primary); border-radius: 4px; }
.case-page .result-after { color: #287d3c; }
.case-page .code-block { background: #f7f7f6; border-color: var(--border-color); border-radius: 6px; }
.case-page .code-header { background: #eeedeb; }
.case-page .code-body { color: #343438; }
.case-page .code-body .keyword { color: #72548c; }
.case-page .code-body .string { color: #287d3c; }
.case-page .code-body .comment { color: #6e6e72; }
.case-page .code-body .function, .case-page .code-body .number { color: #805b16; }
.case-page .lighthouse-bar { background: #f1f2e8; border-color: #d4ddc5; }
.case-page .lighthouse-pill { color: #287d3c; }
.case-page .case-cta { padding: 64px 0 72px; margin-top: 32px; background: var(--bg-secondary); }
.case-page .case-cta .content-box { padding: 0; }
.case-page .case-cta h2 { font-family: var(--font); font-weight: 400; font-size: clamp(30px, 3vw, 42px); letter-spacing: -1.2px; }
.case-page .site-footer .content-box { padding: 0; }
@media (max-width: 700px) {
  .case-page .case-hero { padding: 44px 0 36px; }
  .case-page .case-title { letter-spacing: -1.4px; }
  .case-page .case-description { font-size: 16px; }
  .case-page .case-section { padding: 30px 0; }
  .case-page .case-section .content-box[style*="background:"] { padding: 26px; }
  .case-page .stats-banner { padding: 24px 16px; }
  .case-page .stat-value { font-size: 36px; }
  .case-page .case-cta { padding: 44px 0; }
}
@media (max-width: 380px) {
  .case-page .tech-grid, .case-page .lighthouse-grid, .case-page .results-grid { grid-template-columns: minmax(0, 1fr); }
  .case-page .result-card { padding: 24px; }
}