:root {
    --theme-dark: #0a0f2c;
    --primary-blue: #0f1e5a;
    --primary-blue-light: #1a3a8f;
    --primary-blue-soft: #2563eb;
    --accent-red: #ce1810;
    --accent-gradient: linear-gradient(105deg, #ce1810, #e6492e);
    --blue-gradient: linear-gradient(135deg, #0f1e5a, #1a3a8f);
    --blue-gradient-soft: linear-gradient(135deg, #1a3a8f, #2563eb);
    --card-shadow: 0 25px 45px -12px rgba(0, 0, 0, 0.12);
  }

  /* ============================================================
       BASE RESETS — override theme/style.css conflicts
    ============================================================ */
  *,
  *::before,
  *::after {
    margin: 0;
    padding: 0;
    box-sizing: border-box !important;
  }

  body {
    font-family: 'Poppins', 'Plus Jakarta Sans', sans-serif !important;
    color: #334155 !important;
    background: #ffffff !important;
    overflow-x: hidden !important;
    font-size: 15px !important;
    line-height: 1.6 !important;
  }

  h1,
  h2,
  h3,
  h4,
  h5 {
    font-family: 'Poppins', sans-serif !important;
    font-weight: 700 !important;
    color: var(--primary-blue) !important;
  }

  p {
    font-family: 'Poppins', sans-serif !important;
  }

  /* ============================================================
       HERO SECTION
    ============================================================ */
.hero-video-wrapper {
  position: relative !important;
  min-height: 95vh !important;
  overflow: hidden !important;
  /* remove display:flex and align-items from here */
}

.bg-video {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  z-index: 0 !important;
  filter: brightness(0.45) contrast(1.05) !important;
}

.hero-overlay {
  position: absolute !important;  /* ← was relative, this is the fix */
  inset: 0 !important;             /* covers full wrapper, no gaps */
  z-index: 2 !important;
  background: rgba(10, 15, 44, 0.6) !important;
  backdrop-filter: blur(2px) !important;
  
  /* move flex centering here so content stays vertically centered */
  display: flex !important;
  align-items: center !important;
  padding: 5rem 0 !important;
}
  /* ============================================================
       GLASS FORM
    ============================================================ */
  .glass-form {
    background: rgba(255, 255, 255, 0.97) !important;
    border-radius: 28px !important;
    padding: 1.8rem !important;
    box-shadow: 0 30px 45px -15px rgba(0, 0, 0, 0.3) !important;
    border: none !important;
  }

  .glass-form input,
  .glass-form textarea {
    background: #f1f5f9 !important;
    border-radius: 60px !important;
    padding: 10px 18px !important;
    font-size: 0.9rem !important;
    border: 1px solid #e2e8f0 !important;
    transition: all 0.2s !important;
    box-shadow: none !important;
    width: 100% !important;
  }

  .glass-form textarea {
    border-radius: 16px !important;
  }

  .glass-form input:focus,
  .glass-form textarea:focus {
    border-color: var(--accent-red) !important;
    box-shadow: 0 0 0 3px rgba(206, 24, 16, 0.2) !important;
    outline: none !important;
    background: #fff !important;
  }

  /* Second form (assistance section) */
  .assist-form input,
  .assist-form textarea {
    background: #f1f5f9 !important;
    border-radius: 60px !important;
    padding: 10px 18px !important;
    font-size: 0.9rem !important;
    border: 1px solid #e2e8f0 !important;
    transition: all 0.2s !important;
    box-shadow: none !important;
    width: 100% !important;
  }

  .assist-form textarea {
    border-radius: 16px !important;
  }

  .assist-form input:focus,
  .assist-form textarea:focus {
    border-color: var(--accent-red) !important;
    box-shadow: 0 0 0 3px rgba(206, 24, 16, 0.2) !important;
    outline: none !important;
    background: #fff !important;
  }

  /* ============================================================
       BUTTONS
    ============================================================ */
  .btn-accent {
    background: var(--accent-gradient) !important;
    color: white !important;
    font-weight: 600 !important;
    padding: 10px 28px !important;
    border-radius: 40px !important;
    transition: 0.3s !important;
    border: none !important;
    box-shadow: 0 8px 18px rgba(206, 24, 16, 0.3) !important;
    display: inline-block !important;
    text-decoration: none !important;
  }

  .btn-accent:hover {
    transform: translateY(-3px) !important;
    background: linear-gradient(105deg, #b3130c, #ce1810) !important;
    box-shadow: 0 15px 25px rgba(206, 24, 16, 0.4) !important;
    color: white !important;
  }

  .btn-outline-light {
    border: 1.5px solid rgba(255, 255, 255, 0.7) !important;
    background: transparent !important;
    border-radius: 40px !important;
    padding: 9px 28px !important;
    color: white !important;
    font-weight: 500 !important;
    transition: 0.3s !important;
    text-decoration: none !important;
    display: inline-block !important;
  }

  .btn-outline-light:hover {
    background: white !important;
    color: var(--primary-blue) !important;
    border-color: white !important;
  }

  /* ============================================================
       CARDS — neutralise all external border/shadow conflicts
    ============================================================ */
  .service-card,
  .process-card,
  .serve-card-modern {
    transition: all 0.35s ease !important;
    background: #ffffff !important;
    border-radius: 24px !important;
    box-shadow: var(--card-shadow) !important;
    height: 100% !important;
    border: 1px solid rgba(15, 30, 90, 0.08) !important;
    outline: none !important;
  }

  .service-card:hover,
  .process-card:hover,
  .serve-card-modern:hover {
    transform: translateY(-8px) !important;
    box-shadow: 0 30px 50px -15px rgba(15, 30, 90, 0.2) !important;
  }

  /* ============================================================
       GRADIENT ICON — force blue gradient + white icon
    ============================================================ */
  .gradient-icon {
    background: var(--blue-gradient) !important;
    width: 70px !important;
    height: 70px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 20px !important;
    margin-bottom: 1.2rem !important;
    box-shadow: 0 10px 20px -5px rgba(15, 30, 90, 0.25) !important;
    border: none !important;
  }

  .gradient-icon i,
  .gradient-icon i::before {
    font-size: 28px !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    background: none !important;
    -webkit-background-clip: unset !important;
    background-clip: unset !important;
  }

  /* ============================================================
       PROCESS NUMBER BUBBLE
    ============================================================ */
  .process-number {
    background: var(--blue-gradient) !important;
    width: 68px !important;
    height: 68px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 28px !important;
    font-weight: 800 !important;
    color: white !important;
    border-radius: 50% !important;
    margin: 0 auto 20px auto !important;
    box-shadow: 0 10px 20px -5px rgba(15, 30, 90, 0.3) !important;
  }

  /* ============================================================
       ICON CIRCLE (used in contact/assist section)
    ============================================================ */
  .icon-circle-bg {
    width: 42px !important;
    height: 42px !important;
    background: var(--blue-gradient) !important;
    border-radius: 50% !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: 0 5px 12px rgba(15, 30, 90, 0.2) !important;
    border: none !important;
    flex-shrink: 0 !important;
  }

  .icon-circle-bg i,
  .icon-circle-bg i::before {
    font-size: 16px !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    background: none !important;
    -webkit-background-clip: unset !important;
    background-clip: unset !important;
  }

  /* ============================================================
       FEATURE BOXES
    ============================================================ */
  .feature-box {
    flex: 1 1 30% !important;
    min-width: 110px !important;
    background: var(--blue-gradient) !important;
    border-radius: 20px !important;
    padding: 16px 12px !important;
    text-align: center !important;
    color: #fff !important;
    box-shadow: var(--card-shadow) !important;
    transition: all 0.3s ease !important;
    border: none !important;
  }

  .feature-box:hover {
    transform: translateY(-5px) !important;
    background: var(--blue-gradient-soft) !important;
  }

  .feature-box .icon-circle-bg {
    background: rgba(255, 255, 255, 0.2) !important;
    box-shadow: none !important;
  }

  .feature-box .icon-circle-bg i,
  .feature-box .icon-circle-bg i::before {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
  }

  .feature-text {
    font-size: 13px !important;
    font-weight: 600 !important;
    margin-top: 8px !important;
    color: #fff !important;
  }

  /* ============================================================
       CHECK ITEMS & SERVICE LISTS
    ============================================================ */
  .check-item {
    margin-bottom: 8px !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
  }

  .check-item i {
    width: 20px !important;
    color: var(--accent-red) !important;
    -webkit-text-fill-color: var(--accent-red) !important;
    background: none !important;
    -webkit-background-clip: unset !important;
  }

  .service-list {
    padding-left: 0 !important;
    list-style: none !important;
  }

  .service-list li {
    margin-bottom: 10px !important;
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
  }

  .service-list li i,
  .service-list li i::before {
    width: 20px !important;
    color: var(--accent-red) !important;
    -webkit-text-fill-color: var(--accent-red) !important;
    background: none !important;
    -webkit-background-clip: unset !important;
    background-clip: unset !important;
  }

  /* ============================================================
       Testimonial
    ============================================================ */
  .card-text {
    display: -webkit-box;
    -webkit-line-clamp: 6;
    /* limit lines */
    -webkit-box-orient: vertical;
    overflow: hidden;
  }

  .card-text.expanded {
    -webkit-line-clamp: unset;
  }

  .testimonial-card {
    box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
    border-radius: 15px;
    border: none;
    transition: all 0.3s ease;

  }

  .testimonial-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
  }

  .read-more-btn {
    background: #ce1810;
  }

  /* ============================================================
       FAQ
    ============================================================ */
  .contact-glimpse {
    background: linear-gradient(115deg, #eef2ff 0%, #e0e7ff 100%) !important;
    border-radius: 36px !important;
  }

  .faq-modern-item {
    background: white !important;
    border-radius: 20px !important;
    margin-bottom: 1rem !important;
    border: 1px solid #e2e8f0 !important;
    transition: 0.2s !important;
    overflow: hidden !important;
  }

  .faq-modern-item:hover {
    border-color: var(--primary-blue-soft) !important;
  }

  .faq-question-btn {
    background: transparent !important;
    font-weight: 600 !important;
    color: var(--primary-blue) !important;
    cursor: pointer !important;
    border: none !important;
    box-shadow: none !important;
  }

  .faq-question-btn i.text-danger {
    color: var(--accent-red) !important;
    -webkit-text-fill-color: var(--accent-red) !important;
    background: none !important;
    -webkit-background-clip: unset !important;
  }

  .transition-faq {
    transition: transform 0.25s ease !important;
  }

  /* ============================================================
       BACKGROUND SECTIONS
    ============================================================ */
  .bg-light-custom {
    background-color: #f8fafc !important;
  }

  /* ============================================================
       UTILITY OVERRIDES
    ============================================================ */
  .cursor-pointer {
    cursor: pointer !important;
  }

  .text-danger,
  .text-danger i::before {
    color: var(--accent-red) !important;
    -webkit-text-fill-color: var(--accent-red) !important;
    background: none !important;
    -webkit-background-clip: unset !important;
  }

  .text-white {
    color: #ffffff !important;
  }

  /* Remove any unwanted borders that global/elpath/style.css may inject */
  .service-card *,
  .process-card *,
  .serve-card-modern * {
    border-color: transparent;
  }

  /* Keep the deliberate card top border for transfer options */
  .border-top.border-danger.border-3 {
    border-top: 3px solid var(--accent-red) !important;
  }

  
/* Floating Contact Buttons */
.floating-contact {
    position: fixed;
    bottom: 100px;   /* control height from bottom */
    right: 40px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    z-index: 9999;
}

/* Common Style */
.floating-contact a {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 20px;
    box-shadow: 0 8px 20px rgba(0,0,0,0.2);
    transition: 0.3s;
    text-decoration: none;
}
.floating-contact a:hover{
  color:white;
}
/* Call Button */
.call-btn {
    background: #162e78; /* blue */
}

/* WhatsApp Button */
.wp-btn {
    background: #25D366;
}

/* Hover Effect */
.floating-contact a:hover {
    transform: translateY(-5px) scale(1.05);
}
  /* ============================================================
       RESPONSIVE
    ============================================================ */
  @media (max-width: 992px) {
    .hero-video-wrapper {
      min-height: auto !important;
    }

    .glass-form {
      margin-top: 2rem !important;
    }

    .hero-overlay {
      padding: 3rem 0 !important;
    }
  }

  @media (max-width: 576px) {
    h1.display-4 {
      font-size: 2rem !important;
    }
  }

.for-bg{background-color: white !important;}