.modal-content{
    background: transparent;
    border-radius: 15px;
    overflow: hidden;
}

.appointment-form{
    /* background: rgba(45,28,17,.92); */
    background-color: #385119;
    padding:50px;
}

.appointment-form .form-control,
.appointment-form .form-select{
    background:transparent;
    border:none;
    border-bottom:1px solid rgba(255,255,255,.4);
    color:#fff;
    border-radius:0;
    box-shadow:none;
}

.appointment-form .form-control::placeholder{
    color:#ddd;
}

.appointment-form .form-select{
    color:#fff;
}

.appointment-form .btn{
    background:#312209;
    border:none;
    padding:12px;
    font-size:18px;
}

.btn-close{
    z-index:999;
}


/* tree section start */
/*==============================
      WHY US SECTION
==============================*/

.why-us-section{
    position:relative;
    background:#f6f1ed;
    padding:100px 0 120px;
    overflow:hidden;
}

.why-us-section .container{
    width:1400px;
    max-width:95%;
    margin:auto;
}

/*==============================
        Heading
==============================*/

.section-heading{
    text-align:center;
    margin-bottom:70px;
}

.sub-title{
    display:block;
    color:#586d3e;
    font-size:15px;
    font-weight:600;
    text-transform:uppercase;
    letter-spacing:2px;
    margin-bottom:18px;
}

.section-heading h3{
    width:900px;
    max-width:100%;
    margin:auto;
    font-size:32px;
    line-height:1.2;
    font-weight:700;
    color:#000;
    /* font-family: "Archivo", sans-serif; */
}

.section-heading h3 span{
    display:block;
}

.heading-line{
    width:1px;
    height:70px;
    background:#D8C7B4;
    margin:35px auto 0;
}

/*==============================
        Layout
==============================*/

.why-us-wrapper{
    display:grid;
    grid-template-columns:360px 1fr 360px;
    align-items:center;
    column-gap:70px;
    position:relative;
}

/*==============================
       Tree
==============================*/

.tree-center{
    position:relative;
    display:flex;
    justify-content:center;
    align-items:center;
}

.tree-center img{
    width:700px;
    max-width:100%;
    position:relative;
    z-index:5;
}

/*==============================
      Left Right
==============================*/

.left-content,
.right-content{
    display:flex;
    flex-direction:column;
    justify-content:space-between;
    height:540px;
    position:relative;
    z-index:20;
}

.left-content{
    text-align:right;
}

.right-content{
    text-align:left;
}

/*==============================
        Cards
==============================*/

.feature{
    position:relative;
}

.feature h3{
    color:#000;
    font-size:30px;
    margin-bottom:18px;
    /* font-family: "Archivo", sans-serif; */
    font-weight:500;
}

.feature p{
    color:#666;
    font-size:15px;
    line-height:1.8;
}

/*==============================
        Dots
==============================*/

.dot{
    width:11px;
    height:11px;
    background:#586d3e;
    border-radius:50%;
    position:absolute;
    top:16px;
}

.left-content .dot{
    right:-30px;
}

.right-content .dot{
    left:-30px;
}

/*==============================
      Curve Lines
==============================*/

.curve{
    position:absolute;
    width:760px;
    height:760px;
    border:2px solid rgba(190,170,145,.35);
    border-radius:50%;
    top:50%;
    transform:translateY(-50%);
    z-index:1;
}

.curve-left{
    right:53%;
    border-right:none;
}

.curve-right{
    left:53%;
    border-left:none;
}

/*==============================
     Manual Position
==============================*/

.feature-1{
    margin-top:60px;
}

.feature-2{
    margin-bottom:60px;
}

.feature-3{
    margin-top:60px;
}

.feature-4{
    margin-bottom:60px;
}

/* tree section end */

/* tree section Start Responsive CSS */

/*==========================================
        LARGE DEVICES (1200px)
==========================================*/

@media (max-width:1200px){

.why-us-section .container{
    width:95%;
}

.why-us-wrapper{
    grid-template-columns:320px 1fr 320px;
    gap:40px;
}

.tree-center img{
    width:560px;
}

.curve{
    width:620px;
    height:620px;
}

.section-heading h3{
    font-size:46px;
}

.feature h3{
    font-size:26px;
}

}


/*==========================================
        TABLET (991px)
==========================================*/

@media (max-width:991px){

.why-us-section{
    padding:80px 0;
}

.section-heading{
    margin-bottom:50px;
}

.section-heading h3{
    font-size:38px;
    line-height:1.3;
}

.heading-line{
    height:50px;
}

.why-us-wrapper{

    display:flex;
    flex-direction:column;
    align-items:center;
    gap:50px;

}

.tree-center{
    order:1;
}

.left-content{
    order:2;
}

.right-content{
    order:3;
}

.tree-center img{
    width:420px;
}

.left-content,
.right-content{

    width:100%;
    height:auto;

    display:flex;
    flex-direction:column;
    gap:40px;

    text-align:center;

}

.feature{
    padding:0;
    margin:0 !important;
}

.dot{
    display:none;
}

.curve{
    display:none;
}

.feature h3{
    font-size:28px;
}

}


/*==========================================
        MOBILE (767px)
==========================================*/

@media (max-width:767px){

.why-us-section{

    padding:70px 0;

}

.section-heading h3{

    font-size:32px;

}

.sub-title{

    font-size:13px;

}

.tree-center img{

    width:280px;

}

.left-content,
.right-content{

    gap:30px;

}

.feature h3{

    font-size:24px;

    margin-bottom:10px;

}

.feature p{

    font-size:15px;
    line-height:1.8;

}

}


/*==========================================
        SMALL MOBILE (575px)
==========================================*/

@media (max-width:575px){

.why-us-section{

    padding:60px 15px;

}

.section-heading{

    margin-bottom:40px;

}

.section-heading h3{

    font-size:28px;

}

.heading-line{

    height:40px;

}

.tree-center img{

    width:220px;

}

.feature h3{

    font-size:22px;

}

.feature p{

    font-size:14px;

}

}


/*==========================================
        EXTRA SMALL (400px)
==========================================*/

@media (max-width:400px){

.section-heading h3{

    font-size:24px;

}

.tree-center img{

    width:180px;

}

.feature h3{

    font-size:20px;

}

.feature p{

    font-size:13px;

    line-height:1.7;

}

}

/* tree section end Responsive CSS */
.ayur-banner-section{
    position:relative;
    width:100%;
    padding:116px 0 103px;
    margin-bottom:207px;
    /* overflow:hidden; */
    background:#000;
}

/* Video */

.banner-video{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:900px;
    z-index:0;
}

.banner-video video{
    width:100%;
    height:100%;
    object-fit:cover;
}
/* Dark Overlay */

 .banner-video::before{
    content:"";
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:900px;
    background:rgba(0, 0, 0, 0.40);
    z-index:1;
} 

/* Content 

/* .ayur-banner-section .container{
    position:relative;
    z-index:2;
}*/

 /* .ayur-ban-leaf{
    position:relative;
    z-index:2;
}  */

@media (max-width: 767px) {
    .ayur-why-btn {
        display: none;
    }
}

.ayur-tpro-img{
    position: relative;
    overflow: hidden;
    border-radius: 10px;
}

.ayur-tpro-img img{
    width: 100%;
    display: block;
    transition: .4s ease;
}

.therapy-section{
    /* background:#fffef7; */
}

.therapy-banner{
    border-radius:30px;
    overflow:hidden;
}

.therapy-banner img{
    width:100%;
    height:320px;
    object-fit:cover;
    display:block;
}

.therapy-item{
    text-align:center;
    margin-bottom:40px;
}

.therapy-item h4{
    /* display:flex; */
    justify-content:center;
    align-items:center;
    gap:10px;
    font-size:30px;
    color:#5e6d36;
    margin-bottom:15px;
    font-family:'Sanzkina';
}

.therapy-item h4 img{
    width:28px;
}

.therapy-item p{
    max-width:850px;
    margin:auto;
    font-size:16px;
    line-height:1.8;
    color:#4a4a4a;
    font-family:'Poppins';
}

.ayur-heading-wrap h3{
    font-size:40px;
    color:#5e6d36;
    margin-bottom:35px;
}

/* .service-section{
    display:none;
    padding:60px 0;
    animation:fade .4s ease;
}

.service-title{
    text-align:center;
    font-size:48px;
    color:#6b7340;
    margin-bottom:30px;
}

.service-banner{
    width:100%;
    max-width:1000px;
    height:350px;
    object-fit:cover;
    display:block;
    margin:auto;
    border-radius:25px;
}

.therapy-box{
    text-align:center;
    margin-top:40px;
}

.therapy-box h3{
    color:#6b7340;
    font-size:42px;
    margin-bottom:10px;
}

.therapy-box p{
    max-width:800px;
    margin:auto;
    line-height:1.8;
    font-size:18px;
}

@keyframes fade{

from{
opacity:0;
transform:translateY(30px);
}

to{
opacity:1;
transform:translateY(0);
}

} */
 .serviceslist{
    display:none;
    padding-top: 70px;
 }

 .ayur-btn2{
  min-width: 145px;
  max-width: 100%;
  border-radius: 22px;
  /* background-color: var(--ayur-primary-color); */
  border: white 1px solid;
  min-height: 45px;
  /* border: 1px solid #c46200; */
  font-size: 16px;
  color: var(--ayur-white-color);
  font-weight: 500;
  text-align: center;
  text-transform: capitalize;
  display: inline-block;
  padding: 9px 0;
  position: relative;
  overflow: hidden;
  z-index: 1;
  transition: box-shadow 0.5s;
  /* font-family: "Inter", sans-serif; */
  overflow: hidden;
  transition: all .3s linear;
}
.ayur-btn2::after {
  position: absolute;
  content: '';
  display: block;
  top: 50%;
  left: 50%;
  bottom: 0;
  width: 100%;
  height: 0%;
  border-radius: 15px;

  z-index: -1;
  transition: all .6s ease;
  transform: translate(-50%, -50%) rotate(-45deg);
}