body{
font-family:"Jost",sans-serif;
}

/* Top Header */

.top-header{
background:#658f47;
}

/* Social icons */

.social a{
color:white;
margin-left:12px;
}

/* Dropdown hover */

.dropdown-item:hover{
background:#658f47;
color:white;
}

/* Our Services hover dropdown */

.nav-item.dropdown:hover .dropdown-menu{
display:block;
margin-top:0;
}

/* Image fit fix */

.about-img{
width:100%;
height:420px;
object-fit:cover;
border-radius:10px;
}

/* Floating icons */

.floating-tooth{
position:absolute;
top:15%;
left:4%;
font-size:40px;
color:#658f47;
animation:float 4s ease-in-out infinite;
}

.floating-tooth2{
position:absolute;
bottom:15%;
right:5%;
font-size:38px;
color:#658f47;
animation:float 5s ease-in-out infinite;
}

.floating-dentist{
position:absolute;
top:50%;
right:12%;
font-size:45px;
color:#658f47;
animation:float 6s ease-in-out infinite;
}

/* Floating animation */

@keyframes float{

0%{transform:translateY(0);}
50%{transform:translateY(-15px);}
100%{transform:translateY(0);}

}


.service-card{
position:relative;
overflow:hidden;
border-radius:12px;
background:#fff;
box-shadow:0 5px 20px rgba(0,0,0,0.08);
transition:.4s;
}

.service-img{
width:100%;
height:520px;
object-fit:cover;
}

.service-content{
padding:20px;
position:relative;
z-index:2;
background:#fff;
overflow:hidden;
}

.service-content h4{
font-weight:600;
margin-bottom:8px;
position:relative;
z-index:2;
}

.service-content p{
font-size:15px;
position:relative;
z-index:2;
}

/* hover fill animation only in text area */

.service-content::before{
content:"";
position:absolute;
bottom:0;
left:0;
width:100%;
height:0%;
background:#658f47;
transition:.5s;
z-index:1;
}

.service-card:hover .service-content::before{
height:100%;
}

.service-card:hover h4,
.service-card:hover p{
color:#fff;
}

/* ================= SECTION ================= */

.eye-review-section {
  padding: 70px 0;
  background: linear-gradient(135deg,#658f47,#4e7335);
  color: #fff;
  overflow: hidden;
}

.eye-review-section .section-tag {
  text-transform: uppercase;
  font-weight: 600;
  letter-spacing: 1px;
  color: #eaf4e2;
  margin-bottom: 10px;
  display: inline-block;
}

.eye-review-section .section-title {
  font-weight: 700;
  margin-bottom: 15px;
  line-height: 1.3;
}

.eye-review-section .section-desc {
  opacity: 0.95;
  max-width: 420px;
}

/* ================= CARD ================= */

.review-card {
  background: #ffffff;
  color: #333;
  padding: 28px;
  border-radius: 18px;
  height: 100%;
  box-shadow: 0 12px 35px rgba(0,0,0,0.15);
  max-width: 450px;
  margin: 0 auto;
  transition: 0.3s ease;
}

.review-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 18px 45px rgba(0,0,0,0.25);
}

.review-no {
  width: 46px;
  height: 46px;
  background: linear-gradient(135deg,#658f47,#4e7335);
  color: #fff;
  font-weight: bold;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 16px;
}

.review-card h5 {
  color: #658f47;
  font-weight: 600;
  margin-bottom: 10px;
  font-size: 18px;
}

.review-card p {
  font-size: 15px;
  line-height: 1.6;
}

/* ================= RESPONSIVE ================= */

@media (max-width:768px){

.eye-review-section{
text-align:center;
}

.eye-review-section .section-desc{
margin:auto;
}

}

@media (max-width:412px){

.eye-review-section{
padding:50px 15px;
}

.eye-review-section .section-title{
font-size:22px;
}

.review-card{
padding:22px;
}

}

      /* IMAGE FIT SYSTEM */

        .faq-img-box {
            height: 460px;
            overflow: hidden;
            border-radius: 20px;
        }

        .img-fit {
            width: 100%;
            height: 100%;
            object-fit: cover;
            display: block;
        }


        /* RESPONSIVE IMAGE */

        @media(max-width:991px) {

            .faq-img-box {
                height: 350px;
            }

        }

        @media(max-width:576px) {

            .faq-img-box {
                height: 260px;
            }

        }


        /* FAQ BUTTON */

        .faq-btn {
            background: #fff;
            transition: all .3s ease;
            font-weight: 600;
        }


        /* OPEN STATE */

        .accordion-button:not(.collapsed) {
            background: #658f47;
            color: #fff;
        }


        /* REMOVE DEFAULT ARROW */

        .accordion-button::after {
            display: none;
        }


        /* ICON ANIMATION */

        .faq-icon {
            transition: .3s;
        }


        /* ICON ROTATE */

        .accordion-button:not(.collapsed) .faq-icon {
            transform: rotate(45deg);
            color: #fff;
        }



.contact-section{
background:#658f47;
border-radius:20px;
color:#fff;
padding:60px 40px;
position:relative;
overflow:hidden;
}

.contact-section:before{
content:"";
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
background:url('dental-bg.jpg');
background-size:cover;
background-position:center;
opacity:.15;
}

.contact-content{
position:relative;
z-index:2;
}

.form-box{
background:#f3f5f9;
padding:40px;
border-radius:20px;
}

.form-control,
.form-select{
border-radius:30px;
padding:14px 20px;
border:none;
background:#e9edf3;
}

textarea.form-control{
border-radius:20px;
}

.btn-book{
background:#658f47;
color:#fff;
padding:14px;
border-radius:30px;
font-weight:600;
width:100%;
}

.btn-book:hover{
background:#56793c;
color:#fff;
}

.info-icon{
width:45px;
height:45px;
background:#fff;
color:#658f47;
display:flex;
align-items:center;
justify-content:center;
border-radius:50%;
}

.service-img1{
width:100%;
height:320px;
object-fit:cover;
border-radius:12px;
}

/* service buttons */

.service-btn{
border:2px solid #658f47;
border-radius:30px;
padding:10px 18px;
display:flex;
justify-content:space-between;
align-items:center;
text-decoration:none;
color:#658f47;
margin-bottom:12px;
font-weight:500;
transition:.3s;
}

.service-btn:hover{
background:#658f47;
color:#fff;
}

.service-btn.active{
background:#658f47;
color:#fff;
}

/* contact box */

.contact-box{
background:#f5f7f9;
padding:25px;
border-radius:12px;
}
  