/* ===========================
   FONTS SYSTEM - fonts.css (Updated)
   =========================== */

/* ===========================
   FONT FACE DECLARATIONS
   =========================== */

/* Inter Font Family */
@font-face {
    font-family: 'Inter';
    src: url('./fonts/Inter/Inter-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Inter';
    src: url('./fonts/Inter/Inter-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Inter';
    src: url('./fonts/Inter/Inter-SemiBold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Inter';
    src: url('./fonts/Inter/Inter-Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

/* Poppins Font Family */
@font-face {
    font-family: 'Poppins';
    src: url('./fonts/Poppins/Poppins-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('./fonts/Poppins/Poppins-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('./fonts/Poppins/Poppins-SemiBold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('./fonts/Poppins/Poppins-Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

/* Roboto Font Family */
@font-face {
    font-family: 'Roboto';
    src: url('./fonts/Roboto/Roboto-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Roboto';
    src: url('./fonts/Roboto/Roboto-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Roboto';
    src: url('./fonts/Roboto/Roboto-Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

/* Open Sans Font Family */
@font-face {
    font-family: 'Open Sans';
    src: url('./fonts/OpenSans/OpenSans-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Open Sans';
    src: url('./fonts/OpenSans/OpenSans-SemiBold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Open Sans';
    src: url('./fonts/OpenSans/OpenSans-Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

/* Montserrat Font Family */
@font-face {
    font-family: 'Montserrat';
    src: url('./fonts/Montserrat/Montserrat-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Montserrat';
    src: url('./fonts/Montserrat/Montserrat-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Montserrat';
    src: url('./fonts/Montserrat/Montserrat-SemiBold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Montserrat';
    src: url('./fonts/Montserrat/Montserrat-Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

/* Playfair Display Font Family */
@font-face {
    font-family: 'Playfair Display';
    src: url('./fonts/PlayfairDisplay/PlayfairDisplay-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Playfair Display';
    src: url('./fonts/PlayfairDisplay/PlayfairDisplay-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Playfair Display';
    src: url('./fonts/PlayfairDisplay/PlayfairDisplay-Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Futura PT';
    src: url("../fonts/FuturaPT-Demi.woff2") format("woff2"), url("../fonts/FuturaPT-Demi.woff") format("woff");
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Futura PT';
    src: url("../fonts/FuturaPT-DemiObl.woff2") format("woff2"), url("../fonts/FuturaPT-DemiObl.woff") format("woff");
    font-weight: 600;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Futura PT';
    src: url("../fonts/FuturaPT-Heavy.woff2") format("woff2"), url("../fonts/FuturaPT-Heavy.woff") format("woff");
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Futura PT';
    src: url("../fonts/FuturaPT-Light.woff2") format("woff2"), url("../fonts/FuturaPT-Light.woff") format("woff");
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Futura PT';
    src: url("../fonts/FuturaPT-Medium.woff2") format("woff2"), url("../fonts/FuturaPT-Medium.woff") format("woff");
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

/* Cabin Font Family */
@font-face {
    font-family: 'Cabin';
    src: url('./fonts/Cabin/static/Cabin-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Cabin';
    src: url('./fonts/Cabin/static/Cabin-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Cabin';
    src: url('./fonts/Cabin/static/Cabin-SemiBold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Cabin';
    src: url('./fonts/Cabin/static/Cabin-Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

/* Domine Font Family */
@font-face {
    font-family: 'Domine';
    src: url('./fonts/Domine/static/Domine-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Domine';
    src: url('./fonts/Domine/static/Domine-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Domine';
    src: url('./fonts/Domine/static/Domine-SemiBold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Domine';
    src: url('./fonts/Domine/static/Domine-Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

/* Fira Font Family */
@font-face {
    font-family: 'Fira';
    src: url('./fonts/Fira/FiraSans-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Fira';
    src: url('./fonts/Fira/FiraSans-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Fira';
    src: url('./fonts/Fira/FiraSans-SemiBold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Fira';
    src: url('./fonts/Fira/FiraSans-Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

/* Hind Font Family */
@font-face {
    font-family: 'Hind';
    src: url('./fonts/Hind/Hind-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Hind';
    src: url('./fonts/Hind/Hind-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Hind';
    src: url('./fonts/Hind/Hind-SemiBold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Fira';
    src: url('./fonts/Fira/Fira-Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

/* IBMP Font Family */
@font-face {
    font-family: 'IBMP';
    src: url('./fonts/IBMP/static/IBMP-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'IBMP';
    src: url('./fonts/IBMP/static/IBMP-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'IBMP';
    src: url('./fonts/IBMP/static/IBMP-SemiBold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'IBMP';
    src: url('./fonts/IBMP/static/IBMP-Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

/* Karla Font Family */
@font-face {
    font-family: 'Karla';
    src: url('./fonts/Karla/static/Karla-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Karla';
    src: url('./fonts/Karla/static/Karla-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Karla';
    src: url('./fonts/Karla/static/Karla-SemiBold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Karla';
    src: url('./fonts/Karla/static/Karla-Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

/* Libre Font Family */
@font-face {
    font-family: 'Libre';
    src: url('./fonts/Libre/Libre-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Libre';
    src: url('./fonts/Libre/Libre-Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

/* Lora Font Family */
@font-face {
    font-family: 'Lora';
    src: url('./fonts/Lora/static/Lora-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Lora';
    src: url('./fonts/Lora/static/Lora-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Lora';
    src: url('./fonts/Lora/static/Lora-SemiBold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Lora';
    src: url('./fonts/Lora/static/Lora-Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

/* Merri Font Family */
@font-face {
    font-family: 'Merri';
    src: url('./fonts/Merri/static/Merri-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Merri';
    src: url('./fonts/Merri/static/Merri-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Merri';
    src: url('./fonts/Merri/static/Merri-SemiBold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Merri';
    src: url('./fonts/Merri/static/Merri-Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

/* Mulish Font Family */
@font-face {
    font-family: 'Mulish';
    src: url('./fonts/Mulish/static/Mulish-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Mulish';
    src: url('./fonts/Mulish/static/Mulish-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Mulish';
    src: url('./fonts/Mulish/static/Mulish-SemiBold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Mulish';
    src: url('./fonts/Mulish/static/Mulish-Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

/* PTSerif Font Family */
@font-face {
    font-family: 'PTSerif';
    src: url('./fonts/PT_Serif/PTSerif-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'PTSerif';
    src: url('./fonts/PT_Serif/PTSerif-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'PTSerif';
    src: url('./fonts/PT_Serif/PTSerif-SemiBold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'PTSerif';
    src: url('./fonts/PT_Serif/PTSerif-Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

/* Quicksand Font Family */
@font-face {
    font-family: 'Quicksand';
    src: url('./fonts/Quicksand/static/Quicksand-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Quicksand';
    src: url('./fonts/Quicksand/static/Quicksand-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Quicksand';
    src: url('./fonts/Quicksand/static/Quicksand-SemiBold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Quicksand';
    src: url('./fonts/Quicksand/static/Quicksand-Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

/* Source Font Family */
@font-face {
    font-family: 'Source';
    src: url('./fonts/Source_code/static/Source-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Source';
    src: url('./fonts/Source_code/static/Source-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Source';
    src: url('./fonts/Source_code/static/Source-SemiBold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Source';
    src: url('./fonts/Source_code/static/Source-Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

/* Work Font Family */
@font-face {
    font-family: 'Work';
    src: url('./fonts/Work/static/Work-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Work';
    src: url('./fonts/Work/static/Work-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Work';
    src: url('./fonts/Work/static/Work-SemiBold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Work';
    src: url('./fonts/Work/static/Work-Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}



/* ===========================
   FONT VARIABLE SYSTEM
   =========================== */

:root {
    /* Default Font Family Variables */
    --font-primary: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --font-heading: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --font-body: var(--font-primary);
    --font-mono: 'SF Mono', 'Monaco', 'Inconsolata', 'Roboto Mono', monospace;

    /* Font Size Variables */
    --text-xs: 0.75rem;
    --text-sm: 0.875rem;
    --text-base: 1rem;
    --text-lg: 1.125rem;
    --text-xl: 1.25rem;
    --text-2xl: 1.5rem;
    --text-3xl: 1.875rem;
    --text-4xl: 2.25rem;
    --text-5xl: 3rem;
    --text-6xl: 3.75rem;

    /* Line Height Variables */
    --leading-none: 1;
    --leading-tight: 1.25;
    --leading-snug: 1.375;
    --leading-normal: 1.5;
    --leading-relaxed: 1.625;
    --leading-loose: 2;

    /* Font Weight Variables */
    --font-light: 300;
    --font-normal: 400;
    --font-medium: 500;
    --font-semibold: 600;
    --font-bold: 700;
    --font-extrabold: 800;
    --font-black: 900;
}

/* ===========================
   DYNAMIC FONT SCHEME SYSTEM
   =========================== */

/* Default font application to all elements */
* {
    font-family: var(--font-primary);
}
.fab{
    font-family: "Font Awesome 6 Brands" !important;
}
.far,
.fas{
    font-family: "Font Awesome 6 Free" !important;
}
/* Font scheme: Inter */
[data-font-scheme="futura"] {
    --font-primary: 'Futura PT', sans-serif;
    --font-heading: 'Futura PT', sans-serif;
    --font-body: 'Futura PT', sans-serif;
}

[data-font-scheme="futura"] * {
    font-family: 'Futura PT', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}
/* Font scheme: Inter */
[data-font-scheme="inter"] {
    --font-primary: 'Inter', sans-serif;
    --font-heading: 'Inter', sans-serif;
    --font-body: 'Inter', sans-serif;
}

[data-font-scheme="inter"] * {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

/* Font scheme: Poppins */
[data-font-scheme="poppins"] {
    --font-primary: 'Poppins', sans-serif;
    --font-heading: 'Poppins', sans-serif;
    --font-body: 'Poppins', sans-serif;
}

[data-font-scheme="poppins"] * {
    font-family: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

/* Font scheme: Roboto */
[data-font-scheme="roboto"] {
    --font-primary: 'Roboto', sans-serif;
    --font-heading: 'Roboto', sans-serif;
    --font-body: 'Roboto', sans-serif;
}

[data-font-scheme="roboto"] * {
    font-family: 'Roboto', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

/* Font scheme: Open Sans */
[data-font-scheme="opensans"] {
    --font-primary: 'Open Sans', sans-serif;
    --font-heading: 'Open Sans', sans-serif;
    --font-body: 'Open Sans', sans-serif;
}

[data-font-scheme="opensans"] * {
    font-family: 'Open Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

/* Font scheme: Montserrat */
[data-font-scheme="montserrat"] {
    --font-primary: 'Montserrat', sans-serif;
    --font-heading: 'Montserrat', sans-serif;
    --font-body: 'Montserrat', sans-serif;
}

[data-font-scheme="montserrat"] * {
    font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

/* Font scheme: Playfair Display */
[data-font-scheme="playfair"] {
    --font-primary: 'Playfair Display', serif;
    --font-heading: 'Playfair Display', serif;
    --font-body: 'Playfair Display', serif;
}

[data-font-scheme="playfair"] * {
    font-family: 'Playfair Display', Georgia, 'Times New Roman', serif;
}
/* Font scheme: Cabin */
[data-font-scheme="cabin"] {
    --font-primary: 'Cabin', sans-serif;
    --font-heading: 'Cabin', sans-serif;
    --font-body: 'Cabin', sans-serif;
}

[data-font-scheme="cabin"] * {
    font-family: 'Cabin', Arial, sans-serif;
}

/* Font scheme: Domine */
[data-font-scheme="domine"] {
    --font-primary: 'Domine', serif;
    --font-heading: 'Domine', serif;
    --font-body: 'Domine', serif;
}

[data-font-scheme="domine"] * {
    font-family: 'Domine', Georgia, 'Times New Roman', serif;
}

/* Font scheme: Fira */
[data-font-scheme="fira"] {
    --font-primary: 'Fira', sans-serif;
    --font-heading: 'Fira', sans-serif;
    --font-body: 'Fira', sans-serif;
}

[data-font-scheme="fira"] * {
    font-family: 'Fira', Arial, sans-serif;
}

/* Font scheme: Hind */
[data-font-scheme="hind"] {
    --font-primary: 'Hind', sans-serif;
    --font-heading: 'Hind', sans-serif;
    --font-body: 'Hind', sans-serif;
}

[data-font-scheme="hind"] * {
    font-family: 'Hind', Arial, sans-serif;
}

/* Font scheme: IBMP */
[data-font-scheme="ibmp"] {
    --font-primary: 'IBMP', sans-serif;
    --font-heading: 'IBMP', sans-serif;
    --font-body: 'IBMP', sans-serif;
}

[data-font-scheme="ibmp"] * {
    font-family: 'IBMP', Arial, sans-serif;
}

/* Font scheme: Karla */
[data-font-scheme="karla"] {
    --font-primary: 'Karla', sans-serif;
    --font-heading: 'Karla', sans-serif;
    --font-body: 'Karla', sans-serif;
}

[data-font-scheme="karla"] * {
    font-family: 'Karla', Arial, sans-serif;
}

/* Font scheme: Libre */
[data-font-scheme="libre"] {
    --font-primary: 'Libre', serif;
    --font-heading: 'Libre', serif;
    --font-body: 'Libre', serif;
}

[data-font-scheme="libre"] * {
    font-family: 'Libre', Georgia, 'Times New Roman', serif;
}

/* Font scheme: Lora */
[data-font-scheme="lora"] {
    --font-primary: 'Lora', serif;
    --font-heading: 'Lora', serif;
    --font-body: 'Lora', serif;
}

[data-font-scheme="lora"] * {
    font-family: 'Lora', Georgia, 'Times New Roman', serif;
}

/* Font scheme: Merri */
[data-font-scheme="merri"] {
    --font-primary: 'Merri', serif;
    --font-heading: 'Merri', serif;
    --font-body: 'Merri', serif;
}

[data-font-scheme="merri"] * {
    font-family: 'Merri', Georgia, 'Times New Roman', serif;
}

/* Font scheme: Mulish */
[data-font-scheme="mulish"] {
    --font-primary: 'Mulish', sans-serif;
    --font-heading: 'Mulish', sans-serif;
    --font-body: 'Mulish', sans-serif;
}

[data-font-scheme="mulish"] * {
    font-family: 'Mulish', Arial, sans-serif;
}

/* Font scheme: PTSerif */
[data-font-scheme="ptserif"] {
    --font-primary: 'PTSerif', serif;
    --font-heading: 'PTSerif', serif;
    --font-body: 'PTSerif', serif;
}

[data-font-scheme="ptserif"] * {
    font-family: 'PTSerif', Georgia, 'Times New Roman', serif;
}

/* Font scheme: Quicksand */
[data-font-scheme="quicksand"] {
    --font-primary: 'Quicksand', sans-serif;
    --font-heading: 'Quicksand', sans-serif;
    --font-body: 'Quicksand', sans-serif;
}

[data-font-scheme="quicksand"] * {
    font-family: 'Quicksand', Arial, sans-serif;
}

/* Font scheme: Source */
[data-font-scheme="source"] {
    --font-primary: 'Source', sans-serif;
    --font-heading: 'Source', sans-serif;
    --font-body: 'Source', sans-serif;
}

[data-font-scheme="source"] * {
    font-family: 'Source', Arial, sans-serif;
}

/* Font scheme: Work */
[data-font-scheme="work"] {
    --font-primary: 'Work', sans-serif;
    --font-heading: 'Work', sans-serif;
    --font-body: 'Work', sans-serif;
}

[data-font-scheme="work"] * {
    font-family: 'Work', Arial, sans-serif;
}


/* ===========================
   TYPOGRAPHY UTILITY CLASSES
   =========================== */

/* Font Family Classes - Now respect the scheme */
.font-primary {
    font-family: var(--font-primary) !important;
}

.font-heading {
    font-family: var(--font-heading) !important;
}

.font-body {
    font-family: var(--font-body) !important;
}

.font-mono {
    font-family: var(--font-mono) !important;
}

/* Font Size Classes */
.text-xs {
    font-size: var(--text-xs) !important;
}

.text-sm {
    font-size: var(--text-sm) !important;
}

.text-base {
    font-size: var(--text-base) !important;
}

.text-lg {
    font-size: var(--text-lg) !important;
}

.text-xl {
    font-size: var(--text-xl) !important;
}

.text-2xl {
    font-size: var(--text-2xl) !important;
}

.text-3xl {
    font-size: var(--text-3xl) !important;
}

.text-4xl {
    font-size: var(--text-4xl) !important;
}

.text-5xl {
    font-size: var(--text-5xl) !important;
}

.text-6xl {
    font-size: var(--text-6xl) !important;
}

/* Font Weight Classes */
.font-light {
    font-weight: var(--font-light) !important;
}

.font-normal {
    font-weight: var(--font-normal) !important;
}

.font-medium {
    font-weight: var(--font-medium) !important;
}

.font-semibold {
    font-weight: var(--font-semibold) !important;
}

.font-bold {
    font-weight: var(--font-bold) !important;
}

.font-extrabold {
    font-weight: var(--font-extrabold) !important;
}

.font-black {
    font-weight: var(--font-black) !important;
}

/* Line Height Classes */
.leading-none {
    line-height: var(--leading-none) !important;
}

.leading-tight {
    line-height: var(--leading-tight) !important;
}

.leading-snug {
    line-height: var(--leading-snug) !important;
}

.leading-normal {
    line-height: var(--leading-normal) !important;
}

.leading-relaxed {
    line-height: var(--leading-relaxed) !important;
}

.leading-loose {
    line-height: var(--leading-loose) !important;
}

/* Text Transform Classes */
.uppercase {
    text-transform: uppercase !important;
}

.lowercase {
    text-transform: lowercase !important;
}

.capitalize {
    text-transform: capitalize !important;
}

.normal-case {
    text-transform: none !important;
}

/* Text Alignment Classes */
.text-left {
    text-align: left !important;
}

.text-center {
    text-align: center !important;
}

.text-right {
    text-align: right !important;
}

.text-justify {
    text-align: justify !important;
}

/* Text Decoration Classes */
.underline {
    text-decoration: underline !important;
}

.line-through {
    text-decoration: line-through !important;
}

.no-underline {
    text-decoration: none !important;
}

/* ===========================
   SEMANTIC TYPOGRAPHY CLASSES
   =========================== */

/* Headings - Now use CSS variables that change with scheme */
.heading-1 {
    font-family: var(--font-heading);
    font-size: var(--text-5xl);
    font-weight: var(--font-bold);
    line-height: var(--leading-tight);
}

.heading-2 {
    font-family: var(--font-heading);
    font-size: var(--text-4xl);
    font-weight: var(--font-bold);
    line-height: var(--leading-tight);
}

.heading-3 {
    font-family: var(--font-heading);
    font-size: var(--text-3xl);
    font-weight: var(--font-semibold);
    line-height: var(--leading-snug);
}

.heading-4 {
    font-family: var(--font-heading);
    font-size: var(--text-2xl);
    font-weight: var(--font-semibold);
    line-height: var(--leading-snug);
}

.heading-5 {
    font-family: var(--font-heading);
    font-size: var(--text-xl);
    font-weight: var(--font-medium);
    line-height: var(--leading-snug);
}

.heading-6 {
    font-family: var(--font-heading);
    font-size: var(--text-lg);
    font-weight: var(--font-medium);
    line-height: var(--leading-normal);
}

/* Body Text */
.body-large {
    font-family: var(--font-body);
    font-size: var(--text-lg);
    font-weight: var(--font-normal);
    line-height: var(--leading-relaxed);
}

.body-normal {
    font-family: var(--font-body);
    font-size: var(--text-base);
    font-weight: var(--font-normal);
    line-height: var(--leading-normal);
}

.body-small {
    font-family: var(--font-body);
    font-size: var(--text-sm);
    font-weight: var(--font-normal);
    line-height: var(--leading-normal);
}