/* ===== Silk Aroma Typography ===== */

/* ============================= */
/* CO HEADLINE */
/* ============================= */

@font-face {
  font-family: "CoHeadline";
  src: url("../fonts/Co Headline Bold.otf") format("opentype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "CoHeadline";
  src: url("../fonts/Co Headline Light.otf") format("opentype");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

/* ============================= */
/* SEBINO */
/* ============================= */

@font-face {
  font-family: "Sebino";
  src: url("../fonts/Sebino-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Sebino";
  src: url("../fonts/sebino-medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Sebino";
  src: url("../fonts/sebino-bold.ttf") format("truetype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

/* ================= BASE ================= */
.main__logo--img{
    width: 184px;
    height: auto;
}

.slider__layer--img.style2 {
    width: 100%;
    height: auto;
    object-fit: cover;
}
.video-wrapper {
    position: absolute;
    inset: 0;
    overflow: hidden;
    z-index: 2;
}

.video-wrapper video {
    width: 100%;
    height: 100%;
    object-fit: cover;

    mix-blend-mode: screen;
}
/* ================= HERO IMAGE ANIMATION ================= */

/* Make thumbnail relative */



.luxury-steam{
    position:absolute;

    /* anchor slightly right of center (nozzle position) */
    left: 55%;
    top: 0;

    transform: translateX(20%);

    width: 12%;
    height: 45%;

    pointer-events:none;
    z-index:20;
}

.luxury-steam svg{
    width:100%;
    height:100%;
}

/* Base style */
.steam-path{
    fill:none;
    stroke:white;
    stroke-linecap:round;
    stroke-dasharray:400;
    stroke-dashoffset:400;
    animation: steamLuxury 8s ease-in-out infinite;
}

/* Strong center stream */
.strong{
    stroke-width:3;
    filter:blur(3px);
    opacity:0.9;
}

/* Soft side layers */
.soft{
    stroke-width:5;
    filter:blur(8px);
    opacity:0.5;
}

.left{ animation-delay:1.5s; }
.right{ animation-delay:3s; }

/* Wide background mist */
.wide{
    stroke-width:8;
    filter:blur(14px);
    opacity:0.25;
    animation-delay:4s;
}

/* Top fade dispersion */
.fade-top{
    stroke-width:6;
    filter:blur(10px);
    opacity:0.2;
    animation-delay:5.5s;
}

/* Soft background mist layer */
.diffuser-wrapper {
  position: relative;
  display: inline-block;
}

/* Steam must start exactly at nozzle */
.steam-diffusion {
  position: absolute;
  bottom: 30%;   /* adjust slightly based on your image */
  left: 50%;
  transform: translateX(-50%);
  width: 140px;
  height: 280px;
  pointer-events: none;
  z-index: 5;
}

.steam-diffusion svg {
  width: 100%;
  height: 100%;
}

.fog {
  fill: none;
  stroke: white;
  stroke-linecap: round;
  opacity: 0.4;
  filter: blur(12px);
  animation: fogRise 7s ease-in-out infinite;
}

/* Different thickness */
.fog1 { stroke-width: 8; animation-delay: 0s; }
.fog2 { stroke-width: 10; animation-delay: 1s; }
.fog3 { stroke-width: 12; animation-delay: 2s; }
.fog4 { stroke-width: 6; animation-delay: 3s; }
.fog5 { stroke-width: 9; animation-delay: 4s; }

@keyframes fogRise {
  0% {
    transform: translateY(0) scale(1);
    opacity: 0.5;
  }
  50% {
    transform: translateY(-40px) scale(1.15);
    opacity: 0.35;
  }
  100% {
    transform: translateY(-90px) scale(1.3);
    opacity: 0;
  }
}
.diffuser-wrapper {
    position: relative;
    display: inline-block;
}
/* Base steam style */
.steam {
    fill: none;
    stroke: white;
    stroke-linecap: round;
    opacity: 0.6;
    animation: floatSteam 6s ease-in-out infinite;
}

/* Strong center */
.strong {
    stroke-width: 3;
    filter: blur(3px);
    opacity: 0.9;
}

/* Soft layers */
.soft {
    stroke-width: 5;
    filter: blur(8px);
    opacity: 0.5;
}

/* Wide mist */
.wide {
    stroke-width: 8;
    filter: blur(14px);
    opacity: 0.3;
}

/* Slight delay for natural randomness */
.left { animation-delay: 1s; }
.right { animation-delay: 2s; }

/* Floating Animation */
@keyframes floatSteam {
    0% {
        transform: translateY(0) scale(1);
        opacity: 0.6;
    }
    50% {
        transform: translateY(-25px) scale(1.05);
        opacity: 0.4;
    }
    100% {
        transform: translateY(-50px) scale(1.1);
        opacity: 0;
    }
}
/* diffusion breathing effect */
@keyframes diffusionFade{
    0%{ opacity:0.3; transform:translateX(-50%) scale(0.9); }
    50%{ opacity:0.6; transform:translateX(-50%) scale(1.1); }
    100%{ opacity:0.3; transform:translateX(-50%) scale(0.9); }
}

/* Animation */
@keyframes steamLuxury{

    0%{
        stroke-dashoffset:400;
        opacity:0;
        transform:translateX(0);
    }

    15%{
        opacity:0.8;
    }

    40%{
        stroke-dashoffset:200;
        transform:translateX(-2px);
        opacity:0.7;
    }

    65%{
        stroke-dashoffset:0;
        transform:translateX(2px);
        opacity:0.4;
    }

    100%{
        stroke-dashoffset:-200;
        opacity:0;
        transform:translateX(0);
    }
}

@media (max-width: 768px){

    .luxury-steam{
        width: 14%;
        height: 38%;

        left: 50%;
        transform: translateX(15%);
        top: 2%;
    }

}
/* ================= WHY SECTION ================= */

/* ============================= */
/* WHY SECTION FONTS */
/* ============================= */

/* Heading → Co Headline */
.why-section h2,
.why-section .card h3 {
  font-family: "Co Headline", sans-serif;
}

/* Paragraphs → Sebino */
.why-section p {
  font-family: "Sebino", sans-serif;
}

/* Optional: subtitle slightly lighter */
.why-section .subtitle {
  font-family: "Sebino", sans-serif;
  font-weight: 400;
}
.why-heading {
  text-align: center;
  margin-bottom: 20px;
}

.why-heading h2 {
  margin-bottom: 12px;
  letter-spacing: 4px;
}

.why-underline {
  width: 140px;
  height: auto;
  display: block;
  margin: 0 auto;
  transition: 0.4s ease;
}
.why-section{
  padding: 90px 0 140px;
  text-align: center;
  position: relative;
  overflow: hidden;

  background: #ABE3E4;
}

/* Soft glow bottom effect */
.why-section::after{
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 200px;
  background: linear-gradient(
    to top,
    rgba(156, 184, 204, 0.35),
    rgba(156, 184, 204, 0)
  );
  pointer-events: none;
}

/* ================= HEADINGS ================= */

.why-section h2{
  font-size:34px;
  letter-spacing:6px;
  color:#2E5576;
  font-weight:500;
  margin-bottom:25px;
}

.why-section .subtitle{
  max-width:650px;
  margin:0 auto 70px;
  color:#555;
  font-size:18px;
  line-height:1.7;
}

/* ================= CARDS ================= */

.cards{
  display:flex;
  justify-content:center;
  gap:35px;
  flex-wrap:wrap;
  position:relative;
  z-index:2;
}

/* ================= CARDS – BRAND STYLE ================= */

.card{
  width:260px;
  height:320px;
  padding:30px 22px;
  border-radius:28px;
  background: linear-gradient(180deg, #4d69b1 0%, #2a286b 100%);
  box-shadow: 0 20px 50px rgba(42, 40, 107, 0.35);
  border:1px solid rgba(255,255,255,0.08);

  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  text-align:center;

  transition: all 0.4s ease;
  position:relative;
  overflow:hidden;
}

/* Soft inner glow */
.card::before{
  content:"";
  position:absolute;
  inset:0;
  background: radial-gradient(circle at top, rgba(255,255,255,0.12), transparent 60%);
  pointer-events:none;
}

/* Hover */
.card:hover{
  transform: translateY(-14px) scale(1.02);
  box-shadow: 0 30px 70px rgba(42, 40, 107, 0.45);
}

/* ================= ICON ================= */

.card svg{
  width:60px;
  height:60px;
  margin-bottom:28px;
  stroke:#ffffff;
  fill:none;
  stroke-width:1.8;
  transition: all .3s ease;
}

/* If using image icons instead of SVG */
/* ================= ICON IMAGE ================= */

.card img{
  width:65px;
  height:65px;
  margin-bottom:28px;
  
}

/* If icons are dark blue and you want them white */
.card img{
  filter: brightness(0) invert(1);
}

/* Hover effect */
.card:hover img{
  transform: scale(1.12);
}

/* ================= TEXT ================= */

.card h3{
  font-size:20px;
  font-weight:600;
  color:#ffffff;
  margin-bottom:16px;
}

.card p{
  font-size:15px;
  line-height:1.6;
  color:rgba(255,255,255,0.85);
}

/* ================= RESPONSIVE ================= */

/* ========================================= */
/* RESPONSIVE – WHY SECTION */
/* ========================================= */

@media (max-width: 1024px){

  .why-section{
    padding: 70px 20px 100px;
  }

  .why-section h2{
    font-size: 28px;
    letter-spacing: 4px;
  }

  .why-section .subtitle{
    font-size: 16px;
    margin-bottom: 50px;
  }
}


/* ===== MOBILE ===== */

@media (max-width: 768px){

  .why-section{
    padding: 60px 18px 90px;
  }

  .why-heading h2{
    font-size: 24px;
    letter-spacing: 3px;
  }

  .why-underline{
    width: 100px;
  }

  .why-section .subtitle{
    font-size: 15px;
    line-height: 1.6;
    margin-bottom: 40px;
  }

  /* Slider container fix */
  .slider{
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  .slide-track{
    display: flex;
    gap: 18px;
  }

  /* Card sizing */
  .card{
    min-width: 220px;
    height: 260px;
    padding: 22px 18px;
    border-radius: 22px;
  }

  .card img{
    width: 48px;
    height: 48px;
    margin-bottom: 18px;
  }

  .card h3{
    font-size: 16px;
    line-height: 1.3;
  }

}




    /* ===========================
   GOOGLE FONTS (Different)
=========================== */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@500;600;700&family=Inter:wght@300;400;500&display=swap');
/* ===========================
   ABOUT SECTION
=========================== */

/* Remove extra gap between HERO and ABOUT */
.slider_01,
.rev_slider_wrapper,
.rev_slider,
.rev_slider ul,
.rev_slider li {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

/* ===========================
   SECTION
=========================== */

.about-luxury {
  padding: 0;
  background: #f4f5f7;
}
/* MAIN CONTAINER */
.about-wrapper {
  width: 90%;
  max-width: 1250px;
  margin: 0 auto;
  display: flex;
  align-items: center;       /* vertical center */
  justify-content: space-between;
  gap: 80px;
  min-height: 520px;         /* THIS creates visual centering like Figma */
}
/* ===========================
   IMAGE
=========================== */

/* IMAGE */
.about-image {
  flex: 1 1 520px;
}

.about-image img {
  width: 100%;
  max-width: 520px;
  display: block;
  border-radius: 24px;
}

.about-image:hover img {
  transform: scale(1.02);
}

/* ===========================
   CONTENT
=========================== */

/* CONTENT */
.about-content {
  flex: 1 1 520px;
  max-width: 540px;
  margin: 0;                 /* remove margin-top */
  padding: 0;
}

/* LABEL */
.about-label {
  font-family: "Sebino-Bold";
  letter-spacing: 3px;
  font-size: 13px;
  color: #5C67B2;
  margin-bottom: 14px;
  display: inline-block;
}
/* HEADING */
.about-content h2 {
  font-family: "CoHeadline";
  font-size: 36px;
  color: #282D65;
  margin-bottom: 20px;
  line-height: 1.15;
}
/* PARAGRAPH */
/* PARAGRAPHS */
.about-content p {
  font-family: "Sebino-Regular";
  font-size: 16px;
  line-height: 1.65;
  color: #1a1a1a;
  margin-bottom: 16px;
}
.about-content p:last-child {
  margin-bottom: 0;
}

/* BUTTON */
.about-btn {
  display: inline-block;
  margin-top: 25px;
  padding: 14px 38px;
  background: linear-gradient(145deg, #6fbfb5, #5aaea5);
  color: #fff;
  border-radius: 50px;
  text-decoration: none;
  transition: 0.4s ease;
  box-shadow: 0 10px 25px rgba(111,191,181,0.4);
}

.about-btn:hover {
  transform: translateY(-4px);
  box-shadow: 0 15px 35px rgba(137,243,231,0.6);
}

/* ===========================
   TABLET
=========================== */
/* TABLET */
@media (max-width: 992px) {

  .about-wrapper {
    gap: 50px;
    min-height: auto;
  }

  .about-content h2 {
    font-size: 32px;
  }
}

/* MOBILE */
@media (max-width: 768px) {

  .about-wrapper {
    flex-direction: column;
    align-items: center;   /* center everything */
    text-align: center;
    gap: 30px;
    padding: 60px 0;
  }

  .about-content {
    max-width: 100%;
  }

  .about-content h2 {
    font-size: 28px;
  }

  .about-content p {
    font-size: 15px;
    line-height: 1.7;
  }
}

/*section 2 model*/

/* ================= SECTION ================= */

.features-section{
  padding:70px 0;
  background:#f4f4f4;
  overflow:hidden;
}

.slider{
  overflow:hidden;
  position:relative;
}

.slide-track{
  display:flex;
  align-items:center;
  gap:90px;
  width:max-content;
  animation: scroll 35s linear infinite;
}

.slider:hover .slide-track{
  animation-play-state:paused;
}

@keyframes scroll{
  0% { transform:translateX(0); }
  100% { transform:translateX(-50%); }
}

/* ================= ITEM ================= */

.feature-item{
  min-width:200px;
  text-align:center;
  transition:.4s ease;
  cursor:pointer;
}

/* ICON WRAPPER */

.icon-wrapper{
  width:90px;
  height:90px;
  margin:0 auto 18px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  transition:.4s ease;
}

/* SVG */

.feature-item svg{
  width:45px;
  height:45px;
  stroke:#5862B3;
  fill:none;
  stroke-width:1.8;
  transition:.4s ease;
}

/* HOVER EFFECT */

.feature-item:hover .icon-wrapper{
  background:#e8ecf7;
}

.feature-item:hover svg{
  stroke:#2e3f65;
  transform:scale(1.1);
}

.feature-item h4{
  font-size:15px;
  color:#5c6670;
  line-height:1.6;
  font-weight:500;
  transition:.3s;
}

.feature-item:hover h4{
  color:#2e3f65;
}

/* ================= RESPONSIVE ================= */

@media(max-width:768px){
  .slide-track{
    gap:50px;
    animation-duration:45s;
  }
  .feature-item{
    min-width:160px;
  }
}


/*premium- section*/

/* SECTION */

.section-heading {
  font-family: "Playfair Display", serif;
  color: #1e2a52;
  text-align: center;
  margin-bottom: 60px;
  position: relative;
  z-index: 2;
}
/* HOVER */
.premium-section .section-heading h2:hover{
  color:#5C67B2;
}


.premium-section .premium-subtitle{
  font-family:"Sebino",sans-serif;
font-weight:700;
font-size:15px;
letter-spacing:1px;
color:#5C67B2;
display:inline-block;
margin-bottom:10px;
}



.section-heading h2 {
  font-size: 36px;
  font-weight: 500;
  color: #282D65;
  font-family: "CoHeadline";
  letter-spacing: 1px;
  line-height: 1.2;
  margin-bottom: 22px;
}
.premium-section{
  position:relative;
  padding:120px 20px;
  background:linear-gradient(135deg,#e6f2f2,#f4f7f9);
  overflow:hidden;
}


/* Animated SVG */
.bg-wave{
  position:absolute;
  width:160%;
  left:-30%;
  bottom:-40px;
  opacity:0.4;
  animation:waveMove 20s linear infinite;
}

@keyframes waveMove{
  0%{ transform:translateX(0); }
  100%{ transform:translateX(-25%); }
}

/* Container */
.premium-container{
  max-width:1200px;
  margin:auto;
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  gap:40px;
  position:relative;
  z-index:2;
}

/* Cards */
.premium-card{
  background:#b1e0e6;
  padding:50px 35px;
  border-radius:22px;
  text-align:center;
  box-shadow:0 15px 40px rgba(0,0,0,0.06);
  transition:all 0.4s ease;
  position:relative;
  overflow:hidden;
}

/* Shine Hover Effect */
.premium-card::after{
  content:"";
  position:absolute;
  width:120%;
  height:120%;
  background:linear-gradient(120deg,transparent,rgba(255,255,255,0.6),transparent);
  top:-100%;
  left:-100%;
  transform:rotate(25deg);
  transition:0.7s;
}

.premium-card:hover::after{
  top:100%;
  left:100%;
}

.premium-card:hover{
  transform:translateY(-15px) scale(1.03);
  box-shadow:0 25px 60px rgba(0,0,0,0.12);
}

/* Badge */
.badge{
  display:inline-block;
  background:#5C67B2;
  color:#fff;
  padding:10px 22px;
  border-radius:40px;
  font-size:14px;
  margin-bottom:25px;
  letter-spacing:0.5px;
  transition:0.3s ease;
  font-family:'Sebino', sans-serif;
  font-weight:700px;
}

.premium-card:hover .badge{
  background:#2a286b;
}

/* Text */
.premium-card p{
  color:#2a286b;
  font-size:18px;
  line-height:1.8;
  font-family:'Sebino', sans-serif;
font-weight:400px;
}
/* Responsive */
@media(max-width:768px){
  .premium-section{
    padding:80px 20px;
  }
}/* Circle Image */
.circle-image{
  width:140px;
  height:140px;
  margin:auto;
  border-radius:50%;
  
  display:flex;
  align-items:center;
  justify-content:center;
  margin-bottom:25px;

}

.circle-image img{
  width:80%;
  object-fit:contain;
}
/* Sparkle Animation */
.sparkle{
  position:absolute;
  width:6px;
  height:6px;
  background:#e6c79c;
  border-radius:50%;
  top:30px;
  right:40px;
  box-shadow:0 0 10px #e6c79c;
  animation:sparkleMove 3s infinite ease-in-out;
}

@keyframes sparkleMove{
  0%{opacity:0; transform:translateY(0);}
  50%{opacity:1;}
  100%{opacity:0; transform:translateY(-20px);}
}

/* RESPONSIVE */
@media(max-width:768px){
  .luxury-section{
    padding:80px 20px;
  }
}

/* ============================= */
/* MOBILE */
/* ============================= */

/* ============================= */
/* MOBILE */
/* ============================= */

@media (max-width:768px){

.premium-section{
padding:80px 20px;
}

/* TITLE FIX */

.section-heading h2{
font-size:28px;
line-height:1.3;
letter-spacing:0.5px;
margin-bottom:18px;
}

/* TAG */

.premium-section .premium-subtitle{
font-size:13px;
}

/* TEXT */

.premium-card p{
font-size:15px;
max-width:330px;
margin:auto auto 16px;
}

}

@media (max-width:480px){

.section-heading h2{
font-size:24px;
}

}
/*product section*/

/* ===============================
   PRODUCT SLIDER SECTION
================================ */

.product-slider-section{
  padding:100px 20px;
  background:#ABE3E4;
  overflow:hidden;
  position:relative;
}

/* SECTION HEADER (scoped) */
.product-slider-section .section-header{
  text-align:center;
  max-width:1000px;   /* allow proper breathing */
  margin:0 auto 60px auto;
}

/* SUBTITLE */
.product-slider-section .product-subtitle{
font-family:"Sebino",sans-serif;
font-weight:700;
font-size:15px;
letter-spacing:1px;
color:#5C67B2;
display:inline-block;
margin-bottom:10px
}

/* MAIN HEADING */
.product-slider-section .section-header h2{
   font-family: 'CoHeadline', serif;
font-weight:700;
  font-size:36px;
  color:#282D65;
  line-height:1.2;
  margin:0 0 20px 0;
}

/* HOVER */
.product-slider-section .section-header h2:hover{
  color:#5C67B2;
}

/* PARAGRAPH */
.product-slider-section .section-header p{
  font-family:'Sebino', sans-serif;
font: weight 400px;

  font-size:19px;
  color:#2a286b;
  line-height:1.7;
  max-width:855px;   /* exact Figma width */
  margin:0 auto;
}
/* SLIDER */
.slider-wrapper{
  overflow:hidden;
  position:relative;
}

.slider-track-products{
  display:flex;
  gap:30px;
  width:max-content;
  will-change: transform;
  animation: scrollLoop 18s linear infinite;
}
.slider-track-products:hover{
  animation-play-state: paused;
}
@keyframes scrollLoop{
  from{
    transform: translateX(0);
  }
  to{
    transform: translateX(-50%);
  }
}
/* CARD */
.product-card{
  min-width:300px;
  height:420px;                 /* same height for all */
  background:#ffffff;
  border-radius:24px;
  padding:35px 25px;
  display:flex;
  flex-direction:column;
  justify-content:space-between; /* keeps button aligned */
  align-items:center;
  text-align:center;
}

.product-card:hover{
  transform:translateY(-10px);
  box-shadow:0 25px 60px rgba(0,0,0,0.12);
}

/* IMAGE WRAPPER FIXED SIZE */
.image-wrapper{
  width:100%;
  height:220px;                 /* same height for all images */
  display:flex;
  align-items:center;
  justify-content:center;
}

.image-wrapper img{
  max-width:100%;
  max-height:200px;
  object-fit:contain;
}


.product-card:hover .image-wrapper img{
  transform:rotateY(15deg) rotateX(8deg) scale(1.05);
}

/* TEXT */
.product-card h3{
 font-family: "Sebino-Bold", sans-serif;
  font-size: 15px;
  color: #282D65;
  margin-bottom: 10px;
  transition:0.4s ease;
}

.product-card h3:hover{
  color:#5C67B2;
}
.product-card p{
  font-size:14px;
  color:#666;
  margin-bottom:20px;
}
/* PRODUCT TITLE */
.product-title{
  font-family:"Sebino-Regular", sans-serif;
  font-size:15px;
  color:#282D65;
  margin:15px 0;
}
/* BUTTON */
.btn{
  margin-top:auto;              /* forces bottom alignment */
  padding:12px 28px;
  background:#5C67B2;
  color:#fff;
  border-radius:30px;
  font-family:"Sebino-Regular", sans-serif;
  font-size:14px;
  text-decoration:none;
  transition:0.3s ease;
}

.btn:hover{
  background:#282D65;
}
/* ============================= */
/* MOBILE */
/* ============================= */

@media (max-width:768px){

.product-slider-section{
padding:80px 0;
}
.section-header{
max-width:760px;
margin:auto;
text-align:center;
padding:0 20px;
}
/* TITLE */

.section-header h2{
font-size:36px;
font-weight:500;
color:#282D65;
font-family:"CoHeadline";
letter-spacing:1px;
line-height:1.2;
margin-bottom:22px;
}

/* TAG */

.product-subtitle{
font-size:13px;
}

/* TEXT */

.section-header p{
font-size:15px;
max-width:330px;
margin:auto;
}

/* CARDS */

.product-card{
width:200px;
padding:20px;
}

.product-title{
font-size:16px;
}

.image-wrapper{
height:140px;
}

.slider-track-products{
gap:25px;
animation:productScroll 22s linear infinite;
}

}

@media (max-width:480px){

.section-header h2{
font-size:24px;
}

}
/* RESPONSIVE */

  
  .product-card{
    scroll-snap-align:center;
  }
/* ===== MOBILE & SMALL SCREENS ===== */

@media (max-width:768px){

.section-header{
max-width:520px;
}

.section-header h2{
font-size:28px;
line-height:1.3;
letter-spacing:0.5px;
}

.section-header p{
font-size:15px;
max-width:340px;
margin:auto;
}

}

@media (max-width:480px){

.section-header{
max-width:320px;
}

.section-header h2{
font-size:24px;
line-height:1.35;
}

}

/*testimonial*/


.lux-testimonial{
  position:relative;
  padding:120px 20px 140px;
background: linear-gradient(135deg, #ABE3E4 0%, #DFF6F6 50%, #F4F7F9 100%);
  overflow:hidden;
}


.lux-testimonial::before,
.lux-testimonial::after{
  display:none;
}
.lux-container{
  position:relative;
 max-width:1200px;
  margin:auto;
 
}
.section-heading{
  text-align:center;
  margin-bottom:70px;
}

.testimonial-label{
   font-family: "Sebino", sans-serif;
    font-weight: 700;
    font-size: 15px;
    letter-spacing: 1px;
    color: #5C67B2;
    display: inline-block;
    margin-bottom: 10px;
}

.testimonial-heading{
 font-size: 36px;
  font-weight: 500;
  color: #282D65;
  font-family: "CoHeadline";
  letter-spacing: 1px;
  line-height: 1.2;
  margin-bottom: 22px;
}

.testimonial-heading:hover{
  color:#5C67B2; /* Brand accent */
}
/* Grid */
.testimonial-grid{
  display:flex;
  gap:30px;
  justify-content:center;
  align-items:stretch;
  flex-wrap:wrap;
}

.testimonial-card{
  background:#5C67B2;
  border-radius:28px;
  padding:30px;
  width:380px;
  display:flex;
}

.card-inner{
  display:flex;
  gap:20px;
  width:100%;
}

.card-image{
  flex: 0 0 120px; /* fixed column width */
  display:flex;
  align-items:center;
}

.card-image img{
  width:110px;
  height:140px;
  object-fit:cover;
  border-radius:22px;
}
.card-text{
  display:flex;
  flex-direction:column;
  justify-content:space-between;
}


.testimonial-card:hover{
  transform:translateY(-8px);
}

/* Stars */
/* Stars */
.stars{
  color:#ABE3E4;
  font-size:14px;
  letter-spacing:3px;
  margin-bottom:6px;
}

/* Name */
.card-text h4{
 font-family:"Sebino",sans-serif;
font-weight:700;
font-size:15px;
letter-spacing:1px;
  color:#FFFFFF;
display:inline-block;
margin-bottom:10px;
}

/* Paragraph */
.card-text p{
   font-family:"Sebino",sans-serif;
  font-size:17px;
  line-height:1.6;
  color:#FFFFFF;
  margin:0 auto 16px;
  max-width:820px;
}

/* Location */
.card-text span{
  font-family: 'Sebino', sans-serif;
  font-size: 13px;
  color: #d7d9f0;
}
/* Location */
.card-text span{
  font-size:13px;
  opacity:0.8;
}
@media (max-width: 576px){
  .testimonial-heading{
    font-size: 26px;
    line-height: 1.3;
    max-width: 90%;
    margin: 0 auto;
  }
}
/* Tablets */
@media (max-width: 991px){
  .testimonial-heading{
    font-size: 30px;
    line-height: 1.25;
  }
}
/* Mobile Fix */
@media (max-width:768px){

  .testimonial-grid{
    flex-direction:column;
    gap:25px;
    align-items:center;
  }

  .testimonial-card{
    width:92%;
    padding:30px 25px;
  }

  .card-inner{
    flex-direction:column;
    align-items:center;
    text-align:center;
  }

  .card-image{
    margin:15px 0;
  }

  .card-image img{
    width:150px;
    height:auto;
    border-radius:22px;
  }

  .card-text{
      font-size:17px;
    align-items:center;
  }

  .card-text p{
      
    max-width:90%;
    line-height:1.6;
  }

}

/*trusted Network section*/


/* Instagram Section */
.instagram__section {
    background: #f8f9fa;
}

/* Default grayscale */
.instagram__thumbnail--img {
    width: 100%;
    transition: all 0.5s ease;
    filter: grayscale(100%);
    opacity: 0.7;
}

/* Hover reveal color */
.instagram__thumbnail:hover .instagram__thumbnail--img {
    filter: grayscale(0%);
    opacity: 1;
    transform: scale(1.05);
}

/* Subtle hover overlay */
.instagram__thumbnail::after {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,0.25);
    transition: 0.4s ease;
}

.instagram__thumbnail:hover::after {
    background: rgba(0,0,0,0);
}

/* Instagram icon fade in */
.instagram__social--icon {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) scale(0.8);
    opacity: 0;
    transition: 0.4s ease;
    color: #fff;
}

.instagram__thumbnail:hover .instagram__social--icon {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1);
}

/* Section Background */
.network-container {
    background: #8cc1c0;
    padding: 70px 0;
    border-top-left-radius: 120px;
    border-top-right-radius: 120px;
    overflow: hidden;
    text-align: center;
}




/* Card */
.network-card {
    background: transparent;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 120px;
}

/* Image Default */
.network-card img {
    max-height: 80px;
    width: auto;
    object-fit: contain;
    filter: grayscale(100%);
    opacity: 0.6;
    transform: scale(1);
    transition: all 0.4s ease;
}

/* Hover Effect */
.network-card:hover img {
    filter: grayscale(0%);
    opacity: 1;
    transform: scale(0.9); /* Zoom OUT effect */
}

/* network section*/

/* ===============================
   TRUSTED NETWORK SECTION
=================================*/

.trusted-network {
   padding: 60px 15px;
    background: #fff;
}

.network-container {
    background: #ffffff; /* Changed to white */
    border-top-left-radius: 80px;
    border-top-right-radius: 80px;
    padding: 70px 20px;
    overflow: hidden;
    text-align: center;
}

.network-subtitle {
  font-family: 'Sebino', sans-serif !important;
  font-weight: 700 !important;
  font-size: 15px;
  color: #5C67B2;
  letter-spacing: 1px;
  margin-bottom: 50px;
  transition: 0.3s ease;
}


.network-slider {
    position: relative;
}
/* Slider wrapper */
.network-slider {
    overflow: hidden;
    position: relative;
}

/* Sliding track */
.network-track {
    display: flex;
    gap: 80px;
    animation: scroll 30s linear infinite;
}

/* Individual cards */
.network-card {
    width: 180px;   /* bigger */
    height: 120px;  /* equal height */
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Force same logo sizing */
.network-card img {
    width: 140px;       /* fixed width */
    height: 80px;       /* fixed height */
    object-fit: contain;
    filter: grayscale(100%);
    opacity: 0.7;
    transition: all 0.4s ease;
}
/* Hover → Color */
.network-card:hover img {
    filter: grayscale(0%);
    opacity: 1;
    transform: scale(1.08);
}

/* Auto sliding animation */

.network-slider:hover .network-track {
    animation-play-state: paused;
}







@media (min-width: 1200px) {
    .network-card {
        height: 120px;
    }

    .network-card img {
        max-height: 80px;
    }
}

@media (max-width: 991px) {

    .network-container {
        border-top-left-radius: 60px;
        border-top-right-radius: 60px;
        padding: 50px 15px;
    }

 
    
    .network-card {
        height: 100px;
    }

    .network-card img {
        max-height: 60px;
    }
}

@media (max-width: 767px) {

    .network-container {
        border-top-left-radius: 40px;
        border-top-right-radius: 40px;
        padding: 40px 10px;
    }

    .network-subtitle {
        font-size: 11px;
        letter-spacing: 2px;
        margin-bottom: 30px;
    }

    .network-card {
        height: 90px;
    }

    .network-card img {
        max-height: 55px;
    }
}

@media (max-width: 575px) {

    .network-container {
        border-top-left-radius: 30px;
        border-top-right-radius: 30px;
        padding: 35px 10px;
    }

    .network-subtitle {
        font-size: 20px;
        letter-spacing: 2px;
    }

      .network-card {
    width: 140px;
    height: 100px;
  }

  .network-card img {
    width: 115px;
    height: 70px;
  }
}
@media (max-width: 991px) {
   
  .network-card {
    width: 160px;
    height: 110px;
  }

  .network-card img {
    width: 130px;
    height: 75px;
    object-fit: contain;
  }
}
/* best selling products*/

.best-selling {
 background:#ABE3E4;
  padding: 80px 0;
  overflow: hidden;
  text-align: center;   /* Force center alignment */
  color: #ffffff;       /* One consistent color */
}

.container {
  width: 90%;
  max-width: 1200px;
  margin: auto;
}
/* Small Label */
.section-label {
  font-family: "Sebino-Bold", sans-serif;
  font-size: 13px;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: #044448;
  margin-bottom: 15px;
}

/* Main Heading */
.best-selling h2 {
  font-size: 36px;
  font-weight: 600;
  margin: 10px 0 15px;
  line-height: 1.3;
  color: #ffffff;   /* Explicit */
}

.subtitle {
 font-family: "Inter", sans-serif;
  font-size: 16px;
  color: #04827b;
  max-width: 600px;
  margin: 15px auto 25px;
}

/* Tags */
/* ================= TAGS ================= */

/* ================= TAG CTA BUTTONS ================= */

.tags{
  display:flex;
  flex-wrap:wrap;
  gap:20px;
  justify-content:center;
  margin:40px auto;
}

/* Button Style */
.tag-btn {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 80px;                 /* Equal height */
  border-radius: 50px;
  text-decoration: none;
  font-size: 16px;
  font-weight: 500;
  color: #170767;
  background: rgba(255,255,255,0.2);
  backdrop-filter: blur(8px);
  border: 1px solid rgba(255,255,255,0.4);
  transition: all 0.3s ease;
  text-align: center;
}

/* Hover Effect */
.tag-btn:hover {
  background: #6fbfb5;
  color: #fff;
  transform: translateY(-5px);
  box-shadow: 0 12px 25px rgba(0,0,0,0.15);
}

/* Remove bullet from first item */
.tags span:first-child::before {
  content: "";
}

/* Tablet */
@media (max-width: 768px) {
  .tags {
    gap: 12px 20px;
  }

  .tags span {
    font-size: 14px;
  }
}

/* Mobile */
@media (max-width: 480px) {
  .tags {
    flex-direction: column;
    align-items: center;
  }

  .tags span {
    padding-left: 0;
  }

  .tags span::before {
    display: none;
  }
}

/* ================= TITLE WRAP ================= */

.title-wrap {
  text-align: center;
  cursor: pointer;
}

/* ================= MAIN HEADING ================= */

.main-title {
  font-family: "Co Headline", "Inter", sans-serif;
  font-weight: 700;
  font-size: 42px;
  color: #ffffff;
}

/* Hover color change */
.title-wrap:hover .main-title {
  color: #6fbfb5;
  letter-spacing: 1px;
}

/* ================= SUBTITLE ================= */

.subtitle {
  font-size: 16px;
  margin-top: 15px;
  color: #0f5f63;
  transition: all 0.4s ease;
}

/* Text animation */
.reflect-text {
  position: relative;
  display: inline-block;
  animation: floatText 3s ease-in-out infinite;
}

/* Floating effect */
@keyframes floatText {
  0% { transform: translateY(0px); }
  50% { transform: translateY(-4px); }
  100% { transform: translateY(0px); }
}

/* Reflection effect */
.reflect-text::after {
  content: attr(data-text);
  position: absolute;
  left: 0;
  top: 100%;
  width: 100%;
  transform: scaleY(-1);
  opacity: 0.25;
  background: linear-gradient(to bottom, rgba(0,0,0,0.3), transparent);
  -webkit-background-clip: text;
  color: #0f5f63;
}
/* Wrapper */
.title-wrap {
  text-align: center;
  overflow: hidden;
}

/* Base Reveal */
.reveal {
  position: relative;
  display: inline-block;
  overflow: hidden;
}

/* Text Style */
.main-title {
  font-size: 42px;
  font-weight: 600;
  color: #ffffff;
}

.subtitle {
  display: block;
  margin-top: 15px;
  font-size: 16px;
  color: #0f5f63;
}

/* Sliding overlay */
.reveal::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
 
 
}

/* Delay subtitle slightly */
.subtitle.reveal::before {
  animation-delay: 0.5s;
}

/* Animation */
@keyframes revealFlow {
  0% {
    left: 0;
  }
  100% {
    left: 100%;
  }
}

/* SLIDER */
.slider {
  overflow: hidden;
}

.slider-track {
  display: flex;
  gap: 25px;
  width: max-content;
  animation: scroll 28s linear infinite;
}

/* CARD */
.card {
  flex: 0 0 auto;
  width: 225px;
  border-radius: 25px;
  background: linear-gradient(180deg, #5665a8, #2e2f75);
  padding: 15px;
  text-align: center;
}

.card img {
  width: 100%;
  height: 255px;
  object-fit: cover;
  border-radius: 20px;
  display: block;
}

/* Swing Hover */
.card:hover img {
  transform: rotate(-2deg) rotateY(8deg) scale(1.05);
}

.card p {
   font-family:"Inter", sans-serif;
  font-size:15px;
  color:#5a6a7b;
}

/* Infinite Scroll Animation */
@keyframes scroll {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}


/* CTA */

.cta-title{
  font-family:"Co Headline","Inter",sans-serif;
  font-weight:700;
  font-size:36px;
  color:#04827b;
  margin:60px 0 20px;
}

/* ================= CTA BUTTONS ================= */

.cta-buttons{
  display:flex;
  gap:25px;
  justify-content:center;
  flex-wrap:wrap;
}

/* Base Button Style */
.cta-buttons a {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  min-width: 240px;
  padding: 14px 28px;
  border-radius: 40px;
  text-decoration: none;
  background: rgba(255,255,255,0.15);
  color: #170767;
  font-weight: 500;
  transition: all 0.3s ease;
  text-align: center;
}

/* Hover */
.cta-buttons a:hover {
  background: #6fbfb5;
  color: #fff;
  transform: translateY(-3px);
}

/* ================= TABLET ================= */
@media (max-width: 992px) {
  .cta-buttons a {
    min-width: 220px;
  }
}

/* ================= MOBILE ================= */
@media (max-width: 600px) {
  .cta-buttons {
    flex-direction: column;
    gap: 18px;
  }

  .cta-buttons a {
    width: 90%;
    min-width: unset;
  }
}
/* Responsive */

/* ================= RESPONSIVE ================= */

@media (max-width: 1200px) {
  .card {
    width: 200px;
  }
  .card img {
    height: 230px;
  }
}

@media (max-width: 992px) {
  .card {
    width: 180px;
  }
  .card img {
    height: 210px;
  }
}

@media (max-width: 768px) {
  .slider-track {
    gap: 15px;
  }
  .card {
    width: 160px;
  }
  .card img {
    height: 190px;
  }
}

@media (max-width: 480px) {
  .card {
    width: 140px;
  }
  .card img {
    height: 170px;
  }
}

/* image section*/


/* Background subtle zoom */
.luxury-banner {
  position: relative;
  width: 100%;
  height: 500px;
  background: url("../img/Layer_1.png") center center / cover no-repeat;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  overflow: hidden;

  animation: bannerZoom 8s ease-in-out forwards;
  padding-top: 120px;   /* moves content lower */
}

/* Overlay stays same */
.luxury-overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.35);
}

/* Content animation */
.luxury-content {
  position: relative;
  color: #ffffff;
  max-width: 700px;
  padding: 20px;

  opacity: 0;
  transform: translateY(40px);
  animation: fadeUp 1.4s ease forwards;
  animation-delay: 0.4s;
}

/* Heading delay */
.luxury-content h2 {
  font-family: 'CoHeadline', serif;
  font-size: 44px;
  margin-bottom: 18px;
  animation: fadeUp 1.2s ease forwards;
  animation-delay: 0.6s;
}

/* Paragraph delay */
.luxury-content p {
  font-family:"Sebino",sans-serif;
font-size:17px;
line-height:1.4;
color:#ffffff;
margin-bottom:16px;
  letter-spacing: 1px;
  opacity: 0;
  animation: fadeUp 1.2s ease forwards;
  animation-delay: 0.9s;
}


/* Fade + Slide Up */
@keyframes fadeUp {
  from {
    opacity: 0;
    transform: translateY(40px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Subtle background zoom */
@keyframes bannerZoom {
  from {
    background-size: 105%;
  }
  to {
    background-size: 100%;
  }
}
@media (max-width: 768px) {
  .luxury-banner {
    height: 350px;

  }

  .luxury-content h2 {
     font-size: 24px;
  font-weight: 500;
  color: #ffffff;
  font-family: "CoHeadline";
  letter-spacing: 1px;
  line-height: 1.2;
  margin-bottom: 22px;
  }
}

/* Footer*/


.silk-footer {
    position: relative;
    background: #282D65;
    color: #ffffff;
   overflow: visible;  /* IMPORTANT */
   border-top: 1px solid #C8B6FF;
}


.silk-footer a {
    color: #ffffff;
    text-decoration: none;
    transition: 0.3s ease;
}

.silk-footer a:hover {
    color: #38d6c5;
}
.silk-footer .row {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
}
/* top glowing line */
.silk-footer::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 2px;
    background: linear-gradient(90deg, transparent, #38d6c5, transparent);
    box-shadow: 0 0 20px #38d6c5;
    animation: glowline 6s linear infinite;
}

@keyframes glowline {
    0% { opacity: .4; }
    50% { opacity: 1; }
    100% { opacity: .4; }
}

.fog {
  fill: none;
  stroke: rgba(255,255,255,0.8);
  stroke-linecap: round;
  filter: blur(14px);
  opacity: 0.6;
  animation: fogFlow 6s ease-in-out infinite;
}

.fog1 { stroke-width: 8; animation-delay: 0s; }
.fog2 { stroke-width: 10; animation-delay: 1s; }
.fog3 { stroke-width: 12; animation-delay: 2s; }
.fog4 { stroke-width: 7; animation-delay: 3s; }
.fog5 { stroke-width: 9; animation-delay: 4s; }

@keyframes fogFlow {
  0% {
    transform: translateY(0) scaleX(1);
    opacity: 0.6;
  }
  40% {
    transform: translateY(-40px) scaleX(1.2);
    opacity: 0.45;
  }
  70% {
    transform: translateY(-80px) scaleX(1.4);
    opacity: 0.3;
  }
  100% {
    transform: translateY(-140px) scaleX(1.6);
    opacity: 0;
  }
}

.fog-layer {
    position: absolute;
    bottom: 0;
    left: -50%;
    width: 200%;
    height: 100%;
    
    background-size: cover;
    opacity: 0.15;
    animation: fogMove 60s linear infinite;
    pointer-events: none;
}

.fog-layer-2 {
    animation-duration: 90s;
    opacity: 0.08;
}

@keyframes fogMove {
    from { transform: translateX(0); }
    to { transform: translateX(-50%); }
}
.wave-glow {
    position: absolute;
    bottom: 80px;
    width: 100%;
    height: 120px;
    background: #C8B6FF;
    filter: blur(40px);
    animation: wavePulse 8s ease-in-out infinite;
}

@keyframes wavePulse {
    0%,100% { opacity: .5; }
    50% { opacity: 1; }
}

.footer__logo--img {
    filter: none;              /* remove glow */
    transition: transform .4s ease;
    image-rendering: auto;     /* ensure clarity */
}

.footer__logo--img:hover {
    transform: scale(1.05);
}


.footer__widget--menu__text {
    transition: .3s ease;
}

.footer__widget--menu__text:hover {
    color: #38d6c5;
    text-shadow: 0 0 8px rgba(56,214,197,.7);
    padding-left: 6px;
}

.newsletter__subscribe--input {
    background: rgba(255,255,255,.1);
    border: 1px solid rgba(255,255,255,.2);
    color: #fff;
}

.newsletter__subscribe--button {
    background: linear-gradient(90deg,#38d6c5,#1c9fb8);
    border: none;
    box-shadow: 0 0 15px rgba(56,214,197,.6);
    transition: .3s ease;
}

.newsletter__subscribe--button:hover {
    transform: translateY(-2px);
    box-shadow: 0 0 25px rgba(56,214,197,1);
}

@media (max-width: 991px) {
    .silk-footer {
        text-align: center;
    }

    .footer__widget {
        margin-bottom: 30px;
    }

    .footer__bottom--inenr {
       border-top: 1px solid rgba(200, 182, 255, 0.6);
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 15px;
}
@media (max-width: 576px) {
    .footer__bottom--inenr {
        flex-direction: column;
        text-align: center;
    }

    .footer__payment img {
        max-width: 200px;
        height: auto;
    }
}
}
.floating-product {
    position: absolute;
    bottom: 20px;
    width: 140px;
    opacity: .6;
    animation: floatY 6s ease-in-out infinite;
}

.floating-product.left {
    left: 5%;
}

.floating-product.right {
    right: 5%;
    animation-delay: 3s;
}

@keyframes floatY {
    0%,100% { transform: translateY(0); }
    50% { transform: translateY(-15px); }
}

.product-wrapper {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: clamp(120px, 18vw, 240px);
    z-index: 2;  /* bring above background */
    pointer-events: none;
}

.product-item {
    position: absolute;
    bottom: 0;
}

.product-item.left {
    left: 4%;
}

.product-item.right {
    right: 4%;
}

.floating-product {
  width: clamp(80px, 12vw, 160px);
    height: auto;
    display: block;
    position: relative;
    z-index: 3;
    
}

/* Floating movement */
@keyframes floatY {
    0%,100% { transform: translateY(0); }
    50% { transform: translateY(-12px); }
}

/* Smoke Base */
.smoke {
    position: absolute;
    bottom: clamp(60px, 8vw, 120px);
    left: 50%;
    transform: translateX(-50%);
    width: 80px;
    height: 120px;
    background: radial-gradient(circle, rgba(255,255,255,.5) 0%, rgba(255,255,255,.2) 40%, transparent 70%);
    filter: blur(18px);
    animation: smokeRise 6s linear infinite;
}

/* Slight variation for perfume */
.smoke-perfume {
    width: 60px;
    animation-duration: 4s;
    opacity: .6;
}

@keyframes smokeRise {
    0% {
        opacity: 0;
        transform: translateX(-50%) translateY(0) scale(.8);
    }
    20% {
        opacity: .8;
    }
    100% {
        opacity: 0;
        transform: translateX(-50%) translateY(-140px) scale(1.4);
    }
}

.smoke::before,
.smoke::after {
    content: "";
    position: absolute;
    width: 60px;
    height: 60px;
    background: radial-gradient(circle, rgba(255,255,255,.6), transparent 70%);
    border-radius: 50%;
    filter: blur(12px);
    animation: smokeBubble 5s infinite;
}

.smoke::after {
    animation-delay: 2s;
}

@keyframes smokeBubble {
    0% { transform: translateY(0) scale(.5); opacity: .5; }
    100% { transform: translateY(-100px) scale(1.3); opacity: 0; }
}

/* Desktop */
.col-lg-4 { flex: 0 0 33.333%; max-width: 33.333%; }
.col-lg-2 { flex: 0 0 16.666%; max-width: 16.666%; }

/* Tablet */
@media (max-width: 991px) {
    .col-lg-4,
    .col-lg-2 {
        flex: 0 0 50%;
        max-width: 50%;
        margin-bottom: 30px;
    }
}

/* Mobile */
@media (max-width: 576px) {
    .col-lg-4,
    .col-lg-2 {
        flex: 0 0 100%;
        max-width: 100%;
        text-align: center;
    }
}

@media (max-width: 480px) {
    .product-wrapper {
        display: none;
    }
}

.newsletter__subscribe--form {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.newsletter__subscribe--input {
    flex: 1;
    min-width: 180px;
}

.newsletter__subscribe--button {
    flex-shrink: 0;
}

@media (max-width: 480px) {
    .newsletter__subscribe--form {
        flex-direction: column;
    }

    .newsletter__subscribe--button {
        width: 100%;
    }
}

.main__footer {
    position: relative;
    padding-bottom: 160px; /* reserve space */
}

.social__share--icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: rgba(255,255,255,0.08);
    color: #fff;
    transition: 0.3s ease;
}

.social__share--icon:hover {
    background: #38d6c5;
    box-shadow: 0 0 12px #38d6c5;
    transform: translateY(-3px);
}

/* Make all footer text white */
.silk-footer,
.silk-footer p,
.silk-footer li,
.silk-footer span,
.silk-footer a,
.silk-footer h1,
.silk-footer h2,
.silk-footer h3,
.silk-footer h4,
.silk-footer h5 {
    color: #ffffff;
}

.footer__bottom p {
    color: #ffffff;
}

/* Animation effect on hero*/

/* Base reveal animation */
/* Base reveal */
.reveal {
  display: inline-block;
  opacity: 0;
  transform: translateY(60px);
  animation: luxuryReveal 1.1s cubic-bezier(0.22, 1, 0.36, 1) forwards;
  will-change: transform, opacity;
}

/* Stagger delays */
.reveal-1 { animation-delay: 0.3s; }
.reveal-2 { animation-delay: 0.9s; }
.reveal-3 { animation-delay: 1.4s; }
.reveal-4 { animation-delay: 1.8s; }

@keyframes luxuryReveal {
  from {
    opacity: 0;
    transform: translateY(60px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.primary__btn.slider__btn {
  background-color: #6fbfb5;   /* Your brand color */
  color: #ffffff;
  
  transition: all 0.4s ease;
  border: 2px solid #6fbfb5;
  
}

.primary__btn.slider__btn:hover {
  background-color: transparent;
  color: #6fbfb5;
}

/* footer*/
/* Apply Sebino to all footer text except titles */
.footer__section,
.footer__section p,
.footer__section a,
.footer__section li,
.footer__section span,
.footer__section input,
.footer__section button,
.footer__bottom,
.copyright__content {
    font-family: 'Sebino', sans-serif;
}

/* Keep headings unchanged */
.footer__widget--title {
    font-family: inherit; /* keeps existing heading font */
}
.footer__section {
    position: relative;
    width: 100%;
    padding: 60px 0;
}

/* WhatsApp wrapper */
.footer-whatsapp-wrapper {
    position: absolute;
    right: 40px;          /* fixed spacing from right */
    bottom: 100px;        /* adjust vertically */
    z-index: 10;
}

/* Button */
/* WhatsApp Button */
.footer-whatsapp-btn{
  position: fixed;
  right: 25px;
  bottom: 90px;     /* keeps it above bottom navigation */
  z-index: 9999;
}

.footer-whatsapp-btn a {
    display: flex;
    align-items: center;
    justify-content: center;
}

.footer-whatsapp-btn img{
  width: 52px;
  height: auto;
  display: block;
}

.footer-whatsapp-btn img:hover {
    transform: scale(1.08);
}
.footer-whatsapp-btn a:hover {
    transform: scale(1.1);
}

@media (max-width: 768px) {
    .footer-whatsapp-btn {
        position: fixed;
        right: 20px;
        bottom: 20px;
        top: auto;
        transform: none;
        z-index: 999;
    }
}

.footer__bottom {
    border-top: 1px solid rgba(200, 182, 255, 0.6);
}
   LOGO RESPONSIVE
/*========================= */

.footer__logo img {
    max-width: 180px;
    width: 100%;
    height: auto;
    display: block;
}

/*Column Grid Layout*/
.footer-grid {
    display: grid;
    grid-template-columns: 1.3fr 1fr 1fr 1.5fr;
    gap:100x;
    align-items: flex-start;
}

.footer-col h4 {
    color: #ffffff;
    font-weight: 400;
    margin-bottom: 18px;
    font-size: 14px;
    font-family: 'Co Headline';

}




.footer-col ul li {
       margin-bottom: 16px;
    line-height: 1.6;
}

.footer-col a {
    color: #ffffff;
    text-decoration: none;
    transition: 0.3s ease;
}

.footer-col a:hover {
    color: #38d6c5;
    text-shadow: 0 0 8px #38d6c5;
}

/*Newsletter Style*/

.newsletter-form {
     display: flex;
    margin-top: 15px;
    width: 100%;
}

.newsletter-form input{
    width:260px;
    height:42px;
    border:none;
    outline:none;
    background:#E9E9E9;
    padding:0 16px;
    border-radius:25px 0 0 25px;
}


.newsletter-form button {
    background: #38d6c5;
    border: none;
    padding: 10px 18px;
    border-radius: 0 6px 6px 0;
    color: #fff;
    font-weight: 500;
    transition: 0.3s ease;
}

.newsletter-form button:hover {
    box-shadow: 0 0 12px #38d6c5;
}

.connect-title {
  margin-top: 20px;  /* adjust 20–35px as needed */
    color: #ffffff;
    font-size: 14px;
    margin-bottom:10px;
    display:block;
    letter-spacing: 1px;
}

.social-icons {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
     margin-top:8px;
}

.social-icons a {
    width: 38px;
    height: 38px;
    background: rgba(255,255,255,0.15);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: 0.3s ease;
}

.social-icons svg {
    width: 18px;
    height: 18px;
    fill: #ffffff;
}

.social-icons a:hover {
    background: #38d6c5;
    box-shadow: 0 0 10px #38d6c5;
}
/* =========================
   TABLET RESPONSIVE
========================= */

@media (max-width: 1200px) {
    .footer-grid {
        grid-template-columns: 1fr 1fr 1fr;
        gap: 30px;
    }

    .footer-col-5 {
        display: none; /* hide decorative column */
    }

     .footer__logo img {
        max-width: 150px;   /* adjust between 150–170px if needed */
        height: auto;
    }
}

/* =========================
   SMALL TABLET
========================= */

@media (max-width: 992px) {
    .footer-grid {
        grid-template-columns: 1fr 1fr;
        gap: 30px;
    }

    .footer__logo img {
        max-width: 160px;
    }
}

/* =========================
   MOBILE
========================= */

@media (max-width: 768px) {

    .footer-grid {
        grid-template-columns: 1fr;
        text-align: center;
          gap: 20px;   /* was 30px or 40px */
    }

    .footer-col {
        margin-bottom: 18px;
    }

   .footer__logo{
        display:flex;
        justify-content:center;
        align-items:center;
        text-align:center;
        margin-bottom:15px;
    }

       .footer__logo img{
        margin:0 auto;
        display:block;
        max-width:150px;
    }

    .footer-col-1{
        text-align:center;
    }

}

    



/* =========================
   EXTRA SMALL
========================= */

@media (max-width: 480px) {
  /* Center logo on smaller screens */

    
    .footer__logo{
        display:flex;
        justify-content:center;
        align-items:center;
        text-align:center;
        margin-bottom:15px;
    }

    .footer__logo img{
        margin:0 auto;
        display:block;
        max-width:150px;
    }

    .footer-col-1{
        text-align:center;
    }

}
    .footer-col h4 {
        font-size: 15px;
         margin-bottom: 12px;
    }


/* =========================
   WHATSAPP BUTTON
========================= */

.footer-whatsapp-btn {
    position: absolute;
    right: 40px;
    top: 50%;
    transform: translateY(-50%);
}

.footer-whatsapp-btn img {
    width: 55px;
    height: 55px;
}

@media (max-width: 768px) {
    .footer-whatsapp-btn {
        position: fixed;
        right: 20px;
        bottom: 20px;
        top: auto;
        transform: none;
        z-index: 999;
    }
}

/*why section test*/

/* ============================= */
/* WHY SIMPLE SECTION */
/* ============================= */

.why-simple {
  padding: 110px 0;
  background: #b1e0e6;   /* Brand Light Blue */
  overflow: hidden;
}

.why-container {
  width: 90%;
  margin: auto;
  text-align: center;
}

/* Title */

.why-title {
  font-size: 36px;
  font-weight: 500;
  color: #282D65;
  font-family: "CoHeadline";
  letter-spacing: 1px;
  line-height: 1.2;
  margin-bottom: 22px;
}
.why-simple .why-title:hover{
  color:#5C67B2;
}
/* ================= SLIDER ================= */

.why-slider {
  overflow: hidden;
  position: relative;
}

.why-track {
  display: flex;
  gap: 30px;
  width: max-content;
  animation: scrollWhy 25s linear infinite;
}

@keyframes scrollWhy {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}

/* ================= CARD ================= */

.why-card {
  width: 260px;
  height: 260px;

  background: #ffffff;
  border-radius: 22px;
  box-shadow: 0 20px 40px rgba(42, 40, 107, 0.08);

  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;

  transition: 0.3s ease;
}

.why-card:hover {
  transform: translateY(-10px);
  box-shadow: 0 25px 60px rgba(42, 40, 107, 0.15);
}

/* ICON */

.why-card img {
  width: 60px;
  height: 60px;
  margin-bottom: 20px;
}

/* TEXT */

.why-card h3{


font-size:18px;
font-weight:500; /* Medium */
color:#2a286b;
font-family:"Sebino",sans-serif;
line-height:1.4;
text-align:center;
}
/* ================= RESPONSIVE ================= */

@media (max-width: 768px) {

  .why-simple {
    padding: 80px 0;
  }

  .why-title {
    font-size: 24px;
    letter-spacing: 1px;
    margin-bottom: 40px;
  }

  .why-card {
    width: 200px;
    height: 200px;
  }

  .why-card img {
    width: 45px;
    height: 45px;
  }

  .why-card h3 {
    font-size: 14px;
  }

  .why-track {
    gap: 20px;
    animation: scrollWhy 18s linear infinite;
  }
}

/*about section test*/

/* ============================= */
/* ABOUT SECTION REFINED LAYOUT */
/* ============================= */

.about-modern {
  background: #f4f5f7;
  padding: 90px 0 40px;   /* reduced top padding */
}

.about-container {
  width: 88%;              /* slightly tighter */
  max-width: 1180px;       /* reduce excessive width */
  margin: 0 auto;
  display: flex;
  align-items: center;
  gap: 55px;               /* reduced from 80px */
}

/* IMAGE */

.about-image {
  flex: 1;
}

.about-image img {
  width: 100%;
  display: block;
  border-radius: 22px;
}

/* TEXT BLOCK */

.about-text {
  padding-left: 50px;
  flex: 1;
  max-width: 569px;   /* prevents text stretching too wide */
}

/* ABOUT LABEL */

.about-tag {
   font-family:'Sebino', sans-serif;
  font-weight:bold;
  font-size:15px;
  color:#5C67B2;
  margin-bottom: 10px;   /* tighter to heading */
  display: inline-block;
}

/* HEADING */

.about-title-new {
   font-size: 36px;
  font-weight: 500;
  color: #282D65;
  font-family: "CoHeadline";
  letter-spacing: 1px;
  line-height: 1.2;
  margin-bottom: 22px;   /* clean spacing before paragraph */
}

.about-modern .about-title-new:hover{
  color:#5C67B2;
}
/* PARAGRAPHS */

.about-text p {
   font-family:'Sebino', sans-serif;
font-weight:400;
  font-size: 17px;
  line-height:auto;
  color: #000000;
  margin-bottom: 16px;   /* consistent rhythm */
}

/* BUTTON */

.about-button {
  display: inline-block;
  margin-top: 18px;
  padding: 13px 32px;
  background: #1c2b5a;
  color: #fff;
  border-radius: 40px;
  text-decoration: none;
  transition: 0.3s ease;
}

.about-button:hover {
  background: #6fbfb5;
}

/* ================= */
/* RESPONSIVE       */
/* ================= */
/* ================= */
/* MOBILE TYPOGRAPHY */
/* ================= */

@media (max-width:768px){

.about-modern{
  padding:60px 20px;
}

.about-container{
  flex-direction:column;
  gap:35px;
  width:100%;
}

.about-image-wrap img{
  border-radius:22px;
}

/* TEXT BLOCK */

.about-text{
  padding-left:0;
  text-align:center;
}

/* ABOUT LABEL */

.about-tag{
  font-size:13px;
  margin-bottom:8px;
}

/* TITLE */

.about-title{
  font-size:28px;
  line-height:1.3;
  margin-bottom:18px;
}

/* PARAGRAPH */

.about-text p{
  font-size:15px;
  line-height:1.7;
}

}

@media (max-width:480px){

.about-title{
  font-size:24px;
}

.about-text p{
  font-size:14px;
}

}
@media (max-width: 992px) {
  .about-container {
    flex-direction: column;
    gap: 40px;
  }

  .about-title {
    font-size: 34px;
  }

  .about-text {
    max-width: 100%;
  }
}

@media (min-width: 992px) {
  .about-container {
    align-items: flex-start;
  }

  .about-text {
    padding-top: 50px;
  }
}

@media (min-width: 992px) {
  .about-container {
    align-items: flex-start;
  }

  .about-text {
    padding-top: 50px;
  }
}

@media (min-width: 992px) {
  .about-title {
    white-space: nowrap;
  }
}
.about-image-wrap {
  position: relative;
  display: inline-block;
}

.about-image-wrap img {
  width: 100%;
  display: block;
  border-radius: 28px;
}

/* TOP LEFT ACCENT */
.about-image-wrap::before {
  content: "";
  position: absolute;
  top: -12px;
  left: -12px;
  width: 120px;
  height: 80px;
  border-top: 6px solid #6fbfb5;
  border-left: 6px solid #6fbfb5;
  border-top-left-radius: 40px;
}

/* BOTTOM RIGHT ACCENT */
.about-image-wrap::after {
  content: "";
  position: absolute;
  bottom: -12px;
  right: -12px;
  width: 120px;
  height: 80px;
  border-bottom: 6px solid #6fbfb5;
  border-right: 6px solid #6fbfb5;
  border-bottom-right-radius: 40px;
}
/* best test selling products */



.space-slider-section{
  background:#2f3471;
  padding:90px 0;
  text-align:center;
  color:#fff;
  overflow:hidden;
}

/* title */

.space-title{
    font-size: 36px;
  font-weight: 500;
  color: #ffffff;
  font-family: "CoHeadline";
  letter-spacing: 1px;
  line-height: 1.2;
  margin-bottom: 22px;
}

.space-label{
    font-family: "Sebino", sans-serif;
    font-weight: 700;
    font-size: 15px;
    letter-spacing: 1px;
    color:#b1e0e6;
    display: inline-block;
    margin-bottom: 10px;
}
.space-subtitle{
 font-family:"Sebino",sans-serif;
font-size:17px;
line-height:1.4;
color:#ffffff;
margin-bottom:16px;
  letter-spacing: 1px;
}
/* CATEGORY BUTTONS */

.space-categories{
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  gap:10px;
  margin-top:25px;
  margin-bottom:50px;
}

.cat-btn{
  display:inline-block;
  background:#5C67B2;
  color:#fff;
  padding:10px 22px;
  border-radius:40px;
  font-size:14px;
  letter-spacing:0.5px;
  transition:0.3s ease;
  font-family:'Sebino', sans-serif;
  font-weight:700;
}

.cat-btn:hover{
  background:#6fbfb5;
}


/* SLIDER */

.space-slider{
  overflow:hidden;
}

.space-track{
  display:flex;
  gap:30px;
  width:max-content;
  animation:scroll 35s linear infinite;
}

.space-slider:hover .space-track{
  animation-play-state:paused;
}

.space-card{
  width:225px;
  flex-shrink:0;
}

.space-card img{
  width:225px;
  height:255px;
  object-fit:cover;
  border-radius:20px;
}

.space-card p{
  font-family:"Inter", sans-serif;
  font-size:15px;
  color:#ffffff;
  margin-top:12px;
}


/* AUTO SCROLL */

@keyframes scroll{
  0%{transform:translateX(0)}
  100%{transform:translateX(-50%)}
}



/* CTA */

.space-cta{
  margin-top:70px;
}

.space-cta h3{
   font-size: 36px;
  font-weight: 500;
  color: #FFFFFF;
  font-family: "CoHeadline";
  letter-spacing: 1px;
  line-height: 1.2;
  margin-bottom: 22px;
}

.cta-buttons{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:18px;
  flex-wrap:wrap;
  width:100%;
}

/* Buttons */
.cta-buttons a{
  display:flex;
  justify-content:center;
  align-items:center;

  width:260px;              /* fixed equal width */
  height:46px;

  background:#6a74b8;
  color:#ffffff;

  border-radius:40px;
  text-decoration:none;

  font-family:'Sebino', sans-serif;
  font-size:15px;
  font-weight:600;

  transition:0.3s;
}

/* hover */
.cta-buttons a:hover{
  background:#5C67B2;
}



/* RESPONSIVE */

@media (max-width:600px){

.space-categories{
  flex-direction:column;
  align-items:center;
  gap:12px;
}
.cta-buttons a{
  width:80%;
  max-width:280px;
}
.cat-btn{
  width:75%;
  text-align:center;
}

}



}
@media(max-width:768px){

.space-title{
font-size:24px;
}

.space-card{
width:180px;
}

.space-card img{
width:180px;
height:210px;
}

.space-cta h3{
font-size:24px;
}

}

/* Tablet */

@media (max-width: 768px){

.space-title{
  line-height: 1.35;
}

.space-cta h3{
  line-height: 1.35;
}

.space-subtitle{
  line-height: 1.6;
}

}


/* Mobile */

@media (max-width: 480px){

.space-title{
  line-height: 1.45;
}

.space-cta h3{
  line-height: 1.45;
}

.space-subtitle{
  line-height: 1.7;
}

}
/* fog test*/

/* ===============================
   LUXURY VAPOR SYSTEM
================================ */

.hero__slider--thumbnail{
    position:relative;
    display:inline-block;
}

/* -------------------------------
   VAPOR CONTAINER
-------------------------------- */
.vapor-system{
    position:absolute;

    left:54%;              /* adjust for nozzle center */
    top:18%;               /* adjust vertical anchor */

    transform:translateX(-50%);

    width:14%;
    height:70%;

    min-width:70px;
    max-width:140px;

    pointer-events:none;
    z-index:50;
}

/* Keep image below vapor */
.slider__layer--img{
    position:relative;
    z-index:10;
    max-width:100%;
    height:auto;
}

/* -------------------------------
   CORE CONTINUOUS STREAM
-------------------------------- */
/* ===============================
   NATURAL SMOKE STYLE
================================ */

/* Core thin stream */
.vapor-core{
    position:absolute;
    bottom:0;
    left:50%;
    transform:translateX(-50%);
   width:12%;
    height:22%;

    background:linear-gradient(to top,
        rgba(255,255,255,0.8),
        rgba(255,255,255,0.4),
        transparent);

    filter:blur(3px);
    opacity:0.6;

    animation:coreFlow 3s ease-in-out infinite;
}

/* Real smoke cloud layer */
.vapor{
    position:absolute;
    bottom:0;
    left:65%;
    transform:translateX(-50%) scale(0.4);

    width:60%;
    height:80%;

    background:
        radial-gradient(ellipse at 50% 20%, rgba(255,255,255,0.65) 0%, rgba(255,255,255,0.25) 40%, transparent 75%),
        radial-gradient(ellipse at 30% 70%, rgba(255,255,255,0.4) 0%, transparent 70%),
        radial-gradient(ellipse at 70% 80%, rgba(255,255,255,0.35) 0%, transparent 70%);

    border-radius:45% 55% 50% 60% / 60% 50% 55% 45%;

    filter:blur(10px);   /* reduced blur */
    opacity:0;

    animation:smokeRise 6s ease-in-out infinite;
}

/* Natural rise animation */
@keyframes smokeRise{

    0%{
        transform:translateX(-50%) translateY(0) scale(0.4);
        opacity:0;
    }

    15%{
        opacity:0.8;
    }

    40%{
       transform:translateX(-45%) translateY(-50%) scale(1.1) rotate(3deg);
        opacity:0.6;
    }

    70%{
        transform:translateX(-60%) translateY(-100%) scale(1.8);
        opacity:0.35;
    }

    100%{
        transform:translateX(-50%) translateY(-140%) scale(2.3);
        opacity:0;
    }
}
/* Continuous timing */
.vapor-1{ animation-delay:0s; }
.vapor-2{ animation-delay:0.8s; }
.vapor-3{ animation-delay:1.6s; }
.vapor-4{ animation-delay:2.4s; }
.vapor-5{ animation-delay:3.2s; }
.vapor-6{ animation-delay:4s; }
.vapor-7{ animation-delay:4.8s; }
.vapor-8{ animation-delay:5.6s; }

/* Percentage-based rise (responsive safe) */
@keyframes vaporFlow{

    0%{
        transform:translateX(-50%) translateY(0) scale(0.4);
        opacity:0;
    }

    15%{
        opacity:0.9;
    }

    45%{
        transform:translateX(-45%) translateY(-45%) scale(1.2);
        opacity:0.65;
    }

    75%{
        transform:translateX(-60%) translateY(-90%) scale(1.9);
        opacity:0.4;
    }

    100%{
        transform:translateX(-50%) translateY(-130%) scale(2.3);
        opacity:0;
    }
}

/* -------------------------------
   MOBILE ADJUSTMENT
-------------------------------- */
@media(max-width:768px){

    .vapor-system{
        top:18%;        /* keep same anchor */
        width:20%;
        min-width:75px;
        height:72%;
    }

}

/*footer test*/


/* FOOTER BASE */

.silk-footer{
background:#2F356E;
color:#ffffff;
font-family: 'Inter', sans-serif;
padding-top:60px;
position:relative;
}
@media (max-width:768px){

.silk-footer{
    padding-bottom:70px; /* space for bottom nav */
}

}
@media(max-width:768px){
    .vapor{
        filter:blur(14px);
        opacity:0;
    }
}
/* CONTAINER */

.footer-container{
max-width:1200px;
margin:auto;
display:grid;
grid-template-columns: 2fr 1fr 2fr;
gap:80px;
}


/* LOGO */

.footer-logo{
width:180px;
margin-bottom:20px;
}


/* TEXT */

.footer-address{
line-height:1.6;
margin-bottom:15px;
}

.footer-email{
font-weight:500;
}


/* HEADINGS */

.footer-col h4{
font-size:16px;
margin-bottom:18px;
font-weight:600;
}


/* LINKS */




.footer-col ul li{
margin-bottom:12px;
color:#E7E7E7;
}





/* SOCIAL */




.social-icons a{
width:34px;
height:34px;
background:rgba(255,255,255,0.15);
border-radius:50%;
display:flex;
align-items:center;
justify-content:center;
}

.social-icons img{
width:16px;
}


/* STORE BUTTONS */

.store-buttons{
display:flex;
gap:10px;
}

.store-buttons img{
height:34px;
}


/* NEWSLETTER */

.footer-newsletter{
text-align:center;
margin-top:40px;
}

.footer-newsletter h4{
font-size:16px;
margin-bottom:5px;
}

.footer-newsletter p{
font-size:13px;
color:#cfd3ff;
margin-bottom:15px;
}


/* NEWSLETTER BOX */

.newsletter-box{
display:flex;
justify-content:center;
}

.newsletter-box input{
width:260px;
padding:10px;
border:none;
border-radius:20px 0 0 20px;
outline:none;
}

.newsletter-box button{
background:#39C7BD;
border:none;
padding:10px 22px;
border-radius:0 20px 20px 0;
color:#fff;
font-weight:600;
}


/* COPYRIGHT BAR */

.footer-bottom{
   font-family: 'Inter', sans-serif;
    font-weight: 250;      /* Regular */
    font-size: 12px;
background:#7A82C7;
text-align:center;
 padding:12px 10px;
    width:100%;
 color: #ffffff;
margin-top:40px;
}
@media (max-width:768px){
.footer-bottom{
display:block;
}
}


/* WHATSAPP */

.whatsapp-btn{
position:absolute;
right:40px;
top:120px;
}

.whatsapp-btn img{
width:50px;
}


/* RESPONSIVE */

@media(max-width:992px){

.footer-container{
grid-template-columns:1fr;
gap:40px;
text-align:center;
}

.social-icons{
justify-content:center;
}

.store-buttons{
justify-content:center;
}

.whatsapp-btn{
right:20px;
bottom:20px;
top:auto;
position:fixed;
}

}

.footer-newsletter-row{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:24px;
    padding:22px 0;
    flex-wrap:wrap;
}

.footer-newsletter-text{
    text-align:right;
}

.footer-newsletter-text h4{
    margin:0 0 4px;
    color:#fff;
    font-size:16px;
    font-weight:600;
}

.footer-newsletter-text p{
    margin:0;
    color:#d9ddff;
    font-size:12px;
    line-height:1.4;
}

.newsletter-form{
    display:flex;
    justify-content:center;
    align-items:center;
}



.newsletter-form button{
    height:42px;
    border:none;
    outline:none;
    background:#5C67B2;
    color:#fff;
    padding:0 24px;
    border-radius:0 24px 24px 0;
    font-size:14px;
    font-weight:600;
    cursor:pointer;
}

@media (max-width: 768px){
    .footer-newsletter-row{
        flex-direction:column;
        gap:14px;
        text-align:center;
    }

    .footer-newsletter-text{
        text-align:center;
    }

    .newsletter-form{
        width:100%;
        justify-content:center;
    }

   
    
}

.footer-newsletter-inline{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:18px;
    padding:18px 0 10px;
    flex-wrap:nowrap;
}

.footer-newsletter-copy{
    text-align:right;
    flex:0 0 auto;
}

.footer-newsletter-copy h4{
    margin:0 0 2px;
    font-size:16px;
    line-height:1.2;
    font-weight:600;
    color:#ffffff;
}

.footer-newsletter-copy p{
    margin:0;
    font-size:11px;
    line-height:1.2;
    color:#d9ddff;
}

.footer-newsletter-form{
    display:flex;
    align-items:center;
    justify-content:center;
    flex:0 0 auto;
    margin:0;
}

.footer-newsletter-form input{
    width:142px;
    height:24px;
    border:none;
    outline:none;
    background:#ECECEC;
    color:#7d7d7d;
    padding:0 11px;
    font-size:12px;
    border-radius:14px 0 0 14px;
    font-family: 'Sebino-Regular', sans-serif;
}

.footer-newsletter-form input::placeholder{
    color:#5C67B2;
    font-family: 'Sebino-Regular', sans-serif;
    font-size:12px;
}

.footer-newsletter-form button{
    height:24px;
    border:none;
    outline:none;
    background:#5C67B2;
    color:#ffffff;
    padding:0 16px;
    font-size:10px;
    font-weight:600;
    border-radius:0 14px 14px 0;
    cursor:pointer;
    letter-spacing:.3px;
}

/* mobile */
@media (max-width: 768px){
    .footer-newsletter-inline{
        flex-direction:column;
        gap:10px;
    }

    .footer-newsletter-copy{
        text-align:center;
    }
}

/* Center logo on smaller screens */
@media (max-width: 768px) {
    
    .footer__logo{
        display:flex;
        justify-content:center;
        align-items:center;
        text-align:center;
        margin-bottom:15px;
    }

    .footer__logo img{
        margin:0 auto;
        display:block;
        max-width:150px;
    }

    .footer-col-1{
        text-align:center;
    }

}

/* WhatsApp Floating Button */
.whatsapp-float{
    position:fixed;
    right:22px;
    bottom:95px;
    z-index:9999;
}

/* Icon */
.whatsapp-float img{
    width:52px;
    height:auto;
    border-radius:50%;
    animation: whatsappPulse 2.5s infinite;
}

/* Pulse animation */
@keyframes whatsappPulse{

0%{
box-shadow:0 0 0 0 rgba(37,211,102,0.7);
}

70%{
box-shadow:0 0 0 14px rgba(37,211,102,0);
}

100%{
box-shadow:0 0 0 0 rgba(37,211,102,0);
}

}
@media (min-width:992px){

.whatsapp-float{
bottom:120px;
right:40px;
}

}

/* Footer Headings */
.footer-col h4,
.footer-col h5,
.footer-connect-title {
    font-family: 'Sebino-Bold', sans-serif;
    font-size: 13.5px;
    font-weight: 400;
    color: #ffffff;
    margin-bottom: 12px;
    letter-spacing: 0.5px;
}

/* Paragraph text */
.footer-col p,
.footer-col span {
    font-family: 'Sebino-Regular', sans-serif;
    font-size: 12px;
    font-weight: 250;
    color: #ffffff;
}

/* Footer links */
.footer-col ul li a {
    font-family: 'Sebino-Regular', sans-serif;
    font-size: 12px;
    font-weight: 250;
    color: #ffffff;
    text-decoration: none;
    line-height: 1.8;
}
.footer-col ul {
    font-family: 'Sebino-Regular', sans-serif;
    font-size: 12px;
    font-weight: 250;
    color: #ffffff;
    text-decoration: none;
    line-height: 1.8;
}

/*trusted network test css*/

/* ===============================
   SILK AROMA TRUSTED NETWORK
================================ */

.sa-network-section{

    padding:100px 0;

    background: 
        #b1e0e6;
       
  

    overflow:hidden;
}


/* container */

.sa-network-container{
    width:90%;
    max-width:1400px;
    margin:auto;
    text-align:center;
}


/* title */

.sa-network-title{
  font-family: "Sebino", sans-serif;
    font-weight: 700;
    font-size: 15px;
    letter-spacing: 1px;
    color: #5C67B2;
    display: inline-block;
    margin-bottom: 10px;
}


/* slider wrapper */

.sa-network-slider{
    overflow:hidden;
    position:relative;
}


/* track animation */

.sa-network-track{

    display:flex;
    align-items:center;
    gap:80px;

    width:max-content;

    animation: sa-scroll 25s linear infinite;
}


/* pause animation on hover */

.sa-network-slider:hover .sa-network-track{
    animation-play-state:paused;
}


/* logo */

.sa-network-logo{

     width:160px;
    height:110px;   /* increase height */
    display:flex;
    align-items:center;
    justify-content:center;

    padding:15px;   /* important */
}


.sa-network-logo img{
    max-width:100%;
    max-height:100%;
    object-fit:contain;

    filter: grayscale(100%);

    transition: transform .35s ease, filter .35s ease;
}

/* hover effect */

.sa-network-logo:hover img{
    filter: grayscale(0) brightness(1);
    transform: scale(1.2);
}

/* animation */

@keyframes sa-scroll{

    0%{
        transform:translateX(0);
    }

    100%{
        transform:translateX(-50%);
    }
}

@media (max-width:1024px){

.sa-network-track{
    gap:60px;
}

.sa-network-logo{
    width:130px;
}

}

@media (max-width:768px){

.sa-network-track{
    gap:40px;
}

.sa-network-logo{
    width:110px;
}

.sa-network-title{
    font-size:15px;
}

}

/*new footer*/

/* FOOTER MAIN */

.sa-footer{
background:#353A73;
padding-top:60px;
color:#fff;
font-family:"Sebino", sans-serif;
position:relative;
}

/* GRID */

.sa-footer-inner{
max-width:1200px;
margin:auto;
display:grid;
grid-template-columns:repeat(4, 1fr);  /* 4 equal columns */
gap:80px;
padding:0 20px 40px;
align-items:start;
}

/* LOGO */

.sa-footer-logo{
max-width:190px;
width:100%;
height:auto;
}

/* HEADINGS */

.sa-footer-heading{
font-family:"Sebino", sans-serif;
font-weight:700;
font-size:15px;
margin-bottom:18px;
letter-spacing:1px;
}

/* LINKS */

.sa-footer-links{

list-style:none;
padding:0;
margin:0;
}

.sa-footer-links li{

font-family: "Sebino", sans-serif;
font-weight: 400; /* Sebino Regular */
font-size:14px;
opacity:.9;
margin-bottom:12px;
}

/* TEXT */

.sa-footer-text{
font-family: "Sebino", sans-serif;
font-weight: 400; /* Sebino Regular */
font-size:14px;
margin-bottom:10px;
opacity:.9;
}

/* CONNECT */

.sa-footer-connect{
margin-top:20px;
font-size:12px;
font-weight:700;
margin-bottom:10px;
}

/* SOCIAL */

.sa-footer-social{
display:flex;
gap:12px;
}

.sa-footer-social img{
width:32px;
height:32px;
}

/* NEWSLETTER */

.sa-footer-news{
display:flex;
justify-content:center;
align-items:center;
gap:30px;
padding:25px 20px;
border-top:1px solid rgba(255,255,255,.15);
}

.sa-news-text h4{
font-family: "Sebino", sans-serif;
font-weight: 700; /* Sebino Regular */
font-size:15px;
margin-bottom:4px;
}

.sa-news-text p{
font-family: "Sebino", sans-serif;
font-weight: 400; /* Sebino Regular */
font-size:14px;
opacity:.8;
}

/* FORM */

.sa-news-form{
display:flex;
}

.sa-news-form input{
height:36px;
padding:0 15px;
border:none;
outline:none;
background:#E9E9E9;
border-radius:20px 0 0 20px;
}

.sa-news-form button{
height:36px;
border:none;
background:#5C67B2;
color:#fff;
padding:0 20px;
border-radius:0 20px 20px 0;
font-size:12px;
}

/* COPYRIGHT */

.sa-footer-copy{
background:#6F78B7;
text-align:center;
font-size:12px;
padding:12px 10px;
font-family:"Inter", sans-serif;
}

/* WHATSAPP */

/* WhatsApp button inside footer */

.sa-footer{
position:relative;
}

/* desktop */

.sa-footer-whatsapp{
position:absolute;
right:40px;
bottom:40px;
z-index:20;
}

.sa-footer-whatsapp img{
width:55px;
height:auto;
display:block;
}

/* tablet */

@media (max-width:992px){

.sa-footer-whatsapp{
right:25px;
bottom:25px;
}

.sa-footer-whatsapp img{
width:48px;
}

}

/* mobile */

@media (max-width:768px){

.sa-footer-whatsapp{
position:fixed;
right:18px;
bottom:90px; /* above bottom nav */
}

.sa-footer-whatsapp img{
width:46px;
}

}

/* RESPONSIVE */

@media (max-width:900px){

.sa-footer-inner{
grid-template-columns:1fr;
gap:40px;
text-align:center;
}

.sa-footer-social{
justify-content:center;
}

.sa-footer-news{
flex-direction:column;
text-align:center;
gap:15px;
}

.sa-news-form{
justify-content:center;
}

.sa-footer-logo{
max-width:150px;
margin:auto;
}

}

@media (max-width:768px){

.sa-footer-brand{
display:flex;
justify-content:center;
align-items:center;
text-align:center;
width:100%;
margin-bottom:30px;
}

.sa-footer-logo{
display:block;
margin:0 auto;
max-width:160px;
width:100%;
height:auto;
}

}
/* HERO TITLE FIX */
.slider__maintitle{
    font-family:"Jedira", serif !important;
    font-weight:400 !important;
    font-size:56px !important;
    line-height:60px !important;
    letter-spacing:0 !important;
    color:#ABE3E4 !important;
}

/* HERO DESCRIPTION */
.slider__desc{
    font-family:"Sebino", sans-serif !important;
    font-weight:500 !important;
    font-size:16px !important;
    line-height:1.7 !important;
    color:#FFFFFF !important;
}

/* MOBILE HERO */
@media (max-width:768px){

.slider__maintitle{
    font-size:32px !important;
    line-height:38px !important;
}

.slider__desc{
    font-size:14px !important;
}

}

/*preloader*/

/* =====================================
   SILK AROMA PRELOADER
===================================== */

.ctn-preloader{
  display:flex;
  align-items:center;
  justify-content:center;
  position:fixed;
  top:0;
  left:0;
  width:100%;
  height:100%;
  z-index:9999;
  pointer-events:none;
}

/* Center animation */
.ctn-preloader .animation-preloader{
  position:absolute;
  text-align:center;
  z-index:100;
}

/* Spinner */
.ctn-preloader .animation-preloader .spinner{
  animation:spinner 1s linear infinite;
  border-radius:50%;
  border:3px solid #e5e5e5;
  border-top-color:#5C67B2;
  width:40px;
  height:40px;
  margin:0 auto 12px auto;
}

/* Loading text */
.ctn-preloader .animation-preloader .txt-loading{
  font-family:"Sebino", sans-serif;
  font-weight:700;
  font-size:15px !important;
  letter-spacing:1px;
  color:#5C67B2;
  text-align:center;
  user-select:none;
}

/* Letters */
.ctn-preloader .letters-loading{
  display:inline-block;
  position:relative;
  font-size:15px !important;
  margin:0 2px;
  color:rgba(0,0,0,0.2);
}

/* Animated letter overlay */
.ctn-preloader .letters-loading:before{
  content:attr(data-text-preloader);
  position:absolute;
  top:0;
  left:0;
  color:#5C67B2;
  opacity:0;
  transform:rotateY(-90deg);
  animation:letters-loading 5s infinite;
}

/* Delay animation for letters */
.ctn-preloader .letters-loading:nth-child(2):before{animation-delay:.2s;}
.ctn-preloader .letters-loading:nth-child(3):before{animation-delay:.3s;}
.ctn-preloader .letters-loading:nth-child(4):before{animation-delay:.4s;}
.ctn-preloader .letters-loading:nth-child(5):before{animation-delay:.5s;}
.ctn-preloader .letters-loading:nth-child(6):before{animation-delay:.6s;}
.ctn-preloader .letters-loading:nth-child(7):before{animation-delay:.7s;}

/* Left and right loader panels */
.ctn-preloader .loader-section{
  position:fixed;
  top:0;
  height:100%;
  width:calc(50% + 1px);
  background:#ffffff;
}

.ctn-preloader .loader-section.section-left{
  left:0;
}

.ctn-preloader .loader-section.section-right{
  right:0;
}

/* Hide animation when loaded */
.loaded .animation-preloader{
  opacity:0;
  transition:.5s ease-out;
}

/* Slide panels away */
.loaded .loader-section.section-left{
  transform:translateX(-101%);
  transition:.7s .3s all cubic-bezier(.1,.1,.1,1);
}

.loaded .loader-section.section-right{
  transform:translateX(101%);
  transition:.7s .3s all cubic-bezier(.1,.1,.1,1);
}

/* Spinner animation */
@keyframes spinner{
  to{ transform:rotate(360deg); }
}

/* Letter animation */
@keyframes letters-loading{
  0%,75%,100%{
    opacity:0;
    transform:rotateY(-90deg);
  }
  25%,50%{
    opacity:1;
    transform:rotateY(0deg);
  }
}

/* Responsive */
@media(max-width:767px){

  .ctn-preloader .animation-preloader .spinner{
    width:35px;
    height:35px;
  }

  .ctn-preloader .animation-preloader .txt-loading{
    font-size:14px !important;
  }

}

@media(max-width:480px){

  .ctn-preloader .animation-preloader .spinner{
    width:30px;
    height:30px;
  }

  .ctn-preloader .animation-preloader .txt-loading{
    font-size:13px !important;
  }

}


/* Remove unwanted borders */
.offcanvas__menu_ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.offcanvas__menu_li {
  width: 100%;
}

.offcanvas__menu_item {
  display: block;
  padding: 18px 30px;
  font-family: "Timex", serif;
  font-size: 18px;
  text-transform: uppercase;
  color: #ffffff;
  text-decoration: none;
  transition: 0.3s ease;
}

/* Remove template borders */
.offcanvas__menu_li,
.offcanvas__menu_item {
  border: none !important;
}

/* Hover */
.offcanvas__menu_item:hover {
  color: #ABE3E4;
  transform: translateX(5px);
}