/* ==============================================================================
1. CORE & VARIABLES
============================================================================== */

:root {
    /* Brand colors */
    --color-primary: #2F9376;
    --color-accent: #DAFF98;
    --color-accent-2: #99f682;
    --color-accent-3: #22b49c;
    /* Base colors */
    --color-white: #FFFFFF;
    --color-x-black: #1f2926;
    --color-black: #252827;
    --color-dark: #252827;
    --color-light: #fcfff6;
    --color-light-2: #f5f4e6;
    --color-light-3: #f1edd6;
    --color-gray-light: #f1f3f2;
    --color-gray-lm: #bbcec7;
    --color-gray-medium: #92aaa1;
    --color-gray-dark: #495954;
    --color-red: #ff5c5d;
    --color-green-faded: #90a19c;
    /* Feedback colors */
    --color-success: #4CAF50;
    --color-error: #F44336;
    --color-warning: #FFC107;
    /* Text colors */
    --text-primary: var(--color-black);
    --text-secondary: var(--color-gray-medium);
    --text-light: var(--color-white);
    --text-white: var(--color-white);
    --text-dark: var(--color-black);
    --text-black: var(--color-black);
    --text-accent: var(--color-accent);
    --text-link: var(--color-primary);
    --text-gray: var(--color-gray-medium);

    /* Background colors */
    --bg-light: #fcfff6;
    --bg-dark: linear-gradient(#1F2926, #4B6058);

    /* Border radius */
    --border-radius-p: 1rem 1rem 1rem 0;
    --border-radius-p-1-5: 1.5rem 1.5rem 1.5rem 0;
    --border-radius-p-2: 2rem 2rem 2rem 0;
    --border-radius-p-sm: 0.4rem 0.4rem 0.4rem 0;
    --border-radius-p-med: 0.7rem 0.7rem 0.7rem 0;

    /* Max width */
    --max-width-60: 60rem;
    --max-width-50: 50rem;
}

/* Prevent horizontal overflow and enable sticky positioning */
html {
    overflow-x: hidden;
    overflow-y: auto;
    scrollbar-gutter: stable;
}

html,
body {
    overflow-x: hidden;
    max-width: 100%;
}

@media (max-width: 768px) {

    #hero h1 {
        font-size: 2.5rem !important;
        line-height: 3.2rem !important;
    }

    h2 {
        font-size: 2.5rem !important;
        line-height: 2.8rem !important;
    }
}