/* ==========================================================================
   Redefined Kitchens & Bath — Design Tokens (single source of truth)
   Change a value here → the whole site changes. Sampled from the brand/logo.
   Luxury black + antique gold + warm cream.
   ========================================================================== */
:root {
  /* ---- Brand color ---- */
  --rd-ink:        #242524;   /* primary brand charcoal / dark sections / headings */
  --rd-black:      #141413;   /* darkest — footer, overlays */
  --rd-char-600:   #3A3B38;   /* lighter charcoal — hover, secondary surface */
  --rd-gold:       #B8A46A;   /* antique gold — accent / primary CTA / eyebrows */
  --rd-gold-dark:  #9C8A54;   /* gold hover / pressed */
  --rd-gold-soft:  #CFBE8C;   /* lighter gold — for use on dark backgrounds */

  /* ---- Neutrals (warm) ---- */
  --rd-white:      #FFFFFF;
  --rd-cream:      #F5F3EE;   /* alt section bg (warm off-white) */
  --rd-cream-2:    #ECE8DF;   /* deeper warm bg */
  --rd-line:       #E4DFD4;   /* borders / dividers (warm) */
  --rd-taupe:      #8E8C87;   /* muted / secondary text */
  --rd-body-ink:   #2B2C2A;   /* body text (warm near-black) */

  /* ---- Semantic ---- */
  --rd-bg:          var(--rd-white);
  --rd-text:        var(--rd-body-ink);
  --rd-heading:     var(--rd-ink);
  --rd-primary:     var(--rd-gold);
  --rd-primary-ink: var(--rd-ink);        /* text on gold */
  --rd-link:        var(--rd-gold-dark);
  --rd-on-dark:     #EDEAE3;              /* text on charcoal/black */
  --rd-on-dark-mut: #B7B3AA;             /* muted text on dark */

  /* ---- Typography ---- */
  --rd-font-display: "Playfair Display", Georgia, "Times New Roman", serif;
  --rd-font-body:    "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --rd-fw-body: 400; --rd-fw-med: 500; --rd-fw-semi: 600; --rd-fw-bold: 700; --rd-fw-black: 800;

  /* Fluid type scale (mobile → desktop) — a touch larger/airier than utilitarian brands */
  --rd-h1: clamp(2.25rem, 5.2vw + 1rem, 3.75rem);
  --rd-h2: clamp(1.7rem, 3.2vw + 0.75rem, 2.6rem);
  --rd-h3: clamp(1.3rem, 1.6vw + 0.75rem, 1.65rem);
  --rd-h4: clamp(1.1rem, 1vw + 0.6rem, 1.3rem);
  --rd-body: 1.075rem;
  --rd-small: 0.9375rem;
  --rd-eyebrow: 0.78rem;
  --rd-lh-tight: 1.12;
  --rd-lh-body: 1.68;
  --rd-tracking-eyebrow: 0.22em;   /* wide tracking = luxury */

  /* ---- Spacing (8px scale) ---- */
  --rd-1: 0.25rem; --rd-2: 0.5rem; --rd-3: 0.75rem; --rd-4: 1rem;
  --rd-5: 1.5rem; --rd-6: 2rem; --rd-7: 3rem; --rd-8: 4rem; --rd-9: 6rem;
  --rd-section-y: clamp(3.5rem, 7vw, 7rem);   /* generous vertical rhythm */

  /* ---- Layout ---- */
  --rd-container: 1220px;
  --rd-container-text: 70ch;
  --rd-gutter: clamp(1rem, 4vw, 2.25rem);

  /* ---- Radius / shadow / motion (understated — luxury favors crisp edges) ---- */
  --rd-radius: 4px;
  --rd-radius-sm: 3px;
  --rd-radius-pill: 999px;
  --rd-shadow: 0 8px 30px rgba(20, 20, 19, 0.08);
  --rd-shadow-lg: 0 20px 50px rgba(20, 20, 19, 0.14);
  --rd-ease: cubic-bezier(0.22, 0.61, 0.36, 1);
  --rd-dur: 240ms;

  /* ---- Component surfaces ---- */
  --rd-bar-h: 60px;   /* sticky mobile conversion bar height */
}