@import url('https://fonts.googleapis.com/css2?family=Arvo:wght@400;700&family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');

:root {
    /* Brand color uses existing --main-color if present, otherwise fallback */
    --nuu-brand-color: var(--main-color, #d8232a);
    --arvo-font: 'Arvo', serif;

    /* Color */
    --Dark-Gray: #4C4B4B;
    --Light-Yellow: #FFC800;
    --Dark-Red: #772102;
    --Primary-White: #FFFFFF;
    --Primary-Gray: #797979;
    --Primary-Gray-rgb: 121, 121, 121;
    --Secondary-Green: #3CBC81;
    --Secondary-Green-rgb: 60, 188, 129;
    --Secondary-Green-Dark: #319b6a;
    --Secondary-Yellow: #EBFA67;
    --Secondary-Blue: #024AFF;
    --Secondary-Blue-Dark: #003dd6;
    --Secondary-Purple: #5947FD;
    --Secondary-Purple-light: #C9CCF9;
    --Secondary-Purple-rgb: 89, 71, 253;
    --Secondary-Red: #EE4F28;
    --Secondary-Red-rgb: 238, 79, 40;
    --Secondary-Red-Dark: #bd320f;
    --Secondary-Light-gray: #E9E9E9;
    --Brand-Main: #1B1F52;
    --Brand-Main-rgb: 27, 31, 82;
    --Brand-White: #F9F1E5;
    --Brand-Black: #111111;
    --Brand-Black-rgb: 17, 17, 17;
    --Brand-Brand: #1B1F52;
    --Size-md: 12;
    --Decorative-Outline: #B6B6B6;
    --Decorative-Outline-rgb: 182, 182, 182;

    /* Gap */
    --gap-4: 4px;
    --gap-8: 8px;
    --gap-16: 16px;
    --gap-24: 24px;
    --gap-32: 32px;

    /* Padding */
    --padding-2: 2px;
    --padding-4: 4px;
    --padding-6: 6px;
    --padding-8: 8px;
    --padding-12: 12px;
    --padding-16: 16px;
    --padding-24: 24px;
    --padding-32: 32px;

    /* BorderRadius */
    --br-2: 2px;
    --br-4: 4px;
    --br-8: 8px;
    --br-10: 10px;

    /* Font */
    --font-arvo: Arvo;
    --font-inter: Inter;

    /* FontSize */
    --font-size-8: 8px;
    --font-size-10: 10px;
    --font-size-12: 12px;
    --font-size-14: 14px;
    --font-size-16: 16px;
    --font-size-18: 18px;
    --font-size-24: 24px;

    /* FontWeight */
    --font-weight-bold: 700;

    /* New Figma Typography Variables */
    --display-lg-font-family: "Arvo", Helvetica;
    --display-lg-font-weight: 700;
    --display-lg-font-size: 24px;
    --display-lg-letter-spacing: 0;
    --display-lg-line-height: 120%;
    --display-lg-font-style: normal;

    --title-strong-font-family: "Inter", Helvetica;
    --title-strong-font-weight: 700;
    --title-strong-font-size: 24px;
    --title-strong-letter-spacing: 0;
    --title-strong-line-height: normal;
    --title-strong-font-style: normal;

    --title-bold-font-family: "Inter", Helvetica;
    --title-bold-font-weight: 700;
    --title-bold-font-size: 18px;
    --title-bold-letter-spacing: 0;
    --title-bold-line-height: 100%;
    --title-bold-font-style: normal;

    --title-semi-font-family: "Inter", Helvetica;
    --title-semi-font-weight: 600;
    --title-semi-font-size: 18px;
    --title-semi-letter-spacing: 0;
    --title-semi-line-height: 100%;
    --title-semi-font-style: normal;

    --title-reg-font-family: "Inter", Helvetica;
    --title-reg-font-weight: 400;
    --title-reg-font-size: 18px;
    --title-reg-letter-spacing: 0;
    --title-reg-line-height: 24px;
    --title-reg-font-style: normal;

    --body-bold-font-family: "Inter", Helvetica;
    --body-bold-font-weight: 700;
    --body-bold-font-size: 16px;
    --body-bold-letter-spacing: 0;
    --body-bold-line-height: 100%;
    --body-bold-font-style: normal;

    --body-semi-font-family: "Inter", Helvetica;
    --body-semi-font-weight: 600;
    --body-semi-font-size: 16px;
    --body-semi-letter-spacing: 0;
    --body-semi-line-height: 100%;
    --body-semi-font-style: normal;

    --body-font-family: "Inter", Helvetica;
    --body-font-weight: 400;
    --body-font-size: 16px;
    --body-letter-spacing: 0;
    --body-line-height: 110%;
    --body-font-style: normal;

    --headlines-bold-font-family: "Inter", Helvetica;
    --headlines-bold-font-weight: 700;
    --headlines-bold-font-size: 14px;
    --headlines-bold-letter-spacing: 0;
    --headlines-bold-line-height: normal;
    --headlines-bold-font-style: normal;

    --headlines-font-family: "Inter", Helvetica;
    --headlines-font-weight: 400;
    --headlines-font-size: 14px;
    --headlines-letter-spacing: 0;
    --headlines-line-height: normal;
    --headlines-font-style: normal;

    --subtext-reg-font-family: "Inter", Helvetica;
    --subtext-reg-font-weight: 400;
    --subtext-reg-font-size: 12px;
    --subtext-reg-letter-spacing: 0;
    --subtext-reg-line-height: 120%;
    --subtext-reg-font-style: normal;

    --subtext-semi-font-family: "Inter", Helvetica;
    --subtext-semi-font-weight: 600;
    --subtext-semi-font-size: 12px;
    --subtext-semi-letter-spacing: 0;
    --subtext-semi-line-height: normal;
    --subtext-semi-font-style: normal;

    --subtext-bold-font-family: "Inter", Helvetica;
    --subtext-bold-font-weight: 700;
    --subtext-bold-font-size: 12px;
    --subtext-bold-letter-spacing: 0;
    --subtext-bold-line-height: 120%;
    --subtext-bold-font-style: normal;

    --caption-reg-font-family: "Inter", Helvetica;
    --caption-reg-font-weight: 400;
    --caption-reg-font-size: 10px;
    --caption-reg-letter-spacing: 0;
    --caption-reg-line-height: 120%;
    --caption-reg-font-style: normal;

    --caption-bold-font-family: "Inter", Helvetica;
    --caption-bold-font-weight: 700;
    --caption-bold-font-size: 10px;
    --caption-bold-letter-spacing: 0;
    --caption-bold-line-height: 100%;
    --caption-bold-font-style: normal;

    --label-bold-font-family: "Inter", Helvetica;
    --label-bold-font-weight: 700;
    --label-bold-font-size: 8px;
    --label-bold-letter-spacing: 0;
    --label-bold-line-height: 100%;
    --label-bold-font-style: normal;

    --label-semi-font-family: "Inter", Helvetica;
    --label-semi-font-weight: 600;
    --label-semi-font-size: 8px;
    --label-semi-letter-spacing: 0;
    --label-semi-line-height: 100%;
    --label-semi-font-style: normal;

    --label-reg-font-family: "Inter", Helvetica;
    --label-reg-font-weight: 400;
    --label-reg-font-size: 8px;
    --label-reg-letter-spacing: 0;
    --label-reg-line-height: 100%;
    --label-reg-font-style: normal;

    --tiny-bold-font-family: "Inter", Helvetica;
    --tiny-bold-font-weight: 700;
    --tiny-bold-font-size: 6px;
    --tiny-bold-letter-spacing: 0;
    --tiny-bold-line-height: 120%;
    --tiny-bold-font-style: normal;

    --tiny-font-family: "Inter", Helvetica;
    --tiny-font-weight: 400;
    --tiny-font-size: 6px;
    --tiny-letter-spacing: 0;
    --tiny-line-height: 120%;
    --tiny-font-style: normal;

    /* Card shadow */
    --card-lift: 0 0 4px 0 rgba(0, 0, 0, 0.25);
}