/*
Theme Name: Raj Services
Theme URI: http://parichiti.com
Author: Sagar Roy
Author URI: http://parichiti.com
Description: Twenty Twenty-Five emphasizes simplicity and adaptability. It offers flexible design options, supported by a variety of patterns for different page types, such as services and landing pages, making it ideal for building personal blogs, professional portfolios, online magazines, or business websites. Its templates cater to various blog styles, from text-focused to image-heavy layouts. Additionally, it supports international typography and diverse color palettes, ensuring accessibility and customization for users worldwide.
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: raj-services
*/

:root {
  --primary-red: #e31837;
  --primary-blue: #002855;
  --secondary-blue: #003366;
  --text-dark: #333333;
  --text-light: #666666;
  --white: #ffffff;
  --light-gray: #f4f4f4;
  --border-color: #dddddd;
  --shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  --transition: all 0.3s ease;
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  font-family: "Open Sans", sans-serif;
  line-height: 1.6;
  color: var(--text-dark);
  color: var(--text-dark);
  background-color: var(--white);
  scroll-behavior: smooth;
  scroll-padding-top: 100px;
  /* Fix for sticky header covering anchors */
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "Roboto", sans-serif;
  color: var(--primary-blue);
  margin-bottom: 1rem;
  font-weight: 700;
}

a {
  text-decoration: none;
  color: inherit;
  transition: var(--transition);
}

ul {
  list-style: none;
}

img {
  max-width: 100%;
  height: auto;
  display: block;
}

/* Utilities */
.container {
  max-width: 1200px;
  margin: 0 auto;
  margin: 0 auto;
  padding: 0 20px;
}

/* Simple Grid */
.row {
  display: flex;
  flex-wrap: wrap;
  margin: 0 -15px;
}

.col-md-6 {
  flex: 0 0 50%;
  max-width: 50%;
  padding: 0 15px;
}

@media (max-width: 768px) {
  .col-md-6 {
    flex: 0 0 100%;
    max-width: 100%;
  }
}

.btn {
  display: inline-block;
  padding: 12px 24px;
  border-radius: 4px;
  font-weight: 600;
  text-align: center;
  cursor: pointer;
  border: none;
  font-size: 1rem;
  text-transform: uppercase;
}

.btn-primary {
  background-color: var(--primary-red);
  color: var(--white);
}

.btn-primary:hover {
  background-color: #c2152d;
}

.btn-secondary {
  background-color: var(--primary-blue);
  color: var(--white);
}

.btn-secondary:hover {
  background-color: #001a38;
}

.text-center {
  text-align: center;
}

.section-padding {
  padding: 60px 0;
}

.bg-light {
  background-color: var(--light-gray);
}

/* Top Bar */
.top-bar {
  background-color: var(--primary-blue);
  color: var(--white);
  padding: 10px 0;
  font-size: 0.9rem;
}

.top-bar .container {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.top-contact a {
  color: var(--white);
  margin-right: 20px;
}

/* Header Refactor - 2-Row Stylish Layout */
header.site-header {
  background-color: var(--white);
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
  width: 100%;
  z-index: 1000;
  /* Above hero (1) and content */
  position: sticky;
  top: 0;
  padding-bottom: 0;
  transition: all 0.3s ease;
}

/* Sticky Header Enhanced Shadow */
header.site-header.is-sticky {
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.15);
}

/* Force Full Width for Header Containers */
.site-topbar .container,
.header-top .container,
.header-main .container {
  max-width: 100% !important;
  width: 100% !important;
  padding-left: 15px !important;
  padding-right: 15px !important;
  margin: 0 !important;
}

/* Top Bar */
.site-topbar {
  background-color: var(--primary-blue);
  color: #fff;
  padding: 8px 0;
  font-size: 0.85rem;
}

.topbar-inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.topbar-left {
  display: flex;
  align-items: center;
  gap: 20px;
}

.topbar-left a {
  color: #fff;
  text-decoration: none;
  display: flex;
  align-items: center;
  gap: 8px;
  font-weight: 500;
}

.topbar-left .sep {
  color: rgba(255, 255, 255, 0.3);
}

/* CTA Group (Right Side) */
.header-cta-group {
  display: flex;
  align-items: center;
  gap: 20px;
  /* Fixed gap for desktop (>1024px) - WordPress formula */
  flex-wrap: nowrap;
  /* Ensure side-by-side */
}

@media (max-width: 1024px) {
  .header-cta-group {
    gap: 2vw;
    /* Dynamic gap shrinks with screen width - WordPress formula */
    justify-content: flex-end;
    /* Keep aligned right if possible */
    width: 100%;
    /* Use available space if needed */
  }
}

.topbar-right {
  display: flex;
  gap: 15px;
}

.topbar-right a {
  color: #fff;
  text-decoration: none;
  transition: color 0.3s;
}

.topbar-right a:hover {
  color: var(--primary-red);
}

/* Responsive Header & Topbar */
@media (max-width: 991px) {
  /* Footer & other adjustments... */
  /* Top Bar: Stack and Center */
  .site-topbar {
    display: block;
    /* Show on mobile */
    text-align: center;
    padding: 5px 0;
  }

  .topbar-inner {
    flex-direction: column;
    gap: 10px;
  }

  .topbar-left,
  .topbar-right {
    justify-content: center;
    width: 100%;
  }

  .topbar-left {
    flex-wrap: wrap;
    /* Allow wrapping for small screens */
    gap: 10px;
    font-size: 0.8rem;
  }

  /* Header Main: Adjust Padding/Layout */
  .header-main .navbar {
    padding: 15px 0;
  }

  .logo {
    margin-right: 0;
    margin-bottom: 0;
  }
}

@media (max-width: 1024px) {
  .logo {
    justify-content: flex-start;
    /* Align logo left on mobile */
    margin-bottom: 0;
    width: auto;
  }

  .header-main .navbar {
    justify-content: space-between;
    /* Space out logo and menu btn */
    /* Space out logo and menu btn */
    align-items: center;
    flex-wrap: wrap; /* Allow wrapping for 2 rows */
  }

  /* Navigation: Mobile Menu */
  .nav-links {
    display: none;
    /* Hidden by default */
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    background: #fff;
    flex-direction: column;
    gap: 0;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
    border-top: 1px solid #eee;
    z-index: 1000;
    padding: 0;
  }

  .nav-links.active {
    display: flex;
    /* Show when active */
  }

  .nav-links li {
    width: 100%;
    border-bottom: 1px solid #f9f9f9;
  }

  .nav-links li:last-child {
    border-bottom: none;
  }

  .nav-links a {
    display: block;
    padding: 15px 20px;
    width: 100%;
  }

  .nav-links a::after {
    display: none;
    /* Disable hover underline on mobile */
  }

  /* Sub-menu on Mobile */
  .navbar nav ul li.menu-item-has-children .sub-menu {
    position: static;
    box-shadow: none;
    display: none;
    /* Hidden by default, toggled via JS */
    padding: 0;
    background: #f9f9f9;
    grid-template-columns: 1fr;
    /* Single column */
    opacity: 1;
    visibility: visible;
    transform: none;
    border-top: 1px solid #eee;
  }

  .navbar nav ul li.menu-item-has-children.open .sub-menu {
    display: block;
  }

  .navbar nav ul li.menu-item-has-children .sub-menu li a {
    padding-left: 40px;
    /* Indent sub-menu items */
    font-size: 0.9rem;
  }
}

/* Row 1: Top Header */
.header-top {
  padding: 10px 0;
  background: #fff;
  border-bottom: 1px solid #f0f0f0;
}

.header-top-inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

/* Logo */
.logo img {
  max-height: 55px;
  display: block;
}

/* Utility Links */
.top-utility {
  display: flex;
  align-items: center;
  gap: 15px;
  font-size: 0.8rem;
  color: #666;
}

.top-utility a {
  color: #555;
  font-weight: 500;
  text-decoration: none;
  transition: color 0.3s;
}

.top-utility .sep {
  color: #ddd;
}

.top-utility a:hover {
  color: var(--primary-red);
}

.location-link {
  color: var(--primary-red) !important;
  font-weight: 700 !important;
  display: flex;
  align-items: center;
  gap: 5px;
}

@media (max-width: 1024px) {
  .top-utility {
    display: none !important;
  }
}

/* Row 2: Main Navigation */
.header-main {
  background: #fff;
  padding: 0;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
}

.header-main .navbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 0;
  min-height: 60px;
  gap: clamp(5px, 4vw, 10px);
  /* WordPress formula: Dynamic gap with constraints */
}

/* Navigation Container */
.navbar nav {
  display: flex;
  flex-grow: 1;
  /* Take up all remaining space - WordPress formula */
}

.nav-links {
  display: flex;
  width: 100%;
  /* Fill the nav container */
  justify-content: space-between;
  /* WordPress formula: Dynamic item spacing */
  margin: 0;
  padding: 0;
  list-style: none;
}

/* Navigation Links */
.nav-links li {
  position: relative;
}

.nav-links li a {
  color: var(--primary-blue);
  font-weight: 700;
  font-size: 0.95rem;
  text-transform: capitalize;
  padding: 10px 15px 10px 0;
  text-decoration: none;
  position: relative;
  display: block;
}

/* Hover Effect - Side Indicator */
.nav-links li a::after {
  content: "";
  position: absolute;
  width: 3px;
  height: 0;
  background-color: var(--primary-red);
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  transition: height 0.3s ease;
}

.nav-links li a:hover::after {
  height: 60%;
}

.nav-links li a:hover {
  color: var(--primary-red);
}

/* Dropdown Menu Styles */
.navbar nav ul li.menu-item-has-children {
  position: relative;
}

.navbar nav ul li.menu-item-has-children > a {
  padding-right: 20px;
  position: relative;
}

/* SVG Dropdown Arrow Icon */
.navbar nav ul li.menu-item-has-children > a::after {
  content: "";
  display: inline-block;
  width: 14px;
  height: 14px;
  background-color: currentColor;
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M12.7071 14.7071C12.3166 15.0976 11.6834 15.0976 11.2929 14.7071L6.29289 9.70711C5.90237 9.31658 5.90237 8.68342 6.29289 8.29289C6.68342 7.90237 7.31658 7.90237 7.70711 8.29289L12 12.5858L16.2929 8.29289C16.6834 7.90237 17.3166 7.90237 17.7071 8.29289C18.0976 8.68342 18.0976 9.31658 17.7071 9.70711L12.7071 14.7071Z' fill='%23000000'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M12.7071 14.7071C12.3166 15.0976 11.6834 15.0976 11.2929 14.7071L6.29289 9.70711C5.90237 9.31658 5.90237 8.68342 6.29289 8.29289C6.68342 7.90237 7.31658 7.90237 7.70711 8.29289L12 12.5858L16.2929 8.29289C16.6834 7.90237 17.3166 7.90237 17.7071 8.29289C18.0976 8.68342 18.0976 9.31658 17.7071 9.70711L12.7071 14.7071Z' fill='%23000000'/%3E%3C/svg%3E");
  -webkit-mask-size: contain;
  mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  transition: transform 0.3s ease;
  margin-left: 5px;
  vertical-align: middle;
}

/* Rotate arrow on hover */
.navbar nav ul li.menu-item-has-children:hover > a::after {
  transform: rotate(180deg);
}

/* Sub-menu (Simple Dropdown - WordPress Style) */
.sub-menu {
  position: absolute;
  top: 100%;
  left: 0;
  background-color: #ffffff;
  min-width: 250px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
  padding: 15px 0;
  margin-top: 0;
  opacity: 0;
  visibility: hidden;
  transform: translateY(-10px);
  transition: all 0.3s ease;
  z-index: 9999;
  list-style: none;
  border-top: 3px solid var(--primary-red);
}

/* Show sub-menu on hover */
.navbar nav ul li.menu-item-has-children:hover .sub-menu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

/* Sub-menu items */
.sub-menu li {
  display: block;
  width: 100%;
}

.sub-menu li a {
  display: block;
  padding: 10px 25px;
  font-size: 0.9rem;
  color: #555;
  font-weight: 400;
  text-transform: none;
  text-align: left;
  border-bottom: 1px solid #f5f5f5;
  transition: all 0.3s ease;
}

.sub-menu li:last-child a {
  border-bottom: none;
}

.sub-menu li a:hover {
  color: var(--primary-red);
  background-color: #f9f9f9;
  padding-left: 30px;
}

/* CTA Group (Right Side) */
.header-cta-group {
  display: flex;
  align-items: center;
  gap: 20px;
  /* Fixed gap for > 1024px */
  flex-wrap: nowrap;
  /* Ensure side-by-side */
}

@media (max-width: 1024px) {
  .header-cta-group {
    display: flex !important; /* Restore on mobile */
    width: 100%;
    justify-content: space-between;
    gap: 10px;
    margin-top: 0;
  }
}

/* Primary Button (Get Started) */
/* Global Button Styling (Neighborly Style - Red & Equal) */
/* Global Button Styling (Neighborly Style - Red & Equal) */
.btn-get-started,
.btn-call-us {
  background-color: #b52126 !important;
  /* Specific Red from User */
  color: #fff !important;
  padding: 12px 20px;
  /* Slightly larger padding */
  border-radius: 10px;
  /* Match Rounded Look from Reference */
  font-weight: 700;
  text-transform: uppercase;
  font-size: 0.9rem;
  /* Slightly larger font */
  display: flex;
  align-items: center;
  justify-content: center;
  /* Center content */
  gap: 8px;
  transition: all 0.3s ease;
  text-decoration: none;
  line-height: 1;
  border: 2px solid #b52126;
  flex: 1;
  /* Match width: 50% / Equal Size */
  text-align: center;
  white-space: nowrap;
  /* Prevent wrapping */
  position: relative;
  overflow: hidden;
}

/* Button Glare Effect */
.btn-get-started::after,
.btn-call-us::after {
  content: "";
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(255, 255, 255, 0.2),
    transparent
  );
  transition: 0.5s;
}

.btn-get-started:hover::after,
.btn-call-us:hover::after {
  left: 100%;
}

/* Icon Styling inside Buttons */
.btn-get-started i,
.btn-call-us i {
  font-size: 1.1em;
  /* Make icon slightly larger */
  margin-bottom: 2px;
  /* Visual balance */
}

.btn-get-started:hover,
.btn-call-us:hover {
  background-color: #641215 !important;
  /* Darker Red Hover from User */
  border-color: #641215 !important;
  color: #fff !important;
}

/* Mega Menu Styles */
/* Marquee Bar Styles */
.marquee-bar {
  background-color: #b52126;
  color: #ffffff;
  padding: 10px 0;
  overflow: hidden;
  position: relative;
  width: 100%;
  font-size: 0.95rem;
  font-weight: 600;
  text-transform: uppercase;
  white-space: nowrap;
}

.marquee-content {
  display: inline-block;
  animation: marquee 40s linear infinite;
  padding-left: 100%;
  /* Start from right */
}

.marquee-content span {
  padding-right: 50px;
}

@keyframes marquee {
  0% {
    transform: translate(0, 0);
  }

  100% {
    transform: translate(-100%, 0);
  }
}

/* Mobile Menu Button */
.mobile-menu-btn {
  display: none;
  font-size: 1.5rem;
  color: var(--primary-blue);
  cursor: pointer;
}

/* Safety Banner */
.safety-banner {
  background-color: var(--primary-red);
  color: var(--white);
  padding: 12px 0;
}

/* Hero Section Redesign */
.hero {
  position: relative;
  background-color: #cccccc;

  background-image:
    linear-gradient(
      to right,
      rgba(0, 20, 50, 0.9) 0%,
      rgba(0, 40, 85, 0.6) 50%,
      rgba(0, 40, 85, 0.2) 100%
    ),
    url("../images/hero Section/hero-bg.png");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  min-height: 600px;
  display: flex;
  align-items: center;
  color: var(--white);
  z-index: 1;
  /* Lower z-index so menu can appear above */
}

.hero-container {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
}

@media (max-width: 768px) {
  .hero-container {
    flex-direction: column;
    align-items: flex-start;
  }
}

.hero-content {
  flex: 1;
  padding-right: 50px;
}

.hero-content {
  max-width: 1200px;
  /* Constrain width again inside block */
  margin: 0 auto;
  padding: 60px 20px;
  /* Add internal padding */
  display: flex;
  /* Keep flex for left alignment of text */
  align-items: center;
  min-height: 60vh;
  /* Ensure text area has space */
}

.hero-text {
  max-width: 600px;
  /* padding: 20px; - Removed to remove box feel */
  /* background: rgba(0, 0, 0, 0.4); - Removed black shadow box */
  /* border-radius: 8px; - Removed */
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.7);
  /* Added for readability without box */
}

/* --- Why Choose Us Premium Redesign --- */
.why-choose-us-section {
  background-color: #f9f9f9;
  overflow: hidden;
  position: relative;
  padding: 80px 0;
}

/* Decorative Background Element */
.why-choose-us-section::before {
  content: "";
  position: absolute;
  top: -50px;
  right: -50px;
  width: 300px;
  height: 300px;
  background: radial-gradient(
    circle,
    rgba(227, 24, 55, 0.05) 0%,
    rgba(255, 255, 255, 0) 70%
  );
  border-radius: 50%;
  z-index: 0;
}

.why-choose-content {
  position: relative;
  z-index: 1;
}

.why-choose-content h2 {
  font-size: 2.5rem;
  font-weight: 800;
  color: #1a1a1a;
  letter-spacing: -0.5px;
  margin-bottom: 20px;
}

.why-choose-content .section-subheading {
  font-size: 1.15rem;
  color: #555;
  line-height: 1.6;
  margin-bottom: 40px;
}

/* Feature Grid 2x2 */
.feature-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 25px;
  margin-bottom: 30px;
}

.feature-box {
  background: #ffffff;
  padding: 25px 20px;
  border-radius: 12px;
  box-shadow: 0 5px 20px rgba(0, 0, 0, 0.04);
  transition: all 0.3s ease;
  border: 1px solid #eee;
  text-align: left;
  height: 100%;
}

.feature-box:hover {
  transform: translateY(-5px);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
  border-color: transparent;
}

.feature-box .icon-wrapper {
  width: 50px;
  height: 50px;
  background-color: rgba(227, 24, 55, 0.08); /* Light Red BG */
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 15px;
  color: #e31837; /* Primary Red */
  font-size: 1.2rem;
  transition: all 0.3s ease;
}

.feature-box:hover .icon-wrapper {
  background-color: #e31837;
  color: #ffffff;
}

.feature-box h4 {
  font-size: 1.1rem;
  font-weight: 700;
  margin-bottom: 8px;
  color: #222;
}

.feature-box p {
  font-size: 0.9rem;
  color: #666;
  line-height: 1.4;
  margin: 0;
}

/* Image Wrapper Enhancements */
.why-choose-image-wrapper {
  position: relative;
  padding-left: 40px;
  z-index: 1;
}

/* Image Background Blob Effect */
.why-choose-image-wrapper::before {
  content: "";
  position: absolute;
  top: 30px;
  left: 0;
  width: 90%;
  height: 90%;
  background-color: #002855; /* Dark Blue Brand Color */
  border-radius: 12px;
  z-index: -1;
  opacity: 0.1;
  transform: rotate(-3deg);
}

.why-choose-image-wrapper .main-img {
  border-radius: 12px;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.12);
  width: 100%;
  height: auto;
  object-fit: cover;
  aspect-ratio: 4/3;
  transition: transform 0.5s ease;
}

.why-choose-image-wrapper:hover .main-img {
  transform: scale(1.02);
}

.experience-badge {
  position: absolute;
  bottom: -25px;
  left: -10px;
  background: linear-gradient(135deg, #e31837, #b51c2d);
  color: #fff;
  padding: 20px 30px;
  border-radius: 10px;
  box-shadow: 0 10px 25px rgba(227, 24, 55, 0.4);
  text-align: center;
  border: 4px solid #ffffff;
  z-index: 2;
}

.experience-badge .years {
  display: block;
  font-size: 2.2rem;
  font-weight: 800;
  line-height: 1;
  margin-bottom: 2px;
}

.experience-badge .text {
  font-size: 0.8rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 1px;
  opacity: 0.9;
}

/* Responsive Adjustments */
@media (max-width: 991px) {
  .feature-grid {
    grid-template-columns: 1fr;
  }

  .why-choose-image-wrapper {
    padding-left: 0;
    margin-top: 60px;
  }

  .experience-badge {
    left: 50%;
    transform: translateX(-50%);
    bottom: -30px;
    width: 80%;
    max-width: 250px;
  }
}

@media (min-width: 768px) and (max-width: 991px) {
  .feature-grid {
    grid-template-columns: 1fr 1fr;
  }
}

.hero-text h1 {
  font-size: 1.5rem;
  font-weight: 700;
  margin-bottom: 10px;
  color: var(--white);
  text-transform: uppercase;
}

.hero-text h2 {
  font-size: 2.5rem;
  line-height: 1.2;
  margin-bottom: 20px;
  color: var(--white);
  text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.7);
}

.hero-text p {
  font-size: 1.1rem;
  color: var(--white);
  margin-bottom: 30px;
  text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.7);
}

.hero-badges {
  display: flex;
  gap: 20px;
  align-items: center;
  color: var(--white);
  border-top: 1px solid rgba(255, 255, 255, 0.3);
  padding-top: 20px;
}

.badge-item i {
  color: var(--primary-red);
}

.badge-text {
  line-height: 1.2;
}

/* Hero Form Overlay */
.hero-form-container {
  position: relative;
  margin-top: 0;
  z-index: 10;
  max-width: 450px;
  width: 100%;
}

.hero-form-card {
  background: var(--white);
  padding: 30px;
  border-radius: 4px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
  border-top: 5px solid var(--primary-red);
}

.hero-form-card h3 {
  color: var(--white);
  font-size: 2rem;
  margin-bottom: 20px;
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
  font-weight: 700;
}

.hero-form-title {
  color: var(--primary-blue);
  font-size: 1.5rem;
  margin-bottom: 15px;
  text-align: center;
  font-weight: 700;
}

.hero-form-card {
  background: var(--white);
  padding: 20px 30px;
  border-radius: 12px;
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.25);
  max-width: 1200px;
  width: 100%;
  margin: 0 auto;
}

/* Form Group Radio */
.form-group-radio {
  margin-bottom: 12px;
}

.service-label {
  display: block;
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--text-dark);
  margin-bottom: 6px;
}

.radio-group {
  display: flex;
  gap: 15px;
  margin-top: 5px;
}

.radio-label {
  display: flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
  font-weight: 500;
  color: var(--text-dark);
}

.radio-label input[type="radio"] {
  width: 18px;
  height: 18px;
  cursor: pointer;
  accent-color: var(--primary-red);
}

.radio-label span {
  font-size: 0.95rem;
}

/* Form Row Grid */
.form-row-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
  margin-bottom: 12px;
}

.form-row-grid .form-group {
  margin-bottom: 0;
}

.form-row-grid .submit-group {
  grid-column: span 2;
}

.form-group {
  margin-bottom: 10px;
}

.form-group label {
  display: block;
  font-size: 0.8rem;
  color: #666;
  margin-bottom: 4px;
  font-weight: 600;
}

.form-control {
  width: 100%;
  background: #f9f9f9;
  border: 1px solid #ddd;
  padding: 8px 10px;
  border-radius: 4px;
  font-size: 0.9rem;
  transition: all 0.3s ease;
}

.form-control:focus {
  outline: none;
  border-color: var(--primary-red);
  background: #fff;
  box-shadow: 0 0 0 3px rgba(227, 24, 55, 0.1);
}

.submit-group button {
  width: 100%;
  padding: 10px;
  font-size: 0.95rem;
  font-weight: 700;
  text-transform: uppercase;
}

/* Consent Checkbox */
.form-group-consent {
  margin-bottom: 10px;
  padding: 10px;
  background-color: #f9f9f9;
  border-radius: 6px;
  border: 1px solid #e0e0e0;
}

.consent-label {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  cursor: pointer;
  font-size: 0.85rem;
  color: var(--text-dark);
  margin: 0;
}

.consent-label input[type="checkbox"] {
  width: 18px;
  height: 18px;
  margin-top: 2px;
  cursor: pointer;
  accent-color: var(--primary-red);
  flex-shrink: 0;
}

.consent-label span {
  font-weight: 500;
  line-height: 1.4;
}

/* Form Disclaimer */
.form-disclaimer {
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid #e0e0e0;
}

.form-disclaimer p {
  font-size: 0.7rem;
  color: #777;
  line-height: 1.4;
  margin-bottom: 6px;
}

.form-disclaimer p:last-child {
  margin-bottom: 0;
}

/* Mobile Responsive Form */
@media (max-width: 768px) {
  .form-row-grid {
    grid-template-columns: 1fr;
  }

  .form-row-grid .submit-group {
    grid-column: span 1;
  }

  .radio-group {
    flex-direction: column;
    gap: 12px;
  }

  .hero-form-title {
    font-size: 1.5rem;
  }

  .hero-form-card {
    padding: 25px 20px;
  }
}

/* Services Section (Adjusted) */
.services-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 30px;
  margin-top: 40px;
}

/* --- Modern Footer Redesign --- */
.modern-footer {
  background-color: #002855; /* Dark Navy Blue */
  color: #ffffff;
  padding: 20px 0 40px; /* Reduced top padding as per request */
  border-top: 4px solid #e63450; /* Branding highlight border */
  font-family: "Open Sans", sans-serif;
  position: relative;
  overflow: hidden;
}

.footer-container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;
}

.footer-grid {
  display: grid;
  grid-template-columns: 1.5fr 1fr 1fr 1fr;
  gap: 40px;
  margin-bottom: 60px;
}

/* Brand Column */
.footer-logo {
  margin-bottom: 25px;
}

.footer-logo img {
  max-width: 200px;
  height: auto;
  filter: brightness(0) invert(1); /* Ensure logo is visible on dark bg if it was dark */
}

.footer-phone {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: #ffffff;
  font-size: 1.2rem;
  font-weight: 700;
  text-decoration: none;
  margin-bottom: 30px;
  transition: var(--transition);
}

.footer-phone i {
  color: #e31837;
}

.footer-phone:hover {
  color: #e31837;
}

.footer-social {
  display: flex;
  gap: 15px;
}

.social-link {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  background: rgba(255, 255, 255, 0.1);
  border-radius: 8px;
  transition: all 0.3s ease;
  padding: 8px;
}

.social-link img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.social-link:hover {
  transform: translateY(-5px);
  background: rgba(255, 255, 255, 0.2);
}

/* Typography & Links */
.footer-heading {
  color: #ffffff;
  font-size: 1.25rem;
  font-weight: 700;
  margin-bottom: 30px;
  position: relative;
  text-transform: uppercase;
  letter-spacing: 1px;
}

.footer-heading::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -10px;
  width: 40px;
  height: 2px;
  background-color: #e31837;
}

.footer-links {
  list-style: none;
  padding: 0;
  margin: 0;
}

.footer-links li {
  margin-bottom: 15px;
}

.footer-links a {
  color: rgba(255, 255, 255, 0.8);
  font-size: 0.95rem;
  font-weight: 500;
  text-decoration: none;
  transition: all 0.3s ease;
}

.footer-links a:hover {
  color: #ffffff;
  padding-left: 8px;
}

/* Bottom Area */
.footer-divider {
  border: 0;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  margin-bottom: 30px;
}

.footer-bottom-flex {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 20px;
  margin-bottom: 25px;
}

.copyright-text p {
  margin: 0;
  font-size: 0.9rem;
  color: rgba(255, 255, 255, 0.6);
}

.legal-links {
  display: flex;
  gap: 25px;
}

.legal-links a {
  color: rgba(255, 255, 255, 0.6);
  font-size: 0.9rem;
  text-decoration: none;
  transition: color 0.3s ease;
}

.legal-links a:hover {
  color: #ffffff;
}

.legal-disclaimer {
  max-width: 800px;
}

.legal-disclaimer p {
  font-size: 0.75rem;
  line-height: 1.6;
  color: rgba(255, 255, 255, 0.4);
  margin: 0;
}

/* Responsive Footer */
@media (max-width: 991px) {
  .footer-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 768px) {
  .modern-footer {
    padding: 20px 0 30px; /* Adjusted for top border consistency */
    text-align: center;
  }

  .footer-grid {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .brand-column {
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  .footer-heading::after {
    left: 50%;
    transform: translateX(-50%);
  }

  .footer-social {
    justify-content: center;
  }

  .footer-bottom-flex {
    flex-direction: column;
  }

  .legal-links {
    justify-content: center;
    gap: 15px;
  }

  .footer-links a:hover {
    padding-left: 0;
    color: #e31837;
  }
}

.footer-col-links ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.footer-col-links ul li {
  margin-bottom: 14px; /* Increased item spacing */
}

.footer-col-links ul li a {
  color: #555555; /* Normal text color */
  font-size: 0.95rem;
  font-weight: 500;
  text-decoration: none;
  transition: color 0.2s ease;
  display: inline-block;
}

.footer-col-links ul li a:hover {
  color: #b52126;
  padding-left: 5px; /* Subtle movement */
}

/* Footer Divider */
.footer-divider {
  border: 0;
  border-top: 1px solid #e5e5e5;
  margin: 30px 0;
}

/* Bottom Section */
.footer-bottom {
  text-align: center;
  padding-top: 10px;
  font-size: 0.85rem;
  color: #777;
}

.footer-copyright p {
  margin-bottom: 15px;
  line-height: 1.6;
}

.footer-legal-links {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 25px; /* Increased gap */
  margin-bottom: 25px;
}

.footer-legal-links a {
  color: #b52126;
  font-weight: 700;
  text-decoration: none;
  font-size: 0.9rem;
}

.footer-legal-links a:hover {
  text-decoration: underline;
}

.footer-legal-links .privacy-rights {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.footer-disclaimer p {
  font-size: 0.75rem;
  color: #999;
  line-height: 1.5;
  margin-bottom: 10px;
}

/* Responsive Footer */
@media (max-width: 991px) {
  .footer-main-content {
    flex-direction: column;
  }

  .footer-brand-col {
    flex: 0 0 100%;
    max-width: 100%;
    text-align: center;
    padding-right: 0;
    margin-bottom: 40px;
  }

  .footer-logo {
    margin: 0 auto 20px;
  }

  .footer-social-icons {
    justify-content: center;
  }

  .footer-links-cols {
    flex: 0 0 100%;
    max-width: 100%;
    grid-template-columns: 1fr; /* Stack columns on mobile */
    gap: 30px;
    text-align: center; /* Center align on mobile */
  }

  .footer-col-links h4 {
    margin-bottom: 15px;
  }
}

/* --- Quick Service Finder Grid --- */
.services-grid-wrapper {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  gap: 20px;
  margin-top: 40px;
}

.service-card-mini {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: #ffffff;
  padding: 30px 20px;
  border-radius: 12px;
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
  transition: all 0.3s ease;
  text-decoration: none;
  border: 1px solid #eeeeee;
  height: 100%;
}

.service-card-mini:hover {
  transform: translateY(-8px);
  box-shadow: 0 15px 30px rgba(227, 24, 55, 0.15); /* Primary Red Glow */
  border-color: var(--primary-red);
}

.service-card-mini i {
  font-size: 2.5rem;
  color: var(--primary-red);
  margin-bottom: 15px;
  transition: transform 0.3s ease;
}

.service-card-mini:hover i {
  transform: scale(1.1);
}

.service-card-mini span {
  font-weight: 600;
  color: var(--text-dark);
  font-size: 0.95rem;
  text-align: center;
  line-height: 1.3;
}

/* --- Areas We Serve (Pills) --- */
.locations-grid {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 15px;
  margin-top: 40px;
}

.location-item {
  background: #ffffff;
  padding: 12px 28px;
  border-radius: 50px;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
  font-weight: 600;
  color: var(--text-dark);
  display: flex;
  align-items: center;
  gap: 10px;
  transition: all 0.3s ease;
  border: 1px solid #eeeeee;
  cursor: default;
  font-size: 0.95rem;
}

.location-item:hover {
  background: var(--primary-blue);
  color: #ffffff;
  transform: translateY(-3px);
  box-shadow: 0 8px 20px rgba(0, 40, 85, 0.2);
  border-color: var(--primary-blue);
}

.location-item i {
  color: var(--primary-red);
  transition: color 0.3s ease;
}

.location-item:hover i {
  color: #ffffff;
}

/* Responsive */
@media (max-width: 768px) {
  .navbar {
    padding-left: 20px;
    padding-right: 20px;
  }

  .nav-links {
    display: none;
    flex-direction: column;
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    background-color: var(--white);
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    padding: 20px;
    text-align: center;
  }

  .nav-links.active {
    display: flex;
  }

  .mobile-menu-btn {
    display: block;
  }

  .top-bar {
    display: none;
  }

  .hero-content h1 {
    font-size: 2rem;
  }

  .about-preview {
    flex-direction: column;
  }

  /* Mobile Hero Optimization */
  .hero {
    min-height: 500px;
    /* Adjusted height */
    background-position: 70% center;
    /* Focus on technician */
    padding-top: 20px;
    align-items: flex-start;
    /* Align text to top */
  }

  .hero-content {
    padding: 0 15px;
    /* Minimal side padding */
    width: 100%;
    margin-top: 20px;
  }

  .hero-text {
    text-align: left;
    width: 100%;
    color: var(--white);
    text-shadow: 0 2px 10px rgba(0, 0, 0, 0.8);
    padding-bottom: 20px; /* Add some space below text */
  }

  .hero-content h1 {
    font-size: 1.8rem;
    font-weight: 800;
    line-height: 1.2;
    margin-bottom: 10px;
    color: var(--white);
    /* Override generic H1 color */
    margin-top: 0;
  }

  .hero-content h2 {
    font-size: 1.3rem;
    color: var(--white);
    margin-bottom: 15px;
    font-weight: 600;
  }

  .hero-content p {
    font-size: 0.95rem;
    line-height: 1.4;
    margin-bottom: 0;
    color: var(--white);
    font-weight: 500;
  }

  .hero-form-container {
    margin-top: 20px;
    /* Remove overlap on mobile, stack below text */
    padding: 0 15px;
    margin-bottom: 20px;
  }

  .hero-form-title {
    font-size: 1.5rem;
    /* Smaller title on mobile */
    text-align: center;
  }

  .hero-form-card {
    padding: 20px;
    margin-bottom: 30px; /* Ensure space at bottom of hero on mobile */
  }
}

/* Hide mobile actions on desktop */
.d-md-none {
  display: none;
}

@media (max-width: 768px) {
  .d-md-none {
    display: block;
  }
}

/* Mobile Menu Toggle (SVG) */
.mobile-menu-toggle {
  display: none;
  /* Hidden on desktop */
  margin-left: auto;
  cursor: pointer;
}

.mobile-menu-toggle img {
  display: block;
  width: 30px;
  height: auto;
  transition: transform 0.3s ease;
}

.mobile-menu-toggle:hover img {
  transform: scale(1.1);
}

/* Show on Mobile (Max width 1025px) */
@media (max-width: 1025px) {
  .mobile-menu-toggle {
    display: block;
  }

  /* Hide Main Nav if not already handled */
  .navbar nav {
    display: none;
  }
}

/* Button Icon Styling */
.btn-icon {
  width: 18px;
  height: auto;
  margin-right: 8px;
  vertical-align: middle;
  display: inline-block;
  position: relative;
  top: -1px;
  /* Slight adjustment for alignment */
}

/* -----------------------------------------------------------
   Sticky Header Implementation
----------------------------------------------------------- */
.site-header {
  position: -webkit-sticky;
  /* Safari */
  position: sticky;
  top: 0;
  z-index: 9999;
  /* High Z-Index */
  background-color: #ffffff;
  /* Ensure background is solid white */
  width: 100%;
  transition:
    box-shadow 0.3s ease,
    padding 0.3s ease;
}

/* Sticky State Styling */
.site-header.is-sticky {
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
  /* Smooth Shadow */
}

/* Optional: Hide Top Bar on Scroll for cleaner look */
.site-topbar {
  transition:
    max-height 0.3s ease,
    padding 0.3s ease,
    opacity 0.3s ease;
  max-height: 50px;
  /* Approximate height */
  opacity: 1;
  overflow: hidden;
}

.site-header.is-sticky .site-topbar {
  max-height: 0;
  padding: 0;
  opacity: 0;
}

/* Marquee Bar Base Styles with Transition */
.marquee-bar {
  transition:
    max-height 0.3s ease,
    padding 0.3s ease,
    opacity 0.3s ease;
  max-height: 50px;
  opacity: 1;
  overflow: hidden;
}

/* Hide Marquee Bar on Scroll */
.site-header.is-sticky .marquee-bar {
  max-height: 0;
  padding: 0;
  opacity: 0;
}

/* Ensure Header Top (Logo area) adjusts if needed */
.header-top {
  transition: padding 0.3s ease;
}

.site-header.is-sticky .header-top {
  padding-top: 5px;
  padding-bottom: 5px;
}

/* -----------------------------------------------------------
   Mobile Side Menu Styles
----------------------------------------------------------- */

/* Mobile Menu Overlay */
.mobile-menu-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 9998;
  opacity: 0;
  visibility: hidden;
  transition:
    opacity 0.3s ease,
    visibility 0.3s ease;
}

.mobile-menu-overlay.active {
  opacity: 1;
  visibility: visible;
}

/* Mobile Side Menu Container */
.mobile-side-menu {
  position: fixed;
  top: 0;
  right: -100%;
  width: 320px;
  max-width: 85%;
  height: 100%;
  background-color: #ffffff;
  z-index: 9999;
  overflow-y: auto;
  transition: right 0.3s ease;
  box-shadow: -5px 0 15px rgba(0, 0, 0, 0.2);
  display: flex;
  flex-direction: column;
}

.mobile-side-menu.active {
  right: 0;
}

/* Mobile Menu Header */
.mobile-menu-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20px;
  border-bottom: 1px solid #f0f0f0;
  background-color: #fff;
}

.mobile-logo img {
  max-height: 40px;
  width: auto;
}

.close-menu-btn {
  cursor: pointer;
  padding: 5px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.2s ease;
}

.close-menu-btn:hover {
  transform: scale(1.1);
}

.close-menu-btn svg {
  width: 24px;
  height: 24px;
}

/* Mobile Action Buttons */
.mobile-action-buttons {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 20px;
  border-bottom: 1px solid #f0f0f0;
}

.mobile-action-buttons .btn-get-started,
.mobile-action-buttons .btn-call-us {
  width: 100%;
  justify-content: center;
  padding: 12px 20px;
}

/* Mobile Navigation */
.mobile-nav {
  flex: 1;
  padding: 20px 0;
}

.mobile-menu-items {
  list-style: none;
  margin: 0;
  padding: 0;
}

.mobile-menu-items li {
  border-bottom: 1px solid #f0f0f0;
}

.mobile-menu-items li:last-child {
  border-bottom: none;
}

.mobile-menu-items li a {
  display: block;
  padding: 15px 20px;
  color: var(--primary-blue);
  font-weight: 600;
  font-size: 1rem;
  text-decoration: none;
  transition: all 0.3s ease;
}

.mobile-menu-items li a:hover {
  background-color: #f9f9f9;
  color: var(--primary-red);
  padding-left: 25px;
}

/* Mobile Social Icons */
.mobile-social-icons {
  display: flex;
  justify-content: center;
  gap: 20px;
  padding: 20px;
  border-top: 1px solid #f0f0f0;
  background-color: #f9f9f9;
}

.mobile-social-icons a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background-color: #fff;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  transition: all 0.3s ease;
}

.mobile-social-icons a:hover {
  transform: translateY(-3px);
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15);
}

.mobile-social-icons a img {
  width: 20px;
  height: 20px;
}

/* Services Grid */
.service-item {
  padding: 30px;
  background-color: #fff;
  border-radius: 8px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
  transition: all 0.3s ease;
}

.service-item:hover {
  transform: translateY(-10px);
  box-shadow: 0 15px 30px rgba(0, 0, 0, 0.15);
}

.service-item h3 {
  color: var(--primary-blue);
  margin: 15px 0 10px;
  font-size: 1.3rem;
}

.service-item p {
  color: var(--text-light);
  line-height: 1.6;
}

/* Hide desktop utility links on mobile */
@media (max-width: 1024px) {
  .d-none.d-md-flex {
    display: none !important;
  }
}

/* Show desktop utility links on larger screens */
@media (min-width: 1025px) {
  .d-none.d-md-flex {
    display: flex !important;
  }
}
/* =========================================
   MULTI-PAGE STYLES (Services, About, Contact)
   ========================================= */

/* Page Header */
.page-header {
  background:
    linear-gradient(rgba(0, 40, 85, 0.8), rgba(0, 40, 85, 0.8)),
    url("../images/hero-bg.png");
  background-size: cover;
  background-position: center;
  padding: 60px 0;
  color: #fff;
  text-align: center;
  margin-bottom: 40px;
}

.page-header h1 {
  font-size: 2.5rem;
  font-weight: 700;
  margin-bottom: 15px;
  color: #fff;
}

.breadcrumb {
  justify-content: center;
  padding: 0;
  margin: 0;
  background: transparent;
  list-style: none;
  display: flex;
}

.breadcrumb li {
  font-size: 1rem;
  color: rgba(255, 255, 255, 0.8);
}

.breadcrumb li + li:before {
  content: "/\00a0";
  padding: 0 10px;
  color: rgba(255, 255, 255, 0.6);
}

.breadcrumb li a {
  color: #fff;
  text-decoration: none;
}

.breadcrumb li.active {
  color: var(--primary-red);
  font-weight: 600;
}

/* Service Detail Row */
.service-detail-row {
  padding: 30px 0;
}

.service-img-wrapper {
  overflow: hidden;
  border-radius: 12px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

.service-img-wrapper img {
  width: 100%;
  height: auto;
  transition: transform 0.3s ease;
}

.service-img-wrapper:hover img {
  transform: scale(1.03);
}

.service-info h2 {
  font-size: 1.8rem;
  color: var(--primary-blue);
  margin-bottom: 15px;
}

.service-info p {
  color: #666;
  font-size: 1rem;
  line-height: 1.6;
  margin-bottom: 20px;
}

.service-features {
  list-style: none;
  padding: 0;
  margin: 0;
}

.service-features li {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
  color: var(--text-dark);
  font-size: 0.95rem;
}

.service-features li i {
  color: var(--primary-red);
}

.price-tag {
  display: inline-block;
  background: #f0f8ff;
  color: var(--primary-blue);
  padding: 8px 15px;
  border-radius: 20px;
  font-weight: 600;
  font-size: 0.9rem;
  border: 1px solid #d1e3f8;
}

.service-divider {
  margin: 40px 0;
  border-top: 1px solid #eee;
}

/* Mobile Adjustments for Secondary Pages */
@media (max-width: 768px) {
  .reverse-order-mobile {
    flex-direction: column-reverse;
  }

  .service-info.pl-md-4,
  .service-info.pr-md-4 {
    padding: 0;
    margin-top: 20px;
  }

  .page-header h1 {
    font-size: 2rem;
  }
}

/* Stats Counter Section */
.stats-counter-section {
  background-color: var(--primary-blue);
  padding: 40px 0;
  margin-top: -60px; /* Overlap hero slightly */
  position: relative;
  z-index: 20;
  border-radius: 8px;
  max-width: 1100px;
  margin-left: auto;
  margin-right: auto;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
}

.stats-wrapper {
  display: flex;
  justify-content: space-around;
  align-items: center;
  color: #fff;
  text-align: center;
}

.stat-item {
  flex: 1;
  padding: 10px;
}

.stat-number {
  font-size: 2.5rem;
  font-weight: 800;
  color: var(--primary-red);
  margin-bottom: 5px;
  line-height: 1;
}

.stat-label {
  font-size: 0.9rem;
  font-weight: 500;
  opacity: 0.9;
  text-transform: uppercase;
  letter-spacing: 1px;
}

.stat-divider {
  width: 1px;
  height: 60px;
  background-color: rgba(255, 255, 255, 0.2);
}

/* Fix Featured Card Image */
.card-img {
  overflow: hidden; /* Ensure image doesn't overflow rounded corners if any */
  padding: 0; /* Remove padding if any */
}

.card-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.5s ease;
}

.featured-card:hover .card-img img {
  transform: scale(1.1);
}

/* Mobile Stats */
@media (max-width: 768px) {
  .stats-counter-section {
    margin-top: 20px;
    border-radius: 0;
  }

  .stats-wrapper {
    flex-direction: row;
    flex-wrap: wrap;
  }

  .stat-item {
    flex: 1 1 50%; /* 2 per row */
    margin-bottom: 20px;
  }

  .stat-number {
    font-size: 2rem;
  }
}

/* Parallax Effect */
.parallax-bg {
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

/* Enhanced CTA Banner */
.cta-banner {
  background:
    linear-gradient(rgba(0, 40, 85, 0.9), rgba(0, 40, 85, 0.7)),
    url("https://images.unsplash.com/photo-1581094794329-cd56b509538e?auto=format&fit=crop&w=1500&q=80");
  color: #fff;
  padding: 80px 0;
  text-align: center;
}

/* Floating Animation for Cards */
@keyframes float {
  0% {
    transform: translateY(0px);
  }
  50% {
    transform: translateY(-10px);
  }
  100% {
    transform: translateY(0px);
  }
}

.featured-card:hover {
  animation: float 3s ease-in-out infinite;
  box-shadow: 0 15px 30px rgba(0, 0, 0, 0.2);
}

.service-icon-box:hover {
  transform: translateY(-5px);
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
}

/* --- Modern Testimonials Section --- */
.testimonials-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px;
  margin-top: 40px;
}

.testimonial-card {
  background: #ffffff;
  padding: 35px 30px;
  border-radius: 12px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
  transition: all 0.3s ease;
  border-bottom: 3px solid transparent;
  position: relative;
  display: flex;
  flex-direction: column;
}

.testimonial-card:hover {
  transform: translateY(-10px);
  box-shadow: 0 15px 40px rgba(0, 0, 0, 0.1);
  border-bottom-color: #e31837; /* Primary Red Highlight */
}

.quote-icon {
  font-size: 2rem;
  color: #e31837;
  margin-bottom: 20px;
  opacity: 0.2;
}

.testimonial-card .review-text {
  font-size: 1rem;
  color: #555;
  line-height: 1.7;
  font-style: italic;
  margin-bottom: 25px;
  flex-grow: 1; /* Pushes content down to align bottoms */
}

.review-rating {
  color: #ffc107; /* Gold */
  font-size: 0.9rem;
  margin-bottom: 15px;
}

.customer-info {
  display: flex;
  align-items: center;
  border-top: 1px solid #eee;
  padding-top: 15px;
}

.customer-details h4 {
  font-size: 1.1rem;
  font-weight: 700;
  margin-bottom: 2px;
  color: #222;
}

.customer-details span {
  font-size: 0.85rem;
  color: #777;
  display: block;
}

/* Responsive Testimonials */
@media (max-width: 991px) {
  .testimonials-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 767px) {
  .testimonials-grid {
    grid-template-columns: 1fr;
  }

  .testimonial-card {
    padding: 25px;
  }
}

/* --- Premium Colorful How It Works Section --- */
.process-timeline-premium {
  position: relative;
  padding-top: 50px;
}

.process-step-premium {
  background: #ffffff;
  padding: 40px 25px;
  border-radius: 15px;
  text-align: center;
  position: relative;
  transition: all 0.4s ease;
  border: 1px solid #eee;
  height: 100%;
  z-index: 1;
  overflow: hidden;
  /* Red Top Border for Brand Consistency */
  border-top: 5px solid #e31837;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
}

.process-step-premium:hover {
  transform: translateY(-10px);
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.12);
}

/* Step Number Badge (Red) */
.process-step-premium .step-badge {
  position: absolute;
  top: 20px;
  right: 20px;
  font-size: 3rem;
  font-weight: 900;
  color: rgba(227, 24, 55, 0.08); /* Faded Red */
  line-height: 1;
  z-index: 0;
  transition: all 0.3s ease;
}

.process-step-premium:hover .step-badge {
  color: rgba(227, 24, 55, 0.15);
  transform: scale(1.1);
}

/* Icon Container (Red Theme) */
.process-step-premium .step-icon {
  width: 80px;
  height: 80px;
  background: #ffffff; /* White Background */
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 25px;
  color: #e31837; /* Red Icon */
  font-size: 2.2rem;
  position: relative;
  z-index: 1;
  box-shadow: 0 5px 15px rgba(227, 24, 55, 0.15);
  border: 2px solid #e31837; /* Red Border */
}

.process-step-premium:hover .step-icon {
  background: #e31837;
  color: #ffffff;
  box-shadow: 0 10px 25px rgba(227, 24, 55, 0.3);
}

.process-step-premium h3 {
  font-size: 1.3rem;
  font-weight: 700;
  color: #222;
  margin-bottom: 12px;
  position: relative;
  z-index: 1;
}

.process-step-premium p {
  font-size: 0.95rem;
  color: #555;
  line-height: 1.6;
  margin: 0;
  position: relative;
  z-index: 1;
}

/* Contact Form Compact Styling */
.contact-form-box .form-control {
  padding: 8px 12px;
  font-size: 0.95rem;
  height: auto;
}

.contact-form-box .mb-3 {
  margin-bottom: 15px !important;
}

.contact-form-box label {
  margin-bottom: 5px;
  font-size: 0.9rem;
  font-weight: 500;
}

.contact-form-box h3 {
  margin-bottom: 20px;
}

.contact-form-box {
  padding: 25px !important;
}

.contact-info-box {
  padding: 25px !important;
}

/* Responsive adjustments */
@media (max-width: 768px) {
  .contact-form-box,
  .contact-info-box {
    padding: 20px !important;
  }
}

/* =========================================
   COMPACT HERO FORM STYLES
   ========================================= */

/* Compact Form Card */
.hero-form-card-compact {
  background: rgba(255, 255, 255, 0.98);
  border-radius: 12px;
  padding: 25px 20px;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.15);
  max-width: 380px;
  margin: 0 auto;
}

/* Compact Form Title */
.hero-form-title-compact {
  font-size: 1.4rem;
  font-weight: 700;
  color: var(--primary-blue);
  text-align: center;
  margin-bottom: 18px;
  line-height: 1.2;
}

/* Compact Radio Group */
.form-group-radio-compact {
  margin-bottom: 15px;
}

.radio-group-compact {
  display: flex;
  gap: 10px;
  justify-content: center;
}

.radio-label-compact {
  display: flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
  font-size: 0.9rem;
  font-weight: 500;
  color: var(--text-dark);
}

.radio-label-compact input[type="radio"] {
  width: 16px;
  height: 16px;
  cursor: pointer;
  accent-color: var(--primary-red);
}

.radio-label-compact span {
  user-select: none;
}

/* Compact Form Fields */
.form-fields-compact {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.form-group-compact {
  margin: 0;
}

.form-control-compact {
  width: 100%;
  padding: 12px 15px;
  border: 1px solid #ddd;
  border-radius: 6px;
  font-size: 0.95rem;
  font-family: "Poppins", sans-serif;
  transition: all 0.3s ease;
  background: #fff;
}

.form-control-compact:focus {
  outline: none;
  border-color: var(--primary-red);
  box-shadow: 0 0 0 3px rgba(227, 24, 55, 0.1);
}

.form-control-compact::placeholder {
  color: #999;
  font-size: 0.9rem;
}

/* Compact Submit Button */
.btn-submit-compact {
  width: 100%;
  padding: 14px 20px;
  background: var(--primary-red);
  color: #fff;
  border: none;
  border-radius: 6px;
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: 0.5px;
  cursor: pointer;
  transition: all 0.3s ease;
  margin-top: 5px;
  text-transform: uppercase;
}

.btn-submit-compact:hover {
  background: #c01530;
  transform: translateY(-2px);
  box-shadow: 0 5px 15px rgba(227, 24, 55, 0.3);
}

.btn-submit-compact:active {
  transform: translateY(0);
}

/* Compact Consent */
.form-consent-compact {
  margin-top: 12px;
}

.consent-label-compact {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  cursor: pointer;
  font-size: 0.8rem;
  color: #666;
  line-height: 1.4;
}

.consent-label-compact input[type="checkbox"] {
  margin-top: 2px;
  width: 16px;
  height: 16px;
  cursor: pointer;
  accent-color: var(--primary-red);
  flex-shrink: 0;
}

.consent-label-compact span {
  user-select: none;
}

/* Mobile Responsive Adjustments for Compact Form */
@media (max-width: 768px) {
  .hero-form-card-compact {
    padding: 20px 15px;
    max-width: 100%;
  }

  .hero-form-title-compact {
    font-size: 1.2rem;
    margin-bottom: 15px;
  }

  .form-control-compact {
    padding: 10px 12px;
    font-size: 0.9rem;
  }

  .btn-submit-compact {
    padding: 12px 18px;
    font-size: 0.95rem;
  }

  .consent-label-compact {
    font-size: 0.75rem;
  }

  /* Hide top bar on mobile/phone screens */
  .site-topbar {
    display: none !important;
  }
}

/* =========================================
   MOBILE DROPDOWN MENU STYLES
   ========================================= */

/* Mobile menu item with children */
.mobile-menu-item-has-children {
  position: relative;
}

.mobile-menu-item-has-children > a {
  display: inline-block;
  width: calc(100% - 40px);
}

/* Mobile dropdown toggle icon */
.mobile-dropdown-toggle {
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: transform 0.3s ease;
}

.mobile-dropdown-toggle i {
  font-size: 14px;
  color: var(--text-dark);
  transition: transform 0.3s ease;
}

/* Rotate icon when dropdown is active */
.mobile-menu-item-has-children.active .mobile-dropdown-toggle i {
  transform: rotate(180deg);
}

/* Mobile sub-menu */
.mobile-sub-menu {
  display: none;
  list-style: none;
  padding-left: 20px;
  margin-top: 10px;
  margin-bottom: 10px;
  border-left: 2px solid var(--primary-red);
}

.mobile-sub-menu.active {
  display: block;
  animation: slideDown 0.3s ease;
}

.mobile-sub-menu li {
  margin-bottom: 8px;
}

.mobile-sub-menu li a {
  display: block;
  padding: 8px 15px;
  color: var(--text-light);
  font-size: 0.95rem;
  text-decoration: none;
  transition: all 0.3s ease;
  border-radius: 4px;
}

.mobile-sub-menu li a:hover {
  background: rgba(227, 24, 55, 0.1);
  color: var(--primary-red);
  padding-left: 20px;
}

/* Slide down animation */
@keyframes slideDown {
  from {
    opacity: 0;
    max-height: 0;
  }
  to {
    opacity: 1;
    max-height: 300px;
  }
}

/* =========================================
   WHY CHOOSE US SECTION STYLES
   ========================================= */

/* Why Choose Us Section */
.why-choose-us-section {
  background: #fff;
}

/* Why Choose Us Content */
.why-choose-content {
  padding-left: 0;
}

.section-heading {
  font-size: 2.5rem;
  font-weight: 700;
  line-height: 1.2;
}

.section-subheading {
  font-size: 1.1rem;
  color: var(--text-light);
  line-height: 1.6;
}

/* Why Choose Us Card List */
.why-choose-list {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

/* Individual Why Choose Card - Matching Screenshot */
.why-choose-card {
  display: flex;
  align-items: center;
  gap: 15px;
  padding: 20px 25px;
  background: #fff;
  border-left: 4px solid var(--primary-red);
  border-radius: 8px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
  transition: all 0.3s ease;
}

.why-choose-card:hover {
  box-shadow: 0 4px 20px rgba(227, 24, 55, 0.15);
  transform: translateX(5px);
}

/* Card Icon */
.why-choose-card .card-icon {
  width: 50px;
  height: 50px;
  min-width: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--primary-red);
  border-radius: 50%;
  color: #fff;
  font-size: 1.3rem;
}

/* Card Title */
.why-choose-card .card-title {
  font-size: 1.1rem;
  font-weight: 600;
  color: var(--text-dark);
  margin: 0;
  line-height: 1.4;
}

/* Why Choose Image Wrapper */
.why-choose-image-wrapper {
  position: relative;
}

.why-choose-image-wrapper .main-img {
  border-radius: 12px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
  width: 100%;
  height: auto;
}

/* Experience Badge */
.experience-badge {
  position: absolute;
  bottom: 20px;
  right: 20px;
  background: var(--primary-red);
  color: #fff;
  padding: 20px;
  border-radius: 12px;
  text-align: center;
  box-shadow: 0 5px 20px rgba(227, 24, 55, 0.3);
}

.experience-badge .years {
  display: block;
  font-size: 2.5rem;
  font-weight: 700;
  line-height: 1;
  margin-bottom: 5px;
}

.experience-badge .text {
  display: block;
  font-size: 0.9rem;
  font-weight: 500;
  line-height: 1.3;
}

/* Responsive Adjustments */
@media (max-width: 991px) {
  .why-choose-content {
    padding-left: 0 !important;
  }

  .section-heading {
    font-size: 2rem;
  }
}

@media (max-width: 768px) {
  .why-choose-card {
    padding: 15px 20px;
  }

  .why-choose-card .card-icon {
    width: 45px;
    height: 45px;
    min-width: 45px;
    font-size: 1.1rem;
  }

  .why-choose-card .card-title {
    font-size: 1rem;
  }

  .section-heading {
    font-size: 1.75rem;
  }
}

/* =========================================
   FEATURED SERVICES SECTION STYLING
   ========================================= */

/* Icon circle for featured service cards */
.featured-icon-circle {
  width: 72px;
  height: 72px;
  border-radius: 50%;
  background: rgba(227, 24, 55, 0.08);
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 16px;
  transition:
    background 0.3s ease,
    transform 0.3s ease;
}

.featured-card:hover .featured-icon-circle {
  background: rgba(227, 24, 55, 0.15);
  transform: scale(1.1);
}

/* Featured Card - Icon Style */
#featured-services .featured-card {
  border: 1px solid rgba(0, 0, 0, 0.06);
  transition:
    transform 0.3s ease,
    box-shadow 0.3s ease;
}

#featured-services .featured-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 16px 32px rgba(227, 24, 55, 0.12);
}

/* Featured Card - Original SVG style */
#featured .container {
  background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%);
  position: relative;
  overflow: hidden;
}

#featured::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 100%;
  background:
    radial-gradient(
      circle at 20% 50%,
      rgba(227, 24, 55, 0.03) 0%,
      transparent 50%
    ),
    radial-gradient(
      circle at 80% 80%,
      rgba(0, 40, 85, 0.03) 0%,
      transparent 50%
    );
  pointer-events: none;
  z-index: 0;
}

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

/* Featured Card Styling */
.featured-card {
  background: #ffffff;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
  transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  position: relative;
  height: 100%;
  display: flex;
  flex-direction: column;
  border: 1px solid rgba(0, 0, 0, 0.05);
}

.featured-card::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: linear-gradient(90deg, #e31837 0%, #c01530 100%);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.4s ease;
  z-index: 2;
}

.featured-card:hover::before {
  transform: scaleX(1);
}

.featured-card:hover {
  transform: translateY(-12px);
  box-shadow: 0 20px 40px rgba(227, 24, 55, 0.15);
  border-color: rgba(227, 24, 55, 0.1);
}

/* Card Image Container */
.featured-card .card-img {
  position: relative;
  width: 100%;
  height: 220px;
  overflow: hidden;
  background: linear-gradient(135deg, #f0f0f0 0%, #e0e0e0 100%);
}

.featured-card .card-img::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(180deg, transparent 0%, rgba(0, 0, 0, 0.3) 100%);
  opacity: 0;
  transition: opacity 0.4s ease;
  z-index: 1;
}

.featured-card:hover .card-img::after {
  opacity: 1;
}

.featured-card .card-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.featured-card:hover .card-img img {
  transform: scale(1.15);
}

/* Card Body */
.featured-card .card-body {
  padding: 24px;
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  position: relative;
  background: #ffffff;
}

.featured-card .card-body::before {
  content: "";
  position: absolute;
  top: 0;
  left: 24px;
  right: 24px;
  height: 1px;
  background: linear-gradient(
    90deg,
    transparent 0%,
    rgba(227, 24, 55, 0.2) 50%,
    transparent 100%
  );
}

.featured-card .card-body h3 {
  font-size: 1.25rem;
  font-weight: 700;
  color: #002855;
  margin-bottom: 12px;
  line-height: 1.3;
  transition: color 0.3s ease;
  position: relative;
  display: inline-block;
}

.featured-card:hover .card-body h3 {
  color: #e31837;
}

.featured-card .card-body p {
  font-size: 0.95rem;
  color: #666;
  line-height: 1.6;
  margin-bottom: 16px;
  flex-grow: 1;
}

/* Book Now Button */
.featured-card .btn-text {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #e31837;
  font-weight: 600;
  font-size: 0.95rem;
  text-decoration: none;
  transition: all 0.3s ease;
  position: relative;
  padding-bottom: 2px;
}

.featured-card .btn-text::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0;
  height: 2px;
  background: #e31837;
  transition: width 0.3s ease;
}

.featured-card:hover .btn-text::after {
  width: calc(100% - 24px);
}

.featured-card .btn-text i {
  transition: transform 0.3s ease;
}

.featured-card:hover .btn-text i {
  transform: translateX(5px);
}

.featured-card .btn-text:hover {
  color: #c01530;
  gap: 12px;
}

/* Service Icon Badge (Optional Enhancement) */
.featured-card .service-badge {
  position: absolute;
  top: 16px;
  right: 16px;
  background: rgba(255, 255, 255, 0.95);
  backdrop-filter: blur(10px);
  padding: 8px 12px;
  border-radius: 20px;
  font-size: 0.75rem;
  font-weight: 600;
  color: #e31837;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
  z-index: 2;
  transition: all 0.3s ease;
}

.featured-card:hover .service-badge {
  background: #e31837;
  color: #ffffff;
  transform: scale(1.05);
}

/* Responsive Adjustments */
@media (max-width: 991px) {
  .featured-card .card-img {
    height: 200px;
  }

  .featured-card .card-body h3 {
    font-size: 1.15rem;
  }

  .featured-card .card-body {
    padding: 20px;
  }
}

@media (max-width: 767px) {
  .featured-card {
    margin-bottom: 20px;
  }

  .featured-card .card-img {
    height: 180px;
  }

  .featured-card .card-body {
    padding: 18px;
  }

  .featured-card .card-body h3 {
    font-size: 1.1rem;
  }

  .featured-card .card-body p {
    font-size: 0.9rem;
  }

  .featured-card:hover {
    transform: translateY(-6px);
  }
}

/* Loading Animation for Images */
@keyframes shimmer {
  0% {
    background-position: -1000px 0;
  }
  100% {
    background-position: 1000px 0;
  }
}

.featured-card .card-img.loading {
  background: linear-gradient(90deg, #f0f0f0 0px, #f8f8f8 40px, #f0f0f0 80px);
  background-size: 1000px 100%;
  animation: shimmer 2s infinite;
}

/* =========================================
   HOME MAINTENANCE TIPS (BLOG) STYLING
   ========================================= */

#blog {
  background: #fcfcfc;
  position: relative;
}

.blog-card {
  background: #ffffff;
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
  transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
  height: 100%;
  display: flex;
  flex-direction: column;
  border: 1px solid rgba(0, 0, 0, 0.03);
}

.blog-card:hover {
  transform: translateY(-10px);
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
}

.blog-img {
  position: relative;
  height: 240px;
  overflow: hidden;
}

.blog-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.8s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.blog-card:hover .blog-img img {
  transform: scale(1.1);
}

.blog-img::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(
    to bottom,
    transparent 60%,
    rgba(0, 0, 0, 0.4) 100%
  );
  opacity: 0.7;
}

/* Category Badge */
.blog-category {
  position: absolute;
  top: 20px;
  left: 20px;
  background: var(--primary-red);
  color: #fff;
  padding: 6px 15px;
  border-radius: 50px;
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1px;
  z-index: 2;
  box-shadow: 0 5px 15px rgba(227, 24, 55, 0.2);
}

.blog-body {
  padding: 30px;
  flex-grow: 1;
  display: flex;
  flex-direction: column;
}

.blog-meta {
  display: flex;
  align-items: center;
  gap: 15px;
  margin-bottom: 15px;
  font-size: 0.85rem;
  color: #888;
}

.blog-meta span {
  display: flex;
  align-items: center;
  gap: 5px;
}

.blog-body h3 {
  font-size: 1.4rem;
  font-weight: 700;
  color: var(--primary-blue);
  margin-bottom: 15px;
  line-height: 1.4;
  transition: color 0.3s ease;
}

.blog-card:hover .blog-body h3 {
  color: var(--primary-red);
}

.blog-body p {
  font-size: 0.95rem;
  color: #666;
  line-height: 1.7;
  margin-bottom: 25px;
  flex-grow: 1;
}

.read-more {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--primary-red);
  font-weight: 700;
  font-size: 0.95rem;
  text-decoration: none;
  transition: all 0.3s ease;
  width: fit-content;
}

.read-more i {
  font-size: 0.8rem;
  transition: transform 0.3s ease;
}

.read-more:hover {
  gap: 12px;
  color: var(--primary-blue);
}

.read-more:hover i {
  transform: translateX(3px);
}

/* Stagger Animation for Blog Cards */
#blog .col-md-4 {
  opacity: 0;
  transform: translateY(30px);
  transition: all 0.6s ease-out;
}

#blog.aos-animate .col-md-4 {
  opacity: 1;
  transform: translateY(0);
}

/* Responsive adjustments */
@media (max-width: 991px) {
  .blog-img {
    height: 200px;
  }
  .blog-body {
    padding: 20px;
  }
  .blog-body h3 {
    font-size: 1.2rem;
  }
}

/* =========================================
   FAQ SECTION REDESIGN (2026 STYLE)
   ========================================= */

#faq {
  background:
    radial-gradient(
      circle at 10% 10%,
      rgba(227, 24, 55, 0.02) 0%,
      transparent 40%
    ),
    radial-gradient(
      circle at 90% 90%,
      rgba(0, 40, 85, 0.02) 0%,
      transparent 40%
    );
  position: relative;
  overflow: hidden;
}

.faq-container {
  max-width: 900px;
  margin: 40px auto 0;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.faq-item {
  background: rgba(255, 255, 255, 0.7);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border: 1px solid rgba(255, 255, 255, 0.5);
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.03);
  transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  position: relative;
}

.faq-item:hover {
  transform: translateY(-5px);
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.06);
  border-color: rgba(227, 24, 55, 0.2);
}

.faq-item.active {
  background: #ffffff;
  border-color: var(--primary-red);
  box-shadow: 0 25px 50px rgba(227, 24, 55, 0.08);
  transform: translateY(-5px);
}

.faq-question {
  width: 100%;
  background: none;
  border: none;
  padding: 25px 30px;
  text-align: left;
  display: flex;
  justify-content: space-between;
  align-items: center;
  cursor: pointer;
  outline: none;
  font-size: 1.2rem;
  font-weight: 700;
  color: var(--primary-blue);
  transition: color 0.3s ease;
  gap: 20px;
}

.faq-question-text {
  display: flex;
  align-items: center;
  gap: 15px;
}

.faq-question i.q-icon {
  font-size: 1.3rem;
  color: var(--primary-red);
  background: rgba(227, 24, 55, 0.08);
  width: 45px;
  height: 45px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
  transition: all 0.3s ease;
}

.faq-item.active i.q-icon {
  background: var(--primary-red);
  color: #fff;
}

.faq-question .arrow {
  width: 35px;
  height: 35px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #f8f9fa;
  border-radius: 50%;
  color: #888;
  transition: all 0.4s ease;
}

.faq-item.active .arrow {
  background: var(--primary-red);
  color: #fff;
  transform: rotate(180deg);
}

.faq-answer {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.5s cubic-bezier(0.4, 0, 0.2, 1);
  background: transparent;
}

.faq-answer-content {
  padding: 0 30px 30px 90px;
  color: #666;
  line-height: 1.8;
  font-size: 1.05rem;
}

.faq-item.active .faq-answer {
  max-height: 500px; /* High enough to contain content */
}

/* Side decorative element for active state */
.faq-item::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 5px;
  height: 0;
  background: var(--primary-red);
  transition: height 0.4s ease;
}

.faq-item.active::before {
  height: 100%;
}

@media (max-width: 768px) {
  .faq-question {
    padding: 20px;
    font-size: 1.1rem;
  }

  .faq-question-text {
    gap: 10px;
  }

  .faq-question i.q-icon {
    width: 35px;
    height: 35px;
    font-size: 1rem;
  }

  .faq-answer-content {
    padding: 0 20px 20px 65px;
  }
}