:root {
    /*font*/
    /* Font Families */
    --font-primary: 'Roboto', sans-serif;
    --font-secondary: 'Niveau Grotesk', sans-serif;
    /* Font Weights */
    --font-thin: 100;
    --font-extra-light: 200;
    --font-light: 300;
    --font-normal: 400;
    --font-medium: 500;
    --font-semi-bold: 600;
    --font-bold: 700;
    --font-extra-bold: 800;
    --font-black: 900;
    /* Font Sizes */
    --font-xs: 0.75rem; /* 12px */
    --font-s: 0.875rem; /* 14px */
    --font-m: 1rem; /* 16px */
    --font-l: 1.5rem; /* 24px */
    --font-xl: 2.5rem; /* 40px */
    --font-xxl: 5rem;
    --font-xxxl: 7.5rem; /* 120px */
    /* Line-height */
    --lh-normal: 1.3; /* good for body */
    --lh-tight: 1.1; /* good for headings */
    /* =========================
       Color Palette
       ========================= */
    --col-white: #FFFFFF;
    --col-light-grey: #F8F8F8;
    --col-mid-grey: #DFDFDF;
    --col-basalt: #747487;
    --col-flint: #4C4C4C;
    --col-black: #000000;
    --col-bronze: #5D524B;
    --col-ivory: #FBF8EF;
    --col-dark-ivory: #F2E9DE;
    --col-aquamarine: #E7F1F1;
    --col-aquamarine-dark: #CAE1E1;
    --col-citrine: #FDF6BA;
    --col-pyrite: #FFF175;
    --col-amber: #FFD075;
    --col-jade: #B4F5DD;
    --col-light-emerald: #73D4AD;
    --col-mid-emerald: #4CA380;
    --col-dark-emerald: #3D8268;
    --col-lapis: #4B5CF3;
    --col-red-alert: #ED4063;
    --col-soft-red: #ff7d7d;
    /* =========================
       Gradients
       ========================= */
    /* Dawn-1 Gradient: 0% Aquamarine → 75% Dark Ivory → 100% Dark Ivory */
    --grad-dawn-1: linear-gradient(180deg, #E7F1F1 0%, #F2E9DE 75%, #F2E9DE 100%);
    /* =========================
       RGB Colors
       ========================= */
    --col-white-rgb: 255 255 255;
    --col-light-grey-rgb: 248 248 248;
    --col-mid-grey-rgb: 223 223 223;
    --col-basalt-rgb: 116 116 135;
    --col-flint-rgb: 76 76 76;
    --col-black-rgb: 0 0 0;
    --col-bronze-rgb: 93 82 75;
    --col-ivory-rgb: 251 248 239;
    --col-dark-ivory-rgb: 242 233 222;
    --col-aquamarine-rgb: 231 241 241;
    --col-aquamarine-dark-rgb: 202 225 225;
    --col-citrine-rgb: 253 246 186;
    --col-pyrite-rgb: 255 241 117;
    --col-amber-rgb: 255 208 117;
    --col-jade-rgb: 180 245 221;
    --col-light-emerald-rgb: 115 212 173;
    --col-mid-emerald-rgb: 76 163 128;
    --col-dark-emerald-rgb: 61 130 104;
    --col-lapis-rgb: 75 92 243;
    --col-red-alert-rgb: 237 64 99;
    /*buttons*/
    --btn-radius: 50px;
    --btn-border-width: 1px;
    --btn-padding-y: 10px;
    --btn-padding-x: 40px;
    --btn-min-width: 200px;
    --btn-height: 48px;
    --btn-sm-height: 32px;
    --btn-font-size: 0.9rem;
    --btn-transition: all 0.2s ease;
    --btn-ctrl-radius: 25px;
    --btn-ctrl-min-width: 150px;
    --btn-ctrl-height: 32px;
    /*Padding*/
    --breifing-pad-left: clamp(128px, 12.5vw, 240px);
    --breifing-pad-top: clamp(50px, 23.4375vh, 300px);
    --breifing-pad-right: clamp(106px, 10.4167vw, 200px);
    --workspace-pad-bottom: 75px;
}    


* {
    scrollbar-width: thin;
}

html, body {
    font-size: 16px;
    font-family: var(--font-primary);
    font-weight: 400;
    color: var(--flint);
    overflow:hidden;
}