/* ============================================================================
   HVAC247PRO — 8K REDESIGN v1.0 (2026-07-26)
   Red-on-Blue design system. NO GOLD. Loads LAST — overrides everything.
   Palette: navy #0a1628 / red #dc3545 / white text
   Type: Poppins 800 display + Inter body
   ============================================================================ */

/* ---------- 0. TOKENS ---------- */
:root {
  --navy: #0a1628 !important;
  --navy-light: #132337 !important;
  --navy-dark: #050b14 !important;
  --navy-deep: #081226 !important;
  --red: #dc3545 !important;
  --red-light: #ef4444 !important;
  --red-dark: #b91c1c !important;
  --red-glow: rgba(220, 53, 69, .35) !important;
  --white: #ffffff !important;
  --text-hi: rgba(255,255,255,.95) !important;
  --text-mid: rgba(255,255,255,.72) !important;
  --text-low: rgba(255,255,255,.55) !important;
  --line: rgba(255,255,255,.09) !important;
  --card: rgba(255,255,255,.045) !important;
  --card-hover: rgba(255,255,255,.075) !important;
  --radius: 14px !important;
  --radius-lg: 20px !important;
  --shadow: 0 20px 50px rgba(0,0,0,.45) !important;
  --font-display: 'Poppins', 'Inter', sans-serif !important;
  --font-body: 'Inter', 'Poppins', sans-serif !important;

  /* kill bootstrap light defaults */
  --bs-body-color: rgba(255,255,255,.85) !important;
  --bs-body-bg: #0a1628 !important;
  --bs-heading-color: #ffffff !important;
  --bs-link-color: #dc3545 !important;
  --bs-link-hover-color: #ef4444 !important;
}

/* ---------- 1. BASE ---------- */
html { scroll-behavior: smooth; }
body {
  background: var(--navy) !important;
  color: var(--text-hi) !important;
  font-family: var(--font-body) !important;
  overflow-x: hidden !important;
  -webkit-font-smoothing: antialiased !important;
  line-height: 1.65 !important;
}
h1,h2,h3,h4,h5,h6 {
  color: var(--white) !important;
  font-family: var(--font-display) !important;
  font-weight: 800 !important;
  letter-spacing: -.02em !important;
  line-height: 1.15 !important;
}
p { color: var(--text-mid) !important; }
a { color: var(--red-light) !important; text-decoration: none !important; transition: color .25s ease !important; }
a:hover { color: var(--white) !important; }
::selection { background: var(--red); color: var(--white); }
img { max-width: 100%; }

/* section rhythm */
section, .section-padding { scroll-margin-top: 90px; }

/* eyebrow / sub-title */
.sub-title, .pre-title, [class*="eyebrow"] {
  color: var(--red-light) !important;
  -webkit-text-fill-color: var(--red-light) !important;
  font-family: var(--font-body) !important;
  font-weight: 700 !important;
  font-size: 13px !important;
  letter-spacing: .22em !important;
  text-transform: uppercase !important;
  background: none !important;
}

/* section titles */
.section-title h2, .section-title .title, h2.title {
  font-size: clamp(30px, 4.2vw, 46px) !important;
}

/* ============================================================================
   2. HEADER
   ============================================================================ */
.header-v2 {
  position: fixed !important;
  top: 0; left: 0; right: 0;
  z-index: 99999 !important;
  background: rgba(8, 18, 38, .88) !important;
  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
  border-bottom: 1px solid var(--line) !important;
  box-shadow: 0 8px 32px rgba(0,0,0,.35) !important;
}
.header-v2-inner {
  height: 74px !important;
  display: flex !important;
  align-items: center !important;
  gap: 20px !important;
  max-width: 1280px !important;
  margin: 0 auto !important;
  padding: 0 24px !important;
}
.header-v2-logo img { height: 46px !important; width: auto !important; filter: drop-shadow(0 2px 8px rgba(0,0,0,.4)); }
.header-v2-nav { display: flex !important; align-items: center !important; gap: 4px !important; margin-left: auto !important; }
.header-v2-nav a {
  position: relative !important;
  color: var(--text-mid) !important;
  font-weight: 600 !important;
  font-size: 15px !important;
  padding: 10px 14px !important;
  border-radius: 8px !important;
  transition: color .25s ease, background .25s ease !important;
}
.header-v2-nav a::after {
  content: '' !important;
  position: absolute !important;
  left: 14px; right: 14px; bottom: 4px !important;
  height: 2px !important;
  background: var(--red) !important;
  border-radius: 2px !important;
  transform: scaleX(0) !important;
  transform-origin: left !important;
  transition: transform .3s cubic-bezier(.22,1,.36,1) !important;
}
.header-v2-nav a:hover, .header-v2-nav a.active { color: var(--white) !important; }
.header-v2-nav a:hover::after, .header-v2-nav a.active::after { transform: scaleX(1) !important; }

.header-v2-phone {
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  background: var(--red) !important;
  color: var(--white) !important;
  font-weight: 700 !important;
  font-size: 15px !important;
  padding: 11px 20px !important;
  border-radius: 999px !important;
  box-shadow: 0 6px 20px var(--red-glow) !important;
  transition: transform .25s ease, box-shadow .25s ease, background .25s ease !important;
}
.header-v2-phone i, .header-v2-phone span { color: var(--white) !important; }
.header-v2-phone:hover {
  background: var(--red-light) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 10px 28px var(--red-glow) !important;
}
.header-v2-cta { margin-left: 8px; }

/* hamburger */
.header-v2-toggle {
  display: none !important;
  align-items: center !important;
  justify-content: center !important;
  width: 46px !important; height: 46px !important;
  background: rgba(255,255,255,.08) !important;
  border: 1px solid var(--line) !important;
  border-radius: 10px !important;
  color: var(--white) !important;
  cursor: pointer !important;
  transition: background .25s ease !important;
}
.header-v2-toggle:hover { background: var(--red) !important; }
.header-v2-toggle i, .header-v2-toggle span { color: var(--white) !important; }

/* ============================================================================
   3. MOBILE MENU
   ============================================================================ */
.mobile-nav-v2 {
  position: fixed !important;
  top: 0 !important; right: 0 !important; left: auto !important;
  width: min(340px, 88vw) !important;
  height: 100vh !important; height: 100dvh !important;
  background: var(--navy-dark) !important;
  border-left: 1px solid var(--line) !important;
  box-shadow: -24px 0 60px rgba(0,0,0,.55) !important;
  z-index: 100000 !important;
  transform: translateX(105%) !important;
  transition: transform .38s cubic-bezier(.22,1,.36,1) !important;
  overflow-y: auto !important;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}
.mobile-nav-v2.active { transform: translateX(0) !important; }
.mobile-nav-v2-header {
  display: flex !important; align-items: center !important; justify-content: space-between !important;
  padding: 18px 22px !important;
  border-bottom: 1px solid var(--line) !important;
}
.mobile-nav-v2-header img { height: 38px !important; }
.mobile-nav-v2-close {
  width: 42px !important; height: 42px !important;
  display: flex !important; align-items: center !important; justify-content: center !important;
  background: rgba(255,255,255,.08) !important;
  border: 1px solid var(--line) !important;
  border-radius: 10px !important;
  color: var(--white) !important;
  cursor: pointer !important;
  transition: background .25s ease, transform .25s ease !important;
}
.mobile-nav-v2-close:hover { background: var(--red) !important; transform: rotate(90deg) !important; }
.mobile-nav-v2-phone {
  margin: 18px 22px !important;
  display: flex !important; align-items: center !important; gap: 12px !important;
  background: var(--red) !important;
  color: var(--white) !important;
  padding: 14px 18px !important;
  border-radius: var(--radius) !important;
  font-weight: 700 !important;
  box-shadow: 0 8px 24px var(--red-glow) !important;
}
.mobile-nav-v2-phone a, .mobile-nav-v2-phone strong, .mobile-nav-v2-phone span, .mobile-nav-v2-phone i { color: var(--white) !important; }
.mobile-nav-v2-links { list-style: none !important; padding: 8px 14px !important; margin: 0 !important; }
.mobile-nav-v2-links li { margin: 2px 0 !important; }
.mobile-nav-v2-links a {
  display: flex !important; align-items: center !important; gap: 12px !important;
  color: var(--text-hi) !important;
  font-weight: 600 !important; font-size: 16px !important;
  padding: 13px 14px !important;
  border-radius: 10px !important;
  transition: background .25s ease, color .25s ease, transform .25s ease !important;
}
.mobile-nav-v2-links a i { color: var(--red-light) !important; width: 20px; text-align: center; }
.mobile-nav-v2-links a:hover { background: rgba(220,53,69,.14) !important; color: var(--white) !important; transform: translateX(4px) !important; }
.mobile-nav-v2-license {
  margin: 16px 22px !important; padding: 12px 14px !important;
  border: 1px solid var(--line) !important; border-radius: 10px !important;
  color: var(--text-low) !important; font-size: 12px !important; letter-spacing: .08em !important;
}
.mobile-nav-v2-overlay {
  position: fixed !important; inset: 0 !important;
  background: rgba(4,9,20,.6) !important;
  backdrop-filter: blur(4px) !important;
  z-index: 99999 !important;
  opacity: 0 !important; pointer-events: none !important;
  transition: opacity .35s ease !important;
}
.mobile-nav-v2-overlay.active { opacity: 1 !important; pointer-events: auto !important; }

/* ============================================================================
   4. HERO
   ============================================================================ */
.hero-redesigned, .rts-banner-area {
  position: relative !important;
  min-height: 100vh !important; min-height: 100dvh !important;
  display: flex !important; align-items: center !important;
  padding: 130px 0 90px !important;
  background:
    radial-gradient(1100px 600px at 82% 8%, rgba(220,53,69,.16), transparent 60%),
    radial-gradient(900px 520px at 8% 92%, rgba(220,53,69,.10), transparent 55%),
    linear-gradient(160deg, var(--navy-dark) 0%, var(--navy) 48%, var(--navy-deep) 100%) !important;
  overflow: hidden !important;
}
/* faint blueprint grid */
.hero-redesigned::before, .rts-banner-area::before {
  content: '' !important;
  position: absolute !important; inset: 0 !important;
  background-image:
    linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px) !important;
  background-size: 56px 56px !important;
  mask-image: radial-gradient(ellipse at 50% 40%, #000 30%, transparent 78%) !important;
  -webkit-mask-image: radial-gradient(ellipse at 50% 40%, #000 30%, transparent 78%) !important;
  pointer-events: none !important;
}
.hero-overlay { background: transparent !important; }
.hero-content-redesigned, .banner-content { position: relative !important; z-index: 2 !important; max-width: 760px !important; }

.hero-license-badge {
  display: inline-flex !important; align-items: center !important; gap: 10px !important;
  background: rgba(220,53,69,.12) !important;
  border: 1px solid rgba(220,53,69,.4) !important;
  color: var(--white) !important;
  padding: 9px 18px !important;
  border-radius: 999px !important;
  font-size: 13px !important; font-weight: 600 !important; letter-spacing: .06em !important;
  margin-bottom: 22px !important;
}
.hero-license-badge i { color: var(--red-light) !important; }

.hero-title-trust, .hero-redesigned h1, .banner-title {
  font-size: clamp(40px, 6.4vw, 72px) !important;
  font-weight: 800 !important;
  line-height: 1.04 !important;
  letter-spacing: -.03em !important;
  color: var(--white) !important;
  margin: 0 0 20px !important;
}
.hero-title-trust .accent, .hero-title-trust em, .hero-redesigned h1 .text-red,
.hero-redesigned h1 span[style*="dc3545"], .banner-title .accent {
  color: var(--red-light) !important;
  -webkit-text-fill-color: var(--red-light) !important;
  font-style: normal !important;
}
.hero-subtitle-trust, .hero-redesigned .lead, .banner-description {
  font-size: clamp(16px, 1.6vw, 19px) !important;
  color: var(--text-mid) !important;
  max-width: 620px !important;
  margin: 0 0 30px !important;
  line-height: 1.7 !important;
}

/* hero trust metrics row */
.hero-trust-metrics {
  display: flex !important; flex-wrap: wrap !important; gap: 14px 34px !important;
  margin: 0 0 34px !important;
}
.hero-trust-metrics .metric, .hero-trust-metrics > div {
  display: flex !important; align-items: baseline !important; gap: 10px !important;
}
.hero-trust-metrics strong, .hero-trust-metrics .num {
  font-family: var(--font-display) !important;
  font-size: 30px !important; font-weight: 800 !important;
  color: var(--red-light) !important;
  -webkit-text-fill-color: var(--red-light) !important;
}
.hero-trust-metrics span { font-size: 12px !important; letter-spacing: .14em !important; text-transform: uppercase !important; color: var(--text-low) !important; }

/* hero CTAs */
.hero-cta-trust { display: flex !important; flex-wrap: wrap !important; gap: 16px !important; margin-bottom: 30px !important; }
.btn-call-now, .hero-cta-trust .btn-primary, .hero-cta-trust a.rts-btn.btn-primary {
  display: inline-flex !important; align-items: center !important; gap: 12px !important;
  background: var(--red) !important;
  color: var(--white) !important;
  font-weight: 700 !important; font-size: 16px !important;
  padding: 16px 30px !important;
  border-radius: 12px !important;
  border: none !important;
  box-shadow: 0 12px 32px var(--red-glow) !important;
  transition: transform .25s ease, box-shadow .25s ease, background .25s ease !important;
}
.btn-call-now i, .hero-cta-trust .btn-primary i { color: var(--white) !important; }
.btn-call-now:hover, .hero-cta-trust .btn-primary:hover {
  background: var(--red-light) !important;
  transform: translateY(-3px) !important;
  box-shadow: 0 18px 42px var(--red-glow) !important;
  color: var(--white) !important;
}
.btn-schedule, .hero-cta-trust .btn-secondary, .hero-cta-trust a.rts-btn.btn-secondary {
  display: inline-flex !important; align-items: center !important; gap: 12px !important;
  background: rgba(255,255,255,.06) !important;
  color: var(--white) !important;
  font-weight: 700 !important; font-size: 16px !important;
  padding: 16px 30px !important;
  border-radius: 12px !important;
  border: 1px solid rgba(255,255,255,.22) !important;
  backdrop-filter: blur(8px) !important;
  transition: transform .25s ease, border-color .25s ease, background .25s ease !important;
}
.btn-schedule i, .hero-cta-trust .btn-secondary i { color: var(--red-light) !important; }
.btn-schedule:hover, .hero-cta-trust .btn-secondary:hover {
  border-color: var(--red-light) !important;
  background: rgba(220,53,69,.12) !important;
  transform: translateY(-3px) !important;
  color: var(--white) !important;
}

/* hero feature chips */
.hero-features-trust, .hero-trust-indicators { display: flex !important; flex-wrap: wrap !important; gap: 12px !important; }
.hero-features-trust .feature, .hero-trust-indicators .item, .hero-features-trust > div {
  display: inline-flex !important; align-items: center !important; gap: 9px !important;
  background: var(--card) !important;
  border: 1px solid var(--line) !important;
  color: var(--text-hi) !important;
  padding: 9px 16px !important;
  border-radius: 999px !important;
  font-size: 13px !important; font-weight: 600 !important;
  transition: border-color .25s ease, transform .25s ease !important;
}
.hero-features-trust .feature:hover, .hero-trust-indicators .item:hover { border-color: rgba(220,53,69,.5) !important; transform: translateY(-2px) !important; }
.hero-features-trust i, .hero-trust-indicators i { color: var(--red-light) !important; }

/* emergency strip in hero */
.hero-redesigned .emergency-badge, .hero-redesigned [class*="emergency"] {
  background: rgba(220,53,69,.14) !important;
  border: 1px solid rgba(220,53,69,.4) !important;
  color: var(--white) !important;
  border-radius: 999px !important;
}

/* ============================================================================
   5. GLOBAL BUTTONS
   ============================================================================ */
.rts-btn, .btn-primary, button[type=submit], .btn {
  font-family: var(--font-body) !important;
  border-radius: 12px !important;
  font-weight: 700 !important;
  transition: transform .25s ease, box-shadow .25s ease, background .25s ease, border-color .25s ease !important;
}
.rts-btn.btn-primary, .btn-primary, button[type=submit] {
  background: var(--red) !important;
  color: var(--white) !important;
  border: none !important;
  box-shadow: 0 8px 24px var(--red-glow) !important;
}
.rts-btn.btn-primary:hover, .btn-primary:hover, button[type=submit]:hover {
  background: var(--red-light) !important;
  color: var(--white) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 14px 34px var(--red-glow) !important;
}
.rts-btn.btn-white, .btn-outline, .rts-btn.btn-secondary {
  background: rgba(255,255,255,.06) !important;
  color: var(--white) !important;
  border: 1px solid rgba(255,255,255,.22) !important;
}
.rts-btn.btn-white:hover, .btn-outline:hover, .rts-btn.btn-secondary:hover {
  border-color: var(--red-light) !important;
  background: rgba(220,53,69,.12) !important;
  color: var(--white) !important;
  transform: translateY(-2px) !important;
}

/* ============================================================================
   6. SECTIONS (shared)
   ============================================================================ */
.rts-service-area, .trust-metrics-section, .certifications-section,
.locations-section-premium, .connect-platforms-section, .trust-section,
.interactive-map-section, .city-service-area-section {
  background: var(--navy) !important;
  color: var(--text-hi) !important;
  padding: 96px 0 !important;
  position: relative !important;
}
/* alternate band shading */
.trust-metrics-section, .certifications-section, .connect-platforms-section {
  background: var(--navy-deep) !important;
}
.rts-service-area h1, .rts-service-area h2, .rts-service-area h3,
.trust-metrics-section h2, .certifications-section h2, .certifications-section h3,
.locations-section-premium h2, .locations-section-premium h3, .connect-platforms-section h2 {
  color: var(--white) !important;
}
.rts-service-area p, .trust-metrics-section p, .certifications-section p,
.locations-section-premium p, .connect-platforms-section p { color: var(--text-mid) !important; }

/* ============================================================================
   7. SERVICE CARDS
   ============================================================================ */
.service-card, .card-glow, .ultra-feature-card, .why-card, .value-card, .feature-box {
  background: var(--card) !important;
  border: 1px solid var(--line) !important;
  border-radius: var(--radius-lg) !important;
  padding: 30px 26px !important;
  transition: transform .3s cubic-bezier(.22,1,.36,1), border-color .3s ease, box-shadow .3s ease, background .3s ease !important;
  position: relative !important;
  overflow: hidden !important;
}
.service-card::before, .ultra-feature-card::before {
  content: '' !important;
  position: absolute !important; top: 0; left: 0; right: 0 !important;
  height: 3px !important;
  background: linear-gradient(90deg, var(--red), var(--red-light)) !important;
  transform: scaleX(0) !important; transform-origin: left !important;
  transition: transform .35s cubic-bezier(.22,1,.36,1) !important;
}
.service-card:hover, .card-glow:hover, .ultra-feature-card:hover, .why-card:hover, .value-card:hover, .feature-box:hover {
  transform: translateY(-8px) !important;
  border-color: rgba(220,53,69,.45) !important;
  background: var(--card-hover) !important;
  box-shadow: 0 24px 50px rgba(0,0,0,.4), 0 0 0 1px rgba(220,53,69,.15) !important;
}
.service-card:hover::before, .ultra-feature-card:hover::before { transform: scaleX(1) !important; }

.service-icon, .card-hex-icon, .feature-icon, .icon-box, .why-card .icon, .value-card .icon {
  background: rgba(220,53,69,.14) !important;
  border: 1px solid rgba(220,53,69,.3) !important;
  border-radius: 14px !important;
  width: 58px !important; height: 58px !important;
  display: flex !important; align-items: center !important; justify-content: center !important;
  margin-bottom: 18px !important;
  transition: transform .3s ease, background .3s ease !important;
}
.service-icon i, .card-hex-icon i, .feature-icon i, .icon-box i, .why-card .icon i, .value-card .icon i,
.service-icon svg, .feature-icon svg { color: var(--red-light) !important; fill: var(--red-light) !important; font-size: 24px !important; }
.service-card:hover .service-icon, .why-card:hover .icon, .value-card:hover .icon { transform: scale(1.08) rotate(-4deg) !important; background: rgba(220,53,69,.22) !important; }

.service-title, .service-title a, .card-body h3, .card-body h4, .why-card h4, .value-card h5 {
  color: var(--white) !important;
  font-size: 19px !important;
  margin-bottom: 10px !important;
}
.service-desc, .card-text, .card-body p, .why-card p, .value-card p { color: var(--text-mid) !important; font-size: 14.5px !important; line-height: 1.65 !important; }
.service-link, .read-more, .card-body a[class*="link"] { color: var(--red-light) !important; font-weight: 700 !important; font-size: 14px !important; display: inline-flex !important; align-items: center !important; gap: 8px !important; }
.service-link:hover, .read-more:hover { color: var(--white) !important; gap: 12px !important; }

/* ============================================================================
   8. STATS / METRICS
   ============================================================================ */
.trust-metrics-section .metric, .stat-box, .footer-stat-card, .ultra-stat, [class*="stat-card"] {
  background: var(--card) !important;
  border: 1px solid var(--line) !important;
  border-radius: var(--radius-lg) !important;
  padding: 30px 22px !important;
  text-align: center !important;
  transition: transform .3s ease, border-color .3s ease !important;
}
.trust-metrics-section .metric:hover, .stat-box:hover, .footer-stat-card:hover { transform: translateY(-6px) !important; border-color: rgba(220,53,69,.4) !important; }
.stat-number, .metric-value, .ultra-counter, .footer-stat-number, [class*="stat"] .num {
  font-family: var(--font-display) !important;
  font-size: clamp(34px, 4vw, 46px) !important;
  font-weight: 800 !important;
  color: var(--red-light) !important;
  -webkit-text-fill-color: var(--red-light) !important;
  background: none !important;
  line-height: 1 !important;
}
.stat-label, .metric-label, .ultra-stat-label, .footer-stat-label {
  color: var(--text-low) !important;
  font-size: 12.5px !important;
  letter-spacing: .14em !important;
  text-transform: uppercase !important;
  margin-top: 10px !important;
}
.stat-icon, .metric-icon, .footer-stat-icon {
  background: rgba(220,53,69,.14) !important;
  border-radius: 14px !important;
  width: 54px !important; height: 54px !important;
  display: flex !important; align-items: center !important; justify-content: center !important;
  margin: 0 auto 14px !important;
}
.stat-icon i, .metric-icon i, .footer-stat-icon i, .stat-icon svg, .metric-icon svg { color: var(--red-light) !important; fill: var(--red-light) !important; font-size: 22px !important; }

/* ============================================================================
   9. CERTIFICATIONS
   ============================================================================ */
.cert-card {
  background: var(--card) !important;
  border: 1px solid var(--line) !important;
  border-radius: var(--radius-lg) !important;
  padding: 26px 22px !important;
  transition: transform .3s ease, border-color .3s ease !important;
}
.cert-card:hover { transform: translateY(-6px) !important; border-color: rgba(220,53,69,.4) !important; }
.cert-card.featured { background: linear-gradient(150deg, rgba(220,53,69,.16), var(--card)) !important; border-color: rgba(220,53,69,.45) !important; }
.cert-icon {
  background: rgba(220,53,69,.14) !important;
  border-radius: 12px !important;
  width: 48px !important; height: 48px !important;
  display: flex !important; align-items: center !important; justify-content: center !important;
  margin-bottom: 14px !important;
}
.cert-icon i, .cert-icon svg { color: var(--red-light) !important; fill: var(--red-light) !important; font-size: 20px !important; }
.cert-title, .cert-card h3 { color: var(--white) !important; font-size: 16px !important; margin-bottom: 6px !important; }
.cert-desc, .cert-card p { color: var(--text-mid) !important; font-size: 13px !important; }
.cert-badge, [class*="badge"][class*="verified"], .badge-verified {
  background: rgba(220,53,69,.16) !important;
  color: var(--red-light) !important;
  border: 1px solid rgba(220,53,69,.35) !important;
  border-radius: 999px !important;
  padding: 4px 12px !important;
  font-size: 11px !important; font-weight: 700 !important; letter-spacing: .08em !important; text-transform: uppercase !important;
}

/* ============================================================================
   10. CTA SECTION
   ============================================================================ */
.rts-cta-area, .cta-section, .cta-glass, .cta-box {
  background:
    radial-gradient(800px 400px at 80% 20%, rgba(220,53,69,.2), transparent 60%),
    linear-gradient(150deg, var(--navy-dark), var(--navy-deep)) !important;
  border-top: 1px solid var(--line) !important;
  border-bottom: 1px solid var(--line) !important;
  color: var(--text-hi) !important;
}
.rts-cta-area h2, .cta-section h2, .cta-content h2 { color: var(--white) !important; font-size: clamp(28px, 3.6vw, 42px) !important; }
.rts-cta-area p, .cta-section p, .cta-content p { color: var(--text-mid) !important; }
.rts-cta-area a, .cta-content a { color: var(--red-light) !important; }

/* ============================================================================
   11. MAP / LOCATIONS
   ============================================================================ */
.locations-section-premium, .interactive-map-section { background: var(--navy-deep) !important; }
.area-card, .map-card, [class*="office-card"], [class*="hq-card"] {
  background: var(--card) !important;
  border: 1px solid var(--line) !important;
  border-radius: var(--radius-lg) !important;
  transition: transform .3s ease, border-color .3s ease !important;
}
.area-card:hover { transform: translateY(-5px) !important; border-color: rgba(220,53,69,.4) !important; }
.area-card h5, .area-card h4, .map-card h5 { color: var(--white) !important; }
.area-card p, .map-card p { color: var(--text-mid) !important; }
.btn-directions, .btn-map-directions {
  background: rgba(255,255,255,.07) !important;
  color: var(--white) !important;
  border: 1px solid rgba(255,255,255,.2) !important;
  border-radius: 10px !important;
  padding: 10px 18px !important;
  font-weight: 600 !important; font-size: 14px !important;
}
.btn-directions:hover, .btn-map-directions:hover { border-color: var(--red-light) !important; background: rgba(220,53,69,.12) !important; color: var(--white) !important; }
.btn-map-call {
  background: var(--red) !important; color: var(--white) !important;
  border-radius: 10px !important; padding: 10px 18px !important; font-weight: 700 !important; font-size: 14px !important;
  box-shadow: 0 6px 18px var(--red-glow) !important;
}
.btn-map-call:hover { background: var(--red-light) !important; color: var(--white) !important; }

/* ============================================================================
   12. FOOTER
   ============================================================================ */
.footer, .rts-footer, footer, .footer-ultimate, .footer-main-content {
  background: var(--navy-dark) !important;
  color: var(--text-mid) !important;
  border-top: 1px solid var(--line) !important;
}
.footer-title, .footer h4, .footer h5, .footer-hours-title, .footer-cert-title { color: var(--white) !important; font-size: 16px !important; font-weight: 700 !important; margin-bottom: 18px !important; }
.footer a, .footer-menu-list a, footer a { color: var(--text-mid) !important; font-size: 14px !important; transition: color .25s ease, padding-left .25s ease !important; }
.footer a:hover, .footer-menu-list a:hover, footer a:hover { color: var(--red-light) !important; padding-left: 6px !important; }
.footer-brand-text, .footer p { color: var(--text-mid) !important; font-size: 14px !important; }
.footer-contact-item, .footer li { color: var(--text-mid) !important; }
.footer-contact-item i, .footer li i { color: var(--red-light) !important; }
.footer-social-icon, .footer-social-icons a, .social-icons a {
  width: 42px !important; height: 42px !important;
  display: inline-flex !important; align-items: center !important; justify-content: center !important;
  background: rgba(255,255,255,.07) !important;
  border: 1px solid var(--line) !important;
  border-radius: 10px !important;
  color: var(--white) !important;
  transition: background .25s ease, transform .25s ease, border-color .25s ease !important;
}
.footer-social-icon:hover, .footer-social-icons a:hover, .social-icons a:hover {
  background: var(--red) !important; border-color: var(--red) !important;
  transform: translateY(-3px) !important; color: var(--white) !important;
}
.footer-newsletter-btn, .footer form button {
  background: var(--red) !important; color: var(--white) !important;
  border: none !important; border-radius: 10px !important;
  padding: 12px 22px !important; font-weight: 700 !important;
  box-shadow: 0 6px 18px var(--red-glow) !important;
  transition: background .25s ease, transform .25s ease !important;
}
.footer-newsletter-btn:hover, .footer form button:hover { background: var(--red-light) !important; transform: translateY(-2px) !important; color: var(--white) !important; }
.footer input[type=email], .footer input[type=text], .footer-newsletter input {
  background: rgba(255,255,255,.06) !important;
  border: 1px solid var(--line) !important;
  border-radius: 10px !important;
  color: var(--white) !important;
  padding: 12px 16px !important;
}
.footer input:focus { border-color: var(--red-light) !important; outline: none !important; box-shadow: 0 0 0 3px rgba(220,53,69,.2) !important; }
.footer-bottom-bar { background: rgba(0,0,0,.25) !important; border-top: 1px solid var(--line) !important; padding: 20px 0 !important; }
.footer-bottom-content, .footer-copyright-text, .footer-bottom-nav a { color: var(--text-low) !important; font-size: 13px !important; }
.footer-bottom-nav a:hover { color: var(--red-light) !important; }
.footer-cert-icon, .footer-cert-icon.gold, .footer-cert-icon.blue, .footer-cert-icon.green, .footer-cert-icon.purple {
  background: rgba(220,53,69,.12) !important;
  border: 1px solid rgba(220,53,69,.25) !important;
}
.footer-cert-icon i, .footer-cert-icon svg { color: var(--red-light) !important; fill: var(--red-light) !important; }

/* ============================================================================
   13. FLOATING ACTION BUTTONS + MISC
   ============================================================================ */
.fab-button, .floating-action-buttons a, [class*="fab-"] {
  border-radius: 999px !important;
  box-shadow: 0 10px 26px rgba(0,0,0,.4) !important;
  transition: transform .25s ease, box-shadow .25s ease !important;
}
.fab-button:hover, .floating-action-buttons a:hover { transform: scale(1.08) !important; }
.fab-call, .floating-action-buttons .call { background: var(--red) !important; color: var(--white) !important; }
.fab-call i, .floating-action-buttons .call i { color: var(--white) !important; }
.fab-whatsapp, .floating-action-buttons .whatsapp { background: #25D366 !important; color: var(--white) !important; }

#backToTop, #bttBtn, .btt-btn {
  background: var(--red) !important; color: var(--white) !important;
  border-radius: 12px !important;
  box-shadow: 0 8px 22px var(--red-glow) !important;
}
#backToTop:hover, #bttBtn:hover, .btt-btn:hover { background: var(--red-light) !important; color: var(--white) !important; }

/* cookie banner */
.cookie-banner {
  background: var(--navy-dark) !important;
  border-top: 1px solid var(--line) !important;
  color: var(--text-hi) !important;
  box-shadow: 0 -12px 40px rgba(0,0,0,.4) !important;
}
.cookie-banner p, .cookie-banner span { color: var(--text-mid) !important; }
.cookie-accept, .cookie-banner .accept { background: var(--red) !important; color: var(--white) !important; border-radius: 10px !important; font-weight: 700 !important; }
.cookie-accept:hover { background: var(--red-light) !important; color: var(--white) !important; }
.cookie-decline, .cookie-banner .decline { background: rgba(255,255,255,.08) !important; color: var(--white) !important; border: 1px solid var(--line) !important; border-radius: 10px !important; }

/* mobile bottom CTA bar */
.mobile-cta-bar { background: var(--navy-dark) !important; border-top: 1px solid var(--line) !important; }
.mobile-cta-bar .cta-call { background: var(--red) !important; color: var(--white) !important; }
.mobile-cta-bar .cta-chat { background: var(--navy-light) !important; color: var(--white) !important; }
.mobile-cta-bar i { color: var(--white) !important; }

/* forms */
input, select, textarea {
  background: rgba(255,255,255,.06) !important;
  border: 1px solid var(--line) !important;
  border-radius: 10px !important;
  color: var(--white) !important;
}
input::placeholder, textarea::placeholder { color: var(--text-low) !important; }
input:focus, select:focus, textarea:focus {
  border-color: var(--red-light) !important;
  box-shadow: 0 0 0 3px rgba(220,53,69,.2) !important;
  outline: none !important;
}

/* ============================================================================
   14. RESPONSIVE
   ============================================================================ */
@media (max-width: 991px) {
  .header-v2-nav { display: none !important; }
  .header-v2-toggle { display: flex !important; }
  .header-v2-inner { height: 66px !important; }
  .header-v2-phone span { display: none !important; }
  .header-v2-phone { padding: 11px 14px !important; }
  body { padding-top: 66px !important; }
  .hero-redesigned, .rts-banner-area { padding: 110px 0 70px !important; min-height: auto !important; }
  .rts-service-area, .trust-metrics-section, .certifications-section,
  .locations-section-premium, .connect-platforms-section { padding: 70px 0 !important; }
}
@media (max-width: 575px) {
  .hero-cta-trust { flex-direction: column !important; }
  .hero-cta-trust a, .btn-call-now, .btn-schedule { width: 100% !important; justify-content: center !important; }
  .header-v2-inner { padding: 0 16px !important; }
}

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