/* Best Inn — design tokens (z Figmy: zmienne e-global / bi-*) */
:root {
  /* Kolory */
  --c-primary: #22272b;
  --c-text: #646f76;
  --c-secondary: #33739a;
  --c-accent: #a8d8f0;
  --c-accent-sky-soft: #d6edf8;
  --c-bg-page: #f8f9f8;
  --c-bg-surface: #ffffff;
  --c-bg-accent-subtle: #eaf4f9;
  --c-bg-inverse: #22272b;
  --c-bg-inverse-elevated: #2d3338;
  --c-text-inverse: #ffffff;
  --c-text-inverse-muted: #aeb7bc;
  --c-text-accent: #33739a;
  --c-border-subtle: #e5e9eb;
  --c-border-strong: #cdd4d8;
  --c-border-on-image: rgba(255, 255, 255, 0.35);
  --c-overlay-glass: rgba(22, 26, 29, 0.42);
  --c-overlay-glass-soft: rgba(22, 26, 29, 0.28);

  /* Typografia */
  --ff-primary: "DM Sans", system-ui, sans-serif;
  --ff-nav: "Inter", system-ui, sans-serif;

  --fs-h1: 68px;   --lh-h1: 1.04; --ls-h1: -0.025em;
  --fs-h2: 46px;   --lh-h2: 1.1;  --ls-h2: -0.018em;
  --fs-h3: 30px;   --lh-h3: 1.2;  --ls-h3: -0.015em;
  --fs-h4: 22px;   --lh-h4: 1.3;  --ls-h4: -0.008em;
  --fs-h5: 18px;   --lh-h5: 1.4;  --ls-h5: -0.003em;
  --fs-lead: 18px; --lh-lead: 1.6; --ls-lead: -0.002em;
  --fs-body: 16px; --lh-body: 1.6;
  --fs-small: 14px; --lh-small: 1.55;
  --fs-label: 14px;
  --fs-caption: 12.5px;
  --fs-button: 15px;
  --fs-nav: 14.5px;

  /* Promienie */
  --r-2xs: 2px; --r-xs: 4px; --r-sm: 8px; --r-md: 12px; --r-lg: 16px;
  --r-xl: 20px; --r-2xl: 24px; --r-3xl: 28px;

  /* Layout */
  --page-gutter: 80px;
  --page-gutter-wide: 48px;
  --hero-inset: 16px;
  --section-py: 128px;
  --section-header-gap: 56px;
  --container: 1280px;

  /* Komponenty */
  --btn-h: 52px;
  --btn-h-sm: 44px;
  --btn-px: 24px;
  --input-h: 52px;

  /* Efekty */
  --shadow-floating: 0 24px 48px -8px rgba(22, 26, 29, 0.08), 0 2px 6px rgba(22, 26, 29, 0.05);
  --blur-glass: blur(16px);
}

@media (max-width: 1024px) {
  :root {
    --page-gutter: 40px;
    --section-py: 96px;
    --fs-h1: 52px;
    --fs-h2: 38px;
  }
}

@media (max-width: 640px) {
  :root {
    --page-gutter: 20px;
    --hero-inset: 8px;
    --section-py: 72px;
    --section-header-gap: 36px;
    --fs-h1: 40px;
    --fs-h2: 32px;
    --fs-h3: 24px;
  }
}