@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;600&family=Playfair+Display:wght@400;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300..700;1,300..700&family=Raleway:ital,wght@0,100..900;1,100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Raleway:ital,wght@0,100..900;1,100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Bodoni+Moda:ital,opsz,wght@0,6..96,400..900;1,6..96,400..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Cal+Sans&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
body {
  
  margin: 0;
  padding: 0;
  background-color: #fdfdfc;
  color: #111;
  line-height: 1.6;
  
}
html{
  overflow-x: hidden;
}
.mons{
    font-family: "Montserrat", Helvetica, Arial, sans-serif;
}
.raleway{
  font-family: "Raleway", sans-serif;

}
.tcolor{
  color:#a68b4a;


  


}
.cal{
  font-family: "Cal Sans", sans-serif !important;

}
.poppins{
   font-family: "Poppins", sans-serif;
}
.cor{
    font-family: "Cormorant Garamond", serif;
}
.bod{
    font-family: "Bodoni Moda", serif;
}

.hero-bg {
    position:relative;
  background-image: 

    linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3)), 
    url('../public/images/d3.webp')  !important;
  width: 100%;
  
  height: 900px;
  background-position: center center ;
  background-repeat: no-repeat;
  background-size: cover;
}


@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;700&display=swap' );

.faq-section-container {

  /* padding: 40px 20px; */
  font-family: 'Inter', sans-serif;
}
.faq-card {
  max-width: 960px; margin: 0 auto; background-color: #ffffff;
  border-radius: 8px; padding: 32px; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}
.faq-title {
  font-size: 24px; font-weight: 700; color: #212121; margin-top: 0;
  margin-bottom: 24px; padding-bottom: 24px; border-bottom: 1px solid #eeeeee;
}
.faq-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 0 32px;
}
.accordion-item {
  border-bottom: 1px solid #eeeeee;
}
.accordion-button {
  display: flex; justify-content: space-between; align-items: center;
  width: 100%; background: none; border: none; cursor: pointer;
  padding: 16px 0; font-size: 16px; font-weight: 500; color: #333;
}
.accordion-button span {
  transition: color 0.2s ease; text-align: left;
}
.accordion-button:hover span {
  color: #FF9800;
}
.accordion-icon {
  width: 24px; height: 24px; fill: #FF9800; flex-shrink: 0;
  margin-left: 16px; transition: transform 0.3s ease;
}
.accordion-button[aria-expanded='true'] .accordion-icon {
  transform: rotate(90deg);
}
.accordion-content {
  max-height: 0; overflow: hidden; transition: max-height 0.3s ease-out;
  color: #555; font-size: 15px; line-height: 1.6;
}
.accordion-content p {
  padding-bottom: 16px;
}
@media (max-width: 768px) {
  .faq-grid { grid-template-columns: 1fr; gap: 0; }
  .accordion-item:last-child { border-bottom: none; }
}



.VIpgJd-ZVi9od-xl07Ob-lTBxed>img {
  display: none !important;
}


.t-box{
  background-image: url('../public/images/d7.webp') !important;
  background-size: cover;
  background-position: center;
  border-radius: 24px;
}





 @keyframes gradient-x {
      0%, 100% { background-position: 0% 50%; }
      50% { background-position: 100% 50%; }
    }

    .animate-gradient-x {
      background-size: 200% 200%;
      animation: gradient-x 10s ease infinite;
    }

    #dyedSliderImage,
    #dyedSliderText {
      transition: opacity 0.7s ease-in-out;
    }


    @keyframes border-slide {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

.border-gradient {
  position: absolute;
  top: -2px; left: -2px; bottom: -2px; right: -2px;
  padding: 2px; /* border thickness */
  background: linear-gradient(270deg, #a68b4a, #ffffff, #a68b4a);
  background-size: 600% 600%;
  border-radius: inherit;
  z-index: -1;
  animation: border-slide 4s linear infinite;
  pointer-events: none;
  mask: 
    linear-gradient(#fff 0 0) content-box, 
    linear-gradient(#fff 0 0);
  -webkit-mask: 
    linear-gradient(#fff 0 0) content-box, 
    linear-gradient(#fff 0 0);
  -webkit-mask-composite: destination-out;
  mask-composite: subtract;
}
/* /* 3D Text Effect for All Headings * */

/* ===== FUTURE UNIFORM IMAGE TECH SCAN EFFECT REAL ANIMATION ===== */
.uniform-scan-lines{
  pointer-events:none;
  position:absolute;
  inset:0;
  background: repeating-linear-gradient(
    to bottom,
    rgba(255,255,255,0) 0px,
    rgba(255,255,255,0) 2px,
    rgba(255,255,255,0.10) 3px,
    rgba(255,255,255,0) 6px
  );
  animation: scanMove 6s linear infinite;
  opacity:.55 !important;

}

@keyframes scanMove{
  0%{ background-position:0px 0px; }
  100%{ background-position:0px 600px; }  /* if your image is taller adjust this */
}


.fadeHero{
  animation: fadeFlash 1s ease-in-out;
}

@keyframes fadeFlash {
  0% {
    opacity: .4;
    filter: brightness(1.4);
  }
  100% {
    opacity: 1;
    filter: brightness(1);
  }
}

.VIpgJd-ZVi9od-ORHb-OEVmcd{
  display: none !important;
}
body{
  top: 0 !important;
}
.goog-te-gadget-icon{
  display: none !important;
}
.VIpgJd-ZVi9od-xl07Ob-lTBxed>span{
  font-family: "Cal Sans", sans-serif !important;
  color: #1F2937;
  font-size: 16px !important;
  font-family: 500 !important;
}

 .google_translate_element{
  border: none !important;
 }
 .goog-te-gadget-simple{
  border: none !important;
 }
 /* dropdown container */
.VIpgJd-ZVi9od-ORHb {
  background: #ffffff !important;
  border-radius: 12px !important;
  border: 1px solid rgba(0,0,0,0.15) !important;
  padding: 0px 0 !important;
  color: black !important;
  box-shadow: 0 8px 20px rgba(0,0,0,0.18) !important;
}

/* each language item */
.VIpgJd-ZVi9od-xl07Ob-lTBxed {

  font-size: 14px !important;
  font-weight: 500 !important;
  font-family: "Cal Sans", sans-serif !important;
  cursor: pointer !important;
  color: #1a1a1a !important;
  
}

/* hover */
.VIpgJd-ZVi9od-xl07Ob-lTBxed:hover {
  background: rgba(0,0,0,0.05) !important;
}

.VIpgJd-ZVi9od-xl07Ob-lTBxed:hover,
.VIpgJd-ZVi9od-xl07Ob-lTBxed:focus,
.VIpgJd-ZVi9od-xl07Ob-lTBxed:active {
  background: rgba(0,0,0,0.06) !important;   /* <- change this color to whatever you want */
  color: #1a1a1a !important;
  outline: none !important;
}
.VIpgJd-ZVi9od-xl07Ob-lTBxed.VIpgJd-ZVi9od-LgbsSe {
  background: rgba(0,0,0,0.06) !important;
}

.goog-te-combo option {
  background-color: white !important;
  color: black !important;
}
.goog-te-combo option:hover,
.goog-te-combo option:focus,
.goog-te-combo option:active {
  background-color: rgba(0,0,0,0.06) !important;
  color: #111 !important;
}


  @keyframes float {
    0%, 100% { transform: translateY(0px); }
    50% { transform: translateY(-20px); }
  }
  @keyframes float-slow {
    0%, 100% { transform: translateY(0px); }
    50% { transform: translateY(-10px); }
  }
  .animate-float { animation: float 6s ease-in-out infinite; }
  .animate-float-slow { animation: float-slow 10s ease-in-out infinite; }

/* ==================== Common Grid Items ==================== */
.gallery-item,
.dyed-gallery-item,
.kids-gallery-item {
  display: none;
  opacity: 0;
  
  transform: translateY(20px);
  transition: opacity 0.4s ease, transform 0.4s ease;
}

/* Show items when visible */
.gallery-item.visible,
.dyed-gallery-item.visible,
.kids-gallery-item.visible {
  display: block;
  opacity: 1;
  transform: translateY(0);
}

/* ==================== Deferred Images ==================== */
.deferred-img,
.dyed-deferred-img {
  opacity: 0;
  transition: opacity 0.4s ease;
}

.deferred-img.loaded,
.dyed-deferred-img.loaded {
  opacity: 1;
}

/* ==================== Card Effects ==================== */
.dyed-card,
.adult-card,
.kids-card {
  border-radius: 0.5rem;
  overflow: hidden;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.dyed-card:hover,
.adult-card:hover,
.kids-card:hover {
  transform: scale(1.05);
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.25);
}

/* Images inside cards */
.dyed-card img,
.adult-card img,
.kids-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.5s ease;
}

.dyed-card:hover img,
.adult-card:hover img,
.kids-card:hover img {
  transform: scale(1.1);
}