/* SABI STRUCTURA – design tokens (docs/design-system.md §2). Components reference only these. */

/* Archivo (SIL OFL 1.1), self-hosted: one variable woff2 (design §2.2), instanced to wdth 75–125 and wght 400–760
   and subset to Basic Latin, Latin-1, Ă ă Ș ș Ț ț (comma below), dashes, quotes, …, €, − and ≈
   (sketch/src/fetch-fonts.mjs). The cedilla forms (U+015E/015F/0162/0163) are left out on purpose: a stray one shows
   in the fallback face, where review catches it. */
@font-face {
  font-family: "Archivo";
  src: url("../fonts/archivo-ro.var.woff2") format("woff2");
  font-weight: 400 760;
  font-stretch: 75% 125%;
  font-style: normal;
  font-display: swap;
}
/* Metric-matched fallback. Overrides measured in headless Chrome (canvas measureText of Romanian and English
   copy at wdth 100, wght 400): Archivo is 98.77 % of Arial's advance; ascent 0.88 em, descent 0.21 em. */
@font-face {
  font-family: "Archivo Fallback";
  src: local("Arial"), local("ArialMT"), local("Helvetica");
  size-adjust: 98.77%;
  ascent-override: 89.10%;
  descent-override: 21.26%;
  line-gap-override: 0%;
}

:root {
  color-scheme: light;

  /* palette (§2.1) */
  --c-ink:          #001D44;  /* Cerneală */
  --c-grafit:       #3A4C68;  /* Grafit – secondary text, lettering */
  --c-creion:       #7C889C;  /* Creion – NON-TEXT ONLY */
  --c-constructie:  #CDD4DE;  /* Construcție – DECORATIVE ONLY */
  --c-paper:        #FFFFFF;  /* Hârtie */
  --c-calc:         #F0F0F0;  /* Calc */
  --c-on-ink:       #A7B4C8;  /* secondary text on the navy band */
  --c-error:        #B3261E;  /* form errors, on paper or calc only */

  --c-text:        var(--c-ink);
  --c-text-2:      var(--c-grafit);
  --c-bg:          var(--c-paper);
  --c-bg-alt:      var(--c-calc);
  --c-rule:        var(--c-ink);
  --c-rule-ui:     var(--c-creion);
  --c-rule-hair:   var(--c-constructie);
  --c-btn:         var(--c-ink);
  --c-btn-hover:   var(--c-grafit);
  --c-focus:       var(--c-ink);
  --c-band:        var(--c-ink);
  --c-band-text:   var(--c-paper);
  --c-band-text-2: var(--c-on-ink);
  --c-poche-done:  var(--c-calc);
  --c-floor:       var(--c-constructie);

  /* type (§2.2) */
  --font: "Archivo", "Archivo Fallback", Arial, Helvetica, sans-serif;
  --w-lettering: 80%;
  --w-text:      100%;
  --w-display:   108%;
  --w-notation:  112%;
  --w-figure:    125%;

  --fs-h1:        clamp(2.5rem, 4.15vw, 3.75rem);
  --fs-statement: clamp(1.875rem, 3.05vw, 2.75rem);
  --fs-h2:        clamp(1.625rem, 2.5vw, 2.25rem);
  --fs-h3:        clamp(1.25rem, 1.53vw, 1.375rem);
  --fs-figure:    clamp(2.5rem, 4.15vw, 3.75rem);
  --fs-figure-s:  clamp(1.5rem, 2.2vw, 2rem);
  --fs-notation:  clamp(1rem, 1.25vw, 1.25rem);
  --fs-lede:      clamp(1.125rem, 1.39vw, 1.25rem);
  --fs-body:      clamp(1rem, 0.95rem + 0.2vw, 1.0625rem);
  --fs-ui:        1rem;
  --fs-value:     1rem;
  --fs-small:     0.875rem;
  --fs-lettering: 0.8125rem;

  /* space, grid, chrome (§2.3) */
  --s-1: 4px;  --s-2: 8px;  --s-3: 12px; --s-4: 16px; --s-5: 24px;
  --s-6: 32px; --s-7: 48px; --s-8: 64px; --s-9: 96px; --s-10: 128px;
  --section-y:  clamp(56px, 6vw, 96px);
  --stack-head: clamp(24px, 2.2vw, 32px);
  --cell-pad:   10px 14px 12px;
  --page-max:    1440px;
  --content-max: 1312px;
  --margin:      clamp(16px, 4.45vw, 64px);
  --gutter:      clamp(16px, 1.67vw, 24px);
  --measure:      62ch;
  --measure-lede: 66ch;
  --header-h: 64px;
  --bar-h:    56px;

  /* borders (§2.4) */
  --rule-frame: 2px solid var(--c-ink);
  --rule-cell:  1px solid var(--c-ink);
  --rule-ui:    1px solid var(--c-creion);
  --rule-hair:  1px solid var(--c-constructie);
  --radius: 0;
  --shadow: none;

  /* motion (§2.5) */
  --dur-instant: 100ms;
  --dur-quick:   160ms;
  --dur-draw:    400ms;
  --dur-rise:    450ms;
  --stagger:     55ms;
  --ease-out:    cubic-bezier(0.2, 0.7, 0.2, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
}
@media (max-width: 1023.98px) {
  :root { --fs-h1: clamp(2.5rem, 6vw, 3.5rem); }
}
@media (max-width: 759.98px) {
  :root { --header-h: 56px; --cell-pad: 10px 12px; }
}
@media (prefers-reduced-motion: reduce) {
  :root { --dur-instant: 0ms; --dur-quick: 0ms; --dur-draw: 0ms; --dur-rise: 0ms; --stagger: 0ms; }
  html { scroll-behavior: auto; }
}