/* ============================================================
   SP Cleaning Services, Premium Visual Redesign
   STRONG, VISIBLE improvements over the base styles
   ============================================================ */

/* ── 1. GLOBAL RESET REFINEMENTS ── */
*, *::before, *::after { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  font-family: 'Inter', 'Segoe UI', Arial, sans-serif !important;
  background: #fff !important;
  color: #1a1a2e !important;
  font-size: 16px !important;
  line-height: 1.7 !important;
}

/* ── 2. STICKY HEADER ── */
.header-area {
  position: sticky !important;
  top: 0 !important;
  z-index: 1000 !important;
  background: #fff !important;
  box-shadow: 0 2px 24px rgba(75,43,150,0.10) !important;
  border-bottom: 2px solid #f3f0fa !important;
  padding: 0 !important;
  transition: box-shadow 0.3s ease !important;
}

.header-logo a img {
  height: 72px !important;
  width: auto !important;
  display: block !important;
}

/* Get a Quote button, bold orange pill */
.get-quote a {
  background: linear-gradient(135deg, #ff6201 0%, #ff8533 100%) !important;
  color: #fff !important;
  font-weight: 700 !important;
  font-size: 14px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
  padding: 13px 28px !important;
  border-radius: 50px !important;
  border: none !important;
  box-shadow: 0 4px 18px rgba(255,98,1,0.35) !important;
  transition: all 0.25s ease !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.get-quote a:hover {
  transform: translateY(-3px) !important;
  box-shadow: 0 8px 30px rgba(255,98,1,0.45) !important;
  background: linear-gradient(135deg, #e55800 0%, #ff6201 100%) !important;
  color: #fff !important;
}

/* Phone link in header */
.header-right-text .phone a {
  font-size: 17px !important;
  font-weight: 700 !important;
  color: #4b2b96 !important;
  letter-spacing: 0.02em !important;
}

.header-right-text .phone a:hover { color: #ff6201 !important; }

/* ── 3. NAVIGATION ── */
.main-menu-area {
  background: #f9f7ff !important;
  border-bottom: 1px solid #e8e0f5 !important;
}

.main-menu > nav > ul > li > a {
  font-size: 13px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
  color: #2d1b5e !important;
  padding: 18px 14px !important;
  transition: color 0.2s ease !important;
}

.main-menu > nav > ul > li > a:hover,
.main-menu > nav > ul > li.active > a {
  color: #ff6201 !important;
}

/* nav underline bar */
.main-menu > nav > ul > li > a::before {
  background: #ff6201 !important;
  height: 3px !important;
  border-radius: 2px !important;
}

/* sub-menu */
.main-menu ul li .sub-menu {
  border-top: 3px solid #ff6201 !important;
  border-radius: 0 0 12px 12px !important;
  box-shadow: 0 12px 40px rgba(75,43,150,0.15) !important;
  padding: 8px 0 !important;
}

.main-menu ul li .sub-menu li a {
  font-size: 13px !important;
  font-weight: 500 !important;
  padding: 11px 20px !important;
  color: #3d1f7a !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
}

.main-menu ul li:hover > .sub-menu li > a:hover {
  background: #f3f0fa !important;
  color: #ff6201 !important;
}

/* ── 4. HERO / SLIDER ── */
.slider-area { position: relative !important; overflow: hidden !important; }

/* Neutralise the heavy black overlay from modern-redesign.css */
.slider-area::before,
.page-banner-area::before {
  background: rgba(0,0,0,0) !important; /* remove extra global overlay to prevent double-darkening */
}

/* Match About hero overlay tone to index hero */
.hero-section::before {
  background: linear-gradient(
    170deg,
    rgba(13,5,35,0.34) 0%,
    rgba(45,27,94,0.24) 50%,
    rgba(0,0,0,0.16) 100%
  ) !important;
  z-index: 2 !important;
}

/* Slide wrapper */
.slider-wrapper {
  position: relative !important;
  min-height: 520px !important;
  max-height: 520px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: hidden !important;
}

/* Light gradient overlay, images stay visible */
.slider-wrapper::before {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background: linear-gradient(
    170deg,
    rgba(13,5,35,0.34) 0%,
    rgba(45,27,94,0.24) 50%,
    rgba(0,0,0,0.16) 100%
  ) !important;
  z-index: 2 !important;
}

/* Subtle bottom fade for text legibility only */
.slider-wrapper::after {
  content: '' !important;
  position: absolute !important;
  bottom: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: 80px !important;
  background: linear-gradient(to top, rgba(0,0,0,0.22) 0%, transparent 100%) !important;
  z-index: 3 !important;
  pointer-events: none !important;
}

.slider-content, .slider-text {
  position: relative !important;
  z-index: 10 !important;
}

/* About page hero, match index hero aesthetics */
.about-hero {
  position: relative !important;
  min-height: 520px !important;
  display: flex !important;
  align-items: center !important;
}

.about-hero .breadcrumb-text h2 {
  font-family: 'Playfair Display', 'Inter', Georgia, serif !important;
  font-size: 3rem !important;
  font-weight: 800 !important;
  color: #ffffff !important;
  text-shadow: 2px 4px 20px rgba(0,0,0,0.5) !important;
  line-height: 1.2 !important;
  letter-spacing: -0.01em !important;
  margin: 0 auto 10px !important;
}

.about-hero .breadcrumb-menu ul li,
.about-hero .breadcrumb-menu ul li a {
  color: rgba(255,255,255,0.85) !important;
}

.about-hero .breadcrumb-menu ul li a:hover { color: #ff9a4d !important; }

@media (max-width: 991px) {
  .about-hero { min-height: 380px !important; }
  .about-hero .breadcrumb-text h2 { font-size: 2.2rem !important; }
}

@media (max-width: 767px) {
  .about-hero { min-height: 300px !important; }
  .about-hero .breadcrumb-text h2 { font-size: 1.8rem !important; }
}

.slider-content h1,
.slider-text h1 {
  font-family: 'Playfair Display', 'Inter', Georgia, serif !important;
  font-size: 3.6rem !important;
  font-weight: 800 !important;
  color: #ffffff !important;
  text-shadow: 2px 4px 20px rgba(0,0,0,0.5) !important;
  line-height: 1.2 !important;
  letter-spacing: -0.01em !important;
  max-width: 800px !important;
  margin: 0 auto 32px !important;
  display: block !important;
}

/* Hero CTA bar injected via CSS on sliders */
.slider-content::after {
  content: '' !important;
  display: block !important;
  width: 80px !important;
  height: 4px !important;
  background: linear-gradient(90deg, #ff6201, #ffaa66) !important;
  border-radius: 2px !important;
  margin: 0 auto 28px !important;
}

/* Owl dots & nav for slider */
.slider1-active .owl-dot {
  background: rgba(255,255,255,0.4) !important;
  width: 12px !important;
  height: 12px !important;
  border-radius: 50% !important;
  margin: 0 6px !important;
  transition: all 0.3s ease !important;
}

.slider1-active .owl-dot.active {
  background: #ff6201 !important;
  transform: scale(1.3) !important;
}

/* ── 5. SECTION TYPOGRAPHY & SPACING ── */
h2 {
  font-size: 2.2rem !important;
  font-weight: 800 !important;
  color: #2d1b5e !important;
  line-height: 1.2 !important;
}

h2 span {
  color: #ff6201 !important;
  background: none !important;
  -webkit-text-fill-color: #ff6201 !important;
}

h3 {
  font-size: 1.6rem !important;
  font-weight: 700 !important;
  color: #2d1b5e !important;
}

p {
  color: #444 !important;
  font-size: 15.5px !important;
  line-height: 1.75 !important;
}

/* Section dividers, reduce height & add left accent bar */
.gradient-divider {
  height: 80px !important;
  margin-bottom: 0 !important;
  margin-top: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.gradient-title {
  font-family: 'Inter', sans-serif !important;
  font-size: 1.5rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.05em !important;
  text-transform: uppercase !important;
}

/* ── 6. KEEP ALL IMAGES CLEAR, remove colour overlays ── */
.services-img .bg-opacity,
.services-img .overlay,
.cleaning-area .overlay,
.about-img .overlay,
.single-service-img .overlay,
.portfolio-item .overlay,
.bg-opacity {
  background: transparent !important;
  background-image: none !important;
  mix-blend-mode: normal !important;
}

/* ── 6. ELEGANT IMAGE FRAMES ── */

/* The cleaning welcome section image */
.cleaning-area .col-md-6 > div[style*="border-radius"],
.cleaning-area .col-md-6 > div[style*="overflow"] {
  border-radius: 20px !important;
  box-shadow: 0 20px 60px rgba(75,43,150,0.18), 0 4px 16px rgba(0,0,0,0.10) !important;
  border: 4px solid rgba(255,255,255,0.9) !important;
  outline: 1px solid rgba(75,43,150,0.12) !important;
  transition: all 0.4s ease !important;
}

.cleaning-area .col-md-6 > div[style*="border-radius"]:hover {
  transform: translateY(-8px) !important;
  box-shadow: 0 32px 80px rgba(75,43,150,0.22), 0 8px 24px rgba(0,0,0,0.12) !important;
}

/* About section image frame */
.about-img > div,
.about-img [style*="border-radius"] {
  border-radius: 24px !important;
  box-shadow: 0 24px 64px rgba(75,43,150,0.20), 0 4px 16px rgba(0,0,0,0.10) !important;
  border: 5px solid #fff !important;
  outline: 2px solid rgba(120,81,169,0.18) !important;
  transition: all 0.4s ease !important;
}

.about-img > div:hover {
  transform: translateY(-6px) scale(1.01) !important;
  box-shadow: 0 36px 90px rgba(75,43,150,0.25) !important;
}

/* Service section images */
.services-img {
  border-radius: 20px !important;
  overflow: hidden !important;
  box-shadow: 0 16px 48px rgba(75,43,150,0.16) !important;
  border: 4px solid #fff !important;
  outline: 1px solid rgba(120,81,169,0.15) !important;
  transition: all 0.4s ease !important;
}

.services-img:hover {
  transform: translateY(-8px) !important;
  box-shadow: 0 32px 80px rgba(75,43,150,0.22) !important;
}

/* eco / offers section image */
.eco-img [style*="border-radius"],
.eco-img [style*="overflow"] {
  border-radius: 24px !important;
  box-shadow: 0 24px 64px rgba(75,43,150,0.20) !important;
  border: 5px solid #fff !important;
  outline: 2px solid rgba(120,81,169,0.18) !important;
  transition: all 0.4s ease !important;
}

/* Certification badge */
.certification-badge {
  border-radius: 20px !important;
  box-shadow: 0 16px 48px rgba(75,43,150,0.18) !important;
  border: 4px solid #fff !important;
  outline: 1px solid rgba(120,81,169,0.15) !important;
  transition: transform 0.35s ease, box-shadow 0.35s ease !important;
}

.certification-badge:hover {
  transform: scale(1.07) !important;
  box-shadow: 0 28px 70px rgba(75,43,150,0.25) !important;
}

/* General img elegance */
img[data-aos] {
  border-radius: 16px !important;
  box-shadow: 0 12px 36px rgba(0,0,0,0.12) !important;
}

/* Founder portrait, ensure face is visible elegantly */
.founder-photo {
  width: 100% !important;
  height: 430px !important; /* consistent card height */
  object-fit: cover !important;
  object-position: center 25% !important; /* bias to upper area to keep face visible */
  display: block !important;
  filter: contrast(1.05) brightness(1.03) !important;
}

/* ── 7. SERVICE / ABOUT CONTENT SECTIONS ── */
.cleaning-area,
.about-area {
  padding-top: 60px !important;
  padding-bottom: 60px !important;
  background: #fff !important;
}

.Cleaning-wrapper,
.about-wrapper { padding: 16px 32px !important; }

.cleaning-text h2,
.about-title h1 {
  font-size: 2rem !important;
  font-weight: 800 !important;
  color: #2d1b5e !important;
  margin-bottom: 20px !important;
  line-height: 1.25 !important;
}

.cleaning-text h2 span,
.about-title h1 span {
  color: #ff6201 !important;
  -webkit-text-fill-color: #ff6201 !important;
  background: none !important;
  animation: none !important;
}

/* ── 8. REVIEW CARDS ── */
.reviews-area {
  background: linear-gradient(135deg, #f7f4ff 0%, #fff8f3 100%) !important;
  padding-top: 60px !important;
  padding-bottom: 70px !important;
}

.review-item {
  background: #fff !important;
  border-radius: 20px !important;
  padding: 28px 24px !important;
  border: 1px solid #ede8f7 !important;
  box-shadow: 0 8px 32px rgba(75,43,150,0.09) !important;
  transition: all 0.3s ease !important;
  height: auto !important;
  min-height: 0 !important;
}

.review-item:hover {
  transform: translateY(-6px) !important;
  box-shadow: 0 20px 56px rgba(75,43,150,0.16) !important;
  border-color: #c8b8ec !important;
}

.review-rating i { color: #ffb703 !important; font-size: 16px !important; }

.review-item p {
  font-size: 14.5px !important;
  color: #555 !important;
  font-style: italic !important;
  line-height: 1.7 !important;
}

.reviewer-name {
  font-weight: 700 !important;
  color: #4b2b96 !important;
  font-size: 15px !important;
  margin-top: 16px !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

/* ── 9. SECTION TITLE ── */
.section-title h2 {
  font-size: 2.1rem !important;
  font-weight: 800 !important;
  color: #2d1b5e !important;
}

.section-title h2 span {
  color: #ff6201 !important;
  -webkit-text-fill-color: #ff6201 !important;
  background: none !important;
  animation: none !important;
}

.section-title p {
  font-size: 16px !important;
  color: #666 !important;
  max-width: 640px !important;
  margin: 12px auto 0 !important;
}

/* ── 10. SERVICE SINGLE ITEMS ── */
.single-service {
  background: #fff !important;
  border-radius: 20px !important;
  overflow: hidden !important;
  box-shadow: 0 8px 32px rgba(75,43,150,0.09) !important;
  border: 1px solid #ede8f7 !important;
  transition: all 0.35s ease !important;
  margin-bottom: 30px !important;
}

.single-service:hover {
  transform: translateY(-8px) !important;
  box-shadow: 0 24px 64px rgba(75,43,150,0.16) !important;
  border-color: #c8b8ec !important;
}

.single-service h3 {
  font-size: 1.3rem !important;
  font-weight: 700 !important;
  color: #2d1b5e !important;
}

/* ── 11. ACTION / OFFERS SECTION ── */
.action-area {
  background: #f7f4ff !important;
  padding-top: 70px !important;
  padding-bottom: 70px !important;
}

.action-wrapper[style] {
  border-radius: 24px !important;
  border-left: 6px solid #4b2b96 !important;
  box-shadow: 0 16px 48px rgba(75,43,150,0.12) !important;
  padding: 44px !important;
}

.action-wrapper .pricing-btn a[href="book-now.html"] {
  background: linear-gradient(135deg, #4b2b96 0%, #7851a9 100%) !important;
  color: #fff !important;
  padding: 15px 32px !important;
  border-radius: 50px !important;
  font-weight: 700 !important;
  font-size: 15px !important;
  box-shadow: 0 8px 24px rgba(75,43,150,0.30) !important;
  transition: all 0.3s ease !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  text-decoration: none !important;
}

.action-wrapper .pricing-btn a[href="book-now.html"]:hover {
  transform: translateY(-3px) !important;
  box-shadow: 0 14px 40px rgba(75,43,150,0.40) !important;
}

/* ── 12. CERTIFICATION SECTION ── */
.certification-area {
  padding-top: 60px !important;
  padding-bottom: 60px !important;
  background: #f9f7ff !important;
}

.certification-content h2 {
  color: #2d1b5e !important;
  font-size: 1.8rem !important;
  font-weight: 800 !important;
}

.certification-content h2::after {
  background: #ff6201 !important;
  width: 60px !important;
  height: 4px !important;
}

.certification-benefits {
  background: #fff !important;
  border-left: 4px solid #7851a9 !important;
  border-radius: 12px !important;
  padding: 20px 24px !important;
  box-shadow: 0 4px 20px rgba(75,43,150,0.08) !important;
}

.certification-cta .btn.btn-primary {
  background: linear-gradient(135deg, #ff6201 0%, #ff8533 100%) !important;
  border: none !important;
  color: #fff !important;
  padding: 14px 32px !important;
  border-radius: 50px !important;
  font-weight: 700 !important;
  font-size: 15px !important;
  box-shadow: 0 6px 22px rgba(255,98,1,0.30) !important;
  transition: all 0.3s ease !important;
}

.certification-cta .btn.btn-primary:hover {
  transform: translateY(-3px) !important;
  box-shadow: 0 12px 36px rgba(255,98,1,0.40) !important;
}

/* ── 13. FLOATING CALL BUTTON (MOBILE) ── */
#sp-float-call {
  display: none;
  position: fixed;
  bottom: 24px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 9998;
  background: linear-gradient(135deg, #ff6201, #e55800);
  color: #fff;
  font-weight: 700;
  font-size: 16px;
  padding: 15px 36px;
  border-radius: 50px;
  box-shadow: 0 8px 30px rgba(255,98,1,0.45);
  text-decoration: none;
  white-space: nowrap;
  transition: all 0.3s ease;
  animation: floatPulse 2.4s ease-in-out infinite;
}

#sp-float-call i { margin-right: 8px; }

#sp-float-call:hover {
  transform: translateX(-50%) translateY(-4px);
  box-shadow: 0 14px 40px rgba(255,98,1,0.55);
  color: #fff;
}

@keyframes floatPulse {
  0%, 100% { box-shadow: 0 8px 30px rgba(255,98,1,0.45); }
  50% { box-shadow: 0 12px 42px rgba(255,98,1,0.60); }
}

@media (max-width: 767px) {
  #sp-float-call { display: flex; align-items: center; justify-content: center; }
  body { padding-bottom: 80px; }
}

/* ── 14. CAREERS SECTION ── */
.careers-area {
  background: linear-gradient(135deg, #2d1b5e 0%, #1a0f3c 100%) !important;
}

/* ── 15. FOOTER, COMPACT & ELEGANT ── */
.footer-modern {
  background: linear-gradient(160deg, #2d1b5e 0%, #1a0f3c 100%) !important;
  padding: 0 !important;
  position: relative !important;
}

/* Remove bubbles from footer for cleanliness */
.footer-modern .bubbles-container { display: none !important; }

.footer-top {
  padding: 12px 0 8px !important; /* ultra-compact height */
  border-bottom: 1px solid rgba(255,255,255,0.10) !important;
}

/* Equalize 4 columns on desktop for a consistent layout */
@media (min-width: 992px) {
  .footer-top .row {
    display: flex !important;
    flex-wrap: nowrap !important;
  }
  .footer-top .row > div {
    flex: 0 0 25% !important;
    max-width: 25% !important;
    padding-left: 4px !important;  /* reduce bootstrap gutter further */
    padding-right: 4px !important; /* reduce bootstrap gutter further */
  }
}

/* Tighten row container gutters just within footer */
.footer-top .container .row {
  margin-left: -4px !important;
  margin-right: -4px !important;
}

.footer-widget { margin-bottom: 0 !important; }

/* Make all footer menus compact in two columns on desktop (override any grid/list) */
@media (min-width: 992px) {
  .footer-menu {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    column-gap: 4px !important; /* bring items as close as possible */
    row-gap: 0 !important; /* minimal vertical gap between items */
  }
}

@media (max-width: 991px) {
  .footer-menu { display: block !important; }
}

/* Logo in footer */
.footer-logo img {
  max-width: 240px !important; /* larger logo */
  filter: brightness(1.1) !important;
  margin-bottom: 8px !important;
}

/* Footer headings */
.footer-widget h3 {
  font-size: 14px !important; /* compact but clear */
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important; /* reduce heading spacing */
  color: #fff !important;
  margin-bottom: 4px !important;
  padding-bottom: 0 !important;
  border-bottom: 0 !important;
  display: inline-block !important;
}

.footer-widget h3::after { display: none !important; }

/* Footer description text */
.footer-widget > p {
  font-size: 13.5px !important;
  color: rgba(255,255,255,0.60) !important;
  line-height: 1.5 !important; /* tighter */
  margin-top: 6px !important;
  margin-bottom: 8px !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}

/* Footer links */
.footer-menu { padding: 0 !important; margin: 0 !important; }

.footer-menu li { margin-bottom: 0 !important; } /* ultra-tight services/links list */

.footer-menu li a {
  font-size: 13px !important; /* compact links */
  color: rgba(255,255,255,0.70) !important;
  transition: all 0.2s ease !important;
  display: block !important; /* pack lines vertically */
  align-items: center !important;
  gap: 0 !important; /* remove extra space inside link */
  padding: 0 !important;
  line-height: 1.12 !important; /* tighter line-height */
  letter-spacing: 0 !important;
  margin: 0 !important;
}

.footer-menu li a::before {
  content: none !important; /* remove decorative arrow to keep clean text only */
}

.footer-menu li a:hover {
  color: #fff !important;
  padding-left: 4px !important;
}

/* Footer contact items */
.footer-contact-item {
  display: flex !important;
  align-items: center !important; /* align icon beside text */
  gap: 8px !important;
  margin-bottom: 4px !important;
  font-size: 14px !important; /* larger contact text */
}

.footer-contact-item i { display: none !important; }

.footer-contact-item span,
.footer-contact-item a {
  color: rgba(255,255,255,0.72) !important;
  line-height: 1.5 !important;
  transition: color 0.2s ease !important;
}

.footer-contact-item a:hover { color: #ff9a4d !important; }

/* Footer social icons */
.footer-social {
  display: flex !important;
  gap: 8px !important;
  margin-top: 6px !important;
}

.footer-social a {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 30px !important;
  height: 30px !important;
  background: rgba(255,255,255,0.08) !important;
  border: 1px solid rgba(255,255,255,0.18) !important;
  border-radius: 50% !important;
  color: #fff !important;
  font-size: 14px !important;
  transition: all 0.25s ease !important;
}

.footer-social a:hover {
  background: #ff6201 !important;
  border-color: #ff6201 !important;
  transform: translateY(-3px) !important;
  box-shadow: 0 6px 20px rgba(255,98,1,0.30) !important;
}

/* Footer bottom bar */
.footer-bottom {
  background: rgba(0,0,0,0.35) !important;
  padding: 6px 0 !important;
  text-align: center !important;
  margin-top: 6px !important;
}

.footer-bottom p {
  color: rgba(255,255,255,0.42) !important;
  font-size: 11.5px !important;
  margin: 0 !important;
  letter-spacing: 0.03em !important;
}

/* ── 16. ALL PRIMARY BUTTONS (site-wide) ── */
.btn-primary,
a.btn-primary,
.btn.btn-primary {
  background: linear-gradient(135deg, #4b2b96 0%, #7851a9 100%) !important;
  border: none !important;
  color: #fff !important;
  border-radius: 50px !important;
  padding: 13px 30px !important;
  font-weight: 700 !important;
  font-size: 14px !important;
  box-shadow: 0 6px 22px rgba(75,43,150,0.28) !important;
  transition: all 0.3s ease !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.btn-primary:hover,
a.btn-primary:hover,
.btn.btn-primary:hover {
  transform: translateY(-3px) !important;
  box-shadow: 0 12px 36px rgba(75,43,150,0.38) !important;
  background: linear-gradient(135deg, #3d1f7a 0%, #4b2b96 100%) !important;
  color: #fff !important;
}

/* ── 17. SCROLL TO TOP ── */
.scroll-to-top {
  width: 48px !important;
  height: 48px !important;
  background: linear-gradient(135deg, #4b2b96, #7851a9) !important;
  color: #fff !important;
  border-radius: 50% !important;
  box-shadow: 0 6px 24px rgba(75,43,150,0.30) !important;
  border: none !important;
  font-size: 18px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  transition: all 0.3s ease !important;
}

.scroll-to-top:hover {
  transform: translateY(-4px) !important;
  box-shadow: 0 10px 36px rgba(75,43,150,0.40) !important;
  background: linear-gradient(135deg, #ff6201, #ff8533) !important;
}

/* ── 18. CONTACT WIDGET ── */
.contact-toggle-btn {
  background: linear-gradient(135deg, #4b2b96 0%, #7851a9 100%) !important;
  color: #fff !important;
  font-weight: 700 !important;
  font-size: 14px !important;
  border-radius: 50px !important;
  padding: 13px 24px !important;
  border: none !important;
  box-shadow: 0 6px 24px rgba(75,43,150,0.30) !important;
  transition: all 0.3s ease !important;
}

.contact-toggle-btn:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 10px 36px rgba(75,43,150,0.40) !important;
}

.contact-widget-panel {
  border-radius: 20px !important;
  overflow: hidden !important;
  box-shadow: 0 20px 60px rgba(75,43,150,0.20) !important;
  border: 1px solid rgba(120,81,169,0.15) !important;
}

.contact-widget-panel h3 {
  font-size: 1.2rem !important;
  font-weight: 700 !important;
  color: #2d1b5e !important;
}

.contact-widget-panel .btn.btn-primary {
  background: linear-gradient(135deg, #ff6201 0%, #ff8533 100%) !important;
  box-shadow: 0 6px 22px rgba(255,98,1,0.30) !important;
}

.contact-widget-panel .btn.btn-primary:hover {
  box-shadow: 0 10px 36px rgba(255,98,1,0.40) !important;
}

/* ── 19. AOS BOX REMOVAL (was adding white boxes) ── */
[data-aos] {
  background: transparent !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  margin-bottom: 0 !important;
}

section[data-aos],
.container[data-aos],
.row[data-aos] {
  background: transparent !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  margin-bottom: 0 !important;
}

/* ── 20. RESPONSIVE ── */
@media (max-width: 991px) {
  .slider-content h1,
  .slider-text h1 { font-size: 2.4rem !important; }

  h2 { font-size: 1.8rem !important; }

  .Cleaning-wrapper,
  .about-wrapper { padding: 16px 0 !important; }

  .footer-top { padding: 12px 0 8px !important; }
}

@media (max-width: 767px) {
  .slider-content h1,
  .slider-text h1 { font-size: 1.9rem !important; }

  .slider-wrapper { min-height: 380px !important; }

  h2 { font-size: 1.6rem !important; }

  .gradient-divider { height: 64px !important; }

  .gradient-title { font-size: 1.2rem !important; }

  .action-wrapper[style] { padding: 24px !important; }

  .footer-top { padding: 12px 0 8px !important; }
  .footer-logo img { max-width: 160px !important; }
  .footer-widget > p { -webkit-line-clamp: 3 !important; line-clamp: 3 !important; }

  .header-logo a img { height: 56px !important; }
}

@media (max-width: 480px) {
  .slider-content h1,
  .slider-text h1 { font-size: 1.6rem !important; }

  .slider-wrapper { min-height: 300px !important; }

  /* Extra small screens: keep footer compact */
  .footer-logo img { max-width: 150px !important; }
  .footer-top { padding: 10px 0 8px !important; }
}

/* ── 21. SUBTLE SECTION ALTERNATION ── */
.cleaning-area { background: #fff !important; }
.about-area { background: #faf8ff !important; }
.reviews-area { background: linear-gradient(135deg, #f7f4ff 0%, #fff8f3 100%) !important; }
.certification-area { background: #f9f7ff !important; }
.action-area { background: #fff !important; }

/* ── 22. TOP ACCENT BAR ── */
body::before {
  content: '';
  display: block;
  width: 100%;
  height: 4px;
  background: linear-gradient(90deg, #4b2b96 0%, #7851a9 40%, #ff6201 70%, #ffaa66 100%);
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;
}

/* push header below accent bar */
.header-area { top: 4px !important; }