/* ==========================================================================
   DetailHaus design tokens — the single source of truth for colour, space,
   type, radii, shadows and z-index. Components consume only these variables.
   ========================================================================== */

:root {
    /* --- Colour: near-black canvas, charcoal surfaces, one gold accent --- */
    --bg: #0a0a0b;                 /* page canvas */
    --bg-deep: #060607;            /* hero / footer wells */
    --surface: #141416;            /* cards, panels */
    --surface-2: #1c1c1f;          /* raised elements, inputs */
    --surface-glass: rgba(20, 20, 22, 0.62);  /* glass cards over imagery */

    --text: #ece9e2;               /* warm off-white body text */
    --text-strong: #ffffff;
    --muted: #97928a;              /* secondary text, warm grey */
    --faint: #55524d;              /* tertiary: captions, rules */

    --gold: #d4af37;               /* THE accent */
    --gold-bright: #e9c95c;        /* hover / highlight */
    --gold-deep: #9c7c1e;          /* pressed / borders */
    --gold-12: rgba(212, 175, 55, 0.12);
    --gold-25: rgba(212, 175, 55, 0.25);

    --border: rgba(255, 255, 255, 0.08);      /* 1px hairlines */
    --border-strong: rgba(255, 255, 255, 0.16);

    --danger: #c4554d;
    --success: #5f9e6e;
    --info: #7d97ad;

    /* Status hues for booking badges */
    --status-pending: #c9a24b;
    --status-confirmed: #5f9e6e;
    --status-completed: #7d97ad;
    --status-cancelled: #8a5350;

    /* --- Typography --- */
    --font-display: "Bodoni MT", "Didot", "Playfair Display", "Palatino Linotype", Georgia, serif;
    --font-body: "Segoe UI", "Helvetica Neue", Arial, sans-serif;

    --fs-hero: clamp(2.6rem, 7vw, 5.4rem);
    --fs-h1: clamp(2.1rem, 4.5vw, 3.4rem);
    --fs-h2: clamp(1.6rem, 3vw, 2.3rem);
    --fs-h3: 1.25rem;
    --fs-body: 1rem;
    --fs-small: 0.875rem;
    --fs-label: 0.72rem;           /* uppercase tracked labels */

    --track-label: 0.22em;         /* letter-spacing for labels */

    /* --- Spacing scale --- */
    --sp-1: 0.25rem;
    --sp-2: 0.5rem;
    --sp-3: 0.75rem;
    --sp-4: 1rem;
    --sp-5: 1.5rem;
    --sp-6: 2rem;
    --sp-7: 3rem;
    --sp-8: 4.5rem;
    --sp-9: 7rem;

    /* --- Shape & depth --- */
    --radius-sm: 4px;
    --radius: 8px;
    --radius-lg: 14px;

    --shadow-card: 0 10px 30px rgba(0, 0, 0, 0.45);
    --shadow-lift: 0 18px 50px rgba(0, 0, 0, 0.6);
    --glow-gold: 0 0 0 1px var(--gold-25), 0 6px 24px rgba(212, 175, 55, 0.18);

    /* --- Z-index registry --- */
    --z-nav: 100;
    --z-overlay: 200;
    --z-toast: 300;

    /* --- Misc --- */
    --container: 72rem;
    --ease-lux: cubic-bezier(0.22, 0.61, 0.36, 1);  /* slow, settled easing */
}