/**
 * Software House Theme – Dark blue gradients, luminous cyan accents, diagonal rhythm, animated
 * Use with style.css. Section backgrounds progress light → darker with professional font colors.
 */

/* ========== Theme palette – section sequence: white → dark → darker → darkest → black → white (repeat) ========== */
:root {
  /* Section background levels (after menu bar) */
  --sh-bg-white: #ffffff;
  --sh-bg-dark: #1a3a5c;
  --sh-bg-darker: #0f2847;
  --sh-bg-darkest: #0a1628;
  --sh-bg-black: #050d18;
  /* Legacy / accents */
  --sh-theme-darkest: #050d18;
  --sh-theme-dark: #0a1628;
  --sh-theme-mid: #0f2847;
  --sh-theme-navy: #1a3a5c;
  --sh-theme-blue: #2c4a6b;
  --sh-theme-accent: #38bdf8;
  --sh-theme-cyan: #7dd3fc;
  --sh-theme-glow: #22d3ee;
  --sh-theme-light: #e0f7ff;
  --sh-theme-cream: #f0f9ff;
  --sh-text-on-dark: #ffffff;
  --sh-text-muted-dark: rgba(255, 255, 255, 0.85);
  --sh-text-accent: #7dd3fc;
  --sh-text-on-white: #0a1628;
}

/* ========== Diagonal stripe + glow background (reusable) ========== */
.section-bg-gradient-dark {
  position: relative;
  overflow: hidden;
}

.section-bg-gradient-dark::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    linear-gradient(135deg, var(--sh-theme-darkest) 0%, var(--sh-theme-dark) 25%, var(--sh-theme-mid) 50%, var(--sh-theme-dark) 75%, var(--sh-theme-darkest) 100%);
  background-size: 200% 200%;
  animation: gradientShift 12s ease infinite;
  z-index: 0;
}

.section-bg-gradient-dark::after {
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    repeating-linear-gradient(
      125deg,
      transparent,
      transparent 80px,
      rgba(56, 189, 248, 0.03) 80px,
      rgba(56, 189, 248, 0.06) 82px
    ),
    repeating-linear-gradient(
      -55deg,
      transparent,
      transparent 120px,
      rgba(125, 211, 252, 0.02) 120px,
      rgba(125, 211, 252, 0.05) 122px
    );
  pointer-events: none;
  z-index: 0;
}

/* Glow lines overlay */
.section-glow-lines {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  opacity: 0.6;
}

.section-glow-lines::before,
.section-glow-lines::after {
  content: '';
  position: absolute;
  width: 200%;
  height: 2px;
  background: linear-gradient(90deg, transparent, var(--sh-theme-cyan), var(--sh-theme-accent), transparent);
  box-shadow: 0 0 20px var(--sh-theme-accent), 0 0 40px rgba(56, 189, 248, 0.3);
  animation: lineShimmer 8s ease-in-out infinite;
}

.section-glow-lines::before {
  top: 20%;
  left: -50%;
  transform: rotate(-15deg);
  animation-delay: 0s;
}

.section-glow-lines::after {
  top: 60%;
  left: -50%;
  transform: rotate(-15deg);
  animation-delay: 2s;
}

.section-glow-lines {
  animation: glowLineOpacity 6s ease-in-out infinite;
}
@keyframes glowLineOpacity {
  0%, 100% { opacity: 0.5; }
  50% { opacity: 0.85; }
}

@keyframes gradientShift {
  0%, 100% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
}

@keyframes lineShimmer {
  0%, 100% { opacity: 0.4; transform: rotate(-15deg) translateX(-10%); }
  50% { opacity: 0.9; transform: rotate(-15deg) translateX(10%); }
}

@keyframes glowPulse {
  0%, 100% { opacity: 0.5; box-shadow: 0 0 20px var(--sh-theme-accent); }
  50% { opacity: 1; box-shadow: 0 0 35px var(--sh-theme-accent), 0 0 60px rgba(56, 189, 248, 0.2); }
}

/* ========== Diagonal lines + glow overlay for non-white sections (contrast scales with section level) ========== */
.sh-section-lines {
  position: relative;
  overflow: hidden;
}

.sh-section-lines::before {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  background-image: repeating-linear-gradient(
    125deg,
    transparent,
    transparent 70px,
    var(--sh-lines-stripe) 70px,
    var(--sh-lines-stripe-strong) 72px
  );
}

.sh-section-lines::after {
  content: '';
  position: absolute;
  left: -20%;
  right: -20%;
  height: 2px;
  top: 35%;
  background: linear-gradient(90deg, transparent, var(--sh-theme-cyan), var(--sh-theme-accent), var(--sh-theme-cyan), transparent);
  box-shadow: 0 0 20px var(--sh-theme-accent), 0 0 45px rgba(56, 189, 248, 0.35);
  transform: rotate(-12deg);
  pointer-events: none;
  z-index: 0;
  animation: lineShimmer 8s ease-in-out infinite;
}

/* Dark section – subtle lines */
#features.about-area.sh-section-lines {
  --sh-lines-stripe: rgba(56, 189, 248, 0.05);
  --sh-lines-stripe-strong: rgba(56, 189, 248, 0.12);
}
#features.about-area.sh-section-lines::after { opacity: 0.55; box-shadow: 0 0 15px var(--sh-theme-accent), 0 0 35px rgba(56, 189, 248, 0.25); }

/* Darker section */
#real-problem-section.sh-section-lines,
#gym-owners-members-section.sh-section-lines {
  --sh-lines-stripe: rgba(56, 189, 248, 0.06);
  --sh-lines-stripe-strong: rgba(56, 189, 248, 0.15);
}
#real-problem-section.sh-section-lines::after,
#gym-owners-members-section.sh-section-lines::after {
  opacity: 0.7;
  box-shadow: 0 0 20px var(--sh-theme-accent), 0 0 45px rgba(56, 189, 248, 0.35);
}

/* Darkest section */
#aure-solution-section.sh-section-lines,
.testimonial-area.bg.sh-section-lines {
  --sh-lines-stripe: rgba(56, 189, 248, 0.08);
  --sh-lines-stripe-strong: rgba(56, 189, 248, 0.18);
}
#aure-solution-section.sh-section-lines::after,
.testimonial-area.bg.sh-section-lines::after {
  opacity: 0.85;
  box-shadow: 0 0 25px var(--sh-theme-accent), 0 0 55px rgba(56, 189, 248, 0.4);
}
.testimonial-area.bg.sh-section-lines::after { animation-delay: 0.5s; }

/* Counter (dark) */
.counter-area.sh-section-lines {
  --sh-lines-stripe: rgba(56, 189, 248, 0.05);
  --sh-lines-stripe-strong: rgba(56, 189, 248, 0.12);
}
.counter-area.sh-section-lines::after { opacity: 0.55; box-shadow: 0 0 15px var(--sh-theme-accent), 0 0 35px rgba(56, 189, 248, 0.25); }

/* ========== Section backgrounds after menu: white → dark → darker → darkest → black → white (repeat) ========== */
/* 1=white, 2=dark, 3=darker, 4=darkest, 5=black, 6=white, 7=dark, 8=darker, 9=darkest, 10=black */

/* Hero overlay – keep dark with cyan accent */
.hero-single::before {
  background: linear-gradient(135deg, rgba(5, 13, 24, 0.85) 0%, rgba(10, 22, 40, 0.9) 50%, rgba(15, 40, 71, 0.85) 100%) !important;
}

.hero-single .hero-content .hero-sub-title {
  color: var(--sh-theme-cyan) !important;
  text-shadow: 0 0 20px rgba(56, 189, 248, 0.3);
}

.hero-single .hero-content .hero-title,
.hero-single .hero-content .hero-title span {
  color: var(--sh-text-on-dark) !important;
}

.hero-single .hero-content .hero-title span {
  background: linear-gradient(135deg, var(--sh-theme-cyan) 0%, var(--sh-theme-accent) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* 1. How It Works – WHITE */
#how-it-works.find-car {
  background: var(--sh-bg-white) !important;
  position: relative;
  z-index: 2;
}

#how-it-works .site-title,
#how-it-works .site-title-tagline,
#how-it-works h3,
#how-it-works p,
#how-it-works .site-title span {
  color: var(--sh-text-on-white) !important;
}

#how-it-works .find-car-form,
#how-it-works .find-car-title,
#how-it-works .find-car-form label,
#how-it-works .find-car-form .form-control,
#how-it-works .find-car-form .form-select {
  color: var(--sh-text-on-white) !important;
}

/* 2. Features – DARK */
#features.about-area {
  background: var(--sh-bg-dark) !important;
  position: relative;
}

#features.about-area .container { position: relative; z-index: 1; }

#features .site-title,
#features .site-title-tagline,
#features .about-text,
#features h3, #features h4, #features h5,
#features .about-list li,
#features .site-title span {
  color: var(--sh-text-on-dark) !important;
}

#features .site-title-tagline { color: var(--sh-theme-light) !important; }

#features .benefit-card-text h5,
#features .benefit-card-text p {
  color: var(--sh-text-on-white) !important;
}

/* 3. THE REAL PROBLEM – DARKER */
#real-problem-section {
  background: var(--sh-bg-darker) !important;
  position: relative;
}

#real-problem-section .section-glow-lines { display: none; }

#real-problem-section.section-bg-gradient-dark::before,
#real-problem-section.section-bg-gradient-dark::after { display: none; }

#real-problem-section .container {
  position: relative;
  z-index: 1;
}

#real-problem-section .site-title,
#real-problem-section .site-title-tagline,
#real-problem-section .site-title span,
#real-problem-section .aure-challenge-tagline,
#real-problem-section .aure-challenge-tagline i,
#real-problem-section .aure-challenge-title,
#real-problem-section .aure-challenge-title-span {
  color: var(--sh-theme-light) !important;
}

#real-problem-section .about-text,
#real-problem-section h2:not(.site-title),
#real-problem-section h3, #real-problem-section h4, #real-problem-section h5,
#real-problem-section p,
#real-problem-section .lead {
  color: var(--sh-text-muted-dark) !important;
}

#real-problem-section .text-center.p-4,
#real-problem-section .text-center.p-4 h5,
#real-problem-section [style*="background: #fff"] h5,
#real-problem-section [style*="background:#fff"] h5 {
  color: var(--sh-text-on-white) !important;
}

#real-problem-section .text-center.p-4 .text-danger {
  color: var(--sh-theme-blue) !important;
}

/* 4. Holtech Solution – DARKEST */
#aure-solution-section,
#holtech-solution-section {
  background: var(--sh-bg-darkest) !important;
  position: relative;
  overflow: hidden;
}

#aure-solution-section .container,
#holtech-solution-section .container { position: relative; z-index: 1; }

#aure-solution-section .site-title,
#aure-solution-section .site-title-tagline,
#aure-solution-section .about-text,
#aure-solution-section h2, #aure-solution-section h3, #aure-solution-section h4, #aure-solution-section h5,
#aure-solution-section p,
#aure-solution-section .site-title span,
#holtech-solution-section .site-title,
#holtech-solution-section .site-title-tagline,
#holtech-solution-section .about-text,
#holtech-solution-section h2, #holtech-solution-section h3, #holtech-solution-section h4, #holtech-solution-section h5,
#holtech-solution-section p,
#holtech-solution-section .site-title span {
  color: var(--sh-text-on-dark) !important;
}

#aure-solution-section .site-title-tagline,
#holtech-solution-section .site-title-tagline { color: var(--sh-theme-cyan) !important; }

/* Holtech solution cards – dark section: card bg + light text */
#holtech-solution-section .solution-card {
  background: rgba(26, 58, 92, 0.5) !important;
  border: 2px solid rgba(125, 211, 252, 0.2) !important;
}
#holtech-solution-section .solution-card h4 {
  color: var(--sh-text-on-dark) !important;
}
#holtech-solution-section .solution-card p {
  color: var(--sh-text-muted-dark) !important;
}

/* Solution cards – subtle glow on hover */
.solution-card:hover {
  box-shadow: 0 0 30px rgba(56, 189, 248, 0.2), 0 20px 50px rgba(0, 0, 0, 0.3) !important;
  border-color: var(--sh-theme-accent) !important;
}

.solution-card:hover h4 { color: var(--sh-theme-cyan) !important; }

/* 5. Choose area – plain black (no lines) */
.choose-area {
  background: #000000 !important;
}

.choose-area .site-title,
.choose-area .site-title-tagline,
.choose-area .site-title span {
  color: var(--sh-text-on-dark) !important;
}

.choose-area .choose-item h3,
.choose-area .choose-item p,
.choose-area .choose-item-info * {
  color: var(--sh-text-on-white) !important;
}

.choose-area .choose-item {
  background: var(--sh-bg-white) !important;
}

/* 6. Features Snapshot – WHITE (black text) */
#features-snapshot-section {
  background: var(--sh-bg-white) !important;
}

#features-snapshot-section .site-title,
#features-snapshot-section .site-title-tagline,
#features-snapshot-section h2, #features-snapshot-section h3, #features-snapshot-section h4,
#features-snapshot-section .site-title span {
  color: var(--sh-text-on-white) !important;
}

#features-snapshot-section .p-4 h4,
#features-snapshot-section .p-4 p {
  color: var(--sh-text-on-white) !important;
}
#features-snapshot-section .p-4 .text-danger {
  color: var(--sh-theme-blue) !important;
}

/* 7. Counter – WHITE (again, after black) */
.counter-area {
  background: var(--sh-bg-white) !important;
  position: relative;
  overflow: hidden;
}

/* Diagonal lines + glow from .sh-section-lines */

.counter-area .counter-title {
  color: var(--sh-text-on-white) !important;
}
.counter-area .counter-number,
.counter-area .counter-suffix {
  color: var(--sh-theme-blue) !important;
}

/* 8. Businesses & End Users (Choose Us) – DARK */
#gym-owners-members-section,
#businesses-users-section {
  background: var(--sh-bg-dark) !important;
  position: relative;
}

#gym-owners-members-section .section-glow-lines,
#businesses-users-section .section-glow-lines { display: none; }

#gym-owners-members-section.section-bg-gradient-dark::before,
#gym-owners-members-section.section-bg-gradient-dark::after,
#businesses-users-section.section-bg-gradient-dark::before,
#businesses-users-section.section-bg-gradient-dark::after { display: none; }

#gym-owners-members-section .container,
#businesses-users-section .container { position: relative; z-index: 1; }

#gym-owners-members-section .site-title,
#gym-owners-members-section .site-title-tagline,
#gym-owners-members-section .about-text,
#gym-owners-members-section h2, #gym-owners-members-section h3, #gym-owners-members-section h4, #gym-owners-members-section h5,
#gym-owners-members-section .about-list li,
#gym-owners-members-section .site-title span,
#businesses-users-section .site-title,
#businesses-users-section .site-title-tagline,
#businesses-users-section .about-text,
#businesses-users-section h2, #businesses-users-section h3, #businesses-users-section h4, #businesses-users-section h5,
#businesses-users-section .about-list li,
#businesses-users-section .site-title span {
  color: var(--sh-text-on-dark) !important;
}

#gym-owners-members-section .site-title-tagline,
#businesses-users-section .site-title-tagline {
  color: var(--sh-theme-cyan) !important;
}
#businesses-users-section .owner-feature-card p,
#businesses-users-section .member-feature-card p {
  color: var(--sh-text-muted-dark) !important;
}

/* Businesses section cards – dark section: card bg with light text */
#businesses-users-section .owner-feature-card,
#businesses-users-section .member-feature-card {
  background: rgba(15, 40, 71, 0.6) !important;
  border: 2px solid rgba(125, 211, 252, 0.2) !important;
}
#businesses-users-section .owner-feature-card h5,
#businesses-users-section .member-feature-card h5 {
  color: var(--sh-text-on-dark) !important;
}

.owner-feature-card:hover h5,
.member-feature-card:hover h5 {
  color: var(--sh-theme-cyan) !important;
}

#gym-owners-members-section .theme-btn,
#businesses-users-section .theme-btn {
  background: var(--sh-theme-blue) !important;
  color: #fff !important;
  border: 2px solid transparent !important;
}

#gym-owners-members-section .theme-btn:hover,
#businesses-users-section .theme-btn:hover {
  color: var(--sh-theme-dark) !important;
  box-shadow: 0 0 25px rgba(56, 189, 248, 0.5);
}

/* 9. Testimonial – WHITE section + white tiles */
.testimonial-area,
.testimonial-area.bg {
  background: var(--sh-bg-white) !important;
  position: relative;
}

.testimonial-area .testimonial-single {
  background: #fff !important;
  border: 1px solid rgba(44, 74, 107, 0.1);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.06);
}

.testimonial-area .site-title,
.testimonial-area .site-title-tagline,
.testimonial-area .site-title span {
  color: var(--sh-text-on-white) !important;
}

.testimonial-area .site-title-tagline { color: var(--sh-theme-blue) !important; }

.testimonial-area .testimonial-author-info h4,
.testimonial-area .testimonial-author-info p,
.testimonial-area .testimonial-quote p {
  color: var(--sh-text-on-white) !important;
}

.testimonial-area .testimonial-author-info p {
  color: var(--sh-theme-blue) !important;
}

.testimonial-area .testimonial-single:hover {
  border-color: var(--sh-theme-blue);
  box-shadow: 0 15px 40px rgba(44, 74, 107, 0.15);
}

/* 10. Footer – BLACK */
.footer-area {
  background: var(--sh-bg-black) !important;
}

.footer-area .footer-widget-title,
.footer-area .footer-list a,
.footer-area .footer-contact li,
.footer-area .footer-contact a {
  color: var(--sh-theme-light) !important;
}

.footer-area .footer-list a:hover,
.footer-area .footer-contact a:hover {
  color: var(--sh-theme-cyan) !important;
}

.footer-area .footer-copyright,
.footer-area .footer-copyright a {
  color: var(--sh-text-muted-dark) !important;
}

/* Footer 3-column grid layout */
.footer-area .footer-widget-wrapper {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 3rem;
  align-items: start;
  max-width: 1100px;
  margin: 0 auto;
}
.footer-area .footer-widget-box.about-us p {
  font-size: 0.95rem;
  line-height: 1.7;
  color: rgba(255,255,255,0.9) !important;
  margin-bottom: 1.5rem;
}
.footer-area .footer-widget-title {
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  margin-bottom: 1.25rem;
  padding-bottom: 0.75rem;
  border-bottom: 1px solid rgba(255,255,255,0.15);
}
.footer-area .footer-list li a {
  font-size: 0.95rem;
  transition: all 0.25s ease;
}
.footer-area .footer-list li a:hover {
  padding-left: 8px !important;
  color: var(--sh-theme-cyan) !important;
}
.footer-area .footer-list li a i {
  margin-right: 8px;
  opacity: 0.7;
  font-size: 0.75rem;
}
.footer-area .footer-contact li {
  font-size: 0.95rem;
  margin-bottom: 0.75rem;
}
.footer-area .footer-social-column {
  flex-direction: column;
  gap: 8px;
}
.footer-area .footer-social-column li a {
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  background: rgba(255,255,255,0.08);
  transition: all 0.25s ease;
}
.footer-area .footer-social-column li a:hover {
  background: rgba(143, 175, 207, 0.3);
  transform: translateY(-2px);
}
@media (max-width: 991px) {
  .footer-area .footer-widget-wrapper {
    grid-template-columns: 1fr;
    gap: 2.5rem;
  }
}

/* Header top – align with theme */
.header-top {
  background: var(--sh-theme-dark) !important;
}

.header-top::before,
.header-top::after {
  background: var(--sh-theme-blue) !important;
}

.header-top-contact a:hover,
.header-top-social a:hover {
  color: var(--sh-theme-cyan) !important;
}

.header-top-contact a i,
.header-top-social a:hover {
  color: var(--sh-theme-accent) !important;
}

/* Buttons – theme colors with consistent hover (white fill, dark text) */
.theme-btn {
  background: var(--sh-theme-blue) !important;
  color: #fff !important;
  border: 2px solid transparent !important;
  transition: all 0.4s ease, box-shadow 0.4s ease;
}

.theme-btn2 {
  background: transparent !important;
  color: #fff !important;
  border: 2px solid rgba(255,255,255,0.6) !important;
}

.theme-btn:hover,
.theme-btn2:hover {
  color: var(--sh-theme-dark) !important;
  background: #fff !important;
  border-color: #fff !important;
  box-shadow: 0 0 20px rgba(56, 189, 248, 0.4);
}

/* Hero slider buttons – on dark overlay */
.hero-area .theme-btn {
  background: var(--sh-theme-blue) !important;
  color: #fff !important;
}
.hero-area .theme-btn2 {
  background: transparent !important;
  color: #fff !important;
  border: 2px solid rgba(255,255,255,0.7) !important;
}
.hero-area .theme-btn:hover,
.hero-area .theme-btn2:hover {
  background: #fff !important;
  color: var(--sh-theme-dark) !important;
}

/* Light sections (how-it-works, features, counter) – navy button */
#how-it-works .theme-btn,
#features .theme-btn,
.counter-area .theme-btn {
  background: var(--sh-theme-blue) !important;
  color: #fff !important;
}

/* Dark sections – light/accent button (Holtech Solution, Features Snapshot) */
#holtech-solution-section .theme-btn {
  background: #8FAFCF !important;
  color: var(--sh-theme-dark) !important;
}
#holtech-solution-section .theme-btn:hover {
  background: #fff !important;
  color: var(--sh-theme-dark) !important;
}

#features-snapshot-section .theme-btn {
  background: var(--sh-theme-blue) !important;
  color: #fff !important;
}
#features-snapshot-section .theme-btn:hover {
  background: #fff !important;
  color: var(--sh-theme-dark) !important;
  border-color: var(--sh-theme-blue) !important;
}

/* Benefit & card hovers – cyan accent */
.benefit-card-text:hover {
  border-left-color: var(--sh-theme-accent) !important;
  box-shadow: 0 15px 40px rgba(56, 189, 248, 0.2) !important;
}

.benefit-card-text:hover h5 { color: var(--sh-theme-blue) !important; }

/* Scroll top button */
#scroll-top {
  background: linear-gradient(135deg, var(--sh-theme-blue) 0%, var(--sh-theme-dark) 100%) !important;
  box-shadow: 0 0 20px rgba(56, 189, 248, 0.3);
}

#scroll-top:hover {
  box-shadow: 0 0 30px rgba(56, 189, 248, 0.5);
}

/* Preloader */
.preloader {
  background: var(--sh-theme-darkest) !important;
}

.loader-ripple div {
  border-color: var(--sh-theme-accent) !important;
  animation: loader-ripple 1s cubic-bezier(0, 0.2, 0.8, 1) infinite;
}

/* Text selection */
::selection {
  background: var(--sh-theme-accent);
  color: var(--sh-theme-dark);
}

/* Navbar on scroll / sticky – dark tint */
.navbar.sticky {
  background: rgba(5, 13, 24, 0.98) !important;
  box-shadow: 0 0 30px rgba(56, 189, 248, 0.08);
}

.navbar .navbar-nav .nav-link:hover {
  color: var(--sh-theme-cyan) !important;
}

.navbar .navbar-nav .nav-link.active {
  color: var(--sh-theme-blue) !important;
}

/* ========== Features page – same flow: white → dark → darker → darkest → black → white ========== */

/* 1. Page Intro – WHITE */
#features-page-intro {
  background: var(--sh-bg-white) !important;
}

#features-page-intro .site-title,
#features-page-intro .site-title-tagline,
#features-page-intro .about-text,
#features-page-intro .site-title span {
  color: var(--sh-text-on-white) !important;
}

/* 2. Step-by-Step Process – DARK */
#features-process {
  background: var(--sh-bg-dark) !important;
}

#features-process .container {
  position: relative;
  z-index: 1;
}

#features-process.warranty-benefits-area::before { display: none; }

#features-process {
  --sh-lines-stripe: rgba(56, 189, 248, 0.05);
  --sh-lines-stripe-strong: rgba(56, 189, 248, 0.12);
}

#features-process .site-title,
#features-process .site-title-tagline,
#features-process .site-title span {
  color: var(--sh-text-on-dark) !important;
}

#features-process .benefit-card {
  background: rgba(255, 255, 255, 0.95) !important;
}

#features-process .benefit-content h4,
#features-process .benefit-content p,
#features-process .benefit-content li {
  color: var(--sh-text-on-white) !important;
}

#features-process .benefit-icon i { color: #fff !important; }

#features-process.sh-section-lines::after {
  opacity: 0.55;
  box-shadow: 0 0 15px var(--sh-theme-accent), 0 0 35px rgba(56, 189, 248, 0.25);
  top: auto;
  bottom: 15%;
}

/* 3. Security & Anti-Fraud – DARKER (DIGITAL INTEGRITY) */
#features-security {
  background: var(--sh-bg-darker) !important;
}

#features-security .container {
  position: relative;
  z-index: 1;
}

#features-security {
  --sh-lines-stripe: rgba(56, 189, 248, 0.06);
  --sh-lines-stripe-strong: rgba(56, 189, 248, 0.15);
}

#features-security .site-title,
#features-security .site-title-tagline,
#features-security .about-text,
#features-security .site-title span {
  color: var(--sh-text-on-dark) !important;
}

#features-security .site-title-tagline { color: var(--sh-theme-cyan) !important; }

#features-security.sh-section-lines::after {
  opacity: 0.7;
  box-shadow: 0 0 20px var(--sh-theme-accent), 0 0 45px rgba(56, 189, 248, 0.35);
  top: auto;
  bottom: 15%;
}

/* 4. Why It's Reliable – DARKEST */
#why-reliable-section {
  background: var(--sh-bg-darkest) !important;
}

#why-reliable-section .container {
  position: relative;
  z-index: 1;
}

#why-reliable-section.warranty-benefits-area::before { display: none; }

#why-reliable-section {
  --sh-lines-stripe: rgba(56, 189, 248, 0.08);
  --sh-lines-stripe-strong: rgba(56, 189, 248, 0.18);
}

#why-reliable-section .site-title,
#why-reliable-section .site-title-tagline,
#why-reliable-section .site-title span {
  color: var(--sh-text-on-dark) !important;
}

#why-reliable-section .site-title-tagline { color: var(--sh-theme-cyan) !important; }

#why-reliable-section.sh-section-lines::after {
  opacity: 0.85;
  box-shadow: 0 0 25px var(--sh-theme-accent), 0 0 55px rgba(56, 189, 248, 0.4);
  animation-delay: 0.5s;
}

/* 5. Solutions & Use Cases – BLACK */
#features-solutions {
  background: var(--sh-bg-black) !important;
  position: relative;
}

#features-solutions {
  --sh-lines-stripe: rgba(56, 189, 248, 0.05);
  --sh-lines-stripe-strong: rgba(56, 189, 248, 0.12);
}

#features-solutions.sh-section-lines::after {
  opacity: 0.6;
  box-shadow: 0 0 15px var(--sh-theme-accent), 0 0 35px rgba(56, 189, 248, 0.25);
}

#features-solutions .site-title,
#features-solutions .site-title-tagline,
#features-solutions .about-text,
#features-solutions .site-title span {
  color: var(--sh-text-on-dark) !important;
}

#features-solutions .site-title-tagline { color: var(--sh-theme-cyan) !important; }

#features-solutions .benefit-card {
  background: rgba(255, 255, 255, 0.95) !important;
}

#features-solutions .benefit-content h4,
#features-solutions .benefit-content p,
#features-solutions .benefit-content li {
  color: var(--sh-text-on-white) !important; /* dark text on white cards */
}

#features-solutions .benefit-icon {
  background: linear-gradient(135deg, var(--sh-theme-blue), var(--sh-theme-dark)) !important;
}

#features-solutions .benefit-icon i { color: #fff !important; }

/* 6. Why This Approach – WHITE (repeat, after black) */
#features-difference {
  background: var(--sh-bg-white) !important;
  position: relative;
}

#features-difference .site-title,
#features-difference .site-title-tagline,
#features-difference .site-title span {
  color: var(--sh-text-on-white) !important;
}

#features-difference .benefit-card-text {
  background: rgba(248, 250, 252, 0.98) !important;
  border-color: rgba(10, 22, 40, 0.15) !important;
}

#features-difference .benefit-card-text h5,
#features-difference .benefit-card-text p {
  color: var(--sh-text-on-white) !important;
}

/* 7. FAQ – DARK */
#features-faq {
  background: var(--sh-bg-dark) !important;
}

#features-faq.warranty-faq-area::before { display: none; }

#features-faq {
  --sh-lines-stripe: rgba(56, 189, 248, 0.05);
  --sh-lines-stripe-strong: rgba(56, 189, 248, 0.12);
}

#features-faq .site-title,
#features-faq .site-title-tagline,
#features-faq .about-text,
#features-faq .site-title span {
  color: var(--sh-text-on-dark) !important;
}

#features-faq .site-title-tagline { color: var(--sh-theme-cyan) !important; }

#features-faq .accordion-item {
  background: rgba(255, 255, 255, 0.95) !important;
}

#features-faq .accordion-button {
  color: var(--sh-text-on-white) !important;
}

#features-faq .accordion-body {
  color: var(--sh-text-on-white) !important;
}

#features-faq .accordion-button:not(.collapsed) {
  color: var(--sh-text-on-dark) !important;
  background: linear-gradient(135deg, var(--sh-theme-blue), var(--sh-theme-dark)) !important;
}

#features-faq .accordion-button:not(.collapsed) span i {
  color: var(--sh-theme-cyan) !important;
}

#features-faq.sh-section-lines::after { opacity: 0.55; box-shadow: 0 0 15px var(--sh-theme-accent), 0 0 35px rgba(56, 189, 248, 0.25); }

/* ========== Portfolio page – same flow: white → dark → darker → darkest (gradient lines) ========== */

/* 1. Portfolio Intro – WHITE */
#portfolio-hero {
  background: var(--sh-bg-white) !important;
}

#portfolio-hero .site-title,
#portfolio-hero .site-title-tagline,
#portfolio-hero .about-text,
#portfolio-hero .site-title span {
  color: var(--sh-text-on-white) !important;
}

/* 2. Portfolio Projects – DARK */
#portfolio-projects {
  background: var(--sh-bg-dark) !important;
  position: relative;
}

#portfolio-projects .container {
  position: relative;
  z-index: 1;
}

#portfolio-projects {
  --sh-lines-stripe: rgba(56, 189, 248, 0.05);
  --sh-lines-stripe-strong: rgba(56, 189, 248, 0.12);
}

#portfolio-projects .site-title,
#portfolio-projects .site-title-tagline,
#portfolio-projects .about-text,
#portfolio-projects .site-title span {
  color: var(--sh-text-on-dark) !important;
}

#portfolio-projects .site-title-tagline {
  color: var(--sh-theme-cyan) !important;
}

#portfolio-projects .pricing-card {
  background: rgba(255, 255, 255, 0.95) !important;
}

#portfolio-projects .pricing-card h3,
#portfolio-projects .pricing-card p {
  color: var(--sh-text-on-white) !important;
}

#portfolio-projects.sh-section-lines::after {
  opacity: 0.55;
  box-shadow: 0 0 15px var(--sh-theme-accent), 0 0 35px rgba(56, 189, 248, 0.25);
}

/* 3. Portfolio CTA – WHITE */
#portfolio-cta {
  background: var(--sh-bg-white) !important;
  position: relative;
}

#portfolio-cta .container {
  position: relative;
  z-index: 1;
}

#portfolio-cta .site-title,
#portfolio-cta .site-title-tagline,
#portfolio-cta .about-text,
#portfolio-cta .site-title span {
  color: var(--sh-text-on-white) !important;
}

#portfolio-cta .site-title-tagline,
#portfolio-cta .site-title span {
  color: var(--sh-theme-blue) !important;
}

/* 4. Portfolio Banner – LIGHT (increased height, button visible) */
#portfolio-banner {
  background: rgba(143, 175, 207, 0.35) !important;
  position: relative;
  min-height: 140px;
  padding-top: 50px !important;
  padding-bottom: 50px !important;
  display: flex;
  align-items: center;
  border-top: 1px solid rgba(44, 74, 107, 0.15);
}

#portfolio-banner .container {
  width: 100%;
}

#portfolio-banner .row {
  align-items: center;
}

#portfolio-banner p {
  color: var(--sh-text-on-white) !important;
  margin: 0 !important;
}

#portfolio-banner .theme-btn {
  display: inline-block !important;
  padding: 14px 32px !important;
  white-space: nowrap;
}

/* ========== Pricing page – same flow: white → dark → darker → darkest ========== */

/* 1. Pricing Intro – WHITE */
#pricing-intro-section {
  background: var(--sh-bg-white) !important;
}

#pricing-intro-section .site-title,
#pricing-intro-section .site-title-tagline,
#pricing-intro-section .about-text,
#pricing-intro-section .site-title span {
  color: var(--sh-text-on-white) !important;
}

/* 2. Pricing Cards – DARK */
#pricing-cards-section {
  background: var(--sh-bg-dark) !important;
}

#pricing-cards-section .container {
  position: relative;
  z-index: 1;
}

#pricing-cards-section {
  --sh-lines-stripe: rgba(56, 189, 248, 0.05);
  --sh-lines-stripe-strong: rgba(56, 189, 248, 0.12);
}

#pricing-cards-section > .container > .row:last-child h4,
#pricing-cards-section > .container > .row:last-child p {
  color: var(--sh-text-on-dark) !important;
}

#pricing-cards-section > .container > .row:last-child .col-md-6 p {
  color: var(--sh-text-on-dark) !important;
}

#pricing-cards-section.sh-section-lines::after { opacity: 0.55; box-shadow: 0 0 15px var(--sh-theme-accent), 0 0 35px rgba(56, 189, 248, 0.25); }

/* 3. Value Calculator – DARKER */
#value-calculator-section {
  background: var(--sh-bg-darker) !important;
}

#value-calculator-section .container {
  position: relative;
  z-index: 1;
}

#value-calculator-section {
  --sh-lines-stripe: rgba(56, 189, 248, 0.06);
  --sh-lines-stripe-strong: rgba(56, 189, 248, 0.15);
}

#value-calculator-section .site-title,
#value-calculator-section .site-title-tagline,
#value-calculator-section .about-text,
#value-calculator-section .site-title span {
  color: var(--sh-text-on-dark) !important;
}

#value-calculator-section .site-title-tagline { color: var(--sh-theme-cyan) !important; }

#value-calculator-section .theme-btn {
  background: linear-gradient(135deg, var(--sh-theme-blue), var(--sh-theme-dark)) !important;
  color: var(--sh-text-on-dark) !important;
}

#value-calculator-section [style*="background: #fff"] h4,
#value-calculator-section [style*="background: #fff"] li span {
  color: var(--sh-text-on-white) !important;
}

#value-calculator-section.sh-section-lines::after {
  opacity: 0.7;
  box-shadow: 0 0 20px var(--sh-theme-accent), 0 0 45px rgba(56, 189, 248, 0.35);
}

/* 4. Pricing FAQ – WHITE */
#pricing-faq-section {
  background: var(--sh-bg-white) !important;
}

#pricing-faq-section .site-title,
#pricing-faq-section .site-title-tagline,
#pricing-faq-section .about-text,
#pricing-faq-section .site-title span {
  color: var(--sh-text-on-white) !important;
}

#pricing-faq-section .accordion-button {
  color: var(--sh-text-on-white) !important;
}

#pricing-faq-section .accordion-body {
  color: var(--sh-text-on-white) !important;
}

/* ========== About page – same sequence as index: white → dark → darker → darkest → black → white ========== */

/* 1. About AURE – WHITE */
#about-holtech-section {
  background: var(--sh-bg-white) !important;
}

#about-holtech-section.welcome-area::before { display: none; }

#about-holtech-section .site-title,
#about-holtech-section .site-title-tagline,
#about-holtech-section .site-title span,
#about-holtech-section .welcome-text {
  color: var(--sh-text-on-white) !important;
}

#about-holtech-section .welcome-list-item h5,
#about-holtech-section .welcome-list-item p {
  color: var(--sh-text-on-white) !important;
}

/* 2. Why AURE – DARK (same first light blue as index #features) */
#why-holtech-section {
  background: var(--sh-bg-dark) !important;
  position: relative;
}

#why-holtech-section .container {
  position: relative;
  z-index: 1;
}

#why-holtech-section {
  --sh-lines-stripe: rgba(56, 189, 248, 0.05);
  --sh-lines-stripe-strong: rgba(56, 189, 248, 0.12);
}

#why-holtech-section .site-title,
#why-holtech-section .site-title-tagline,
#why-holtech-section .site-title span {
  color: var(--sh-text-on-dark) !important;
}

#why-holtech-section .site-title-tagline { color: var(--sh-theme-light) !important; }

#why-holtech-section .team-item {
  background: #fff !important;
}

#why-holtech-section .team-bio h4,
#why-holtech-section .team-bio p {
  color: var(--sh-text-on-white) !important;
}

#why-holtech-section.sh-section-lines::after { opacity: 0.55; box-shadow: 0 0 15px var(--sh-theme-accent), 0 0 35px rgba(56, 189, 248, 0.25); }

/* 3. Our Story – DARKER */
#our-story-section {
  background: var(--sh-bg-darker) !important;
}

#our-story-section .container {
  position: relative;
  z-index: 1;
}

#our-story-section {
  --sh-lines-stripe: rgba(56, 189, 248, 0.06);
  --sh-lines-stripe-strong: rgba(56, 189, 248, 0.15);
}

#our-story-section .site-title,
#our-story-section .site-title-tagline,
#our-story-section .about-text,
#our-story-section .site-title span {
  color: var(--sh-text-on-dark) !important;
}

#our-story-section .site-title-tagline { color: var(--sh-theme-cyan) !important; }

#our-story-section .core-value-card h5,
#our-story-section .core-value-card p {
  color: var(--sh-text-on-dark) !important;
}

#our-story-section.sh-section-lines::after {
  opacity: 0.7;
  box-shadow: 0 0 20px var(--sh-theme-accent), 0 0 45px rgba(56, 189, 248, 0.35);
}

/* 4. About Counter – WHITE (black font) */
#about-counter-section {
  background: var(--sh-bg-white) !important;
}

#about-counter-section .counter-title,
#about-counter-section .counter-number,
#about-counter-section .counter-suffix {
  color: var(--sh-text-on-white) !important;
}

/* 5. About Testimonial – BLACK (plain, no lines) */
#about-testimonial-section {
  background: #000000 !important;
}

#about-testimonial-section .site-title,
#about-testimonial-section .site-title-tagline,
#about-testimonial-section .site-title span {
  color: var(--sh-text-on-dark) !important;
}

#about-testimonial-section .site-title-tagline { color: var(--sh-theme-cyan) !important; }

#about-testimonial-section .testimonial-single {
  background: #fff !important;
}

#about-testimonial-section .testimonial-author-info h4,
#about-testimonial-section .testimonial-author-info p,
#about-testimonial-section .testimonial-quote p {
  color: var(--sh-text-on-white) !important;
}

/* 6. About FAQ – WHITE (repeat) */
#about-faq-section {
  background: var(--sh-bg-white) !important;
}

#about-faq-section .site-title,
#about-faq-section .site-title-tagline,
#about-faq-section .about-text,
#about-faq-section .site-title span {
  color: var(--sh-text-on-white) !important;
}

#about-faq-section .accordion-button,
#about-faq-section .accordion-body {
  color: var(--sh-text-on-white) !important;
}

/* ========== Contact page – same sequence: white → dark → darker ========== */

/* 1. Contact Intro – WHITE */
#contact-intro-section {
  background: var(--sh-bg-white) !important;
}

#contact-intro-section .site-title,
#contact-intro-section .site-title-tagline,
#contact-intro-section .site-title span,
#contact-intro-section .about-text {
  color: var(--sh-text-on-white) !important;
}

#contact-intro-section [style*="color: #333"],
#contact-intro-section [style*="color:#333"] {
  color: var(--sh-text-on-white) !important;
}

#contact-intro-section h5,
#contact-intro-section p {
  color: var(--sh-text-on-white) !important;
}

/* 2. Contact area – DARK (same first light blue as index) */
#contact-main-section {
  background: var(--sh-bg-dark) !important;
}

#contact-main-section.contact-area::before { display: none; }

#contact-main-section .container {
  position: relative;
  z-index: 1;
}

#contact-main-section .contact-form-header h2,
#contact-main-section .contact-form-header p {
  color: var(--sh-text-on-dark) !important;
}

#contact-main-section .contact-info {
  background: rgba(255, 255, 255, 0.95) !important;
}

#contact-main-section .contact-info-content h5,
#contact-main-section .contact-info-content p,
#contact-main-section .contact-info-content a {
  color: var(--sh-text-on-white) !important;
}

#contact-main-section .contact-info-content a:hover {
  color: var(--sh-theme-cyan) !important;
}

#contact-main-section .form-control {
  color: #000000 !important;
  background: #ffffff !important;
  border-color: rgba(0, 0, 0, 0.2) !important;
}

#contact-main-section .form-control::placeholder {
  color: #333333 !important;
}

#contact-main-section .form-control:focus {
  border-color: var(--sh-theme-accent) !important;
  color: #000000 !important;
}

/* Index counter: white/light bg with black text for visibility */
#index-counter-section.counter-area {
  background: #ffffff !important;
}

#index-counter-section.counter-area .counter-title,
#index-counter-section.counter-area .counter-number,
#index-counter-section.counter-area .counter-suffix,
#index-counter-section.counter-area .counter-number .counter,
#index-counter-section.counter-area .counter-number .counter-suffix,
#index-counter-section.counter-area h6 {
  color: #000000 !important;
}

#index-counter-section.counter-area .counter-icon i {
  color: #ffffff !important;
}

#index-counter-section.counter-area .counter-icon {
  background: linear-gradient(135deg, #2C4A6B, #0A1628) !important;
}

/* ========== Static breadcrumb (no video) – navy theme #2C4A6B / #0A1628 ========== */
.site-breadcrumb.site-breadcrumb-static {
  position: relative;
  overflow: hidden;
  height: 320px !important;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, #0A1628 0%, #1a3a5c 35%, #2C4A6B 70%, #0A1628 100%);
}
.site-breadcrumb-static::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image: repeating-linear-gradient(
    125deg,
    transparent,
    transparent 70px,
    rgba(44, 74, 107, 0.15) 70px,
    rgba(44, 74, 107, 0.25) 82px
  );
  pointer-events: none;
  z-index: 1;
}
.site-breadcrumb-static::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(143, 175, 207, 0.6), transparent);
  pointer-events: none;
  z-index: 1;
}
.site-breadcrumb-static .container {
  position: relative;
  z-index: 2;
}
.site-breadcrumb-static .breadcrumb-title,
.site-breadcrumb-static .breadcrumb-menu,
.site-breadcrumb-static .breadcrumb-menu li,
.site-breadcrumb-static .breadcrumb-menu li a,
.site-breadcrumb-static .breadcrumb-menu li:not(:last-child)::after {
  color: #ffffff !important;
}
.site-breadcrumb-static .breadcrumb-menu li.active {
  color: rgba(143, 175, 207, 0.95) !important;
}
@media (max-width: 768px) {
  .site-breadcrumb-static {
    height: 260px;
  }
}