/* ==================== Root Variables Start ==================== */
:root {
    /* Brand Colors */
    --color-primary: #1a0768;   /* Blue */
    --color-secondary: #ff9700; /* Orange */

    /* Common Colors */
    --color-white: #ffffff;
    --color-black: #000000;

    /* Typography */
    --font-family-base: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    --font-size-base: 16px;

    /* Layout */
    --header-height: 60px;
}
/* ==================== Root Variables End ==================== */


/* ==================== HTML Global Styles Start ==================== */
html {
    font-size: 100%;
    scroll-behavior: smooth;
    box-sizing: border-box;
}
/* ==================== HTML Global Styles End ==================== */


/* ==================== Body Global Styles Start ==================== */
body {
    margin: 0;
    padding-top: calc(40px + var(--header-height)); /* FIXED HEADER OFFSET */
    font-family: var(--font-family-base);
    font-size: var(--font-size-base);
    color: var(--color-black);
    background-color: var(--color-white);
}
/* ==================== Body Global Styles End ==================== */



/* ==================== Global Reset Start ==================== */
*,
*::before,
*::after {
    box-sizing: inherit;
}
/* ==================== Global Reset End ==================== */