/* ============================================================
   Design tokens — moșteniți din sistemul facilitare.ro (§2.2)
   + accentul specific acestui sub-brand (§2.3)
   ============================================================ */

@font-face {
  font-family: 'Oswald';
  src: url('/assets/fonts/oswald-600.woff2') format('woff2');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Figtree';
  src: url('/assets/fonts/figtree-400.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Figtree';
  src: url('/assets/fonts/figtree-600.woff2') format('woff2');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Figtree';
  src: url('/assets/fonts/figtree-700.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Caveat';
  src: url('/assets/fonts/caveat-500.woff2') format('woff2');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Caveat';
  src: url('/assets/fonts/caveat-700.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

:root{
  /* ---- culori — moștenite (§2.2) ---- */
  --paper:#F7F9FC;
  --white:#FFFFFF;
  --ink:#16283C;
  --navy:#1D5A96;
  --navy-deep:#14395F;
  --orange:#F59223;         /* rezervat exclusiv acțiunilor — nu-l pune pe altceva */
  --slate:#44566B;
  --line:#DFE7F0;

  /* ---- accent specific școlii — galben-marker (§2.3.1) ---- */
  --marker:#F2C94C;
  --marker-soft:#FFF3CE;

  /* ---- nuanțe derivate (utilitare, nu culori noi — tonuri de navy pt.
     fundaluri de iconițe/pastile; documentat în DECISIONS.md) ---- */
  --navy-soft:#E8F0F8;

  /* ---- familia post-it v3 (§1.3) — numai pe artefacte de tablă
     (post-it-uri, buline de vot, etichete), NICIODATĂ pe butoane/linkuri.
     Aceleași hex-uri ca paleta ilustrațiilor generate (plan §3.2), pentru
     coerență între foto/ilustrații și UI. Contrast text --ink (#16283C) pe
     fiecare, verificat WCAG (formulă relativă luminance, v3 Pas 2):
     galben 9.43:1 · albastru 8.77:1 · roz 8.94:1 · mentă 9.40:1 — toate
     depășesc confortabil pragul AA de 4.5:1 pentru text normal. */
  --postit-yellow:var(--marker);
  --postit-blue:#A9C9F0;
  --postit-pink:#F4B8C8;
  --postit-mint:#A8D8B9;

  /* umbra de post-it — offset mic + blur mediu, mai "ridicată de pe masă"
     decât --shadow-card (care e simetrică, pt. carduri albe editoriale) */
  --shadow-postit: 3px 8px 16px rgba(22,40,60,.18), 0 2px 4px rgba(22,40,60,.10);

  /* bandă adezivă (tape) — folosită de partialul doodles.njk */
  --tape-fill: rgba(255,255,255,.78);
  --tape-shadow: rgba(22,40,60,.2);

  /* fundal „tablă" — dot-grid discret (§1.3), rezervat secțiunilor
     interactive/cinematice din Pas 3–5; NU se aplică încă nicăieri */
  --dot-grid-color: var(--line);
  --dot-grid-size: 24px;

  /* ---- tipografie — moștenită ---- */
  --font-display:'Oswald', 'Arial Narrow', sans-serif;
  --font-body:'Figtree', -apple-system, sans-serif;
  --font-hand:'Caveat', cursive;

  /* ---- forme — moștenite ---- */
  --radius-card:16px;
  --radius-sm:10px;
  --shadow-card: 0 1px 2px rgba(22,40,60,.06), 0 8px 28px rgba(22,40,60,.08);
  --shadow-card-hover: 0 1px 2px rgba(22,40,60,.08), 0 14px 36px rgba(22,40,60,.13);

  /* ---- mișcare — curba-semnătură (§2.2) ---- */
  --ease-signature: cubic-bezier(0.34, 1.3, 0.5, 1);
}

/* font-size fallback pentru Oswald/Figtree — grosier, calibrat mai fin în pasul 7
   când verificăm CLS pe măsurători reale (vezi DECISIONS.md) */
@font-face {
  font-family: 'Oswald Fallback';
  src: local('Arial Narrow'), local('Arial');
  size-adjust: 92%;
  ascent-override: 100%;
}
@font-face {
  font-family: 'Figtree Fallback';
  src: local('Arial');
  size-adjust: 100%;
}

/* utilitar dot-grid — fundal de „tablă" (§1.3). Neaplicat încă nicăieri în
   Pas 2; rezervat secțiunilor-tablă din Pas 3–5 (hero, aranjează sala,
   haos-la-plan). */
.bg-dot-grid{
  background-image: radial-gradient(var(--dot-grid-color) 1.5px, transparent 1.5px);
  background-size: var(--dot-grid-size) var(--dot-grid-size);
}