/* ==========================================================================
   tokens.css — millgroup.com (Hello Elementor child)
   Load order: MUST load before style.css. Enqueued at priority 1.
   Tier 1 (primitives) = the only block you edit per site.
   Tier 2 (semantic)   = identical across every site.
   Values pulled verbatim from the existing style.css.
   ========================================================================== */

/* ==========================================================================
   TIER 1 — PRIMITIVES  (millgroup values)
   ========================================================================== */
:root {
  /* near-black — UNIFIED. Original CSS mixed #000, #111, and rgb(10,10,10).
     Collapsed to one value (the drift this system removes). If you want the
     wp-block-button to stay pure #000, split it back out into its own var. */
  --c-ink:        #111111;
  --c-ink-soft:   #464646;  /* Mailchimp's interactive gray (hover/focus) */

  --c-gray-700:   #555555;
  --c-gray-500:   #333333;
  --c-gray-400:   #aaaaaa;
  --c-gray-300:   #cccccc;
  --c-gray-200:   #e5e5e5;
  --c-white:      #ffffff;

  --c-accent:     #29abe2;  /* Gravity's interactive blue (hover/focus) */

  --ff-display:   "Bourton", sans-serif;
}

/* ==========================================================================
   TIER 2 — SEMANTIC  (shared; do not edit per site)
   ========================================================================== */
:root {
  --color-ink:          var(--c-ink);          /* text, button backgrounds */
  --color-ink-soft:     var(--c-ink-soft);
  --color-on-ink:       var(--c-white);         /* text on dark */
  --color-text-muted:   var(--c-gray-700);
  --color-text-subtle:  var(--c-gray-400);      /* placeholders, nav labels */
  --color-counter:      var(--c-gray-500);
  --color-accent:       var(--c-accent);
  --color-border:       var(--c-gray-300);      /* input + circle borders */
  --color-border-light: var(--c-gray-200);      /* list separators */

  --font-display: var(--ff-display);

  --tracking-caps:   0.15em;  /* buttons, submits, slider heading */
  --tracking-wide:   0.1em;   /* nav items */
  --tracking-slight: 0.05em;  /* slider description */

  --focus-ring: 2px solid var(--color-accent);
  --focus-offset: 2px;
}

/* ==========================================================================
   ELEMENTOR ALIASING — INTENTIONALLY OFF on this live site.
   millgroup's Site Settings globals are already configured and already
   consumed in style.css (.elementor-swiper-button uses --e-global-color-primary).
   Overriding them blindly would re-skin existing widgets. Before turning this
   on: read your current global hexes (Site Settings > Global Colors, or view
   page source for the --e-global-color-* values), confirm they match the
   tokens, THEN uncomment. After enabling, run Elementor > Tools > Regenerate
   CSS & Data.

   :root {
     --e-global-color-primary: var(--color-ink);
     --e-global-color-text:    var(--color-ink);
   }
   ========================================================================== */

/* ==========================================================================
   ACCESSIBILITY BASELINE
   ========================================================================== */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
  outline: var(--focus-ring);
  outline-offset: var(--focus-offset);
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .001ms !important;
    transition-duration: .001ms !important;
  }
}