/* ============================================================
   LOCAL CHAMPION — BRAND TOKENS (fallback layer)
   ------------------------------------------------------------
   This file is the STATIC fallback for the whole colour + font
   system. The live, editable values come from Local Champion →
   Design and are injected as an inline <style> right after this
   file (see lc_design_inline_css() in inc/lc-design.php), so
   anything an editor changes overrides the defaults below.

   Every value here is a token. There are no other colours in the
   theme — header, footer, blog, archives and single posts all
   read these same variables, so changing one changes everywhere.

   It also keeps the "nothing repaints on hover" rule: hover states
   keep their motion (a small lift, an image zoom) but never change
   colour.
   ============================================================ */

:root {
  /* ---- core palette ---- */
  --lc-ink:            #230904;
  --lc-page:           #230904;
  --lc-surface-solid:  #733634;
  --lc-orange:         #FF6D29;
  --lc-orange-glow:    #FF6D29;
  --lc-primary-ink:    #230904;
  --lc-mint:           #6AD799;
  --lc-success:        #6AD799;
  --lc-red:            #FF5B5B;
  --lc-danger:         #FF5B5B;
  --lc-paper:          #FFFFFF;
  --lc-text:           #FFFFFF;
  --lc-heading:        #FFFFFF;

  /* ---- rgb channels (so alpha shades track the pickers) ---- */
  --lc-text-rgb:       255, 255, 255;
  --lc-orange-rgb:     255, 109, 41;
  --lc-surface-rgb:    115, 54, 52;
  --lc-page-rgb:       35, 9, 4;
  --lc-footer-text-rgb:255, 255, 255;

  /* ---- derived ---- */
  --lc-text-muted:     rgba(var(--lc-text-rgb), 0.68);
  --lc-text-subtle:    rgba(var(--lc-text-rgb), 0.42);
  --lc-hairline:       rgba(var(--lc-text-rgb), 0.10);
  --lc-surface:        rgba(var(--lc-surface-rgb), 0.22);
  --lc-surface-high:   rgba(var(--lc-surface-rgb), 0.40);

  /* ---- footer + blog link box ---- */
  --lc-footer-bg:      #230904;
  --lc-footer-text:    #FFFFFF;
  --lc-linkbox-bg:     #230904;

  /* ---- lc-arc.css aliases ---- */
  --lc-b:  #FF6D29;
  --lc-b2: #FF6D29;
  --lc-bg: #230904;

  /* ---- fonts ---- */
  --lc-font-sans:    'PP Neue Montreal','Hanken Grotesk',system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;
  --lc-font-serif:   'Instrument Serif',Georgia,'Times New Roman',serif;
  --lc-font-mono:    'Geist Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  --lc-font-heading: var(--lc-font-sans);
}

/* ------------------------------------------------------------
   1 · SITEWIDE HOVER COLOUR LOCK
   Colour, background, border, fill, stroke and filter are removed
   from every transition, so nothing can animate a repaint. The JS
   companion (assets/js/lc-lock.js) then pins the computed colours
   inline, covering Elementor's per-element hover CSS too.
   ------------------------------------------------------------ */
a, a *, button, [role="button"],
input[type="submit"], input[type="button"],
.elementor-button, .elementor-button-link,
.lc-btn-solid, .lcarc-btn, .lcb-btn {
  transition-property: transform, box-shadow, padding, opacity !important;
}

a:hover, a:focus, a:focus-visible, a:active,
button:hover, button:focus,
[role="button"]:hover,
input[type="submit"]:hover, input[type="button"]:hover,
.elementor-button:hover, .elementor-button:focus,
.elementor-button-link:hover,
.lc-btn-solid:hover, .lcarc-btn:hover, .lcb-btn:hover {
  filter: none !important;
  -webkit-text-fill-color: currentColor !important;
  text-decoration-color: currentColor !important;
}

/* ------------------------------------------------------------
   2 · REUSABLE BUTTON ATOMS
   Used by the header, footer and 404 so every CTA in the theme
   is one of exactly two shapes.
   ------------------------------------------------------------ */
.lc-btn-solid,
.lc-btn-outline {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 44px;
  padding: 0 22px;
  border-radius: 63px;
  font-size: 0.9375rem;
  font-weight: 500;
  line-height: 1;
  white-space: nowrap;
  text-decoration: none;
  font-family: var(--lc-font-sans);
  transition: transform 180ms cubic-bezier(0.4, 0, 0.2, 1) !important;
}
.lc-btn-solid {
  background: var(--lc-orange);
  color: var(--lc-primary-ink);
  border: 1px solid var(--lc-orange);
}
.lc-btn-outline {
  background: transparent;
  color: var(--lc-paper);
  border: 1px solid var(--lc-paper);
}
.lc-btn-solid:hover,
.lc-btn-outline:hover {
  transform: translateY(-1px);
}

/* ------------------------------------------------------------
   3 · OPTIONAL ELEMENTOR PALETTE ENFORCEMENT
   Off by default. Turn it on at Local Champion → Header & Footer
   → Palette to force Elementor-built pages into these tokens too.
   ------------------------------------------------------------ */
body.lc-force-palette .elementor-button,
body.lc-force-palette .elementor-button:hover,
body.lc-force-palette .elementor-button:focus {
  background-color: var(--lc-orange) !important;
  color: var(--lc-primary-ink) !important;
  border-color: var(--lc-orange) !important;
}
body.lc-force-palette .elementor-widget-container a:hover,
body.lc-force-palette .elementor-widget-container a:focus {
  color: inherit !important;
}

@media (prefers-reduced-motion: reduce) {
  a, button, .lc-btn-solid, .lc-btn-outline {
    transition-duration: 0.001ms !important;
  }
}