.common-hero p {
  color: var(--ztc-text-text-1) !important;
}


.hero9 {
  background-color: #05092b !important;
}

.theme-btn16 {
  color: white !important;
}
.theme-btn16:hover {
  /* color: black !important; */
  transform: translateY(0px) !important;
}
.theme-btn16::after {
  background: #0e38b1 !important;
  color: white !important;
}

.theme-btn16::before {
  background: #8599d4 !important;
}
.brands6 {
  background: #05092b;
}


.theme-btn5,
.theme-btn5::after,
.case8 .case8-box:hover .hover-area,
.service10 .service10-slider .single-slider:hover {
  background: #0e38b1 !important;
}
/* .service10 .service10-slider .single-slider .icon{
  background: #e0e8ff !important;
  } */

.service10 .arrows-button button:hover,
.about4 .list li span,
.case10 .case-box .hover-area::after,
.tes9 .slick-dots li.slick-active button {
  background: #0e38b1 !important;
}

.case9 .case9-slider .single-slider .heading-area .arrow,
.case9 .arrows-button button:hover {
  background: #0e38b1 !important;
  color: white !important;
}

.case9 .case9-slider .single-slider .heading-area h5 a:hover,
.about4 .counter-box h3,
.hero9 .buttons .video-buttton9 p,
.case9 .case9-slider .single-slider:hover .heading-area h5 a {
  color: #0e38b1 !important;
}

.bg9::after,
.blog9 .blog-box,
.tes9 .tes9-slider .sginle-slider {
  background-color: var(--ztc-bg-bg-1);
}

.service10 .service10-slider .single-slider .icon {
  background-color: var(--ztc-bg-bg-2);
}

.header-area.header-area1
  .header-elements
  .main-menu-ex
  ul
  li
  .mega-menu-all
  ul
  li
  a {
  /* padding: 8px 40px; */
  padding: 8px 0px !important;
}

.project3 .nav li {
  gap: 100px;
}
.project3 .nav li a {
  background: white;
  color: var(--ztc-bg-main-bg-3);
  font-weight: var(--f-fw-semibold);
  font-size: var(--f-fs-font-fs16);
  line-height: var(--f-fs-font-fs16);
  padding: 12px 20px;
  border-radius: 7px;
  margin: 10px 0px;
}
.project3 .nav li a:hover {
  background: #0e38b1;
  color: white;
}

.site-logo {
  max-width: 500px !important;
}

/* .header-area.header-area1 .header-elements .main-menu-ex ul li .mega-menu-all .mega-menu-single h3{
  text-align: center !important;
}
.header-area.header-area1 .header-elements .main-menu-ex ul li .mega-menu-all .mega-menu-single h3::after{
  left: 143px !important;
} */
.cta8 .bg {
  justify-content: center;
  padding: 80px 0px !important;
}

.heading1 h1 {
  font-size: var(--f-fs-font-fs44);
  line-height: var(--f-fs-font-fs52);
  font-weight: var(--f-fw-semibold);
  color: var(--ztc-text-text-1);
}

/* Form container */
.custom-form {
  display: flex;
  flex-direction: column;
  gap: 16px;
  /* max-width: 420px; */
  margin: 0 auto;
}

/* Input fields */
.custom-form input {
  padding: 14px 18px;
  border-radius: 12px;
  /* border: 2px solid #1B3C53; */
  /* match container background */
  font-size: 16px;
  transition: all 0.4s ease;
  background-color: rgba(255, 255, 255, 0.1);
  /* subtle transparent input */
  color: #ffffff;
  /* text color white on blue */
  backdrop-filter: blur(5px);
  /* modern frosted effect */
}

.custom-form input::placeholder {
  color: rgba(255, 255, 255, 0.7);
  /* softer white placeholder */
  font-weight: 500;
}

.custom-form input:focus {
  border-color: #ffdd57;
  /* modern accent on focus */
  box-shadow: 0 6px 18px rgba(255, 221, 87, 0.3);
  outline: none;
  transform: scale(1.02);
  background-color: rgba(255, 255, 255, 0.15);
}

/* Submit button */
.custom-form .theme-btn1 {
  background: linear-gradient(90deg, #ffdd57, #ffc107);
  /* modern vibrant gradient */
  color: #0e38b1;
  font-weight: 600;
  padding: 14px;
  border-radius: 12px;
  border: none;
  cursor: pointer;
  transition: all 0.4s ease;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-size: 16px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.custom-form .theme-btn1:hover {
  background: linear-gradient(90deg, #ffc107, #ffdd57);
  box-shadow: 0 8px 22px rgba(255, 221, 87, 0.4);
  transform: translateY(-3px);
}

/* Responsive tweak */
@media (max-width: 768px) {
  .custom-form {
    max-width: 100%;
  }
}


    .platforms-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
        gap: 20px;
        justify-content: center;
        max-width: 1000px;
        margin: 0 auto;
    }


    .platform-card {
        background: #fff;
        border-radius: 10px;
        padding: 25px 15px;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.08);
        transition: transform 0.2s ease, box-shadow 0.2s ease;
    }

    .platform-card:hover {
        transform: translateY(-5px);
        box-shadow: 0px 8px 18px rgba(0, 0, 0, 0.12);
    }

    .platform-card img {
        width: 40px;
        height: 40px;
        margin-bottom: 10px;
    }

    .platform-card span {
        font-size: 15px;
        font-weight: 600;
        color: #333;
    }

.progress-wrap {
  bottom: 85px !important;
}

.footer1{
  padding-bottom: 70px !important;
}

.service .single-box:hover{
  color: white !important;
}

.slick-slide .img-testinomial {
  width: 60px;
  height: 60px;
  border-radius: 50%; 
  object-fit: cover;    
}

.pricing .single-pricing-box {
  min-height: 290px;
}

.work3 .work3-box:hover{
  color: white !important;
}

.single-items .icon img {
  width: 28px;
  height: 28px;
  object-fit: contain;
}

.work .single-items:hover .icon img{
    filter: brightness(0) invert(1);
}

.service5 .service-box .icon img{
  height: 35px;
}

.contact-form-details {
  margin-top: 100px;
}











/* Modern form styling */
.contact-form-details {
    padding: 40px;
    background-color: #f8f9fa;
    border-radius: 10px;
    /* box-shadow: 0 8px 30px rgba(0, 0, 0, 0.08); */
}

.form-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 20px;
}

.form-section-title {
    grid-column: 1 / -1;
    font-size: 1.25rem;
    font-weight: 600;
    margin: 40px 0 10px;
    color: #333;
    border-bottom: 2px solid #eee;
    padding-bottom: 5px;
}

.single-input input,
.single-input select,
.single-input textarea {
    width: 100%;
    padding: 12px 14px;
    font-size: 1rem;
    background-color: #fff;
    border: 1px solid #ccc;
    border-radius: 6px;
    transition: all 0.3s ease;
}

.single-input input:focus,
.single-input select:focus,
.single-input textarea:focus {
    border-color: #007bff;
    outline: none;
    box-shadow: 0 0 0 3px rgba(0, 123, 255, 0.1);
}

.form-actions {
    display: flex;
    justify-content: flex-end;
    gap: 15px;
    margin-top: 30px;
    grid-column: 1 / -1;
}

.btn-modern,
.btn-ghost {
    padding: 12px 24px;
    font-size: 1rem;
    border: none;
    cursor: pointer;
    border-radius: 6px;
    transition: all 0.3s ease;
}

.btn-modern {
    background-color: #007bff;
    color: #fff;
}

.btn-modern:hover {
    background-color: #0056b3;
}

.btn-ghost {
    background-color: #f0f0f0;
    color: #333;
}

.btn-ghost:hover
 {
    background-color: #e0e0e0;
}



.custom-form input {
  border: 2px solid #164863;
}

.header-top,
.cta,
.cta8 .bg,
.about1 .heading1 .list li span,
.pricing .single-pricing-box,
.service5 .service-box:hover,
.service5 .service-box .icon,
.tes9 .arrows-button button:hover,
.faq3 .accordion-item.active button,
.marquee-wrap.marquee-wrap-inner,
.marquee-wrap,
.accordion-flush .accordion-collapse,
.faq3 .accordion-item.active,
.about1 .about-image .icon-box,
.cta9,
.theme-btn1{
  background-color: #164863;
}

.pricing .single-pricing-box h2,
.pricing .single-pricing-box h4,
.tes9 .arrows-button button:hover,
.pricing .single-pricing-box .list li
{
  color: white;
}

.theme-btn1:hover,
.pricing .single-pricing-box .list li span,
.pricing .single-pricing-box:hover,
.service4 .service4-box .icon,
.cta-btn2:hover,
.header-area.header-area1 .header1-buttons .contact-btn .icon,
.footer1 .single-footer-items .social-icon li a:hover,
.contact-page .contact-boxs .contact-box .icon,
.work3 .work3-box::after,
.btn--ripple,
.theme-btn4,
.cta-btn1:hover{
  background-color:#427D9D !important;
}

.work3 .work3-box{
  background-color: #f5f6f9;
}


.work5 .work-box::before,
.work .single-items:hover .icon,
.service5 .service-box::before,
.tes9 .slick-dots li.slick-active button,
.service10 .service10-slider .single-slider.slick-current.slick-active,
.work5 .work-box:hover{
  background:#164863 !important;
}

.cta-btn1,
.footer1 .single-footer-items .contact-box .pera a:hover,
.footer1 .single-footer-items .menu-list li a:hover,
.footer1 .copyright-area .coppyright p span,
.work3 .work3-box:hover span.stap
{
  color: #164863;
}


.header-area.header-area1 .header1-buttons .contact-btn .icon img,
.contact-page .contact-boxs .contact-box .icon img
{
  filter: brightness(0) invert(1);
}

.service4 .service4-box .icon img
{
  filter: brightness(0) invert(1);
  width: 35px;
}

.cta-btn2:hover
{
  border: 1px solid#164863;
}

.work3 .work3-box span.stap{
  border: 2px solid#164863;
  color: #164863;
}

@media (max-width: 1200px) {
  .header-area.header-area1 .header1-buttons .contact-btn{
    display: none;
  }
}

.vertical-step-line {
    position: relative;
    width: 4px;
    background: linear-gradient(to bottom, #b1d2e4, #164863); /* Gradient line */
    height: 100%;
    min-height: 400px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.circle-icon {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 60px;
    height: 60px;
    background: linear-gradient(135deg, #4e54c8, #8f94fb);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 8px 15px rgba(0, 0, 0, 0.2);
    color: white;
    font-size: 24px;
}

/* Optional: hide line on mobile */
@media (max-width: 767px) {
    .vertical-step-line {
        display: none;
    }
}


.contact-form-details {
    background: #f8f9fa;
    max-width: 1100px;
    margin: auto;
    padding: 40px;
    border-radius: 10px;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.05);
  }

  .form-section-title {
    font-size: 20px;
    font-weight: bold;
    margin: 30px 0 15px;
    border-bottom: 1px solid #eee;
    padding-bottom: 6px;
    color: #333;
  }

  .form-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 20px;
    margin-bottom: 30px;
  }

  .single-input input {
    width: 100%;
    padding: 12px 14px;
    font-size: 15px;
    background-color: #fff;
    border: 1px solid #ccc;
    border-radius: 6px;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
  }

  .single-input input:focus {
    border-color: #007bff;
    box-shadow: 0 0 0 3px rgba(0, 123, 255, 0.15);
    outline: none;
  }

  .form-actions {
    display: flex;
    justify-content: flex-end;
    gap: 15px;
    margin-top: 30px;
  }

  .btn-modern,
  .btn-ghost {
    padding: 12px 24px;
    font-size: 16px;
    border: none;
    border-radius: 6px;
    cursor: pointer;
  }

  .btn-modern {
    background: #007bff;
    color: #fff;
  }

  .btn-modern:hover {
    background: #0056b3;
  }

  .btn-ghost {
    background: #e9ecef;
    color: #333;
  }

  .btn-ghost:hover {
    background: #d6d8db;
  }