/* ==========================================================================
   ÉRTÉK PONT PÉNZÜGYEK — design tokenek
   Márka: neon lime + mély fekete. Minden érték innen származik.
   ========================================================================== */

:root {
  /* --- Márkaszínek --- */
  --lime: #c2ff72;
  --lime-bright: #d8ff9c;
  --lime-deep: #9be04a;
  --lime-ink: #0a0b09; /* szöveg lime felületen */
  /* Lime SZÖVEGRE. Sötét háttéren ez maga a lime; világos (.on-paper)
     szekcióban sötétzöldre vált, különben olvashatatlan lenne. Minden
     szövegszínt és kontúrt ez ad, a felületeket (gomb, badge) a --lime. */
  --lime-text: var(--lime);

  /* --- Semleges skála (mély feketétől a papírig) --- */
  --ink-900: #060704;
  --ink-800: #0a0b09;
  --ink-700: #101210;
  --ink-600: #161a14;
  --ink-500: #1e2319;
  --ink-400: #2a3023;
  --line: rgba(194, 255, 114, 0.14);
  --line-soft: rgba(255, 255, 255, 0.08);

  --paper: #f6f8f2;
  --text: #f2f5ec;
  --text-soft: #b9c2ad;
  --text-mute: #7f8a75;

  /* --- Jelzőszínek --- */
  --warn: #ffb84d;
  --danger: #ff6b57;
  --info: #7fd8ff;

  /* --- Felületek --- */
  --surface: rgba(255, 255, 255, 0.035);
  --surface-2: rgba(255, 255, 255, 0.06);
  --glass: rgba(12, 14, 11, 0.72);
  --glow-lime: 0 0 0 1px rgba(194, 255, 114, 0.35), 0 12px 48px -12px rgba(194, 255, 114, 0.45);
  --glow-soft: 0 24px 70px -30px rgba(0, 0, 0, 0.9);

  /* --- Tipográfia --- */
  --font-display: "Inter Tight", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-body: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;

  /* Fluid skála: 360px → 1600px viewport */
  --fs-display: clamp(3.2rem, 11vw, 10.5rem);
  --fs-h1: clamp(2.5rem, 6.4vw, 5.5rem);
  --fs-h2: clamp(2rem, 4.2vw, 3.6rem);
  --fs-h3: clamp(1.35rem, 2.1vw, 1.9rem);
  --fs-h4: clamp(1.1rem, 1.5vw, 1.3rem);
  --fs-lead: clamp(1.05rem, 1.55vw, 1.35rem);
  --fs-body: clamp(1rem, 1.1vw, 1.075rem);
  --fs-sm: 0.9375rem;
  --fs-xs: 0.8125rem;
  --fs-micro: 0.6875rem;

  /* Magyar nagybetűs szöveg ékezetei (Á, É, Ő, Ű) miatt nem mehetünk 1.0 alá */
  --lh-tight: 1.02;
  --lh-snug: 1.12;
  --lh-body: 1.62;
  --tracking-display: -0.042em;
  --tracking-label: 0.16em;

  /* --- Térkezelés --- */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4rem;
  --space-9: 6rem;
  --space-10: 9rem;
  --section-y: clamp(4.5rem, 9vw, 9rem);
  --gutter: clamp(1.15rem, 4vw, 3rem);
  --maxw: 1320px;
  --maxw-text: 68ch;

  /* --- Forma --- */
  --r-sm: 8px;
  --r-md: 14px;
  --r-lg: 22px;
  --r-xl: 32px;
  --r-pill: 999px;

  /* --- Mozgás --- */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --t-fast: 160ms;
  --t-med: 320ms;
  --t-slow: 620ms;

  --z-bg: 0;
  --z-content: 10;
  --z-nav: 100;
  --z-overlay: 900;
  --z-toast: 1000;
}

/* Világos szekciók — a sötét sávok közé tördelik az oldalt.
   Csak tokeneket ír felül: a komponensek változtatás nélkül átveszik.
   A --lime-text sötétzöld, mert a neon lime papíron 1.4:1 kontrasztú
   lenne (a WCAG AA minimuma 4.5:1 szövegre). */
.on-paper {
  --text: #10130c;
  --text-soft: #454e3c;
  --text-mute: #626b58;
  --lime-text: #3d6b10;
  --surface: rgba(10, 11, 9, 0.035);
  --surface-2: rgba(10, 11, 9, 0.06);
  --line: rgba(61, 107, 16, 0.25);
  --line-soft: rgba(10, 11, 9, 0.1);
  --glow-lime: 0 0 0 1px rgba(61, 107, 16, 0.3), 0 12px 34px -14px rgba(61, 107, 16, 0.5);
  --glow-soft: 0 20px 50px -30px rgba(10, 11, 9, 0.5);
  background: var(--paper);
  color: var(--text);
}
/* A szemcsés zaj-réteg fekete: papíron szürkévé mosná a sávot. */
.on-paper { position: relative; z-index: 2; }
/* A sötét gomb világos sávban ne fekete-fekete legyen */
.on-paper .btn--dark { --btn-bg: var(--ink-800); --btn-fg: var(--paper); }
.on-paper .btn--dark::before { background: var(--ink-600); }