body {
      font-family: 'Figtree', sans-serif;
}
:root{
    --primery: #E6CD7F;
    --secondery: #1d1d1d;
    --l-dark:#404040 ;
    --gray: #757575;
    --dark-yellow: #E4B522;
}
.bg-yellow-1{
    background-color: #FFFCF2;
}
.color-yellow{
  color: var(--primery);
}
.color-dark{
  color: var(--secondery);
}
/* Navbar Default - Transparent */
.navbar {
  transition: background-color 0.3s, padding 0.3s;
  background: transparent !important;
  transition: 0.2s;
}
.swiper-slide {
  transition-timing-function: ease-in-out !important;
}

.section-head .head{
  font-size:36px;
  font-weight:700;
  margin:10px 0;
  color: var(--secondery);
}

.navbar.scrolled {
  background: #fff !important;
  box-shadow: 1;
  transition: 0.2s;
  box-shadow: 4px 4px 18px rgba(0, 0, 0, 0.02);
}
.navbar-brand img{
    height: 62px;
    width: auto;
    object-fit: contain;
    transition: 0.2s;

}
.navbar.scrolled .navbar-brand img{
    height: 48px;
    transition: 0.2s;
}
.nav-button{
    background-color: var(--primery);
    color: var(--secondery);
    border: none;
    outline: none;
    box-shadow: none;
    font-size: 18px;
    font-weight: 500;
    padding: 8px 18px;
    border-radius: 4px;
}
.nav-button a{
  color: var(--secondery);
  text-decoration: none;
}
.nav-link{
    font-size: 16px;
    color: var(--secondery);
    font-weight: 600;
    transition: 0.2s;
}
.nav-link:hover{
    color: var(--primery);
    transition: 0.2s;
}
.primery-button{
    border: none;
    outline: none;
    box-shadow: none;
    padding: 0;
    background-color: transparent;
    margin: 0;
}

.primery-button a{
    background-color: var(--primery);
    color: var(--l-dark);
    border: none;
    outline: none;
    box-shadow: none;
    font-size: 18px;
    font-weight: 500;
    padding: 12px 18px;
    border-radius: 4px;
    text-decoration: none;
    display: inline-block;
    transition: 0.2s;
}
.primery-button a:hover{
    background-color: var(--l-dark);
    color: #fff;
    transition: 0.2s;
}

.secondary-button{
    border: none;
    outline: none;
    box-shadow: none;
    padding: 0;
    background-color: transparent;
    margin: 0;
}
.secondary-button a{
    background-color: var(--primery);
    color: var(--l-dark);
    border: none;
    outline: none;
    box-shadow: none;
    font-size: 18px;
    font-weight: 500;
    padding: 12px 18px;
    border-radius: 4px;
    text-decoration: none;
    display: inline-block;
    transition: 0.2s;
}
.secondary-button a:hover{
    background-color: var(--l-dark);
    color: #fff;
    transition: 0.2s;
}
/* .scrolled .nav-link{
    color: #fff;
} */
.hero-secation{
    width: 100%;
    height: max-content;
    overflow: hidden;
}
.banner-content-cont{
    width: 100%;
    height: auto;
    min-height: 650px;
    position: absolute;
    left: 0;
    top: calc(45px - -50%);
    transform: translateY(-50%);
    display: flex;
    align-items: end;
    justify-content: left;
}
.banner-content-cont .banner-content{
    padding-bottom: 8%;
   
}
.banner-content-cont .banner-content h2{
    font-size: 92px;
    color: var(--secondery);
    font-weight: normal;
    line-height: 0.9;
}
.banner-content-cont .banner-content p{
    font-size: 18px;
    color: var(--gray);
    font-weight: 400;
}
.hero-secation img.bg-ds{
    width: 100%;
    height: 100vh;
    min-height: 750px;
    object-fit: cover;
    position: relative;
  animation: zoomEffect 2s ease-in-out infinite alternate;
  object-position: top;
}

@keyframes zoomEffect {
  0% {
    transform: translateX(0px);
    transform: translateY(0px);
  }
  100% {
    transform: translateX(20px);
    transform: translateY(-8px);
  }
}

.sub-head{
    font-weight: 400;
    color: var(--dark-yellow);
    font-size: 24px;
    margin: 0;
    text-transform: capitalize;
}
.sub-head span{
    color: var(--primery);
}
.head{
    font-size: 58px;
    color: var(--secondery);
    font-weight: 400;
}

.description{
    font-size: 18px;
    color: var(--gray);
    font-weight: 400;
}

@media(max-width: 992px){
    
    .head{
        font-size: 34px;
    }
    .sub-head{
        font-size: 18px;
    }
    .descrption{
        font-size: 14px;
    }
    .banner-content-cont .banner-content p{
        font-size: 16px;
    }
}
.booking-cta{
    padding: 36px 26px;
    box-shadow: 0 3px 40px #e6cc7f5e;
    border-radius: 6px;
}
.booking-cta {
  padding: 36px 26px;
  border-radius: 6px;
  animation: glow 3s ease-in-out infinite;
}

@keyframes glow {
  0%, 100% { box-shadow: 0 3px 40px #e6cc7f5e; }
  50% { box-shadow: 0 6px 50px #fff; }
}
.bg-dark{
    background-color: var(--secondery);
}
.listing-service{
    
    border-radius: 6px;
    
    display: inline-block;
    text-decoration: none;
    transition: 0.2s;
    transform: scale(1);
}
.listing-service p{
    font-size: 18px;
    margin: 0;
    font-weight: 600;
    color: var(--secondery);
    margin-top: 6px;
}
.listing-service img{
    width: 100%;
    border-radius: 60px;
    transition: 0.2s;
    transform: scale(1);

}
.listing-service:hover{
    transition: 0.2s;
    transform: scale(0.95);

}

.listing-service:hover.listing-service img{
    transform: scale(1.03);
    transition: 0.2s;
}

.sf-anim{
  animation: float 4s ease-in-out infinite;
}

@keyframes float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-10px); }
}
.bg-gray-d{
    background-color: #FAFAFA;
}
.testimonia-card{
    /* margin: 16px; */
    display: flex;
    flex-direction: column;
    gap: 26px;
}
.testimonia-card p{
    font-size: 18px;
    color: var(--secondery);
    text-align: left;
    flex: auto;
}
.testimonia-card .tetsi-profile{
    text-align: right;
    display: flex;
    gap: 8px;
    align-items: center;
    justify-content: end;
}
.testimonia-card .tetsi-profile img{
    width: 48px;
    height: 48px;
    object-fit: cover;
    border-radius: 50%;
}
.testimonia-card .tetsi-profile{
    font-size: 20px;
    color: var(--l-dark);
    font-weight: 600;
}
.swiper-horizontal>.swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal, .swiper-pagination-custom, .swiper-pagination-fraction{
    bottom: 0px;
}
.swiper-pagination-bullet-active{
    background-color: var(--primery);
}

.insta-frame {
  position: relative;
  width: 100%;
  padding-bottom: 120%; /* 9:16 ratio for reel */
  overflow: hidden;
}

.insta-frame iframe {
  position: absolute;
  top: -60px; /* shift to hide top profile section */
  left: 0;
  width: 100%;
  height: calc(100% + 100px); /* extend height to cover cropping */
  border: 0;
}
footer{
    background-color: #000;
    padding: 85px 0;
}
.social-lis-container{
    list-style-type: none;
    display: flex;
    padding: 0;
    gap: 18px;
}
.social-lis-container li a{
    text-decoration: none;
    width: 46px;
    height: 46px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #fff;
    transition: 0.2s;
    
}
.social-lis-container li a svg{
    width: 24px;
    height: 24px;
    color: var(--secondery);
}
.social-lis-container li a:hover{
    background-color: #E6CD7F;
    transition: 0.2s;
}
.links-footer{
    list-style-type: none;
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding-left: 0;
}

.links-footer li.hd{
    font-size: 22px;
    color: #fff;
}
.links-footer li a{
    color: #A9A9A9;
    text-decoration: none;
    transition: 0.2s;
    font-size: 16px;
    display: block;

}
.links-footer li a:hover{
    color: #E6CD7F;
    transition: 0.2s;
}
.bottom-footer{
    background-color: #1d1d1d;
    padding: 12px 0;
}
.bottom-footer p{
    color: #D8D8D8;
    font-size: 14px;
    margin: 0;
}
.bottom-footer p a img{
    height: 14px;
    object-fit: contain;
}
.bottom-footer p a{
    transform: translateY(0px);
    transition: 0.2s;
}
.bottom-footer p a:hover{
    transform: translateY(-4px);
    transition: 0.2s;
}
.navbar-toggler-icon{
    filter: brightness(10);
    
}
.navbar-toggler{
border-color: #fff;

}
@media(max-width:992px){
    .navbar:has(.navbar-collapse.collapse.show){
        background: #fff !important;
        transition: 0s !important;
        padding: 18px 0;
        box-shadow: 4px 4px 14px #dddddd57;
    }
}
@media (min-width: 992px) {
    .navbar-expand-lg .navbar-nav {
        gap: 14px;
    }
    .navbar-expand-lg .navbar-collapse{
        justify-content: flex-end;
    }
}
.banner-content-cont .banner-serv-layout img{
    width: 100%;
    height: 110px;
    border-radius: 70px;
    object-fit: cover;
    transition:all linear 0.2s;
    transform: skewY(0deg);
}
.banner-content-cont .banner-serv-layout img:hover{
    transition:all linear 0.2s;
    transform: skewY(10deg);
}
.all-service-btn {
  position: relative;
  font-size: 20px;
  color: #1E1E1E;
  font-weight: 500;
  text-decoration: none;
  padding-bottom: 6px;
}

.all-service-btn::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 2px;
  background-color: #D9BC64; /* Light Gold */
  transition: 0.3s ease-in-out;
}

.all-service-btn:hover {
  color: #D9BC64;
  transition: 0.3s ease-in-out;

}




.all-service-btn i {
  width: 20px;
  height: 20px;
  stroke-width: 2.2;
  transition: transform 0.3s ease;
}

.all-service-btn:hover i {
  transform: translateX(4px);
}
.hero-rds{
        transform: scale(1.3) translateX(-12%);
        position: relative;
    z-index: -1;

}
.rating-score {
  font-size: 28px;
  font-weight: 600;
  color: #1E1E1E;
}

.rating-divider {
  width: 1px;
  height: 38px;
  background-color: #CFCFCF;
}

.stars {
object-fit: contain;

  height: 28px;
}

.reviews {
  color: #666666;
  font-size: 14px;
  margin-top: 2px;
  display: block;
}


/* Titles & Text */


.opening-hour {
  font-size: 16px;
  font-weight: 700;
  color: #1D1D1D;
}

/* Form Box Design */
.booking-box {
  background: #FFFFFF;
  border-radius: 16px;
  box-shadow: 0 8px 30px rgba(0,0,0,0.05);
  max-width: 1100px;
  margin: auto;
}

.form-label {
  font-size: 14px;
  color: #555;
  font-weight: 600;
}

.form-control {
  height: 38px;
  border-radius: 6px;
  border: 1px solid #D7D7D7;
}


.booking-box {
  position: relative;
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.05);
  max-width: 1100px;
  margin: auto;
  padding: 40px 30px;
  overflow: visible;
}

/* Left Leaf */
.booking-box::before {
  content: "";
  position: absolute;
  left: -35px;
  bottom: 20px;
  width: 80px;
  height: 80px;
  background-image: url("../image/enq/leaf.webp");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  z-index: -1;
}

/* Right Leaf */
.booking-box::after {
  content: "";
  position: absolute;
  right: -35px;
  top: -35px;
  width: 80px;
  height: 80px;
  transform: rotateZ('angle');
  background-image: url("../image/enq/leaf-2.webp");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  z-index: -1;
}
.appointment-section{
    background: linear-gradient(148deg, #FFFFFF 10%, #fffdf5 100%,#FFFCF2 100%);
    overflow: hidden;
}

.services-section {
  position: relative;
  z-index: 0;
  overflow: hidden;
}

/* LEFT leaf */
.services-section::before {
  content: "";
  position: absolute;
  bottom: -30px;
  left: -80px;
  width: 232px;
  height: 232px;
  background-image: url("../image/enq/leaf-shadow.webp"); /* Ensure this path is correct */
  background-size: contain;
  background-repeat: no-repeat;
transform: scale(-1); /* Mirror */
  z-index: -1;
}

/* RIGHT leaf */
.services-section::after {
  content: "";
  position: absolute;
  top: -30px;
  right: -120px;
  width: 360px;
  height: 360px;
  background-image: url("../image/enq/leaf-shadow.webp"); /* Same image */
  background-size: contain;
  background-repeat: no-repeat;

  
  z-index: -1;
}

/* ===========================
   Pricing Section Styling
=========================== */
.pricing-section {
  position: relative;
  padding: 90px 0;
  background: linear-gradient(90deg, #fff 0%, #fdf4df 100%);
  z-index: 1;
  overflow: hidden;
}

/* Center content */
.pricing-section .container {
  max-width: 1000px;
}


/* Wrapper for 2-column price area */
.pricing-wrapper {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  gap: 40px;
  margin-bottom: 40px;
}

/* Each pricing list block */
.pricing-box {
  width: 100%;
  max-width: 380px;
  overflow: hidden;
  text-align: left;
  
}

/* Category title */
.pricing-category {
  font-size: 20px;
  font-weight: 700;
  margin-bottom: 18px;
  color: #1E1E1E;
}

/* List style */
.pricing-box ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.pricing-box ul li {
  display: flex;
  justify-content: space-between;
  padding: 10px 0;
  font-size: 16px;
  border-bottom: 1px solid #eee;
}

.pricing-box ul li span {
  color: #1E1E1E;
}

.pricing-box ul li strong {
  color: #000;
  font-weight: 600;
}

/* Divider line */
.divider-line {
  width: 2px;
  background: #f1f1f1;
  height: auto;
  min-height: 220px;
}

/* View More Button */
.btn-view {
  display: inline-block;
  padding: 12px 32px;
  background: var(--secondery);
  color: #fff;
  border-radius: 6px;
  font-size: 16px;
  text-decoration: none;
  font-weight: 600;
  transition: .3s;
}

.btn-view:hover {
  background: var(--primery);
}

/* ===========================
   Responsive
=========================== */
@media (max-width: 992px) {
  .pricing-wrapper {
    flex-direction: column;
    align-items: center;
  }

  .divider-line {
    display: none;
  }
}

@media (max-width: 576px) {
  .head {
    font-size: 32px;
  }

  .pricing-category {
    text-align: center;
  }

  .pricing-box ul li {
    font-size: 14px;
  }
}


/* ===========================
   Leaf background (OPTIONAL)
   Enable when needed
=========================== */

.pricing-section::before,
.pricing-section::after {
  content: "";
  position: absolute;
  background: url('../image/enq/leaf-shadow.webp') no-repeat;
  background-size: contain;
  z-index: -1;
transform: scaleY(-1); /* Mirror */
  
}
.pricing-section::after {
  right: -60px;
  bottom: 0;
  width: 250px;
  height: 250px;
}
.testimonial-section {
    padding: 100px 0;
    position: relative;
    overflow: hidden;
}

.sub-title {
    color: #FCBC12;
    font-size: 18px;
    margin-bottom: 10px;
}



/* Testimonial Slider */
.testimonial-item {
    background: transparent;
    padding: 20px 0;
}

.testimonial-item p {
    font-size: 18px;
    line-height: 1.6;
    color: #1e1e1e;
}

.quote-icon {
    font-size: 40px;
    color: #FCBC12;
    margin-bottom: 10px;
}

.testimonial-author {
    display: flex;
    align-items: center;
    margin-top: 20px;
}

.testimonial-author img {
    width: 45px;
    height: 45px;
    border-radius: 50%;
    margin-right: 10px;
}

.testimonial-author span {
    font-size: 16px;
    font-weight: 600;
    color: #1e1e1e;
}

/* Right Side Image */
.testimonial-image-wrap {
    position: relative;
}

.testimonial-img {
    width: 100%;
    max-width: 400px;
}

/* Swiper Controls Styling */
.swiper-button-next,
.swiper-button-prev {
    background: #fff;
    border-radius: 50%;
    width: 45px;
    height: 45px;
    border: 1px solid #DEDEDE;
    background-color: #fff;
    color: var(--secondery);
    left: auto;
}

.swiper-button-next:after,
.swiper-button-prev:after {
    font-size: 16px;
    color: #1e1e1e;
}

.swiper-pagination-bullet {
    width: 10px;
    height: 10px;
    background: #ddd;
}

.swiper-pagination-bullet-active {
    background: var(--dark-yellow);
}

/* Responsive */
@media (max-width: 992px) {
    .head {
        font-size: 32px;
    }
    .testimonial-img {
        margin-top: 40px;
    }
}
.click-buton-container{
  display: flex;
  height: 48px;
  gap: 22px;
  width: 100%;
  justify-content: center;
}
.click-buton-container .swiper-button-prev,.click-buton-container .swiper-button-next{
  position: relative;
  position: 0;
}
.chanfe{
  position: relative;
}
.bg-yellow-2-gri{
   background: linear-gradient(155deg, #FFFFFF 10%, #fffbeb 100%, #FFFCF2 100%);}
.shouts-sd{
  position: relative;
  z-index: 0;
  overflow: hidden;
}
.shouts-sd::before {
    content: "";
    position: absolute;
    top: -30px;
    right: -80px;
    width: 240px;
    height: 240px;
    background-image: url(../image/enq/leaf-shadow.webp);
    background-size: contain;
    background-repeat: no-repeat;
    /* transform: scale(-1); */
    z-index: -1;
}
@media(max-width: 1200px){
  .nav-button{
    font-size: 16px;
  }
  .hero-rds{
    transform: scale(1.2) translateX(-7%) translateY(12%);
  }
  .banner-content-cont{
    min-height: max-content;
  }
}
@media(max-width: 992px){
  .navbar-toggler-icon {
    filter: brightness(0);
  }
  .navbar-toggler {
    border-color: #404040;
  }
}
@media(max-width: 768px){
  .navbar-brand img{
    height: 50px;
  }
  .banner-content-cont .banner-serv-layout img{
        height: 65px;
    border-radius: 22px;
  }
  .booking-box{
    margin: 40px;
  }
}
@media(max-width: 576px){
  .hero-secation img.bg-ds{
        height: 100%;
        position: relative;
  }
}

@media(max-width: 768px){
 
 .hero-rds{
     transform: scale(1) translateX(-20%) translateY(0%);
  }
   .banner-content-cont{
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    transform: perspective(0);
    padding: 90px 0;
  }
  .hero-secation img.bg-ds{
    /* min-height: 900px;
    height: 100vh; */
    position: absolute;
  }
  .image-box img{
    padding: 0 40px;
    transform: translateX(10px);
  }
  .pricing-section{
    padding: 45px 0;
  }
}
.about-hero{
  position: relative;
  overflow: hidden;
  z-index: 0;
  padding-top: 140px;
  padding-bottom: 60px;
  background: linear-gradient(1deg, #fff 0%, #fef8ea 100%);
}
.about-hero::before{
  content: "";
    position: absolute;
    top: -30px;
    right: -80px;
    width: 240px;
    height: 240px;
    background-image: url(../image/enq/leaf-shadow.webp);
    background-size: contain;
    background-repeat: no-repeat;
    /* transform: scale(-1); */
    z-index: -1;
}
.stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 30px;
  margin-top: 30px;
}

.stat .count {
  font-size: 38px;
  font-weight: 400;
  color: var(--secondery);
}

.stat small {
  display: block;
  color: var(--gray);
  font-weight: 600;
  margin-top: 4px;
  font-size: 14px;
}

@media (max-width: 991px) {
  .stats {
    grid-template-columns: repeat(2, 1fr);
  }
}
.bg-left-bottom-leaf{
  position: relative;
  overflow: hidden;
  z-index: 0;
}
.bg-left-bottom-leaf::before{
  content: "";
    position: absolute;
    bottom: 0px;
    left: -80px;
    width: 300px;
    height: 300px;
    background-image: url(../image/enq/leaf-shadow.webp);
    background-size: contain;
    background-repeat: no-repeat;
    transform: scale(-1);
    z-index: -1;
}
.bg-right-bottom-leaf{
  position: relative;
  overflow: hidden;
  z-index: 0;
}
.bg-right-bottom-leaf::after{
  content: "";
    position: absolute;
    bottom: -10px;
    right: -80px;
    width: 240px;
    height: 240px;
    background-image: url(../image/enq/leaf-shadow.webp);
    background-size: contain;
    background-repeat: no-repeat;
    transform: scaleY(-1);
    z-index: -1;
}
.bg-right-top-leaf{
  position: relative;
  overflow: hidden;
  z-index: 0;
}
.bg-right-top-leaf::after{
  content: "";
    position: absolute;
    top: -10px;
    right: -80px;
    width: 260px;
    height: 260px;
    background-image: url(../image/enq/leaf-shadow.webp);
    background-size: contain;
    background-repeat: no-repeat;
    /* transform: scaleY(-1); */
    z-index: -1;
}

.bg-left-top-leaf{
  position: relative;
  overflow: hidden;
  z-index: 0;
}
.bg-left-top-leaf::before{
  content: "";
    position: absolute;
    top: -20px; 
    left: -80px;
    width: 220px;
    height: 220px;
    background-image: url(../image/enq/leaf-shadow.webp);
    background-size: contain;
    background-repeat: no-repeat;
    transform: scaleX(-1);
    z-index: -1;
}
@media(max-width:768px){
  .bg-right-bottom-leaf.bg-left-bottom-leaf::before{
    display: none;
  }
  .bg-right-top-leaf.bg-left-top-leaf::after{
    display: none;
  }
}
@media(max-width:568px){
  .about-brwz img{
    transform: translateX(-6%);
  }
  .about-hero{
    padding-bottom: 20px;
  }
}
.vision-mission{
  position: relative;
  padding: 90px 0;
  background: linear-gradient(180deg, #fff 0%, #fff9f1 100%);
  z-index: 1;
  overflow: hidden;
}

.team-card {
  border-radius: 2px;
  overflow: hidden;
  background: #fff;
  border: 1px solid #f0f0f0;
  transition: transform .3s ease;
}

.team-card:hover {
  transform: translateY(-6px);
}

.team-card img {
  width: 100%;
  height: 370px;
  object-fit: cover;
}
@media(max-width: 1200px){
  .team-card img {
  height: 280px;
  }
}
@media(max-width: 575px){
  .team-card img {
  height: 50vw;
  }
}

.team-info {
  padding: 14px 16px;
  border-top: 1px solid #eee;
}

.team-info h6 {
  margin: 0;
  font-weight: 600;
}

.team-info span {
  font-size: 13px;
  color: var(--dark-yellow); /* accent */
}
.testimonia-about-3 .testimonia-card{
  background-color: #fff;
  padding: 16px;
  border-radius: 12px;
}
.brownz-services-container .head{
      font-size: 28px;
      font-weight: 600;
}
.brownz-services-container .sub-head{
  font-size: 18px;
}
.brownz-services-container .description{
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.brownz-services-container button.secondary-button a{
  font-size: 14px;
  font-weight: 600;
  padding: 6px 12px;
}

.brownz-services-container .service-cate-img{
  width: 100%;
  object-fit: cover;
  aspect-ratio: 1;
  position: relative;
  z-index: 1;
  border-radius: 18px;
}
.brownz-services-container .image-box::before{
  content: "";
    position: absolute;
        bottom: -10px;
    left: -42px;
    width: 60%;
    height: 60%;
    background-image: url(../image/enq/leaf.webp);
    background-size: contain;
    background-repeat: no-repeat;
    /* transform: scaleX(-1); */
    z-index: 3;
}
.row-services-container{
  row-gap: 140px;
}
@media(max-width:768px){
  .row-services-container{
  row-gap: 40px;
}
.brownz-services-container .image-box img{
  padding: 0;
  transform: translateX(0px);
}
}


.shorts-section{
  padding:60px 0;
}

/* .swiper{
  padding-left:40px;
} */

.short-card{
  position:relative;
  aspect-ratio:9/16;
  border-radius:20px;
  overflow:hidden;
  background:#000;
  cursor:pointer;
}

.short-card img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center top;
}

.play-btn{
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:60px;
  color:#fff;
  background:rgba(0,0,0,.25);
  transition:.3s;
  display: none;
}

.short-card:hover .play-btn{
  background:rgba(0,0,0,.45);
}

.image-container-sevice{
  overflow: hidden;
  border-radius: 16px;
}

.service-cate-img{
  transition: transform .5s ease, filter .5s ease;
}

/* hover time-il effect */
.image-container-sevice.is-hovered .service-cate-img{
  transform: scale(1.08);
  filter: brightness(0.85);
}

.branch-tabs .nav-link{
  background:#fff;
  border:1px solid var(--primery);
  padding:10px 28px;
  border-radius:6px;
  color:#1d1d1d;
  margin:0 6px;
}

.branch-tabs .nav-link.active{
  background:var(--primery);
  color:#fff;
  border-color:var(--primery);
}

.visit-section{ 
  /* background:#faf6ef; */
  padding:100px 0;
}

.info-item{
  display:flex;
  gap:15px;
  margin-bottom:18px;
}

.info-item span:first-child{
  width:42px;
  height:42px;
  background:var(--primery);
  color:var(--secondery);
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
}

.map-wrapper iframe{
  width:100%;
  height:380px;
  border-radius:12px;
  border:0;
      filter: grayscale(1);
      transition: 0.2s;
}
.map-wrapper iframe:hover{
  filter: grayscale(0);
      transition: 0.2s;
}
.brach-information{
  padding: 12px;
  background-color: #fff;
  box-shadow: 4px 4px 12px #777777;
}
.info-title{
  color: var(--l-dark);
  font-weight: 600;
  font-size: 24px;
  margin-bottom: 20px;
 }
 .info-item{
  align-items: center;
 }
 .info-item a{
  color: var(--l-dark);
  text-decoration: none;
  font-weight: 500;
  transition: 0.2s;
 }
  .info-item a:hover{
    color: var(--dark-yellow);
    transition: 0.2s;
  }
  .info-item svg{
    width: 18px;
    color: var(--secondery);
  }
      .pricing-card{
      background:#fff;
      border-radius:18px;
      padding:30px;
      height:100%;
      box-shadow:0 10px 30px rgba(0,0,0,0.05);
      transition:.3s;
      position: relative;
      z-index: 2;
    }
    .pricing-card:hover{
      transform:translateY(-5px);
    }
    .pricing-card h5{
      margin-bottom:20px;
    }
    .price-row{
      display:flex;
      justify-content:space-between;
      padding:10px 0;
      border-bottom:1px dashed #eee;
    }
    .price-row:last-child{
      border-bottom:none;
    }
    .price-row .price{
      color:var(--dark-yellow);
      font-weight:500;
    }
    .note{
      font-size:13px;
      color:#777;
    }
@media (max-width:991px){
  .nav-link{
    padding: 18px 14px;
    font-size: 16px;
    border-bottom:1px solid #eee;
  } 
}
.shopnav .navbar-brand img{
  height: 42px;
}

.shopnav .navbar-nav .nav-link{
  color: #fff;
}
.shopnav.navbar.scrolled{
  background-color: var(--secondery) !important;
  top: 0;
   padding-top: 12px;
  padding-bottom: 12px;
}
.shopnav.navbar.scrolled .navbar-brand img{
  height: 38px;
      transition: 0.2s;
}
.small-header-marquee{
  background-color: #fff;
  color: var(--l-dark);
  font-size: 14px;
  font-weight: 600;
  width: 100%;
  padding: 6px 0;
}
.shopnav.fixed-top{
  top: 33px;
}


.shopnav .nav-link{
  font-weight:500;
  color:#222;
  padding:10px 15px;
}

.shopnav .nav-link:hover{
  color:var(--primery); /* brownz gold */
}

/* Search */
.search-box{
  position:relative;
}

.search-box input{
  border: none;
  border-radius:30px;
  padding:8px 40px 8px 15px;
  width:240px;
  font-size:14px;
}
.search-box input::after,.search-box input:active,.search-box input:focus,.search-box input:focus-visible{
  box-shadow: none;
  border: none;
  outline: none;
}

.search-box i{
  position:absolute;
  right:15px;
  top:50%;
  transform:translateY(-50%);
  color:#888;
}

/* Icons */
.shop-icons i{
  font-size:18px;
}

.cart-count{
  position:absolute;
  top:-3px;
  right:-8px;
  background:var(--primery);
  color:var(--secondery);
  font-size:10px;
  padding:2px 6px;
  border-radius:50%;
}

.icon-btn{
  background:none;
  border:none;
  font-size:18px;
  position:relative;
}


.cart-item img{
  width:60px;
  height:60px;
  object-fit:cover;
  border-radius:8px;
}

.remove-btn{
  background:none;
  border:none;
  color:#c0392b;
  font-size:13px;
  padding:0;
}

.shopnav .dropdown-menu{
  border-radius:4px;
  border: none;
  box-shadow:0 10px 30px rgba(0,0,0,0.1);
}
.shopnav .dropdown-item{
  color: var(--secondery);
}


.shop-hero-slider{
  background:linear-gradient(1deg, #fff 0%, #fef8ea 100%);
  margin-top: 61px;
}

.hero-slide{
  padding:140px 0;
      background-repeat: no-repeat;
    background-size: cover;
        background-position: right;
}

.hero-tag{
  display:inline-block;
  font-size:16px;
  margin-bottom:14px;
  font-weight: 600;
  color: var(--secondery);
}

.hero-slide h1{
  font-size:54px;
  font-weight:400;
  line-height:1.1;
  color: var(--secondery);
}

.hero-slide h1 span{
  color:var(--primery);
}

.hero-slide p{
  font-size:17px;
  color:#555;
  max-width:460px;
  margin:18px 0 28px;
}

.hero-btn{
  background:var(--secondery);
  color:#fff;
  padding:12px 30px;
  border-radius:30px;
  text-decoration:none;
  transition: 0.2s;
}
.hero-btn:hover{
  background:var(--primery);
  transition: 0.2s;

}

.hero-img{
  max-width:90%;
  border-radius:30px;
  box-shadow:0 30px 60px rgba(0,0,0,0.15);
}

/* Pagination dots */
.heroSwiper .swiper-pagination-bullet{
  background:var(--primery);
  opacity:0.3;
}
.heroSwiper .swiper-pagination-bullet-active{
  opacity:1;
}

@media(max-width:768px){
  .hero-slide{
    padding:110px 0 60px;
    text-align:center;
  }
  .hero-slide h1{
    font-size:28px;
    font-weight: 600;
    color: var(--secondery);
  }
  .hero-slide p{
    margin-left:auto;
    margin-right:auto;
    font-size: 14px;
  }
}

.best-seller-section{
  padding:90px 0;
  background:#fff;
}

.section-head .sub-head{
  font-size:13px;
  text-transform:uppercase;
  letter-spacing:1px;
  color:#888;
  
}



.section-head .description{
  max-width:520px;
  margin:0 auto;
  color:#666;
}

/* Product Card */
.product-card{
  /* border-radius:18px; */
  background:#fafafa;
  overflow:hidden;
  transition:.3s;
  height: 100%;
  display: flex;
  flex-direction: column;
}

.product-card:hover{
  transform:translateY(-6px);
}

.product-img{
  position:relative;
  background:#fff;
  padding:6px;
  border: 1px solid #eee;
  border-bottom: 0;
}

.product-img img{
  width:100%;
  height:240px;
  object-fit:contain;
}

.product-img .badge{
  position:absolute;
  top:15px;
  left:15px;
  background:var(--secondery);
  color:#fff;
  font-size:11px;
  padding:5px 10px;
  border-radius:20px;
}

.product-info{
  padding:18px;
  height: 100%;
  display: flex;
  flex-direction: column;
      justify-content: space-between;
}

.product-info h6{
  font-weight:600;
  margin-bottom:4px;
}

.product-info p{
  font-size:13px;
  color:#777;
  margin-bottom:12px;
}

.price-row{
  display:flex;
  justify-content:space-between;
  align-items:center;
}

.price{
  font-weight:600;
}

.btn-cart{
  background:#000;
  color:#fff;
  padding:6px 16px;
  border-radius:20px;
  font-size:13px;
  text-decoration:none;
  transition: 0.2s;

}
.btn-cart:hover{
  background-color: var(--primery);
  transition: 0.2s;
}

.view-all-btn{
  display:inline-block;
  padding:12px 30px;
  border-radius:30px;
  border:1px solid var(--secondery);
  text-decoration:none;
  color:var(--secondery);
}


.shop-categories{
  padding:90px 0;
  /* background:#fafafa; */
}

.category-card{
  position:relative;
  display:block;
  border-radius:20px;
  overflow:hidden;
  height:260px;
}

.category-card img{
  width:100%;
  height:100%;
  object-fit:cover;
  transition:.4s;
}

.category-card:hover img{
  transform:scale(1.08);
}

.category-card::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(to top,rgba(0,0,0,.6),transparent);
  z-index:1;
}

.category-content{
  position:absolute;
  bottom:20px;
  left:20px;
  z-index:2;
  color:#fff;
}

.category-content h5{
  margin-bottom:4px;
}
.category-content span{
  font-size:13px;
  opacity:.9;
}

.offer-banner{
  padding:100px 0;
  background-size:cover;
  background-position:center;
  position:relative;
  color:#fff;
}

.offer-banner::before{
  content:'';
  position:absolute;
  inset:0;
  background:rgba(0,0,0,.45);
}

.offer-banner .container{
  position:relative;
  z-index:2;
}

.offer-tag{
  display:inline-block;
  background:#ffffff36;
  color:#fff;
  padding:6px 14px;
  border-radius:30px;
  font-size:13px;
  margin-bottom:15px;
}

.offer-banner h2{
  font-size:46px;
  font-weight:700;
}

.offer-banner p{
  font-size:18px;
  opacity:.9;
  margin:15px 0 30px;
}

.offer-btn{
  padding:15px 38px;
  background:var(--primery);
  color:var(--secondery);
  border-radius:40px;
  text-decoration:none;
}

.brands-section{
  padding:80px 0;
  background:#f8f8f8;
}

.section-head h2{
  font-size:36px;
  font-weight:700;
}

.section-head p{
  color:#777;
}

.brand-card{
  background:#fff;
  border-radius:16px;
  padding:25px;
  height:120px;
  display:flex;
  align-items:center;
  justify-content:center;
  transition:.3s;
}

.brand-card img{
  max-height:60px;
  max-width:100%;
  filter:grayscale(100%);
  opacity:.7;
}

.brand-card:hover img{
  filter:none;
  opacity:1;
}

.brand-card:hover{
  transform:translateY(-6px);
}
footer img{
  height: 48px;
  object-fit: contain;
}
.shopnav.navbar:has(.navbar-collapse.collapse.show){
  background: var(--secondery) !important;
  padding-top: 12px;
  padding-bottom: 12px;
}
.shopnav{
  background-color: #1D1D1D !important;
}
.shopnav .icon-btn{
 color: #fff;
}
@media(max-width: 1200px){
  .shopnav .navbar-brand img{
    height: 36px;
  }
}
.shopnav .navbar-toggler{
  border-color: #fff !important;
  padding: 0.25rem 0;
}
.shopnav .navbar-toggler-icon{
  filter: brightness(1000);
}
@media(max-width: 579px){
  .shopnav .navbar-brand img{
    height: 1.2rem;
  }
  .shopnav.navbar.scrolled .navbar-brand img{
    height: 1.1rem;
  }
  .navbar-toggler-icon{
    width: 1.2rem;
    height: 1.2rem;
  }
  .shopnav .navbar-brand{
    margin: 0;
    padding: 0;
  }
  .shopnav .icon-btn{
    font-size: 1rem;
  }
}
.custom-toggler {
  border: none;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

/* stroke thickness change here */
.custom-toggler span {
  width: 22px;
  height: 2px; /* increase = thicker */
  background: #fff;
  display: block;
  border-radius: 5px;
}
@media(max-width: 1200px){
  .shop-hero-slider{
    margin-top: 55px;
  }
}
@media(max-width: 768px){
  .shop-hero-slider{
    margin-top: 39px;
  }
  .hero-slide{
  position: relative;
  min-height: 500px;
  display: flex;
  align-items: center;
  overflow: hidden;
}

.hero-slide{
  padding: 60px 0 60px;
}

/* blur layer */
.hero-slide::before{
  content:"";
  position:absolute;
  inset:0;
  background: inherit; /* same background */
  /* filter: blur(5px); */
  transform: scale(1.1);
   /* edge cut avoid */
  z-index:0;
}

/* dark overlay (optional but recommended) */
.hero-slide::after{
  content:"";
  position:absolute;
  inset:0;
  /* background: rgba(255, 255, 255, 0.25); */
  z-index:1;
}

/* text always top */
.hero-content{
  position: relative;
  z-index: 2;
  color: #fff;
}
.best-seller-section{
  padding: 28px 0;
}
.shop-categories{
  padding: 28px 0;
}
.section-head .head{
  font-size: 28px;
          margin: 6px 0;
}
.section-head .sub-head{
  font-size: 12px;
  font-weight: 500;
}
.description{
  font-size: 14px;
}
.product-img{
  padding: 8px;
}
.product-info{
  padding: 8px;
}
.product-info p{
  margin-bottom: 0;
}
.custom-gap{
    --bs-gutter-x: 8px;
    --bs-gutter-y: 8px;
  }
  .product-info h6{
    font-size: 14px;
  }
  .category-card{
    border-radius: 12px;
  }
  .category-content{
    left: 12px;
  }
  .category-content h5{
    font-size: 16px;
    margin-bottom: 0;
  }
  .category-content span{
      font-size: 12px;
      display: block;
  }
  .btn-view{
    padding: 8px 32px;
  }
  .offer-banner h2{
    font-size: 28px;
    margin-bottom: 0;
  }
  .offer-banner p{
    font-size: 14px;
    margin-top: 4px;
  }
  .brands-section{
    padding: 28px 0;
  }
  .brand-card{
    padding: 10px;
  }
  footer img{
  height: 48px;
  object-fit: contain;
}
.links-footer li.hd{
  font-size: 16px;
  font-weight: 600;
}
.links-footer li a{
  font-size: 14px;
}
.social-lis-container li a{
  width: 32px;
    height: 32px;
}
.social-lis-container li a svg{
      width: 20px;
    height: 20px;
    color: #1d1d1d;
}
footer{
  padding: 32px 12px;
}
.bottom-footer p{
  font-size: 12px;
}
.bottom-footer p a img{
  height: 12px;
}
}

.search-box{
  position:relative;
}

.search-results{
  position:absolute;
  top:100%;
  left:0;
  width:100%;
  background:#fff;
  border-radius:10px;
  box-shadow:0 10px 20px rgba(0,0,0,0.1);
  display:none;
  z-index:999;
}

.search-results div{
  padding:10px 15px;
  cursor:pointer;
}

.search-results div:hover{
  background:#f5f5f5;
}


/* full sscren search  */
.search-item{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:12px 18px;
  border-bottom:1px solid #eee;
  cursor:pointer;
}

.search-item:hover{
  background:#f6f6f6;
}

.search-left{
  display:flex;
  gap:12px;
  align-items:center;
}

.search-count{
  color:#888;
  font-size:14px;
}
.search-mobail-offcan .offcanvas-header{
  /* max-width: 579px; */
  width: 100%;
  margin: 0 auto;
  background-color: #f5f5f6;
  gap: 8px;
}
.text-dark{
  color: #1D1D1D !important;
}
.text-yellow{
  color: var(--dark-yellow) !important;
}



/* tabs  */
/* ---------- TABS ---------- */
.shop-tabs{
  display:flex;
  gap:10px;
  overflow-x:auto;
  white-space:nowrap;
  padding:10px;
  border-bottom:1px solid #eee;
}

.shop-tabs::-webkit-scrollbar{display:none;}

.shop-tabs button{
  border:1px solid #ddd;
  background:#fff;
  padding:4px 14px;
  border-radius:50px;
  cursor:pointer;
  font-size: 16px;
  color: #404040;
}

.shop-tabs button.active{
  background:#000;
  color:#fff;
}

.nav-bottom-sticky-containers{
  top: 71px;
}

.shop-topbar{
  display:flex;
  justify-content:space-between;
  align-items:center;
  flex-wrap: wrap;
  padding:0 0;
}

/* breadcrumb */
.breadcrumb-text{
  font-size:14px;
  color:#666;
}

.breadcrumb-text a{
  font-size:14px;
  color:#1d1d1d;
  text-decoration: none;
  transition: 0.2s;
}
.breadcrumb-text a:hover{
  color: var(--dark-yellow);
  transition: 0.2s;
}

.breadcrumb-text span{
  margin:0 6px;
  color:#aaa;
}

/* sort */
/* container */
.custom-select{
  position:relative;
  width:180px;
  font-size:14px;
}

/* trigger */
.select-trigger{
  border:1px solid #ddd;
  padding:6px 14px;
  border-radius:8px;
  cursor:pointer;
  display:flex;
  justify-content:space-between;
  align-items:center;
  background:#fff;
}

/* dropdown */
.select-options{
  position:absolute;
  top:110%;
  left:0;
  width:100%;
  border:1px solid #eee;
  background:#fff;
  border-radius:8px;
  box-shadow:0 10px 25px rgba(0,0,0,.08);
  display:none;
  overflow:hidden;
  z-index:1021;
}

/* show dropdown */
.custom-select.active .select-options{
  display:block;
}

/* option */
.option{
  padding:10px 14px;
  cursor:pointer;
}

.option:hover{
  background:#f5f5f5;
}

@media(max-width: 579px){
  .nav-bottom-sticky-containers {
    top: 54px;
  }
  .shop-tabs button{
    font-size: 14px;
  }
}
.nav-link.active{
  font-weight: 800;
  color: var(--primery) !important;
}




/* ---------- ZOOM ---------- */
.zoom-wrapper{
  position:relative;
  overflow:hidden;
  border-radius:10px;
  cursor:zoom-in;
  border: 1px solid #f7f7f7;
}

.zoom-wrapper img{
  width:100%;
  transition:transform .15s ease;
  touch-action:none;
}

/* ---------- THUMB ---------- */
.thumb-slider img{
  height:80px;
  object-fit:cover;
  cursor:pointer;
  border-radius:8px;
    border: 1px solid #f7f7f7;
}

/* remove arrows */
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button{
  -webkit-appearance:none;
  margin:0;
}

input[type=number]{
  -moz-appearance:textfield;
}

/* ---------- FULLSCREEN ---------- */
.gallery-modal{
  position:fixed;
  inset:0;
  background:#000;
  z-index:9999;
  display:none;
  justify-content:center;
  align-items:center;
}

.gallery-modal.active{
  display:flex;
}

.gallery-modal img{
  max-width:95%;
  max-height:95%;
}

.close-gallery{
  position:absolute;
  top:20px;
  right:30px;
  color:#fff;
  font-size:30px;
  cursor:pointer;
}

.qty-box{
  display:flex;
  align-items:center;
  border:1px solid #ddd;
  border-radius:8px;
  overflow:hidden;
}

.qty-box input{
  width:60px;
  text-align:center;
  border:none;
  outline:none;
}

.qty-btn{
  width:40px;
  height:40px;
  border:none;
  background:#f5f5f5;
  font-size:18px;
}

.qty-btn:hover{
  background:#eaeaea;
}

.qty-box{
  display:flex;
  align-items:center;
  border:1px solid #ddd;
  border-radius:8px;
  overflow:hidden;
}

.qty-box input{
  width:60px;
  text-align:center;
  border:none;
  outline:none;
}

.qty-btn{
  width:40px;
  height:40px;
  border:none;
  background:#f5f5f5;
  font-size:18px;
}

.qty-btn:hover{
  background:#eaeaea;
}

.product-link{
  text-decoration:none;
  color:inherit;
  display:block;
  position: relative;
}
.bg-gray{
  background-color: #fafafa;
}

.info-card {
  background: #fff;
  border-radius: 12px;
  padding: 24px 12px;
  text-align: center;
  transition: 0.3s;
  border: 1px solid #eee;
  height: 100%;
}

.info-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 10px 25px rgba(0,0,0,0.08);
}

.info-icon {
  font-size: 22px;
  margin-bottom: 15px;
  color: #a3a3a3;
}

.info-title {
  font-weight: 600;
  margin-bottom: 3px;
  font-size: 18px;
}

.info-text {
  color: #777;
  font-size: 14px;
}


.custom-cart{
  width:380px;
}

.cart-item{
  display:flex;
  gap:12px;
  padding:20px 20px;
  border-bottom: 1px solid #e2e2e2;
}

.cart-item img{
  width:70px;
  height:70px;
  object-fit:cover;
  border-radius:10px;
  border: 1px solid #e2e2e2;
}

.cart-info{
  flex:1;
}

.cart-title{
  font-size:14px;
  font-weight:600;
  margin-bottom:5px;
}

.cart-price{
  font-size:13px;
  color:#666;
}

/* qty */
.qty-box.cart .qty-control{
  display:flex;
  align-items:center;
  border:1px solid #ddd;
  border-radius:8px;
  width:95px;
  margin-top:6px;
}
.qty-box.cart{
  display: inline-flex;
}
.qty-box.cart input{
    width: 40px;
}

.qty-box.cart button{
     width: 28px;
    height: 28px;
    border: none;
    background: #f5f5f5;
    font-size: 18px;
}

.qty-box.cart .qty-control span{
  flex:1;
  text-align:center;
}

/* remove */
.remove-item{
  font-size:14px;
  color:#ff5858;
  cursor:pointer;
}

/* section */
.checkout-box{
  background:white;
  border-radius:12px;
  padding:0 10px;
  /* box-shadow:0 5px 15px rgba(0,0,0,0.05); */
}

/* order item */
.order-item{
  display:flex;
  justify-content:space-between;
  margin-bottom:12px;
}

/* place order button */
.place-btn{
  width:100%;
  background:#000;
  color:white;
  padding:14px;
  border:none;
  border-radius:8px;
  font-weight:600;
}

.place-btn:hover{
  background:#222;
}

@media(min-width:992px){
.checkout-sticky{
position:sticky;
top:20px;
}
}

.saved-address-box{
  padding:10px;
}

/* radio container */
.custom-radio{
  display:flex;
  align-items:flex-start;
  gap:15px;
  border:1px solid #eee;
  padding:15px;
  border-radius:10px;
  margin-bottom:15px;
  cursor:pointer;
  transition:.2s;
}

/* hide default radio */
.custom-radio input{
  display:none;
}

/* radio circle */
.radio-mark{
  width:20px;
  height:20px;
  border:2px solid #999;
  border-radius:50%;
  margin-top:4px;
  position:relative;
  flex-shrink:0;
}

/* active dot */
.radio-mark::after{
  content:"";
  width:10px;
  height:10px;
  background:#000;
  border-radius:50%;
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%) scale(0);
  transition:.2s;
}

/* checked state */
.custom-radio input:checked + .radio-mark{
  border-color:#000;
}

.custom-radio input:checked + .radio-mark::after{
  transform:translate(-50%,-50%) scale(1);
}

/* hover */
.custom-radio:hover{
  border-color:#000;
  background:#fafafa;
}

.address-content{
  font-size:14px;
}
.modal-content.brow-s .btn-close{
  background: none;}


.address-card{
  position:relative;
  display:flex;
  gap:12px;
  align-items:flex-start;
  border:1px solid #eee;
  border-radius:10px;
  padding:16px;
  margin-bottom:12px;
  cursor:pointer;
}

/* right side buttons */
.address-actions{
  display:flex;
  gap:12px;
  
    justify-content: flex-end;
}

.edit-btn,
.delete-btn{
  border:none;
  background:none;
  font-size:13px;
  font-weight:600;
  cursor:pointer;
}

.edit-btn{
  color:var(--dark-yellow);
}

.delete-btn{
  color:#dc3545;
}

.edit-btn:hover{
  text-decoration:underline;
}

.delete-btn:hover{
  text-decoration:underline;
}


.payment-option{
  display:block;
  cursor:pointer;
  margin-bottom:12px;
}

.payment-option input{
  display:none;
}

.payment-box{
  border:1px solid #ddd;
  padding:14px;
  border-radius:10px;
  transition:.2s;
}

.payment-option input:checked + .payment-box{
  border:2px solid #1D1D1D;
  background:#f8f8f8;
}

.payment-box small{
  display:block;
  color:#777;
}

.payment-fields{
  display:none;
  margin-bottom:15px;
  margin-top:-5px;
}

.success-box{
  max-width:500px;
  margin:auto;
  padding:40px;
  border-radius:12px;
  background:#fff;
  box-shadow:0 5px 20px rgba(0,0,0,.08);
  text-align:center;
}

.success-icon{
  font-size:60px;
  color:green;
}




@keyframes fadePage{
  to{opacity:1;}
}

/* success card */
.success-box{
  max-width:500px;
  margin:auto;
  padding:40px;
  border-radius:16px;
  background:#fff;
  box-shadow:0 10px 30px rgba(0,0,0,.08);
  text-align:center;
  transform:scale(.9);
  animation:cardPop .5s ease forwards .2s;
}

@keyframes cardPop{
  to{transform:scale(1);}
}

/* tick circle */
.success-icon{
  width:80px;
  height:80px;
  border-radius:50%;
  background:#22c55e;
  margin:auto;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  font-size:40px;
  transform:scale(0);
  animation:tickPop .5s ease forwards .5s;
}

@keyframes tickPop{
  0%{transform:scale(0)}
  60%{transform:scale(1.2)}
  100%{transform:scale(1)}
}

/* text fade */
.fade-item{
  opacity:0;
  transform:translateY(10px);
  animation:textFade .5s ease forwards;
}

.fade-item:nth-child(2){animation-delay:.8s}
.fade-item:nth-child(3){animation-delay:1s}
.fade-item:nth-child(4){animation-delay:1.2s}

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


.order-card{
  border:1px solid #eee;
  border-radius:14px;
  padding:20px;
  margin-bottom:20px;
  background:#fff;
}

/* header */
.order-header{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:15px;
}

/* status badge */
.status-badge{
  padding:6px 12px;
  border-radius:20px;
  font-size:13px;
  font-weight:600;
}

.processing{
  background:#fff3cd;
  color:#856404;
}

.delivered{
  background:#d4edda;
  color:#155724;
}

/* product row */
.order-product{
  display:flex;
  align-items:center;
  gap:15px;
  margin-bottom:12px;
}

.order-product img{
  width:70px;
  height:70px;
  object-fit:cover;
  border-radius:8px;
  border: 1px solid #ccc;
}

/* progress */
.order-progress{
  display:flex;
  justify-content:space-between;
  margin:20px 0;
}

.step{
  flex:1;
  text-align:center;
  font-size:12px;
  padding:8px;
  border-bottom:3px solid #ddd;
}

.step.active{
  border-color:var(--dark-yellow);
  font-weight:600;
}

/* footer */
.order-footer{
  display:flex;
  justify-content:space-between;
  align-items:center;
  flex-wrap:wrap;
  gap:10px;
}
.order-actions{
  display: flex;
  gap: 8px;
}
@media(max-width: 579px){
  .order-actions{
    gap: 2px;
  }
  .respo-title h3{
    font-size: 16px;
  }
  .respo-title>button{
    font-size: 16px !important;
  }
}


/* container */
.tracking-box{
background:white;
border-radius:10px;
padding:20px;
box-shadow:0px 4px 18px #ededed;
}

/* timeline */
.timeline{
border-left:3px solid #ddd;
padding-left:20px;;
margin-left: 14px;
position:relative;
}

.timeline-step{
position:relative;
margin-bottom:30px;
}

.timeline-step::before{
content:"";
position:absolute;
left:-28px;
top:0;
width:14px;
height:14px;
border-radius:50%;
background:#ddd;
}

.timeline-step.active::before{
background:#2874f0;
}

.timeline-step.completed::before{
background:#388e3c;
}

.timeline-time{
font-size:13px;
color:#777;
}

.tracking-box .o-product-img{
width:70px;
height: 70px;
border-radius:8px;
border: 1px solid #e9e9e9;
}
.dropdown-item.active, .dropdown-item:active{
  background-color: #fffdf5 !important;
}


/* layout */
.profile-box{
background:white;
border-radius:12px;
padding:25px;
}

/* sidebar */
.profile-sidebar a{
display:block;
padding:8px 0px;
border-radius:8px;
color:#333;
text-decoration:none;
margin-bottom:8px;
font-weight:500;
}
.profile-sidebar a:last-child{
  margin-bottom: 0;
}
.profile-sidebar{
  padding: 12px 16px;
}
.profile-sidebar a:hover{
background:#f5f5f5;
}

.profile-sidebar a.active{
background:black;
color:white;
}

/* profile avatar */
.avatar{
width:90px;
height:90px;
border-radius:50%;
object-fit:cover;
}

/* info card */
.info-box{
border:1px solid #eee;
border-radius:10px;
padding:15px;
margin-bottom:15px;
}
@media(max-width: 579px){
  .profile-box{
    padding: 14px;
  }
  .avatar{
        width: 70px;
    height: 70px;
  }
  .profile-box h4{
    font-size: 18px;
  }
 
}
@media(max-width: 991px){
 .info-box{
    padding: 8px 0;
    padding-top: 0;
    border: none;
  }
}

.form-check-input:checked{
  background-color:var(--dark-yellow);
  border-color:var(--dark-yellow);
}

.form-check-input:focus{
  box-shadow:0 0 0 .2rem rgba(23,123,114,.25);
}
.product-action-container{
  position: absolute;
  left: 14px;
  top: 14px;
  z-index: 999;
  color: #155724;
  border: none;
  background-color: none;
}
.product-action-container button{
  color: var(--l-dark);
  border: none;
  font-size: 20px;
  background: none;
  transition: 0.2s;
}
.product-action-container button:hover{
  color: var(--gray);
  transition: 0.2s;

}
.login-cta{
  padding-top: 10px;
  padding-bottom: 16px;
   border-bottom: 1px solid #dee2e6;
}
.login-cta:hover{
  background-color: #fff;
}
.login-cta p{
  font-size: 14px;
  margin: 0;
  color: var(--gray);
  line-height: 1.4;
  font-weight: 400;
 
}
.login-cta p span{
  font-size: 18px;
  font-weight: 700;
  color: #1D1D1D;
}
.login-cta a.btn{
  font-size: 14px;
  width: 100%;
    padding: 4px 12px !important;
    margin-top: 8px;
    text-transform:capitalize;
}
.btn-primary{
  background-color: var(--dark-yellow);
  border-color: var(--dark-yellow);
}
@media(max-width: 1199px){
  .navbar-expand-lg .navbar-nav{
    gap: 2px;
  }
  .nav-link{font-size: 14px;}
}










.hero{
padding:100px 0;
text-align:center;
background:#fff;
}

.hero h1{
font-weight:700;
}

.section{
padding:80px 0;
}

.course-card{
background:#fff;
padding:30px;
border-radius:12px;
box-shadow:0 10px 30px rgba(0,0,0,0.05);
height:100%;
transform: translateY(0px);
transition: 0.3s;

}
.course-card .course-icon{
  height: 60px;
  margin-bottom: 22px;
  margin-left: auto;
  margin-right: auto;
  object-fit: contain;
}
.course-card ul{
  padding-left: 18px;
}
.course-card ul li{
    color: #6b6b6b;
}

.course-card h5{
font-weight:600;
}

.btn-gold{
background:#d4af37;
border:none;
color:#fff;
}

.btn-gold:hover{
background:#b8962e;
}

@media (min-width: 992px) {

.navbar .dropdown:hover .dropdown-menu {
display: block;
margin-top: 0;
}
}
.academy-hero{
  background-image: url(../image/banner/acas.webp);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  height: calc(80vh - 78px);
margin-top: 78px;
position: relative;
animation: bannerZoom 8s ease-in-out infinite alternate;
}
@keyframes bannerZoom{
0%{
background-size:100%;
}
100%{
background-size:108%;
}
}
@media (max-width: 992px) {
  .academy-hero{
  animation: none;
  }
}
.nav-acadenmy{
  background-color: #fff !important;
}
.nav-acadenmy .navbar-brand img{
  height: 52px;
}
.academy-hero::after{
  content: "";
  width: 100%;
  height: 100%;
  background-color: #00000093;
  position: absolute;
  left: 0;
  top: 0;
}
.why-academy .icon{
font-size:35px;
color:var(--primery);
display:block;
}
@media (max-width: 547px){
  .booking-box{
    margin: 0;
  }
  .section{
    padding: 24px 0;
  }
}
.course-card .course-button{
  padding: 8px 14px;
  font-weight: 600;
  background-color: var(--primery);
  color: #fff;
  opacity: 0;
    bottom: -30px;
    transition: 0.3s;
    position: relative;
    text-decoration: none;
    display: inline-block;
    border-radius: 12px;
}
.course-card .course-button:hover{
  background-color: var(--secondery);
  transition: 0.2s;
}
.course-card ul{
 padding-left: 0;
 list-style-type: none;
}
.course-card ul li i{
  font-size: 12px;
  color: var(--primery);
}
.course-card ul li{
  display: flex;
  align-items: center;
  gap: 8px;
}
.course-card:hover{
  transform: translateY(-10px);
  transition: 0.3s;
}
@media(min-width: 768px){
  .course-card:hover .course-button{
    opacity: 1;
    bottom: 0px;
    transition: 0.3s;
 position: relative;
 box-shadow:0 8px 24px rgba(0,0,0,0.03);
  }
}
@media(max-width: 768px){
  .course-card .course-button{
    opacity: 1;
    bottom: 0px;
  }
}
.nav-acadenmy .dropdown-menu .dropdown-item{
  border-bottom: 1px solid #f7f7f7;
  padding: 8px 10px;
}
.nav-acadenmy .dropdown-menu{
 border: none;
 box-shadow: -1px 4px 8px rgba(0, 0, 0, 0.2);
}
.nav-acadenmy .dropdown-menu .dropdown-item:hover{
  background-color: #e6cc7f1f;
}
.nav-acadenmy .dropdown-menu li:last-child .dropdown-item{
  border-bottom: 0;
}

.nav-link.dropdown-toggle.show{
  border-bottom: none;
}
.nav-acadenmy .dropdown-menu .dropdown-item img{
  height: 16px;
  object-fit: contain;
}
@media(max-width: 992px){
  .nav-acadenmy .dropdown-menu{
    padding: 0;
    box-shadow: none;
  }
  .nav-link.dropdown-toggle.show{
    padding-bottom: 6px;
  }
}
@media(max-width: 1399px){
  .banner-content-cont .banner-content h2{
    font-size: 76px;
  }
}


@media(max-width: 992px){
    .banner-content-cont .banner-content h2{
        font-size: 48px;
    }
  }

.course-title{
font-size:32px;
font-weight:700;
}

/* COURSE CARD */

.course-card{
background:#fff;
padding:18px;
border-radius:12px;
box-shadow:0 5px 20px rgba(0,0,0,0.08);
position:sticky;
top:100px;
}

.course-price{
font-size:28px;
font-weight:700;
color:var(--primery);
}

.btn-enroll{
background:var(--primery);
color:#fff;
width:100%;
padding:10px;
border-radius:8px;
}
.btn-enroll:hover{
  background:var(--secondery);
color:#fff;
}
.feature-list li{
margin-bottom:8px;
font-size:14px;
}

/* TABS */

.nav-tabs .nav-link{
color:#333;
font-weight:500;
}

.nav-tabs .nav-link.active{
border-bottom:3px solid var(--primery);
}


.testimonia .swiper-slide{
height:auto;
display:flex;
}

/* @media (max-width: 567px){
  .navbar-brand.fw-bold.text-primary{
    display: none ;
  }
} */
*.text-primary{
  color: var(--primery) !important;
}


#galleryModal{
position:fixed;
inset:0;
background:rgba(0,0,0,0.9);
display:flex;
align-items:center;
justify-content:center;
z-index:9999;
opacity:0;
visibility:hidden;
transition:.3s;
}

#galleryModal.active{
opacity:1;
visibility:visible;
}

#galleryModal img{
max-width:95%;
max-height:90vh;
transition:transform .2s;
}

.close-gallery{
position:absolute;
top:25px;
right:30px;
font-size:35px;
color:#fff;
cursor:pointer;
}

.branch-tabs.sdddssd .nav-link{
  color: var(--secondery) !important;
}








/* .colour-section{
background:#000;
color:#fff;
padding:60px 0;
} */

.colour-section .table-responsive{
  background-color: #fff; padding: 18px;
  border-radius: 12px;
  box-shadow: 0 10px 30px rgba(0,0,0,0.05);
  height: calc(100% - 27px);
  z-index: 2;
  position: relative;
}
.colour-section .title{
text-align:center;
color:#f4c542;
margin-bottom:40px;
}

.colour-section .table-title{

color:var(--secondery);
display:inline-block;
padding:4px 12px;
font-size:16px;
font-weight: 700;
margin-bottom:10px;
}

.colour-section .price-table{
width:100%;
border-collapse:collapse;
font-size:14px;
}

.colour-section .price-table th{
color:var(--dark-yellow);
text-align:right;
padding:8px 0;
font-size: 15px;
border-bottom:1px solid #d8d8d8;
}

.colour-section .price-table th:first-child{
text-align:left;
}

.colour-section .price-table td{
padding:8px 0;
border-bottom:1px dotted #eee;
text-align:right;
}

.colour-section .price-table td:first-child{
text-align:left;
}

body.menu-open::before{
content:"";
position:fixed;
inset:0;
background:rgba(0,0,0,0.4);
z-index:998;
}


.bg-fist-p{
  background-image:linear-gradient( #fef8ea, #fffdf8);
}
.bg-second-p{
 background-image:linear-gradient( #fffdf8, #fef8ea);
}
.bg-fist-p{position: relative;}

.bg-fist-p::after {
        content: "";
    position: absolute;
    top: -30px;
    right: -120px;
    width: 360px;
    height: 360px;
    background-image: url(../image/enq/leaf-shadow.webp);
    background-size: contain;
    background-repeat: no-repeat;
}
.bg-second-p{
  position: relative;
}
.bg-second-p::after {
    content: "";
    position: absolute;
    bottom: -30px;
    left: -80px;
    width: 232px;
    height: 232px;
    background-image: url(../image/enq/leaf-shadow.webp);
    background-size: contain;
    background-repeat: no-repeat;
    transform: scale(-1);
    z-index: 1;
}
.bg-fist{
  background-image:linear-gradient( #fef8ea, #fffdf8);
}

@media(max-width: 768px){
   .bg-fist-p::after {
       
    right: -50px;
    width: 140px;
    height: 140px;

  }
  .bg-second-p::after {
     left: -100px;
    width: 142px;
    height: 142px;
  }
 
}