:root {
    /* ================================================================
       ESPRIT LANDES IMMOBILIER — Design System
       Palette : Teal (primary), Sand (focus), Neutral
       Format : OKLch — fallback hex en commentaire
       ================================================================ */

    /* --- Primary : Teal / Vert Landais --- */
    --primary-2x-light: oklch(96.04% 0.005 197);   /* #EEF3F3 */
    --primary-x-light:  oklch(89.79% 0.013 203);   /* #D4E0E1 */
    --primary-light:    oklch(73.66% 0.036 201);   /* #90B1B3 */
    --primary-main:     oklch(35.94% 0.046 204);   /* #1B4448 */
    --primary-dark:     oklch(32.37% 0.042 205);   /* #153A3E */
    --primary-x-dark:   oklch(28.30% 0.038 204);   /* #0F2F32 */
    --primary-2x-dark:  oklch(24.00% 0.032 204);   /* #091F22 */

    /* --- Focus : Sand / Sable Landais --- */
    --focus-2x-light: oklch(95.89% 0.015 71);     /* #F8F0E7 */
    --focus-x-light:  oklch(91.71% 0.024 68);     /* #EFE1D3 */
    --focus-light:    oklch(80.30% 0.050 61);     /* #D7B89F */
    --focus-main:     oklch(69.61% 0.068 57);     /* #BE9374 */
    --focus-dark:     oklch(55.35% 0.062 60);     /* #8E6A4D */
    --focus-x-dark:   oklch(45.19% 0.059 61);     /* #6E4E33 */
    --focus-2x-dark:  oklch(36.00% 0.052 60);     /* #4E3822 */

    /* --- Secondary : gris structurel (footer, sections) --- */
    --secondary-main:    oklch(48.65% 0.007 240);  /* #5C6063 */
    --secondary-dark:    oklch(29.49% 0.006 237);  /* #2A2D2F */
    --secondary-x-dark:  oklch(18.89% 0.006 237);  /* #111416 */
    --secondary-light:   oklch(76.36% 0.000 0);    /* #B2B2B2 */
    --secondary-x-light: oklch(92.37% 0.003 229);  /* #E4E6E7 */

    /* --- Neutral --- */
    --neutral-2x-dark: oklch(18.89% 0.006 237);   /* #111416 */
    --neutral-x-dark:  oklch(29.49% 0.006 237);   /* #2A2D2F */
    --neutral-dark:    oklch(48.65% 0.007 240);   /* #5C6063 */
    --neutral-mid:     oklch(64.40% 0.006 229);   /* #8A8E90 */
    --neutral-main:    oklch(76.36% 0.000 0);     /* #B2B2B2 */
    --neutral-light:   oklch(96.07% 0.002 248);   /* #F1F2F3 */
    --neutral-x-light: oklch(98.14% 0.001 197);   /* #F8F9F9 */
    --neutral-black:   #000;

    /* --- Font Family --- */
    --ff-body:     'Quicksand', system-ui, sans-serif;
    --ff-headline: 'Quicksand', system-ui, sans-serif;

    /* --- Font Weight (Quicksand : géométrique arrondie, 300-700) --- */
    --fw-normal: 400;
    --fw-bold:   600;
    --fw-bolder: 700;

    /* --- Background --- */
    --bg-body: oklch(98.2% 0.008 71);  /* #FDF8F3 — crème à peine, palette chaude */

    /* --- Spacing fluide (complète Bootstrap 1-5) --- */
    --space-1: 0.25rem;                    /* 4px   — équivalent Bootstrap *-1 */
    --space-2: 0.5rem;                     /* 8px   — équivalent Bootstrap *-2 */
    --space-3: 1rem;                       /* 16px  — équivalent Bootstrap *-3 */
    --space-4: clamp(1.5rem, 2vw, 2rem);   /* 24px → 32px — base Bootstrap *-4 */
    --space-5: clamp(2rem, 3vw, 3rem);     /* 32px → 48px — équivalent Bootstrap *-5 */
    --space-6: clamp(4rem, 5vw, 5rem);     /* 64px → 80px */
    --space-7: clamp(5rem, 7vw, 7rem);     /* 80px → 112px */
    --space-8: clamp(6rem, 10vw, 10rem);   /* 96px → 160px */

    /* --- Radius --- */
    --radius-xs: .25rem;
    --radius-sm: .4rem;
    --radius-md: .6rem;
    --radius-lg: 3rem;
    --radius-xl: 50%;

    /* --- Shadows --- */
    --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.08);
    --shadow-md: 0 2px 8px rgba(0, 0, 0, 0.10);
    --shadow-lg: 0 4px 16px rgba(0, 0, 0, 0.15);
    --shadow-xl: 0 8px 30px rgba(0, 0, 0, 0.20);

    /* --- Filters svg --- */
    --fill-svg-primary-main:invert(9%) sepia(6%) saturate(6945%) hue-rotate(147deg) brightness(132%) contrast(81%);
    --fill-svg-primary-dark:invert(47%) sepia(49%) saturate(3546%) hue-rotate(148deg) brightness(19%) contrast(83%);
    --fill-svg-primary-x-dark:invert(15%) sepia(49%) saturate(2052%) hue-rotate(145deg) brightness(47%) contrast(88%);
    --fill-svg-primary-light:invert(73%) sepia(98%) saturate(7283%) hue-rotate(145deg) brightness(94%) contrast(46%);
    --fill-svg-primary-x-light:invert(99%) sepia(95%) saturate(5142%) hue-rotate(122deg) brightness(111%) contrast(62%);

    --fill-svg-secondary-main:invert(5%) sepia(25%) saturate(9311%) hue-rotate(169deg) brightness(97%) contrast(28%);
    --fill-svg-secondary-dark:invert(2%) sepia(63%) saturate(4251%) hue-rotate(162deg) brightness(79%) contrast(67%);
    --fill-svg-secondary-x-dark:invert(100%) sepia(61%) saturate(5093%) hue-rotate(146deg) brightness(25%) contrast(166%);
    --fill-svg-secondary-light:invert(35%) sepia(1%) saturate(0%) hue-rotate(70deg) brightness(197%) contrast(101%);
    --fill-svg-secondary-x-light:invert(100%) sepia(22%) saturate(5129%) hue-rotate(149deg) brightness(78%) contrast(144%);

    --fill-svg-focus-main:invert(50%) sepia(4%) saturate(2934%) hue-rotate(346deg) brightness(120%) contrast(94%);
    --fill-svg-focus-dark:invert(60%) sepia(14%) saturate(8214%) hue-rotate(348deg) brightness(60%) contrast(53%);
    --fill-svg-focus-x-dark:invert(18%) sepia(58%) saturate(6070%) hue-rotate(349deg) brightness(99%) contrast(60%);
    --fill-svg-focus-light:invert(70%) sepia(73%) saturate(9757%) hue-rotate(348deg) brightness(178%) contrast(27%);
    --fill-svg-focus-x-light:invert(89%) sepia(76%) saturate(1582%) hue-rotate(331deg) brightness(130%) contrast(54%);

    --fill-svg-neutral-main:invert(55%) sepia(0%) saturate(171%) hue-rotate(273deg) brightness(134%) contrast(87%);
    --fill-svg-neutral-dark:invert(89%) sepia(30%) saturate(4441%) hue-rotate(158deg) brightness(32%) contrast(63%);
    --fill-svg-neutral-black:invert(23%) sepia(37%) saturate(2848%) hue-rotate(326deg) brightness(36%) contrast(154%);
    --fill-svg-neutral-light:invert(83%) sepia(0%) saturate(1378%) hue-rotate(296deg) brightness(98%) contrast(142%);
    --fill-svg-neutral-x-light:invert(100%) sepia(10%) saturate(7160%) hue-rotate(83deg) brightness(102%) contrast(92%);
    --fill-svg-white:invert(100%) sepia(0%) saturate(401%) hue-rotate(235deg) brightness(121%) contrast(100%);

    --fill-svg-etoile:invert(85%) sepia(60%) saturate(3105%) hue-rotate(329deg) brightness(101%) contrast(100%);
    --fill-svg-red:invert(15%) sepia(95%) saturate(6000%) hue-rotate(355deg) brightness(90%) contrast(95%);

    /* --- Transitions --- */
    --transition-fast:   0.15s ease;
    --transition-base:   0.2s ease;
    --transition-medium: 0.3s ease;
    --transition-slow:   0.5s ease;

    /* --- Modal overlay --- */
    --modal-overlay-bg: rgba(0, 0, 0, 0.6);

    /* --- Z INDEX --- */
    --zindex-header: 1021;
    --zindex-topBar: 1022;
    --zindex-carousel-thumb: 103;
    --zindex-invisibleLink: 102;
    --zindex-favori: 102;
    --zindex-modal-backdrop: 1022;
    --zindex-modal-content: 1051;
    --block-contact-form: 1010;
    --zindex-logo-mobile: 1020;
    --zindex-content-block-filtre: 999;
}

/* ================================================================
   OVERRIDE BOOTSTRAP
   ================================================================ */
:root {
    --bs-link-color-rgb: 27, 68, 72;          /* #1B4448 primary-main */
    --bs-link-hover-color-rgb: 21, 58, 62;    /* #153A3E primary-dark */
}

.nav {
    --bs-nav-link-hover-color: var(--primary-dark);
}

.offcanvas {
    --bs-offcanvas-width: calc(100% - 25px) !important;
}
