/* tokens.css — SSER
 * Sursa unică de adevăr pentru culoare, tipografie, spacing, umbre (CLAUDE.md §3, §8).
 * Niciun hex hardcodat în componente (checklist §19).
 *
 * De unde vin culorile (06.10.2026, k-means pe 300 px, nu din memorie — §17):
 *  - roșul și negrul: fișierul vectorial al logo-ului (assets/site-vechi/logo/, fill #E63030 și #010202);
 *  - hârtia: panoul alb al studioului „SSER Talk Sessions" (foto Picture-93: #ECE8E7 în lumină,
 *    #D7CDC9 în umbră) — un gri-roz, nu crem galben (§6: clusterul crem + terracotta);
 *  - sala: Constanța Hall în lumină roșie (foto Pdc: #190605 32%, #561D15 20%, #A92926 9%).
 * Culorile cerute de Niki (06.10): „un roșu și negru ca în logo și un alb / bej / crem".
 */

@font-face {
  font-family: 'Mona Sans';
  font-style: normal;
  font-weight: 200 900;
  font-stretch: 75% 125%;
  font-display: swap;
  src: url('assets/fonts/MonaSans-var.woff2') format('woff2-variations'),
       url('assets/fonts/MonaSans-var.woff2') format('woff2');
}
@font-face {
  font-family: 'Spline Sans Mono';
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  src: url('assets/fonts/SplineSansMono-var.woff2') format('woff2-variations'),
       url('assets/fonts/SplineSansMono-var.woff2') format('woff2');
}

:root {
  /* --- Hârtia: site-ul luminos ------------------------------------------------- */
  --c-hartie:        #EDE9E6;   /* fundalul: panoul alb SSER, în lumina sălii */
  --c-hartie-2:      #E2DBD7;   /* secțiune adâncită: același panou, în umbră */
  --c-alb:           #F7F5F3;   /* suprafață ridicată (rânduri la hover, câmpuri) */
  --c-cerneala:      #100C0C;   /* textul: negrul logo-ului, încălzit spre sală */
  --c-cerneala-2:    #5E5552;   /* text secundar — 6,0:1 pe hârtie, 5,3:1 pe hârtia adâncită */
  --c-linie:         rgb(16 12 12 / .14);
  --c-linie-tare:    rgb(16 12 12 / .34);

  /* --- Roșul ---------------------------------------------------------------------- */
  --c-rosu:          #E63030;   /* roșul din logo — doar text ≥ 24 px pe hârtie (3,6:1), suprafețe, linii */
  --c-rosu-actiune:  #C8262A;   /* butoanele: alb pe el 5,1:1; text roșu mic pe hârtie 4,6:1 */
  --c-rosu-sala:     #A92926;   /* text roșu mic, etichete — 5,7:1 pe hârtie, 5,1:1 pe hârtia adâncită */
  --c-rosu-noapte:   #FF5A4E;   /* roșul pe negru și pe sală: mai deschis, ca să treacă (vezi perechile) */
  --c-rosu-voal:     rgb(230 48 48 / .10);

  /* --- Sala noaptea (blocurile închise — se cheltuiesc rar) ------------------------ */
  --c-sala:          #1A0706;   /* Constanța Hall cu luminile stinse */
  --c-sala-2:        #561D15;   /* aceeași sală, în lumina roșie a scenei */
  --c-negru:         #100C0C;
  --c-lumina:        #F3EEEA;   /* text pe sală și pe negru */
  --c-lumina-2:      #C9B9B4;   /* text secundar pe sală (10,3:1) */
  --c-linie-noapte:  rgb(243 238 234 / .16);
  --c-lumina-stinsa: rgb(243 238 234 / .2);   /* cuvintele încă stinse din fraza care se aprinde */

  /* --- Sticlă: aceleași culori, translucide, pentru antet și barele fixe ----------- */
  --c-hartie-sticla: rgb(237 233 230 / .86);
  --c-hartie-sticla-2: rgb(237 233 230 / .92);
  --c-sala-sticla:   rgb(26 7 6 / .72);
  --c-sala-voal:     rgb(26 7 6 / .35);
  --c-negru-sticla:  rgb(16 12 12 / .9);
  --c-negru-voal:    rgb(16 12 12 / .75);
  --c-alb-voal:      rgb(255 255 255 / .7);

  /* --- Voaluri peste fotografie: MĂSURATE pe pixeli (unelte/contrast_erou.py, 06.10.2026) ---
     Cu .30 sus (prima variantă, „după ochi"), antetul și eticheta de pe Acasă aveau 4,05:1 și
     4,08:1, textul congresului pe telefon 3,70:1. Cu valorile de mai jos, cel mai slab percentil 1
     e 4,65 (titlul pe telefon, prag 3) și 4,89 (eticheta congresului, prag 4,5). */
  --voal-erou:       linear-gradient(180deg, rgb(26 7 6 / .55) 0%, rgb(26 7 6 / .58) 30%, rgb(26 7 6 / .66) 60%, rgb(26 7 6 / .92) 100%);
  --voal-fasie:      linear-gradient(180deg, transparent 45%, rgb(16 12 12 / .78) 100%);

  /* --- Tipografie ---------------------------------------------------------------- */
  --f-sans:          'Mona Sans', 'Arial Narrow', system-ui, sans-serif;
  --f-mono:          'Spline Sans Mono', ui-monospace, 'Cascadia Mono', monospace;
  /* lățimile Mona Sans (axa wdth): afișul îngust, textul normal, cifrele late */
  --w-ingust:        75%;
  --w-normal:        100%;
  --w-lat:           125%;

  /* Scara de text: 18 px de bază (§6: minim 17 px), raport ~1,25 */
  --step--2: 0.75rem;                                    /* 12 — doar etichete mono majuscule */
  --step--1: 0.875rem;                                   /* 14 — etichete */
  --step-0:  1.125rem;                                   /* 18 — text */
  --step-1:  clamp(1.25rem, 1.15rem + 0.4vw, 1.4rem);    /* 20–22 */
  --step-2:  clamp(1.5rem, 1.3rem + 0.9vw, 1.9rem);      /* 24–30 */
  --step-3:  clamp(1.9rem, 1.5rem + 1.7vw, 2.75rem);     /* 30–44 */
  --step-4:  clamp(2.4rem, 1.7rem + 3vw, 4rem);          /* 38–64 */
  --step-5:  clamp(3rem, 2rem + 4.6vw, 5.75rem);         /* 48–92 */
  /* Trepte editoriale (§6) — o dată pe ecran */
  --step-6:  clamp(3.6rem, 1.8rem + 8vw, 9.5rem);        /* 58–152 */
  --step-7:  clamp(4.5rem, 1rem + 15vw, 15rem);          /* 72–240: cifrele uriașe */

  --lh-text:  1.6;
  --lh-titlu: 0.98;
  --lh-afis:  0.86;
  --track-eticheta: 0.09em;
  --track-afis:    -0.01em;

  /* --- Spațiu --------------------------------------------------------------------- */
  --s-1: 0.25rem;  --s-2: 0.5rem;  --s-3: 0.75rem; --s-4: 1rem;   --s-5: 1.5rem;
  --s-6: 2rem;     --s-7: 3rem;    --s-8: 4.5rem;  --s-9: 6.5rem; --s-10: 9rem;
  --gutter:  clamp(1rem, 0.4rem + 2.6vw, 2.75rem);   /* 16 px pe telefon (§12) */
  --latime:  92rem;
  --text-max: 40rem;

  /* --- Forme ---------------------------------------------------------------------- */
  --r-mic:  4px;
  --r-mediu: 10px;
  --r-pastila: 999px;

  /* --- Lumina și umbrele: o singură sursă, reflectoarele de deasupra scenei (§8) ----
     Umbra cade drept în jos, colorată cu roșul sălii, nu gri. */
  --umbra-1: 0 1px 0 rgb(86 29 21 / .06), 0 6px 14px -8px rgb(86 29 21 / .22);
  --umbra-2: 0 2px 0 rgb(86 29 21 / .05), 0 22px 40px -22px rgb(86 29 21 / .40);
  --umbra-3: 0 40px 80px -40px rgb(26 7 6 / .65);

  /* --- Mișcare (§21: precis, la minut) --------------------------------------------- */
  --e-iesire: cubic-bezier(.22, .9, .3, 1);       /* ≈ power3.out */
  --t-scurt:  .28s;
  --t-mediu:  .7s;
}

/* Perechile riscante, măsurate (unelte/contrast_perechi.py, WCAG):
 *   cerneala / hârtie 16,1 · cerneala / hârtie-2 14,2
 *   cerneala-2 / hârtie 6,0 · cerneala-2 / hârtie-2 5,3
 *   roșu / hârtie 3,6  → DOAR text ≥ 24 px (titluri, cifre) — niciodată etichete
 *   roșu-acțiune / hârtie 4,6 · alb / roșu-acțiune 5,1 (butonul)
 *   roșu-sală / hârtie 5,7 · roșu-sală / hârtie-2 5,1 (etichete roșii mici)
 *   lumină / sală 16,9 · lumină-2 / sală 10,3 · lumină / sală-2 11,5
 *   roșu / negru 4,47 → pică la text mic; pe negru se folosește roșu-noapte
 * Voalurile peste fotografie: vezi NOTES.md (contrast_foto.py), nu se pun „după ochi" (§12). */
