:root {
    /* Color Palette - Fictiv Extracted */
    --color-primary: #16BC9C;
    --color-primary-hover: #129B82;
    --color-secondary: #00B3E6;
    /* Approximation for secondary accents */
    --color-text-heading: #1D2939;
    --color-text-body: #444444;
    --color-text-muted: #667085;

    --color-bg-main: #FFFFFF;
    --color-bg-section: #F4F4F4;
    --color-bg-dark: #1D1D1D;

    --color-footer-bg: #1D1D1D;
    --color-footer-text: #FFFFFF;

    /* Typography */
    --font-heading: 'Montserrat', sans-serif;
    /* Fictiv uses Museo, replacing with Montserrat as planned */
    --font-primary: 'Inter', sans-serif;
    /* Fictiv body uses sans-serif, Inter is a good match */

    --font-size-h1: 48px;
    --font-size-h2: 36px;
    --font-size-h3: 24px;
    --font-size-body-desktop: 18px;
    /* Slightly adjusted from 20px for better density */
    --font-size-body-mobile: 16px;

    --line-height-heading: 1.15;
    --line-height-body: 1.6;

    /* Layout */
    --container-width: 1200px;
    --section-padding-y: 80px;
    --gutter-width: 24px;
    --navbar-height: 74px;

    /* Components */
    --border-radius-btn: 4px;
    --border-radius-card: 4px;

    --shadow-card: 0 24px 48px -12px rgba(0, 0, 0, 0.18);
    --shadow-card-hover: 0 32px 64px -12px rgba(0, 0, 0, 0.22);

    --transition-base: all 0.3s ease;
}

@media (max-width: 768px) {
    :root {
        --font-size-h1: 36px;
        --font-size-h2: 28px;
        --font-size-body-desktop: 16px;
        --section-padding-y: 60px;
    }
}