/* ==========================================================================
   ESSARDAS GROUP — Design Tokens
   Obsidian & Champagne theme
   Mapped to --shop-* variables so shared elements inherit the look.
   ========================================================================== */

:root {
    /* Brand palette */
    --noir:          #0B0B0D;
    --noir-soft:     #141418;
    --noir-elev:     #1C1C22;
    --bone:          #F5F1EA;
    --ivory:         #FBF8F2;
    --champagne:     #C9A875;
    --champagne-lt:  #E3D1AC;
    --champagne-dk:  #A38654;
    --silver-blue:   #A9BCD1;
    --ink:           #1A1A1F;
    --ink-soft:      #4A4A52;
    --mist:          #9A9AA3;
    --hairline:      rgba(201, 168, 117, 0.28);
    --hairline-dk:   rgba(255, 255, 255, 0.10);
    --hairline-lt:   rgba(11, 11, 13, 0.10);

    /* Shared-element variable mapping */
    --shop-primary:      var(--champagne);
    --shop-secondary:    var(--silver-blue);
    --shop-promo:        #8C3A3A;
    --shop-bg:           var(--bone);
    --shop-background:   var(--bone);
    --shop-surface:      var(--ivory);
    --shop-text:         var(--ink);
    --shop-text-muted:   var(--mist);
    --shop-muted:        var(--mist);
    --shop-border:       var(--hairline-lt);
    --shop-radius:       2px;
    --shop-radius-sm:    2px;
    --shop-shadow:       0 1px 2px rgba(11, 11, 13, 0.04);
    --shop-shadow-lg:    0 20px 60px rgba(11, 11, 13, 0.10);
    --shop-heading-font: 'Cormorant Garamond', 'Times New Roman', serif;
    --shop-body-font:    'Inter', system-ui, -apple-system, sans-serif;

    /* Essardas-only type scale */
    --fs-display:   clamp(48px, 8vw, 128px);
    --fs-h1:        clamp(40px, 5.5vw, 80px);
    --fs-h2:        clamp(32px, 4.2vw, 60px);
    --fs-h3:        clamp(22px, 2.4vw, 34px);
    --fs-h4:        clamp(18px, 1.6vw, 22px);
    --fs-eyebrow:   12px;
    --fs-body:      17px;
    --fs-body-sm:   14.5px;
    --fs-ui:        13px;

    /* Layout */
    --container:    1320px;
    --gutter:       clamp(20px, 4vw, 56px);
    --nav-h:        74px;
    --section-y:    clamp(80px, 10vw, 140px);

    /* Motion */
    --ease:         cubic-bezier(0.2, 0.7, 0.2, 1);
    --ease-smooth:  cubic-bezier(0.65, 0, 0.35, 1);
}
