/* Case studies share the portfolio's typography, surfaces, and accent tokens. */
.case-hero{padding-block:86px 54px;border-bottom:1px solid var(--line)}
.breadcrumb{padding-top:24px;font-family:var(--mono);font-size:13px;color:var(--muted)}
.breadcrumb a{color:var(--accent);text-decoration:none}
.breadcrumb a:hover{text-decoration:underline}
.case-hero .bonus-badge{display:inline-block;margin-bottom:16px;padding:7px 12px;border-radius:999px;background:var(--accent-soft);color:var(--accent);font:700 12px var(--mono)}
.case-hero .eyebrow .dot{display:none}
.case-hero .eyebrow{margin-bottom:20px}
.case-hero h1{font-size:clamp(42px,6vw,72px);max-width:16ch}
.case-hero .tagline{max-width:760px;margin:22px 0 0;color:#cfccc4;font-size:clamp(18px,2vw,21px)}
.case-meta{display:flex;flex-wrap:wrap;gap:8px;margin-top:26px}
.case-meta .chip{font-family:var(--mono);font-size:12px;padding:7px 12px;border:1px solid var(--line);border-radius:999px;color:var(--muted)}
.case-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.case-section{padding-block:44px;border-bottom:1px solid var(--line)}
.case-section h2{font-size:clamp(25px,3vw,35px);display:flex;align-items:baseline;gap:16px;margin-bottom:18px}
.case-section .num{font-family:var(--mono);font-size:13px;letter-spacing:.06em;color:var(--accent)}
.case-section p,.case-section li{max-width:72ch;color:#cfccc4;font-size:17px;line-height:1.75}
.case-section p+p{margin-top:14px}
.case-section ul{padding-inline-start:1.4em;display:grid;gap:9px}
.case-section strong{color:var(--paper)!important}
.case-two-col{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
.case-two-col>div{padding:24px;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface)}
.code-block{overflow:auto;margin-top:18px;padding:24px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);font:13px/1.65 var(--mono);color:#d9e0cc;direction:ltr;text-align:left;white-space:pre}
.callout{max-width:78ch;margin-top:20px;padding:20px 24px;background:var(--accent-soft);border-inline-start:3px solid var(--accent);border-radius:8px;color:var(--paper)}
.case-footer{padding-top:42px}
.case-footer .wrap{align-items:center}
.case-footer nav{display:flex;gap:20px;align-items:center;flex-wrap:wrap}
.case-footer a{color:var(--accent);font-weight:700}
.case-footer a:hover{color:var(--paper)}
html[dir="rtl"] .case-hero h1,html[dir="rtl"] .case-section h2{letter-spacing:0}
html[dir="rtl"] .case-section p,html[dir="rtl"] .case-section li{font-size:17px}
@media(max-width:700px){
  .case-hero{padding-block:58px 36px}
  .case-section{padding-block:32px}
  .case-two-col{grid-template-columns:1fr}
  .code-block{padding:16px;font-size:12px}
}