/* =============================================================
   T+T Energy — Design system tokenek (v2)

   Forrás: ttcar-claude/design-system/DESIGN.md v1.2 (T+T arculat).
   A tokenkészlet 1:1 a T+T Car design systemével — az arculat közös,
   csak a tartalom más. Új ad hoc szín/méret ide kerüljön, ne a
   komponensbe: a main.css kizárólag ezekre a változókra hivatkozik.
   ============================================================= */

:root {

  /* ── Színek ──────────────────────────────────────────────────
     Sárga accent: mindig cselekvésre/fontos adatra mutat, nem
     dekoráció. Szekciónként jellemzően 1 domináns kiemelés. */
  --accent:        #FFBE04;  /* elsődleges CTA, kiemelés, ikon */
  --accent-ink:    #0A0A0A;  /* szöveg a sárga felületen — SOHA nem fehér */
  /* Tompított sárga: világos háttéren szöveg/ikon. A korábbi #A6720A a saját
     feladatában bukott — 3.76–4.17:1 a három világos felületen, tehát AA alatt
     normál szövegméretnél. Ez az érték mindhármon 5.1:1 fölött van. */
  --accent-muted:  #8A5E08;

  --black:         #0A0A0A;  /* elsődleges sötét felület */
  --charcoal:      #1A1A1A;  /* kártya háttér sötét szekción */
  --graphite:      #262626;  /* border sötét felületen */
  --hairline-dark: #333333;  /* elválasztó vonal sötét felületen */

  --white:          #FFFFFF;
  --hairline-light: #D2CFC8; /* elválasztó vonal világos felületen */
  --ink-on-white:   #171613; /* elsődleges szöveg világos felületen (meleg, nem tiszta fekete) */

  /* Világos szekció háttere — enyhén meleg törtfehér, nem tiszta fehér */
  --paper-warm-top:    #F8F6F2;
  --paper-warm-bottom: #F5F3EE;
  --surface-warm: linear-gradient(180deg, var(--paper-warm-top) 0%, var(--paper-warm-bottom) 100%);

  /* Másodlagos szöveg 3 szinten sötét felületen + 1 világoson.
     Ne vezess be új szürkét — a felület és a szövegméret alapján válassz. */
  --ink-muted-1: #D6D6D6;    /* legvilágosabb — body / body-lg méret */
  --ink-muted-2: #9C9C9C;    /* alap — fs-small leírás, ikon, címke */
  /* Leghalványabb — fs-micro, jogi/apró szöveg. A #7A7A7A csak feketén ért el
     AA-t (4.61), charcoalon 4.05 és a marquee sávján 3.93 volt. */
  --ink-muted-3: #8A8A8A;
  --ink-muted-on-light: #6B675C;

  /* ── Tipográfia ──────────────────────────────────────────────
     Heading = mindig CAPS + display font. Body = mindig mixed case.
     A DIN Next Condensed licencelt, ezért a build Oswaldot használ;
     licenc esetén elég ezt az egy tokent cserélni. */
  --font-display: 'Oswald', 'Arial Narrow', 'Helvetica Neue', sans-serif;
  --font-body:    'Inter', -apple-system, 'Segoe UI', sans-serif;
  --font-mono:    'Inter', -apple-system, 'Segoe UI', sans-serif;

  --fs-display: clamp(2.75rem, 2rem + 3.2vw, 4.25rem);  /* hero H1 */
  --fs-h1:      clamp(2rem, 1.55rem + 2vw, 3rem);       /* szekció főcím */
  --fs-h2:      clamp(1.45rem, 1.25rem + 1vw, 2rem);    /* alszekció cím */
  --fs-h3:      clamp(1.1rem, 1.02rem + 0.4vw, 1.35rem);/* kártyacím */
  --fs-body-lg: 1.125rem;
  --fs-body:    1rem;
  --fs-small:   0.8125rem;
  --fs-micro:   0.6875rem;

  /* ── Spacing (4px alapegység) ───────────────────────────────── */
  --space-1: 4px;  --space-2: 8px;  --space-3: 12px; --space-4: 16px;
  --space-5: 24px; --space-6: 32px; --space-7: 48px; --space-8: 64px;
  --space-9: 96px; --space-10: 140px;

  /* ── Geometria ───────────────────────────────────────────────── */
  --radius-sm: 8px;   /* gombok, kis elemek */
  --radius-md: 14px;  /* kártyák — a leggyakoribb */
  --radius-lg: 20px;  /* nagyobb felületek */
  --container: 1400px;

  /* ── Árnyékok ────────────────────────────────────────────────
     Minél sötétebb a kártya a szekcióhoz képest, annál mélyebb és
     semlegesebb az árnyék; világos kártyán melegebb tónusú. */
  --shadow-dark-card:  0 20px 40px -16px rgba(0,0,0,0.55);
  --shadow-dark-hover: 0 28px 52px -14px rgba(0,0,0,0.65);
  --shadow-light-card:  0 1px 2px rgba(23,22,19,0.03), 0 10px 24px -12px rgba(23,22,19,0.10);
  --shadow-light-hover: 0 2px 4px rgba(23,22,19,0.04), 0 16px 30px -12px rgba(23,22,19,0.14);
}