
.top-bar {
    background-color: #1f3255;
    color: white;
    font-size: 0.9rem;
    padding: 5px 0;
    text-align: center;
}

.navbar-custom .nav-link {
    color: #333;
    font-weight: 500;
}

.navbar-custom .nav-link:hover {
    color: #6C63FF;
}

.navbar-custom .btn-outline-purple {
    border-color:#9435EB;
    color: #9435EB;
    border-radius: 12px;
}

.navbar-custom .btn-outline-purple:hover {
    background-color :#9435EB;
    color: white;
}

.logo-bar img {
    height: 40px;
    margin: 0 20px;
    opacity: 0.8;
}


.insurance-card {
    border-radius: 15px;
    width:1170px;
    background: #fff;
    box-shadow: 0 5px 20px rgba(0,0,0,0.1);
    padding: 30px;
    margin-left: 0px;
}

.icon-box {
    width: 72.88px;
    height: 72.88px;
    border-radius: 50% solid #EAEBEC;
    color: #EAEBEC;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: auto;
    font-size: 24px;
}


.item-text {
    margin-top: 10px;
    font-size: 14px;
    color: #555;
}
.fa-solid  {
    font-size:20px;  
    color:#7614CF;        
}
.A{
    text-align: center;
    margin-bottom:50px;
}
.feature-box {
    background: #fff;
    border-radius: 15px;
    padding: 20px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.08);
    transition: 0.3s;
    height:200px;
    width:200px;
}

.feature-box:hover {
    transform: translateY(-5px);
}

.feature-icon {
    font-size: 28px;
    margin-bottom: 10px;
}

.border-left-blue {
    border-left: 4px solid #4A90E2;
}

.border-left-green {
    border-left: 4px solid #2ecc71;
}

.border-left-orange {
    border-left: 4px solid #f39c12;
}

.border-left-yellow {
    border-left: 4px solid #f1c40f;
}

.feature-title {
    font-weight: 600;
    color: #4A90E2;
}

.feature-text {
    font-size: 14px;
    color: #777;
}

.section-title {
    font-weight: 600;
    color: #253858;
    text-align: center;
    margin-bottom: 80px;
}

.step-box {
    text-align: center;
    position: relative;
    padding: 0 20px;
}
.step-icon {
    width: 90px;
    height: 90px;
    background: #fff4e5;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px;
    font-size: 32px;
}
.step-title {
    font-weight: 600;
    color: #253858;
    margin-bottom: 10px;
}

/* Text */
.step-text {
    font-size: 14px;
    color: #6c757d;
    max-width: 260px;
    margin: auto;
}

.step-box::after {
    content: "";
    position: absolute;
    top: 45px;
    right: -50%;
    width: 100%;
    border-top: 2px dashed #dcdcdc;
    z-index: -1;
}

/* Remove last line */
.step-box:last-child::after {
    display: none;
}

/* Responsive */
@media (max-width: 768px) {
    .section-title {
        margin-bottom: 40px;
    }

    .step-box::after {
        display: none;
    }

    .step-box {
        margin-bottom: 40px;
    }
     .container-fluid h6{
        width:300px;
     }
     
    
    .container-fluid insurance{
        background-image:linear-gradient(rgba(15, 24, 41, 0.7), rgba(31, 50, 85, 0.7)), url('/images/16.png');
    }
}
.section-wrapper{
background-color:#f4f4f4;
margin-top: 20px;
}
.insurance
{
background-color:#1f3255;
 background-image:linear-gradient(rgba(15, 24, 41, 0.7), rgba(31, 50, 85, 0.7)), url('/images/16.png');

 margin-bottom: 40px;
 border-radius: 20px;
 margin-top: 40px;
}
.my-btn {
    background-color: transparent;
    color: #fff;                
    border-radius: 12px;  
    padding: 10px 20px;
    border:2px solid white;
    transition: 0.3s;
    margin-left:20px;
}

.my-btn:hover {
    background-color: rgb(1, 1, 34); 
    color: #fff;
}


.appointment-section {
    background: linear-gradient(to right, #f5f7fb, rgba(255,255,255,0.6)), url('/images/18.jpg');
    position: relative;
    background-size:100% 100%;
    margin-top:40px;
}

.form-area {
    z-index: 2;
}

.image-area {
    position: relative;
}

.image-area img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0.7;
}
.image-area::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(255, 255, 255, 0.5);
}


.footer{
    background:#0d1b2a;
    color:#cfd8e3;
    padding:70px 0 20px;
}

.footer h5{
    color:#ffffff;
    font-weight:600;
    margin-bottom:20px;
}

.footer a{
    color:#cfd8e3;
    text-decoration:none;
    display:block;
    margin-bottom:10px;
    transition:0.3s ease;
}

.footer a:hover{
    color:#f39c12;
}

.footer-logo{
    max-width:170px;
    height:auto;
    margin-bottom:20px;
}

.social-icons a{
    width:40px;
    height:40px;
    background:#13263f;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    margin-right:10px;
    color:#fff;
    transition:0.3s ease;
}

.social-icons a:hover{
    background:#f39c12;
}

.contact-icon{
    color:#f39c12;
    margin-right:10px;
}

.footer-bottom{
    border-top:1px solid rgba(255,255,255,0.1);
    margin-top:50px;
    padding-top:15px;
    text-align:center;
    color:#cfd8e3;
    font-size:14px;
}

@media (max-width: 991px){
    .footer{
        text-align:center;
    }

    .social-icons{
        justify-content:center;
    }
}
.custom-btn {
    background-color: #9333EA;
    color: #fff;
    padding: 10px 25px;
    border-radius: 30px;
    border: none;
}

.custom-btn:hover {
    background-color: #7e22ce;
}

/* Container Box */
.insurance-box{
    background:#fff;
    border-radius:20px;
    padding:30px 20px;
    box-shadow:0 10px 30px rgba(0,0,0,0.05);
}

/* Card */
.ins-card{
    text-align:center;
    padding:20px 10px;
    border-radius:15px;
    transition:0.3s;
    cursor:pointer;
}

/* Active Card */
.ins-card.active{
    background:#eef2ff;
}

/* Hover */
.ins-card:hover{
    transform:translateY(-5px);
    box-shadow:0 8px 20px rgba(0,0,0,0.08);
}

/* Icon Circle */
.icon-circle{
    width:60px;
    height:60px;
    border-radius:50%;
    background:#f1f3ff;
    display:flex;
    align-items:center;
    justify-content:center;
    margin:0 auto 10px;
    font-size:22px;
}

/* Text */
.ins-card p{
    margin:0;
    font-size:14px;
    color:#333;
    font-weight:500;
}

/* Responsive */
@media (max-width:768px){
    .ins-card{
        padding:15px 5px;
    }
    .icon-circle{
        width:50px;
        height:50px;
        font-size:18px;
    }
}
@media (min-width: 768px) {
  .custom-gap {
    gap: 60px;
  }
}
/* Responsive heading */
.responsive-heading {
  font-size: 22px;
}

@media (min-width: 768px) {
  .responsive-heading {
    font-size: 28px;
  }
}

@media (min-width: 992px) {
  .responsive-heading {
    font-size: 35px;
  }
}

/* Optional: better spacing on mobile */
.feature-box {
  border-radius: 10px;
  background: #fff;
}
p {
    font-size: 14px;
}
@media (max-width: 576px) {
    h1 {
        font-size: 22px;
    }
}
.testimonial-section {
    position: relative;
    padding: 80px 20px;
    background: #f7f9fc;
    overflow: hidden;
}

/* Heading */
.testimonial-section h1 {
    font-size: 36px;
    font-weight: bold;
}

.testimonial-section .sub {
    color: #6c757d;
    margin-bottom: 15px;
}

.stars {
    color: #ffb400;
    font-size: 22px;
    margin-bottom: 20px;
}

/* Testimonial Box */
.testimonial-box {
    max-width: 600px;
    margin: auto;
    background: #fff;
    padding: 25px;
    border-radius: 12px;
    box-shadow: 0 5px 20px rgba(0,0,0,0.08);
}

.user-name {
    font-weight: bold;
    margin-top: 10px;
}

/* Floating Images */
.floating-img {
    position: absolute;
}

.floating-img img {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    border: 3px solid #fff;
}

/* Desktop positions */
.img1 { top: 10%; left: 5%; }
.img2 { top: 20%; right: 8%; }
.img3 { top: 60%; left: 10%; }

.img4 { bottom: 15%; right: 5%; }
.img5 { bottom: 30%; left: 20%; }
.img6 { top: 40%; right: 15%; }

/* ================= MOBILE ================= */
@media (max-width: 768px) {

    .testimonial-section {
        padding: 50px 15px;
        margin-top: 70px;
    }

    .testimonial-section h1 {
        font-size: 24px;
    }

    .testimonial-box {
        padding: 20px;
    }

    /* Hide some floating images for clean mobile view */
    .img2, .img3, .img5, .img6 {
        display: none;
    }

    /* Keep only 2 small images */
    .img1 {
        top: 5%;
        left: 5%;
    }

    .img4 {
        bottom: 5%;
        right: 5%;
    }

    .floating-img img {
        width: 40px;
        height: 40px;
    }
}

@media (max-width: 768px) {
    .insurance h1 {
        font-size: 24px;
    }

    .insurance p {
        font-size: 14px;
    }
}

/* Center boxes on mobile */
@media (max-width: 768px) {

    .section-wrapper .row.g-3 {
        justify-content: center;
    }

    .feature-box {
        text-align: center;
        margin-left: auto;
        margin-right: auto;
        max-width: 300px; /* keeps box nicely centered */
    }

    .feature-icon {
        display: flex;
        justify-content: center;
        align-items: center;
        margin-bottom: 10px;
        font-size: 24px;
    }
}
.testimonial-section {
    background: #f5f7fb;
}

/* Images */
.user-img {
    width: 70px;
    height: 70px;
    border-radius: 50%;
    border: 4px solid #fff;
}

/* Text */
.stars {
    color: orange;
    margin: 10px 0;
}

.testimonial-text {
    font-size: 14px;
    max-width: 500px;
    margin: auto;
}

/* Mobile */
@media (max-width: 768px) {
    .user-img {
        width: 50px;
        height: 50px;
    }

    h2 {
        font-size: 22px;
    }
}
.testimonial-section {
    background: #f5f7fb;
}

/* Images */
.user-img {
     width: 85px;
    height: 85px;
    margin-left:200px;
    border-radius: 50%;
    border: 4px solid #fff;
}
.user-img2 {
     width: 85px;
    height: 85px;
    margin-left:2px;
    margin-top:10px;
    border-radius: 50%;
    border: 4px solid #fff;
}
.user-img3 {
    width: 85px;
    height: 85px;
    margin-left:170px;
    margin-top:10px;
    border-radius: 50%;
    border: 4px solid #fff;
}
.user-img4 {
    width: 85px;
    height: 85px;
    margin-left:15px;
    margin-top:10px;
    border-radius: 50%;
    border: 4px solid #fff;
}
.user-img5 {
    width: 85px;
    height: 85px;
    margin-left:200px;
    margin-top:10px;
    border-radius: 50%;
    border: 4px solid #fff;
}
.user-img6 {
    width: 85px;
    height: 85px;
    margin-top:10px;
    border-radius: 50%;
    border: 4px solid #fff;
}



.user-img-small {
    width: 85px;
    height: 85px;
    border-radius: 50%;
}

/* Text */
.stars {
    color: orange;
    margin: 10px 0;
}

.testimonial-text {
    font-size: 14px;
    max-width: 500px;
    margin: auto;
}

/* MOBILE */
@media (max-width: 768px) {

    .col-md-3 {
        flex-direction: row !important;
        justify-content: center !important;
        flex-wrap: wrap;
    }

    .user-img {
        width: 50px;
        height: 50px;
        margin: 8px !important;
    }
}


/* MOBILE */
@media (max-width: 768px) {

    .testimonial-section .col-md-3 {
        display: flex !important;
        flex-direction: row !important;
        justify-content: center !important;
        flex-wrap: wrap !important;
    }

    .user-img,
    .user-img2,
    .user-img3,
    .user-img4,
    .user-img5,
    .user-img6 {
        width: 50px;
        height: 50px;
        margin: 6px;
    }
}


.how-it-works {
    background: #f7f8fa;
}

.step {
    text-align: center;
    position: relative;
    padding: 20px;
}

/* Middle step lower (like image curve) */
.middle-step {
    margin-top: 80px;
}

/* Circle design */
.circle {
    width: 90px;
    height: 90px;
    border-radius: 50%;
    border: 2px dashed #ccc;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: auto;
    background: #fff;
    box-shadow: 0 5px 15px rgba(0,0,0,0.05);
}

.circle span {
    font-size: 30px;
    color: #7b61ff;
}

/* Arrow styling */
.arrow {
    position: absolute;
    font-size: 30px;
    color: #b197fc;
}

.arrow-1 {
    left: 33%;
    top: 40%;
}

.arrow-2 {
    right: 33%;
    top: 40%;
}

/* Mobile responsive */
@media (max-width: 768px) {
    .middle-step {
        margin-top: 0;
    }

    .arrow {
        display: none;
    }
}
.curve {
    position: absolute;
    width: 200px;
    height: 100px;
}

.curve-1 {
    left: 28%;
    top: 20%;
}

.curve-2 {
    right: 28%;
    top: 20%;
}
.how-section {
    background: #f5f6f8;
}

/* Step boxes */
.step-box {
    text-align: center;
    position: relative;
    z-index: 2;
}

/* Middle step नीचे */
.middle-step {
    margin-top: 120px;
}

/* Circle */
.circle {
    width: 90px;
    height: 90px;
    border-radius: 50%;
    border: 2px dashed #ddd;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: auto;
    font-size: 28px;
    color: #7c4dff;
    background: #fff;
    box-shadow: 0 5px 15px rgba(0,0,0,0.05);
}

/* Curved arrows */
.curve {
    position: absolute;
    width: 240px;
    height: 120px;
    z-index: 1;
}

.curve-1 {
    left: 20%;
    top: 0%;
}

.curve-2 {
    right: 20%;
    top: 0%;
}

/* Mobile */
@media (max-width: 768px) {
    .middle-step {
        margin-top: 0;
    }

    .curve {
        display: none;
    }
}




/* Custom column (5 per row) */
.col-custom {
    width: 20%;
}

/* Card Design */
.ins-card {
    background: #fff;
    padding: 20px 10px;
    text-align: center;
    border-radius: 12px;
    transition: 0.3s;
}

.ins-card:hover {
    box-shadow: 0 5px 15px rgba(0,0,0,0.1);
}

/* Active Card */
.ins-card.active {
    background:#F7EEFF;
    color: #fff;
}

/* Icon Circle */
.icon-circle {
    width: 50px;
    height: 50px;
    background: #f1f1f1;
    border-radius: 50%;
    margin: 0 auto 10px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Mobile Responsive */
@media (max-width: 768px) {
    .col-custom {
        width: 50%;
    }
}
.custom-btn {
    background-color: #7c4dff;
    color: #fff;
    border-radius: 8px;
    padding: 10px 20px;
}

.custom-btn:hover {
    background-color: #5e35b1;
    color: #fff;
}

/* Make images equal height */
.col-6 img {
    object-fit: cover;
}
.testimonial-card {
    position: absolute !important;
    top: 250px;

    z-index: 9999; /* itna high value ki zarurat nahi hoti */

    display: flex;
    align-items: center;
    gap: 20px;
    padding: 10px 20px;

    width: 300px;   /* apne hisaab se change karo */
    height: 80px;   /* apne hisaab se change karo */

    background-color: #FFFFFF;
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.1);

    border-top-right-radius: 40px;
    border-bottom-right-radius: 40px;

    /* left side straight */
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.avatar-group {
    display: flex;
}

.avatar-group img {
    width: 35px;
    height: 35px;
    border-radius: 50%;
    border: 2px solid #fff;
    margin-left: -10px;
}

.avatar-group img:first-child {
    margin-left: 0;
}

.text {
    margin: 10px;
    font-size: 14px;
}

.stars {
    color: #f5a623;
    font-size: 16px;
}
