/* Shared case-study type system. The homepage header is governed exclusively by shared-navigation.css. */
:root {
  --cs-canvas:#fbf7f1;
  --cs-cream:#f4efe8;
  --cs-ink:#29333b;
  --cs-body:#485760;
  --cs-muted:#606c74;
  --cs-rule:rgba(41,51,59,.18);
  --cs-serif:'Newsreader', Georgia, serif;
  --cs-sans:'DM Sans',system-ui,sans-serif;
  --cs-h1:clamp(3rem,4.75vw,4.625rem);
  --cs-h2:clamp(2rem,2.85vw,2.55rem);
  --cs-h3:1.375rem;
  --cs-body-size:1rem;
  --cs-body-line:1.72;
  --cs-caption:.8125rem;
  --cs-content:1080px;
  --cs-measure:760px;
}
html{scroll-padding-top:90px}
body.portfolio-case {background:var(--cs-canvas)!important;color:var(--cs-ink)!important;font-family:var(--cs-sans)!important;font-size:var(--cs-body-size)!important;line-height:var(--cs-body-line);-webkit-font-smoothing:antialiased}
body.portfolio-case main,body.portfolio-case .story-panel,body.portfolio-case .story-panel[data-panel="theory"]{background:var(--cs-canvas)!important}
body.portfolio-case main p,body.portfolio-case main li,body.portfolio-case main .structured-list li,
body.portfolio-case main .evidence-line p,body.portfolio-case main .foundation-note p,
body.portfolio-case main .ai-role-note p,body.portfolio-case main .ai-role-thesis p,
body.portfolio-case main .ai-role-signoff,body.portfolio-case main .story-intro p,
body.portfolio-case main .story-section p,body.portfolio-case main .story-section .quiet-note,
body.portfolio-case main .visual-thumb-grid .thumb-meta p,
body.portfolio-case main .quick span,body.portfolio-case main .people p,
body.portfolio-case main .platform-story p,body.portfolio-case main .platform-copy p,
body.portfolio-case main .shift p,body.portfolio-case main .touchpoints span,
body.portfolio-case main .strategy-strip span,body.portfolio-case main .lifecycle span,
body.portfolio-case main .end p,body.portfolio-case main .section .lead,
body.portfolio-case main .intro .lead,body.portfolio-case main .paired p,
body.portfolio-case main .era-note p,body.portfolio-case main .section-note,
body.portfolio-case main .audience-takeaway,
body.portfolio-case .comparison p,body.portfolio-case .practice-closing p,
body.portfolio-case .decision-visuals-top p {
  font-family:var(--cs-sans)!important;font-size:var(--cs-body-size)!important;
  line-height:var(--cs-body-line)!important;color:var(--cs-body)!important;
  letter-spacing:normal!important;font-weight:400;
}
body.portfolio-case main p strong,body.portfolio-case main li strong,body.portfolio-case main p b{color:var(--cs-ink);font-weight:600}
body.portfolio-case main h1,body.portfolio-case main h2,body.portfolio-case .hero h1,
body.portfolio-case main .story-section h3,body.portfolio-case main .section h2,
body.portfolio-case main .end h2,body.portfolio-case main .metricwrap h2 {
  font-family:var(--cs-serif)!important;font-weight:400!important;letter-spacing:-.035em!important;color:var(--cs-ink)!important;text-wrap:pretty;
}
body.portfolio-case main h1,body.portfolio-case .hero h1{font-size:var(--cs-h1)!important;line-height:1.08!important;max-width:1000px}
body.portfolio-case main h2,body.portfolio-case .story-intro h2,body.portfolio-case main .section h2,
body.portfolio-case main .end h2,body.portfolio-case main .metricwrap h2,
body.portfolio-case .related-top h2{font-size:var(--cs-h2)!important;line-height:1.17!important;letter-spacing:-.032em!important;font-family:var(--cs-serif)!important;font-weight:400!important;color:var(--cs-ink)!important}
body.portfolio-case main h3,body.portfolio-case main .section h3,
body.portfolio-case main .platform-story h3,body.portfolio-case main .ecosystem-vision h3,
body.portfolio-case main .touchpoints h3,body.portfolio-case main .case h3 {
  font-family:var(--cs-sans);font-size:var(--cs-h3)!important;line-height:1.35!important;letter-spacing:-.015em!important;font-weight:600!important;color:var(--cs-ink)!important;
}
body.portfolio-case main h4,body.portfolio-case main .figure-title{font-family:var(--cs-sans);font-size:1rem!important;line-height:1.4!important;font-weight:600!important;color:var(--cs-ink)!important}
body.portfolio-case main figcaption,body.portfolio-case main .figure figcaption,
body.portfolio-case main .visual figcaption,body.portfolio-case main .artifact-note,
body.portfolio-case main .cover figcaption,
body.portfolio-case main .meta small,
body.portfolio-case .footer,body.portfolio-case .site-footer,
body.portfolio-case main .direction-shift span,
body.portfolio-case main .ai-role-note small,
body.portfolio-case main .visual-thumb-grid .decision-visuals-top span{
  font-family:var(--cs-sans);font-size:var(--cs-caption)!important;line-height:1.55!important;color:var(--cs-muted)!important;
}
body.portfolio-case .meta strong{font-size:.875rem!important;line-height:1.5!important;font-weight:600}
body.portfolio-case .lede,body.portfolio-case .hero-reading>p{font-size:1.125rem!important;line-height:1.56!important;color:var(--cs-body)!important;max-width:var(--cs-measure)}
body.portfolio-case .portfolio-site-header,body.portfolio-case .portfolio-site-header *{font-family:var(--cs-sans)}
body.portfolio-case .portfolio-site-header .portfolio-wordmark{font-size:1.02rem;font-weight:600}
body.portfolio-case .portfolio-site-header .portfolio-nav a{font-size:.93rem;font-weight:400}
/* The case studies all use warm paper, and their editorial dividers use one color. */
body.portfolio-case .hero,body.portfolio-case .case-hero{background-color:var(--cs-cream)}
body.portfolio-case .rule,body.portfolio-case .section,.portfolio-case .story-section,
body.portfolio-case .case,body.portfolio-case .sys-row,body.portfolio-case .meta,
body.portfolio-case .quick,body.portfolio-case .people article,
body.portfolio-case .touchpoints article{border-color:var(--cs-rule)}
/* Quality: keep all approved sections, leadership examples, visual placeholders, and text. */
body.case-quality{--paper:var(--cs-canvas);--text:var(--cs-ink);--secondary:var(--cs-body);--muted:var(--cs-muted);--line:var(--cs-rule);--max:var(--cs-content)}
body.case-quality .shell,body.case-quality .read,body.case-quality .footer .wrap {width:min(var(--cs-content),calc(100% - 6rem));max-width:none;margin-inline:auto}
body.case-quality main section{padding-top:clamp(3rem,4.6vw,4rem)}
body.case-quality main section > .read > p,body.case-quality main section > .shell > p,
body.case-quality .feature-intro>p,body.case-quality .case-content>p,
body.case-quality .case-content .key,body.case-quality .system-note{max-width:var(--cs-measure)}
body.case-quality .nested-read{max-width:var(--cs-measure);margin:0}
body.case-quality .hero{padding-top:2rem}
body.case-quality .hero h1{margin-top:clamp(2.1rem,4vw,3.8rem);margin-bottom:1.25rem}
body.case-quality .hero .lede{margin-bottom:2rem}
body.case-quality .cover-placeholder{margin-top:1.8rem}
body.case-quality main .three,body.case-quality main .mechanisms,body.case-quality main .outcomes{gap:1.5rem}
body.case-quality main .three strong,body.case-quality main .outcome strong,
body.case-quality main .sys-label,body.case-quality main .sys-cell strong{font-size:1rem!important;font-weight:600!important;color:var(--cs-ink)!important}
body.case-quality main .case-content h3{font-family:var(--cs-serif)!important;font-size:clamp(1.7rem,2.25vw,2.1rem)!important;line-height:1.22!important;font-weight:400!important}
body.case-quality main .case-content h4{color:var(--cs-body)!important;font-weight:500!important}
body.case-quality main .key{border-color:#6e8c85;margin-top:1.25rem;margin-bottom:1.5rem}
body.case-quality main .case{padding:2.4rem 0 2.8rem}
body.case-quality main .image-placeholder,body.case-quality main .hero-placeholder{background:#eeeae3;border-color:var(--cs-rule)}
body.case-quality .footer{background:var(--cs-canvas)}
/* InVision: keep the actual embedded imagery and editorial grouping, with fewer type variations. */
body.case-invision{--paper:var(--cs-canvas);--text:var(--cs-ink);--secondary:var(--cs-body);--muted:var(--cs-muted);--line:var(--cs-rule);--max:var(--cs-content)}
body.case-invision .shell,body.case-invision .widefig{width:min(var(--cs-content),calc(100% - 6rem))}
body.case-invision .read{width:min(var(--cs-measure),calc(100% - 6rem))}
body.case-invision .narrowfig{width:min(870px,calc(100% - 6rem))}
body.case-invision .hero{padding-top:2rem}
body.case-invision .hero h1{margin-top:clamp(2.1rem,4vw,3.8rem)}
body.case-invision main > .section,body.case-invision main > section.section{padding-top:clamp(3rem,4.5vw,4rem)!important}
body.case-invision main > section.section-tight{padding-top:2rem!important}
body.case-invision main > section.intro{padding-top:3.3rem!important}
body.case-invision main > section.platform-story,body.case-invision main > section.ecosystem-vision{padding-top:2.2rem!important}
body.case-invision .platform-story h3,body.case-invision .ecosystem-vision h3{font-size:var(--cs-h3)!important}
body.case-invision .people p,body.case-invision .touchpoints span,body.case-invision .strategy-strip span{font-size:1rem!important}
body.case-invision .metrics strong{font-family:var(--cs-serif);font-weight:400;font-size:2.55rem}
body.case-invision .footer{background:var(--cs-canvas)}
/* AI Transformation: preserve its original structure, its two views, and diagrams.
   Its main chapter headings remain visually distinct while the body uses one size. */
body.case-ai{--cream:var(--cs-cream);--paper:var(--cs-canvas);--ink:var(--cs-ink);--muted:var(--cs-muted);--rule:var(--cs-rule);
--frame:min(var(--cs-content),calc(100% - 6rem));--read:min(var(--cs-measure),calc(100% - 6rem));}
body.case-ai main .story-section h3{font:400 clamp(1.9rem,2.7vw,2.45rem)/1.16 var(--cs-serif)!important;letter-spacing:-.035em!important}
body.case-ai main .story-section h4,body.case-ai main .evidence h4,
body.case-ai main .foundation-note h4,body.case-ai main .ai-role-thesis h4,
body.case-ai main .ai-role-note h4{font-family:var(--cs-sans)!important;font-size:1rem!important;line-height:1.45!important;font-weight:600!important;letter-spacing:normal!important;color:var(--cs-ink)!important}
body.case-ai main .direction-shift p{font-family:var(--cs-serif)!important;font-size:1.375rem!important;line-height:1.3!important;color:var(--cs-ink)!important}
body.case-ai main .rhythm-stages span,body.case-ai main .evidence-line strong{font-size:1rem!important;line-height:1.5!important}
body.case-ai main .rhythm-lane h4,body.case-ai main .comparison h4{font-size:1rem!important}
body.case-ai .story-section{padding:clamp(2.2rem,3.3vw,3.1rem) 0}
body.case-ai .story-intro{padding-bottom:.75rem}
body.case-ai .story-intro h2{margin-bottom:1.35rem}
body.case-ai .evidence{border-bottom:0}
body.case-ai .ai-role-map{background:#edf0ea}
body.case-ai .perspective-switch{background:rgba(251,247,241,.975)}
body.case-ai .visual-thumb-grid .thumb-meta h4{font-size:1rem!important}
body.case-ai .related-work{background:#dce6df}
body.case-ai .related-case h3{font-family:var(--cs-serif)!important;font-weight:400!important;font-size:1.5rem!important}
@media(max-width:760px){
 body.case-quality .shell,body.case-quality .read,body.case-quality .footer .wrap,
 body.case-invision .shell,body.case-invision .read,body.case-invision .widefig,body.case-invision .narrowfig,
 body.case-quality .footer .wrap{width:calc(100% - 2.25rem)}
 body.case-quality .meta{grid-template-columns:1fr 1fr}
 body.case-ai{--frame:calc(100% - 2.25rem);--read:calc(100% - 2.25rem)}
}
@media(max-width:680px){
 body.portfolio-case{--cs-h1:clamp(2.65rem,9vw,3.4rem);--cs-h2:clamp(1.95rem,7vw,2.2rem)}
 body.case-quality .three,body.case-quality .mechanisms,body.case-quality .outcomes{grid-template-columns:1fr}
 body.case-quality .meta{grid-template-columns:1fr}
 body.case-ai .story-section{padding:2rem 0}
 body.case-ai main .story-section h3{font-size:clamp(1.8rem,7.1vw,2.2rem)!important}
 body.case-ai .ai-role-map{width:calc(100vw - 2.25rem)}
}
@media(prefers-reduced-motion:reduce){body.portfolio-case *{scroll-behavior:auto!important}}
