/* ==========================================================================
   SAN JOSE CUSTOM UPHOLSTERY — DESIGN TOKENS
   Palette derived from the original logo mark (Logo.png):
     dominant rust-orange  #D84818   -> --brand-rust  (primary accent)
     secondary olive-green #789048   -> --brand-olive (supporting tone)
   Extended into a warm "atelier" register: walnut, leather, bone, brass.
   ========================================================================== */

:root {
  /* ---- Core surfaces (warm, never pure black/white) ---- */
  --c-espresso:      #14100D;   /* deepest ground */
  --c-walnut:        #1F1813;   /* dark section base */
  --c-walnut-soft:   #2A211A;   /* raised dark surface */
  --c-leather:       #3B2E24;   /* mid brown, borders on dark */
  --c-bone:          #F7F3EC;   /* primary light ground */
  --c-linen:         #EFE8DD;   /* alternate light ground */
  --c-oat:           #E2D8C8;   /* muted light surface */

  /* ---- Brand accents (max two, per design rules) ---- */
  --c-rust:          #C4451A;   /* from logo — primary CTA / active */
  --c-rust-bright:   #D84818;   /* exact logo hue, for small marks */
  --c-rust-deep:     #8F3213;   /* pressed / hover-dark */
  --c-brass:         #B08A4A;   /* metallic accent — rules, marks, hairlines */
  --c-brass-light:   #D4B378;   /* brass highlight on dark */

  /* ---- Supporting muted tone (from logo olive) ---- */
  --c-olive:         #5E6B42;   /* tags, quiet UI, secondary marks */

  /* ---- Text ---- */
  --t-on-dark:       #F2EDE4;
  --t-on-dark-mute:  #B9AB99;
  --t-on-light:      #241C15;
  --t-on-light-mute: #5C4F42;

  /* ---- Semantic ---- */
  --c-error:         #A3341B;
  --c-success:       #4B6B3E;
  --c-star:          #E0A32E;

  /* ---- Typography ---- */
  --f-display: "Fraunces", "Playfair Display", Georgia, "Times New Roman", serif;
  --f-body:    "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;

  --fs-hero:    clamp(3.5rem, 9vw, 8rem);
  --fs-h1:      clamp(2.75rem, 6vw, 5rem);
  --fs-h2:      clamp(2.1rem, 4.4vw, 3.6rem);
  --fs-h3:      clamp(1.45rem, 2.4vw, 2rem);
  --fs-h4:      clamp(1.15rem, 1.6vw, 1.35rem);
  --fs-body:    clamp(1.0625rem, 0.45vw + 0.95rem, 1.1875rem);
  --fs-sm:      0.9375rem;
  --fs-xs:      0.8125rem;
  --fs-eyebrow: 0.75rem;
  --fs-giant:   clamp(7rem, 20vw, 18rem);   /* oversized typographic moments */

  --lh-tight:  1.06;
  --lh-snug:   1.22;
  --lh-body:   1.6;
  --lh-loose:  1.75;

  --ls-display: -0.02em;
  --ls-eyebrow: 0.18em;
  --ls-wide:    0.06em;

  /* ---- 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:  4rem;
  --sp-9:  6rem;
  --sp-10: 8rem;
  --sp-section: clamp(6rem, 12vw, 12rem);
  --sp-gutter:  clamp(1.25rem, 4vw, 4rem);

  /* ---- Layout ---- */
  --w-max:     1440px;
  --w-content: 1200px;
  --w-text:    68ch;
  --grid-cols: 12;

  /* ---- Layered shadows (never a single flat shadow) ---- */
  --shadow-sm:
      0 1px 2px rgba(20, 16, 13, .05),
      0 2px 6px rgba(20, 16, 13, .06);
  --shadow-md:
      0 1px 2px rgba(20, 16, 13, .06),
      0 4px 8px rgba(20, 16, 13, .06),
      0 12px 24px rgba(20, 16, 13, .08),
      0 24px 48px rgba(20, 16, 13, .06);
  --shadow-lg:
      0 2px 4px rgba(20, 16, 13, .07),
      0 8px 16px rgba(20, 16, 13, .07),
      0 20px 40px rgba(20, 16, 13, .10),
      0 40px 80px rgba(20, 16, 13, .10);
  --shadow-xl:
      0 4px 8px rgba(20, 16, 13, .08),
      0 12px 24px rgba(20, 16, 13, .09),
      0 32px 64px rgba(20, 16, 13, .13),
      0 64px 120px rgba(20, 16, 13, .14);
  --shadow-brass:
      0 2px 6px rgba(176, 138, 74, .22),
      0 10px 24px rgba(176, 138, 74, .18),
      0 20px 44px rgba(140, 70, 26, .14);
  --shadow-inset-hair: inset 0 1px 0 rgba(255, 250, 240, .10);

  /* ---- Motion ---- */
  --ease-out-expo:  cubic-bezier(.16, 1, .3, 1);
  --ease-in-out:    cubic-bezier(.65, .05, .36, 1);
  --ease-spring:    cubic-bezier(.34, 1.56, .64, 1);
  --dur-fast:   180ms;
  --dur-base:   360ms;
  --dur-slow:   680ms;
  --dur-reveal: 900ms;
  --stagger:    90ms;

  /* ---- Effects ---- */
  --blur-glass: 16px;
  --radius-sm:  4px;
  --radius-md:  8px;
  --radius-lg:  16px;
  --radius-pill: 100px;
  --hair: 1px solid rgba(176, 138, 74, .28);

  /* ---- Layers ---- */
  --z-base: 1;
  --z-raised: 10;
  --z-sticky: 100;
  --z-header: 500;
  --z-mobilebar: 600;
  --z-overlay: 900;
  --z-modal: 1000;
}