/* =========================================================================
   service-termopane.com — DESIGN TOKENS
   Sursa unică de valori pentru tema GEO-CMS. Documentat în DESIGN-SYSTEM.md.
   Paleta pornește de la culorile reale ale tâmplăriei:
   alb profil (RAL 9016, ușor cald) · antracit (RAL 7016) · muchia de sticlă.
   ========================================================================= */

/* Fonturi servite local din tema (SIL OFL 1.1; licentele in assets/fonts/OFL-*.txt).
   Doar ce se foloseste: Sora 600 (toate titlurile), Manrope variabil 400-600 (text 400, navigatie 500, actiuni 600),
   IBM Plex Mono 400 / 500 (etichete tehnice). Fiecare familie are doua subseturi:
   latin (textul de baza) + latin-ext (H-014: diacriticele romanesti ă, ș, ț; â si î sunt deja in latin).
   Browserul descarca subsetul latin-ext doar daca pagina contine astfel de caractere.
   H-014: accentul italic (Instrument Serif) nu se mai foloseste; fisierul ramane in assets/fonts (DEC-009). */
@font-face {
  font-family: "Sora";
  src: url("../fonts/sora-600-latin.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Sora";
  src: url("../fonts/sora-600-latin-ext.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Manrope";
  src: url("../fonts/manrope-400-600-latin.woff2") format("woff2");
  font-weight: 400 600;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Manrope";
  src: url("../fonts/manrope-400-600-latin-ext.woff2") format("woff2");
  font-weight: 400 600;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "IBM Plex Mono";
  src: url("../fonts/ibm-plex-mono-400-latin.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "IBM Plex Mono";
  src: url("../fonts/ibm-plex-mono-400-latin-ext.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "IBM Plex Mono";
  src: url("../fonts/ibm-plex-mono-500-latin.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "IBM Plex Mono";
  src: url("../fonts/ibm-plex-mono-500-latin-ext.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* Rezerve metrice (Arial ajustat, masurat pe fonturile de mai sus) → reduc saltul de layout pana la incarcare */
@font-face {
  font-family: "Sora Fallback";
  src: local("Arial Bold"), local("Arial-BoldMT"), local("Arial");
  font-weight: 600;
  size-adjust: 107%;
  ascent-override: 90.6%;
  descent-override: 27.1%;
  line-gap-override: 0%;
}
@font-face {
  font-family: "Manrope Fallback";
  src: local("Arial");
  size-adjust: 102.2%;
  ascent-override: 104.7%;
  descent-override: 29.3%;
  line-gap-override: 0%;
}

:root {
  /* ---- H-014: paleta luminoasa. Albastru = identitate si "reglat", portocaliu = accent si "de observat acum" ---- */
  /* Hartie (alb rece, curat) */
  --paper: #F7F9FC;
  --paper-2: #EEF3F9;
  --paper-3: #E2EAF4;
  --line: #D5DEE9;
  --line-2: #B2C0D1;

  /* Cerneala (albastru foarte inchis in loc de negru) */
  --ink: #10243A;             /* 14.9:1 pe --paper */
  --ink-2: #34495F;           /* 8.8:1 */
  --ink-3: #536579;           /* 5.3:1 pe --paper, 4.6:1 pe --paper-3 */

  /* Albastrul de identitate */
  --blue: #1F5FB4;            /* butoane, linkuri, accente; 5.9:1 pe --paper, alb pe el 5.9:1 */
  --blue-7: #174B8F;          /* hover, text albastru mic; 8.2:1 */
  --blue-50: #EAF2FC;         /* sectiuni deschise */
  --blue-100: #D6E6F8;

  /* Sectiuni inchise (putine: inainte / dupa, footer, meniul mobil): albastru noapte, nu negru */
  --night: #0F2B4C;
  --night-2: #133459;
  --night-3: #1A3E68;
  --anthracite: #0F2B4C;       /* pastrat pentru compatibilitate; = --night */
  --on-night: #F2F6FB;         /* 13.2:1 pe --night */
  --on-night-2: #B9CADD;       /* 8.5:1 */
  --on-night-3: #8FA6BF;       /* 5.7:1 */
  --line-night: rgb(242 246 251 / .14);
  --line-night-2: rgb(242 246 251 / .28);

  /* Semnal (portocaliu) = accent, problema, actiune de facut acum; folosit rar */
  --signal: #E8622A;           /* iconite, marcaje, text mare */
  --signal-ink: #B8481A;       /* text mic pe hartie, 5.0:1 */

  /* "Sticla" = rezolvat / reglat: acum albastru */
  --glass: #5B97E0;            /* pe fundal inchis */
  --glass-ink: #1F5FB4;        /* pe hartie */

  --focus: var(--signal);

  /* ---- Tipografie -------------------------------------------------------- */
  --f-display: "Sora", "Sora Fallback", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --f-sans: "Manrope", "Manrope Fallback", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --f-serif: "Instrument Serif", "Iowan Old Style", Georgia, "Times New Roman", serif;
  --f-mono: "IBM Plex Mono", ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;

  --fs-display: clamp(2.205rem, 1.092rem + 4.536vw, 5.88rem);
  --fs-h1: clamp(2.0425rem, 1.29rem + 3.096vw, 4.515rem);
  --fs-h2: clamp(1.6125rem, 1.118rem + 2.064vw, 3.225rem);
  --fs-h3: clamp(1.2375rem, 1.008rem + .9vw, 1.8rem);
  --fs-h4: clamp(1.08rem, 1.0176rem + .288vw, 1.26rem);
  --fs-lead: clamp(1.125rem, 1.03rem + .42vw, 1.375rem);
  --fs-body: 1.0625rem;        /* 17px */
  --fs-sm: .9375rem;           /* 15px */
  --fs-xs: .8125rem;           /* 13px */
  --fs-mono: .75rem;           /* 12px, uppercase */

  --lh-display: 1;
  --lh-head: 1.06;
  --lh-snug: 1.3;
  --lh-body: 1.62;

  --tr-display: -.035em;
  --tr-head: -.03em;
  --tr-mono: .08em;

  /* ---- Spațiere (bază 4px) ---------------------------------------------- */
  --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;
  --s-11: 176px;
  --section-y: clamp(88px, 5.5vw + 48px, 176px);
  --section-y-sm: clamp(56px, 3.5vw + 36px, 112px);

  /* ---- Layout ------------------------------------------------------------ */
  --max: 1440px;
  --max-text: 66ch;
  --gutter: clamp(20px, 4.2vw, 64px);
  --gap: clamp(16px, 2vw, 32px);
  --hdr-h: 84px;   /* H-013: header mai inalt; la scroll devine compact (-12px) */

  /* ---- Geometrie: H-014, colturi usor rotunjite (butoane 10px, carduri si imagini 14px) --- */
  --radius: 14px;
  --radius-sm: 10px;
  --radius-pill: 999px;
  --bw: 1px;
  --inset: clamp(6px, .8vw, 10px);   /* „canatul în toc”: ramă interioară pe imagini-cheie */

  /* ---- Motion ------------------------------------------------------------ */
  --ease-out: cubic-bezier(.16, 1, .3, 1);
  --ease-in-out: cubic-bezier(.65, 0, .35, 1);
  --ease-std: cubic-bezier(.2, 0, 0, 1);
  --d-1: 160ms;
  --d-2: 280ms;
  --d-3: 560ms;
  --d-4: 960ms;

  /* ---- Adâncime (folosită punctual) ------------------------------------- */
  --shadow-1: 0 1px 0 rgb(16 36 58 / .04), 0 12px 32px -14px rgb(16 36 58 / .22);
  --shadow-2: 0 30px 70px -30px rgb(16 36 58 / .4);
  --shadow-float: 0 1px 0 rgb(16 36 58 / .05), 0 14px 40px -18px rgb(16 36 58 / .35);
}

@media (max-width: 1179px) {
  :root { --hdr-h: 76px; }
}
@media (max-width: 767px) {
  :root { --hdr-h: 68px; }
}

/* ---- Contexte de culoare (componentele citesc doar aceste variabile) ----- */
:root,
.t-paper {
  --bg: var(--paper);
  --bg-2: var(--paper-2);
  --bg-3: var(--paper-3);
  --fg: var(--ink);
  --fg-2: var(--ink-2);
  --fg-3: var(--ink-3);
  --rule: var(--line);
  --rule-2: var(--line-2);
  --accent: var(--signal);
  --accent-ink: var(--signal-ink);
  --ok-ink: var(--glass-ink);
  --btn-bg: var(--blue);
  --btn-fg: #FFFFFF;
  --ph-bg: var(--paper-2);
  --ph-fg: var(--ink-3);
  --ph-line: rgb(16 36 58 / .045);
}

.t-stone {
  --bg: var(--paper-2);
  --bg-2: var(--paper-3);
  --bg-3: #D6E0EC;
  --rule: #D0DAE6;
  --ph-bg: var(--paper-3);
}

/* H-014: sectiune deschisa, albastru foarte deschis (ex. Piese si accesorii) */
.t-sky {
  --focus: var(--signal-ink); /* H-023: inelul portocaliu avea 2,99:1 pe blue-50; signal-ink are 4,67:1 */
  --bg: var(--blue-50);
  --bg-2: var(--blue-100);
  --bg-3: #C8DCF4;
  --fg: var(--ink);
  --fg-2: var(--ink-2);
  --fg-3: #4D6178;
  --rule: #C9DAEE;
  --rule-2: #9DB7D6;
  --btn-bg: var(--blue);
  --btn-fg: #FFFFFF;
  --ph-bg: var(--blue-100);
  --ph-fg: #4D6178;
  --ph-line: rgb(16 36 58 / .05);
}

/* H-014: banda albastra de identitate (contact) */
.t-blue {
  --bg: var(--blue);
  --bg-2: #2A6BC0;
  --bg-3: #3677C9;
  --fg: #FFFFFF;
  --fg-2: #DCE8F7;
  --fg-3: #D2E1F4; /* H-015: 4,7:1 pe albastru (inainte #BCD2EE, 4,05:1) */
  --rule: rgb(255 255 255 / .22);
  --rule-2: rgb(255 255 255 / .4);
  --accent: #FFB58F;
  --accent-ink: #FFD2BA;
  --ok-ink: #FFFFFF;
  --btn-bg: #FFFFFF;
  --btn-fg: var(--blue-7);
  --ph-bg: #2A6BC0;
  --ph-fg: #DCE8F7;
  --ph-line: rgb(255 255 255 / .06);
  --focus: #FFFFFF; /* H-015: inelul portocaliu avea 1,85:1 pe albastru */
}

.t-night {
  --bg: var(--night);
  --bg-2: var(--night-2);
  --bg-3: var(--night-3);
  --fg: var(--on-night);
  --fg-2: var(--on-night-2);
  --fg-3: var(--on-night-3);
  --rule: var(--line-night);
  --rule-2: var(--line-night-2);
  --accent-ink: var(--signal);
  --ok-ink: var(--glass);
  --btn-bg: #FFFFFF;
  --btn-fg: var(--blue-7);
  --ph-bg: var(--night-3);
  --ph-fg: var(--on-night-3);
  --ph-line: rgb(242 246 251 / .04);
}

.t-anthracite {
  --bg: var(--night);
  --bg-2: var(--night-2);
  --bg-3: var(--night-3);
  --fg: var(--on-night);
  --fg-2: var(--on-night-2);
  --fg-3: var(--on-night-3);
  --rule: var(--line-night);
  --rule-2: var(--line-night-2);
  --accent-ink: var(--signal);
  --ok-ink: var(--glass);
  --btn-bg: #FFFFFF;
  --btn-fg: var(--blue-7);
  --ph-bg: var(--night-3);
  --ph-fg: var(--on-night-3);
  --ph-line: rgb(242 246 251 / .04);
}

.t-paper, .t-stone, .t-night, .t-anthracite, .t-sky, .t-blue {
  background-color: var(--bg);
  color: var(--fg);
}