/*==================================================================
Project    : Healthcare International - Cardiac Sciences
Framework  : Bootstrap 5.3
Author     : Your Name
Version    : 1.0
====================================================================*/

/*==================================================================
01. GOOGLE FONTS
Loaded via HTML
====================================================================*/

/*==================================================================
02. CSS VARIABLES
====================================================================*/

:root{

    /* Brand Colors */

    --primary:#0A4E90;
    --secondary:#00A9A5;
    --accent:#E63946;

    /* Neutral Colors */

    --dark:#1E293B;
    --text:#64748B;
    --light:#F8FAFC;
    --white:#FFFFFF;
    --border:#E2E8F0;

    /* Typography */

    --heading-font:'Poppins',sans-serif;
    --body-font:'Inter',sans-serif;

    /* Border Radius */

    --radius:16px;

    /* Shadow */

    --shadow:0 10px 30px rgba(15,23,42,.08);

    /* Transition */

    --transition:all .3s ease;

}

/*==================================================================
03. RESET
====================================================================*/

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

/*==================================================================
04. GLOBAL
====================================================================*/

html{
    scroll-behavior:smooth;
}

body{

font-family:var(--body-font);

font-size:16px;

font-weight:400;

line-height:1.7;

color: #1c1c1c;

background:var(--white);

overflow-x:hidden;
}

img{
    max-width:100%;
    display:block;
}

a{
    text-decoration:none;
    transition:var(--transition);
}

h1,
h2,
h3,
h4,
h5,
h6{

    font-family:var(--heading-font);
    font-weight:700;
    color:var(--dark);
    margin-bottom:0;

}

p{

    margin-bottom:0;

}

ul,
ol{

    margin:0;
    padding:0;
    list-style:none;

}

button,
input,
textarea,
select{

    box-shadow:none !important;
    outline:none !important;

}

section{

    position:relative;

}

/*==================================================================
05. COMMON COMPONENTS
====================================================================*/

/* Section Padding */

.section-padding{

    padding:100px 0;

}

/* Section Heading */

.section-title{

    margin-bottom:60px;

}

.section-title h2{

font-size:42px;

font-weight:700;

margin-bottom:15px;
}

.section-title p{

max-width:650px;

margin:auto;
}

/* Primary Button */

.btn-primary-custom{

    background:var(--primary);
    color:var(--white);

    border:none;

    padding:14px 32px;

    border-radius:50px;

    font-weight:600;

    transition:var(--transition);

}

.btn-primary-custom:hover{

    background:var(--secondary);

    color:var(--white);

    transform:translateY(-3px);

}

/* Secondary Button */

.btn-outline-custom{

    border:2px solid var(--primary);

    color:var(--primary);

    border-radius:50px;

    padding:14px 32px;

    font-weight:600;

    transition:var(--transition);

}

.btn-outline-custom:hover{

    background:var(--primary);

    color:#fff;

}

/* Card */

.custom-card{

    background:#fff;

    border-radius:var(--radius);

    box-shadow:var(--shadow);

}
/*==========================
Navigation
==========================*/

.header-area{

    position:fixed;
    top:0;
    left:0;
    width:100%;
    z-index:999;
    background:#fff;
    transition:.35s;
    box-shadow:0 5px 20px rgba(0,0,0,.06);

}

.header-area.scrolled{

    box-shadow:0 10px 30px rgba(0,0,0,.10);

}

.navbar{

    padding:16px 0;

}

.navbar-brand{

    display:none;

}

.navbar-brand img{

    height:58px;

}

.navbar-wrapper{

    width:100%;
    display:grid;
    grid-template-columns:1fr auto 1fr;
    align-items:center;

}

.nav-left{

    display:flex;
    justify-content:flex-start;
    gap:28px;

}

.nav-logo{

    text-align:center;

}

.nav-logo img{

    height:68px;

}

.nav-right{

    display:flex;
    justify-content:flex-end;
    align-items:center;
    gap:30px;

}

.nav-right .navbar-nav{

    flex-direction:row;
    gap:22px;

}

.nav-link{

    font-family:'Poppins',sans-serif;
    font-size:15px;
    font-weight:500;
    color:#1f2937;
    transition:.3s;

}

.nav-link:hover,
.nav-link.active{

    color:#0A4E90;

}

.consultation-btn{

background:#0A4E90;

color:#fff;

padding:13px 26px;

border-radius:50px;

font-weight:600;

transition:.3s;

font-size: 14px;
}

.consultation-btn:hover{

    background:#00A9A5;
    color:#fff;

}

/*==========================
Responsive
==========================*/

@media(max-width:991.98px){

.navbar-brand{

    display:block;

}

.nav-logo{

    display:none;

}

.navbar-collapse{

    margin-top:20px;

}

.navbar-wrapper{

    display:block;

}

.nav-left,
.nav-right .navbar-nav{

    display:block;

}

.nav-left .nav-item,
.nav-right .nav-item{

    margin-bottom:8px;

}

.nav-right{

    display:block;

}

.consultation-btn{

    display:block;
    width:100%;
    margin-top:20px;
    text-align:center;

}

}
/*=========================================
Hero Section
=========================================*/

.hero-section {

    position: relative;

    padding: 140px 0 100px;

    background:
        linear-gradient(
            rgb(28 28 29 / 54%),
            rgb(36 36 36 / 73%)
        ),
        url("../img/bg/banner1.png");

    background-repeat: no-repeat;

    background-position: center center;

    background-size: cover;

    background-attachment: scroll;

    overflow: hidden;
}


/*-----------------------------------------
Hero Content
-----------------------------------------*/

.hero-content {

    position: relative;

    z-index: 2;

}


.hero-badge {

    display: inline-flex;

    align-items: center;

    gap: 8px;

    background: rgba(10, 78, 144, .15);

    color: #ffffff;

    padding: 10px 18px;

    border-radius: 50px;

    font-size: 14px;

    font-weight: 600;

}


.hero-title {

    font-size: clamp(30px, 4.2vw, 52px);

    font-weight: 700;

    line-height: 1.15;

    letter-spacing: -0.5px;

    margin-top: 20px;

    color: #ffffff;

    text-wrap: balance;

}


.hero-title span {

    color: var(--primary);

}


.hero-description {

    max-width: 620px;

    font-size: 18px;

    line-height: 1.7;

    margin-top: 20px;

    color: #ffffff;

}


/*-----------------------------------------
Highlights
-----------------------------------------*/

.hero-highlights {

    margin-top: 40px;

}


.highlight-item {

    display: flex;

    align-items: center;

    gap: 12px;

    font-weight: 500;

    color: #ffffff;

}


.highlight-item i {

    color: #16a34a;

    font-size: 18px;

    flex-shrink: 0;

}


/*-----------------------------------------
Hero Buttons
-----------------------------------------*/

.hero-buttons {

    margin-top: 40px;

}


.hero-buttons .btn {

padding: 9px 23px;

border-radius: 50px;

font-weight: 600;
}


/*=========================================
Right Side
=========================================*/

.hero-right {

    position: relative;

    z-index: 2;

}


/*-----------------------------------------
Upload Field
-----------------------------------------*/

.upload-field {

width: 100%;

height: 37px;

padding: 12px 15px;

border: 1px solid #ced4da;

border-radius: 6px;

display: flex;

background: #0000005c !important;

align-items: center;

gap: 10px;

cursor: pointer;

color: #d1d1d1;

background: #ffffff;

transition: .3s ease;
}


.upload-field:hover {

    border-color: #0a4e90;

}


.upload-field i {

    color: #0a4e90;

}


/*-----------------------------------------
Consultation Card
-----------------------------------------*/

.consultation-card {

position: relative;

z-index: 5;

width: 430px;

max-width: 100%;

background: #0000005c;

border-radius: 20px;

padding: 30px;

box-shadow: 0 25px 60px rgba(0, 0, 0, .12);
}
.consultation-card .form-control::placeholder {
    color: #d1d1d1;
    opacity: 1;
}
.consultation-card .form-check-label {
    color: #d1d1d1;
}
.consultation-header {

    margin-bottom: 25px;

}


.consultation-header h3 {

font-size: 28px;

line-height: 1.25;

margin-bottom: 0;

color: #ffffff;
}


.consultation-card .form-control,
.consultation-card .form-select {

height: 37px;

border-radius: 10px;

border-color: #d7dce2;

background: #0000005c;

color: #d1d1d1;
}


.consultation-card .form-control:focus,
.consultation-card .form-select:focus {

    border-color: #0a4e90;

    box-shadow: 0 0 0 .2rem rgba(10, 78, 144, .08);

}


.consultation-card .btn {

padding: 7px;

font-weight: 600;
}


.confidential-text {

margin-top: 15px;

text-align: center;

font-size: 13px;

color: #d1d1d1;
}


/*-----------------------------------------
Background Shapes
-----------------------------------------*/

.hero-shape {

    position: absolute;

    border-radius: 50%;

    z-index: 0;

}


.hero-shape-1 {

    width: 300px;

    height: 300px;

    background: rgba(10, 78, 144, .08);

    top: -50px;

    right: -80px;

}


.hero-shape-2 {

    width: 180px;

    height: 180px;

    background: rgba(0, 169, 165, .10);

    bottom: 60px;

    left: 20px;

}


/*=========================================
Trust Bar
=========================================*/

.trust-bar {

    background: var(--light);

}


.trust-card {

    background: var(--white);

    border-radius: 18px;

    padding: 30px 20px;

    text-align: center;

    box-shadow: 0 1px 17px #d9d9d9;

    height: 100%;

    transition: var(--transition);

}


.trust-card:hover {

    transform: translateY(-8px);

}


.trust-icon {

    width: 70px;

    height: 70px;

    margin: 0 auto 20px;

    border-radius: 50%;

    display: flex;

    align-items: center;

    justify-content: center;

    background: rgba(10, 78, 144, .08);

    color: var(--primary);

    font-size: 28px;

}


.trust-card h6 {

    font-size: 18px;

    margin-bottom: 10px;

    color: var(--dark);

}


.trust-card p {

    font-size: 15px;

    color: var(--text);

}


/*=========================================
Responsive
=========================================*/

@media (max-width: 1199.98px) {

    .hero-section {

        padding: 125px 0 80px;

    }

    .hero-title {

        font-size: 46px;

    }

    .consultation-card {

        width: 400px;

    }

}


@media (max-width: 991.98px) {

    .hero-section {

        padding: 120px 0 70px;

    }

    .hero-content {

        text-align: left;

    }

    .hero-description {

        max-width: 700px;

    }

    .hero-right {

        width: 100%;

        display: flex;

        justify-content: center;

    }

    .consultation-card {

        width: 100%;

        max-width: 500px;

    }

}


@media (max-width: 767.98px) {

    .hero-section {

        padding: 110px 0 60px;

    }

    .hero-title {

        font-size: 36px;

    }

    .hero-description {

        font-size: 16px;

        line-height: 1.6;

    }

    .hero-highlights {

        margin-top: 30px;

    }

    .highlight-item {

        font-size: 14px;

    }

    .hero-buttons {

        margin-top: 30px;

    }

    .hero-buttons .btn {

        width: 100%;

    }

    .consultation-card {

        padding: 25px 20px;

        border-radius: 16px;

    }

    .consultation-header h3 {

        font-size: 24px;

    }

}


@media (max-width: 575.98px) {

    .hero-section {

        padding: 100px 0 50px;

    }

    .hero-title {

        font-size: 32px;

    }

    .hero-badge {

        font-size: 12px;

        padding: 8px 14px;

    }

    .hero-highlights .col-md-6 {

        margin-top: 14px !important;

    }

}


/*=========================================
Why Choose Us
=========================================*/

.why-choose{

position: relative;

background: linear-gradient(rgba(255,255,255,.4), rgba(255,255,255,.54)),
        url("../img/bg/bg2.png");

background-repeat: no-repeat;

background-position: center center;

background-size: cover;

background-attachment: scroll;

overflow: hidden;
}

.section-subtitle{

    display:inline-block;

    color:var(--primary);

    font-weight:600;

    margin-bottom:15px;

    text-transform:uppercase;

    letter-spacing:1px;

    font-size:14px;

}

.why-card{

background:#fff;

padding:30px;

border-radius:18px;

box-shadow:var(--shadow);

height:100%;

transition:var(--transition);

border: 1px solid #dcdcdc;
}

.why-card:hover{

    transform:translateY(-8px);

    border-color:var(--primary);

}

.why-card i{

    width:65px;

    height:65px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:50%;

    background:rgba(10,78,144,.08);

    color:var(--primary);

    font-size:26px;

    margin-bottom:20px;

}

.why-card h5{

    margin-bottom:12px;

    font-size:20px;

}

.why-card p{

    color:var(--text);

    margin-bottom:0;

}
/*=========================================
Treatments
=========================================*/

.treatments{

background: #84848424;
}

.treatment-card{

    background:var(--white);

    padding:35px 30px;

    border-radius:20px;

    box-shadow:var(--shadow);

    transition:var(--transition);

    height:100%;

    border:1px solid transparent;

}

.treatment-card:hover{

    transform:translateY(-10px);

    border-color:var(--primary);

}

.treatment-icon{

    width:75px;

    height:75px;

    border-radius:50%;

    background:rgba(10,78,144,.08);

    display:flex;

    align-items:center;

    justify-content:center;

    color:var(--primary);

    font-size:30px;

    margin-bottom:25px;

}

.treatment-card h4{

    font-size:22px;

    margin-bottom:15px;

}

.treatment-card p{

    margin-bottom:25px;

}

.treatment-link{

    font-weight:600;

    color:var(--primary);

}

.treatment-link:hover{

    color:var(--secondary);

}

/*==================================================
DOCTORS SECTION
==================================================*/

.doctors-section{

padding:100px 0;

position:relative;

overflow:hidden;

background: linear-gradient(
            rgba(248,250,252,.65),
            rgba(248,250,252,.75)
        ),
        url("../img/bg/bg-plain.png");

background-repeat:no-repeat;

background-position:center center;

background-size:cover;

background-attachment:scroll;
}



/*==================================================
SECTION HEADER
==================================================*/


.section-badge{

    display:inline-flex;

    align-items:center;

    padding:8px 20px;

    background:rgba(10,78,144,.08);

    color:#0A4E90;

    border-radius:50px;

    font-family:'Poppins',sans-serif;

    font-size:14px;

    font-weight:600;

    letter-spacing:.3px;

}



.section-title{

font-family:'Poppins',sans-serif;

/* font-size:42px; */

/* font-weight:700; */

/* line-height:1.3; */

color:#111827;
}



.section-description{

    color:#64748B;

    font-size:17px;

    line-height:1.8;

}



/*==================================================
CAROUSEL WRAPPER
==================================================*/


.doctor-carousel-wrapper{

    position:relative;

    padding-bottom:60px;

}



/*==================================================
DOCTOR CARD
==================================================*/


.doctor-card{

background: #ffffff40;

border-radius:28px;

overflow:hidden;

box-shadow: 0 20px 40px rgba(0,0,0,.08);

transition:.4s ease;

border:1px solid rgba(10,78,144,.08);

padding: 10px;
}



.doctor-card:hover{

    transform:translateY(-8px);

    box-shadow:

    0 35px 90px rgba(10,78,144,.15);

}





/*==================================================
DOCTOR IMAGE
==================================================*/


.doctor-photo{

    position:relative;

    height:100%;

    min-height:540px;

    overflow:hidden;

}



.doctor-photo img{

    width:100%;

    height:100%;

    min-height:540px;

    object-fit:cover;

    transition:.6s ease;

}



.doctor-card:hover .doctor-photo img{

    transform:scale(1.06);

}



/*==================================================
AVAILABILITY BADGE
==================================================*/


.doctor-availability{

    position:absolute;

    top:25px;

    left:25px;

    background:#ffffff;

    color:#198754;

    padding:10px 18px;

    border-radius:50px;

    font-size:13px;

    font-weight:600;

    box-shadow:

    0 10px 30px rgba(0,0,0,.12);

}



.doctor-availability span{

    width:9px;

    height:9px;

    background:#22c55e;

    display:inline-block;

    border-radius:50%;

    margin-right:8px;

}



/*==================================================
DOCTOR DETAILS
==================================================*/


.doctor-details{

    padding:45px;

}



.hospital-tag{

    display:inline-flex;

    align-items:center;

    gap:8px;

    padding:8px 18px;

    background:rgba(10,78,144,.08);

    color:#0A4E90;

    border-radius:50px;

    font-size:14px;

    font-weight:600;

    margin-bottom:20px;

}



.doctor-details h3{

    font-family:'Poppins',sans-serif;

    font-size:36px;

    font-weight:700;

    color:#111827;

    margin-bottom:8px;

}



.doctor-details h5{

    font-size:20px;

    font-weight:500;

    color:#475569;

    margin-bottom:15px;

}



.doctor-degree{

    color:#64748B;

    font-weight:500;

    margin-bottom:30px;

}





/*==================================================
STATS
==================================================*/


.doctor-stats{

    display:flex;

    gap:15px;

    margin-bottom:30px;

}



.doctor-stats div{

    flex:1;

    background:#F8FAFC;

    padding:18px 12px;

    border-radius:18px;

    text-align:center;

}



.doctor-stats strong{

    display:block;

    color:#0A4E90;

    font-size:25px;

    font-weight:700;

}



.doctor-stats span{

    display:block;

    margin-top:5px;

    font-size:13px;

    color:#64748B;

}





/*==================================================
DESCRIPTION
==================================================*/


.doctor-description{

    color:#475569;

    line-height:1.8;

    margin-bottom:25px;

}





/*==================================================
SPECIALITIES
==================================================*/


.doctor-specialities{

    display:flex;

    flex-wrap:wrap;

    gap:10px;

    margin-bottom:30px;

}



.doctor-specialities span{

    background:#EFF6FF;

    color:#0A4E90;

    padding:9px 18px;

    border-radius:50px;

    font-size:14px;

    font-weight:600;

    transition:.3s;

}



.doctor-specialities span:hover{

    background:#0A4E90;

    color:#ffffff;

}





/*==================================================
BUTTONS
==================================================*/


.doctor-actions{

    display:flex;

    gap:15px;

    flex-wrap:wrap;

}



.doctor-actions .btn{

    padding:14px 30px;

    border-radius:50px;

    font-weight:600;

}



.doctor-actions .btn-primary{

    background:#0A4E90;

    border-color:#0A4E90;

}



.doctor-actions .btn-primary:hover{

    background:#00A9A5;

    border-color:#00A9A5;

}





/*==================================================
CAROUSEL CONTROLS
==================================================*/


#doctorCarousel .carousel-control-prev,

#doctorCarousel .carousel-control-next{


    width:55px;

    height:55px;

    background:#0A4E90;

    border-radius:50%;

    top:50%;

    transform:translateY(-50%);

    opacity:1;


}



#doctorCarousel .carousel-control-prev{

    left:-25px;

}



#doctorCarousel .carousel-control-next{

    right:-25px;

}





/*==================================================
INDICATORS
==================================================*/


#doctorCarousel .carousel-indicators{

    bottom:-45px;

}



#doctorCarousel .carousel-indicators button{

width:12px;

height: 12px;

border-radius:50%;

background:#0A4E90;

box-sizing: border-box;

border: none;
}



/*==================================================
ANIMATION
==================================================*/


.carousel-item.active .doctor-details{

    animation:

    doctorContent .7s ease;

}



@keyframes doctorContent{


from{

opacity:0;

transform:translateX(30px);

}


to{

opacity:1;

transform:translateX(0);

}


}
/*==================================================
Doctors ECG Animation
==================================================*/

.doctors-section .doctor-heartbeat{

    width:260px;

    margin:22px auto 28px;

    position:relative;

}

.doctors-section .doctor-heartbeat svg{

    width:100%;

    height:70px;

    overflow:visible;

}

.doctors-section .doctor-heartbeat path{

    fill:none;

    stroke:#dc3545;

    stroke-width:4;

    stroke-linecap:round;

    stroke-linejoin:round;

    stroke-dasharray:1200;

    stroke-dashoffset:1200;

    animation:ecgMove 3s linear infinite;

    filter:
    drop-shadow(0 0 3px rgba(220,53,69,.5))
    drop-shadow(0 0 8px rgba(220,53,69,.4));

}

@keyframes ecgMove{

    from{

        stroke-dashoffset:1200;

    }

    to{

        stroke-dashoffset:0;

    }

}
/*==================================================
SUCCESS STATISTICS SECTION
==================================================*/


.success-statistics-section{

    padding:100px 0;

    background:#F8FAFC;

    position:relative;

}





/*==================================================
STAT CARD
==================================================*/


.stat-card{

    background:#ffffff;

    padding:40px 25px;

    border-radius:24px;

    text-align:center;

    height:100%;

    border:1px solid rgba(10,78,144,.08);

    box-shadow:

    0 15px 45px rgba(0,0,0,.06);

    transition:.4s ease;

    position:relative;

    overflow:hidden;

}





.stat-card::before{

    content:"";

    position:absolute;

    width:120px;

    height:120px;

    background:rgba(10,78,144,.05);

    border-radius:50%;

    top:-60px;

    right:-60px;

    transition:.4s ease;

}





.stat-card:hover{

    transform:translateY(-10px);

    box-shadow:

    0 30px 70px rgba(10,78,144,.15);

}





.stat-card:hover::before{

    transform:scale(1.5);

}





/*==================================================
ICON
==================================================*/


.stat-icon{

    width:80px;

    height:80px;

    margin:0 auto 25px;

    border-radius:50%;

    display:flex;

    align-items:center;

    justify-content:center;

    background:

    rgba(10,78,144,.08);

    color:#0A4E90;

    font-size:32px;

    position:relative;

    z-index:2;

    transition:.3s ease;

}





.stat-card:hover .stat-icon{

    background:#0A4E90;

    color:#ffffff;

    transform:rotateY(360deg);

}





/*==================================================
COUNTER NUMBER
==================================================*/


.stat-number{

    font-family:'Poppins',sans-serif;

    font-size:48px;

    font-weight:700;

    line-height:1;

    color:#0A4E90;

    margin-bottom:15px;

    position:relative;

    z-index:2;

}





.stat-number::after{

    content:"+";

    font-size:32px;

}





/*==================================================
TITLE
==================================================*/


.stat-card h4{

    font-family:'Poppins',sans-serif;

    font-size:20px;

    font-weight:600;

    color:#111827;

    margin-bottom:12px;

    position:relative;

    z-index:2;

}





.stat-card p{

    color:#64748B;

    font-size:15px;

    line-height:1.7;

    margin-bottom:0;

    position:relative;

    z-index:2;

}





/*==================================================
RESPONSIVE
==================================================*/


@media(max-width:991px){


    .success-statistics-section{

        padding:80px 0;

    }



    .stat-number{

        font-size:42px;

    }



}





@media(max-width:767px){


    .success-statistics-section{

        padding:60px 0;

    }



    .stat-card{

        padding:35px 20px;

    }



    .stat-number{

        font-size:38px;

    }



    .stat-icon{

        width:70px;

        height:70px;

        font-size:28px;

    }


}

/*==================================================
VIDEO TESTIMONIALS SECTION
==================================================*/


.video-testimonials-section{

    padding:100px 0;

    background:#ffffff;

    position:relative;

}





/*==================================================
VIDEO CARD
==================================================*/


.video-card{

    background:#ffffff;

    border-radius:24px;

    overflow:hidden;

    border:1px solid rgba(10,78,144,.08);

    box-shadow:

    0 20px 50px rgba(0,0,0,.08);

    transition:.4s ease;

    height:100%;

}



.video-card:hover{

    transform:translateY(-8px);

    box-shadow:

    0 30px 70px rgba(10,78,144,.16);

}





/*==================================================
VIDEO THUMBNAIL
==================================================*/


.video-thumbnail{

    position:relative;

    height:260px;

    overflow:hidden;

}



.video-thumbnail img{

    width:100%;

    height:100%;

    object-fit:cover;

    transition:.5s ease;

}



.video-card:hover 
.video-thumbnail img{

    transform:scale(1.08);

}





/* Dark Overlay */

.video-thumbnail::after{

    content:"";

    position:absolute;

    inset:0;

    background:

    linear-gradient(
        rgba(0,0,0,.15),
        rgba(0,0,0,.45)
    );

}





/*==================================================
PLAY BUTTON
==================================================*/


.video-play-btn{

    position:absolute;

    top:50%;

    left:50%;

    transform:translate(-50%,-50%);

    width:75px;

    height:75px;

    border-radius:50%;

    border:none;

    background:#ffffff;

    color:#0A4E90;

    font-size:25px;

    display:flex;

    align-items:center;

    justify-content:center;

    z-index:2;

    cursor:pointer;

    transition:.35s ease;

}





.video-play-btn:hover{

    background:#0A4E90;

    color:#ffffff;

    transform:

    translate(-50%,-50%) scale(1.1);

}





.video-play-btn::before{

    content:"";

    position:absolute;

    width:100%;

    height:100%;

    border-radius:50%;

    background:rgba(255,255,255,.4);

    animation:pulsePlay 2s infinite;

}





@keyframes pulsePlay{


0%{

transform:scale(1);

opacity:.7;

}


100%{

transform:scale(1.5);

opacity:0;

}


}





/*==================================================
VIDEO CONTENT
==================================================*/


.video-content{

    padding:25px;

}





/* Patient Info */


.patient-info{

    display:flex;

    align-items:center;

    gap:15px;

    margin-bottom:20px;

}





.patient-info img{

    width:45px;

    height:30px;

    object-fit:cover;

    border-radius:4px;

}





.patient-info h4{

    font-family:'Poppins',sans-serif;

    font-size:18px;

    font-weight:600;

    color:#111827;

    margin:0;

}





.patient-info p{

    margin:4px 0 0;

    color:#64748B;

    font-size:14px;

}





/*==================================================
TREATMENT TAG
==================================================*/


.treatment-tag{

    display:inline-flex;

    align-items:center;

    gap:8px;

    padding:10px 18px;

    background:#EFF6FF;

    color:#0A4E90;

    border-radius:50px;

    font-size:14px;

    font-weight:600;

}





/*==================================================
RESPONSIVE
==================================================*/


@media(max-width:991px){


    .video-testimonials-section{

        padding:80px 0;

    }


}




@media(max-width:767px){


    .video-testimonials-section{

        padding:60px 0;

    }



    .video-thumbnail{

        height:230px;

    }



    .video-play-btn{

        width:65px;

        height:65px;

        font-size:22px;

    }



}


/*==================================================
PATIENT REVIEWS SECTION
==================================================*/


.patient-reviews-section{

    padding:100px 0;

    background:#F8FAFC;

}





/*==================================================
REVIEW CARD
==================================================*/


.review-card{

    background:#ffffff;

    padding:35px;

    border-radius:24px;

    height:100%;

    border:1px solid rgba(10,78,144,.08);

    box-shadow:

    0 15px 45px rgba(0,0,0,.07);

    transition:.4s ease;

    position:relative;

}





.review-card:hover{

    transform:translateY(-8px);

    box-shadow:

    0 30px 70px rgba(10,78,144,.15);

}





/*==================================================
PATIENT HEADER
==================================================*/


.review-top{

    display:flex;

    align-items:center;

    gap:18px;

    margin-bottom:20px;

}





.review-top > img{

    width:65px;

    height:65px;

    object-fit:cover;

    border-radius:50%;

    border:3px solid #E8F1FA;

}





.review-top h4{

    font-family:'Poppins',sans-serif;

    font-size:18px;

    font-weight:600;

    color:#111827;

    margin:0 0 6px;

}





/*==================================================
COUNTRY
==================================================*/


.patient-country{

    display:flex;

    align-items:center;

    gap:8px;

    color:#64748B;

    font-size:14px;

}





.patient-country img{

    width:25px;

    height:18px;

    border-radius:3px;

    object-fit:cover;

}





/*==================================================
STARS
==================================================*/


.review-stars{

    color:#F59E0B;

    font-size:22px;

    letter-spacing:3px;

    margin-bottom:20px;

}





/*==================================================
REVIEW TEXT
==================================================*/


.review-text{

    color:#475569;

    font-size:15px;

    line-height:1.8;

    margin-bottom:25px;

}





/*==================================================
TREATMENT BADGE
==================================================*/


.review-treatment{

    display:inline-flex;

    align-items:center;

    gap:8px;

    padding:10px 18px;

    background:#EFF6FF;

    color:#0A4E90;

    border-radius:50px;

    font-size:14px;

    font-weight:600;

}





.review-treatment i{

    font-size:14px;

}





/*==================================================
QUOTE DECORATION
==================================================*/


.review-card::after{

    content:"“";

    position:absolute;

    right:25px;

    top:10px;

    font-size:80px;

    font-family:Georgia,serif;

    color:rgba(10,78,144,.08);

}





/*==================================================
RESPONSIVE
==================================================*/


@media(max-width:991px){


    .patient-reviews-section{

        padding:80px 0;

    }


}





@media(max-width:767px){


    .patient-reviews-section{

        padding:60px 0;

    }



    .review-card{

        padding:28px;

    }



    .review-top > img{

        width:55px;

        height:55px;

    }



    .review-text{

        font-size:14px;

    }



}

/*==================================================
BEFORE YOU TRAVEL SECTION
==================================================*/

.before-travel-section{

padding:100px 0;

background: #84848424;
}





/*==================================================
TRAVEL CARD
==================================================*/

.travel-card{

    height:100%;

    padding:35px 30px;

    background:#ffffff;

    border:1px solid rgba(10,78,144,.08);

    border-radius:24px;

    box-shadow:0 15px 45px rgba(0,0,0,.06);

    transition:.4s ease;

    position:relative;

    overflow:hidden;

}





.travel-card::before{

    content:"";

    position:absolute;

    width:120px;

    height:120px;

    border-radius:50%;

    background:rgba(0,169,165,.06);

    top:-60px;

    right:-60px;

    transition:.4s ease;

}





.travel-card:hover{

    transform:translateY(-8px);

    border-color:rgba(10,78,144,.18);

    box-shadow:0 25px 60px rgba(10,78,144,.13);

}





.travel-card:hover::before{

    transform:scale(1.5);

}





/*==================================================
TRAVEL ICON
==================================================*/

.travel-icon{

    width:70px;

    height:70px;

    border-radius:18px;

    display:flex;

    align-items:center;

    justify-content:center;

    background:#EFF6FF;

    color:#0A4E90;

    font-size:28px;

    margin-bottom:25px;

    position:relative;

    z-index:2;

    transition:.35s ease;

}





.travel-card:hover .travel-icon{

    background:#0A4E90;

    color:#ffffff;

    transform:translateY(-4px);

}





/*==================================================
TRAVEL CARD CONTENT
==================================================*/

.travel-card h4{

    font-family:'Poppins',sans-serif;

    font-size:20px;

    font-weight:600;

    color:#111827;

    margin-bottom:14px;

    position:relative;

    z-index:2;

}





.travel-card p{

    color:#64748B;

    font-size:15px;

    line-height:1.8;

    margin:0;

    position:relative;

    z-index:2;

}





/*==================================================
SUPPORT BANNER
==================================================*/

.travel-support-banner{

    display:flex;

    align-items:center;

    justify-content:space-between;

    gap:30px;

    padding:35px 40px;

    border-radius:24px;

    background:

    linear-gradient(

        135deg,

        #0A4E90,

        #073B6E

    );

    box-shadow:0 20px 50px rgba(10,78,144,.18);

}





.travel-support-banner h3{

    color:#ffffff;

    font-family:'Poppins',sans-serif;

    font-size:24px;

    font-weight:600;

    margin-bottom:8px;

}





.travel-support-banner p{

    color:rgba(255,255,255,.8);

    margin:0;

    font-size:15px;

}





.travel-support-banner .btn{

    flex-shrink:0;

    background:#ffffff;

    color:#0A4E90;

    border:none;

    padding:13px 25px;

    border-radius:50px;

    font-weight:600;

    transition:.3s ease;

}





.travel-support-banner .btn:hover{

    background:#00A9A5;

    color:#ffffff;

    transform:translateY(-2px);

}





/*==================================================
RESPONSIVE
==================================================*/

@media(max-width:991px){

    .before-travel-section{

        padding:80px 0;

    }



    .travel-support-banner{

        align-items:flex-start;

        flex-direction:column;

    }



}





@media(max-width:767px){

    .before-travel-section{

        padding:60px 0;

    }



    .travel-card{

        padding:30px 25px;

    }



    .travel-support-banner{

        padding:30px 25px;

    }



    .travel-support-banner h3{

        font-size:21px;

    }



    .travel-support-banner .btn{

        width:100%;

    }

}
/*==================================================
BEFORE YOU TRAVEL REVEAL ANIMATION
==================================================*/

.travel-reveal{

    opacity:0;

    transform:translateY(30px);

    transition:

        opacity .7s ease,

        transform .7s ease;

}





.travel-reveal.travel-visible{

    opacity:1;

    transform:translateY(0);

}





/* Stagger Card Animation */

.travel-card:nth-child(1){

    transition-delay:.05s;

}



.travel-card:nth-child(2){

    transition-delay:.10s;

}



.travel-card:nth-child(3){

    transition-delay:.15s;

}



.travel-card:nth-child(4){

    transition-delay:.20s;

}



.travel-card:nth-child(5){

    transition-delay:.25s;

}



.travel-card:nth-child(6){

    transition-delay:.30s;

}





/* Accessibility */

@media(prefers-reduced-motion:reduce){

    .travel-reveal{

        opacity:1;

        transform:none;

        transition:none;

    }

}

/*==================================================
FAQ SECTION
==================================================*/

.faq-section{

    padding:100px 0;

    background:#F8FAFC;

}





/*==================================================
FAQ ACCORDION
==================================================*/

.faq-accordion{

    display:flex;

    flex-direction:column;

    gap:16px;

}





.faq-accordion .accordion-item{

    border:1px solid rgba(10,78,144,.08);

    border-radius:18px;

    overflow:hidden;

    background:#ffffff;

    box-shadow:0 8px 30px rgba(0,0,0,.04);

    transition:.3s ease;

}





.faq-accordion .accordion-item:hover{

    border-color:rgba(10,78,144,.2);

    box-shadow:0 15px 40px rgba(10,78,144,.08);

}





/*==================================================
FAQ BUTTON
==================================================*/

.faq-accordion .accordion-button{

    padding:22px 25px;

    background:#ffffff;

    color:#111827;

    font-family:'Poppins',sans-serif;

    font-size:16px;

    font-weight:600;

    line-height:1.5;

    box-shadow:none;

}





.faq-accordion .accordion-button:not(.collapsed){

    color:#0A4E90;

    background:#ffffff;

    box-shadow:none;

}





.faq-accordion .accordion-button:focus{

    box-shadow:none;

}





/*==================================================
CUSTOM ACCORDION ICON
==================================================*/

.faq-accordion .accordion-button::after{

    width:14px;

    height:14px;

    background-image:none;

    border-right:2px solid #0A4E90;

    border-bottom:2px solid #0A4E90;

    transform:rotate(45deg);

    transition:.3s ease;

}





.faq-accordion .accordion-button:not(.collapsed)::after{

    transform:rotate(225deg);

}





/*==================================================
FAQ BODY
==================================================*/

.faq-accordion .accordion-body{

    padding:0 25px 24px;

    color:#64748B;

    font-size:15px;

    line-height:1.8;

}





/*==================================================
FAQ ANIMATION
==================================================*/

.faq-accordion .accordion-collapse{

    transition:height .35s ease;

}





/*==================================================
RESPONSIVE
==================================================*/

@media(max-width:991px){

    .faq-section{

        padding:80px 0;

    }

}





@media(max-width:767px){

    .faq-section{

        padding:60px 0;

    }



    .faq-accordion{

        gap:12px;

    }



    .faq-accordion .accordion-button{

        padding:18px 20px;

        font-size:15px;

    }



    .faq-accordion .accordion-body{

        padding:0 20px 20px;

        font-size:14px;

    }

}


/*==================================================
FINAL CTA SECTION
==================================================*/

.final-cta-section{

padding:100px 0;

background: #84848424;
}





/*==================================================
CTA BOX
==================================================*/

.final-cta-box{

    position:relative;

    overflow:hidden;

    padding:70px 60px;

    border-radius:32px;

    background:

    linear-gradient(

        135deg,

        #0A4E90 0%,

        #073B6E 100%

    );

    box-shadow:

    0 30px 80px rgba(10,78,144,.22);

}





/* Decorative Shape 1 */

.final-cta-box::before{

    content:"";

    position:absolute;

    width:320px;

    height:320px;

    border-radius:50%;

    background:rgba(255,255,255,.06);

    top:-170px;

    right:-100px;

}





/* Decorative Shape 2 */

.final-cta-box::after{

    content:"";

    position:absolute;

    width:220px;

    height:220px;

    border-radius:50%;

    background:rgba(0,169,165,.12);

    bottom:-130px;

    left:-80px;

}





/*==================================================
CTA CONTENT
==================================================*/

.final-cta-content{

    position:relative;

    z-index:2;

    max-width:850px;

    margin:0 auto;

    text-align:center;

}





/*==================================================
BADGE
==================================================*/

.cta-badge{

    display:inline-flex;

    align-items:center;

    padding:8px 18px;

    border-radius:50px;

    background:rgba(255,255,255,.12);

    border:1px solid rgba(255,255,255,.2);

    color:#ffffff;

    font-size:13px;

    font-weight:600;

    letter-spacing:.3px;

    margin-bottom:20px;

}





/*==================================================
HEADING
==================================================*/

.final-cta-content h2{

    color:#ffffff;

    font-family:'Poppins',sans-serif;

    font-size:42px;

    line-height:1.25;

    font-weight:700;

    margin-bottom:20px;

}





/*==================================================
DESCRIPTION
==================================================*/

.final-cta-content p{

    max-width:700px;

    margin:0 auto 30px;

    color:rgba(255,255,255,.82);

    font-size:17px;

    line-height:1.8;

}





/*==================================================
CTA BUTTONS
==================================================*/

.final-cta-actions{

    display:flex;

    justify-content:center;

    align-items:center;

    gap:15px;

    flex-wrap:wrap;

}





.final-cta-actions .btn{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    gap:10px;

    padding:14px 26px;

    min-height:52px;

    border-radius:50px;

    font-size:15px;

    font-weight:600;

    transition:.3s ease;

}





/* Primary CTA */

.final-cta-primary{

    background:#ffffff;

    color:#0A4E90;

    border:2px solid #ffffff;

}





.final-cta-primary:hover{

    background:#00A9A5;

    color:#ffffff;

    border-color:#00A9A5;

    transform:translateY(-3px);

}





/* WhatsApp CTA */

.final-cta-whatsapp{

    background:transparent;

    color:#ffffff;

    border:2px solid rgba(255,255,255,.7);

}





.final-cta-whatsapp:hover{

    background:#ffffff;

    color:#0A4E90;

    border-color:#ffffff;

    transform:translateY(-3px);

}





/*==================================================
TRUST NOTE
==================================================*/

.cta-trust-note{

    display:flex;

    justify-content:center;

    align-items:center;

    gap:8px;

    margin-top:25px;

    color:rgba(255,255,255,.7);

    font-size:13px;

}





.cta-trust-note i{

    font-size:13px;

}





/*==================================================
RESPONSIVE
==================================================*/

@media(max-width:991px){

    .final-cta-section{

        padding:80px 0;

    }



    .final-cta-box{

        padding:60px 40px;

    }



    .final-cta-content h2{

font-size: 37px;

}

}





@media(max-width:767px){

    .final-cta-section{

        padding:60px 0;

    }



    .final-cta-box{

        padding:45px 25px;

        border-radius:24px;

    }



    .final-cta-content h2{

font-size: 25px;

}



    .final-cta-content p{

        font-size:15px;

    }



    .final-cta-actions{

        flex-direction:column;

        width:100%;

    }



    .final-cta-actions .btn{

        width:100%;

    }



    .cta-trust-note{

        align-items:flex-start;

        line-height:1.5;

    }

}

/*==================================================
FINAL CTA REVEAL
==================================================*/

.final-cta-reveal{

    opacity:0;

    transform:translateY(35px);

    transition:

        opacity .8s ease,

        transform .8s ease;

}





.final-cta-reveal.final-cta-visible{

    opacity:1;

    transform:translateY(0);

}





/*==================================================
REDUCED MOTION
==================================================*/

@media(prefers-reduced-motion:reduce){

    .final-cta-reveal{

        opacity:1;

        transform:none;

        transition:none;

    }

}


/*==================================================
FOOTER
==================================================*/

.site-footer{

    padding:80px 0 0;

    background:#071F3A;

    color:#ffffff;

}





/*==================================================
FOOTER BRAND
==================================================*/

.footer-logo{

    display:inline-block;

    margin-bottom:22px;

}





.footer-logo img{

    max-width:210px;

    max-height:65px;

    object-fit:contain;

}





.footer-brand p{

    max-width:360px;

    margin-bottom:25px;

    color:rgba(255,255,255,.7);

    font-size:14px;

    line-height:1.8;

}





/*==================================================
CONFIDENTIALITY NOTICE
==================================================*/

.footer-confidential{

    display:flex;

    align-items:flex-start;

    gap:12px;

    max-width:350px;

    padding:15px 16px;

    border-radius:12px;

    background:rgba(255,255,255,.06);

    border:1px solid rgba(255,255,255,.08);

    color:rgba(255,255,255,.75);

    font-size:13px;

    line-height:1.6;

}





.footer-confidential i{

    color:#00A9A5;

    margin-top:3px;

}





/*==================================================
FOOTER HEADINGS
==================================================*/

.footer-column h4{

    margin-bottom:25px;

    color:#ffffff;

    font-family:'Poppins',sans-serif;

    font-size:17px;

    font-weight:600;

}





/*==================================================
FOOTER LINKS
==================================================*/

.footer-column ul{

    padding:0;

    margin:0;

    list-style:none;

}





.footer-column li{

    margin-bottom:13px;

}





.footer-column a{

    color:rgba(255,255,255,.68);

    text-decoration:none;

    font-size:14px;

    transition:.3s ease;

}





.footer-column a:hover{

    color:#00A9A5;

    padding-left:4px;

}





/*==================================================
CONTACT LIST
==================================================*/

.footer-contact-list li{

    display:flex;

    align-items:flex-start;

    gap:12px;

}





.footer-contact-list i{

    width:18px;

    margin-top:3px;

    color:#00A9A5;

}





.footer-contact-list a{

    color:rgba(255,255,255,.75);

}





/*==================================================
SOCIAL ICONS
==================================================*/

.footer-socials{

    display:flex;

    gap:10px;

    margin-top:25px;

}





.footer-socials a{

    display:flex;

    align-items:center;

    justify-content:center;

    width:40px;

    height:40px;

    border-radius:50%;

    background:rgba(255,255,255,.08);

    color:#ffffff;

    transition:.3s ease;

}





.footer-socials a:hover{

    background:#00A9A5;

    color:#ffffff;

    transform:translateY(-3px);

}





/*==================================================
FOOTER BOTTOM
==================================================*/

.footer-bottom{

    display:flex;

    justify-content:space-between;

    align-items:center;

    gap:20px;

    margin-top:65px;

    padding:25px 0;

    border-top:1px solid rgba(255,255,255,.1);

}





.footer-copyright{

    color:rgba(255,255,255,.55);

    font-size:13px;

}





.footer-legal{

    display:flex;

    gap:25px;

}





.footer-legal a{

    color:rgba(255,255,255,.55);

    text-decoration:none;

    font-size:13px;

    transition:.3s ease;

}





.footer-legal a:hover{

    color:#00A9A5;

}





/*==================================================
RESPONSIVE
==================================================*/

@media(max-width:767px){

    .site-footer{

        padding-top:60px;

    }



    .footer-bottom{

        flex-direction:column;

        align-items:flex-start;

        margin-top:45px;

    }



    .footer-legal{

        flex-wrap:wrap;

        gap:15px;

    }



}

/*=========================================
SCROLL TO TOP
=========================================*/

.scroll-top{

--progress:0deg;

position:fixed;

right: 15px;

bottom:15px;

width: 34px;

height: 34px;

border:none;

border-radius:50%;

cursor:pointer;

z-index:99999;

display:flex;

align-items:center;

justify-content:center;

opacity:0;

visibility:hidden;

transform:translateY(20px);

transition:.35s ease;

background:
        conic-gradient(var(--primary) var(--progress), #dbe4ec 0);

padding: 9px;

box-shadow:0 12px 30px rgba(0,0,0,.18);
}

.scroll-top::before{

    content:"";

    position:absolute;

    inset:4px;

    background:#fff;

    border-radius:50%;

}

.scroll-top span{

    position:relative;

    z-index:2;

    color:var(--primary);

    font-size:18px;

}

.scroll-top.active{

    opacity:1;

    visibility:visible;

    transform:translateY(0);

}

.scroll-top:hover{

    transform:translateY(-5px);

}

/* ==========================================
   FLOATING WHATSAPP CTA
========================================== */

.whatsapp-float {

position: fixed;

right: 15px;

bottom: 75px;

width: 38px;

height: 38px;

display: flex;

align-items: center;

justify-content: center;

background: #25D366;

color: #ffffff;

border-radius: 50%;

font-size: 30px;

line-height: 1;

text-decoration: none;

z-index: 9999;

box-shadow: 0 8px 25px rgba(0, 0, 0, 0.20);

transition: all 0.3s ease;
}


/* Hover */

.whatsapp-float:hover {

    color: #ffffff;

    transform: translateY(-4px);

    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.28);

}


/* Subtle Pulse */

.whatsapp-float::before {

    content: "";

    position: absolute;

    inset: 0;

    border-radius: 50%;

    border: 2px solid rgba(37, 211, 102, 0.45);

    animation: whatsappPulse 2s infinite;

}


@keyframes whatsappPulse {

    0% {

        transform: scale(1);

        opacity: 0.8;

    }

    70% {

        transform: scale(1.35);

        opacity: 0;

    }

    100% {

        transform: scale(1.35);

        opacity: 0;

    }

}


/* ==========================================
   MOBILE
========================================== */

@media (max-width: 767px) {

    .whatsapp-float {

width: 33px;

height: 33px;

right: 17px;

bottom: 62px;

font-size: 27px;

}

}
/* ==========================================
   CONSULTATION MODAL
========================================== */

.consultation-modal {

    border: 0;

    border-radius: 20px;

    overflow: hidden;

    box-shadow: 0 25px 70px rgba(0, 0, 0, 0.18);

}


/* Modal Header */

.consultation-modal .modal-header {

    padding: 25px 30px 15px;

    border-bottom: 0;

    align-items: flex-start;

}

.consultation-modal .modal-title {

    font-size: 26px;

    font-weight: 700;

    color: var(--dark);

    margin: 0 0 6px;

}

.modal-subtitle {

    font-size: 14px;

    color: #6b7280;

}


/* Close Button */

.consultation-modal .btn-close {

box-shadow: none;

margin-left: auto;
}


/* Modal Body */

.consultation-modal .modal-body {

    padding: 10px 30px 30px;

}


/* Form Inputs */

.consultation-modal .form-control {

    height: 52px;

    border-radius: 10px;

    border: 1px solid #d1d5db;

    font-size: 14px;

    box-shadow: none;

}

.consultation-modal .form-control:focus {

    border-color: var(--primary);

    box-shadow: 0 0 0 3px rgba(10, 78, 144, 0.08);

}


/* Placeholder */

.consultation-modal .form-control::placeholder {

    color: #6b7280;

    opacity: 1;

}


/* Upload */

.consultation-modal .upload-field {

width: 100%;

height: 52px;

padding: 12px 15px;

border: 1px solid #d1d5db;

border-radius: 10px;

display: flex;

align-items: center;

gap: 10px;

cursor: pointer;

color: #6b7280;

background: #ffffff00 !important;

transition: .3s ease;
}

.consultation-modal .upload-field:hover {

    border-color: var(--primary);

}

.consultation-modal .upload-field i {

    color: var(--primary);

}


/* Privacy */

.consultation-modal .form-check-label {

    color: #6b7280;

    font-size: 14px;

}


/* Submit */

.consultation-modal .btn {

    min-height: 52px;

    border-radius: 10px;

    font-weight: 600;

}


/* Confidentiality */

.consultation-modal .confidential-text {

    margin-top: 15px;

    text-align: center;

    font-size: 13px;

    color: #6b7280;

}


/* ==========================================
   MOBILE
========================================== */

@media (max-width: 575px) {

    .consultation-modal {

        margin: 15px;

        border-radius: 16px;

    }

    .consultation-modal .modal-header {

        padding: 22px 20px 12px;

    }

    .consultation-modal .modal-body {

        padding: 10px 20px 25px;

    }

    .consultation-modal .modal-title {

        font-size: 23px;

    }

}