:root {
    --color-primary: #EE0D21;
    --color-primary-dark: #B80414;
    --color-secondary: #FFFFFF;
    --color-dark: #383838;
    --color-surface-muted: #383838;

    --color-text-primary: #ffffff;
    --color-text-secondary: #B80414;
    --color-text-dark: #000000;
    --color-text-muted: #aaa;
    --gold: linear-gradient(
        92deg, #FDB068 0.78%, #ECAD70 17.24%, #F7C38D 33.71%, #F8E2BE 50.17%,
        #F8DBB2 66.64%, #FCC386 83.11%, #FEB066 99.57%
    );

    --border-radius-xs: 10px;
    --border-radius-sm: 20px;
    --border-radius: 40px;
    --border-radius-lg: 50px;

    --color-text: #FFFFFF;
    --color-bg: #1E1E1E;

    /* Font sizes (assuming base 16px = 1rem) */
    --font-size-8: 0.5rem;       /* 8px  */
    --font-size-10: 0.625rem;    /* 10px */
    --font-size-12: 0.75rem;     /* 12px */
    --font-size-14: 0.875rem;    /* 14px */
    --font-size-16: 1rem;        /* 16px */
    --font-size-18: 1.125rem;    /* 18px */
    --font-size-20: 1.25rem;     /* 20px */
    --font-size-22: 1.375rem;    /* 22px */
    --font-size-26: 1.625rem;    /* 26px */
    --font-size-28: 1.75rem;     /* 28px */
    --font-size-30: 1.875rem;    /* 30px */
    --font-size-40: 2.5rem;      /* 40px */
    --font-size-50: 3.125rem;    /* 50px */
    --font-size-60: 3.75rem;     /* 60px */

    /* Font weights */
    --font-weight-regular: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;

    /* Breakpoints (mobile-first) */
    --bp-phone: 480px;   /* larger phones */
    --bp-tablet: 768px;   /* tablets */
    --bp-desktop: 1200px;  /* desktops */
    --bp-desktop-lg: 1440px;  /* large desktops */

    --nav-height: 60px;

    --section-margin-top: 50px;
    
    --container-padding-x-mobile: 20px;

    --logo-width-mobile: 100px;
    --logo-width-desktop: 160px;

    --section-margin-top: 50px;
}