/* ==========================================================================
   Design tokeny – barvy, typografie, rozestupy, stíny
   Hodnoty vychází z design manuálu „Verniton Architectural Capital“.
   ========================================================================== */

:root {
    /* Akcentní zlatá – dekorativní prvky (linky, ikony, okraje) */
    --color-accent: #c8933b;
    --color-accent-hover: #b47f2a;

    /* Tmavší zlatá pro pozadí tlačítek – bílý text má kontrast 4.7 : 1 */
    --color-accent-strong: #9a6a1f;
    --color-accent-strong-hover: #845a18;

    /* Zlatá pro text na světlém pozadí – kontrast 5.9 : 1 */
    --color-accent-text: #8a5a10;
    --color-accent-tint: #fdf8ee;
    --color-accent-tint-strong: #faf1e1;
    --color-accent-border: #f3e1be;
    --color-accent-light: #f7bc60;
    --color-button-bg: #d1a25a;
    --color-button-hover: #dfb779;
    --color-on-accent: #172533;

    /* Neutrální barvy */
    --color-ink: #0f172a;
    --color-label: #334155;
    --color-text: #475569;
    --color-muted: #64748b;
    --color-line: #e2e8f0;
    --color-line-strong: #cbd5e1;
    --color-surface: #fff;
    --color-surface-alt: #f6f5f1;
    --color-surface-sunken: #f1f5f9;
    --color-dark: #132330;
    --color-dark-deep: #0c1923;
    --color-dark-deepest: #050b10;
    --color-on-dark: #f6f7f8;
    --color-on-dark-muted: #bcc6cd;
    --color-line-dark: rgb(255 255 255 / 16%);
    --pattern-blueprint: linear-gradient(rgb(255 255 255 / 3.5%) 1px, transparent 1px), linear-gradient(90deg, rgb(255 255 255 / 3.5%) 1px, transparent 1px);

    /* Recenze a barvy zdroje Google */
    --color-review-surface: #f8fafc;
    --color-review-stars: #fbbc04;
    --color-review-link: #1967d2;
    --color-review-link-hover: #174ea6;
    --color-review-avatar: #7c3f98;
    --color-review-avatar-green: #287457;

    /* Písma */
    --font-heading: "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
    --font-body: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;

    /* Velikosti písma – plynule mezi mobilem a desktopem */
    --fs-display: clamp(2.25rem, 1.6rem + 2.6vw, 3.5rem);
    --fs-h2: clamp(1.75rem, 1.4rem + 1.4vw, 2.5rem);
    --fs-h3: clamp(1.375rem, 1.25rem + 0.5vw, 1.75rem);
    --fs-h4: 1.375rem;
    --fs-h5: 1.125rem;
    --fs-body-lg: 1.125rem;
    --fs-body: 0.9375rem;
    --fs-body-sm: 0.8125rem;
    --fs-label-lg: 0.875rem;
    --fs-label: 0.75rem;
    --fs-eyebrow: 0.6875rem;

    /* Rozestupy */
    --space-xs: 0.25rem;
    --space-sm: 0.5rem;
    --space-md: 1rem;
    --space-lg: 1.5rem;
    --space-xl: 2.5rem;
    --space-2xl: 4rem;
    --space-3xl: 6rem;

    /* Layout */
    --container-max: 88rem;
    --gutter: 1rem;
    --page-margin: 1rem;
    --header-height: 4.5rem;

    /* Zaoblení */
    --radius-sm: 0.25rem;
    --radius-md: 0.5rem;
    --radius-lg: 0.75rem;
    --radius-full: 9999px;

    /* Stíny */
    --shadow-card: 0 4px 20px -4px rgb(15 23 42 / 6%), 0 2px 6px -2px rgb(15 23 42 / 3%);
    --shadow-card-hover: 0 16px 36px -8px rgb(200 147 59 / 16%), 0 4px 12px -2px rgb(15 23 42 / 5%);
    --shadow-float: 0 20px 40px -12px rgb(15 23 42 / 18%);
    --shadow-button: 0 4px 14px rgb(154 106 31 / 25%);

    /* Přechody */
    --transition-fast: 150ms ease;
    --transition: 250ms ease;
}

@media (min-width: 768px) {
    :root {
        --gutter: 1.5rem;
        --page-margin: 2rem;
    }
}

@media (min-width: 1200px) {
    :root {
        --gutter: 2rem;
        --page-margin: 4rem;
        --header-height: 5rem;
    }
}