/* Shared type roles. Loaded after page styles on every public HTML page. */
:root{
  --font-ui:Inter,Arial,sans-serif;
  --type-logo:24px;
  --type-logo-large:36px;
  --font-code:ui-monospace,SFMono-Regular,Consolas,monospace;
  --type-caption:12px;
  --type-ui:14px;
  --type-body:16px;
  --type-lead:18px;
  --type-card:clamp(22px,2vw,28px);
  --type-title:clamp(28px,3vw,36px);
  --type-section:clamp(28px,3.6vw,48px);
  --type-display:clamp(36px,5.3vw,76px);
  --type-weight-body:400;
  --type-weight-heading:600;
  --type-weight-ui:500;
  --type-leading-body:1.6;
  --type-leading-heading:1.12;
}
html{font-size:16px}
body{font-family:var(--font-ui);font-size:var(--type-body);line-height:var(--type-leading-body)}
body :is(h1,h2,h3,h4,h5,h6,p,a,span,div,li,dt,dd,blockquote,figcaption,label,legend,button,input,select,textarea,summary,small,strong,em,b){font-family:var(--font-ui)}
body :is(h1){font-size:var(--type-display);font-weight:var(--type-weight-heading);line-height:var(--type-leading-heading);letter-spacing:-.045em;overflow-wrap:anywhere}
body :is(h2){font-size:var(--type-section);font-weight:var(--type-weight-heading);line-height:var(--type-leading-heading);letter-spacing:-.035em;overflow-wrap:anywhere}
body :is(h3){font-size:var(--type-card);font-weight:var(--type-weight-heading);line-height:1.25;letter-spacing:-.025em;overflow-wrap:anywhere}
body :is(h4,h5,h6){font-size:var(--type-lead);font-weight:var(--type-weight-heading);line-height:1.35}
body :is(p){font-size:var(--type-body);line-height:var(--type-leading-body)}
body :is(button,.btn,.primary,.text-link,.social,.nav a,.header-contact,.catalog-links a,.project-links a,.case-header-cta,.source-links a){font-size:var(--type-ui);line-height:1.45;font-weight:var(--type-weight-ui)}
body :is(input,select,textarea){font-size:var(--type-body);line-height:1.45}
body :is(label,legend,summary){font-size:var(--type-ui);line-height:1.5}
body :is(small,figcaption,.eyebrow,.section-index,.case-kicker,.ch-kicker,.ch-label,.section-note,.hero-meta,.hero-foot,.project-index,.project-category,.project-year,.project-contribution,.catalog-meta,.catalog-badge,.catalog-type,#catalog-count,.service-crumbs,.service-disclaimer,.case-meta dt,.ch-meta dt,.state-badge,.ch-note,.ch-demo-band small,.ch-demo-points,.phone-caption,.demo-note,.storage-note,.demo-bar,.benefits,.range-labels,.included,.form-error,.inline-error,.concept,.app-kicker,.status){font-size:var(--type-caption);line-height:1.6}
body :is(.footer,.case-footer,.catalog-footer,.service-footer,.ch-footer,footer){font-size:var(--type-caption);line-height:1.6}
body :is(.header,.case-header,.catalog-header,.service-header,.ch-header){font-size:var(--type-ui);line-height:1.5}
body :is(.hero-copy,.service-lead,.case-intro>p,.ch-intro p,.lead,.result-lead){font-size:var(--type-lead);line-height:1.65}
body :is(.case-hero h1>span,.ch-hero h1>span){font-size:var(--type-section);line-height:1.15;letter-spacing:-.035em}
body .hero h1 .intro{font-size:var(--type-lead);line-height:1.5;letter-spacing:0}
body :is(.catalog-card h2,.project-title h3,.screen-heading h3,.admin-decisions h3,.evidence-flow h3,.decision-notes h3,.principles h3,.ch-decisions h3,.ch-architecture h3){font-size:var(--type-card);line-height:1.25}
body :is(.case-meta dd,.ch-meta dd){font-size:var(--type-ui);line-height:1.6}
body :is(.case-offer p,.ch-contact p:not(.ch-kicker),.ch-screen-head p,.ch-reading,.reading,.proof-intro,.proof-grid p,.decision-notes p,.project-info p,.catalog-description,.about-main p,.service-body p,.admin-try li,.try-steps li){font-size:var(--type-body);line-height:var(--type-leading-body)}
body :is(.case-hero h1,.ch-hero h1){margin-bottom:28px}
body :is(.next-case strong,.ch-next strong){font-size:var(--type-title);line-height:1.25}
body :is(pre,code,kbd,samp,pre *,code *){font-family:var(--font-code);font-size:var(--type-ui);line-height:1.6;letter-spacing:0}
/* A working screen uses a title role; it is not a marketing display. */
html[data-type-surface=app] body :is(h1){font-size:var(--type-title);line-height:1.2;letter-spacing:-.03em}
html[data-type-surface=app] body :is(h2){font-size:var(--type-card);line-height:1.25}
html[data-type-surface=app] body :is(h3){font-size:var(--type-lead);line-height:1.35}
html[data-type-surface=app] body :is(.screen-head p,.app-header,.bottom-nav button,.sidebar nav a,.sidebar nav button,.toolbar label,.stat span){font-size:var(--type-caption)}
html[data-type-surface=app] body :is(.pack-group h3){font-size:var(--type-caption);letter-spacing:.08em}
html[data-type-surface=app] .app .chips{margin-inline:0;width:100%;max-width:100%;padding-inline:0}
body :is(.manager-title,.step-title,.empty h3,.result h2){font-size:var(--type-title);line-height:1.2}
body :is(.summary h3,.order h3,.client-order h3){font-size:var(--type-card);line-height:1.25}
body :is(.summary small,.summary-context,.order p,.client-order p,.timeline span,.stepper span,.field small,.tip){font-size:var(--type-caption);line-height:1.6}
body :is(.total strong,.stats strong){font-size:var(--type-section);line-height:1.15;letter-spacing:-.035em}
@media(max-width:640px){
  :root{--type-display:clamp(34px,8.5vw,48px);--type-section:clamp(28px,6.5vw,36px);--type-card:24px;--type-title:28px}
  body :is(.header,.case-header,.catalog-header,.service-header,.ch-header){font-size:var(--type-caption)}
  body :is(.case-header,.ch-header){height:auto;min-height:72px;flex-wrap:wrap;padding-block:16px}
  body :is(.hero-copy,.service-lead,.case-intro>p,.ch-intro p,.lead){font-size:var(--type-body)}
  body :is(.btn,.primary){white-space:normal}
  body .project-info p{max-width:100%}
}