/* ---------- RESET & BODY ---------- */
*{margin:0;padding:0;box-sizing:border-box;}
body{font-family:'Montserrat',sans-serif;color:#fff;background:#020211;overflow-x:hidden;scroll-behavior:smooth;line-height:1.6;}
h1,h2,h3,h4,h5,h6{font-weight:700;margin-bottom:1rem;}
p{margin-bottom:1rem;color:#eee;}
a{text-decoration:none;color:inherit;}
.btn{display:inline-block;padding:12px 28px;background:linear-gradient(135deg,#ff4c4c,#ff8c42);color:#fff;border-radius:50px;font-weight:600;text-transform:uppercase;letter-spacing:0.5px;transition:all 0.4s ease;box-shadow:0 6px 20px rgba(255,76,76,0.3);}
.btn:hover{transform:translateY(-3px);box-shadow:0 12px 30px rgba(255,76,76,0.5);}

/* ---------- HERO ---------- */
.hero{position:relative;text-align:center;padding:180px 20px 120px;background:url('src/PER.IMG/taylor-grote-UiVe5QvOhao-unsplash_transcpr.jpg') center/cover no-repeat;animation:bgFadeSlide 25s ease-in-out infinite;overflow:hidden;}
.hero .overlay{position:absolute;inset:0;background:rgba(0,0,0,0.6);z-index:1;}
.hero-content{position:relative;z-index:2;max-width:900px;margin:0 auto;}
.hero h1{font-size:3rem;margin-bottom:20px;}
.hero p{font-size:1.2rem;margin-bottom:30px;}

/* Typing cursor */
.cursor{display:inline-block;background:#ffcc00;width:2px;animation:blink 0.7s infinite;margin-left:2px;}
@keyframes blink{0%,50%,100%{opacity:1;}25%,75%{opacity:0;}}

/* Spirals */
.spirals{position:absolute;top:30px;right:20px;display:flex;gap:10px;}
.spiral{font-size:1rem;color:#ffcc00;animation:float 3s ease-in-out infinite;}
.spiral:nth-child(2){animation-delay:0.3s;}
.spiral:nth-child(3){animation-delay:0.6s;}
@keyframes float{0%{transform:translateY(0) rotate(0deg);}50%{transform:translateY(-8px) rotate(15deg);}100%{transform:translateY(0) rotate(0deg);}}

/* Hero BG Animation */
@keyframes bgFadeSlide{0%{background-position:20% center;filter:brightness(1.4);}25%{background-position:25% center;filter:brightness(1.2);}50%{background-position:30% center;filter:brightness(1.1);}75%{background-position:35% center;filter:brightness(1.1);}100%{background-position:20% center;filter:brightness(1.4);}}

/* Info & Grid Sections */
.info-section{padding:80px 20px;text-align:center;max-width:900px;margin:0 auto;}
.info-section h2{font-size:2.5rem;color:#ffcc00;margin-bottom:20px;}
.grid-section{display:flex;flex-direction:column;gap:60px;padding:40px 20px;}
.grid{display:flex;flex-wrap:wrap;gap:30px;align-items:center;border-radius:16px;overflow:hidden;box-shadow:0 10px 30px rgba(0,0,0,0.2);}
.grid.reverse{flex-direction:row-reverse;}
.grid img{flex:1;width:100%;border-radius:16px;object-fit:cover;transition:transform 0.3s ease,filter 0.3s ease;}
.grid img:hover{transform:scale(1.05);filter:brightness(1.1);}
.grid .text{flex:1;padding:40px;backdrop-filter:blur(6px);}
.card-glass{background:rgba(15,15,62,0.85);backdrop-filter:blur(12px);border-radius:20px;padding:30px;transition:all 0.4s ease;}
.card-glass:hover{transform:translateY(-5px);}

/* Pricing */
.pricing{text-align:center;padding:80px 20px;border-radius:20px;box-shadow:0 10px 30px rgba(0,0,0,0.2);}
.pricing h2{color:#ffcc00;font-size:2.5rem;margin-bottom:20px;}

/* Featured Product */
.featured-product{padding:60px 20px;display:flex;justify-content:center;flex-wrap:wrap;gap:30px;text-align:center;}
.featured-product .featured-content{display:flex;flex-wrap:wrap;gap:30px;max-width:1000px;}
.featured-product img{width:100%;max-width:400px;border-radius:16px;object-fit:cover;}

/* Most Visited Stores */
.store-container{display:flex;flex-wrap:wrap;gap:20px;justify-content:center;}
.store-card{width:280px;padding:20px;text-align:center;box-shadow:0 10px 25px rgba(0,0,0,0.2);transition:transform 0.3s ease;}
.store-card:hover{transform:translateY(-5px);}
.store-card img{width:100%;border-radius:12px;margin-bottom:15px;object-fit:cover;}
.store-card h3{font-size:1.2rem;margin-bottom:10px;}
.store-card .visits{font-size:0.9rem;color:#ffcc00;}




.testimonials{

 max-width:1000px;
   margin:60px auto;
  padding:40px 20px;
  text-align:center
}

.testimonials h2{
  font-size:1.8rem;
  color:#ffcc00;
  margin-bottom:25px
}

.testimonialSwiper{height:300px}

.swiper-slide{
  display:flex;
  justify-content:center;
  align-items:center
}

.card{
  width:260px;
  height:260px;
  background:rgba(15,15,62,.92);
  border-radius:16px;
  padding:20px;
  box-shadow:0 10px 25px rgba(0,0,0,.35);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  transition:.3s
}

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

.card img{
  width:70px;
  height:70px;
  border-radius:50%;
  object-fit:cover;
  border:2px solid #ffcc00;
  margin-bottom:10px
}

.card h5{margin:5px 0;font-size:1rem}
.card small{color:#bbb;margin-bottom:8px}
.card p{font-size:.85rem;color:#eee}

.swiper-button-prev,
.swiper-button-next{color:#ffcc00}

.swiper-pagination-bullet{
  background:#ffcc00;
  opacity:.6
}

.swiper-pagination-bullet-active{opacity:1}


/* ===== SCROLL REVEAL + HOVER ONLY FOR TABLET & DESKTOP ===== */
@media (min-width: 768px) {

  /* ===== SCROLL REVEAL ADD-ON ===== */
  .reveal{
    opacity: 0;
    transform: translateY(60px);
    transition: all 1s ease;
  }

  .reveal.active{
    opacity: 1;
    transform: translateY(0);
  }

  /* directions */
  .reveal-left{
    transform: translateX(-80px);
  }

  .reveal-right{
    transform: translateX(80px);
  }

  .reveal-left.active,
  .reveal-right.active{
    transform: translateX(0);
  }

  /* zoom */
  .reveal-zoom{
    transform: scale(0.9);
  }

  .reveal-zoom.active{
    transform: scale(1);
  }

  /* blur */
  .reveal-blur{
    filter: blur(8px);
  }

  .reveal-blur.active{
    filter: blur(0);
  }

  /* ===== OPTIONAL: STAGGER EFFECT ===== */
.reveal:nth-child(1){transition-delay:0.15s;}
.reveal:nth-child(2){transition-delay:0.35s;}
.reveal:nth-child(3){transition-delay:0.55s;}
.reveal:nth-child(4){transition-delay:0.75s;}

  /* smoother hover polish */
  .grid,
  .store-card,
  .card-glass,
  .card{
    transition: all 0.8s ease;
  }

  /* subtle lift on hover */
  .grid:hover,
  .store-card:hover,
  .card-glass:hover{
    transform: translateY(-6px);
  }
}

/* ===== MOBILE (optional reset to avoid weird transforms) ===== */
@media (max-width: 767px) {
  .reveal,
  .reveal-left,
  .reveal-right,
  .reveal-zoom,
  .reveal-blur{
    opacity: 1 !important;
    transform: none !important;
    filter: none !important;
  }
}