/* ============================================================
   TOKENS.CSS — Divya Maarg Design Tokens
   Premium Light & Airy · Ivory/Gold Vibe · Spiritual Luxury
   ============================================================ */
:root {
    /* ── Brand palette ─────────────────────────────────────── */
    --dm-primary-dark:  #14110E;   /* very deep warm taupe — text, accents    */
    --dm-maroon:        #C19356;   /* Repurposed to gold for primary CTA      */
    --dm-maroon-rich:   #D4A86A;   /* hover state for primary                 */
    --dm-saffron:       #DAB88B;   /* soft champagne — links, subtle accents  */
    --dm-saffron-bright:#E2C6A0;   /* champagne hover                         */
    --dm-gold:          #C19356;   /* classic gold — borders, dividers        */
    --dm-gold-light:    #DAB88B;   /* lighter champagne                       */
    --dm-ivory:         #FBF9F6;   /* ultra-light warm ivory — main bg        */
    --dm-beige:         #F4EFEB;   /* soft beige — card bg, alternate bg      */
    --dm-charcoal:      #2A2623;   /* primary body text                       */
    --dm-success:       #298B58;
    --dm-offer:         #C19356;   /* offer highlights in gold                */

    /* ── Surfaces (light theme) ────────────────────────────── */
    --dm-bg:            #FBF9F6;
    --dm-surface:       #FFFFFF;
    --dm-surface-alt:   #F4EFEB;
    --dm-surface-card:  rgba(255, 255, 255, 0.65); /* Glassmorphism base */

    /* ── Text ──────────────────────────────────────────────── */
    --dm-text:          #2A2623;
    --dm-text-mute:     #807871;
    --dm-text-light:    #AFA69D;
    --dm-text-on-dark:  #FBF9F6;

    /* ── Borders & lines ───────────────────────────────────── */
    --dm-line:          rgba(193, 147, 86, 0.15); /* Soft gold lines */
    --dm-line-gold:     rgba(193, 147, 86, 0.35);
    --dm-line-gold-strong: rgba(193, 147, 86, 0.75);

    /* ── Dark surfaces (footer only) ───────────────────────── */
    --dm-dark:          #14110E;
    --dm-dark-mid:      #1A1713;
    --dm-dark-soft:     #25211B;
    --dm-dark-card:     #1E1A16;
    --dm-dark-border:   rgba(193, 147, 86, 0.22);
    --dm-dark-border-strong: rgba(193, 147, 86, 0.50);

    /* ── Gradients ─────────────────────────────────────────── */
    --dm-grad-saffron:  linear-gradient(135deg, #C19356 0%, #DAB88B 100%);
    --dm-grad-gold:     linear-gradient(135deg, #C19356 0%, #E2C6A0 50%, #C19356 100%);
    --dm-grad-dark:     linear-gradient(180deg, #14110E 0%, #1A1713 100%);
    --dm-grad-hero:     linear-gradient(160deg, #FBF9F6 0%, #F4EFEB 100%);
    --dm-grad-divine:   radial-gradient(ellipse at center, rgba(193,147,86,0.12) 0%, rgba(218,184,139,0.04) 45%, rgba(251,249,246,0) 75%);
    --dm-grad-soft:     linear-gradient(180deg, #FBF9F6 0%, #FFFFFF 100%);
    
    /* ── Glassmorphism ─────────────────────────────────────── */
    --dm-glass-bg:      rgba(255, 255, 255, 0.7);
    --dm-glass-border:  rgba(255, 255, 255, 0.4);
    --dm-glass-blur:    blur(16px);

    /* ── Typography ────────────────────────────────────────── */
    /* Primary: Elegant Sans-serif (Outfit/Inter) for clean luxury, Secondary: Cormorant */
    --dm-font-display:  "Cormorant Garamond", "Playfair Display", Georgia, serif;
    --dm-font-body:     "Outfit", "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

    /* ── Type scale ────────────────────────────────────────── */
    --dm-fs-xs:   12px;
    --dm-fs-sm:   14px;
    --dm-fs-base: 16px;
    --dm-fs-md:   18px;
    --dm-fs-lg:   22px;
    --dm-fs-xl:   28px;
    --dm-fs-2xl:  36px;
    --dm-fs-3xl:  48px;
    --dm-fs-4xl:  64px;

    /* ── Spacing ────────────────────────────────────────────── */
    --dm-space-1:   4px;
    --dm-space-2:   8px;
    --dm-space-3:  12px;
    --dm-space-4:  16px;
    --dm-space-5:  24px;
    --dm-space-6:  32px;
    --dm-space-7:  48px;
    --dm-space-8:  64px;
    --dm-space-9:  96px;
    --dm-space-10: 128px;

    /* ── Radius ─────────────────────────────────────────────── */
    --dm-radius-sm:  8px;
    --dm-radius-md:  16px;
    --dm-radius-lg:  24px;
    --dm-radius-xl:  40px;
    --dm-radius-pill: 999px;

    /* ── Shadows (warm, subtle, light) ──────────────────────── */
    --dm-shadow-soft:   0 4px 20px rgba(193, 147, 86, 0.05);
    --dm-shadow-elev:   0 12px 32px rgba(193, 147, 86, 0.08);
    --dm-shadow-deep:   0 24px 64px rgba(193, 147, 86, 0.12);
    --dm-shadow-glow:   0 0 40px rgba(193, 147, 86, 0.20);
    --dm-shadow-saffron:0 8px 30px rgba(218, 184, 139, 0.25);

    /* ── Layout ─────────────────────────────────────────────── */
    --dm-container:   1280px;
    --dm-container-w: 1440px;
    --dm-header-h:    80px; /* slightly taller for premium feel */
    --dm-announce-h:  40px;
    --dm-z-drawer:    1100;
    --dm-z-modal:     1200;
    --dm-z-toast:     1300;

    /* ── Motion ─────────────────────────────────────────────── */
    --dm-ease:  cubic-bezier(0.16, 1, 0.3, 1); /* Snappy smooth */
    --dm-dur-1: 200ms;
    --dm-dur-2: 400ms;
    --dm-dur-3: 600ms;
    --dm-dur-slow: 1000ms;

    /* ============================================================
       Refined Editorial palette (additive — for premium home)
       Aesop / Le Labo / Diptyque feel · sacred craft heritage
       ============================================================ */
    --dm-ink:        #14110E;
    --dm-ink-soft:   #25211B;
    --dm-bone:       #FFFFFF;
    --dm-sand:       #FBF9F6;
    --dm-stone:      #DAB88B;
    --dm-brass:      #C19356;
    --dm-brass-soft: #DAB88B;
    --dm-accent:     var(--dm-gold);

    /* Editorial type scale (additive) */
    --dm-fs-display: clamp(48px, 6vw, 112px);
    --dm-fs-h2-xl:   clamp(36px, 4vw, 64px);
    --dm-fs-pull:    clamp(24px, 3vw, 40px);

    /* Editorial spacing */
    --dm-section-y:  clamp(80px, 10vw, 140px);
}