/* ==========================================================================
   Design tokens — CSS Custom Properties
   Single source of truth for colors, typography, spacing, radii, shadows.
   ========================================================================== */

:root {
    /* ---- Colors -------------------------------------------------- */
    --color-bg-primary: #14292b;
    --color-bg-dark: #0d1e21;
    --color-accent-bg: #8bd35a;
    --color-white: #f1f4f4;
    --color-btn-gradient: linear-gradient(180deg, #9be86a 0%, #4caf3f 100%);
    --color-btn-secondary-border: #4f6a68;
    --color-text-main: #a9b9b6;
    --color-heading-accent: #9be86a;
    --color-btn-text-dark: #102013;
    --color-card-bg: #1b3335;
    --color-accent-lime: #6fcb45;
    --color-danger: #e6483c;
    --color-focus: #9be86a;

    /* ---- Typography ------------------------------------------------ */
    --font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --font-weight-regular: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;
    --font-weight-extrabold: 800;

    --fs-body: clamp(14px, 1vw + 0.7rem, 16px);
    --fs-h1: clamp(2.125rem, 1.6rem + 2.2vw, 2.875rem);
    --fs-h2: clamp(1.625rem, 1.4rem + 1vw, 2.125rem);
    --fs-h3: clamp(1.25rem, 1.1rem + 0.6vw, 1.5rem);
    --fs-small: 0.8125rem;

    --lh-body: 1.35;
    --lh-hero: 1.0;
    --lh-h2: 1.2;

    /* ---- Spacing ----------------------------------------------------- */
    --space-section: clamp(40px, 5vw, 60px);
    --space-card-gap: 26px;
    --space-paragraph: 20px;
    --space-h2-text: 20px;
    --space-h3-text: 16px;
    --space-faq-gap: 14px;
    --space-card-padding: 24px;

    /* ---- Layout -------------------------------------------------- */
    --container-max-width: 1920px;
    --container-side-padding: 59px;
    --main-bottom-padding: 72px;

    /* ---- Radii / borders ------------------------------------------ */
    --radius-card: 30px;
    --radius-button: 999px;
    --radius-input: 12px;
    --card-width: 150px;

    /* ---- Shadows / transitions -------------------------------------- */
    --shadow-card: 0 12px 30px rgba(0, 0, 0, 0.28);
    --shadow-popover: 0 20px 45px rgba(0, 0, 0, 0.4);
    --transition-fast: 0.18s ease;
    --transition-base: 0.28s ease;

    /* ---- Z-index scale --------------------------------------------- */
    --z-header: 100;
    --z-overlay: 200;
    --z-to-top: 90;
}