/* =============================================================
   TTenergy — Design System Tokens
   Forrás: Figma C3Kts0HLzRUaipOdNLq1mj  (utolsó sync: 2026-06-05)
   ============================================================= */

:root {

  /* ── Colors ─────────────────────────────────────────────── */
  --c-primary:        #00aaff;   /* CTA gomb, kiemelések */
  --c-primary-dark:   #0066ff;   /* Badge, accent stripe */
  --c-primary-hover:  #0090e0;

  --c-white:          #ffffff;
  --c-black:          #000000;
  --c-dark:           #151515;   /* USP section bg */
  --c-gray-light:     #f0f0f0;   /* CTA section bg */

  --c-text-heading:   #000000;   /* Sötét háttéren lévő címek */
  --c-text-body:      #585858;   /* Törzs szöveg */
  --c-text-white:     #ffffff;
  --c-text-light:     #ebebeb;   /* Hero subtitle */
  --c-text-subtle:    #cccccc;   /* Kártya leírás */

  /* ── Typography ─────────────────────────────────────────── */
  --font-heading:  'Khand', Arial, sans-serif;
  --font-body:     Arial, Helvetica, sans-serif;

  /* Pontosan a Figmából */
  --fs-hero:     80px;   /* H1 hero */
  --fs-section:  72px;   /* Szekció fejléc */
  --fs-card:     32px;   /* Kártya cím, CTA tag */
  --fs-nav:      24px;   /* Navigáció */
  --fs-body:     20px;   /* Törzs */
  --fs-btn:      24px;   /* Gomb */
  --fs-badge:    12px;   /* Badge */

  --lh-tight:   1;
  --lh-body:    1.2;

  /* ── Spacing – Figma exact values ───────────────────────── */
  --pad-x:        200px;   /* Szekció vízszintes padding */
  --pad-y:        100px;   /* Szekció függőleges padding */
  --gap-cards:     20px;   /* Kártyák között */
  --gap-section:   20px;   /* Szekció elem-ek között */
  --gap-nav:       45px;   /* Nav linkek között */
  --gap-card-text:  8px;   /* Cím → leírás a kártyán */
  --gap-card-body: 20px;   /* Tartalom-csoportok a kártyán */
  --gap-btns:      20px;   /* Gombok között */

  /* ── Button padding (Figma mért értékek) ─────────────────── */
  --btn-py:     9px;
  --btn-px:    39px;
  --btn-py-sm:  8px;
  --btn-px-sm: 18px;

  /* ── Bento card padding ───────────────────────────────────── */
  --card-px:   31px;
  --card-py:   65px;

  /* ── Border radius ───────────────────────────────────────── */
  --r-card:    20px 3px 20px 3px;   /* Figma: mixed diagonal */
  --r-btn:     20px 3px 20px 3px;   /* Figma: mixed diagonal */
  --r-badge:   14px;

  /* ── Transitions ─────────────────────────────────────────── */
  --t-fast:  150ms ease;
  --t-med:   250ms ease;
  --t-slow:  400ms ease;
}