:root { --case-bg: #060b12; --case-surface: #0b131d; --case-line: rgba(230,238,234,.14); --case-ink: #eef4ef; --case-muted: #92a0a7; --case-accent: #10b981; }
body.case-page { margin: 0; background: var(--case-bg); color: var(--case-ink); }
body.case-menu-open { overflow: hidden; }
.case-header { position: fixed; inset: 0 0 auto; z-index: 50; min-height: 76px; padding: 0 4vw; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 2rem; background: rgba(6,11,18,.9); border-bottom: 1px solid var(--case-line); backdrop-filter: blur(18px); }
.case-brand { color: var(--case-ink); font: 600 1rem "IBM Plex Mono", monospace; text-decoration: none; }.case-brand span,.case-index-link span { color: var(--case-accent); }
.case-header nav { justify-self: center; display: flex; gap: 1.5rem; }.case-header nav a,.case-index-link { color: #a0acb2; font: 500 .61rem "IBM Plex Mono", monospace; letter-spacing: .09em; text-decoration: none; text-transform: uppercase; }.case-header nav a:hover,.case-index-link:hover { color: #fff; }.case-menu { display: none; }
.case-page-hero { min-height: 100svh; padding: 150px 7vw 7rem; display: grid; grid-template-columns: minmax(0,1.15fr) minmax(260px,.45fr); gap: 4vw; align-content: center; position: relative; overflow: hidden; }.case-page-hero::before { content:""; position:absolute; inset:0; background: radial-gradient(circle at 80% 22%, rgba(16,185,129,.11),transparent 35%), linear-gradient(rgba(255,255,255,.022) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.022) 1px,transparent 1px); background-size:auto,48px 48px,48px 48px; mask-image:linear-gradient(#000 75%,transparent); }
.case-hero-copy,.case-facts,.case-cover,.case-abstract { position: relative; z-index: 1; }.case-eyebrow,.case-index { color: var(--case-accent); font: 600 .63rem "IBM Plex Mono",monospace; letter-spacing:.14em; text-transform:uppercase; }.case-page-hero h1 { max-width: 1050px; margin:1.1rem 0 1rem; font:500 clamp(3.8rem,7.4vw,8.4rem)/.9 "Space Grotesk",sans-serif; letter-spacing:-.075em; }.case-deck { max-width:800px; margin:0 0 1rem; color:#dbe3de; font:500 clamp(1.25rem,2vw,2rem)/1.25 "Space Grotesk",sans-serif; }.case-hero-copy>p:last-of-type { max-width:740px; color:var(--case-muted); line-height:1.65; }
.case-tags { display:flex; flex-wrap:wrap; gap:.4rem; list-style:none; padding:0; margin:1.5rem 0; }.case-tags li { padding:.35rem .55rem; border:1px solid var(--case-line); color:#a8b3b8; font:500 .56rem "IBM Plex Mono",monospace; }.case-actions { display:flex; flex-wrap:wrap; gap:.65rem; margin-top:2rem; }.case-button { display:inline-flex; justify-content:space-between; gap:2rem; min-width:170px; padding:.9rem 1rem; border:1px solid var(--case-line); color:#f2f6f3; font:600 .62rem "IBM Plex Mono",monospace; text-decoration:none; text-transform:uppercase; }.case-button.primary { background:var(--case-accent); border-color:var(--case-accent); color:#06100c; }
.case-facts { align-self:start; margin-top:4.5rem; border-top:1px solid var(--case-line); }.case-facts div { padding:1rem 0; border-bottom:1px solid var(--case-line); }.case-facts span { display:block; margin-bottom:.4rem; color:#708089; font:500 .54rem "IBM Plex Mono",monospace; letter-spacing:.1em; text-transform:uppercase; }.case-facts strong,.case-facts a { color:#e2e9e5; font-size:.8rem; text-decoration:none; }.case-facts code { font-family:"IBM Plex Mono",monospace; color:var(--case-accent); }
.case-cover,.case-abstract { grid-column:1/-1; height:min(54vw,620px); margin:3rem 0 0; border:1px solid var(--case-line); background:#071019; overflow:hidden; }.case-cover img { width:100%; height:100%; object-fit:contain; }.case-cover figcaption { position:absolute; left:1rem; bottom:1rem; padding:.35rem .5rem; background:#061019; color:#94a2a9; font:500 .53rem "IBM Plex Mono",monospace; text-transform:uppercase; }.case-abstract { display:flex; align-items:center; justify-content:center; gap:2rem; color:var(--case-accent); }.case-abstract span { padding:1.2rem; border:1px solid var(--case-line); color:#dce5e0; font:500 .68rem "IBM Plex Mono",monospace; }
.case-layout { display:grid; grid-template-columns:210px minmax(0,920px); gap:7vw; align-items:start; justify-content:center; padding:7rem 7vw; }.case-toc { position:sticky; top:110px; border-left:1px solid var(--case-line); padding-left:1rem; }.case-toc>p { color:#667680; font:600 .54rem "IBM Plex Mono",monospace; letter-spacing:.12em; }.case-toc nav { display:grid; }.case-toc a { padding:.45rem 0; color:#75838b; font:500 .61rem "IBM Plex Mono",monospace; text-decoration:none; }.case-toc a:hover,.case-toc a.is-active { color:var(--case-accent); }
.case-article { min-width:0; }.case-section { padding:2rem 0 6rem; border-top:1px solid var(--case-line); scroll-margin-top:110px; }.case-section h2 { max-width:800px; margin:1rem 0 2rem; font:500 clamp(2.4rem,5vw,5rem)/.96 "Space Grotesk",sans-serif; letter-spacing:-.06em; }.case-section h3 { margin:2.3rem 0 1rem; font:500 1.35rem "Space Grotesk",sans-serif; }.case-section>p:not(.case-index,.case-lead,.evidence-rule) { color:var(--case-muted); line-height:1.75; }.case-lead { color:#dce4df; font-size:clamp(1.12rem,1.8vw,1.42rem); line-height:1.65; }.case-section>ul,.implementation-notes ul { list-style:none; padding:0; margin:1.5rem 0; }.case-section>ul li,.implementation-notes li { position:relative; padding:.7rem 0 .7rem 1.5rem; color:#aeb9b3; line-height:1.6; border-bottom:1px solid rgba(255,255,255,.07); }.case-section>ul li::before,.implementation-notes li::before { content:""; position:absolute; left:0; top:1.35rem; width:.65rem; height:1px; background:var(--case-accent); }
.workflow { list-style:none; padding:0; margin:2.5rem 0; border:1px solid var(--case-line); }.workflow li { display:grid; grid-template-columns:62px 1fr; border-bottom:1px solid var(--case-line); }.workflow li:last-child { border:0; }.workflow span { display:grid; place-items:center; color:var(--case-accent); font:500 .6rem "IBM Plex Mono",monospace; border-right:1px solid var(--case-line); }.workflow p { margin:0; padding:1.1rem; color:#b5c0ba; line-height:1.55; }
.architecture-map { margin:2.5rem 0; padding:1.2rem; border:1px solid var(--case-line); background:var(--case-surface); }.architecture-map figcaption { padding-bottom:1rem; border-bottom:1px solid var(--case-line); color:#7d8b92; font:500 .57rem "IBM Plex Mono",monospace; text-transform:uppercase; }.architecture-map>div { display:grid; grid-template-columns:repeat(2,1fr); gap:1px; margin-top:1px; background:var(--case-line); }.architecture-map article { min-height:135px; padding:1.1rem; background:#09111a; }.architecture-map article span { color:var(--case-accent); font:500 .58rem "IBM Plex Mono",monospace; }.architecture-map article p { color:#b5c0bb; line-height:1.5; }.architecture-map small { display:block; padding-top:1rem; color:#67777f; font-size:.68rem; line-height:1.5; }
.implementation-notes { margin-top:2rem; padding:1.4rem; background:rgba(16,185,129,.045); border-left:2px solid var(--case-accent); }.formula-grid { display:grid; gap:.75rem; }.formula-grid code { padding:1rem; overflow:auto; border:1px solid var(--case-line); background:#04080d; color:#dce8e1; font:500 clamp(.72rem,1.5vw,1rem)/1.5 "IBM Plex Mono",monospace; }.results-section { position:relative; }.results-section::before { content:""; position:absolute; inset:0 -3vw; z-index:-1; background:linear-gradient(90deg,rgba(16,185,129,.08),transparent); }.evidence-rule { margin-top:2rem; padding:1rem; border:1px solid rgba(16,185,129,.25); color:#91a29a; font-size:.78rem; line-height:1.6; }.missing-evidence { margin-top:2rem; padding:1.2rem; border:1px solid #e1b45a42; }.missing-evidence span { color:#e1b45a; font:600 .57rem "IBM Plex Mono",monospace; letter-spacing:.1em; }.missing-evidence p { color:#aaa69a; line-height:1.6; }.demonstrates-section { padding:3rem; background:#e8e6df; color:#0b131a; }.demonstrates-section .case-index { color:#17654f; }.demonstrates-section .case-lead { color:#27353b; }
.source-card { border:1px solid var(--case-line); }.source-card>div { display:grid; grid-template-columns:150px 1fr; gap:1rem; padding:1rem; border-bottom:1px solid var(--case-line); }.source-card>div:last-child { border:0; }.source-card span { color:#718088; font:500 .55rem "IBM Plex Mono",monospace; text-transform:uppercase; }.source-card a,.source-card p { min-width:0; margin:0; color:#c7d0cb; overflow-wrap:anywhere; text-decoration:none; font-size:.78rem; }.source-card code { color:var(--case-accent); }.related-grid { display:grid; grid-template-columns:repeat(3,1fr); margin-top:2rem; border:1px solid var(--case-line); }.related-grid a { position:relative; min-height:160px; padding:1rem; color:#dfe6e2; text-decoration:none; border-right:1px solid var(--case-line); }.related-grid a:last-child { border:0; }.related-grid span { color:#75838a; font:500 .53rem "IBM Plex Mono",monospace; text-transform:uppercase; }.related-grid strong { display:block; margin-top:2.5rem; font:500 1.1rem "Space Grotesk",sans-serif; }.related-grid i { position:absolute; right:1rem; bottom:1rem; color:var(--case-accent); font-style:normal; }
.case-footer { display:flex; justify-content:space-between; gap:1rem; padding:2rem 7vw; border-top:1px solid var(--case-line); color:#728088; font:500 .58rem "IBM Plex Mono",monospace; text-transform:uppercase; }.case-footer a { color:inherit; }
@media(max-width:900px){.case-header{grid-template-columns:auto auto;justify-content:space-between}.case-menu{display:inline-flex;padding:.6rem .8rem;border:1px solid var(--case-line);background:none;color:#eef4ef;font:500 .6rem "IBM Plex Mono",monospace;text-transform:uppercase}.case-header nav{position:fixed;inset:76px 0 auto;display:none;padding:1rem 5vw 1.4rem;background:var(--case-bg);border-bottom:1px solid var(--case-line)}.case-header nav.is-open{display:grid}.case-header nav a{padding:.8rem}.case-index-link{display:none}.case-page-hero{grid-template-columns:1fr;padding-top:125px}.case-facts{margin-top:0}.case-layout{grid-template-columns:1fr}.case-toc{position:relative;top:auto;display:none}.case-cover,.case-abstract{height:min(70vw,500px)}}
@media(max-width:620px){.case-page-hero{padding:112px 6vw 4.5rem}.case-page-hero h1{font-size:clamp(3rem,15vw,5rem)}.case-cover,.case-abstract{height:250px;margin-top:1.5rem}.case-abstract{gap:.5rem}.case-abstract span{padding:.7rem;font-size:.52rem}.case-layout{padding:5rem 6vw}.case-section{padding-bottom:4.5rem}.architecture-map>div{grid-template-columns:1fr}.workflow li{grid-template-columns:48px 1fr}.demonstrates-section{padding:2rem 1.2rem}.source-card>div{grid-template-columns:1fr}.related-grid{grid-template-columns:1fr}.related-grid a{border-right:0;border-bottom:1px solid var(--case-line)}.related-grid a:last-child{border:0}.case-footer{flex-direction:column;padding:2rem 6vw}}
@media(prefers-reduced-motion:reduce){.case-page *,.case-page *::before,.case-page *::after{scroll-behavior:auto!important;transition-duration:.01ms!important}}
