/* ===== V15 FINAL VISUAL/THEME/SERVICES FIXES ===== */

/* 1) Powerful light mode readability everywhere */
html[data-theme="light"],
html[data-theme="light"] body,
body.light,
body.light-mode{
  background:#f4f5f7 !important;
  color:#171a22 !important;
}

html[data-theme="light"] .main-wrapper,
html[data-theme="light"] main,
html[data-theme="light"] section,
html[data-theme="light"] .section,
html[data-theme="light"] .page-section,
html[data-theme="light"] .service-category-block,
html[data-theme="light"] .content-card,
html[data-theme="light"] .content-shell,
html[data-theme="light"] .step-card,
html[data-theme="light"] .service-detail-card,
html[data-theme="light"] .feature-card,
html[data-theme="light"] .glass-card,
html[data-theme="light"] .warranty-card,
html[data-theme="light"] .verify-card,
html[data-theme="light"] .journey-card,
html[data-theme="light"] .center-card,
html[data-theme="light"] .atlas-center-card,
html[data-theme="light"] .review-card,
html[data-theme="light"] .contact-card,
html[data-theme="light"] .form-card,
body.light .main-wrapper,
body.light main,
body.light section,
body.light .section,
body.light .page-section,
body.light .service-category-block,
body.light .content-card,
body.light .content-shell,
body.light .step-card,
body.light .service-detail-card,
body.light .feature-card,
body.light .glass-card,
body.light .warranty-card,
body.light .verify-card,
body.light .journey-card,
body.light .center-card,
body.light .atlas-center-card,
body.light .review-card,
body.light .contact-card,
body.light .form-card,
body.light-mode .main-wrapper,
body.light-mode main,
body.light-mode section,
body.light-mode .section,
body.light-mode .page-section,
body.light-mode .service-category-block,
body.light-mode .content-card,
body.light-mode .content-shell,
body.light-mode .step-card,
body.light-mode .service-detail-card,
body.light-mode .feature-card,
body.light-mode .glass-card,
body.light-mode .warranty-card,
body.light-mode .verify-card,
body.light-mode .journey-card,
body.light-mode .center-card,
body.light-mode .atlas-center-card,
body.light-mode .review-card,
body.light-mode .contact-card,
body.light-mode .form-card{
  color:#171a22 !important;
  border-color:rgba(17,24,39,.12) !important;
}

html[data-theme="light"] .service-detail-card,
html[data-theme="light"] .step-card,
html[data-theme="light"] .warranty-card,
html[data-theme="light"] .verify-card,
html[data-theme="light"] .journey-card,
html[data-theme="light"] .glass-card,
html[data-theme="light"] .content-card,
body.light .service-detail-card,
body.light .step-card,
body.light .warranty-card,
body.light .verify-card,
body.light .journey-card,
body.light .glass-card,
body.light .content-card,
body.light-mode .service-detail-card,
body.light-mode .step-card,
body.light-mode .warranty-card,
body.light-mode .verify-card,
body.light-mode .journey-card,
body.light-mode .glass-card,
body.light-mode .content-card{
  background:rgba(255,255,255,.88) !important;
  box-shadow:0 20px 45px rgba(17,24,39,.08) !important;
}

html[data-theme="light"] h1,
html[data-theme="light"] h2,
html[data-theme="light"] h3,
html[data-theme="light"] h4,
html[data-theme="light"] h5,
html[data-theme="light"] p,
html[data-theme="light"] span,
html[data-theme="light"] li,
html[data-theme="light"] small,
html[data-theme="light"] label,
html[data-theme="light"] a:not(.primary-btn):not(.action-book):not(.float-btn),
body.light h1,
body.light h2,
body.light h3,
body.light h4,
body.light h5,
body.light p,
body.light span,
body.light li,
body.light small,
body.light label,
body.light a:not(.primary-btn):not(.action-book):not(.float-btn),
body.light-mode h1,
body.light-mode h2,
body.light-mode h3,
body.light-mode h4,
body.light-mode h5,
body.light-mode p,
body.light-mode span,
body.light-mode li,
body.light-mode small,
body.light-mode label,
body.light-mode a:not(.primary-btn):not(.action-book):not(.float-btn){
  color:#171a22 !important;
  text-shadow:none !important;
}

html[data-theme="light"] .eyebrow,
html[data-theme="light"] .section-kicker,
html[data-theme="light"] .red-text,
html[data-theme="light"] .accent,
body.light .eyebrow,
body.light .section-kicker,
body.light .red-text,
body.light .accent,
body.light-mode .eyebrow,
body.light-mode .section-kicker,
body.light-mode .red-text,
body.light-mode .accent{
  color:#d71920 !important;
}

html[data-theme="light"] .subtitle,
html[data-theme="light"] .muted,
html[data-theme="light"] .section-subtitle,
html[data-theme="light"] .card-text,
html[data-theme="light"] .service-detail-card p,
html[data-theme="light"] .step-card p,
body.light .subtitle,
body.light .muted,
body.light .section-subtitle,
body.light .card-text,
body.light .service-detail-card p,
body.light .step-card p,
body.light-mode .subtitle,
body.light-mode .muted,
body.light-mode .section-subtitle,
body.light-mode .card-text,
body.light-mode .service-detail-card p,
body.light-mode .step-card p{
  color:#4b5563 !important;
}

/* 2) Page hero / services hero specifically */
html[data-theme="light"] .page-hero,
html[data-theme="light"] .services-page-hero,
html[data-theme="light"] .service-detail-hero,
body.light .page-hero,
body.light .services-page-hero,
body.light .service-detail-hero,
body.light-mode .page-hero,
body.light-mode .services-page-hero,
body.light-mode .service-detail-hero{
  background:
    linear-gradient(90deg, rgba(255,255,255,.70), rgba(255,255,255,.48)),
    radial-gradient(circle at 60% 15%, rgba(215,25,32,.20), transparent 34%),
    #eef0f4 !important;
  color:#171a22 !important;
}
html[data-theme="light"] .page-hero .hero-vignette,
html[data-theme="light"] .services-hero-bg,
body.light .page-hero .hero-vignette,
body.light .services-hero-bg,
body.light-mode .page-hero .hero-vignette,
body.light-mode .services-hero-bg{
  opacity:.18 !important;
  filter:brightness(1.1) contrast(.92) !important;
}
html[data-theme="light"] .page-hero h1,
html[data-theme="light"] .page-hero p,
html[data-theme="light"] .service-detail-hero h1,
html[data-theme="light"] .service-detail-hero p,
body.light .page-hero h1,
body.light .page-hero p,
body.light .service-detail-hero h1,
body.light .service-detail-hero p,
body.light-mode .page-hero h1,
body.light-mode .page-hero p,
body.light-mode .service-detail-hero h1,
body.light-mode .service-detail-hero p{
  color:#171a22 !important;
  text-shadow:none !important;
}

/* 3) Home journey cards / Scan Verify Trust / metrics / top-of-footer CTAs */
html[data-theme="light"] .journey,
html[data-theme="light"] .atlas-journey,
html[data-theme="light"] .verification,
html[data-theme="light"] .warranty-verify,
html[data-theme="light"] .scan-section,
html[data-theme="light"] .final-cta,
html[data-theme="light"] .cta-section,
html[data-theme="light"] .footer-cta,
html[data-theme="light"] .pre-footer,
html[data-theme="light"] .closing-cta,
body.light .journey,
body.light .atlas-journey,
body.light .verification,
body.light .warranty-verify,
body.light .scan-section,
body.light .final-cta,
body.light .cta-section,
body.light .footer-cta,
body.light .pre-footer,
body.light .closing-cta,
body.light-mode .journey,
body.light-mode .atlas-journey,
body.light-mode .verification,
body.light-mode .warranty-verify,
body.light-mode .scan-section,
body.light-mode .final-cta,
body.light-mode .cta-section,
body.light-mode .footer-cta,
body.light-mode .pre-footer,
body.light-mode .closing-cta{
  background:#fff !important;
  color:#171a22 !important;
}
html[data-theme="light"] .journey *,
html[data-theme="light"] .atlas-journey *,
html[data-theme="light"] .verification *,
html[data-theme="light"] .warranty-verify *,
html[data-theme="light"] .scan-section *,
html[data-theme="light"] .final-cta *:not(.primary-btn),
html[data-theme="light"] .cta-section *:not(.primary-btn),
html[data-theme="light"] .footer-cta *:not(.primary-btn),
html[data-theme="light"] .pre-footer *:not(.primary-btn),
html[data-theme="light"] .closing-cta *:not(.primary-btn),
body.light .journey *,
body.light .atlas-journey *,
body.light .verification *,
body.light .warranty-verify *,
body.light .scan-section *,
body.light .final-cta *:not(.primary-btn),
body.light .cta-section *:not(.primary-btn),
body.light .footer-cta *:not(.primary-btn),
body.light .pre-footer *:not(.primary-btn),
body.light .closing-cta *:not(.primary-btn),
body.light-mode .journey *,
body.light-mode .atlas-journey *,
body.light-mode .verification *,
body.light-mode .warranty-verify *,
body.light-mode .scan-section *,
body.light-mode .final-cta *:not(.primary-btn),
body.light-mode .cta-section *:not(.primary-btn),
body.light-mode .footer-cta *:not(.primary-btn),
body.light-mode .pre-footer *:not(.primary-btn),
body.light-mode .closing-cta *:not(.primary-btn){
  color:#171a22 !important;
  text-shadow:none !important;
}

/* Metrics variants */
html[data-theme="light"] .hero-metrics,
html[data-theme="light"] .metric-row,
html[data-theme="light"] .metrics-grid,
body.light .hero-metrics,
body.light .metric-row,
body.light .metrics-grid,
body.light-mode .hero-metrics,
body.light-mode .metric-row,
body.light-mode .metrics-grid{
  background:rgba(255,255,255,.92) !important;
  border-color:rgba(17,24,39,.12) !important;
}
html[data-theme="light"] .hero-metrics strong,
html[data-theme="light"] .metrics-grid strong,
body.light .hero-metrics strong,
body.light .metrics-grid strong,
body.light-mode .hero-metrics strong,
body.light-mode .metrics-grid strong{
  color:#d71920 !important;
}
html[data-theme="light"] .hero-metrics span,
html[data-theme="light"] .metrics-grid span,
body.light .hero-metrics span,
body.light .metrics-grid span,
body.light-mode .hero-metrics span,
body.light-mode .metrics-grid span{
  color:#171a22 !important;
}

/* 4) Header/mobile in light mode */
html[data-theme="light"] .site-header,
body.light .site-header,
body.light-mode .site-header{
  background:rgba(255,255,255,.96) !important;
  color:#171a22 !important;
  border-color:rgba(17,24,39,.10) !important;
  box-shadow:0 12px 30px rgba(17,24,39,.08) !important;
}
html[data-theme="light"] .site-header a,
html[data-theme="light"] .site-header span,
html[data-theme="light"] .site-header strong,
html[data-theme="light"] .site-header small,
html[data-theme="light"] .site-header button,
body.light .site-header a,
body.light .site-header span,
body.light .site-header strong,
body.light .site-header small,
body.light .site-header button,
body.light-mode .site-header a,
body.light-mode .site-header span,
body.light-mode .site-header strong,
body.light-mode .site-header small,
body.light-mode .site-header button{
  color:#171a22 !important;
}
html[data-theme="light"] .primary-btn,
body.light .primary-btn,
body.light-mode .primary-btn,
html[data-theme="light"] .site-header .primary-btn,
body.light .site-header .primary-btn,
body.light-mode .site-header .primary-btn{
  color:#fff !important;
}
html[data-theme="light"] .mobile-menu,
body.light .mobile-menu,
body.light-mode .mobile-menu{
  background:#fff !important;
  border-color:rgba(17,24,39,.12) !important;
}
html[data-theme="light"] .mobile-menu a,
html[data-theme="light"] .mobile-menu button,
html[data-theme="light"] .mobile-services-panel a,
html[data-theme="light"] .mobile-services-panel strong,
body.light .mobile-menu a,
body.light .mobile-menu button,
body.light .mobile-services-panel a,
body.light .mobile-services-panel strong,
body.light-mode .mobile-menu a,
body.light-mode .mobile-menu button,
body.light-mode .mobile-services-panel a,
body.light-mode .mobile-services-panel strong{
  color:#171a22 !important;
  background:rgba(17,24,39,.035) !important;
}

/* 5) Services dropdown: always opens under Services button, not off to the side */
.atlas-services-dd{position:relative !important;}
.atlas-services-panel{
  left:50% !important;
  right:auto !important;
  transform:translateX(-50%) translateY(10px) !important;
  transform-origin:top center !important;
  min-width:min(760px, calc(100vw - 36px)) !important;
  max-width:calc(100vw - 36px) !important;
}
.atlas-services-dd:hover .atlas-services-panel,
.atlas-services-dd:focus-within .atlas-services-panel,
.atlas-services-panel:hover{
  transform:translateX(-50%) translateY(0) !important;
}
html[data-theme="light"] .atlas-services-panel,
body.light .atlas-services-panel,
body.light-mode .atlas-services-panel{
  background:#fff !important;
  color:#171a22 !important;
  border-color:rgba(17,24,39,.12) !important;
  box-shadow:0 22px 50px rgba(17,24,39,.12) !important;
}
html[data-theme="light"] .atlas-services-panel *,
body.light .atlas-services-panel *,
body.light-mode .atlas-services-panel *{
  color:#171a22 !important;
}
html[data-theme="light"] .atlas-services-panel b,
body.light .atlas-services-panel b,
body.light-mode .atlas-services-panel b{
  color:#d71920 !important;
}
.desktop-nav .atlas-services-dd > a::after{
  content:"";
  display:inline-block;
  width:7px;height:7px;
  border-inline-end:2px solid #d71920;
  border-bottom:2px solid #d71920;
  transform:rotate(45deg);
  margin-inline-start:8px;
  margin-bottom:3px;
  transition:.2s ease;
}
.desktop-nav .atlas-services-dd:hover > a::after{transform:rotate(225deg);margin-bottom:-2px;}

/* 6) Footer unified visual */
.atlas-footer{
  background:#07080b !important;
  color:#fff !important;
  border-top:1px solid rgba(255,255,255,.10) !important;
}
.atlas-footer *{color:inherit !important;}
.atlas-footer a{color:rgba(255,255,255,.82) !important;text-decoration:none;}
.atlas-footer a:hover{color:#ff2b35 !important;}
.atlas-footer h2,.atlas-footer h3{color:#fff !important;}
.atlas-footer p,.atlas-footer span{color:rgba(255,255,255,.72) !important;}
html[data-theme="light"] .atlas-footer,
body.light .atlas-footer,
body.light-mode .atlas-footer{
  background:#0b0d12 !important;
  color:#fff !important;
}
html[data-theme="light"] .atlas-footer *,
body.light .atlas-footer *,
body.light-mode .atlas-footer *{
  color:inherit !important;
}
html[data-theme="light"] .atlas-footer p,
html[data-theme="light"] .atlas-footer span,
body.light .atlas-footer p,
body.light .atlas-footer span,
body.light-mode .atlas-footer p,
body.light-mode .atlas-footer span{
  color:rgba(255,255,255,.72) !important;
}

/* 7) Loader: premium red rings, visible on dark/light */
.site-loader{
  background:#050505 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  flex-direction:column !important;
  gap:18px !important;
}
html[data-theme="light"] .site-loader,
body.light .site-loader,
body.light-mode .site-loader{
  background:#f7f8fb !important;
}
.site-loader .loader-ring{
  width:82px !important;
  height:82px !important;
  border-radius:50% !important;
  border:3px solid rgba(215,25,32,.16) !important;
  border-top-color:#d71920 !important;
  border-right-color:#ff3b45 !important;
  position:relative !important;
  animation:atlasSpin 1s linear infinite !important;
  box-shadow:0 0 34px rgba(215,25,32,.22) !important;
}
.site-loader .loader-ring::after{
  content:"";
  position:absolute;
  inset:13px;
  border-radius:50%;
  border:3px solid transparent;
  border-left-color:#d71920;
  border-bottom-color:#ff3b45;
  animation:atlasSpinReverse .8s linear infinite;
}
.site-loader .loader-logo span{
  color:#d71920 !important;
  font-weight:900 !important;
  font-size:32px !important;
  letter-spacing:-2px !important;
}
.site-loader .loader-logo p{
  color:#fff !important;
  letter-spacing:3px !important;
  font-size:10px !important;
  font-weight:900 !important;
}
html[data-theme="light"] .site-loader .loader-logo p,
body.light .site-loader .loader-logo p,
body.light-mode .site-loader .loader-logo p{
  color:#171a22 !important;
}
@keyframes atlasSpin{to{transform:rotate(360deg)}}
@keyframes atlasSpinReverse{to{transform:rotate(-360deg)}}

/* 8) Mobile polish */
@media(max-width:980px){
  .atlas-services-panel{position:static !important;transform:none !important;min-width:100% !important;max-height:68vh !important;overflow:auto !important;}
  .desktop-nav .atlas-services-dd > a::after{display:none;}
  .service-detail-grid{grid-template-columns:1fr !important;}
  .service-category-block{padding-inline:18px !important;}
}
