/* ==================== DESIGN TOKENS ====================
   Handyman Martinez — luxury design-build system
   (modeled on conceptrenovations.com) */
:root {
  /* --- Color: warm neutral foundation --- */
  --cream:        #F5F1E5;   /* page background */
  --cream-2:      #F8F4EA;   /* lighter cream */
  --cream-deep:   #EDE7D7;   /* alt section background */
  --greige:       #A79A8A;   /* greige accents (badge ring, dividers) */
  --greige-dark:  #8E826F;
  --band:         #6E655A;   /* deepened warm taupe for AA text on CTA/testimonial bands */
  --navy:         #34394D;   /* deep accent */
  --terracotta:   #D54326;   /* brand accent */
  --terracotta-d: #B5371D;

  /* --- Ink / text --- */
  --ink:        #383839;     /* headings (CR fingerprint ink) */
  --ink-soft:   #383839;
  --text:       #4A4A48;     /* body copy */
  --muted:      #5F5A50;     /* captions / meta (AA on cream / cream-deep) */
  --on-dark:    #F6F0DE;     /* text over imagery/bands */
  --on-dark-mut:#E7DECB;

  --hairline:   #D8D0BE;     /* thin dividers on cream */
  --hairline-2: #C9BFA8;
  --black:      #1C1C1C;     /* solid buttons */
  --white:      #FFFFFF;

  /* --- Typography --- */
  --font-head: 'Jost', 'Century Gothic', 'Segoe UI', sans-serif;
  --font-body: 'Inter', 'Segoe UI', system-ui, sans-serif;

  --ls-xwide: 0.30em;   /* big tracked caps */
  --ls-wide:  0.27em;   /* CR's signature very-wide H2/eyebrow tracking */
  --ls-mid:   0.18em;
  --ls-tight: 0.12em;

  /* --- Fluid type scale --- */
  --fs-hero:   clamp(1.45rem, 1rem + 2.2vw, 2.35rem);
  --fs-h2:     clamp(1.35rem, 1rem + 1.5vw, 1.95rem);
  --fs-h3:     clamp(0.95rem, 0.85rem + 0.4vw, 1.1rem);
  --fs-eyebrow:clamp(0.7rem, 0.66rem + 0.2vw, 0.8rem);
  --fs-body:   clamp(1rem, 0.97rem + 0.3vw, 1.15rem);
  --fs-lead:   clamp(1.05rem, 1rem + 0.4vw, 1.2rem);
  --fs-small:  0.82rem;

  /* --- Spacing & layout --- */
  --maxw:        1180px;
  --maxw-narrow: 820px;
  --gutter:      clamp(1.25rem, 4vw, 3rem);
  --section-y:   clamp(4.5rem, 8vw, 7.5rem);
  --radius:      2px;        /* near-square, luxe */
  --radius-pill: 999px;

  /* --- Shadows (restrained) --- */
  --shadow-sm: 0 2px 10px rgba(43, 40, 30, 0.06);
  --shadow-md: 0 14px 40px rgba(43, 40, 30, 0.12);
  --shadow-lg: 0 28px 70px rgba(43, 40, 30, 0.18);

  /* --- Motion --- */
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --dur:  0.6s;

  --header-h: 116px;   /* tall transparent header over hero */
  --header-h-scrolled: 74px;
}