:root {

    /* ===== COLORS ===== */
    --color-primary: #C59D5F;
    --color-primary-dark: #A98346;

    --color-bg: #0F0F10;
    --color-surface: #17181A;
    --color-surface-light: #1F2023;

    --color-text: #FFFFFF;
    --color-text-secondary: #B8B8B8;
    --color-border: rgba(255,255,255,0.08);

    /* ===== TYPOGRAPHY ===== */
    --fs-xs: 14px;
    --fs-sm: 16px;
    --fs-md: 18px;
    --fs-lg: 24px;
    --fs-xl: 36px;
    --fs-2xl: 48px;
    --fs-hero: 64px;

    /* ===== FONT WEIGHT ===== */
    --fw-regular: 400;
    --fw-medium: 500;
    --fw-semibold: 600;
    --fw-bold: 700;

    /* ===== SPACING ===== */
    --space-xs: 8px;
    --space-sm: 16px;
    --space-md: 24px;
    --space-lg: 40px;
    --space-xl: 64px;
    --space-2xl: 96px;
    --space-3xl: 120px;

    /* ===== RADIUS ===== */
    --radius-sm: 8px;
    --radius-md: 14px;
    --radius-lg: 20px;
    --radius-xl: 28px;

    /* ===== SHADOW ===== */
    --shadow-soft: 0 10px 30px rgba(0,0,0,.15);
    --shadow-card: 0 20px 60px rgba(0,0,0,.25);

    /* ===== TRANSITIONS ===== */
    --transition-fast: .2s ease;
    --transition: .35s ease;
    --transition-slow: .5s ease;

    /* ===== CONTENT ===== */
    --content-max-width:900px;
    --hero-content-width: 900px;

    /* ===== CARD ===== */
    --card-radius:22px;

    /* ===== ICON SIZE ===== */
    --icon-circle:82px;

    /* ===== GLASS ===== */
    --glass-bg:rgba(255,255,255,.04);
    --glass-border:rgba(212,175,55,.18);

    /* ===== LAYOUT ===== */
    --container-width: 1320px;
    --container-padding: 20px;

    /* ===== SECTION ===== */
    --section-padding: 120px;
    --section-padding-sm: 80px;

    /* ===== Z INDEX ===== */
    --z-header: 1000;
    --z-dropdown: 1010;
    --z-overlay: 1020;
    --z-modal: 1030;

    --navbar-height: 90px;
}