/* ------------------ Global ------------------ */
body {
  margin: 0;
  font-family: 'Poppins', sans-serif;
  background: linear-gradient(180deg, #fff8f3, #ffeaf4);
  color: #5c4a4a;
  text-align: center;
  overflow-x: hidden;
}

header {
  background: rgba(255,255,255,0.8);
  backdrop-filter: blur(8px);
  padding: 15px 0;
  border-bottom: 1px solid #f5d7e3;
  position: sticky;
  top: 0;
  z-index: 10;
}

h1 {
  font-family: 'Playfair Display', serif;
  color: #e1a3b2;
  font-size: 2.5em;
  margin: 0;
}

nav { margin-top: 8px; }
nav a { margin: 0 12px; text-decoration: none; color: #7d5b6c; font-weight: 500; transition:0.3s; }
nav a:hover { color:#e1a3b2; }

.hero { padding:80px 20px; }
.hero h2 { font-family:'Playfair Display', serif; color:#e1a3b2; font-size:2.2em; }

.sparkle-btn {
  background:#ffe6ef; border:none; border-radius:40px;
  padding:14px 28px; font-size:1em; color:#7d5b6c; font-weight:500;
  cursor:pointer; transition:all 0.3s ease; box-shadow:0 4px 8px rgba(228,185,197,0.3);
}
.sparkle-btn:hover { background:#fddae9; transform:scale(1.05); }

/* ------------------ Shop ------------------ */
.shop { padding:60px 20px; background:#fffafc; border-top:1px solid #f8dce6; }
.products { display:flex; flex-wrap:wrap; justify-content:center; gap:30px; }

.product-card {
  background:#ffffffb5; border-radius:25px; width:250px; padding:20px;
  box-shadow:0 3px 6px rgba(226,171,185,0.2); transition: transform 0.3s, box-shadow 0.3s;
  position:relative;
}
.product-card:hover { transform:translateY(-6px); box-shadow:0 8px 20px rgba(226,171,185,0.3); }

.product-card img { width:100%; border-radius:15px; }
.stars { color:#f8b7c3; margin:8px 0; }

.badge { position:absolute; top:12px; left:12px; background:#ffd6e8; color:#7d5b6c; font-size:0.8em; padding:4px 8px; border-radius:12px; }
.badge.sale { background:#ffe6f1; }

.shop-categories {
  margin-bottom: 20px;
}
.category-btn {
  background:#ffe6ef; border:none; border-radius:40px; padding:8px 20px; margin:0 5px;
  cursor:pointer; color:#7d5b6c; font-weight:500; transition:0.3s;
}
.category-btn:hover { background:#fddae9; transform:scale(1.05); }

/* ------------------ About / Reviews ------------------ */
.about, .reviews { padding:60px 20px; }
.review { background:#ffffffb5; margin:20px auto; border-radius:20px; max-width:500px; padding:20px; box-shadow:0 3px 6px rgba(226,171,185,0.2); }

footer { padding:20px; font-size:0.9em; color:#a28392; }

/* ------------------ Floating Sparkles ------------------ */
.floating-sparkle {
  position:absolute; width:8px; height:8px;
  background: radial-gradient(circle,#ffd6e8 0%,#fff 70%);
  border-radius:50%; opacity:0.8; pointer-events:none;
  animation: floatUp linear infinite;
}
@keyframes floatUp { 0%{transform:translateY(0) scale(1);opacity:0.8;} 50%{transform:translateY(-20px) scale(1.2);opacity:0.6;} 100%{transform:translateY(-40px) scale(1);opacity:0.8;} }

/* ------------------ Login & Cart Popups ------------------ */
.login-popup, .cart-popup {
  display:none; position:fixed; top:0; left:0; width:100%; height:100%;
  background:rgba(255,240,247,0.8); backdrop-filter:blur(6px);
  justify-content:center; align-items:center;
}
.popup-content {
  background:#fffafc; border-radius:25px; padding:30px;
  box-shadow:0 5px 15px rgba(200,150,170,0.3); max-width:300px; width:80%;
}
.popup-content input { display:block; width:100%; margin:10px 0; padding:10px; border:1px solid #f3cddd; border-radius:10px; }
.close { color:#a67d8a; cursor:pointer; margin-top:15px; }

/* ------------------ Sparkle Click ------------------ */
.sparkle { position:absolute; width:6px; height:6px; background:radial-gradient(circle,#ffd6e8 0%,#fff 70%); border-radius:50%; pointer-events:none; animation:sparkleFade 0.8s linear forwards; }
@keyframes sparkleFade { 0%{opacity:1;transform:scale(1);}100%{opacity:0;transform:scale(0.5) translateY(-10px);} }