/* =============================================================
   BC HOME SERVICE — AURORA v15 DESIGN LAYER (css/v15.css)
   ---------------------------------------------------------------
   "Premium Canadian trades brand — Linear/Stripe-level polish."
   Dark navy depth, cyan/teal energy, orange warmth. Glassmorphism
   + soft depth, generous radii, Inter, tasteful 0.4-0.7s motion
   on cubic-bezier(0.22, 1, 0.36, 1).

   100% ADDITIVE: every rule is namespaced with .v15-* classes,
   [data-v15-*] attributes or :root --v15-* custom properties.
   Existing layers (main.css, modern.css, v10.css, hero-v9.css,
   bc-v9.css, home-overrides.css, v5-fixes.css) are never removed
   or re-laid-out — v15 only layers polish on top.

   MOTION SAFETY: every animation/transitions uses transform,
   opacity, filter or clip-path ONLY. No width/height/top/left/
   margin animation anywhere. prefers-reduced-motion kills ALL
   v15 motion. Mobile (<=767px) / (hover:none) kill the heavy
   effects and keep the cheap ones (reveals, marquee, counters).
   ============================================================= */

/* ===================== 0. DESIGN TOKENS ===================== */
:root {
  /* brand */
  --v15-navy: #0a1628;
  --v15-navy-2: #0d1f3c;
  --v15-navy-3: #16294a;
  --v15-blue: #2e86de;
  --v15-blue-2: #4a9ae8;
  --v15-cyan: #00b4d8;
  --v15-cyan-2: #48cae4;
  --v15-orange: #ff6b35;
  --v15-orange-2: #ff8c42;
  --v15-white: #ffffff;

  /* motion */
  --v15-ease: cubic-bezier(0.22, 1, 0.36, 1);
  --v15-ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --v15-dur-fast: 0.4s;
  --v15-dur: 0.55s;
  --v15-dur-slow: 0.7s;

  /* geometry */
  --v15-r-sm: 12px;
  --v15-r: 18px;
  --v15-r-lg: 22px;

  /* glass surfaces */
  --v15-glass-bg: rgba(255, 255, 255, 0.66);
  --v15-glass-bg-strong: rgba(255, 255, 255, 0.82);
  --v15-glass-bg-dark: rgba(10, 22, 40, 0.55);
  --v15-glass-border: rgba(255, 255, 255, 0.6);
  --v15-glass-border-soft: rgba(46, 134, 222, 0.18);
  --v15-glass-blur: 16px;

  /* gradients */
  --v15-grad-brand: linear-gradient(135deg, #2e86de 0%, #00b4d8 100%);
  --v15-grad-warm: linear-gradient(135deg, #ff6b35 0%, #ff8c42 100%);
  --v15-grad-deep: linear-gradient(135deg, #0a1628 0%, #1e3a5f 55%, #2e86de 100%);
  --v15-grad-text: linear-gradient(100deg, #2e86de 0%, #00b4d8 55%, #48cae4 100%);

  /* depth */
  --v15-shadow-sm: 0 2px 10px rgba(10, 22, 40, 0.07), 0 1px 3px rgba(10, 22, 40, 0.05);
  --v15-shadow-md: 0 10px 34px -8px rgba(10, 22, 40, 0.16), 0 3px 10px rgba(10, 22, 40, 0.06);
  --v15-shadow-lg: 0 26px 70px -16px rgba(10, 22, 40, 0.28), 0 10px 28px rgba(10, 22, 40, 0.10);
  --v15-glow-blue: 0 0 44px -10px rgba(0, 180, 216, 0.5);
  --v15-glow-orange: 0 0 40px -10px rgba(255, 107, 53, 0.45);

  /* ring width used by the beam border */
  --v15-beam-ring: 1.5px;
}

/* Registered custom property so the conic "beam" angle can be
   interpolated. Browsers without @property get a static ring. */
@property --v15-angle {
  syntax: "<angle>";
  inherits: false;
  initial-value: 0deg;
}

/* ===================== 1. SCROLL PROGRESS POLISH =====================
   v10.js / modern.js / main.js already BUILD the progress bars
   (.v10-progress, .m-progress, .scroll-progress). v15 never adds
   a fourth bar — it only re-skins whichever one is on the page so
   all three read as one continuous aurora ribbon. */
.v10-progress-fill,
.m-progress-track {
  background: linear-gradient(
    90deg,
    #2e86de 0%,
    #00b4d8 38%,
    #48cae4 55%,
    #ff8c42 82%,
    #ff6b35 100%
  );
  -webkit-box-shadow: 0 0 14px rgba(0, 180, 216, 0.55), 0 0 4px rgba(255, 140, 66, 0.6);
  box-shadow: 0 0 14px rgba(0, 180, 216, 0.55), 0 0 4px rgba(255, 140, 66, 0.6);
}
.scroll-progress {
  background: linear-gradient(90deg, #2e86de, #00b4d8 45%, #ff8c42);
  -webkit-box-shadow: 0 0 14px rgba(0, 180, 216, 0.5);
  box-shadow: 0 0 14px rgba(0, 180, 216, 0.5);
}

/* ===================== 2. REVEAL+ (v15-reveal) =====================
   js/v15.js assigns .v15-reveal to SAFE card selectors that no
   other reveal system has claimed ([data-reveal], [data-animate],
   [data-v10-reveal] are all left to their own engines). */
.v15-reveal {
  opacity: 0;
  -webkit-transform: translateY(16px);
  transform: translateY(16px);
  -webkit-transition:
    opacity var(--v15-dur) var(--v15-ease),
    transform var(--v15-dur) var(--v15-ease);
  transition:
    opacity var(--v15-dur) var(--v15-ease),
    transform var(--v15-dur) var(--v15-ease);
  will-change: transform, opacity;
}
.v15-reveal.v15-in {
  opacity: 1;
  -webkit-transform: none;
  transform: none;
  will-change: auto;
}
/* No-JS / late-CSS safety: never leave content hidden. */
@supports not (transform: translateY(1px)) {
  .v15-reveal { opacity: 1; -webkit-transform: none; transform: none; }
}

/* ===================== 3. GLASS CARDS ===================== */
.v15-glass {
  position: relative;
  background: var(--v15-glass-bg);
  -webkit-backdrop-filter: blur(var(--v15-glass-blur)) saturate(1.35);
  backdrop-filter: blur(var(--v15-glass-blur)) saturate(1.35);
  border: 1px solid var(--v15-glass-border);
  border-radius: var(--v15-r);
  -webkit-box-shadow: var(--v15-shadow-md), inset 0 1px 0 rgba(255, 255, 255, 0.55);
  box-shadow: var(--v15-shadow-md), inset 0 1px 0 rgba(255, 255, 255, 0.55);
  -webkit-transition:
    -webkit-box-shadow var(--v15-dur) var(--v15-ease),
    -webkit-transform var(--v15-dur) var(--v15-ease);
  transition:
    box-shadow var(--v15-dur) var(--v15-ease),
    transform var(--v15-dur) var(--v15-ease);
}
/* subtle inner aurora glow, top-left cyan / bottom-right orange */
.v15-glass::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  background:
    radial-gradient(220px 130px at 12% -8%, rgba(0, 180, 216, 0.10), transparent 70%),
    radial-gradient(240px 150px at 105% 115%, rgba(255, 107, 53, 0.07), transparent 70%);
  opacity: 0.9;
}
.v15-glass:hover {
  -webkit-transform: translateY(-3px);
  transform: translateY(-3px);
  -webkit-box-shadow: var(--v15-shadow-lg), inset 0 1px 0 rgba(255, 255, 255, 0.65);
  box-shadow: var(--v15-shadow-lg), inset 0 1px 0 rgba(255, 255, 255, 0.65);
}

/* ===================== 4. GRADIENT-BORDER GLOW CARD =====================
   .v15-glow-card — card with an animated conic "beam" travelling
   around a gradient border ring.

   How it works (GPU-safe):
   - ::before paints a conic-gradient ring via mask-composite
     (ring only, the centre is masked out).
   - The beam rotates by interpolating the registered custom
     property --v15-angle. This never triggers layout — the ring
     is repainted in place, and the animation only runs WHILE
     HOVERED, so idle cost is zero.
   - .v15-glow-layer is the cursor-tracking radial glow span that
     js/v15.js appends (used for enhanced cards whose ::before /
     ::after pseudos are already taken by older layers). */
.v15-glow-card {
  position: relative;
  border-radius: var(--v15-r);
  border: 1px solid rgba(46, 134, 222, 0.16);
  -webkit-box-shadow: var(--v15-shadow-md);
  box-shadow: var(--v15-shadow-md);
  -webkit-transition:
    -webkit-box-shadow var(--v15-dur) var(--v15-ease),
    -webkit-transform var(--v15-dur) var(--v15-ease);
  transition:
    box-shadow var(--v15-dur) var(--v15-ease),
    transform var(--v15-dur) var(--v15-ease);
}
.v15-glow-card::before {
  content: "";
  position: absolute;
  inset: calc(-1 * var(--v15-beam-ring));
  border-radius: inherit;
  padding: var(--v15-beam-ring);
  background: conic-gradient(
    from var(--v15-angle),
    rgba(46, 134, 222, 0.0) 0deg,
    rgba(46, 134, 222, 0.55) 40deg,
    rgba(0, 180, 216, 0.95) 110deg,
    rgba(72, 202, 228, 0.65) 170deg,
    rgba(255, 107, 53, 0.85) 235deg,
    rgba(255, 140, 66, 0.4) 285deg,
    rgba(46, 134, 222, 0.0) 360deg
  );
  -webkit-mask:
    linear-gradient(#000 0 0) content-box,
    linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask:
    linear-gradient(#000 0 0) content-box,
    linear-gradient(#000 0 0);
  mask-composite: exclude;
  pointer-events: none;
  opacity: 0;
  -webkit-transition: opacity var(--v15-dur-fast) var(--v15-ease);
  transition: opacity var(--v15-dur-fast) var(--v15-ease);
}
/* static ring fallback for browsers without mask-composite */
@supports not ((-webkit-mask-composite: xor) or (mask-composite: exclude)) {
  .v15-glow-card::before {
    inset: -1px;
    padding: 0;
    background: linear-gradient(135deg, rgba(0, 180, 216, 0.6), rgba(255, 107, 53, 0.45));
    -webkit-mask: none;
    mask: none;
    opacity: 0;
    z-index: 0;
  }
  .v15-glow-card > * { position: relative; z-index: 1; }
}
.v15-glow-card:hover {
  -webkit-transform: translateY(-4px);
  transform: translateY(-4px);
  -webkit-box-shadow: var(--v15-shadow-lg), var(--v15-glow-blue);
  box-shadow: var(--v15-shadow-lg), var(--v15-glow-blue);
}
.v15-glow-card:hover::before {
  opacity: 1;
  -webkit-animation: v15BeamSpin 3.6s linear infinite;
  animation: v15BeamSpin 3.6s linear infinite;
}
@keyframes v15BeamSpin {
  to { --v15-angle: 360deg; }
}

/* cursor-tracking radial glow (positions fed by js/v15.js as
   --v15-mx / --v15-my percentages on the card element) */
.v15-glow-layer {
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  z-index: 0;
  opacity: 0;
  background: radial-gradient(
    260px circle at var(--v15-mx, 50%) var(--v15-my, 50%),
    rgba(0, 180, 216, 0.16),
    rgba(46, 134, 222, 0.07) 45%,
    transparent 68%
  );
  -webkit-transition: opacity var(--v15-dur-fast) var(--v15-ease);
  transition: opacity var(--v15-dur-fast) var(--v15-ease);
}
.v15-glow-host { position: relative; }
.v15-glow-host:hover .v15-glow-layer,
.v15-glow-card:hover .v15-glow-layer { opacity: 1; }
.v15-glow-card > * { position: relative; z-index: 1; }

/* ===================== 5. SECTION EYEBROW CHIPS ===================== */
.v15-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 7px 16px 7px 12px;
  border-radius: 999px;
  background: rgba(46, 134, 222, 0.08);
  border: 1px solid rgba(46, 134, 222, 0.22);
  color: var(--v15-blue);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  line-height: 1;
  white-space: nowrap;
}
.v15-eyebrow::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--v15-grad-brand);
  -webkit-box-shadow: 0 0 0 3px rgba(0, 180, 216, 0.18), 0 0 10px rgba(0, 180, 216, 0.65);
  box-shadow: 0 0 0 3px rgba(0, 180, 216, 0.18), 0 0 10px rgba(0, 180, 216, 0.65);
  -webkit-animation: v15DotPulse 2.6s var(--v15-ease-in-out) infinite;
  animation: v15DotPulse 2.6s var(--v15-ease-in-out) infinite;
}
@keyframes v15DotPulse {
  0%, 100% { -webkit-transform: scale(1); transform: scale(1); opacity: 1; }
  50% { -webkit-transform: scale(0.82); transform: scale(0.82); opacity: 0.75; }
}
/* warm variant */
.v15-eyebrow.v15-eyebrow-warm {
  background: rgba(255, 107, 53, 0.09);
  border-color: rgba(255, 107, 53, 0.26);
  color: #d4531d;
}
.v15-eyebrow.v15-eyebrow-warm::before {
  background: var(--v15-grad-warm);
  -webkit-box-shadow: 0 0 0 3px rgba(255, 107, 53, 0.16), 0 0 10px rgba(255, 107, 53, 0.6);
  box-shadow: 0 0 0 3px rgba(255, 107, 53, 0.16), 0 0 10px rgba(255, 107, 53, 0.6);
}

/* ===================== 6. HEADLINE UNDERLINE SWEEP ===================== */
.v15-underline {
  position: relative;
  display: inline-block;
}
.v15-underline::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -0.18em;
  height: 3px;
  border-radius: 99px;
  background: var(--v15-grad-brand);
  -webkit-transform: scaleX(0);
  transform: scaleX(0);
  -webkit-transform-origin: 0 50%;
  transform-origin: 0 50%;
  -webkit-transition: -webkit-transform 0.7s var(--v15-ease) 0.15s;
  transition: transform 0.7s var(--v15-ease) 0.15s;
}
/* sweep in when the element (or its [data-reveal] ancestor) lands */
.v15-underline.v15-in::after,
.v15-underline.m-in::after,
.v15-underline.v10-in::after,
.m-in .v15-underline::after,
.v10-in .v15-underline::after,
.in-view .v15-underline::after {
  -webkit-transform: scaleX(1);
  transform: scaleX(1);
}
/* warm variant */
.v15-underline.v15-underline-warm::after { background: var(--v15-grad-warm); }

/* ===================== 7. TRUST MARQUEE STRIP =====================
   js/v15.js duplicates the track content once and sets
   data-clone="1" — only then does the seamless loop run, so a
   no-JS visit shows a static (never gappy) strip. */
.v15-marquee {
  position: relative;
  overflow: hidden;
  background: var(--v15-navy);
  border-top: 1px solid rgba(255, 255, 255, 0.06);
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
  min-height: 44px;
  display: flex;
  align-items: center;
}
.v15-marquee::before,
.v15-marquee::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  width: 90px;
  z-index: 2;
  pointer-events: none;
}
.v15-marquee::before {
  left: 0;
  background: linear-gradient(90deg, var(--v15-navy), transparent);
}
.v15-marquee::after {
  right: 0;
  background: linear-gradient(270deg, var(--v15-navy), transparent);
}
.v15-marquee-track {
  display: flex;
  align-items: center;
  gap: 44px;
  width: max-content;
  padding: 11px 0;
  will-change: transform;
}
.v15-marquee-item {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: rgba(255, 255, 255, 0.86);
  font-size: 0.86rem;
  font-weight: 600;
  letter-spacing: 0.01em;
  white-space: nowrap;
}
.v15-marquee-item svg {
  color: var(--v15-cyan);
  -webkit-flex: 0 0 auto;
  flex: 0 0 auto;
}
.v15-marquee[data-clone="1"] .v15-marquee-track {
  -webkit-animation: v15Marquee 46s linear infinite;
  animation: v15Marquee 46s linear infinite;
}
.v15-marquee[data-clone="1"]:hover .v15-marquee-track,
.v15-marquee[data-clone="1"]:focus-within .v15-marquee-track {
  -webkit-animation-play-state: paused;
  animation-play-state: paused;
}
@keyframes v15Marquee {
  from { -webkit-transform: translateX(0); transform: translateX(0); }
  to { -webkit-transform: translateX(-50%); transform: translateX(-50%); }
}

/* ===================== 8. BUTTONS ===================== */
.v15-btn {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 13px 26px;
  border-radius: 14px;
  border: none;
  cursor: pointer;
  font-family: inherit;
  font-size: 0.95rem;
  font-weight: 700;
  letter-spacing: 0.01em;
  color: #fff;
  background: var(--v15-grad-brand);
  -webkit-box-shadow: 0 10px 26px -8px rgba(0, 180, 216, 0.55);
  box-shadow: 0 10px 26px -8px rgba(0, 180, 216, 0.55);
  -webkit-transition:
    -webkit-box-shadow var(--v15-dur-fast) var(--v15-ease),
    -webkit-transform 0.18s var(--v15-ease);
  transition:
    box-shadow var(--v15-dur-fast) var(--v15-ease),
    transform 0.18s var(--v15-ease);
  text-decoration: none;
}
/* gradient shine pass (pure transform, on a masked overlay) */
.v15-btn::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: -70%;
  width: 45%;
  z-index: 1;
  background: linear-gradient(
    100deg,
    transparent 0%,
    rgba(255, 255, 255, 0.38) 50%,
    transparent 100%
  );
  -webkit-transform: skewX(-18deg) translateX(0);
  transform: skewX(-18deg) translateX(0);
  pointer-events: none;
}
.v15-btn:hover::before {
  -webkit-animation: v15ShinePass 0.85s var(--v15-ease);
  animation: v15ShinePass 0.85s var(--v15-ease);
}
@keyframes v15ShinePass {
  from { -webkit-transform: skewX(-18deg) translateX(0); transform: skewX(-18deg) translateX(0); }
  to { -webkit-transform: skewX(-18deg) translateX(320%); transform: skewX(-18deg) translateX(320%); }
}
.v15-btn:hover {
  -webkit-box-shadow: 0 16px 38px -8px rgba(0, 180, 216, 0.7);
  box-shadow: 0 16px 38px -8px rgba(0, 180, 216, 0.7);
}
.v15-btn:active {
  -webkit-transform: scale(0.97);
  transform: scale(0.97);
}
.v15-btn > * { position: relative; z-index: 2; }
.v15-btn.v15-btn-warm { background: var(--v15-grad-warm); }
.v15-btn.v15-btn-ghost {
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.28);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  -webkit-box-shadow: none;
  box-shadow: none;
}
/* press-scale for the site's classic buttons when v15 is active */
.v15-press:active {
  -webkit-transform: scale(0.97);
  transform: scale(0.97);
}

/* ===================== 9. STAT CARDS ===================== */
.v15-stat {
  position: relative;
  overflow: hidden;
  padding: 26px 24px 22px;
  border-radius: var(--v15-r);
  background: var(--v15-glass-bg-strong);
  border: 1px solid var(--v15-glass-border-soft);
  -webkit-box-shadow: var(--v15-shadow-sm);
  box-shadow: var(--v15-shadow-sm);
  -webkit-transition:
    -webkit-box-shadow var(--v15-dur) var(--v15-ease),
    -webkit-transform var(--v15-dur) var(--v15-ease);
  transition:
    box-shadow var(--v15-dur) var(--v15-ease),
    transform var(--v15-dur) var(--v15-ease);
}
/* top accent bar */
.v15-stat::before {
  content: "";
  position: absolute;
  top: 0;
  left: 14px;
  right: 14px;
  height: 3px;
  border-radius: 0 0 99px 99px;
  background: var(--v15-grad-brand);
  opacity: 0.85;
}
.v15-stat.v15-stat-warm::before { background: var(--v15-grad-warm); }
.v15-stat:hover {
  -webkit-transform: translateY(-3px);
  transform: translateY(-3px);
  -webkit-box-shadow: var(--v15-shadow-md);
  box-shadow: var(--v15-shadow-md);
}
.v15-stat-num {
  display: block;
  font-size: clamp(2rem, 4vw, 2.7rem);
  font-weight: 800;
  letter-spacing: -0.03em;
  line-height: 1.05;
  background: var(--v15-grad-text);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
  font-variant-numeric: tabular-nums;
}
.v15-stat.v15-stat-warm .v15-stat-num {
  background: linear-gradient(100deg, #ff6b35 0%, #ff8c42 60%, #ffb26b 100%);
  -webkit-background-clip: text;
  background-clip: text;
}
.v15-stat-label {
  display: block;
  margin-top: 6px;
  font-size: 0.86rem;
  font-weight: 600;
  color: #4a5568;
  letter-spacing: 0.01em;
}

/* ===================== 10. NAV ENHANCEMENTS =====================
   js/v15.js tags the static .nav with .v15-nav-links (animated
   underlines) and .v15-nav-scrolled (glass shrink after 24px).
   The React homepage nav (no .nav class) is never touched. */
.nav.v15-nav-links .nav-menu > a {
  position: relative;
}
.nav.v15-nav-links .nav-menu > a::after {
  content: "";
  position: absolute;
  left: 14px;
  right: 14px;
  bottom: 2px;
  height: 2px;
  border-radius: 99px;
  background: var(--v15-grad-brand);
  -webkit-transform: scaleX(0);
  transform: scaleX(0);
  -webkit-transform-origin: 50% 50%;
  transform-origin: 50% 50%;
  -webkit-transition: -webkit-transform var(--v15-dur-fast) var(--v15-ease);
  transition: transform var(--v15-dur-fast) var(--v15-ease);
  pointer-events: none;
}
.nav.v15-nav-links .nav-menu > a:hover::after,
.nav.v15-nav-links .nav-menu > a:focus-visible::after {
  -webkit-transform: scaleX(1);
  transform: scaleX(1);
}
/* scrolled glass state (paint-only: bg + shadow + blur) */
.nav.v15-nav-scrolled {
  background: rgba(255, 255, 255, 0.86);
  -webkit-backdrop-filter: blur(14px) saturate(1.4);
  backdrop-filter: blur(14px) saturate(1.4);
  border-bottom: 1px solid rgba(10, 22, 40, 0.07);
  -webkit-box-shadow: 0 10px 34px -14px rgba(10, 22, 40, 0.22);
  box-shadow: 0 10px 34px -14px rgba(10, 22, 40, 0.22);
}
[data-theme="dark"] .nav.v15-nav-scrolled {
  background: rgba(10, 22, 40, 0.82);
  border-bottom-color: rgba(255, 255, 255, 0.08);
}

/* ===================== 11. SCROLLBAR / SELECTION / FOCUS ===================== */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: #eef2f7; }
::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #2e86de, #00b4d8);
  border-radius: 99px;
  border: 2px solid #eef2f7;
}
::-webkit-scrollbar-thumb:hover { background: linear-gradient(180deg, #1e5fae, #0098b8); }
::-webkit-scrollbar-corner { background: #eef2f7; }
@supports (scrollbar-color: auto) {
  html {
    scrollbar-color: #2e86de #eef2f7;
    scrollbar-width: thin;
  }
}
[data-theme="dark"] ::-webkit-scrollbar-track { background: #0a1628; }
[data-theme="dark"] ::-webkit-scrollbar-thumb { border-color: #0a1628; }
@supports (scrollbar-color: auto) {
  [data-theme="dark"] html,
  html[data-theme="dark"] { scrollbar-color: #00b4d8 #0a1628; }
}

::selection {
  background: rgba(0, 180, 216, 0.28);
  color: var(--v15-navy);
}
[data-theme="dark"] ::selection {
  background: rgba(0, 180, 216, 0.4);
  color: #fff;
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible,
[tabindex]:focus-visible {
  outline: 2px solid var(--v15-cyan);
  outline-offset: 2px;
  border-radius: 6px;
}

/* ===================== 12. SKELETON SHIMMER ===================== */
.v15-skeleton {
  position: relative;
  overflow: hidden;
  border-radius: var(--v15-r-sm);
  background: rgba(10, 22, 40, 0.06);
}
.v15-skeleton::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    100deg,
    transparent 20%,
    rgba(255, 255, 255, 0.65) 50%,
    transparent 80%
  );
  -webkit-transform: translateX(-100%);
  transform: translateX(-100%);
  -webkit-animation: v15SkeletonSweep 1.5s var(--v15-ease-in-out) infinite;
  animation: v15SkeletonSweep 1.5s var(--v15-ease-in-out) infinite;
}
@keyframes v15SkeletonSweep {
  from { -webkit-transform: translateX(-100%); transform: translateX(-100%); }
  to { -webkit-transform: translateX(100%); transform: translateX(100%); }
}
.v15-skeleton--text { height: 0.9em; border-radius: 6px; margin: 0.35em 0; }
.v15-skeleton--title { height: 1.6em; border-radius: 8px; margin: 0.4em 0; }
.v15-skeleton--avatar { width: 52px; height: 52px; border-radius: 50%; }
.v15-skeleton--card { height: 180px; border-radius: var(--v15-r); }

/* ===================== 13. SEASONAL BANNER =====================
   Slim gradient strip injected by js/v15.js under .topbar on
   internal pages. Entrance = transform + opacity only. */
.v15-seasonal {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 40px;
  padding: 7px 44px 7px 14px;
  background:
    linear-gradient(90deg, #0d1f3c 0%, #16294a 30%, #1e3a5f 62%, #2e86de 100%);
  color: rgba(255, 255, 255, 0.94);
  font-size: 0.82rem;
  font-weight: 600;
  letter-spacing: 0.015em;
  text-align: center;
  overflow: hidden;
  opacity: 0;
  -webkit-transform: translateY(-10px);
  transform: translateY(-10px);
  -webkit-transition:
    opacity var(--v15-dur) var(--v15-ease),
    -webkit-transform var(--v15-dur) var(--v15-ease);
  transition:
    opacity var(--v15-dur) var(--v15-ease),
    transform var(--v15-dur) var(--v15-ease);
}
.v15-seasonal.v15-seasonal-in {
  opacity: 1;
  -webkit-transform: none;
  transform: none;
}
/* drifting aurora sheen across the strip (transform-only) */
.v15-seasonal::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: -60%;
  width: 36%;
  background: linear-gradient(
    100deg,
    transparent 0%,
    rgba(72, 202, 228, 0.16) 50%,
    transparent 100%
  );
  -webkit-transform: translateX(0);
  transform: translateX(0);
  -webkit-animation: v15SeasonalSheen 5.5s var(--v15-ease-in-out) infinite;
  animation: v15SeasonalSheen 5.5s var(--v15-ease-in-out) infinite;
  pointer-events: none;
}
@keyframes v15SeasonalSheen {
  0% { -webkit-transform: translateX(0); transform: translateX(0); }
  55%, 100% { -webkit-transform: translateX(430%); transform: translateX(430%); }
}
.v15-seasonal-icon {
  display: inline-flex;
  -webkit-flex: 0 0 auto;
  flex: 0 0 auto;
  color: var(--v15-cyan-2);
}
.v15-seasonal-text { display: inline-block; }
.v15-seasonal-text strong { color: #fff; font-weight: 800; }
.v15-seasonal-cta {
  position: relative;
  overflow: hidden;
  color: #fff;
  font-weight: 800;
  text-decoration: none;
  border-bottom: 1px dashed rgba(255, 255, 255, 0.45);
  padding-bottom: 1px;
  white-space: nowrap;
  -webkit-transition: border-color var(--v15-dur-fast) var(--v15-ease);
  transition: border-color var(--v15-dur-fast) var(--v15-ease);
}
.v15-seasonal-cta:hover { border-bottom-color: #fff; }
.v15-seasonal-close {
  position: absolute;
  right: 8px;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border: none;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.1);
  color: rgba(255, 255, 255, 0.85);
  cursor: pointer;
  -webkit-transition:
    background var(--v15-dur-fast) var(--v15-ease),
    -webkit-transform var(--v15-dur-fast) var(--v15-ease);
  transition:
    background var(--v15-dur-fast) var(--v15-ease),
    transform var(--v15-dur-fast) var(--v15-ease);
}
.v15-seasonal-close:hover {
  background: rgba(255, 255, 255, 0.22);
  -webkit-transform: translateY(-50%) scale(1.06);
  transform: translateY(-50%) scale(1.06);
}
.v15-seasonal-close:active {
  -webkit-transform: translateY(-50%) scale(0.94);
  transform: translateY(-50%) scale(0.94);
}
.v15-seasonal-hidden { display: none; }
@media (max-width: 640px) {
  .v15-seasonal { font-size: 0.76rem; padding-right: 40px; }
  .v15-seasonal-text { max-width: 66vw; }
}

/* ===================== 14. WIDGETS (REBATE + FINANCING) ===================== */
.v15-widget {
  position: relative;
  border-radius: var(--v15-r-lg);
  padding: 26px 24px 22px;
  color: #fff;
  background:
    radial-gradient(420px 240px at 8% -10%, rgba(0, 180, 216, 0.28), transparent 62%),
    radial-gradient(380px 240px at 108% 112%, rgba(255, 107, 53, 0.20), transparent 60%),
    linear-gradient(150deg, #0a1628 0%, #0d1f3c 52%, #16294a 100%);
  border: 1px solid rgba(255, 255, 255, 0.12);
  -webkit-box-shadow: var(--v15-shadow-lg);
  box-shadow: var(--v15-shadow-lg);
  overflow: hidden;
  font-size: 0.95rem;
}
.v15-widget-head {
  display: flex;
  align-items: center;
  gap: 11px;
  margin-bottom: 4px;
}
.v15-widget-head svg { color: var(--v15-cyan); -webkit-flex: 0 0 auto; flex: 0 0 auto; }
.v15-widget-title {
  font-size: 1.06rem;
  font-weight: 800;
  letter-spacing: -0.01em;
  color: #fff;
}
.v15-widget-sub {
  margin: 0 0 16px;
  font-size: 0.8rem;
  color: rgba(255, 255, 255, 0.62);
  font-weight: 500;
}
.v15-widget label {
  display: block;
  margin: 12px 0 6px;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.55);
}
.v15-widget select,
.v15-widget input[type="number"] {
  width: 100%;
  padding: 11px 13px;
  border-radius: var(--v15-r-sm);
  border: 1px solid rgba(255, 255, 255, 0.16);
  background: rgba(255, 255, 255, 0.07);
  color: #fff;
  font-family: inherit;
  font-size: 0.92rem;
  font-weight: 600;
  -webkit-transition: border-color var(--v15-dur-fast) var(--v15-ease), background var(--v15-dur-fast) var(--v15-ease);
  transition: border-color var(--v15-dur-fast) var(--v15-ease), background var(--v15-dur-fast) var(--v15-ease);
}
.v15-widget select:focus,
.v15-widget input[type="number"]:focus {
  outline: none;
  border-color: var(--v15-cyan);
  background: rgba(255, 255, 255, 0.1);
}
.v15-widget select option { color: #0a1628; background: #fff; }
/* income-qualified toggle */
.v15-widget-toggle {
  display: flex;
  align-items: center;
  gap: 11px;
  margin-top: 14px;
  padding: 11px 13px;
  border-radius: var(--v15-r-sm);
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.1);
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.v15-widget-toggle input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.v15-toggle-track {
  -webkit-flex: 0 0 auto;
  flex: 0 0 auto;
  width: 40px;
  height: 22px;
  border-radius: 99px;
  background: rgba(255, 255, 255, 0.16);
  position: relative;
  -webkit-transition: background var(--v15-dur-fast) var(--v15-ease);
  transition: background var(--v15-dur-fast) var(--v15-ease);
}
.v15-toggle-track::after {
  content: "";
  position: absolute;
  top: 3px;
  left: 3px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: #fff;
  -webkit-transition: -webkit-transform var(--v15-dur-fast) var(--v15-ease);
  transition: transform var(--v15-dur-fast) var(--v15-ease);
  -webkit-box-shadow: 0 1px 4px rgba(10, 22, 40, 0.4);
  box-shadow: 0 1px 4px rgba(10, 22, 40, 0.4);
}
.v15-widget-toggle input:checked + .v15-toggle-track { background: var(--v15-grad-brand); }
.v15-widget-toggle input:checked + .v15-toggle-track::after {
  -webkit-transform: translateX(18px);
  transform: translateX(18px);
}
.v15-widget-toggle input:focus-visible + .v15-toggle-track {
  outline: 2px solid var(--v15-cyan);
  outline-offset: 2px;
}
.v15-toggle-copy { font-size: 0.84rem; font-weight: 600; color: rgba(255, 255, 255, 0.88); }
.v15-toggle-copy small { display: block; font-weight: 500; color: rgba(255, 255, 255, 0.5); font-size: 0.72rem; margin-top: 2px; }
/* range slider */
.v15-widget input[type="range"] {
  -webkit-appearance: none;
  appearance: none;
  width: 100%;
  height: 6px;
  margin: 12px 0 6px;
  border-radius: 99px;
  background: rgba(255, 255, 255, 0.14);
  cursor: pointer;
}
.v15-widget input[type="range"]::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: var(--v15-grad-brand);
  border: 3px solid #fff;
  -webkit-box-shadow: 0 3px 12px rgba(0, 180, 216, 0.6);
  box-shadow: 0 3px 12px rgba(0, 180, 216, 0.6);
}
.v15-widget input[type="range"]::-moz-range-thumb {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #00b4d8;
  border: 3px solid #fff;
  box-shadow: 0 3px 12px rgba(0, 180, 216, 0.6);
}
.v15-widget input[type="range"]:focus-visible {
  outline: 2px solid var(--v15-cyan);
  outline-offset: 4px;
}
.v15-range-row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
}
.v15-range-value {
  font-size: 1.22rem;
  font-weight: 800;
  color: #fff;
  font-variant-numeric: tabular-nums;
}
/* term segmented control */
.v15-seg {
  display: flex;
  gap: 6px;
  margin-top: 6px;
}
.v15-seg button {
  -webkit-flex: 1 1 0;
  flex: 1 1 0;
  padding: 9px 4px;
  border-radius: 10px;
  border: 1px solid rgba(255, 255, 255, 0.16);
  background: rgba(255, 255, 255, 0.05);
  color: rgba(255, 255, 255, 0.72);
  overflow: hidden;
  font-family: inherit;
  font-size: 0.82rem;
  font-weight: 700;
  cursor: pointer;
  -webkit-transition:
    background var(--v15-dur-fast) var(--v15-ease),
    color var(--v15-dur-fast) var(--v15-ease),
    border-color var(--v15-dur-fast) var(--v15-ease),
    -webkit-transform 0.18s var(--v15-ease);
  transition:
    background var(--v15-dur-fast) var(--v15-ease),
    color var(--v15-dur-fast) var(--v15-ease),
    border-color var(--v15-dur-fast) var(--v15-ease),
    transform 0.18s var(--v15-ease);
}
.v15-seg button:hover { background: rgba(255, 255, 255, 0.1); color: #fff; }
.v15-seg button:active { -webkit-transform: scale(0.96); transform: scale(0.96); }
.v15-seg button[aria-pressed="true"] {
  background: var(--v15-grad-brand);
  border-color: transparent;
  color: #fff;
  -webkit-box-shadow: 0 6px 18px -6px rgba(0, 180, 216, 0.6);
  box-shadow: 0 6px 18px -6px rgba(0, 180, 216, 0.6);
}
/* result panel */
.v15-widget-result {
  margin-top: 16px;
  padding: 16px 16px 14px;
  border-radius: var(--v15-r);
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(0, 180, 216, 0.3);
  text-align: center;
}
.v15-widget-result-label {
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.55);
}
.v15-widget-result-value {
  display: block;
  margin-top: 4px;
  font-size: clamp(1.5rem, 3.4vw, 2.1rem);
  font-weight: 800;
  letter-spacing: -0.02em;
  background: linear-gradient(100deg, #48cae4, #00b4d8 45%, #ff8c42 105%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
  font-variant-numeric: tabular-nums;
  line-height: 1.15;
}
.v15-widget-note {
  display: block;
  margin-top: 10px;
  font-size: 0.72rem;
  line-height: 1.5;
  color: rgba(255, 255, 255, 0.5);
}
.v15-widget-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  gap: 8px;
  margin-top: 12px;
  padding: 10px 20px;
  border-radius: 12px;
  font-size: 0.86rem;
  font-weight: 800;
  color: #fff;
  text-decoration: none;
  background: var(--v15-grad-warm);
  -webkit-box-shadow: 0 10px 24px -8px rgba(255, 107, 53, 0.6);
  box-shadow: 0 10px 24px -8px rgba(255, 107, 53, 0.6);
  -webkit-transition: -webkit-box-shadow var(--v15-dur-fast) var(--v15-ease), -webkit-transform 0.18s var(--v15-ease);
  transition: box-shadow var(--v15-dur-fast) var(--v15-ease), transform 0.18s var(--v15-ease);
}
.v15-widget-cta:hover { -webkit-box-shadow: 0 14px 30px -8px rgba(255, 107, 53, 0.75); box-shadow: 0 14px 30px -8px rgba(255, 107, 53, 0.75); }
.v15-widget-cta:active { -webkit-transform: scale(0.97); transform: scale(0.97); }
.v15-widget-breakdown {
  display: flex;
  justify-content: center;
  gap: 18px;
  margin-top: 10px;
  font-size: 0.74rem;
  color: rgba(255, 255, 255, 0.55);
  font-weight: 600;
  flex-wrap: wrap;
}
.v15-widget-breakdown b { color: rgba(255, 255, 255, 0.85); }

/* ===================== 15. FOOTER BADGE CHIP + BRAND LOGO ===================== */
.v15-badge-chip {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 7px 14px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.14);
  color: rgba(255, 255, 255, 0.82);
  font-size: 0.76rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
}
.v15-badge-chip::before {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--v15-grad-warm);
  -webkit-box-shadow: 0 0 8px rgba(255, 107, 53, 0.8);
  box-shadow: 0 0 8px rgba(255, 107, 53, 0.8);
}

/* Brand logo image rules (homepage nav logo swap + any swept
   internal-page logos). !important overrides the inline height
   that js/v15.js sets on the injected <img> so the clamp + the
   <=640px rule always win. */
.brand-logo-img {
  display: block;
  height: clamp(40px, 5vw, 52px) !important;
  width: auto !important;
  -webkit-transition:
    -webkit-transform var(--v15-dur-fast) var(--v15-ease),
    height var(--v15-dur-fast) var(--v15-ease);
  transition:
    transform var(--v15-dur-fast) var(--v15-ease),
    height var(--v15-dur-fast) var(--v15-ease);
}
a:hover > .brand-logo-img,
.brand-logo-img:hover {
  -webkit-transform: scale(1.03);
  transform: scale(1.03);
}
@media (max-width: 640px) {
  .brand-logo-img { height: 40px !important; }
}
/* ---- nav-shrink accommodation ------------------------------------------
   main.css shrinks .nav from 72px to 60px once scrolled (.nav.scrolled);
   the old .logo-mark shrank 42px -> 36px in the same state. The 52px brand
   image would sit with only ~4px of breathing room there, so it shrinks
   proportionally (52/72 = 44/60 at desktop; the clamp keeps smaller
   viewports proportional too). Additive only — resting state unchanged. */
.nav.scrolled .brand-logo-img { height: clamp(36px, 4.2vw, 44px) !important; }

/* ===================== 16. LIFT POLISH (hover states) =====================
   Apply .v15-lift to before/after sliders, pricing cards, FAQ
   items, tables, form cards — a subtle translateY + shadow. */
.v15-lift {
  -webkit-transition:
    -webkit-transform var(--v15-dur) var(--v15-ease),
    -webkit-box-shadow var(--v15-dur) var(--v15-ease);
  transition:
    transform var(--v15-dur) var(--v15-ease),
    box-shadow var(--v15-dur) var(--v15-ease);
  will-change: transform;
}
.v15-lift:hover {
  -webkit-transform: translateY(-4px);
  transform: translateY(-4px);
  -webkit-box-shadow: var(--v15-shadow-lg);
  box-shadow: var(--v15-shadow-lg);
}
/* native pieces we polish directly (safe, additive): */
.m-ba,
.ba-comparison {
  -webkit-transition: -webkit-box-shadow var(--v15-dur) var(--v15-ease), -webkit-transform var(--v15-dur) var(--v15-ease);
  transition: box-shadow var(--v15-dur) var(--v15-ease), transform var(--v15-dur) var(--v15-ease);
}
.m-ba:hover,
.ba-comparison:hover {
  -webkit-transform: translateY(-4px);
  transform: translateY(-4px);
  -webkit-box-shadow: var(--v15-shadow-lg), var(--v15-glow-blue);
  box-shadow: var(--v15-shadow-lg), var(--v15-glow-blue);
}
.pricing-card.v15-lift:hover,
.quote-form-card.v15-lift:hover {
  border-color: rgba(0, 180, 216, 0.45);
}

/* ===================== 17. PARALLAX ORBS =====================
   Decorative blurred orbs driven by js/v15.js (desktop,
   hover-capable only). Position them inline in markup; v15.js
   owns the transform. */
.v15-orb {
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
  z-index: 0;
  opacity: 0.55;
  -webkit-filter: blur(46px);
  filter: blur(46px);
  will-change: transform;
}
.v15-orb-blue { background: radial-gradient(circle, rgba(46, 134, 222, 0.5), transparent 68%); }
.v15-orb-teal { background: radial-gradient(circle, rgba(0, 180, 216, 0.42), transparent 68%); }
.v15-orb-orange { background: radial-gradient(circle, rgba(255, 107, 53, 0.32), transparent 68%); }

/* ===================== 18. BACK-TO-TOP ===================== */
.v15-back-top {
  position: fixed;
  right: 20px;
  bottom: 104px; /* clears the AI chat float (bottom-right) + mobile sticky CTA */
  z-index: 9600;
  width: 46px;
  height: 46px;
  border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, 0.35);
  overflow: hidden;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  background: linear-gradient(150deg, rgba(46, 134, 222, 0.92), rgba(10, 22, 40, 0.94));
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  -webkit-box-shadow: 0 12px 30px -8px rgba(10, 22, 40, 0.55), var(--v15-glow-blue);
  box-shadow: 0 12px 30px -8px rgba(10, 22, 40, 0.55), var(--v15-glow-blue);
  cursor: pointer;
  opacity: 0;
  -webkit-transform: translateY(12px) scale(0.92);
  transform: translateY(12px) scale(0.92);
  pointer-events: none;
  -webkit-transition:
    opacity var(--v15-dur) var(--v15-ease),
    -webkit-transform var(--v15-dur) var(--v15-ease),
    -webkit-box-shadow var(--v15-dur-fast) var(--v15-ease);
  transition:
    opacity var(--v15-dur) var(--v15-ease),
    transform var(--v15-dur) var(--v15-ease),
    box-shadow var(--v15-dur-fast) var(--v15-ease);
}
.v15-back-top.v15-show {
  opacity: 1;
  -webkit-transform: none;
  transform: none;
  pointer-events: auto;
}
.v15-back-top:hover {
  -webkit-box-shadow: 0 16px 38px -8px rgba(10, 22, 40, 0.6), 0 0 54px -8px rgba(0, 180, 216, 0.7);
  box-shadow: 0 16px 38px -8px rgba(10, 22, 40, 0.6), 0 0 54px -8px rgba(0, 180, 216, 0.7);
}
.v15-back-top:active { -webkit-transform: scale(0.92); transform: scale(0.92); }
.v15-back-top svg {
  -webkit-transition: -webkit-transform var(--v15-dur-fast) var(--v15-ease);
  transition: transform var(--v15-dur-fast) var(--v15-ease);
}
.v15-back-top:hover svg { -webkit-transform: translateY(-2px); transform: translateY(-2px); }
@media (max-width: 767px) {
  .v15-back-top { bottom: 112px; right: 14px; width: 42px; height: 42px; }
}

/* ===================== 19. RIPPLE (v15-scoped) ===================== */
.v15-ripple {
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
  background: radial-gradient(circle, rgba(255, 255, 255, 0.55) 0%, rgba(255, 255, 255, 0.18) 55%, transparent 72%);
  -webkit-transform: scale(0);
  transform: scale(0);
  opacity: 0.9;
  -webkit-animation: v15Ripple 0.6s var(--v15-ease) forwards;
  animation: v15Ripple 0.6s var(--v15-ease) forwards;
  z-index: 3;
}
@keyframes v15Ripple {
  to {
    -webkit-transform: scale(2.6);
    transform: scale(2.6);
    opacity: 0;
  }
}

/* ===================== 20. PERFORMANCE (content-visibility) =====================
   Footer only — far below the fold on every page, so skipping
   its render until needed cannot cause scroll jumps. */
footer {
  content-visibility: auto;
  contain-intrinsic-size: 1px 1000px;
}

/* ===================== 21. DARK THEME ADJUSTMENTS ===================== */
[data-theme="dark"] .v15-glass {
  background: var(--v15-glass-bg-dark);
  border-color: rgba(255, 255, 255, 0.12);
  -webkit-box-shadow: 0 14px 44px -12px rgba(0, 0, 0, 0.6), inset 0 1px 0 rgba(255, 255, 255, 0.07);
  box-shadow: 0 14px 44px -12px rgba(0, 0, 0, 0.6), inset 0 1px 0 rgba(255, 255, 255, 0.07);
}
[data-theme="dark"] .v15-stat {
  background: rgba(13, 31, 60, 0.72);
  border-color: rgba(255, 255, 255, 0.1);
}
[data-theme="dark"] .v15-stat-label { color: rgba(255, 255, 255, 0.62); }
[data-theme="dark"] .v15-eyebrow {
  background: rgba(0, 180, 216, 0.12);
  border-color: rgba(0, 180, 216, 0.3);
  color: var(--v15-cyan-2);
}
[data-theme="dark"] .v15-widget {
  background:
    radial-gradient(420px 240px at 8% -10%, rgba(0, 180, 216, 0.24), transparent 62%),
    radial-gradient(380px 240px at 108% 112%, rgba(255, 107, 53, 0.18), transparent 60%),
    linear-gradient(150deg, #060d1a 0%, #0a1628 55%, #0d1f3c 100%);
}
[data-theme="dark"] .v15-glow-card {
  border-color: rgba(255, 255, 255, 0.1);
}

/* ===================== 22. MOBILE / TOUCH GUARDS =====================
   Under 768px OR no-hover: kill cursor glow, 3D tilt, parallax,
   magnetic-style hovers and the beam border spin. Keep simple
   reveals, marquee and counters (handled by js guards). */
@media (max-width: 767px), (hover: none) {
  .v15-glow-card::before {
    -webkit-animation: none;
    animation: none;
    opacity: 0 !important;
  }
  .v15-glow-card:hover { -webkit-transform: none; transform: none; }
  .v15-glow-layer { display: none; }
  .v15-orb { display: none; }
  .v15-glass:hover { -webkit-transform: none; transform: none; }
  .v15-lift:hover,
  .m-ba:hover,
  .ba-comparison:hover { -webkit-transform: none; transform: none; }
  .v15-btn:hover::before { -webkit-animation: none; animation: none; }
}

/* ===================== 23. REDUCED MOTION =====================
   ALL v15 motion off: transitions to none, animations to none,
   reveal states forced visible. */
@media (prefers-reduced-motion: reduce) {
  .v15-reveal {
    opacity: 1 !important;
    -webkit-transform: none !important;
    transform: none !important;
    -webkit-transition: none !important;
    transition: none !important;
  }
  .v15-glass,
  .v15-glow-card,
  .v15-stat,
  .v15-lift,
  .m-ba,
  .ba-comparison,
  .v15-btn,
  .v15-widget-cta,
  .v15-seg button,
  .v15-back-top,
  .brand-logo-img,
  .v15-seasonal,
  .v15-seasonal-close,
  .nav.v15-nav-links .nav-menu > a::after,
  .v15-underline::after,
  .v15-toggle-track,
  .v15-toggle-track::after {
    -webkit-transition: none !important;
    transition: none !important;
  }
  .v15-glow-card::before,
  .v15-eyebrow::before,
  .v15-skeleton::after,
  .v15-seasonal::before,
  .v15-marquee[data-clone="1"] .v15-marquee-track,
  .v15-btn::before,
  .v15-ripple,
  .v15-back-top svg {
    -webkit-animation: none !important;
    animation: none !important;
  }
  .v15-glow-card::before { opacity: 0 !important; }
  .v15-glow-layer { display: none; }
  .v15-orb { display: none; }
  .v15-seasonal { opacity: 1; -webkit-transform: none; transform: none; }
  .v15-back-top { opacity: 1; -webkit-transform: none; transform: none; }
  .v15-back-top:not(.v15-show) { pointer-events: none; }
  .v15-underline::after {
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
  }
}

/* ===================== 24. PRINT ===================== */
@media print {
  .v15-seasonal,
  .v15-marquee,
  .v15-back-top,
  .v15-orb,
  .v15-glow-layer,
  .v15-glow-card::before,
  .v10-progress,
  .m-progress,
  .scroll-progress,
  .v15-widget,
  .v15-skeleton {
    display: none !important;
  }
  .v15-reveal { opacity: 1 !important; -webkit-transform: none !important; transform: none !important; }
  footer { content-visibility: visible; contain-intrinsic-size: auto; }
  .v15-glass,
  .v15-stat {
    -webkit-box-shadow: none;
    box-shadow: none;
    background: #fff;
  }
}