@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=DM+Sans:opsz,wght@9..40,400;9..40,500;9..40,700;9..40,800&display=swap');

/* One case-study shell, with a distinct palette for each project. */
body[data-project="chumo"] { --ink:#191516; --ink-soft:#261c1d; --paper:#f3efe5; --acid:#ff796d; --muted:#b8aba9; --accent-dark:#913c36; }
body[data-project="rcc"] { --ink:#171916; --ink-soft:#242824; --paper:#f3efe5; --acid:#c7fa49; --muted:#abb1a8; --accent-dark:#52671f; }
body[data-project="cage"] { --ink:#101d25; --ink-soft:#19313d; --paper:#edf3f3; --acid:#72dedb; --muted:#aac1cc; --accent-dark:#27666d; }
body[data-project="paws"] { --ink:#211923; --ink-soft:#34263b; --paper:#f7eff2; --acid:#ddb2f5; --muted:#c6b3cd; --accent-dark:#765084; }
body[data-project="bridge"] { --ink:#141d2b; --ink-soft:#233247; --paper:#edf2f8; --acid:#a4d4ff; --muted:#b0bfd1; --accent-dark:#416687; }
body[data-project] { --line:rgba(243,239,229,.22); margin:0; background:var(--ink); color:var(--paper); font-family:"DM Sans",Arial,sans-serif; }
.topbar { height:64px; padding:0 4vw; background:var(--ink); border-color:var(--line); }
.topbar a,.chapter-nav a,.eyebrow,.label,.fact dt,.facts dt { font-family:"DM Mono",monospace; }
.topbar .brand { color:var(--acid); font-weight:500; }
.topbar .back:hover { color:var(--acid); }
.chapter-nav { display:flex; justify-content:flex-start; position:sticky; top:64px; z-index:8; padding:10px 4vw; gap:7px; background:var(--ink); border-bottom:1px solid var(--line); overflow-x:auto; white-space:nowrap; }
.chapter-nav a,.chapter-nav a:first-child { flex-shrink:0; padding:9px 13px; border:1px solid var(--line); border-radius:999px; background:transparent; color:var(--muted); font-size:11px; line-height:normal; text-transform:uppercase; letter-spacing:.075em; text-decoration:none; }
.chapter-nav a:hover { border-color:var(--acid); background:var(--ink-soft); color:var(--acid); }
.chapter-nav a.active,.chapter-nav a.active:hover { background:var(--acid); border-color:var(--acid); color:var(--ink); }
.chapter-nav a:focus-visible,a:focus-visible { outline:2px solid var(--acid); outline-offset:4px; }
.section,.wrap { max-width:1320px; padding:clamp(68px,8vw,105px) 4vw; margin:auto; }
/* Introductions read top-to-bottom, never as a narrow headline beside copy. */
.section.case-introduction,.wrap.case-introduction { display:flex; flex-direction:column; align-items:stretch; gap:24px; }
.case-introduction h2 { max-width:100%; font-size:clamp(30px,3.8vw,52px); line-height:1.15; letter-spacing:-.035em; margin:0; }
.case-introduction .eyebrow,.case-introduction .label { margin-bottom:16px; }
.case-introduction .copy,.case-introduction p,.intro-shot.case-introduction p { width:auto; max-width:85ch; }
.case-introduction .copy { margin:20px 0 0; }
.case-introduction .large-copy { font-size:clamp(19px,2vw,25px); line-height:1.5; letter-spacing:-.015em; font-weight:500; }
.case-introduction .split-copy { grid-template-columns:1fr; gap:16px; margin-top:20px; }
.case-introduction .result { margin:0 0 18px; }
.case-introduction .muted { margin:0; }
.case-introduction .premise-visuals { margin-top:28px; }
.intro-gallery { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }
.intro-gallery figure { margin:0; min-width:0; }
.intro-gallery img { display:block; width:100%; height:auto; border-radius:5px; }
.intro-gallery figcaption { margin-top:10px; color:var(--muted); font-size:12px; line-height:1.5; }
.project-demo { display:block; width:100%; aspect-ratio:16/9; background:#080b0e; margin-top:28px; }
.video-description { max-width:80ch; font-size:14px; line-height:1.6; margin:18px 0 0; }
.paper-section .video-description { color:var(--ink); }
.visual-grid:not(:has(figure + figure)) { grid-template-columns:1fr; }
@media(max-width:760px) { .intro-gallery { grid-template-columns:1fr; gap:24px; } }
h2 { font-size:clamp(42px,5.5vw,80px); line-height:.94; letter-spacing:-.06em; }
.eyebrow,.label,.number,.finding strong,.iteration strong,.phase-label { color:var(--acid); }
.paper,.paper-section,.credits-section { background:var(--paper); color:var(--ink); }
.paper .label,.paper .number,.paper-section .eyebrow,.paper-section .label,.paper-section .flow b,.station .label,.paper-section .beat-copy .label { color:var(--accent-dark); }
.accent-section,.evidence-section,.round-section,.pacing article,.journey-card,.beat,.flow li,.cooperation,.loop-strip div,.diagram { background:var(--ink-soft); }
.paper-section .beat,.paper-section .flow li { background:var(--paper); }
.pacing article,.station { border-top-color:var(--acid); }
.recognition a,.keywords li { background:var(--ink-soft); border-color:var(--line); color:var(--paper); }
.recognition a:hover { border-color:var(--acid); }
.muted,.tags,.small { color:var(--muted); }
.finding p,.result { color:var(--paper); }
.button { background:var(--acid); border:1px solid var(--acid); color:var(--ink); }
.button:hover { background:transparent; color:var(--acid); }
.paper .button:hover { color:var(--accent-dark); }
svg [fill="#c7fa49"] { fill:var(--acid); }
svg [stroke="#c7fa49"] { stroke:var(--acid); }
section[id],.hero[id] { scroll-margin-top:145px; }

/* The lime return control is intentionally identical to Chú Mó, across themes. */
.floating-return { position:fixed; left:max(22px,env(safe-area-inset-left)); bottom:calc(22px + env(safe-area-inset-bottom)); z-index:30; --acid:#c7fa49; margin:0; padding:14px 19px; border-radius:999px; background:var(--acid); color:#171916; border:1px solid var(--acid); box-shadow:0 5px 24px rgba(0,0,0,.4); text-decoration:none; font-size:13px; font-weight:700; line-height:1.3; }
.floating-return:hover { background:#d6ff79; color:#171916; }
.floating-return:focus-visible { outline:2px solid white; outline-offset:4px; }
footer { border-top:1px solid var(--line); display:flex; justify-content:space-between; gap:20px; padding:25px 4vw calc(100px + env(safe-area-inset-bottom)); color:var(--muted); font:11px "DM Mono",monospace; }
@media(max-width:760px) {
  .topbar { height:56px; }
  .chapter-nav { top:56px; }
  .section,.wrap { padding:52px 5vw; }
  section[id],.hero[id] { scroll-margin-top:132px; }
  .floating-return { left:max(14px,env(safe-area-inset-left)); bottom:calc(14px + env(safe-area-inset-bottom)); padding:12px 16px; font-size:12px; }
  footer { display:block; }
  footer span+span { display:block; margin-top:8px; }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }