:root {
    --color-background: #151a17;
    --color-background-strong: #1c231e;
    --color-surface: #202923;
    --color-surface-soft: #263129;
    --color-surface-elevated: rgba(245, 239, 230, 0.08);
    --color-text-primary: #f4efe6;
    --color-text-secondary: #cfcaC0;
    --color-text-muted: #a7a392;
    --color-border: rgba(244, 239, 230, 0.12);
    --color-border-strong: rgba(244, 239, 230, 0.24);
    --color-brand: #5d7a58;
    --color-brand-deep: #405643;
    --color-brand-soft: #8b9d83;
    --color-off-white: #efe7d9;
    --color-sand: #d4b895;
    --color-essential: #4d6972;
    --color-conforto: #b56e52;
    --color-experiencia: #8f7850;
    --color-overlay: rgba(9, 13, 10, 0.5);

    --font-heading: "Montserrat", "Avenir Next", Avenir, "Segoe UI", sans-serif;
    --font-body: "Montserrat", "Avenir Next", Avenir, "Segoe UI", sans-serif;
    --font-ui: "Montserrat", "Avenir Next", Avenir, "Segoe UI", sans-serif;

    --font-size-xs: 0.75rem;
    --font-size-sm: 0.9rem;
    --font-size-md: 1rem;
    --font-size-lg: 1.15rem;
    --font-size-xl: clamp(2.6rem, 6vw, 5.1rem);
    --font-size-2xl: clamp(1.85rem, 3.5vw, 3.1rem);
    --font-size-3xl: clamp(1.3rem, 1.8vw, 1.7rem);

    --line-height-tight: 1.02;
    --line-height-snug: 1.24;
    --line-height-normal: 1.65;

    --font-weight-regular: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;

    --space-8: 8px;
    --space-12: 12px;
    --space-16: 16px;
    --space-20: 20px;
    --space-24: 24px;
    --space-32: 32px;
    --space-40: 40px;
    --space-48: 48px;
    --space-64: 64px;
    --space-80: 80px;
    --space-112: 112px;

    --radius-sm: 18px;
    --radius-md: 28px;
    --radius-lg: 36px;
    --radius-pill: 999px;

    --shadow-soft: 0 24px 60px rgba(3, 5, 4, 0.18);
    --shadow-hero: 0 30px 80px rgba(3, 5, 4, 0.28);
}