
:root { --text:#f1f2f3; --muted:#bdc2c7; }
html,body { height:auto; }
body { line-height:1.7; }
html { scroll-behavior:smooth; scroll-padding-top:24px; }
.case-study { font-family:'Montserrat',sans-serif; }
.case-study h1,.case-study h2 { font-family:'Montserrat',sans-serif; }
nav.nav,.pill-nav { display:none; }
main.container { width:100%; max-width:1200px; height:auto; overflow:visible; scroll-snap-type:none; padding:0 32px 48px; margin:auto; }
.topbar { display:none; }
.detail-header { max-width:1200px; margin:auto; padding:32px 32px 40px; border-bottom:1px solid #41454a; }
.detail-header>a { color:var(--accent); font-size:14px; }
.detail-header h1 { font-size:clamp(30px,5vw,48px); line-height:1.2; margin:36px 0 14px; }
.detail-meta { color:var(--muted); font-size:16px; }
.detail-tags { display:flex; flex-wrap:wrap; gap:8px; }
.detail-tags .meta-chip { display:inline-block; padding:5px 12px; border:1px solid #454c52; border-radius:999px; background:#1b1f22; color:#e2e6e9; font-size:15px; font-weight:500; line-height:1.5; }
.detail-links { display:flex; flex-wrap:wrap; gap:24px; margin-top:20px; }
.detail-links a { color:var(--accent); text-underline-offset:5px; }
.detail-header .detail-links a { padding:8px 16px; border:1px solid #416553; border-radius:999px; background:#14231c; color:#a0f0c8; font-size:15px; text-decoration:none; }
.detail-header .detail-links a:hover { border-color:var(--accent); background:#20392b; }
.slide { height:auto; scroll-snap-align:none; padding:28px 0; border-bottom:1px solid #383d42; }
.slide>a { height:auto; }
.slide img { width:100%; height:auto; object-fit:contain; border-radius:6px; }
.detail-copy { max-width:75ch; padding:36px 0; }
.detail-copy h2 { font-size:24px; }
.detail-copy p { color:var(--muted); font-size:17px; }
.detail-footer { max-width:1136px; margin:24px auto; padding:28px 0; border-top:1px solid #41454a; }
.detail-footer a { color:var(--accent); }
.section { padding:24px 0; border-bottom:1px solid #383d42; }
.film-hero,.film-embed { max-width:1200px; }
@media(max-width:600px) { .detail-header { padding:24px; } main.container { padding:0 24px 32px; } .detail-footer { margin:24px; } }

.detail-summary { max-width:68ch; color:var(--muted); font-size:18px; line-height:1.75; margin:18px 0; }

.case-section { display:grid; grid-template-columns:200px minmax(0,1fr); gap:32px; padding:32px 0; border-bottom:1px solid #383d42; }
.case-section h2 { margin:0; font-size:20px; font-weight:500; }
.case-section p { margin:0; max-width:68ch; color:#c7cbd0; font-size:17px; line-height:1.85; }
.case-section .detail-links { margin:0; }
.case-body { max-width:1200px; margin:auto; padding:0 32px; }
@media(max-width:650px) { .case-section { grid-template-columns:1fr; gap:12px; padding:24px 0; } .case-body { padding:0 24px; } }
.author-list { color:#d1d5d8; font-size:17px; line-height:1.8; margin:16px 0; }
.author-list strong { color:var(--text); font-weight:700; }
.author-note { color:#a5adb4; font-size:12px; font-weight:400; }
.research-detail .detail-meta { color:#a0f0c8; font-size:17px; font-weight:600; }
.research-figure { margin:32px 0; }
.research-figure img { display:block; width:100%; height:auto; padding:20px; border-radius:8px; background:#f4f6f8; }
.research-figure figcaption { font-size:13px; color:var(--muted); margin-top:12px; }
.case-section .study-limit { margin-top:14px; font-size:14px; }
.contribution-list { margin:0; padding-left:20px; color:#d3d7db; font-size:16px; line-height:1.8; }
.contribution-list li + li { margin-top:6px; }
.case-toc { display:flex; flex-wrap:wrap; gap:12px 24px; padding:24px 0; border-bottom:1px solid #383d42; }
.case-toc a { color:var(--accent); font-size:14px; text-underline-offset:5px; }
.case-chapter { padding-bottom:32px; border-bottom:1px solid #383d42; }
.case-chapter .case-section { border-bottom:0; padding-bottom:24px; }
.case-board { margin:0; }
.case-board a { display:block; }
.case-board img { width:100%; height:auto; display:block; border:1px solid #34383c; border-radius:8px; }
.demo-video { margin:0 0 32px; }
.demo-video video { width:100%; max-height:640px; display:block; border-radius:8px; background:#111; }
.detail-header h1 { font-weight:400; letter-spacing:-.025em; }
.case-section h2,.detail-copy h2 { font-weight:500; letter-spacing:-.015em; }
