:root {
         --le-primary: #c6224a;
         --le-primary-soft: rgba(198, 34, 74, 0.07);
         --le-dark: #111827;
         --le-text: #000000;
         --le-bg-soft: #f9fafb;
      }

      body {
         color: var(--le-text);
      }

      /* Hero */
      .services-hero {
         position: relative;
         padding-top: 40px;
         padding-bottom: 120px;
         background: radial-gradient(circle at 0% 0%, #fde4ec 0, #f3f4ff 40%, #ffffff 100%);
         overflow: hidden;
      }

      .services-hero-bg {
         position: absolute;
         inset: 0;
         opacity: 0.15;
         mix-blend-mode: multiply;
         background-size: cover;
         background-position: center;
      }

      .services-hero::before {
         content: "";
         position: absolute;
         inset: 0;
         background: radial-gradient(circle at 10% 10%, rgba(198, 34, 74, 0.18), transparent 55%);
         pointer-events: none;
      }

      .services-hero .breadcrumb-title {
         font-size: 42px;
         font-weight: 800;
         color: var(--le-dark);
      }

      .services-hero p {
         max-width: 650px;
         margin: 12px auto 0;
         font-size: 17px;
      }

      .hero-pills {
         margin-top: 28px;
         display: flex;
         flex-wrap: wrap;
         justify-content: center;
         gap: 10px;
      }

      .hero-pill {
         padding: 7px 15px;
         border-radius: 999px;
         background: rgba(255, 255, 255, 0.95);
         display: inline-flex;
         align-items: center;
         gap: 8px;
         font-size: 13px;
         font-weight: 500;
         box-shadow: 0 8px 25px rgba(15, 23, 42, 0.06);
      }

      .hero-pill i {
         color: var(--le-primary);
      }

      .hero-badge-mini {
         margin-top: 18px;
         font-size: 13px;
         display: inline-flex;
         align-items: center;
         gap: 8px;
         padding: 6px 10px;
         border-radius: 999px;
         background: rgba(17, 24, 39, 0.9);
         color: #e5e7eb;
      }

      .hero-badge-mini i {
         color: #fbbf24;
      }

      .hero-img-card {
         position: relative;
         border-radius: 26px;
         overflow: hidden;
         box-shadow: 0 20px 50px rgba(15, 23, 42, 0.25);
      }

      .hero-img-card img {
         width: 100%;
         height: 100%;
         object-fit: cover;
      }

      .hero-floating-chip {
         position: absolute;
         left: 18px;
         bottom: 18px;
         padding: 8px 14px;
         border-radius: 999px;
         background: rgba(15, 23, 42, 0.85);
         color: #e5e7eb;
         font-size: 13px;
         display: inline-flex;
         align-items: center;
         gap: 8px;
      }

      .hero-floating-chip i {
         color: #34d399;
      }

      .section-space {
         padding-top: 90px;
         padding-bottom: 90px;
      }

       

      /* Responsive */
      @media (max-width: 991.98px) {
         .services-hero {
            padding-top: 110px;
            padding-bottom: 90px;
         }

         .services-hero .breadcrumb-title {
            font-size: 34px;
         }

         .service-media-dot {
            display: none;
         }
      }

      @media (max-width: 575.98px) {
         .section-space {
            padding-top: 70px;
            padding-bottom: 70px;
         }

         .service-card-grid {
            gap: 14px;
         }

         .services-hero p {
            font-size: 15px;
         }
      }

      .login-card {
   background: #ffffff;
   border-radius: 18px;
   box-shadow: 0 25px 60px rgba(0,0,0,0.18);
   padding: 35px 30px;
   text-align: center;
}

.login-card h3 {
   margin-bottom: 5px;
   font-weight: 800;
   font-size: 24px;
   color: #111827;
}

.login-card p {
   margin-bottom: 18px;
   font-size: 14px;
   color: #6b7280;
}

.login-group {
   text-align: left;
   margin-bottom: 16px;
}

.login-group label {
   font-weight: 600;
   font-size: 13px;
   margin-bottom: 6px;
   display: block;
   color: #111827;
}

.login-group input,
.login-group select {
   width: 100%;
   padding: 12px;
   border-radius: 12px;
   border: 1px solid #d1d5db;
   font-size: 14px;
   background: #ffffff;
       height: 50px;
    line-height: 50px;
}

.login-btn {
   width: 100%;
   padding: 12px;
   border-radius: 999px;
   border: none;
   font-weight: 700;
   color: white;
   background: linear-gradient(135deg, #c6224a, #c41407);
   letter-spacing: .5px;
   margin-top: 10px;
}

.login-btn:hover {
   opacity: .95;
}