
:root {
    --primary-color: #052c65;
    --secondary-color: #198754;
    --accent-color: #052c65;
    --light-color: #f8f9fa;
    --dark-color: #052c65;
}

body {
    font-family: 'Noto Sans Bengali', sans-serif;
}

.hero-section {
    background:#052c65;
    height: 80vh;
    color: white;
    position: relative;
    display: flex;
    align-items: center;
}

.hero-content {
    z-index: 10;
}

.doctor-img {
    border-radius: 50%;
    border: 5px solid white;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
}

.service-card {
    border-radius: 10px;
    overflow: hidden;
    transition: all 0.3s ease;
    height: 100%;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}

.service-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.15);
}

.service-icon {
    font-size: 2.5rem;
    color: var(--primary-color);
}

.counter-box {
    padding: 30px 20px;
    border-radius: 10px;
    background-color: var(--light-color);
    text-align: center;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}

.counter-number {
    font-size: 2.5rem;
    font-weight: bold;
    color: var(--primary-color);
}

.testimonial-card {
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}

.appointment-section {
    background-color: var(--light-color);
    border-radius: 10px;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}

footer {
    background-color: var(--dark-color);
    color: white;
}

.social-icons a {
    display: inline-block;
    width: 40px;
    height: 40px;
    background-color:white;
    color: #052c65;
    border-radius: 50%;
    text-align: center;
    line-height: 40px;
    margin: 0 5px;
    transition: all 0.3s ease;
}

.social-icons a:hover {
    background-color: #1a4a92;
    color:white;
    transform: translateY(-5px);
}

.contact-social  a{
      background-color: #1a4a92;
       color:white;
}
.contact-social  a:hover{
    background-color:white;
    color: #052c65;
}

.btn-primary {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}

.btn-primary:hover {
    background-color: #052c65;
    border-color: #154ea3;
}

.specialties-list {
    list-style-type: none;
    padding-left: 0;
}

.specialties-list li {
    padding: 8px 0;
    border-bottom: 1px dashed #e9ecef;
}

.specialties-list li i {
    color: var(--primary-color);
    margin-right: 10px;
}

.youtube-thumbnail {
    position: relative;
    overflow: hidden;
    border-radius: 10px;
}

.youtube-thumbnail img {
    transition: transform 0.3s ease;
}

.youtube-thumbnail:hover img {
    transform: scale(1.05);
}

.play-button {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: white;
    font-size: 3rem;
    text-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
}

.accordion-button:not(.collapsed) {
    color:white;
    background-color: #052c65;
    box-shadow: inset 0 calc(-1 * var(--bs-accordion-border-width)) 0 var(--bs-accordion-border-color);
}

.text-color{
    color:#052c65;
}
.btn-color{
    color:#fdfdfd;
    background-color: #1b4482;
}
.btn-color:hover{
     background-color:#fdfdfd;
     color: #1b4482;
}


@media (max-width: 575.98px) {
 .service-card{
   text-align: center;
 }

 footer{
    /* text-align: center; */
 }

 .display-4{
   font-size:24px;
   margin:20px 0px 0px 20px;
 }

 .designation{
    font-size:14px;
   margin:20px 0px 0px 22px;
 }
 .site_bio{
    font-size:14px;
   margin:20px 0px 0px 20px;
 }

 .btn-section{
     margin:20px 0px 0px 55px;
 }

 .btn-lg{
     font-size:12px;
 }

 .doctor-img {
    border-radius: 50%;
    border: 5px solid white;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
    height: 215px;
    width: 215px;
}

.section-title, .description {
  text-align: center;
}

.introduce{
    display:none;
}

.navbar-toggler custom-toggler collapsed{
    font-size: 10px;
}
}