/* =========================================================
   Fix It Specialists — brand layer.
   Loads AFTER design-system.css and re-skins the (LRS-derived)
   builder + landing to FIS identity: Inter,
   FIS blue + green, cooler surfaces, green→blue gradient.
   ========================================================= */

:root {
  /* Surfaces — cooler than LRS's warm cream */
  --bg: #EEF3FA;
  --bg-elev: #FFFFFF;
  --bg-soft: #F6FAFF;
  --bg-deep: #0A1326;      /* FIS navy */
  --bg-deep-2: #101B31;
  --rule: rgba(10,19,38,0.10);
  --rule-strong: rgba(10,19,38,0.20);

  /* Ink */
  --ink: #0A1326;
  --ink-2: #35425C;
  --ink-3: #6A7488;
  --ink-inv: #EEF3FA;
  --ink-inv-2: #AEB8CC;

  /* Accents — FIS blue primary, FIS green secondary */
  --accent: #2563EB;
  --accent-soft: #E1EDFF;
  --signal: #06B6D4;
  --signal-soft: #DCF4E1;
  --ok: #1E9E57;
  --ok-soft: #DCF4E1;

  /* Type — match the FIS landing pages */
  --f-sans: "Inter", "Inter", -apple-system, system-ui, sans-serif;

  /* FIS signature gradient (logo: green → blue) */
  --fis-grad: linear-gradient(120deg, #06b6d4 0%, #2563EB 100%);
}

body { font-family: var(--f-sans); }

/* Primary buttons → FIS green→blue gradient */
.btn--accent {
  background: var(--fis-grad);
  border-color: transparent;
  box-shadow: 0 8px 20px -8px rgba(12,99,245,.55);
}
.btn--accent:hover { filter: brightness(1.04); box-shadow: 0 10px 24px -8px rgba(12,99,245,.6); }

/* Inverted button (dark CTAs on light) picks up FIS navy */
.btn--inv { background: var(--bg-deep); color: #fff; }

/* Hero highlight → green→blue underline sweep */
.accent-underline {
  background: linear-gradient(180deg, transparent 60%, rgba(53,193,74,.22) 60%, rgba(12,99,245,.20) 92%, transparent 92%);
}

/* Eyebrow dot + small accents already ride var(--accent). Nudge the config
   selected-option ring toward the FIS gradient feel. */
.fis-config-option[aria-pressed="true"] {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px var(--accent-soft), 0 8px 20px -12px rgba(12,99,245,.5);
}

/* Sticky configurator topbar — FIS navy bar with gradient CTA */
.fis-config-topbar { border-bottom: 2px solid transparent; border-image: var(--fis-grad) 1; }
.fis-config-topbar__total { color: var(--accent); }

/* Final CTA band — FIS gradient wash instead of flat dark */
.fis-fcta { background: linear-gradient(120deg, #0A1326 0%, #0d2a4f 55%, #2563EB 140%); }
.fis-fcta .accent { color: #4ee06a; }

/* Behind-the-scenes cards: keep the moody gradients but tint toward brand */
.fis-bts__card .fis-bts__play { color: var(--accent); }

/* Section eyebrow chips → subtle FIS tint */
.eyebrow { color: var(--accent); }
