/* style.css */

/* -----------------------------------------
   Theme Variables
   Cool tones, crisp edges, and enough polish
   to make dust feel unwelcome.
----------------------------------------- */
:root {
  --primary: #25c3ff;
  --primary-dark: #1298cc;
  --secondary: #51a4fd;
  --dark: #08111f;
  --dark-2: #1152b9;
  --light: #f4fbff;
  --muted: #9db2c7;
  
  --white: #ffffff;
  --success: #26d07c;
  --shadow: 0 20px 50px rgba(0, 0, 0, 0.18);
  --radius-lg: 1.5rem;
  --radius-md: 1rem;
}

html {
  scroll-behavior: smooth;
}

body {
  background:
    radial-gradient(circle at top right, rgba(37, 195, 255, 0.08), transparent 25%),
    linear-gradient(180deg, #07101d 0%, #0a1728 45%, #eef7fc 45%, #f7fcff 100%);
  color: #12263a;
  font-family: "Inter", "Segoe UI", Arial, sans-serif;
}

a {
  text-decoration: none;
}
.bg-muted1{background-color: #ebf0f5;}
.section-padding {
  padding: 90px 0;
}

.section-title {
  font-size: clamp(.8rem, 2vw, 2rem);
  font-weight: 800;
  line-height: 1.1;
  margin-bottom: 1rem;
}

.section-subtitle {
  color: var(--muted);
}

.text-brand {
  color: var(--primary);
}

.bg-deep {
  background: var(--dark);
}

.bg-deep-soft {
  background: linear-gradient(180deg, var(--secondary), var(--dark-2));
}

.card-glass {
  background: rgba(255, 255, 255, 0.06);
  backdrop-filter: blur(12px);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow);
}

.card-clean {
  background: var(--white);
  border: 1px solid rgba(18, 38, 58, 0.08);
  border-radius: var(--radius-lg);
  box-shadow: 0 18px 40px rgba(13, 27, 42, 0.06);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.card-clean:hover {
  transform: translateY(-8px);
  box-shadow: 0 24px 50px rgba(13, 27, 42, 0.12);
}

.btn-brand {
  background: linear-gradient(135deg, var(--primary), #63d8ff);
  border: none;
  color: var(--dark);
  font-weight: 700;
  padding: 0.95rem 1.4rem;
  border-radius: 999px;
  box-shadow: 0 14px 30px rgba(37, 195, 255, 0.25);
}

.btn-brand:hover {
  background: linear-gradient(135deg, #63d8ff, var(--primary));
  color: var(--dark);
}

.btn-outline-light-soft {
  border: 1px solid rgba(255, 255, 255, 0.25);
  color: var(--white);
  border-radius: 999px;
  padding: 0.95rem 1.4rem;
  font-weight: 600;
}

.btn-outline-light-soft:hover {
  background: rgba(255, 255, 255, 0.08);
  color: var(--white);
}

/* -----------------------------------------
   Navbar
----------------------------------------- */
.navbar-airduct {
  background: rgba(4, 28, 65, 0.85);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.navbar-airduct .navbar-brand {
  color: var(--white);
  font-weight: 800;
  letter-spacing: 0.4px;
}

.navbar-airduct .nav-link {
  color: rgba(255, 255, 255, 0.82);
  font-weight: 500;
  margin: 0 0.4rem;
}

.navbar-airduct .nav-link:hover,
.navbar-airduct .nav-link.active {
  color: var(--primary);
}

.brand-badge {
  width: 46px;
  height: 46px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 14px;
  background: linear-gradient(135deg, rgba(37, 195, 255, 0.24), rgba(255, 255, 255, 0.08));
  color: var(--primary);
  font-size: 1.25rem;
}

/* -----------------------------------------
   Hero Section
----------------------------------------- */
.hero-section {
  position: relative;
  padding: 140px 0 90px;
  overflow: hidden;
  color: var(--white);
}

.hero-section::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(4, 49, 121, 0.92) 0%, rgba(9, 38, 85, 0.75) 45%, rgba(40, 81, 146, 0.35) 100%),
    url("../img/ac-air-duct-cleaning-spring-texas-banner.webp") center/cover no-repeat;
  z-index: -2;
}
.hero-section-ac {
  position: relative;
  padding: 140px 0 90px;
  overflow: hidden;
  color: var(--white);
}
.hero-section-filter {
  position: relative;
  padding: 140px 0 90px;
  overflow: hidden;
  color: var(--white);
}
.hero-section-vent {
  position: relative;
  padding: 140px 0 90px;
  overflow: hidden;
  color: var(--white);
}
.hero-section-sealing {
  position: relative;
  padding: 140px 0 90px;
  overflow: hidden;
  color: var(--white);
}
.hero-section-dryer {
  position: relative;
  padding: 140px 0 90px;
  overflow: hidden;
  color: var(--white);
}
.hero-section-ac::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(4, 49, 121, 0.92) 0%, rgba(9, 38, 85, 0.75) 45%, rgba(40, 81, 146, 0.35) 100%),
    url("../img/ac-repair-and-installation-spring-texas-banner.webp") center/cover no-repeat;
  z-index: -2;
}
.hero-section-ac::after {
  content: "";
  position: absolute;
  width: 520px;
  height: 520px;
  right: -120px;
  top: -70px;
  background: radial-gradient(circle, rgba(37, 195, 255, 0.25), transparent 60%);
  z-index: -1;
}
.hero-section-filter::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(4, 49, 121, 0.92) 0%, rgba(9, 38, 85, 0.75) 45%, rgba(40, 81, 146, 0.35) 100%),
    url("../img/air-filter-replacement-spring-tx-banner.webp") center/cover no-repeat;
  z-index: -2;
}
.hero-section-vent::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(4, 49, 121, 0.92) 0%, rgba(9, 38, 85, 0.75) 45%, rgba(40, 81, 146, 0.35) 100%),
    url("../img/air-vent-cleaning-spring-tx-banner.webp") center/cover no-repeat;
  z-index: -2;
}
.hero-section-dryer::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(4, 49, 121, 0.92) 0%, rgba(9, 38, 85, 0.75) 45%, rgba(40, 81, 146, 0.35) 100%),
    url("../img/ac-air-duct-cleaning-spring-texas-banner.webp") center/cover no-repeat;
  z-index: -2;
}
.hero-section-sealing::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(4, 49, 121, 0.92) 0%, rgba(9, 38, 85, 0.75) 45%, rgba(40, 81, 146, 0.35) 100%),
    url("../img/air-duct-sealing-spring-texas-banner.webp") center/cover no-repeat;
  z-index: -2;
}
.hero-section-dryer::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(4, 49, 121, 0.92) 0%, rgba(9, 38, 85, 0.75) 45%, rgba(40, 81, 146, 0.35) 100%),
    url("../img/dryer-vent-cleaning-spring-texas-banner.webp") center/cover no-repeat;
  z-index: -2;
}
.hero-section::after {
  content: "";
  position: absolute;
  width: 520px;
  height: 520px;
  right: -120px;
  top: -70px;
  background: radial-gradient(circle, rgba(37, 195, 255, 0.25), transparent 60%);
  z-index: -1;
}

.hero-kicker {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  padding: 0.55rem 1rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.12);
  color: #dcefff;
  font-size: 0.95rem;
  margin-bottom: 1.3rem;
}

.hero-title {
  font-size: clamp(2rem, 4vw, 4.2rem);
  line-height: 1.02;
  font-weight: 900;
  letter-spacing: -1.5px;
  margin-bottom: 1rem;
}

.hero-lead {
  font-size: 1.1rem;
  color: #d4e6f3;
  max-width: 620px;
  margin-bottom: 2rem;
}

.hero-feature-list {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  margin-top: 1.5rem;
}

.hero-feature {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  color: #e5f6ff;
  font-weight: 500;
}

.hero-visual-card {
  padding: 1.3rem;
  border-radius: var(--radius-lg);
}

.hero-image {
  border-radius: calc(var(--radius-lg) - 0.3rem);
  min-height: 420px;
  background:
    linear-gradient(180deg, rgba(10, 46, 104, 0.1), rgba(5, 67, 168, 0.35)),
    url("../img/air-duct-services.webp") center/cover no-repeat;
  position: relative;
  overflow: hidden;
}
.hero-image-ac {
  border-radius: calc(var(--radius-lg) - 0.3rem);
  min-height: 420px;
  background:
    linear-gradient(180deg, rgba(10, 46, 104, 0.1), rgba(5, 67, 168, 0.35)),
    url("../img/ac-repair-and installation-near-me.webp") center/cover no-repeat;
  position: relative;
  overflow: hidden;
}
.hero-image-filter {
  border-radius: calc(var(--radius-lg) - 0.3rem);
  min-height: 420px;
  background:
    linear-gradient(180deg, rgba(10, 46, 104, 0.1), rgba(5, 67, 168, 0.35)),
    url("../img/air-filter-replacement-near-me.webp") center/cover no-repeat;
  position: relative;
  overflow: hidden;
}
.hero-image-vent {
  border-radius: calc(var(--radius-lg) - 0.3rem);
  min-height: 420px;
  background:
    linear-gradient(180deg, rgba(10, 46, 104, 0.1), rgba(5, 67, 168, 0.35)),
    url("../img/expert-air-vent-cleaning.webp") center/cover no-repeat;
  position: relative;
  overflow: hidden;
}
.hero-image-sealing {
  border-radius: calc(var(--radius-lg) - 0.3rem);
  min-height: 420px;
  background:
    linear-gradient(180deg, rgba(10, 46, 104, 0.1), rgba(5, 67, 168, 0.35)),
    url("../img/expert-duct-sealing-and-leak-repair.webp") center/cover no-repeat;
  position: relative;
  overflow: hidden;
}
.hero-image-dryer {
  border-radius: calc(var(--radius-lg) - 0.3rem);
  min-height: 420px;
  background:
    linear-gradient(180deg, rgba(10, 46, 104, 0.1), rgba(5, 67, 168, 0.35)),
    url("../img/expert-dryer-vent-cleaning.webp") center/cover no-repeat;
  position: relative;
  overflow: hidden;
}
.floating-badge {
  position: absolute;
  background: var(--white);
  color: var(--dark);
  border-radius: 1rem;
  padding: 0.9rem 1rem;
  box-shadow: var(--shadow);
  font-weight: 700;
}

.floating-badge.top {
  top: 22px;
  right: 22px;
}

.floating-badge.bottom {
  bottom: 22px;
  left: 22px;
}

.floating-badge small {
  display: block;
  color: #688099;
  font-weight: 600;
  font-size: 0.78rem;
}

/* -----------------------------------------
   Stats Bar
----------------------------------------- */
.stats-bar {
  margin-top: -36px;
  position: relative;
  z-index: 5;
}

.stat-item h3 {
  color: var(--primary);
  font-weight: 900;
  margin-bottom: 0.2rem;
  font-size: 2rem;
}

.stat-item p {
  color: #d4e6f3;
  margin-bottom: 0;
}

/* -----------------------------------------
   Services
----------------------------------------- */
.service-icon,
.choose-icon,
.contact-icon {
  width: 70px;
  height: 70px;
  border-radius: 1.1rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, rgba(37, 195, 255, 0.14), rgba(18, 152, 204, 0.08));
  color: var(--primary);
  font-size: 1.6rem;
  margin-bottom: 1rem;
}

.service-card h4,
.testimonial-card h5,
.choose-card h4 {
  font-weight: 800;
}

.service-card p,
.choose-card p {
  color: #637a90;
}

.service-bullet {
  color: #49647d;
  font-size: 0.95rem;
}

/* -----------------------------------------
   Why Choose Us
----------------------------------------- */
.why-section {
  background:
    radial-gradient(circle at 15% 20%, rgba(37, 195, 255, 0.08), transparent 18%),
    linear-gradient(180deg, #f7fcff 0%, #edf7fc 100%);
}

.check-list li {
  display: flex;
  align-items: start;
  gap: 0.8rem;
  margin-bottom: 1rem;
  color: #3f566c;
}

.check-list i {
  color: var(--success);
  margin-top: 0.2rem;
}

.feature-strip {
  background: linear-gradient(135deg, #0f2238, #122d49);
  color: var(--white);
  border-radius: var(--radius-lg);
  overflow: hidden;
}

/* -----------------------------------------
   Testimonials
----------------------------------------- */
/* =========================
Required assets in <head>:
Bootstrap 5 CSS
Bootstrap Icons
========================= */

.testimonial-feature-section {
  background: #112943;
  padding: 100px 0;
  overflow: hidden;
}

.testimonial-feature-box {
  background: #f8f8f8;
  padding: 40px 36px 18px;
  position: relative;
  overflow: hidden;
}

/* Left blue line */
.testimonial-left-line {
  position: absolute;
  left: 0;
  top: 0;
  width: 4px;
  height: 100%;
  background: #19b8ee;
}

/* Quote icon */
.testimonial-quote-icon {
  position: absolute;
  top: 26px;
  left: 34px;
  font-size: 4.8rem;
  color: #18b6ec;
  line-height: 1;
  text-shadow: -5px 4px 0 #0c55a3;
}

.testimonial-small-circle {
  position: absolute;
  top: 58px;
  left: 168px;
  width: 24px;
  height: 24px;
  border: 2px solid #19b8ee;
  border-radius: 50%;
}

.testimonial-content {
  padding-top: 94px;
  position: relative;
  z-index: 2;
}

.testimonial-stars {
  color: #19b8ee;
  font-size: 1.1rem;
  letter-spacing: 4px;
}

.testimonial-text {
  font-size: 1.05rem;
  line-height: 1.85;
  color: #586273;
  max-width: 690px;
  font-weight: 500;
}

.testimonial-text .brand-word {
  color: #18b6ec;
  font-weight: 700;
}

.testimonial-author-img {
  width: 72px;
  height: 72px;
  min-width: 72px;
  border-radius: 22px;
  overflow: hidden;
}

.testimonial-author-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.testimonial-author-name {
  color: #0b57a5;
  font-size: 1.7rem;
  font-weight: 800;
  letter-spacing: -0.02em;
  text-transform: uppercase;
}

.testimonial-author-role {
  color: #9a876b;
  font-size: 0.95rem;
  font-weight: 700;
  text-transform: uppercase;
}

/* Right-side collage */
.testimonial-visual {
  min-height: 390px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.testimonial-image-grid {
  position: relative;
  width: 100%;
  max-width: 410px;
  min-height: 380px;
  z-index: 2;
}

.testimonial-person {
  position: absolute;
  border: none;
  padding: 0;
  background: transparent;
  overflow: hidden;
  transition: transform 0.3s ease, box-shadow 0.3s ease, opacity 0.3s ease;
  cursor: pointer;
  box-shadow: none;
}

.testimonial-person img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.testimonial-person:hover,
.testimonial-person.active {
  transform: translateY(-4px) scale(1.02);
}

/* Shapes inspired by the reference layout */
.person-sm {
  width: 96px;
  height: 106px;
  border-radius: 42px 42px 0 0;
}

.person-md {
  width: 98px;
  height: 126px;
  border-radius: 48px;
}

.person-lg {
  width: 122px;
  height: 336px;
  border-radius: 62px 62px 0 0;
}

/* Position each portrait like a stylish little team meeting */
.testimonial-person[data-index="0"] {
  top: 0;
  left: 96px;
}

.testimonial-person[data-index="1"] {
  top: 0;
  right: 74px;
}

.testimonial-person[data-index="2"] {
  top: 138px;
  left: 96px;
}

.testimonial-person[data-index="3"] {
  top: 130px;
  right: 0;
}

.testimonial-person[data-index="4"] {
  bottom: 0;
  right: 20px;
}

.testimonial-person.active {
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.12);
}

/* Decorative arc shape */
.testimonial-arc-shape {
  position: absolute;
  right: -34px;
  bottom: -46px;
  width: 420px;
  height: 260px;
  border-radius: 220px 220px 0 0;
  background: #e6eaef;
  z-index: 0;
}

.testimonial-arc-shape::before {
  content: "";
  position: absolute;
  left: 58%;
  bottom: 0;
  transform: translateX(-50%);
  width: 156px;
  height: 70px;
  border-radius: 160px 160px 0 0;
  background: #f8f8f8;
}

/* Dots */
.testimonial-dots {
  position: absolute;
  left: 24px;
  bottom: 26px;
  display: flex;
  gap: 14px;
  z-index: 3;
}

.testimonial-dot {
  width: 10px;
  height: 10px;
  border: none;
  padding: 0;
  background: #19b8ee;
  opacity: 0.35;
  cursor: pointer;
  transition: all 0.3s ease;
}

.testimonial-dot:nth-child(1) {
  border: 1px solid #19b8ee;
  background: transparent;
}

.testimonial-dot.active {
  opacity: 1;
  transform: scale(1.15);
}

/* Responsive */
@media (max-width: 1199.98px) {
  .testimonial-author-name {
    font-size: 1.45rem;
  }

  .testimonial-image-grid {
    max-width: 360px;
  }

  .person-lg {
    width: 112px;
    height: 320px;
  }

  .testimonial-person[data-index="1"] {
    right: 54px;
  }
}

@media (max-width: 991.98px) {
  .testimonial-feature-box {
    padding: 34px 26px 20px;
  }

  .testimonial-content {
    padding-top: 82px;
  }

  .testimonial-text {
    max-width: 100%;
  }

  .testimonial-visual {
    margin-top: 24px;
    min-height: 430px;
  }

  .testimonial-dots {
    left: 50%;
    transform: translateX(-50%);
  }
}

@media (max-width: 767.98px) {
  .testimonial-feature-section {
    padding: 70px 0;
  }

  .testimonial-feature-box {
    padding: 28px 18px 16px;
  }

  .testimonial-quote-icon {
    top: 18px;
    left: 22px;
    font-size: 3.8rem;
  }

  .testimonial-small-circle {
    left: 132px;
    top: 44px;
  }

  .testimonial-content {
    padding-top: 76px;
  }

  .testimonial-text {
    font-size: 1rem;
    line-height: 1.8;
  }

  .testimonial-author-name {
    font-size: 1.2rem;
  }

  .testimonial-author-role {
    font-size: 0.82rem;
  }

  .testimonial-image-grid {
    max-width: 300px;
    min-height: 350px;
  }

  .person-sm {
    width: 76px;
    height: 88px;
  }

  .person-md {
    width: 84px;
    height: 108px;
  }

  .person-lg {
    width: 96px;
    height: 272px;
  }

  .testimonial-person[data-index="0"] {
    top: 0;
    left: 65px;
  }

  .testimonial-person[data-index="1"] {
    top: 0;
    right: 48px;
  }

  .testimonial-person[data-index="2"] {
    top: 114px;
    left: 65px;
  }

  .testimonial-person[data-index="3"] {
    top: 108px;
    right: 0;
  }

  .testimonial-person[data-index="4"] {
    bottom: 8px;
    right: 14px;
  }

  .testimonial-arc-shape {
    width: 300px;
    height: 190px;
    right: -24px;
    bottom: -30px;
  }

  .testimonial-arc-shape::before {
    width: 112px;
    height: 52px;
  }
}
/* -----------------------------------------
   Contact
----------------------------------------- */
.contact-card {
  background: var(--white);
  border-radius: var(--radius-lg);
  box-shadow: 0 22px 60px rgba(13, 27, 42, 0.08);
  overflow: hidden;
}

.contact-side {
  background:
    linear-gradient(180deg, rgba(8, 17, 31, 0.95), rgba(15, 34, 56, 0.92)),
    url("https://images.unsplash.com/photo-1581093458791-9d15482442f6?auto=format&fit=crop&w=1200&q=80") center/cover no-repeat;
  color: var(--white);
  min-height: 100%;
}

.form-control,
.form-select {
  border-radius: 0.9rem;
  padding: 0.95rem 1rem;
  border: 1px solid rgba(18, 38, 58, 0.12);
}

.form-control:focus,
.form-select:focus {
  border-color: rgba(37, 195, 255, 0.7);
  box-shadow: 0 0 0 0.25rem rgba(37, 195, 255, 0.15);
}

/* -----------------------------------------
   Footer
----------------------------------------- */
.footer-airduct {
  background: #06101c;
  color: #ccdeed;
}

.footer-airduct a {
  color: #ccdeed;
}

.footer-airduct a:hover {
  color: var(--primary);
}

.footer-title {
  color: var(--white);
  font-weight: 800;
  margin-bottom: 1rem;
}

.counter {
  transition: all 0.3s ease;
}

/* -----------------------------------------
   Responsive
----------------------------------------- */
@media (max-width: 991.98px) {
  .hero-section {
    padding-top: 115px;
  }

  .stats-bar {
    margin-top: 24px;
  }

  .hero-image {
    min-height: 340px;
  }
}

@media (max-width: 767.98px) {
  .hero-title {
    letter-spacing: -0.5px;
  }

  .floating-badge {
    position: static;
    margin: 0.75rem;
    display: inline-block;
  }

  .hero-feature-list {
    flex-direction: column;
    gap: 0.65rem;
  }
}

/* gallery */
.services-showcase-section {
  position: relative;
  background: #f7f7f7;
  overflow: hidden;
  padding-top: 110px !important;
  padding-bottom: 110px !important;
}

.services-showcase-section .container {
  position: relative;
  z-index: 2;
}

/* Tiny label at top, because every premium section needs a stylish whisper */
.section-mini-title {
  color: #17b5f0;
  font-weight: 700;
  font-size: 0.95rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.section-mini-title i {
  font-size: 1rem;
}

.services-main-title {
  color: #0b57a5;
  font-size: clamp(2rem, 3vw, 3rem);
  line-height: 1.06;
  font-weight: 800;
  letter-spacing: -0.02em;
  max-width: 520px;
}

.services-main-text {
  color: #6b7280;
  font-size: 1.08rem;
  line-height: 1.9;
  max-width: 420px;
}

/* Arrow buttons */
.services-arrows {
  align-items: center;
}

.service-arrow-btn {
  width: 58px;
  height: 58px;
  border: none;
  border-radius: 50%;
  background: #e8edf0;
  color: #0b57a5;
  font-size: 1.45rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: all 0.25s ease;
  box-shadow: none;
}

.service-arrow-btn:hover {
  background: #0b57a5;
  color: #ffffff;
  transform: translateY(-2px);
}

/* Decorative faded icon in background */
.services-bg-shape {
  position: absolute;
  left: -60px;
  bottom: 25px;
  font-size: 12rem;
  color: rgba(226, 78, 107, 0.08);
  z-index: 0;
  pointer-events: none;
  transform: rotate(-12deg);
}

/* Slider wrapper */
.services-slider-wrap {
  position: relative;
  overflow: hidden;
  z-index: 2;
}

.services-slider-track {
  display: flex;
  gap: 28px;
  overflow-x: auto;
  scroll-behavior: smooth;
  padding-bottom: 12px;
  scrollbar-width: none;
}

.services-slider-track::-webkit-scrollbar {
  display: none;
}

/* Card */
.service-visual-card {
  flex: 0 0 370px;
  max-width: 370px;
}

.service-image {
  position: relative;
  height: 480px;
  background-size: cover;
  background-position: center;
  overflow: hidden;
}

.service-image::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.04) 0%,
    rgba(0, 0, 0, 0.12) 100%
  );
  transition: all 0.35s ease;
}

.service-visual-card:hover .service-image::before {
  background: linear-gradient(
    180deg,
    rgba(11, 87, 165, 0.08) 0%,
    rgba(0, 0, 0, 0.2) 100%
  );
}

.service-icon-badge {
  position: absolute;
  top: 30px;
  left: 30px;
  width: 92px;
  height: 92px;
  border-radius: 50%;
  background: #ffffff;
  color: #0b57a5;
  font-size: 2rem;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 2;
  box-shadow: 0 15px 35px rgba(0, 0, 0, 0.08);
}

.service-label-box {
  position: absolute;
  left: 32px;
  right: 32px;
  bottom: 30px;
  background: #ffffff;
  padding: 18px 26px;
  z-index: 2;
  transition: all 0.3s ease;
}

.service-label-box h3 {
  margin: 0;
  color: #0b57a5;
  font-size: 1.2rem;
  font-weight: 700;
  letter-spacing: -0.02em;
}

.service-visual-card:hover .service-label-box {
  transform: translateY(-6px);
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.1);
}

/* Responsive */
@media (max-width: 1199.98px) {
  .service-visual-card {
    flex: 0 0 330px;
    max-width: 330px;
  }

  .service-image {
    height: 450px;
  }

  .service-label-box h3 {
    font-size: 1.65rem;
  }
}

@media (max-width: 991.98px) {
  .services-main-title {
    max-width: 100%;
  }

  .services-main-text {
    max-width: 100%;
  }

  .services-arrows {
    justify-content: flex-start !important;
  }
}

@media (max-width: 767.98px) {
  .services-showcase-section {
    padding-top: 80px !important;
    padding-bottom: 80px !important;
  }

  .service-visual-card {
    flex: 0 0 88%;
    max-width: 88%;
  }

  .service-image {
    height: 420px;
  }

  .service-icon-badge {
    width: 78px;
    height: 78px;
    font-size: 1.7rem;
    top: 22px;
    left: 22px;
  }

  .service-label-box {
    left: 20px;
    right: 20px;
    bottom: 20px;
    padding: 16px 20px;
  }

  .service-label-box h3 {
    font-size: 1.45rem;
  }

  .services-bg-shape {
    display: none;
  }
}
/* end gallery */
/* form */
form.CUS input.subject { display: none; }
.CUS input, .CUS textarea{ background-color: #ffffff;
margin: 10px;border-radius: 5px;height: 40px;width: 45%;padding-left: 1%; color:#333; border-color: #c7c7c7;}
.CUS select{background-color: #ffffff;border-radius: 5px;height: 40px;margin: 10px; width: 45%;color:#333;border-color: #c7c7c7;}
@media (max-width:1200px){.CUS input, .CUS textarea{width: 95%;}}
.border-raduis{border-radius: 35px!important;}
/* end form */
/* icons */
/*!
 * Bootstrap Icons v1.11.3 (https://icons.getbootstrap.com/)
 * Copyright 2019-2024 The Bootstrap Authors
 * Licensed under MIT (https://github.com/twbs/icons/blob/main/LICENSE)
 */@font-face{font-display:block;font-family:bootstrap-icons;src:url("fonts/bootstrap-icons.woff2?dd67030699838ea613ee6dbda90effa6") format("woff2"),url("fonts/bootstrap-icons.woff?dd67030699838ea613ee6dbda90effa6") format("woff")}
.bi::before,[class*=" bi-"]::before,[class^=bi-]::before{display:inline-block;font-family:bootstrap-icons!important;font-style:normal;font-weight:400!important;font-variant:normal;text-transform:none;line-height:1;vertical-align:-.125em;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
.bi-123::before{content:"\f67f"}
.bi-award::before{content:"\f154"}
.bi-building::before{content:"\f1dd"}
.bi-check-circle-fill::before{content:"\f26a"}
.bi-check2-all::before{content:"\f26f"}
.bi-chevron-left::before{content:"\f284"}
.bi-chevron-right::before{content:"\f285"}
.bi-clock::before{content:"\f293"}
.bi-emoji-laughing::before{content:"\f321"}
.bi-envelope::before{content:"\f32f"}
.bi-facebook::before{content:"\f344"}
.bi-funnel::before{content:"\f3e1"}
.bi-geo-alt::before{content:"\f3e8"}
.bi-house-door::before{content:"\f423"}
.bi-house::before{content:"\f425"}
.bi-instagram::before{content:"\f437"}
.bi-lightning-charge::before{content:"\f46d"}
.bi-linkedin::before{content:"\f472"}
.bi-list::before{content:"\f479"}
.bi-shield-check::before{content:"\f52f"}
.bi-shield-shaded::before{content:"\f53b"}
.bi-star-fill::before{content:"\f586"}
.bi-telephone::before{content:"\f5c1"}
.bi-tools::before{content:"\f5db"}
.bi-wind::before{content:"\f61d"}
.bi-check-lg::before{content:"\f633"}
.bi-currency-dollar::before{content:"\f636"}
.bi-fan::before{content:"\f670"}
.bi-quote::before{content:"\f6b0"}
.bi-clipboard2-check::before{content:"\f725"}
.bi-heart-pulse::before{content:"\f76f"}
.bi-fire::before{content:"\f7f6"}
.bi-house-check::before{content:"\f889"}
.bi-twitter-x::before{content:"\f8db"}