/* =====================================================================
   cirKITry v6 — type system (loaded after every other stylesheet)

   Physical reference: a museum label / rating plate on a piece of lab gear.
   - Archivo (Omnibus-Type, OFL), semi-condensed, for headings and short labels:
     a grotesque with a width axis, in the spirit of museum and transit signage.
   - Atkinson Hyperlegible Next (Braille Institute, OFL) for reading text:
     drawn so I/l/1, b/d/p/q and 0/O never get confused — chosen for kids and
     low-vision readers, not for decoration.
   - Atkinson Hyperlegible Mono ONLY for part codes, designators and units
     (CK–01, BT1, 3 V), where letters and digits must line up and be unambiguous.
   Scale: major third (1.25) for text; fluid headings capped at 5.75rem.
   ===================================================================== */
@font-face{font-family:"Archivo";src:url("/assets/fonts/archivo-standard.woff2") format("woff2-variations"),url("/assets/fonts/archivo-standard.woff2") format("woff2");font-weight:100 900;font-stretch:62% 125%;font-display:swap}
@font-face{font-family:"Atkinson Hyperlegible Next";src:url("/assets/fonts/atkinson-next.woff2") format("woff2-variations"),url("/assets/fonts/atkinson-next.woff2") format("woff2");font-weight:200 800;font-style:normal;font-display:swap}
@font-face{font-family:"Atkinson Hyperlegible Next";src:url("/assets/fonts/atkinson-next-italic.woff2") format("woff2-variations"),url("/assets/fonts/atkinson-next-italic.woff2") format("woff2");font-weight:200 800;font-style:italic;font-display:swap}
@font-face{font-family:"Atkinson Hyperlegible Mono";src:url("/assets/fonts/atkinson-mono.woff2") format("woff2-variations"),url("/assets/fonts/atkinson-mono.woff2") format("woff2");font-weight:200 800;font-display:swap}
/* Metric-matched fallbacks so the swap doesn't jolt the layout */
@font-face{font-family:"Archivo Fallback";src:local("Arial"),local("Helvetica Neue"),local("Liberation Sans");size-adjust:98%;ascent-override:90%;descent-override:22%}
@font-face{font-family:"Atkinson Fallback";src:local("Verdana"),local("DejaVu Sans"),local("Arial");size-adjust:96%;ascent-override:93%;descent-override:24%}

html:root{
  --font-display:"Archivo","Archivo Fallback",Arial,sans-serif;
  --font-body:"Atkinson Hyperlegible Next","Atkinson Fallback",Verdana,sans-serif;
  --font-heading:var(--font-display);
  /* every existing "mono" label in the theme now renders as an Archivo label */
  --font-mono:"Archivo","Archivo Fallback",Arial,sans-serif;
  --font-code:"Atkinson Hyperlegible Mono",ui-monospace,Consolas,monospace;

  /* text scale (fixed, rem) */
  --text-label:.8125rem;   /* 13px  labels, captions, meta   */
  --text-sm:.9375rem;      /* 15px  secondary text            */
  --text-body:1.0625rem;   /* 17px  reading text              */
  --text-lead:1.25rem;     /* 20px  intros under headings     */
  /* heading scale (fluid, bounded) */
  --text-h3:clamp(1.3rem,1.1rem + .6vw,1.6rem);
  --text-h2:clamp(2rem,1.35rem + 2.3vw,3.4rem);
  --text-h1:clamp(2.5rem,1.6rem + 3.2vw,4.5rem);
  --text-display:clamp(3rem,1.6rem + 5vw,5.75rem);

  --heading-stretch:88%;   /* Archivo semi-condensed */
  --heading-track:-.018em;
  --label-track:.07em;
}

/* ---------- base ---------- */
body{font-family:var(--font-body);font-size:var(--text-body);line-height:1.65;letter-spacing:.005em;font-variation-settings:normal;font-kerning:normal;font-optical-sizing:auto;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
p,li,dd,dt,label,input,select,textarea,button,figcaption,td,th{font-variation-settings:normal}
p{text-wrap:pretty}
strong,b{font-weight:700}

/* ---------- headings: one family, two weights, one tracking value ---------- */
h1,h2,h3,h4,.section-title,.cks-h2,.toy__title{font-family:var(--font-display);font-stretch:var(--heading-stretch);font-variation-settings:normal;letter-spacing:var(--heading-track);text-wrap:balance;font-weight:700}
main h1:not(#\#){font-size:var(--text-h1);line-height:1.02;font-weight:700}
.hero-type h1:not(#\#){font-size:var(--text-display);line-height:.98;font-weight:750;letter-spacing:-.022em}
main h2:not(#\#){font-size:var(--text-h2);line-height:1.04;font-weight:700}
main h3:not(#\#){font-size:var(--text-h3);line-height:1.18;font-weight:650;letter-spacing:-.01em}
.lab-readout:not(#\#){font-size:var(--text-label)}
/* the word-split reveal spans inherit, never set their own size */
.mo-w{font:inherit;letter-spacing:inherit}

/* ---------- intros & reading text ---------- */
.page-lead,.cks-lead,.kl__intro,.ds__intro,.hero-summary,.lab-heading>p,.section-intro{font-size:var(--text-lead);line-height:1.5;max-width:52ch}
.hero-summary{font-size:clamp(1.0625rem,1rem + .3vw,1.25rem)}
.rte p,.editorial-row .rte p,.ds__desc,.kl__summary,.cks-trust__text,.v5-steps__text,.toy__sentence{font-size:var(--text-body);line-height:1.65;max-width:68ch}

/* ---------- labels: short, uppercase, Archivo, never below 12px ---------- */
.eyebrow,.v2-patch-panel__label,.lab-stage>span,.lab-scope>div,.lab-frequency>div,.lab-power .bench-power,
.site-footer h2,.footer-heading,.ds dt,.cks-ticker__part,.cks-paths__cta,.toy__glabel,.lesson-toy__glabel,
.kl__grades,.kl__outcome-label,.ds__fig-no,.lesson-toy__fignum,.toy__why-k,.lesson-toy__logic{
  font-family:var(--font-mono);font-stretch:92%;font-weight:600;letter-spacing:var(--label-track);font-size:var(--text-label)}
figcaption,.ds__caption,.lesson-toy__cap,.media-placeholder__caption{font-family:var(--font-body);font-size:var(--text-label);letter-spacing:.01em}
.site-footer__bottom{font-family:var(--font-body);font-size:var(--text-label);letter-spacing:.01em}
.motion-toggle{font-family:var(--font-body);font-size:var(--text-label)}

/* ---------- codes, designators, units, readouts: the only monospace ---------- */
.ds__code,.ds__tab-code,.kl__code,.kl__ref,.lesson-toy__code,.toy__unit,.cks-trust__readout,.lab-readout,
.lab-frequency output,[data-frequency-output],[data-output],.kl__bom td:first-child,.kl table td:nth-child(2),
.st-on,.st-off,.st-when-series code{font-family:var(--font-code);font-stretch:normal;letter-spacing:0;font-variant-numeric:tabular-nums}
.ds__code,.kl__code{font-weight:500;letter-spacing:-.01em}

/* ---------- interface text ---------- */
.button,.ds__cta,.text-link,.toy__btn,.lesson-toy__btn{font-family:var(--font-display);font-stretch:96%;font-weight:650;letter-spacing:.005em}
.button{font-size:var(--text-sm)}
.text-link{font-size:var(--text-sm)}
.main-nav a,.site-header nav a{font-family:var(--font-display);font-stretch:96%;font-weight:550;font-size:var(--text-sm);letter-spacing:.005em}
input,select,textarea{font-family:var(--font-body);font-size:max(16px,1rem)}
label{font-family:var(--font-body);font-weight:700;font-size:var(--text-sm)}
.form-hint,.contact-note{font-size:var(--text-sm)}

/* light-on-dark compensation */
.kinetic-hero p,.site-footer p{letter-spacing:.012em}

@media(max-width:650px){
  html:root{--text-body:1.0625rem;--text-lead:1.125rem}
  .hero-type h1:not(#\#){font-size:clamp(2.8rem,13vw,4rem)}
}
/* one tracking value for every heading (some components set their own, tighter than -0.04em) */
main :is(h1,h2,h3):not(#\#){letter-spacing:var(--heading-track)}