/* ===== index.html ===== */

html.p-index{
  --cream:#F8F6F2;
  --beige:#E6E1DA;
  --sand:#C8B8A0;
  --charcoal:#111111;
  --ink-2:#5B5650;
  --line:#DDD6C9;
  --line-2:#CDC3AF;
  --a-blue:#2E6BAA;
  --a-rust:#A6472B;
  --a-amber:#8A5A12;
  --disp:'Roboto Condensed',system-ui,sans-serif;
  --body:'Roboto',system-ui,sans-serif;
  --mono:'IBM Plex Mono',ui-monospace,monospace;
  --wrap:1080px;
  --pad:40px;
}
html.p-index *{box-sizing:border-box;margin:0;padding:0}
html.p-index html{scroll-behavior:smooth}
html.p-index body{background:var(--cream);color:var(--charcoal);font-family:var(--body);font-size:17px;line-height:1.66;-webkit-font-smoothing:antialiased}
html.p-index .wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--pad)}
html.p-index p{color:var(--ink-2);max-width:60ch}
html.p-index p+p{margin-top:16px}
html.p-index a{color:inherit}

html.p-index /* masthead — identical structure to the case study pages */
.masthead{border-bottom:1px solid var(--line);background:var(--cream)}
html.p-index .masthead .row{max-width:var(--wrap);margin:0 auto;padding:18px var(--pad);display:flex;justify-content:space-between;align-items:center}
html.p-index .masthead .name{margin:0;font-size:0;line-height:1}
html.p-index .masthead .name a{font-family:var(--disp);font-weight:700;font-size:18px;letter-spacing:.01em;text-decoration:none;color:var(--charcoal);white-space:nowrap}
html.p-index .masthead .name a:hover{color:var(--a-rust)}
html.p-index .masthead .icons{display:flex;gap:14px;align-items:center}
html.p-index .masthead .icons a{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border:1px solid var(--line-2);border-radius:50%;color:var(--charcoal);transition:border-color .15s ease,color .15s ease}
html.p-index .masthead .icons a:hover{border-color:var(--a-rust);color:var(--a-rust)}
html.p-index .masthead .icons img.icn{width:14px;height:auto;max-height:17px;display:block}

html.p-index /* hero */
.hero{padding:74px 0 0}
html.p-index .hero .grid{display:grid;grid-template-columns:1.15fr 1fr;gap:64px;align-items:center}
html.p-index .eyebrow{font-family:var(--mono);font-size:12px;letter-spacing:.1rem;text-transform:uppercase;color:var(--a-rust);display:inline-flex;align-items:center;background:rgba(166,71,43,.1);padding:6px 14px;border-radius:20px;margin-bottom:22px}
html.p-index .hero h2{font-family:var(--disp);font-weight:700;font-size:48px;line-height:1.08;letter-spacing:-.01em;margin-bottom:26px}
html.p-index .hero .bio p{font-size:17px;color:var(--charcoal)}
html.p-index .hero .bio p+p{color:var(--ink-2)}
html.p-index .hero-photo{position:relative;min-height:480px}
html.p-index .hero-photo img{width:100%;height:100%;position:absolute;inset:0;object-fit:cover;object-position:top center;filter:sepia(.22) saturate(1.08) contrast(1.03) brightness(1.01)}

html.p-index /* toc */
.toc{padding:88px 0 40px}
html.p-index .toc-head{display:flex;align-items:baseline;gap:20px;margin-bottom:8px}
html.p-index .toc-head .lbl{font-family:var(--mono);font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-2)}
html.p-index .toc-head .rule{flex:1;height:1px;background:var(--line-2)}
html.p-index .toc-sub{font-family:var(--body);color:var(--ink-2);max-width:60ch;margin:14px 0 20px}

html.p-index .entry{display:block;text-decoration:none;color:inherit;border-top:1px solid var(--line);padding:40px 0;position:relative}
html.p-index .entry:last-child{border-bottom:1px solid var(--line)}

html.p-index .entry .row{display:grid;grid-template-columns:64px 1fr 325px;gap:5px;align-items:start}
html.p-index .entry .row>div{transition:transform .2s ease}
html.p-index .entry:hover .row>div:not(.entry-fig){transform:translateX(14px)}
html.p-index .entry:hover .entry-fig{transform:translateX(-14px)}
html.p-index .entry .num{font-family:var(--mono);font-size:13px;color:var(--ink-2);letter-spacing:.08em;line-height:1;padding-top:3px}
html.p-index .entry .chip{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:10px;flex:0 0 auto}
html.p-index .entry .org{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-2);margin-bottom:12px;display:flex;align-items:center}
html.p-index .entry .title{font-weight:700;font-size:29px;line-height:1.14;margin-bottom:12px;color:var(--charcoal)}
html.p-index .entry .thesis{font-size:16px;line-height:1.5;max-width:50ch;color:var(--ink-2)}
html.p-index .entry .desc{font-size:15px;max-width:56ch;color:var(--ink-2);margin-top:10px}
html.p-index .entry .go{font-family:var(--mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--charcoal);white-space:nowrap;margin-top:22px;display:inline-flex;align-items:center;gap:8px}
html.p-index .entry .go .arrow{transition:transform .2s ease;font-size:15px;line-height:1}
html.p-index .entry:hover .go .arrow{transform:translateX(4px)}

html.p-index .entry-fig{border:1px dashed var(--line-2);background:
   linear-gradient(var(--line) 1px,transparent 1px),
   linear-gradient(90deg,var(--line) 1px,transparent 1px);
   background-size:16px 16px;background-color:var(--beige);
   aspect-ratio:325/225;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;text-align:center;padding:14px}
html.p-index .entry-fig.img-fig{padding:0;overflow:hidden;border:3px solid var(--line);border-radius:10px;background:var(--beige)}
html.p-index .entry-fig.img-fig img{width:100%;height:100%;object-fit:cover;display:block}
html.p-index .entry-fig .tag{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-2)}
html.p-index .entry-fig .cap{font-family:var(--mono);font-size:11px;color:var(--ink-2)}

html.p-index .e1:hover{background:rgba(46,107,170,.05)}
html.p-index .e1 .chip{background:var(--a-blue)}
html.p-index .e1 .title{font-family:'Roboto Condensed',sans-serif;font-weight:700}
html.p-index .e1 .thesis{font-family:'Roboto Condensed',sans-serif;font-weight:500;font-size:18px}

html.p-index .e2{background-color:rgba(166,71,43,.035)}
html.p-index .e2:hover{background-color:rgba(166,71,43,.07)}
html.p-index .e2 .chip{background:var(--a-rust)}
html.p-index .e2 .title{font-family:'Newsreader',serif;font-weight:500}
html.p-index .e2 .thesis{font-family:'Newsreader',serif;font-style:italic;font-size:19px}

html.p-index .e3:hover{background:rgba(138,90,18,.07)}
html.p-index .e3 .chip{background:var(--a-amber)}
html.p-index .e3 .title{font-family:'Space Grotesk',sans-serif;font-weight:700}
html.p-index .e3 .thesis{font-family:'Space Grotesk',sans-serif;font-weight:500;font-size:18px}

html.p-index /* footer */
footer{border-top:1px solid var(--line);background:var(--cream);margin-top:40px}
html.p-index footer .row{max-width:var(--wrap);margin:0 auto;padding:26px var(--pad);display:flex;justify-content:space-between;align-items:center;gap:20px;font-family:var(--mono);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-2);flex-wrap:wrap}
html.p-index footer a{text-decoration:none;color:var(--ink-2)}
html.p-index footer .icons{display:flex;gap:14px;align-items:center}
html.p-index footer .icons a{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border:1px solid var(--line-2);border-radius:50%;color:var(--ink-2);transition:border-color .15s ease,color .15s ease}
html.p-index footer .icons a:hover{border-color:var(--a-rust);color:var(--a-rust)}
html.p-index footer .icons img.icn{width:13px;height:auto;max-height:16px;display:block}
html.p-index footer .copy{max-width:var(--wrap);margin:0 auto;padding:0 var(--pad) 26px;font-family:var(--mono);font-size:10.5px;color:var(--ink-2);letter-spacing:.04em}

@media(max-width:820px){
  html.p-index{--pad:22px}
  html.p-index .hero .grid{grid-template-columns:1fr;gap:36px}
  html.p-index .hero-photo{display:none}
  html.p-index .hero h2{font-size:36px}
  html.p-index .entry .row{grid-template-columns:1fr;gap:14px}
  html.p-index .entry .num{padding-top:0}
  html.p-index .entry:hover .row>div{transform:none}
  html.p-index .entry:hover .go .arrow{transform:none}
  html.p-index .e1:hover{background:transparent}
  html.p-index .e2:hover{background-color:rgba(166,71,43,.035)}
  html.p-index .e3:hover{background:transparent}
  html.p-index .masthead .icons a:hover,html.p-index footer .icons a:hover{border-color:var(--line-2);color:var(--charcoal)}
}
@media(prefers-reduced-motion:no-preference){
  html.p-index .reveal{opacity:0;transform:translateY(14px);transition:opacity .7s ease,transform .7s ease,background-color .2s ease}
  html.p-index .reveal.in{opacity:1;transform:none}
}


/* ===== studyA.html ===== */

html.p-studya /* ===== shared: casestudy.css ===== */
/* ============================================================
   CASE STUDY — SHARED STYLESHEET
   Common structure/chrome for all three case study pages.
   Each page must define this token contract in its own :root:
     --bg --surface --surface-2
     --text --text-2 --text-3
     --accent --accent-2
     --line --line-2
     --invert-bg --invert-text --invert-text-2 --invert-accent
     --font-display --font-body --font-util
     --wrap --pad
   Edit a rule here and it updates on every page.
   ============================================================ */

*{box-sizing:border-box;margin:0;padding:0}

html.p-studya html{scroll-behavior:smooth}

html.p-studya body{background:var(--bg);color:var(--text);font-family:var(--font-body);font-size:17px;line-height:1.66;-webkit-font-smoothing:antialiased}

html.p-studya .wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--pad)}

html.p-studya section{position:relative}

html.p-studya p{color:var(--text-2);max-width:64ch}

html.p-studya p+p{margin-top:16px}

html.p-studya .lead{color:var(--text)}

html.p-studya /* masthead — identical on every page: name/home + icon links */
.masthead{border-bottom:1px solid var(--line);background:var(--bg)}

html.p-studya .masthead .row{max-width:var(--wrap);margin:0 auto;padding:18px var(--pad);display:flex;justify-content:space-between;align-items:center}

html.p-studya .masthead .name{margin:0;font-size:0;line-height:1}

html.p-studya .masthead .name a{font-family:var(--font-display);font-weight:700;font-size:18px;letter-spacing:.01em;text-decoration:none;color:var(--text);white-space:nowrap}

html.p-studya .masthead .name a:hover{color:var(--accent)}

html.p-studya .masthead .icons{display:flex;gap:14px;align-items:center}

html.p-studya .masthead .icons a{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border:1px solid var(--line-2);border-radius:50%;color:var(--text);transition:border-color .15s ease,color .15s ease}

html.p-studya .masthead .icons a:hover{border-color:var(--accent);color:var(--accent)}

html.p-studya .masthead .icons img.icn{width:14px;height:auto;max-height:17px;display:block}

html.p-studya /* slim nav line — arrow + short label,html.p-studya no border,html.p-studya just space before the hero */
.topnav{background:var(--bg)}

html.p-studya .topnav .row{max-width:var(--wrap);margin:0 auto;padding:16px var(--pad) 6px;display:flex;justify-content:space-between;align-items:center;font-family:var(--font-util);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--text-3)}

html.p-studya .topnav .navitem{display:inline-flex;align-items:center;gap:10px;text-decoration:none;color:var(--text-3);transition:color .15s ease}

html.p-studya .topnav .navitem:hover{color:var(--accent)}

html.p-studya .topnav .navitem:hover .navcircle{border-color:var(--accent);color:var(--accent)}

html.p-studya .topnav .navitem.next{flex-direction:row-reverse}

html.p-studya .topnav .navcircle{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border:1px solid var(--line);border-radius:50%;font-size:11px;line-height:1;flex:0 0 auto;transition:border-color .15s ease,color .15s ease}

html.p-studya /* full-width hero visual (A/B),html.p-studya replacing the old side-by-side placeholder */
.fig.hero-visual{min-height:400px;margin-top:38px;margin-bottom:6px}

html.p-studya /* section eyebrow */
.eyebrow{font-family:var(--font-util);font-size:12px;letter-spacing:.1rem;text-transform:uppercase;color:var(--accent-pill);font-weight:500;display:inline-flex;vertical-align:middle;align-items:center;background:var(--accent-tint);padding:6px 14px;border-radius:20px;margin-bottom:22px}

html.p-studya /* decision kicker */
.dhead{font-family:var(--font-util);font-weight:600;font-size:10.5px;letter-spacing:.1rem;text-transform:uppercase;color:var(--dhead-text);background:var(--accent);padding:5px 12px;border-radius:20px;margin-bottom:12px;display:inline-block;vertical-align:middle}

html.p-studya /* section spacing */
.block{padding:66px 0}

html.p-studya .block.tight{padding:48px 0}

html.p-studya /* credits row */
.credits{margin-top:46px;border-top:1px solid var(--line);padding-top:20px;display:grid;grid-template-columns:repeat(4,1fr);gap:24px}

html.p-studya .credits div{font-family:var(--font-util);font-size:12px;line-height:1.5;color:var(--text)}

html.p-studya .credits b{display:block;color:var(--accent);font-weight:500;letter-spacing:.12em;text-transform:uppercase;font-size:10.5px;margin-bottom:6px}

html.p-studya /* tradeoff strip */
.trade{margin-top:36px;border-left:3px solid var(--accent);background:var(--surface-2);padding:20px 24px}

html.p-studya .trade .k{font-family:var(--font-util);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);margin-bottom:8px}

html.p-studya .trade p{color:var(--text);max-width:72ch;font-size:16px}

html.p-studya /* inverted band base (page sets --invert-* tokens) */
.invert{background:var(--invert-bg);color:var(--invert-text)}

html.p-studya .invert .eyebrow{color:var(--invert-accent)}

html.p-studya .invert .eyebrow::before{background:var(--invert-accent)}

html.p-studya .invert p{color:var(--invert-text-2)}

html.p-studya /* figure placeholder */
.fig{border:1px dashed var(--line-2);background:var(--surface);display:flex;align-items:center;justify-content:center;flex-direction:column;gap:10px;text-align:center;position:relative;min-height:230px;padding:30px}

html.p-studya .fig .tag{position:absolute;top:12px;left:12px;font-family:var(--font-util);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);background:var(--bg);padding:3px 9px;border:1px solid var(--line)}

html.p-studya .fig .cap{font-family:var(--font-util);font-size:13px;color:var(--text-2);max-width:44ch;line-height:1.55}

html.p-studya .fig .icon{font-size:13px;color:var(--accent-2);letter-spacing:.3em}

html.p-studya .fig.wide{margin-top:34px}

html.p-studya /* footer */
footer{border-top:1px solid var(--line);background:var(--bg)}

html.p-studya footer .row{max-width:var(--wrap);margin:0 auto;padding:26px var(--pad);display:flex;justify-content:space-between;align-items:center;gap:20px;font-family:var(--font-util);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--text-3);flex-wrap:wrap}

html.p-studya footer a{color:var(--accent);text-decoration:none}

html.p-studya footer .icons{display:flex;gap:14px;align-items:center}

html.p-studya footer .icons a{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border:1px solid var(--line-2);border-radius:50%;color:var(--text-3);transition:border-color .15s ease,color .15s ease}

html.p-studya footer .icons a:hover{border-color:var(--accent);color:var(--accent)}

html.p-studya footer .icons img.icn{width:13px;height:auto;max-height:16px;display:block}

html.p-studya .navcircle img.navicon{width:11px;height:auto;display:block}

html.p-studya footer .copy{max-width:var(--wrap);margin:0 auto;padding:0 var(--pad) 26px;font-family:var(--font-util);font-size:10.5px;color:var(--text-3);letter-spacing:.04em}

html.p-studya /* hero split: content left,html.p-studya placeholder image top-right,html.p-studya above credits */
.herotop{display:grid;grid-template-columns:1fr 300px;gap:48px;align-items:start}

html.p-studya .herotop .fig{min-height:210px;padding:20px}

@media(max-width:900px){html.p-studya .herotop{grid-template-columns:1fr}html.p-studya .herotop .fig{max-width:340px}}

html.p-studya /* paired decision kicker + eyebrow,html.p-studya guaranteed baseline alignment via flex */
.dline{display:inline-flex;align-items:center;gap:10px;font-family:var(--font-util);font-size:11px;letter-spacing:.1rem;text-transform:uppercase;color:var(--accent-pill);background:var(--accent-tint);border:1px solid var(--accent-tint-border);padding:7px 16px 7px 12px;border-radius:20px;margin-bottom:12px}

html.p-studya .dline .num{background:var(--accent);color:#fff;font-weight:600;padding:3px 10px;border-radius:14px;font-size:10.5px;flex:0 0 auto}

html.p-studya /* prominent prev/next navigation */
.pagenav{border-top:1px solid var(--line)}

html.p-studya .pagenav .row2{max-width:var(--wrap);margin:0 auto;display:grid;grid-template-columns:1fr 1fr}

html.p-studya .pagenav a{display:block;padding:38px var(--pad);text-decoration:none;color:inherit;transition:background .15s ease}

html.p-studya .pagenav a:hover{background:var(--surface)}

html.p-studya .pagenav .prev{border-right:1px solid var(--line);text-align:left}

html.p-studya .pagenav .next{text-align:right}

html.p-studya .pagenav .dir{font-family:var(--font-util);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--accent);margin-bottom:10px;display:flex;align-items:center;gap:8px}

html.p-studya .pagenav .next .dir{justify-content:flex-end}

html.p-studya .pagenav .arrow{font-size:15px;line-height:1}

html.p-studya .pagenav .ttl{font-family:var(--font-display);font-weight:600;font-size:23px;color:var(--text);line-height:1.2}

html.p-studya .pagenav a:hover .ttl{color:var(--accent)}

html.p-studya .pagenav .stub{opacity:.4;pointer-events:none}

@media(max-width:820px){
  html.p-studya .pagenav .row2{grid-template-columns:1fr}
  html.p-studya .pagenav .prev{border-right:none;border-bottom:1px solid var(--line)}
}

html.p-studya /* shared responsive */
@media(max-width:820px){
  .credits{gap:20px;grid-template-columns:repeat(2,1fr)}
  .invert .wrap{padding-left:30px;padding-right:30px}
  .folio .row .mid{display:none}
}

html.p-studya /* scroll reveal (behavior shared; JS in casestudy.js) */
@media(prefers-reduced-motion:no-preference){
  .reveal{opacity:0;transform:translateY(14px);transition:opacity .7s ease,transform .7s ease}
  .reveal.in{opacity:1;transform:none}
}

html.p-studya .pathtick{position:absolute;width:14px;height:14px}

html.p-studya .pathtick i.h{height:1px;width:14px}

html.p-studya .pathtick i.v{width:1px;height:14px}

html.p-studya .pathtick.tl{top:10px;left:10px}

html.p-studya .pathtick.tr{top:10px;right:10px}

html.p-studya .pathtick.tr i.v{right:0}

html.p-studya .pathtick.bl{bottom:10px;left:10px}

html.p-studya .pathtick.bl i.h{bottom:0}

html.p-studya .pathtick.br{bottom:10px;right:10px}

html.p-studya .pathtick.br i.h{bottom:0}

html.p-studya .pathtick.br i.v{right:0}

html.p-studya .trade .divider{flex:0 0 auto;width:1px;align-self:stretch;background:var(--line)}

html.p-studya .trade .tradebody{flex:1;min-width:0}

html.p-studya .trade .weightbar{margin-top:16px;height:6px;display:flex;border-radius:3px;overflow:hidden}

html.p-studya .fig-embed{margin-top:38px;margin-bottom:6px;width:100%}

html.p-studya .fig-video{width:100%;margin-top:25px}

html.p-studya .fig-video video{width:100%;height:auto;aspect-ratio:1000/518;display:block;object-fit:cover}

html.p-studya .fig-embed iframe{width:100%;height:auto;aspect-ratio:800/450;display:block}

html.p-studya .fig-embed-fixed iframe{height:322px;aspect-ratio:auto}

html.p-studya .fig-embed video{width:100%;height:auto;aspect-ratio:800/450;display:block;object-fit:cover}

html.p-studya .fig-embed-fixed video{height:322px;aspect-ratio:auto}

html.p-studya .d2-grid{display:grid;grid-template-columns:1fr 1fr;gap:32px;align-items:stretch}

html.p-studya .d2-grid .fig-embed{height:100%;margin-top:0;margin-bottom:0}

html.p-studya .d2-grid .fig-embed iframe{height:100%;aspect-ratio:auto}

html.p-studya .d2-grid .fig-embed video{width:100%;height:100%;aspect-ratio:auto;display:block;object-fit:cover}

html.p-studya .d2-grid .rl-branch{grid-template-columns:1fr;gap:20px}

html.p-studya .fig-real{border:1px solid var(--line);overflow:hidden;display:flex}

html.p-studya .fig-real svg{width:100%;height:auto;display:block}

html.p-studya{
  --paper:#EBEEF1;--paper-2:#E3E8ED;--ink:#0F1C2B;--ink-2:#46566B;--muted:#6B6560;
  --line:#C4CFD9;--accent:#2E6BAA;--danger:#B3261E;--navy:#0C2540;--pale:#D7E3F0;--pale-2:#8FB1D4;
  --disp:'Roboto Condensed',system-ui,sans-serif;--body:'Roboto',system-ui,sans-serif;--mono:'IBM Plex Mono',ui-monospace,monospace;
  --bg:var(--paper);--surface:var(--paper-2);--surface-2:var(--paper-2);
  --text:var(--ink);--text-2:var(--ink-2);--text-3:var(--muted);
  --accent-2:var(--pale-2);--line-2:var(--line);--accent-tint:rgba(46,107,170,.12);--accent-tint-border:rgba(46,107,170,.3);--accent-pill:#255A93;--dhead-text:#fff;
  --invert-bg:var(--navy);--invert-text:var(--pale);--invert-text-2:var(--pale);--invert-accent:var(--pale-2);
  --font-display:var(--disp);--font-body:var(--body);--font-util:var(--mono);
  --wrap:1080px;--pad:40px;
}

html.p-studya body{background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:34px 34px;background-position:center top}

html.p-studya body::before{content:"";position:fixed;inset:0;background:var(--bg);opacity:.94;z-index:-1;pointer-events:none}

html.p-studya .fig{background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:22px 22px}

html.p-studya .tick{position:fixed;width:18px;height:18px;z-index:60;pointer-events:none}

html.p-studya .tick i{position:absolute;background:var(--accent)}

html.p-studya .tick i.h{height:1.5px;width:18px}

html.p-studya .tick i.v{width:1.5px;height:18px}

html.p-studya .tick.tl{top:16px;left:16px}

html.p-studya .tick.tr{top:16px;right:16px}

html.p-studya .tick.bl{bottom:16px;left:16px}

html.p-studya .tick.br{bottom:16px;right:16px}

html.p-studya .tick.tr i.v{right:0}

html.p-studya .tick.bl i.h{bottom:0}

html.p-studya .tick.br i.h{bottom:0}

html.p-studya .tick.br i.v{right:0}

html.p-studya h1{font-family:var(--disp);font-weight:700;font-size:74px;line-height:1.02;letter-spacing:-.01em}

html.p-studya h2{font-family:var(--disp);font-weight:700;font-size:42px;line-height:1.08;letter-spacing:-.005em}

html.p-studya .thesis{font-family:var(--disp);font-weight:500;font-size:29px;line-height:1.28;color:var(--ink);max-width:46ch}

html.p-studya .hero{padding:78px 0 66px}

html.p-studya .hero h1{max-width:28ch;margin-bottom:30px}

html.p-studya .hero .thesis{margin-bottom:20px}

html.p-studya .hero .deck{max-width:66ch;font-size:18px}

html.p-studya .split{display:grid;grid-template-columns:1.35fr .9fr;gap:56px;align-items:start}

html.p-studya .callout{border:1.5px solid var(--ink);background:var(--paper-2);padding:34px 30px}

html.p-studya .callout .big{font-family:var(--disp);font-weight:700;font-size:44px;line-height:1.02;color:var(--ink)}

html.p-studya .callout .sub{font-family:var(--mono);font-size:12px;line-height:1.6;color:var(--ink-2);margin-top:16px;letter-spacing:.02em}

html.p-studya .callout .flag{font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);margin-bottom:14px}

html.p-studya .timeline{margin-top:0;padding:0}

html.p-studya .axis{position:relative;height:2px;background:var(--ink);margin:56px 8px 0}

html.p-studya .node{position:absolute;top:-6px;transform:translateX(-50%);text-align:center;width:180px}

html.p-studya .node .dot{width:13px;height:13px;border:2px solid var(--ink);background:var(--paper);border-radius:50%;margin:0 auto}

html.p-studya .node.hot .dot{background:var(--accent);border-color:var(--accent)}

html.p-studya .node .n{position:absolute;left:50%;top:-24px;transform:translateX(-50%);background:var(--bg);padding:0 4px;font-family:var(--mono);font-size:10.5px;color:var(--accent);letter-spacing:.14em;z-index:2;white-space:nowrap}

html.p-studya .node .lbl{font-family:var(--disp);font-weight:500;font-size:16px;color:var(--ink);margin-top:14px;line-height:1.15}

html.p-studya .node .desc{font-family:var(--mono);font-size:11px;color:var(--ink-2);margin-top:6px;line-height:1.5}

html.p-studya .span{margin:118px 8px 0;border-top:1px dashed var(--line);padding-top:12px;font-family:var(--mono);font-size:12px;color:var(--ink-2);letter-spacing:.02em;text-align:center}

html.p-studya .span b{color:var(--accent);font-weight:500}

html.p-studya .invert h2,html.p-studya .invert .stmt{color:#fff}

html.p-studya .stmt{font-family:var(--disp);font-weight:700;font-size:33px;line-height:1.22;text-align:center;margin:0 auto}

html.p-studya .fork{display:grid;grid-template-columns:1fr 1fr;gap:26px;margin:46px 0 38px}

html.p-studya .path{border:1px solid rgba(255,255,255,.2);padding:28px 26px;position:relative}

html.p-studya .path .k{font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--pale-2);margin-bottom:12px}

html.p-studya .path .t{font-family:var(--disp);font-weight:700;font-size:24px;color:#fff;margin-bottom:14px}

html.p-studya .path p{color:var(--pale);font-size:15.5px;max-width:none}

html.p-studya .path .verdict{margin-top:16px;font-family:var(--mono);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:#E8A0A0}

html.p-studya .pathtick i{position:absolute;background:var(--pale-2)}

html.p-studya .blocked{display:flex;align-items:center;gap:10px;margin-top:18px}

html.p-studya .blocked svg{flex:0 0 auto}

html.p-studya .blocked span{font-family:var(--mono);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:#E8A0A0}

html.p-studya .resolve{text-align:center;font-family:var(--disp);font-weight:500;font-size:clamp(15px,calc(2.3vw - 1.8px),23px);color:#fff;margin:0 auto;line-height:1.3;white-space:nowrap}

html.p-studya .ladder{margin-top:10px}

html.p-studya .rung{display:flex;align-items:center;gap:18px;border-bottom:1px solid var(--line);padding:16px 0}

html.p-studya .rung .step{font-family:var(--mono);font-size:11px;color:var(--ink-2);width:74px;letter-spacing:.1em}

html.p-studya .rung .name{font-family:var(--disp);font-weight:500;font-size:21px;color:var(--ink)}

html.p-studya .rung .note{font-family:var(--mono);font-size:11.5px;color:var(--ink-2);margin-left:auto;text-align:right;max-width:32ch;line-height:1.5}

html.p-studya .rung.forbid .name{color:var(--danger)}

html.p-studya .rung.forbid{border-bottom:none}

html.p-studya .rung.forbid .name::before{content:"✕ ";color:var(--danger)}

html.p-studya .partsgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px 32px;margin-top:36px}

html.p-studya .partcard{border-top:1px solid var(--line);padding-top:16px}

html.p-studya .partcard .tm{display:block;width:16px;height:1.5px;background:var(--accent);margin-bottom:12px}

html.p-studya .partcard .pn{font-family:var(--mono);font-weight:500;font-size:16px;color:var(--accent);margin-right:9px}

html.p-studya .partcard .pt{font-family:var(--disp);font-weight:500;font-size:17px;color:var(--ink);line-height:1.25}

html.p-studya .partcard .ps{display:block;font-family:var(--mono);font-size:11px;color:var(--ink-2);margin-top:0}

html.p-studya .rl-branch{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;margin-top:38px}

html.p-studya .rl-bnode .rl-ver{font-family:var(--disp);font-weight:700;font-size:22px;color:var(--ink);border-bottom:2px solid var(--accent);padding-bottom:10px;margin-bottom:14px;display:block}

html.p-studya .rl-branches{display:flex;flex-direction:column;gap:5px}

html.p-studya .rl-line{width:18px;height:1px;background:var(--line-2);display:inline-block;margin-right:8px;vertical-align:middle}

html.p-studya .rl-feat{display:inline;font-family:var(--mono);font-size:12px;color:var(--ink-2)}

html.p-studya .pquote{padding:70px 0}

html.p-studya .pquote blockquote{font-family:var(--disp);font-weight:500;font-size:40px;line-height:1.18;color:#fff;text-align:center;max-width:40ch;margin:0 auto}

html.p-studya .fixgrid{display:grid;grid-template-columns:3fr 7fr;gap:26px;margin:30px 0 0;align-items:stretch}

html.p-studya .fixstack{display:flex;flex-direction:column;gap:20px}

html.p-studya .fixbox{border:1px solid var(--line);padding:26px 24px}

html.p-studya .fixbox.solution{border:1.5px solid var(--accent);background:rgba(46,107,170,.05)}

html.p-studya .fixbox.solution .k{color:var(--accent)}

html.p-studya .fixbox .k{font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);margin-bottom:12px}

html.p-studya .fixbox .t{font-family:var(--disp);font-weight:700;font-size:22px;color:var(--ink);margin-bottom:12px}

html.p-studya .fixbox p{color:var(--ink-2);font-size:15.5px;max-width:none}

html.p-studya .fixgrid .fig,html.p-studya .fixgrid .fig-img{height:100%;min-height:0;margin-top:0}

html.p-studya .fig-img{display:flex;align-items:flex-start;justify-content:center}

html.p-studya .fig-img img{width:100%;height:auto;display:block;border:1px solid var(--line)}

html.p-studya /* tradeoff override: bordered icon tile + divider + qualitative weight bar */
.trade{display:flex;gap:22px;align-items:flex-start;padding:24px 26px}

html.p-studya .trade .tile{flex:0 0 auto;width:56px;height:56px;border:1px solid var(--line);background:var(--paper);display:flex;align-items:center;justify-content:center}

html.p-studya .trade .weightbar .seg.cost{background:var(--danger);opacity:.55}

html.p-studya .trade .weightbar .seg.gain{background:var(--accent);opacity:.7}

html.p-studya .trade .weightlabels{display:flex;justify-content:space-between;margin-top:8px;font-family:var(--mono);font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-2)}

html.p-studya .pquote .attr{font-family:var(--mono);font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--pale-2);text-align:center;margin-top:26px}

html.p-studya .seqwrap{display:flex;gap:36px;position:relative;margin-top:48px}

html.p-studya .seqwrap::before{content:"";position:absolute;top:16px;left:16px;right:16px;height:1px;background:var(--line);z-index:0}

html.p-studya .seq{flex:1;position:relative;z-index:1}

html.p-studya .seqdot{width:32px;height:32px;border:1.5px solid var(--accent);border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:12px;color:var(--accent);margin-bottom:18px;background:var(--paper)}

html.p-studya .seq .t{font-family:var(--disp);font-weight:700;font-size:18px;color:var(--ink);margin-bottom:10px;line-height:1.2}

html.p-studya .seq p{font-size:14px;color:var(--ink-2);max-width:none}

html.p-studya .closing{padding:96px 0}

html.p-studya .closing .stmt{max-width:40ch}

@media(max-width:820px){
  html.p-studya{--pad:22px}
  html.p-studya .tick{display:none}
  html.p-studya .invert .wrap{padding-left:30px;padding-right:30px}
  html.p-studya body{background-size:26px 26px}
  html.p-studya h1{font-size:44px}
  html.p-studya .thesis{font-size:22px}
  html.p-studya .callout .big{font-size:32px}
  html.p-studya .split,html.p-studya .fork,html.p-studya .grid2,html.p-studya .partsgrid,html.p-studya .fixgrid,html.p-studya .d2-grid{grid-template-columns:1fr}
  html.p-studya .seqwrap{flex-direction:column;gap:26px}
  html.p-studya .seqwrap::before{display:none}
  html.p-studya .fixgrid .fig,html.p-studya .fixgrid .fig-img{height:auto;min-height:220px;margin-top:6px}
  html.p-studya .rl-branch{grid-template-columns:1fr;gap:20px}
  html.p-studya .rung .note{display:none}
  html.p-studya .resolve{white-space:normal;font-size:19px}
  html.p-studya .axis{background:none;height:auto;margin:0}
  html.p-studya .node{position:relative;left:0!important;transform:none;width:100%;text-align:left;padding:0 0 26px 24px;border-left:2px solid var(--line);margin-bottom:0}
  html.p-studya .node.hot{border-left-color:var(--accent)}
  html.p-studya .node .dot{position:absolute;left:-6px;top:8px;margin:0}
  html.p-studya .node .n{position:static;display:inline;background:none;padding:0;margin-right:8px}
  html.p-studya .node .lbl{display:inline;margin-top:0}
  html.p-studya .node .desc{display:block;margin-top:6px}
  html.p-studya .span{margin:20px 0 0}
}


/* ===== studyB.html ===== */

html.p-studyb /* ===== shared: casestudy.css ===== */
/* ============================================================
   CASE STUDY — SHARED STYLESHEET
   Common structure/chrome for all three case study pages.
   Each page must define this token contract in its own :root:
     --bg --surface --surface-2
     --text --text-2 --text-3
     --accent --accent-2
     --line --line-2
     --invert-bg --invert-text --invert-text-2 --invert-accent
     --font-display --font-body --font-util
     --wrap --pad
   Edit a rule here and it updates on every page.
   ============================================================ */

*{box-sizing:border-box;margin:0;padding:0}

html.p-studyb html{scroll-behavior:smooth}

html.p-studyb body{background:var(--bg);color:var(--text);font-family:var(--font-body);font-size:17px;line-height:1.66;-webkit-font-smoothing:antialiased}

html.p-studyb .wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--pad)}

html.p-studyb section{position:relative}

html.p-studyb p{color:var(--text-2);max-width:64ch}

html.p-studyb p+p{margin-top:16px}

html.p-studyb .lead{color:var(--text)}

html.p-studyb /* masthead — identical on every page: name/home + icon links */
.masthead{border-bottom:1px solid var(--line);background:var(--bg)}

html.p-studyb .masthead .row{max-width:var(--wrap);margin:0 auto;padding:18px var(--pad);display:flex;justify-content:space-between;align-items:center}

html.p-studyb .masthead .name{margin:0;font-size:0;line-height:1}

html.p-studyb .masthead .name a{font-family:var(--font-display);font-weight:700;font-size:18px;letter-spacing:.01em;text-decoration:none;color:var(--text);white-space:nowrap}

html.p-studyb .masthead .name a:hover{color:var(--accent)}

html.p-studyb .masthead .icons{display:flex;gap:14px;align-items:center}

html.p-studyb .masthead .icons a{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border:1px solid var(--line-2);border-radius:50%;color:var(--text);transition:border-color .15s ease,color .15s ease}

html.p-studyb .masthead .icons a:hover{border-color:var(--accent);color:var(--accent)}

html.p-studyb .masthead .icons img.icn{width:14px;height:auto;max-height:17px;display:block}

html.p-studyb /* slim nav line — arrow + short label,html.p-studyb no border,html.p-studyb just space before the hero */
.topnav{background:var(--bg)}

html.p-studyb .topnav .row{max-width:var(--wrap);margin:0 auto;padding:16px var(--pad) 6px;display:flex;justify-content:space-between;align-items:center;font-family:var(--font-util);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--text-3)}

html.p-studyb .topnav .navitem{display:inline-flex;align-items:center;gap:10px;text-decoration:none;color:var(--text-3);transition:color .15s ease}

html.p-studyb .topnav .navitem:hover{color:var(--accent)}

html.p-studyb .topnav .navitem:hover .navcircle{border-color:var(--accent);color:var(--accent)}

html.p-studyb .topnav .navitem.next{flex-direction:row-reverse}

html.p-studyb .topnav .navcircle{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border:1px solid var(--line);border-radius:50%;font-size:11px;line-height:1;flex:0 0 auto;transition:border-color .15s ease,color .15s ease}

html.p-studyb /* full-width hero visual (A/B),html.p-studyb replacing the old side-by-side placeholder */
.fig.hero-visual{min-height:400px;margin-top:38px;margin-bottom:6px}

html.p-studyb /* section eyebrow */
.eyebrow{font-family:var(--font-util);font-size:12px;letter-spacing:.1rem;text-transform:uppercase;color:var(--accent-pill);font-weight:500;display:inline-flex;vertical-align:middle;align-items:center;background:var(--accent-tint);padding:6px 14px;border-radius:20px;margin-bottom:22px}

html.p-studyb /* decision kicker */
.dhead{font-family:var(--font-util);font-weight:600;font-size:10.5px;letter-spacing:.1rem;text-transform:uppercase;color:var(--dhead-text);background:var(--accent);padding:5px 12px;border-radius:20px;margin-bottom:12px;display:inline-block;vertical-align:middle}

html.p-studyb /* section spacing */
.block{padding:66px 0}

html.p-studyb .block.tight{padding:48px 0}

html.p-studyb /* credits row */
.credits{margin-top:46px;border-top:1px solid var(--line);padding-top:20px;display:grid;grid-template-columns:repeat(4,1fr);gap:24px}

html.p-studyb .credits div{font-family:var(--font-util);font-size:12px;line-height:1.5;color:var(--text)}

html.p-studyb .credits b{display:block;color:var(--accent);font-weight:500;letter-spacing:.12em;text-transform:uppercase;font-size:10.5px;margin-bottom:6px}

html.p-studyb /* tradeoff strip */
.trade{margin-top:36px;border-left:3px solid var(--accent);background:var(--surface-2);padding:20px 24px}

html.p-studyb .trade .k{font-family:var(--font-util);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);margin-bottom:8px}

html.p-studyb .trade p{color:var(--text);max-width:72ch;font-size:16px}

html.p-studyb /* inverted band base (page sets --invert-* tokens) */
.invert{background:var(--invert-bg);color:var(--invert-text)}

html.p-studyb .invert .eyebrow{color:var(--invert-accent)}

html.p-studyb .invert .eyebrow::before{background:var(--invert-accent)}

html.p-studyb .invert p{color:var(--invert-text-2)}

html.p-studyb /* figure placeholder */
.fig{border:1px dashed var(--line-2);background:var(--surface);display:flex;align-items:center;justify-content:center;flex-direction:column;gap:10px;text-align:center;position:relative;min-height:230px;padding:30px}

html.p-studyb .fig .tag{position:absolute;top:12px;left:12px;font-family:var(--font-util);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);background:var(--bg);padding:3px 9px;border:1px solid var(--line)}

html.p-studyb .fig .cap{font-family:var(--font-util);font-size:13px;color:var(--text-2);max-width:44ch;line-height:1.55}

html.p-studyb .fig .icon{font-size:13px;color:var(--accent-2);letter-spacing:.3em}

html.p-studyb .fig.wide{margin-top:34px}

html.p-studyb /* footer */
footer{border-top:1px solid var(--line);background:var(--bg)}

html.p-studyb footer .row{max-width:var(--wrap);margin:0 auto;padding:26px var(--pad);display:flex;justify-content:space-between;align-items:center;gap:20px;font-family:var(--font-util);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--text-3);flex-wrap:wrap}

html.p-studyb footer a{color:var(--accent);text-decoration:none}

html.p-studyb footer .icons{display:flex;gap:14px;align-items:center}

html.p-studyb footer .icons a{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border:1px solid var(--line-2);border-radius:50%;color:var(--text-3);transition:border-color .15s ease,color .15s ease}

html.p-studyb footer .icons a:hover{border-color:var(--accent);color:var(--accent)}

html.p-studyb footer .icons img.icn{width:13px;height:auto;max-height:16px;display:block}

html.p-studyb .navcircle img.navicon{width:11px;height:auto;display:block}

html.p-studyb footer .copy{max-width:var(--wrap);margin:0 auto;padding:0 var(--pad) 26px;font-family:var(--font-util);font-size:10.5px;color:var(--text-3);letter-spacing:.04em}

html.p-studyb /* hero split: content left,html.p-studyb placeholder image top-right,html.p-studyb above credits */
.herotop{display:grid;grid-template-columns:1fr 300px;gap:48px;align-items:start}

html.p-studyb .herotop .fig{min-height:210px;padding:20px}

@media(max-width:900px){html.p-studyb .herotop{grid-template-columns:1fr}html.p-studyb .herotop .fig{max-width:340px}}

html.p-studyb /* paired decision kicker + eyebrow,html.p-studyb guaranteed baseline alignment via flex */
.dline{display:inline-flex;align-items:center;gap:10px;font-family:var(--font-util);font-size:11px;letter-spacing:.1rem;text-transform:uppercase;color:var(--accent-pill);background:var(--accent-tint);border:1px solid var(--accent-tint-border);padding:7px 16px 7px 12px;border-radius:20px;margin-bottom:12px}

html.p-studyb .dline .num{background:var(--accent);color:#fff;font-weight:600;padding:3px 10px;border-radius:14px;font-size:10.5px;flex:0 0 auto}

html.p-studyb /* prominent prev/next navigation */
.pagenav{border-top:1px solid var(--line)}

html.p-studyb .pagenav .row2{max-width:var(--wrap);margin:0 auto;display:grid;grid-template-columns:1fr 1fr}

html.p-studyb .pagenav a{display:block;padding:38px var(--pad);text-decoration:none;color:inherit;transition:background .15s ease}

html.p-studyb .pagenav a:hover{background:var(--surface)}

html.p-studyb .pagenav .prev{border-right:1px solid var(--line);text-align:left}

html.p-studyb .pagenav .next{text-align:right}

html.p-studyb .pagenav .dir{font-family:var(--font-util);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--accent);margin-bottom:10px;display:flex;align-items:center;gap:8px}

html.p-studyb .pagenav .next .dir{justify-content:flex-end}

html.p-studyb .pagenav .arrow{font-size:15px;line-height:1}

html.p-studyb .pagenav .ttl{font-family:var(--font-display);font-weight:600;font-size:23px;color:var(--text);line-height:1.2}

html.p-studyb .pagenav a:hover .ttl{color:var(--accent)}

html.p-studyb .pagenav .stub{opacity:.4;pointer-events:none}

@media(max-width:820px){
  html.p-studyb .pagenav .row2{grid-template-columns:1fr}
  html.p-studyb .pagenav .prev{border-right:none;border-bottom:1px solid var(--line)}
}

html.p-studyb /* shared responsive */
@media(max-width:820px){
  .credits{gap:20px;grid-template-columns:repeat(2,1fr)}
  .invert .wrap{padding-left:30px;padding-right:30px}
  .folio .row .mid{display:none}
}

html.p-studyb /* scroll reveal (behavior shared; JS in casestudy.js) */
@media(prefers-reduced-motion:no-preference){
  .reveal{opacity:0;transform:translateY(14px);transition:opacity .7s ease,transform .7s ease}
  .reveal.in{opacity:1;transform:none}
}

html.p-studyb .pathtick{position:absolute;width:14px;height:14px}

html.p-studyb .pathtick i.h{height:1px;width:14px}

html.p-studyb .pathtick i.v{width:1px;height:14px}

html.p-studyb .pathtick.tl{top:10px;left:10px}

html.p-studyb .pathtick.tr{top:10px;right:10px}

html.p-studyb .pathtick.tr i.v{right:0}

html.p-studyb .pathtick.bl{bottom:10px;left:10px}

html.p-studyb .pathtick.bl i.h{bottom:0}

html.p-studyb .pathtick.br{bottom:10px;right:10px}

html.p-studyb .pathtick.br i.h{bottom:0}

html.p-studyb .pathtick.br i.v{right:0}

html.p-studyb .trade .divider{flex:0 0 auto;width:1px;align-self:stretch;background:var(--line)}

html.p-studyb .trade .tradebody{flex:1;min-width:0}

html.p-studyb .trade .weightbar{margin-top:16px;height:6px;display:flex;border-radius:3px;overflow:hidden}

html.p-studyb .fig-img-b{margin-top:38px;margin-bottom:6px}

html.p-studyb .fig-embed{margin-top:38px;margin-bottom:6px;width:100%}

html.p-studyb .fig-embed iframe{width:100%;height:auto;aspect-ratio:800/450;display:block}

html.p-studyb .fig-embed-420{border:5px solid var(--line)}
html.p-studyb .fig-embed-420 iframe{height:420px;aspect-ratio:auto;display:block}

html.p-studyb .fig-img-b img{width:100%;height:auto;display:block;border:5px solid var(--line)}

html.p-studyb{
  /* palette — warm terracotta, bridges A's cool blue and C's dark amber */
  --paper:#F1E6D3;--paper-2:#E8DAC0;--ink:#2B1F17;--ink-2:#6E5B48;
  --line:#D9C7A8;--accent:#A6472B;--accent-soft:#C97D54;--pine:#2E1712;--pale:#EDE0CF;--pale-2:#CB9572;
  --disp:'Newsreader',Georgia,serif;--body:'Roboto',system-ui,sans-serif;--mono:'IBM Plex Mono',ui-monospace,monospace;
  /* shared token contract */
  --bg:var(--paper);--surface:var(--paper-2);--surface-2:var(--paper-2);
  --text:var(--ink);--text-2:var(--ink-2);--text-3:var(--ink-2);
  --accent-2:var(--accent-soft);--line-2:var(--line);--accent-tint:rgba(166,71,43,.12);--accent-tint-border:rgba(166,71,43,.3);--accent-pill:#8F3B23;--dhead-text:#fff;
  --invert-bg:var(--pine);--invert-text:var(--pale);--invert-text-2:var(--pale);--invert-accent:var(--pale-2);
  --font-display:var(--disp);--font-body:var(--body);--font-util:var(--mono);
  --wrap:1080px;--pad:40px;
}

html.p-studyb h1{font-family:var(--disp);font-weight:500;font-size:78px;line-height:1.02;letter-spacing:-.01em}

html.p-studyb h2{font-family:var(--disp);font-weight:500;font-size:44px;line-height:1.08}

html.p-studyb .thesis{font-family:var(--disp);font-style:italic;font-weight:400;font-size:32px;line-height:1.28;color:var(--ink);max-width:40ch;margin-bottom:22px}

html.p-studyb .hero{padding:80px 0 60px}

html.p-studyb .hero h1{max-width:24ch;margin-bottom:28px}

html.p-studyb .hero .deck{max-width:64ch;font-size:18px}

html.p-studyb /* editorial column + margin aside */
.editorial{display:grid;grid-template-columns:1.55fr .8fr;gap:56px;align-items:start}

html.p-studyb .dropcap p:first-of-type::first-letter{font-family:var(--disp);font-weight:500;font-size:106px;line-height:1;float:left;padding:3px 12px 0 0;color:var(--accent)}

html.p-studyb .aside{border-top:2px solid var(--accent);padding-top:18px}

html.p-studyb .aside .q{font-family:var(--disp);font-style:italic;font-size:26px;line-height:1.24;color:var(--ink)}

html.p-studyb .aside .qs{font-size:13px;color:var(--ink-2);margin-top:14px}

html.p-studyb .bigquote{font-family:var(--disp);font-weight:500;font-size:60px;line-height:1.05;text-align:center;color:#fff;margin:0 auto}

html.p-studyb .bigquote-sub{text-align:center;font-size:13px;letter-spacing:.06em;color:var(--pale-2);margin:20px auto 0;text-transform:uppercase}

html.p-studyb .reach{display:grid;grid-template-columns:1fr 1fr;gap:26px;margin:48px 0 36px}

html.p-studyb .reach .col{border:1px solid rgba(255,255,255,.18);padding:26px;position:relative}

html.p-studyb .reach .col.yes{border-color:var(--pale-2);background:rgba(203,149,114,.10)}

html.p-studyb .reach .k{font-size:11px;letter-spacing:.16em;text-transform:uppercase;margin-bottom:14px;color:var(--pale-2)}

html.p-studyb .reach .yes .k{color:#E7B896}

html.p-studyb .reach .big{font-family:var(--disp);font-size:30px;color:#fff}

html.p-studyb .reach .items{color:var(--pale);font-size:15px;line-height:1.8;margin-top:6px}

html.p-studyb .resolve{text-align:center;font-family:var(--disp);font-style:italic;font-size:26px;color:#fff;max-width:68ch;margin:0 auto;line-height:1.3}

html.p-studyb .pathtick i{position:absolute;background:var(--pale-2)}

html.p-studyb .d1-grid{display:grid;grid-template-columns:7fr 3fr;gap:32px;margin-top:22px;align-items:start}

html.p-studyb .spotlight{text-align:center;border:1px solid var(--line);background:var(--paper-2);padding:26px 20px}

html.p-studyb .spotlight .k{font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);margin-bottom:12px}

html.p-studyb .spotlight .subj{font-family:var(--disp);font-size:22px;color:var(--ink);line-height:1.2}

html.p-studyb .spotlight .tags{display:flex;gap:6px;justify-content:center;margin-top:16px;flex-wrap:wrap}

html.p-studyb .spotlight .tags span{font-size:10.5px;letter-spacing:.04em;color:var(--accent);border:1px solid var(--accent-soft);border-radius:20px;padding:4px 10px}

html.p-studyb .forces{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:38px}

html.p-studyb .force{border-top:2px solid var(--accent);background:var(--paper-2);padding:24px 22px}

html.p-studyb .force .k{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);margin-bottom:12px}

html.p-studyb .force .t{font-family:var(--disp);font-size:20px;color:var(--ink);margin-bottom:10px;line-height:1.15}

html.p-studyb .force p{font-size:14.5px;max-width:none}

html.p-studyb .carousel{max-width:660px;margin:44px auto 0}

html.p-studyb .stage{display:flex;align-items:center;gap:16px;justify-content:center}

html.p-studyb .arrow{width:46px;height:46px;border:1px solid var(--line);background:var(--paper);border-radius:50%;font-size:22px;color:var(--ink);display:flex;align-items:center;justify-content:center;flex:0 0 auto;line-height:1}

html.p-studyb .opt{flex:1;border:1.5px solid var(--accent);background:var(--paper);padding:28px 30px;text-align:left;max-width:460px}

html.p-studyb .opt .k{color:var(--accent);font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-weight:500;margin-bottom:14px;display:flex;justify-content:space-between}

html.p-studyb .opt .line{font-family:var(--disp);font-size:26px;color:var(--ink);line-height:1.24}

html.p-studyb .dots{display:flex;gap:8px;justify-content:center;margin-top:24px;align-items:center}

html.p-studyb .dots i{width:8px;height:8px;border-radius:50%;background:var(--line);display:block}

html.p-studyb .dots i.on{background:var(--accent);width:24px;border-radius:4px}

html.p-studyb .genrow{text-align:center;margin-top:26px}

html.p-studyb .genchip{display:inline-flex;align-items:center;gap:12px;font-size:12px;color:var(--accent);letter-spacing:.06em}

html.p-studyb .genbar{width:130px;height:3px;background:var(--line);border-radius:2px;overflow:hidden;position:relative}

html.p-studyb .triad{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:44px}

html.p-studyb .tri{text-align:center;padding:24px 18px;border-top:1px solid var(--line)}

html.p-studyb .tri .n{font-family:var(--disp);font-size:15px;color:var(--accent);letter-spacing:.1em;text-transform:uppercase;margin-bottom:10px}

html.p-studyb .tri p{font-size:14.5px;margin:0 auto;color:var(--ink)}

html.p-studyb .signal{margin-top:40px;background:var(--pine);color:var(--pale);padding:34px 36px}

html.p-studyb /* tradeoff: bordered icon tile + divider + qualitative weight bar */
.trade{display:flex;gap:22px;align-items:flex-start;padding:24px 26px}

html.p-studyb .trade .tile{flex:0 0 auto;width:56px;height:56px;border:1px solid var(--line);background:var(--paper);display:flex;align-items:center;justify-content:center}

html.p-studyb .trade .weightbar .seg.cost{background:#5C5347;opacity:.85}

html.p-studyb .trade .weightbar .seg.gain{background:var(--accent);opacity:.85}

html.p-studyb .trade .weightlabels{display:flex;justify-content:space-between;margin-top:8px;font-family:var(--mono);font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-2)}

html.p-studyb .signal .k{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--pale-2);margin-bottom:12px}

html.p-studyb .signal p{font-family:var(--disp);font-size:24px;line-height:1.35;color:#fff;max-width:none}

html.p-studyb .ledger{margin-top:34px;border-top:1.5px solid var(--ink)}

html.p-studyb .lrow{display:grid;grid-template-columns:220px 1fr;gap:34px;padding:24px 4px;border-bottom:1px solid var(--line);align-items:baseline}

html.p-studyb .lrow .h{font-family:var(--disp);font-size:23px;color:var(--ink);line-height:1.2em}

html.p-studyb .lrow .h span{display:block;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);margin-bottom:8px;font-family:var(--body)}

html.p-studyb .lrow p{font-size:15px;margin:0}

html.p-studyb .seqwrap{display:flex;gap:36px;position:relative;margin-top:48px}

html.p-studyb .seqwrap::before{content:"";position:absolute;top:16px;left:16px;right:16px;height:1px;background:var(--line);z-index:0}

html.p-studyb .seq{flex:1;position:relative;z-index:1}

html.p-studyb .seqdot{width:32px;height:32px;border:1.5px solid var(--accent);border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:12px;color:var(--accent);margin-bottom:18px;background:var(--paper)}

html.p-studyb .seq .t{font-family:var(--disp);font-weight:500;font-size:19px;color:var(--ink);margin-bottom:10px;line-height:1.2}

html.p-studyb .seq p{font-size:14px;color:var(--ink-2);max-width:none}

html.p-studyb .closing{padding:100px 0}

html.p-studyb .closing .big{font-family:var(--disp);font-weight:500;font-size:42px;line-height:1.16;text-align:center;color:#fff;margin:0 auto}

@media(max-width:820px){
  html.p-studyb{--pad:22px}
  html.p-studyb h1{font-size:46px}
  html.p-studyb .thesis{font-size:24px}
  html.p-studyb .bigquote{font-size:34px}
  html.p-studyb .editorial,html.p-studyb .reach,html.p-studyb .forces,html.p-studyb .triad,html.p-studyb .lrow,html.p-studyb .d1-grid{grid-template-columns:1fr}
  html.p-studyb .seqwrap{flex-direction:column;gap:26px}
  html.p-studyb .seqwrap::before{display:none}
  html.p-studyb .arrow{display:none}
  html.p-studyb .finding{grid-template-columns:1fr;gap:8px}
}

@media(prefers-reduced-motion:no-preference){
  html.p-studyb .genbar::after{content:"";position:absolute;left:-45%;top:0;height:100%;width:45%;background:var(--accent);border-radius:2px;animation:slide 1.5s ease-in-out infinite}
  @keyframes slide{0%{left:-45%}100%{left:100%}}
}

@media(prefers-reduced-motion:reduce){html.p-studyb .genbar::after{content:"";position:absolute;left:0;top:0;height:100%;width:45%;background:var(--accent)}}


/* ===== studyC.html ===== */

html.p-studyc /* ===== shared: casestudy.css ===== */
/* ============================================================
   CASE STUDY — SHARED STYLESHEET
   Common structure/chrome for all three case study pages.
   Each page must define this token contract in its own :root:
     --bg --surface --surface-2
     --text --text-2 --text-3
     --accent --accent-2
     --line --line-2
     --invert-bg --invert-text --invert-text-2 --invert-accent
     --font-display --font-body --font-util
     --wrap --pad
   Edit a rule here and it updates on every page.
   ============================================================ */

*{box-sizing:border-box;margin:0;padding:0}

html.p-studyc html{scroll-behavior:smooth}

html.p-studyc body{background:var(--bg);color:var(--text);font-family:var(--font-body);font-size:17px;line-height:1.66;-webkit-font-smoothing:antialiased}

html.p-studyc .wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--pad)}

html.p-studyc section{position:relative}

html.p-studyc p{color:var(--text-2);max-width:64ch}

html.p-studyc p+p{margin-top:16px}

html.p-studyc .lead{color:var(--text)}

html.p-studyc /* masthead — identical on every page: name/home + icon links */
.masthead{border-bottom:1px solid var(--line);background:var(--bg)}

html.p-studyc .masthead .row{max-width:var(--wrap);margin:0 auto;padding:18px var(--pad);display:flex;justify-content:space-between;align-items:center}

html.p-studyc .masthead .name{margin:0;font-size:0;line-height:1}

html.p-studyc .masthead .name a{font-family:var(--font-display);font-weight:700;font-size:18px;letter-spacing:.01em;text-decoration:none;color:var(--text);white-space:nowrap}

html.p-studyc .masthead .name a:hover{color:var(--accent)}

html.p-studyc .masthead .icons{display:flex;gap:14px;align-items:center}

html.p-studyc .masthead .icons a{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border:1px solid var(--line-2);border-radius:50%;color:var(--text);transition:border-color .15s ease,color .15s ease}

html.p-studyc .masthead .icons a:hover{border-color:var(--accent);color:var(--accent)}

html.p-studyc .masthead .icons img.icn{width:14px;height:auto;max-height:17px;display:block}

html.p-studyc /* slim nav line — arrow + short label,html.p-studyc no border,html.p-studyc just space before the hero */
.topnav{background:var(--bg)}

html.p-studyc .topnav .row{max-width:var(--wrap);margin:0 auto;padding:16px var(--pad) 6px;display:flex;justify-content:space-between;align-items:center;font-family:var(--font-util);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--text-3)}

html.p-studyc .topnav .navitem{display:inline-flex;align-items:center;gap:10px;text-decoration:none;color:var(--text-3);transition:color .15s ease}

html.p-studyc .topnav .navitem:hover{color:var(--accent)}

html.p-studyc .topnav .navitem:hover .navcircle{border-color:var(--accent);color:var(--accent)}

html.p-studyc .topnav .navitem.next{flex-direction:row-reverse}

html.p-studyc .topnav .navcircle{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border:1px solid var(--line);border-radius:50%;font-size:11px;line-height:1;flex:0 0 auto;transition:border-color .15s ease,color .15s ease}

html.p-studyc /* full-width hero visual (A/B),html.p-studyc replacing the old side-by-side placeholder */
.fig.hero-visual{min-height:400px;margin-top:38px;margin-bottom:6px}

html.p-studyc /* section eyebrow */
.eyebrow{font-family:var(--font-util);font-size:12px;letter-spacing:.1rem;text-transform:uppercase;color:var(--accent-pill);font-weight:500;display:inline-flex;vertical-align:middle;align-items:center;background:var(--accent-tint);padding:6px 14px;border-radius:20px;margin-bottom:22px}

html.p-studyc /* decision kicker */
.dhead{font-family:var(--font-util);font-weight:600;font-size:10.5px;letter-spacing:.1rem;text-transform:uppercase;color:var(--dhead-text);background:var(--accent);padding:5px 12px;border-radius:20px;margin-bottom:12px;display:inline-block;vertical-align:middle}

html.p-studyc /* section spacing */
.block{padding:66px 0}

html.p-studyc .block.tight{padding:48px 0}

html.p-studyc /* credits row */
.credits{margin-top:46px;border-top:1px solid var(--line);padding-top:20px;display:grid;grid-template-columns:repeat(4,1fr);gap:24px}

html.p-studyc .credits div{font-family:var(--font-util);font-size:12px;line-height:1.5;color:var(--text)}

html.p-studyc .credits b{display:block;color:var(--accent);font-weight:500;letter-spacing:.12em;text-transform:uppercase;font-size:10.5px;margin-bottom:6px}

html.p-studyc /* tradeoff strip */
.trade{margin-top:36px;border-left:3px solid var(--accent);background:var(--surface-2);padding:20px 24px}

html.p-studyc .trade .k{font-family:var(--font-util);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);margin-bottom:8px}

html.p-studyc .trade p{color:var(--text);max-width:72ch;font-size:16px}

html.p-studyc /* inverted band base (page sets --invert-* tokens) */
.invert{background:var(--invert-bg);color:var(--invert-text)}

html.p-studyc .invert .eyebrow{color:var(--invert-accent)}

html.p-studyc .invert .eyebrow::before{background:var(--invert-accent)}

html.p-studyc .invert p{color:var(--invert-text-2)}

html.p-studyc /* figure placeholder */
.fig{border:1px dashed var(--line-2);background:var(--surface);display:flex;align-items:center;justify-content:center;flex-direction:column;gap:10px;text-align:center;position:relative;min-height:230px;padding:30px}

html.p-studyc .fig .tag{position:absolute;top:12px;left:12px;font-family:var(--font-util);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);background:var(--bg);padding:3px 9px;border:1px solid var(--line)}

html.p-studyc .fig .cap{font-family:var(--font-util);font-size:13px;color:var(--text-2);max-width:44ch;line-height:1.55}

html.p-studyc .fig .icon{font-size:13px;color:var(--accent-2);letter-spacing:.3em}

html.p-studyc .fig.wide{margin-top:34px}

html.p-studyc /* footer */
footer{border-top:1px solid var(--line);background:var(--bg)}

html.p-studyc footer .row{max-width:var(--wrap);margin:0 auto;padding:26px var(--pad);display:flex;justify-content:space-between;align-items:center;gap:20px;font-family:var(--font-util);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--text-3);flex-wrap:wrap}

html.p-studyc footer a{color:var(--accent);text-decoration:none}

html.p-studyc footer .icons{display:flex;gap:14px;align-items:center}

html.p-studyc footer .icons a{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border:1px solid var(--line-2);border-radius:50%;color:var(--text-3);transition:border-color .15s ease,color .15s ease}

html.p-studyc footer .icons a:hover{border-color:var(--accent);color:var(--accent)}

html.p-studyc footer .icons img.icn{width:13px;height:auto;max-height:16px;display:block}

html.p-studyc .navcircle img.navicon{width:11px;height:auto;display:block}

html.p-studyc footer .copy{max-width:var(--wrap);margin:0 auto;padding:0 var(--pad) 26px;font-family:var(--font-util);font-size:10.5px;color:var(--text-3);letter-spacing:.04em}

html.p-studyc /* hero split: content left,html.p-studyc placeholder image top-right,html.p-studyc above credits */
.herotop{display:grid;grid-template-columns:1fr 300px;gap:48px;align-items:start}

html.p-studyc .herotop .fig{min-height:210px;padding:20px}

@media(max-width:900px){html.p-studyc .herotop{grid-template-columns:1fr}html.p-studyc .herotop .fig{max-width:340px}}

html.p-studyc /* paired decision kicker + eyebrow,html.p-studyc guaranteed baseline alignment via flex */
.dline{display:inline-flex;align-items:center;gap:10px;font-family:var(--font-util);font-size:11px;letter-spacing:.1rem;text-transform:uppercase;color:var(--accent-pill);background:var(--accent-tint);border:1px solid var(--accent-tint-border);padding:7px 16px 7px 12px;border-radius:20px;margin-bottom:12px}

html.p-studyc .dline .num{background:var(--accent);color:#fff;font-weight:600;padding:3px 10px;border-radius:14px;font-size:10.5px;flex:0 0 auto}

html.p-studyc /* prominent prev/next navigation */
.pagenav{border-top:1px solid var(--line)}

html.p-studyc .pagenav .row2{max-width:var(--wrap);margin:0 auto;display:grid;grid-template-columns:1fr 1fr}

html.p-studyc .pagenav a{display:block;padding:38px var(--pad);text-decoration:none;color:inherit;transition:background .15s ease}

html.p-studyc .pagenav a:hover{background:var(--surface)}

html.p-studyc .pagenav .prev{border-right:1px solid var(--line);text-align:left}

html.p-studyc .pagenav .next{text-align:right}

html.p-studyc .pagenav .dir{font-family:var(--font-util);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--accent);margin-bottom:10px;display:flex;align-items:center;gap:8px}

html.p-studyc .pagenav .next .dir{justify-content:flex-end}

html.p-studyc .pagenav .arrow{font-size:15px;line-height:1}

html.p-studyc .pagenav .ttl{font-family:var(--font-display);font-weight:600;font-size:23px;color:var(--text);line-height:1.2}

html.p-studyc .pagenav a:hover .ttl{color:var(--accent)}

html.p-studyc .pagenav .stub{opacity:.4;pointer-events:none}

@media(max-width:820px){
  html.p-studyc .pagenav .row2{grid-template-columns:1fr}
  html.p-studyc .pagenav .prev{border-right:none;border-bottom:1px solid var(--line)}
}

html.p-studyc /* shared responsive */
@media(max-width:820px){
  .credits{gap:20px;grid-template-columns:repeat(2,1fr)}
  .invert .wrap{padding-left:30px;padding-right:30px}
  .folio .row .mid{display:none}
}

html.p-studyc /* scroll reveal (behavior shared; JS in casestudy.js) */
@media(prefers-reduced-motion:no-preference){
  .reveal{opacity:0;transform:translateY(14px);transition:opacity .7s ease,transform .7s ease}
  .reveal.in{opacity:1;transform:none}
}

html.p-studyc .pathtick{position:absolute;width:14px;height:14px}

html.p-studyc .pathtick i.h{height:1px;width:14px}

html.p-studyc .pathtick i.v{width:1px;height:14px}

html.p-studyc .pathtick.tl{top:10px;left:10px}

html.p-studyc .pathtick.tr{top:10px;right:10px}

html.p-studyc .pathtick.tr i.v{right:0}

html.p-studyc .pathtick.bl{bottom:10px;left:10px}

html.p-studyc .pathtick.bl i.h{bottom:0}

html.p-studyc .pathtick.br{bottom:10px;right:10px}

html.p-studyc .pathtick.br i.h{bottom:0}

html.p-studyc .pathtick.br i.v{right:0}

html.p-studyc .trade .divider{flex:0 0 auto;width:1px;align-self:stretch;background:var(--line)}

html.p-studyc .trade .tradebody{flex:1;min-width:0}

html.p-studyc .trade .weightbar{margin-top:16px;height:6px;display:flex;border-radius:3px;overflow:hidden}

html.p-studyc{
  /* palette */
  --bg0:#151210;--surface0:#1D1915;--surface2-0:#26211B;
  --cream:#EFE8DA;--cream-2:#B7AD9B;--muted:#93897A;
  --accent0:#E2A63C;--accent-hi:#F3B84A;--sand:#C8B8A0;--line0:#342D25;--line2-0:#463D31;
  --disp:'Space Grotesk',system-ui,sans-serif;--body:'Roboto',system-ui,sans-serif;--mono:'Space Mono',ui-monospace,monospace;
  /* shared token contract */
  --bg:var(--bg0);--surface:var(--surface0);--surface-2:var(--surface2-0);
  --text:var(--cream);--text-2:var(--cream-2);--text-3:var(--muted);
  --accent:var(--accent0);--accent-2:var(--accent-hi);--line:var(--line0);--line-2:var(--line2-0);--accent-tint:rgba(226,166,60,.15);--accent-tint-border:rgba(226,166,60,.35);--accent-pill:var(--accent0);--dhead-text:#151210;
  --invert-bg:var(--surface0);--invert-text:var(--cream);--invert-text-2:var(--cream-2);--invert-accent:var(--accent0);
  --font-display:var(--disp);--font-body:var(--body);--font-util:var(--mono);
  --wrap:1080px;--pad:40px;
}

html.p-studyc h1{font-family:var(--disp);font-weight:700;font-size:120px;line-height:.94;letter-spacing:-.02em}

html.p-studyc h2{font-family:var(--disp);font-weight:600;font-size:44px;line-height:1.06;letter-spacing:-.01em}

html.p-studyc .hero{padding:70px 0 30px}

html.p-studyc .hero .sub{font-family:var(--disp);font-weight:400;font-size:30px;color:var(--cream);max-width:27ch;margin:26px 0 18px;line-height:1.18}

html.p-studyc .hero .thesis{font-family:var(--disp);font-weight:500;font-size:22px;color:var(--accent);letter-spacing:.01em}

html.p-studyc .callrow{display:flex;gap:14px;flex-wrap:wrap;margin-top:36px}

html.p-studyc .callchip{display:inline-flex;align-items:center;gap:12px;border:1px solid var(--line-2);background:var(--surface);padding:13px 18px;border-radius:40px}

html.p-studyc .callchip{text-decoration:none;color:inherit;transition:border-color .15s ease,background .15s ease;cursor:pointer}

html.p-studyc .callchip:hover{border-color:var(--accent)}

html.p-studyc .callchip .dot{width:9px;height:9px;border-radius:50%;background:var(--accent-2);flex:0 0 auto}

html.p-studyc .callchip .who{font-family:var(--body);font-size:12px;color:var(--cream-2);letter-spacing:.02em}

html.p-studyc .callchip .who b{display:block;color:var(--cream);font-weight:500;font-size:13px;letter-spacing:.04em;text-transform:uppercase}

html.p-studyc .callchip .num{font-family:var(--mono);font-size:15px;color:var(--accent);letter-spacing:.02em}

html.p-studyc .hero .prompt{margin-top:16px;font-family:var(--mono);font-size:12px;color:var(--muted);letter-spacing:.04em}

html.p-studyc .wavehero{margin-top:40px;height:70px;display:flex;align-items:center;gap:3px;overflow:hidden;opacity:.6}

html.p-studyc .wavehero .b{width:3px;background:var(--sand);border-radius:2px;flex:0 0 auto}

html.p-studyc .race{margin-top:40px;border-top:1px solid var(--line)}

html.p-studyc .call{display:grid;grid-template-columns:60px 1fr auto;gap:22px;align-items:center;padding:20px 4px;border-bottom:1px solid var(--line)}

html.p-studyc .call .no{font-family:var(--mono);font-size:13px;color:var(--muted)}

html.p-studyc .call .desc{font-family:var(--disp);font-weight:500;font-size:19px;color:var(--cream-2)}

html.p-studyc .call.win .desc{color:var(--cream)}

html.p-studyc .call .status{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;padding:5px 12px;border-radius:20px;border:1px solid var(--line-2);color:var(--muted)}

html.p-studyc .call.win .status{color:var(--bg);background:var(--accent);border-color:var(--accent);font-weight:700}

html.p-studyc .race-cap{margin-top:16px;font-family:var(--mono);font-size:12px;color:var(--muted);letter-spacing:.02em}

html.p-studyc .hugeline{font-family:var(--disp);font-weight:700;font-size:86px;line-height:1;letter-spacing:-.02em;color:var(--cream);text-align:center;margin:0 auto}

html.p-studyc .hugeline b{color:var(--accent);display:block}

html.p-studyc .hugeline-sub{text-align:center;font-family:var(--mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin:22px auto 0;white-space:nowrap}

html.p-studyc .forkrow{display:grid;grid-template-columns:1fr 1fr;gap:26px;margin:52px 0 34px}

html.p-studyc .fk{border:1px solid var(--line-2);padding:28px 26px;position:relative}

html.p-studyc .fk.no{opacity:.62}

html.p-studyc .fk .k{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);margin-bottom:14px}

html.p-studyc .fk.no .k{color:var(--muted)}

html.p-studyc .fk .t{font-family:var(--disp);font-weight:600;font-size:22px;color:var(--cream);margin-bottom:12px}

html.p-studyc .fk p{color:var(--cream-2);font-size:15px;max-width:none}

html.p-studyc .resolve{text-align:center;font-family:var(--disp);font-weight:500;font-size:26px;color:var(--cream);margin:0 auto;line-height:1.28}

html.p-studyc .pathtick i{position:absolute;background:var(--cream-2)}

html.p-studyc .pquote{font-family:var(--disp);font-weight:500;font-size:38px;line-height:1.16;color:var(--cream);max-width:38ch;margin:44px 0;border-left:2px solid var(--accent);padding-left:26px}

html.p-studyc .pausewrap{margin:40px 0 8px;background:var(--surface);border:1px solid var(--line);padding:38px 34px 30px}

html.p-studyc .wave{display:flex;align-items:flex-end;gap:3px;height:130px;width:100%}

html.p-studyc .wave .seg{display:flex;align-items:flex-end;gap:3px;height:100%}

html.p-studyc #wLeft{flex:59 1 0}

html.p-studyc #wGap{flex:31 1 0}

html.p-studyc #wRight{flex:39 1 0}

html.p-studyc .wave .seg.gap{position:relative;align-items:center;padding:0 6px}

html.p-studyc .wave .b{background:var(--cream);border-radius:2px;flex:1 1 0;min-width:0}

html.p-studyc .wave .seg.gap .b{background:var(--line-2)}

html.p-studyc .window{position:absolute;top:0;bottom:0;left:0;right:0;border-left:1px dashed var(--muted);border-right:1px dashed var(--accent);background:linear-gradient(90deg,rgba(226,166,60,.05),rgba(226,166,60,.16))}

html.p-studyc .pauselabels{display:grid;grid-template-columns:59fr 31fr 39fr;margin-top:16px;gap:3px}

html.p-studyc .pauselabels .pl{font-family:var(--mono);font-size:11px;line-height:1.5;color:var(--muted);width:100%}

html.p-studyc .pauselabels .pl.mid{color:var(--accent);text-align:center}

html.p-studyc .pauselabels .pl.right{text-align:right}

html.p-studyc .fig-cap{margin-top:16px;font-family:var(--mono);font-size:12px;color:var(--muted)}

html.p-studyc .boundary{display:grid;grid-template-columns:1fr 2px 1fr;margin-top:40px;border:1px solid var(--line);background:var(--surface)}

html.p-studyc .bside{padding:30px 28px}

html.p-studyc .bside .k{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;margin-bottom:20px}

html.p-studyc .bside.does .k{color:var(--muted)}

html.p-studyc .bside.owns .k{color:var(--accent)}

html.p-studyc .bside ul{list-style:none}

html.p-studyc .bside li{font-family:var(--disp);font-weight:500;font-size:19px;padding:11px 0;border-bottom:1px solid var(--line);color:var(--cream-2)}

html.p-studyc .bside.owns li{color:var(--cream)}

html.p-studyc .bside li:last-child{border-bottom:none}

html.p-studyc .bdivide{background:var(--accent)}

html.p-studyc .boundary-cap{text-align:center;margin-top:18px;font-family:var(--mono);font-size:12px;letter-spacing:.06em;color:var(--muted)}

html.p-studyc .boundary-cap b{color:var(--accent);font-weight:400}

html.p-studyc .vis{display:grid;grid-template-columns:1fr 1fr;gap:26px;margin-top:38px}

html.p-studyc .vcard{border-top:2px solid var(--line-2);padding-top:20px}

html.p-studyc .vcard .k{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);margin-bottom:12px}

html.p-studyc .vcard .t{font-family:var(--disp);font-weight:600;font-size:20px;color:var(--cream);margin-bottom:10px}

html.p-studyc .vcard p{font-size:14.5px;max-width:none}

html.p-studyc .demo{margin-top:36px;border:1px dashed var(--line-2);background:var(--surface);min-height:300px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;position:relative;padding:30px}

html.p-studyc /* tradeoff: bordered icon tile + divider + qualitative weight bar */
.trade{display:flex;gap:22px;align-items:flex-start;padding:24px 26px}

html.p-studyc .trade .tile{flex:0 0 auto;width:56px;height:56px;border:1px solid var(--line);background:var(--surface);display:flex;align-items:center;justify-content:center}

html.p-studyc .trade .weightbar .seg.cost{background:#8a8175;opacity:.65}

html.p-studyc .trade .weightbar .seg.gain{background:var(--accent);opacity:.9}

html.p-studyc .trade .weightlabels{display:flex;justify-content:space-between;margin-top:8px;font-family:var(--mono);font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--text-2)}

html.p-studyc .demo .tag{position:absolute;top:12px;left:12px;font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);border:1px solid var(--line-2);padding:3px 9px}

html.p-studyc .demo .play{width:58px;height:58px;border-radius:50%;border:1.5px solid var(--accent);display:flex;align-items:center;justify-content:center;color:var(--accent);font-size:20px}

html.p-studyc .demo .cap{font-family:var(--mono);font-size:12.5px;color:var(--cream-2);letter-spacing:.04em}

html.p-studyc .demo.ads{border:1px solid var(--line-2);flex-direction:column;padding:44px 30px 34px;gap:26px}

html.p-studyc .phones{display:flex;gap:36px;flex-wrap:wrap;align-items:flex-start;justify-content:center}

html.p-studyc .phone{width:220px;display:flex;flex-direction:column;align-items:center}

html.p-studyc .phone .bezel{position:relative;width:100%;aspect-ratio:9/19.5;background:#0B0A09;border-radius:38px;padding:10px;box-shadow:0 24px 48px rgba(0,0,0,.4);border:1px solid var(--line-2)}

html.p-studyc .phone .screen{position:relative;width:100%;height:100%;border-radius:28px;overflow:hidden;background:#000}

html.p-studyc .phone .screen video{width:100%;height:100%;object-fit:cover;display:block}

html.p-studyc .phone .notch{position:absolute;top:10px;left:50%;transform:translateX(-50%);width:68px;height:20px;background:#0B0A09;border-radius:12px;z-index:2}

html.p-studyc .phone .phone-label{margin-top:14px;text-align:center;font-family:var(--mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--cream-2)}

html.p-studyc .demo .adscap{font-family:var(--mono);font-size:12.5px;color:var(--cream-2);letter-spacing:.04em;text-align:center}

@media(max-width:560px){html.p-studyc .phone{width:180px}}

html.p-studyc /* dark page: these icons are solid black PNGs,html.p-studyc invert so they read against the dark ground */
.masthead .icons img.icn,html.p-studyc footer .icons img.icn,html.p-studyc .navcircle img.navicon{filter:invert(1)}

html.p-studyc .closing{padding:96px 0;background:var(--surface)}

html.p-studyc .closing .big{font-family:var(--disp);font-weight:600;font-size:52px;line-height:1.08;text-align:center;color:var(--cream);max-width:23ch;margin:0 auto 12px}

html.p-studyc .closing .big b{color:var(--accent)}

html.p-studyc .closing .callrow{justify-content:center}

@media(max-width:820px){
  html.p-studyc{--pad:22px}
  html.p-studyc h1{font-size:52px}
  html.p-studyc .hero .sub{font-size:22px}
  html.p-studyc .hero .thesis{font-size:17px}
  html.p-studyc .hugeline{font-size:38px}
  html.p-studyc .hugeline-sub{white-space:normal}
  html.p-studyc .forkrow,html.p-studyc .vis,html.p-studyc .boundary{grid-template-columns:1fr}
  html.p-studyc .boundary{border:1px solid var(--line)}
  html.p-studyc .bdivide{height:2px}
  html.p-studyc .call{grid-template-columns:40px 1fr;gap:12px}
  html.p-studyc .call .status{grid-column:2}
}

@media(prefers-reduced-motion:no-preference){
  html.p-studyc .live .dot{animation:pulse 1.6s ease-in-out infinite}
  @keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(243,184,74,.5)}70%{box-shadow:0 0 0 7px rgba(243,184,74,0)}}
}