* {
         margin: 0;
         padding: 0;
         box-sizing: border-box;
         font-family: 'Arial', sans-serif;
     }

     body {
         line-height: 1.6;
         color: #333;
         background-color: #f8f9fa;
     }
      img { max-width:100%; }
     /* Header & Navigation */
     header {
         background-color: white;
         box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
         position: fixed;
         width: 100%;
         top: 0;
         z-index: 1000;
     }

     .header-container {
         display: flex;
         justify-content: space-between;
         align-items: center;
         padding: 1rem 5%;
         max-width: 1400px;
         margin: 0 auto;
     }

     .logo {
         display: flex;
         align-items: center;
         gap: 10px;
         max-width: 270px;
     }

     .logo-icon {
         color: #e74c3c;
         font-size: 2.2rem;
     }

     .logo-text {
         font-size: 1.8rem;
         font-weight: 700;
         color: #e74c3c;
         text-transform: uppercase;
         letter-spacing: 1px;
     }

     nav ul {
         display: flex;
         list-style: none;
         gap: 2rem;
         align-items: center;
     }

     nav a {
         text-decoration: none;
         color: #333;
         font-weight: 600;
         font-size: 1rem;
         transition: color 0.3s;
         padding: 0.5rem 0;
         position: relative;
     }

     nav a:hover,
     nav a.active {
         color: #e74c3c;
     }

     nav a.active:after {
         content: '';
         position: absolute;
         bottom: 0;
         left: 0;
         width: 100%;
         height: 2px;
         background-color: #e74c3c;
     }

     .nav-cta {
         background-color: #e74c3c;
         color: white;
         padding: 0.7rem 1.5rem;
         border-radius: 4px;
         font-weight: 600;
     }

     .nav-cta:hover {
         background-color: #c0392b;
         color: white;
     }

     .mobile-toggle {
         display: none;
         font-size: 1.5rem;
         cursor: pointer;
         color: #333;
     }

     /* Hero Section - Updated to match screenshot */
     .hero {
         background: linear-gradient(#e74c3c, rgba(194, 55, 55, 0.7)), url('https://images.unsplash.com/photo-1551836026-d5c2c26af5f7?ixlib=rb-4.0.3&auto=format&fit=crop&w=1770&q=80');
         background-size: cover;
         background-position: center;
         color: white;
         padding: 12rem 5% 8rem;
         text-align: left;
     }

     .hero-content {
         max-width: 800px;
         margin: 0;
     }

     .hero h1 {
         font-size: 3.2rem;
         margin-bottom: 1.5rem;
         line-height: 1.2;
         font-weight: 700;
     }

     .hero p {
         font-size: 1.1rem;
         margin-bottom: 2.5rem;
         opacity: 0.9;
         max-width: 600px;
     }

     

 

     .hero-container {
         max-width: 1200px;
         margin: auto;
         display: flex;
         align-items: center;
         gap: 40px;
     }

     .hero-image img {
         width: 100%;
         border-radius: 12px;
     }


     /* About Section - Updated to match screenshot */
     .about {
         padding: 6rem 5%;
         background-color: white;
     }

     .about-container {
         max-width: 1200px;
         margin: 0 auto;
     }

     .about-header {
         text-align: center;
         margin-bottom: 4rem;
     }

     .about-header h2 {
         font-size: 2.5rem;
         color: #e74c3c;
         margin-bottom: 1rem;
         font-weight: 700;
     }

     .about-header p {
         color: #666;
         max-width: 700px;
         margin: 0 auto;
         font-size: 1.1rem;
     }

     .about-grid {
         display: grid;
         grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
         gap: 2.5rem;
         margin-bottom: 4rem;
     }

     .about-card {
         background-color: #f8f9fa;
         padding: 2.5rem;
         border-radius: 8px;
         text-align: center;
         transition: transform 0.3s;
         border: 1px solid #eaeaea;
     }

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

     .about-card h3 {
         font-size: 1.5rem;
         color: #e74c3c;
         margin-bottom: 1rem;
     }

     /* Why Choose Us Section */
     .why-choose {
         padding: 6rem 5%;
         background-color: #f8f9fa;
     }

     .why-choose-container {
         max-width: 1200px;
         margin: 0 auto;
     }

     .section-title {
         text-align: center;
         margin-bottom: 4rem;
     }

     .section-title h2 {
         font-size: 2.5rem;
         color: #e74c3c;
         margin-bottom: 1rem;
         font-weight: 700;
     }

     .section-title p {
         color: #666;
         max-width: 700px;
         margin: 0 auto;
     }

     .features-grid {
         display: grid;
         grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
         gap: 2.5rem;
     }

     .feature-card {
         background-color: white;
         padding: 2.5rem 2rem;
         border-radius: 8px;
         text-align: center;
         box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
         border-top: 4px solid #e74c3c;
     }

     .feature-icon {
         font-size: 3rem;
         color: #e74c3c;
         margin-bottom: 1.5rem;
     }

     .feature-card h3 {
         font-size: 1.4rem;
         margin-bottom: 1rem;
         color: #333;
     }

     .feature-card p {
         color: #666;
         margin-bottom: 1.5rem;
     }

     .read-more {
         color: #e74c3c;
         text-decoration: none;
         font-weight: 600;
         display: inline-block;
     }

     .read-more:hover {
         text-decoration: underline;
     }

     /* Services Section - Updated to match screenshot */
     .services {
         padding: 6rem 5%;
         background-color: white;
     }

     .services-container {
         max-width: 1200px;
         margin: 0 auto;
     }

     .services-grid {
         display: grid;
         grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
         gap: 2.5rem;
     }

     .service-card {
         background-color: white;
         border-radius: 8px;
         overflow: hidden;
         box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
         transition: transform 0.3s;
         border: 1px solid #eaeaea;
     }

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

     .service-img {
         height: 220px;
         overflow: hidden;
     }

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

     .service-card:hover .service-img img {
         transform: scale(1.05);
     }

     .service-content {
         padding: 2rem;
         text-align: center;
     }

     .service-content h3 {
         font-size: 1.5rem;
         margin-bottom: 1rem;
         color: #e74c3c;
     }

     .service-content p {
         color: #666;
         margin-bottom: 1.5rem;
     }

     .service-btn {
         display: inline-block;
         background-color: #e74c3c;
         color: white;
         padding: 0.8rem 2rem;
         border-radius: 4px;
         text-decoration: none;
         font-weight: 600;
         transition: background-color 0.3s;
     }

     .service-btn:hover {
         background-color: #1a3d7a;
     }

     /* Contact Section */
     .contact-section {
         padding: 6rem 5%;
         background: linear-gradient(rgba(44, 90, 160, 0.9), rgba(44, 90, 160, 0.9)), url('https://images.unsplash.com/photo-1581094794329-c8112a89af12?ixlib=rb-4.0.3&auto=format&fit=crop&w=1770&q=80');
         background-size: cover;
         background-position: center;
         color: white;
         text-align: center;
     }

     .contact-container {
         max-width: 800px;
         margin: 0 auto;
     }

     .contact-container h2 {
         font-size: 2.5rem;
         margin-bottom: 1.5rem;
     }

     .contact-container p {
         font-size: 1.1rem;
         margin-bottom: 2.5rem;
         opacity: 0.9;
     }

     .contact-btn {
         display: inline-block;
         background-color: white;
         color: #e74c3c;
         padding: 1rem 2.5rem;
         border-radius: 4px;
         text-decoration: none;
         font-weight: 700;
         font-size: 1.1rem;
         transition: all 0.3s;
     }

     .contact-btn:hover {
         background-color: #f8f9fa;
         transform: translateY(-2px);
     }

     /* Footer */
     footer {
         background-color: #e74c3c;
         color: white;
         padding: 4rem 5% 2rem;
     }

     .footer-container {
         display: grid;
         grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
         gap: 3rem;
         max-width: 1200px;
         margin: 0 auto;
     }

     .footer-logo {
         font-size: 1.8rem;
         font-weight: 700;
         margin-bottom: 1rem;
         color: white;
     }

     .footer-logo span {
         color: #e8f5fd;
     }

     .footer-about p {
         margin-bottom: 1.5rem;
         opacity: 0.8;
         line-height: 1.8;
     }

     .footer-links h3,
     .footer-contact h3 {
         font-size: 1.3rem;
         margin-bottom: 1.5rem;
         position: relative;
         padding-bottom: 0.5rem;
         color: white;
     }

     .footer-links h3:after,
     .footer-contact h3:after {
         content: '';
         position: absolute;
         bottom: 0;
         left: 0;
         width: 50px;
         height: 3px;
         background-color: #d1e6f3;
     }

     .footer-links ul {
         list-style: none;
     }

     .footer-links li {
         margin-bottom: 0.8rem;
     }

     .footer-links a {
         color: rgba(255, 255, 255, 0.8);
         text-decoration: none;
         transition: color 0.3s;
     }

     .footer-links a:hover {
         color: #bbdef5;
     }

     .contact-info {
         list-style: none;
     }

     .contact-info li {
         display: flex;
         align-items: flex-start;
         gap: 1rem;
         margin-bottom: 1.2rem;
     }

     .contact-info i {
         color: #def1fd;
         margin-top: 0.2rem;
         width: 20px;
     }

     .social-icons {
         display: flex;
         gap: 1rem;
         margin-top: 1.5rem;
     }

     .social-icons a {
         display: inline-flex;
         align-items: center;
         justify-content: center;
         width: 40px;
         height: 40px;
         background-color: rgba(255, 255, 255, 0.1);
         border-radius: 50%;
         color: white;
         text-decoration: none;
         transition: all 0.3s;
     }

     .social-icons a:hover {
         background-color: #3498db;
         transform: translateY(-3px);
     }

     .copyright {
         text-align: center;
         padding-top: 3rem;
         margin-top: 3rem;
         border-top: 1px solid rgba(255, 255, 255, 0.1);
         opacity: 0.7;
         font-size: 0.9rem;
     }

     /* Responsive Design */
     @media (max-width: 992px) {
         .hero h1 {
             font-size: 2.8rem;
         }

         .features-grid,
         .services-grid,
         .about-grid {
             grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
         }
     }

     @media (max-width: 768px) {
         .mobile-toggle {
             display: block;
         }

         nav {
             position: fixed;
             top: 70px;
             left: 0;
             width: 100%;
             background-color: white;
             padding: 2rem;
             box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
             display: none;
         }

         nav.active {
             display: block;
         }

         nav ul {
             flex-direction: column;
             gap: 1.5rem;
             align-items: flex-start;
         }

         .hero {
             padding: 10rem 5% 6rem;
             text-align: center;
         }

         .hero h1 {
             font-size: 2.2rem;
         }

         .hero p {
             margin: 0 auto 2.5rem;
         }

         .section-title h2,
         .about-header h2 {
             font-size: 2rem;
         }
     }

     @media (max-width: 576px) {
         .hero {
             padding: 9rem 5% 5rem;
         }

         .hero h1 {
             font-size: 1.8rem;
         }

         .cta-button,
         .service-btn,
         .contact-btn {
             padding: 0.8rem 1.8rem;
             font-size: 1rem;
         }

         .about-card,
         .feature-card,
         .service-card {
             padding: 2rem 1.5rem;
         }

         .footer-container {
             grid-template-columns: 1fr;
             gap: 2rem;
         }
     }



       .faq-section { margin-bottom: 50px; }
    .faq-section h2 {
      font-size: 1.8rem;
      color: #e74c3c;
      margin-bottom: 24px;
      text-align: center;
    }
    .faq-item {
      background: #f9fbfd;
      border-radius: 10px;
      margin-bottom: 16px;
      overflow: hidden;
      box-shadow: 0 4px 10px rgba(0,0,0,0.04);
    }
    .faq-question {
      padding: 20px 24px;
      font-weight: 600;
      font-size: 1.1rem;
      color: #e74c3c;
      cursor: pointer;
      display: flex;
      justify-content: space-between;
      align-items: center;
      transition: background 0.2s;
    }
    .faq-question:hover {
      background: #edf2f7;
    }
    .faq-question i {
      transition: transform 0.3s;
    }
    .faq-answer {
      padding: 0 24px;
      max-height: 0;
      overflow: hidden;
      background: white;
      transition: max-height 0.3s ease, padding 0.3s ease;
    }
    .faq-item.active .faq-answer {
      padding: 0 24px 24px;
      max-height: 500px;
    }
    .faq-item.active .faq-question i {
      transform: rotate(180deg);
    }
    .faq-answer p {
      margin: 16px 0 0;
      color: #e74c3c;
      line-height: 1.6;
    }
    .faq-answer a {
      color: #e74c3c;
      text-decoration: underline;
    }