/**
 * Design tokens extracted from Figma Style page (node 305:6448, file
 * psb03DxWhlw0g7kvzWHAKt) — Colors + Typography cards. Per the workflow
 * rule in memory/project-scope.md: components.css and page-level CSS
 * should reference these instead of hardcoding values.
 *
 * No spacing scale exists yet on the Figma Style page (only Colors +
 * Typography cards were present) — --space-* tokens are left out rather
 * than invented. Add them once a spacing scale shows up in Figma.
 *
 * Typography is mobile-first: base values are the Figma "Mobile" card,
 * overridden at 992px (Bootstrap `lg`) with the Figma "Desktop" card
 * values — confirm this is the right breakpoint once more frames are
 * reviewed.
 *
 * KNOWN FIGMA INCONSISTENCY (confirm with design before relying on it):
 * the desktop card has 3 body sizes below Large — "Body Regular Bold"
 * (20px, Bold) and "Body Regular Medium" (20px, styled Bold despite its
 * name) and "Body small" (16px, Regular) — while the mobile card only has
 * 2 — "Body Medium" (16px, Medium) and "Body Small" (13px, Medium). They
 * don't map 1:1, so --fs-body-bold has no mobile-distinct counterpart
 * defined here; revisit once the mismatch is resolved in Figma.
 */

:root {
  /* Colors */
  --color-primary: #40513B;
  --color-secondary: #798576;
  --color-black: #161616;
  --color-border: #CCCCCC;
  --color-bg: #F5F5F7;
  --color-white: #FFFFFF;

  --color-text: var(--color-black);
  --color-muted: var(--color-secondary);
  --color-primary-muted: rgba(64, 81, 59, 0.7); /* --color-primary at 70% opacity, per Karta mieszkania (desktop) stat labels */

  /* Typography */
  --font-family-base: 'Lato', sans-serif;
  --font-family-heading: 'Lato', sans-serif;
  /* Hero main-heading font (2026-09-06, user request) — scoped ONLY to
     each page's hero <h1> (home/o-nas/aktualnosci/wyszukiwarka/
     finansowanie/wizualizacje/mieszkanie/aktualnosc), never the global
     --font-family-heading used by every other h1/h2/h3 on the site. */
  --font-family-hero-heading: 'Lora', serif;

  --fw-regular: 400;
  --fw-medium: 500;
  --fw-bold: 700;

  /* Type scale — mobile (default) */
  --fs-h1: 36px;         --lh-h1: 1;
  --fs-h2: 24px;         --lh-h2: 1.4;
  --fs-h3: 14px;         --lh-h3: 1.4;
  --fs-body-lg: 20px;    --lh-body-lg: normal;
  --fs-body-bold: 20px;  --lh-body-bold: normal;   /* desktop-only sample, see note above */
  --fs-body-md: 16px;    --lh-body-md: 1.4;
  --fs-body-sm: 13px;    --lh-body-sm: 1.4;
}

@media (min-width: 992px) {
  :root {
    /* Type scale — desktop */
    --fs-h1: 64px;         --lh-h1: 1;
    --fs-h2: 42px;         --lh-h2: 1.1;
    --fs-h3: 32px;         --lh-h3: 1.4;
    --fs-body-lg: 24px;    --lh-body-lg: 1.4;
    --fs-body-bold: 20px;  --lh-body-bold: normal;
    --fs-body-md: 20px;    --lh-body-md: normal;    /* "Body Regular Medium" desktop sample */
    --fs-body-sm: 16px;    --lh-body-sm: 1.5;        /* "Body small" desktop sample */
  }
}