/* ================================================================
   Vandana Mall — Premium Homepage (gold/cream)  •  loaded only on index.php
   Scoped with hp- prefix to avoid clashing with existing styles.
   ================================================================ */
:root{
  --hp-gold:#d4a373; --hp-gold-d:#b8864e; --hp-ink:#1a1a1a; --hp-muted:#8a8a8a;
  --hp-line:#eee; --hp-cream:#faf7f2; --hp-pink:#f7e9f0; --hp-red:#e0325b; --hp-green:#16a34a;
  --hp-radius:16px; --hp-shadow:0 6px 22px rgba(0,0,0,.06); --hp-shadow-lg:0 16px 40px rgba(0,0,0,.12);
  --hp-font:'Inter','Poppins',sans-serif;
}
/* homepage replaces the plain header top-bar with the offer strip + benefits bar */
.top-bar{display:none !important;}

/* page gutter (same feel as index) — fixes edge-to-edge sticking on mens/other pages */
.container{max-width:1280px;margin:0 auto;padding:0 20px;}
@media(max-width:560px){.container{padding:0 12px;}}

.hp-section{margin:30px 0;}
.hp-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;gap:10px;flex-wrap:wrap;}
.hp-title{font-family:var(--hp-font);font-size:1.35rem;font-weight:800;color:var(--hp-ink);display:inline-flex;align-items:center;gap:9px;letter-spacing:-.3px;}
.hp-title.flash i{color:#f5a623;}
.hp-title.flash .hp-flash-timer{background:var(--hp-red);color:#fff;font-size:.7rem;font-weight:700;padding:4px 10px;border-radius:8px;letter-spacing:.5px;}
.hp-viewall{font-size:.82rem;font-weight:700;color:var(--hp-gold-d);text-decoration:none;white-space:nowrap;}
.hp-viewall:hover{color:var(--hp-ink);}

/* ---------- Offer strip ---------- */
.hp-offer-strip{background:linear-gradient(90deg,#4a1d4f,#7a2a5d 55%,#b8864e);color:#fff;font-family:var(--hp-font);}
.hp-offer-inner{max-width:1280px;margin:0 auto;padding:9px 20px;display:flex;align-items:center;gap:16px;flex-wrap:wrap;justify-content:center;font-size:.85rem;}
.hp-offer-msg i{color:#ffd166;margin-right:4px;}
.hp-offer-code b{color:#ffd166;letter-spacing:.5px;}
.hp-offer-timer{display:inline-flex;align-items:center;gap:3px;font-weight:700;}
.hp-offer-timer span{background:rgba(255,255,255,.16);border-radius:5px;padding:3px 6px;min-width:26px;text-align:center;font-variant-numeric:tabular-nums;}
.hp-offer-timer i{opacity:.7;font-style:normal;}
.hp-offer-btn{background:#ffd166;color:#3a1533;font-weight:800;font-size:.8rem;padding:6px 18px;border-radius:20px;text-decoration:none;}
.hp-offer-btn:hover{background:#fff;}

/* ---------- Benefits bar ---------- */
.hp-benefits{background:var(--hp-cream);border:1px solid var(--hp-line);border-radius:var(--hp-radius);margin:16px 0;box-shadow:var(--hp-shadow);}
.hp-benefits-inner{margin:0 auto;padding:14px 22px;display:flex;align-items:center;justify-content:space-around;gap:16px;flex-wrap:wrap;font-family:var(--hp-font);}
.hp-benefit{display:flex;align-items:center;gap:10px;font-size:.8rem;}
.hp-benefit i{color:var(--hp-gold);font-size:1.2rem;width:24px;text-align:center;}
.hp-benefit b{display:block;color:var(--hp-ink);font-size:.82rem;}
.hp-benefit span{color:var(--hp-muted);font-size:.72rem;}
.hp-benefit.coupons{background:#fff;border:1px dashed var(--hp-gold);border-radius:30px;padding:6px 8px 6px 14px;}
.hp-view-coupons{background:var(--hp-gold);color:#1a1a1a;border:none;font-weight:700;font-size:.74rem;padding:6px 14px;border-radius:20px;cursor:pointer;font-family:inherit;}
.hp-view-coupons:hover{background:var(--hp-gold-d);}

/* Coupon modal */
.hp-coupon-modal{display:none;position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:10000;align-items:center;justify-content:center;padding:16px;}
.hp-coupon-modal.open{display:flex;}
.hp-coupon-box{background:#fff;border-radius:18px;max-width:460px;width:100%;max-height:88vh;overflow:auto;font-family:var(--hp-font);}
.hp-coupon-head{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--hp-line);}
.hp-coupon-head h3{font-size:1.05rem;font-weight:800;display:flex;gap:8px;align-items:center;} .hp-coupon-head h3 i{color:var(--hp-gold);}
.hp-coupon-head button{background:#f3f0ec;border:none;width:32px;height:32px;border-radius:50%;font-size:1.2rem;cursor:pointer;color:#777;}
.hp-coupon-list{padding:14px 18px;display:flex;flex-direction:column;gap:10px;}
.hp-coupon-empty{text-align:center;color:var(--hp-muted);padding:24px;}
.hp-coupon{display:flex;align-items:center;justify-content:space-between;gap:12px;border:1px dashed var(--hp-gold);border-radius:12px;padding:12px 14px;background:var(--hp-cream);}
.hp-coupon-off{font-weight:800;color:var(--hp-red);}
.hp-coupon-min{font-size:.72rem;color:var(--hp-muted);}
.hp-coupon-ttl{font-size:.72rem;color:var(--hp-ink);margin-top:2px;}
.hp-coupon-code{font-weight:800;letter-spacing:1px;border:1px dashed #bbb;border-radius:6px;padding:4px 8px;font-size:.8rem;cursor:pointer;background:#fff;}
.hp-coupon-copy{margin-top:6px;display:block;background:var(--hp-gold);color:#1a1a1a;border:none;font-weight:700;font-size:.72rem;padding:5px 12px;border-radius:16px;cursor:pointer;}

/* ---------- Hero ---------- */
.hp-hero{display:grid;grid-template-columns:1.7fr 1fr;gap:16px;margin:18px 0;}
.hp-hero-main{position:relative;border-radius:var(--hp-radius);overflow:hidden;min-height:340px;box-shadow:var(--hp-shadow);background:var(--hp-pink);}
.hp-hero-slide{position:absolute;inset:0;background-size:cover;background-position:center;display:none;padding:38px 40px;}
.hp-hero-slide.active{display:flex;align-items:center;animation:hpFade .5s ease;}
@keyframes hpFade{from{opacity:.3}to{opacity:1}}
.hp-hero-slide::before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(255,255,255,.92),rgba(255,255,255,.55) 45%,transparent 70%);}
.hp-hero-text{position:relative;max-width:52%;font-family:var(--hp-font);}
.hp-hero-badge{display:inline-block;background:var(--hp-red);color:#fff;font-weight:800;font-size:.72rem;padding:5px 12px;border-radius:20px;margin-bottom:12px;}
.hp-hero-text h1{font-size:2.3rem;line-height:1.1;font-weight:800;color:var(--hp-ink);margin-bottom:10px;}
.hp-hero-text h1 span{color:var(--hp-gold-d);display:block;}
.hp-hero-text p{color:#555;font-size:.9rem;margin-bottom:18px;}
.hp-hero-cta{display:flex;gap:12px;flex-wrap:wrap;}
.hp-btn-primary{background:var(--hp-ink);color:#fff;font-weight:700;font-size:.85rem;padding:11px 26px;border-radius:30px;text-decoration:none;transition:.2s;}
.hp-btn-primary:hover{background:var(--hp-gold-d);}
.hp-btn-ghost{background:#fff;color:var(--hp-ink);font-weight:700;font-size:.85rem;padding:11px 24px;border-radius:30px;text-decoration:none;border:1px solid var(--hp-line);}
.hp-btn-ghost:hover{border-color:var(--hp-gold);color:var(--hp-gold-d);}
.hp-hero-trust{margin-top:16px;font-size:.76rem;color:#555;} .hp-hero-trust .stars{color:var(--hp-gold);} .hp-hero-trust b{color:var(--hp-ink);}
.hp-hero-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:3;width:38px;height:38px;border-radius:50%;border:none;background:rgba(255,255,255,.9);color:#333;font-size:1.4rem;line-height:1;cursor:pointer;box-shadow:var(--hp-shadow);}
.hp-hero-arrow.prev{left:12px;} .hp-hero-arrow.next{right:12px;}
.hp-hero-dots{position:absolute;bottom:14px;left:40px;display:flex;gap:6px;z-index:3;}
.hp-hero-dots button{width:8px;height:8px;border-radius:50%;border:none;background:rgba(0,0,0,.25);cursor:pointer;padding:0;}
.hp-hero-dots button.active{background:var(--hp-gold-d);width:20px;border-radius:4px;}
.hp-hero-side{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:14px;}
.hp-hero-card{position:relative;border-radius:14px;overflow:hidden;background:var(--hp-pink) center/cover;min-height:158px;text-decoration:none;box-shadow:var(--hp-shadow);}
.hp-hero-card::before{content:'';position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.55),transparent 60%);}
.hp-hero-card-in{position:absolute;left:0;right:0;bottom:0;padding:12px 14px;color:#fff;font-family:var(--hp-font);}
.hp-hero-card-in b{display:block;font-size:.95rem;} .hp-hero-card-in span{font-size:.72rem;color:#ffd9be;font-weight:600;}

/* ---------- Category circular icons ---------- */
.hp-cats{display:flex;gap:22px;overflow-x:auto;padding:6px 2px 10px;scrollbar-width:none;}
.hp-cats::-webkit-scrollbar{display:none;}
.hp-cat{flex:0 0 auto;width:84px;text-align:center;text-decoration:none;}
.hp-cat-ic{width:74px;height:74px;border-radius:50%;overflow:hidden;display:block;margin:0 auto 8px;background:var(--hp-pink);border:1px solid #f0e3ec;}
.hp-cat-ic img{width:100%;height:100%;object-fit:cover;transition:.3s;}
.hp-cat:hover .hp-cat-ic img{transform:scale(1.08);}
.hp-cat-nm{font-size:.76rem;font-weight:600;color:#333;font-family:var(--hp-font);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block;}

/* ---------- Rails ---------- */
.hp-rail{position:relative;}
.hp-rail-track{display:flex;gap:16px;overflow-x:auto;padding:4px 2px 10px;scrollbar-width:none;scroll-behavior:smooth;}
.hp-rail-track::-webkit-scrollbar{display:none;}
.hp-rail-arrow{position:absolute;top:42%;transform:translateY(-50%);z-index:4;width:40px;height:40px;border-radius:50%;border:none;background:#fff;color:#333;font-size:1.5rem;line-height:1;cursor:pointer;box-shadow:var(--hp-shadow-lg);}
.hp-rail-arrow.prev{left:-8px;} .hp-rail-arrow.next{right:-8px;}
.hp-rail-arrow:hover{background:var(--hp-gold);color:#fff;}

/* wrapping grid of hp-cards (New Arrivals) — reuses the same .hp-card as the rails
   (matches their size on desktop) but wraps into rows instead of scrolling */
.hp-cardgrid{display:flex;flex-wrap:wrap;gap:18px 16px;padding:4px 2px 6px;}
/* on narrow screens force a clean 2-per-row grid so cards don't drop to 1 each */
@media (max-width:640px){
  .hp-cardgrid{gap:14px 12px;}
  .hp-cardgrid .hp-card{width:calc(50% - 6px);}
}

/* continuous auto-rotating (marquee) rail */
.hp-rail-loop{overflow:hidden;position:relative;}
.hp-rail-track.loop{width:max-content;overflow:visible;flex-wrap:nowrap;animation-name:hp-marq;animation-timing-function:linear;animation-iteration-count:infinite;}
.hp-rail-loop:hover .hp-rail-track.loop{animation-play-state:paused;}
@keyframes hp-marq{from{transform:translateX(0);}to{transform:translateX(-50%);}}

/* ---------- Product card ---------- */
.hp-card{flex:0 0 auto;width:210px;background:#fff;border:1px solid var(--hp-line);border-radius:14px;overflow:hidden;cursor:pointer;transition:.25s;display:flex;flex-direction:column;font-family:var(--hp-font);}
.hp-card:hover{box-shadow:var(--hp-shadow-lg);transform:translateY(-4px);border-color:#f0e3d5;}
.hp-card-media{position:relative;height:240px;background:var(--hp-cream);overflow:hidden;}
.hp-card-media img{width:100%;height:100%;object-fit:cover;transition:.5s;}
.hp-card:hover .hp-card-media img{transform:scale(1.06);}
.hp-badge{position:absolute;top:10px;left:10px;background:var(--hp-red);color:#fff;font-size:.66rem;font-weight:800;padding:3px 9px;border-radius:6px;z-index:2;}
.hp-card .wishlist{position:absolute;top:8px;right:8px;width:32px;height:32px;border-radius:50%;background:rgba(255,255,255,.95);border:none;cursor:pointer;color:#888;box-shadow:0 2px 8px rgba(0,0,0,.1);z-index:2;}
.hp-card .wishlist:hover,.hp-card .wishlist .fas{color:var(--hp-gold);}
.hp-card-body{padding:12px 12px 14px;display:flex;flex-direction:column;gap:3px;flex:1;}
.hp-card-brand{font-size:.68rem;color:var(--hp-muted);text-transform:uppercase;letter-spacing:.4px;font-weight:600;}
.hp-card-name{font-size:.85rem;font-weight:600;color:var(--hp-ink);line-height:1.3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.hp-card-rate{font-size:.72rem;color:#555;} .hp-card-rate i{color:var(--hp-gold);} .hp-card-rate span{color:var(--hp-muted);margin-left:3px;}
.hp-card-price{display:flex;align-items:baseline;gap:7px;flex-wrap:wrap;margin-top:2px;}
.hp-card-price .cur{font-size:1rem;font-weight:800;color:var(--hp-ink);}
.hp-card-price .mrp{font-size:.76rem;color:var(--hp-muted);text-decoration:line-through;}
.hp-card-price .off{font-size:.72rem;color:var(--hp-green);font-weight:700;}
.hp-card-stock{font-size:.7rem;color:var(--hp-red);font-weight:600;}
.hp-card-cart{margin-top:8px;background:transparent;border:1px solid var(--hp-gold);color:var(--hp-gold-d);font-weight:700;font-size:.76rem;padding:8px;border-radius:22px;cursor:pointer;font-family:inherit;display:flex;align-items:center;justify-content:center;gap:6px;transition:.2s;}
.hp-card-cart:hover{background:var(--hp-gold);color:#1a1a1a;}
.hp-card-mini{width:150px;} .hp-card-mini .hp-card-media{height:150px;}

/* ---------- Shop by category rectangular ---------- */
.hp-sbc{flex:0 0 auto;width:150px;text-align:center;text-decoration:none;}
.hp-sbc-img{width:100%;height:150px;border-radius:14px;overflow:hidden;background:var(--hp-cream);border:1px solid var(--hp-line);}
.hp-sbc-img img{width:100%;height:100%;object-fit:cover;transition:.4s;}
.hp-sbc:hover .hp-sbc-img img{transform:scale(1.07);}
.hp-sbc-nm{display:block;margin-top:9px;font-size:.82rem;font-weight:600;color:#333;font-family:var(--hp-font);}

/* ---------- Promo tiles ---------- */
.hp-promos{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:26px 0;}
.hp-promo{position:relative;border-radius:var(--hp-radius);padding:26px 22px;min-height:150px;color:#fff;font-family:var(--hp-font);display:flex;align-items:center;justify-content:center;text-align:center;box-shadow:var(--hp-shadow);overflow:hidden;background-size:cover;background-position:center;}
.hp-promo::before{content:'';position:absolute;inset:0;z-index:0;}
.hp-promo.p1::before{background:linear-gradient(120deg,rgba(91,42,134,.9),rgba(142,59,158,.78));}
.hp-promo.p2::before{background:linear-gradient(120deg,rgba(246,183,60,.9),rgba(239,142,56,.78));}
.hp-promo.p3::before{background:linear-gradient(120deg,rgba(244,115,176,.9),rgba(236,72,153,.78));}
.hp-promo-txt{position:relative;z-index:1;}
.hp-promo h4{font-size:1.35rem;font-weight:800;}
.hp-promo p{font-size:.85rem;opacity:.95;margin:3px 0 9px;}
.hp-promo-code{font-size:.75rem;margin-bottom:11px;} .hp-promo-code b{background:rgba(255,255,255,.28);padding:2px 8px;border-radius:6px;}
.hp-promo-btn{display:inline-block;background:#fff;color:#1a1a1a;font-weight:800;font-size:.76rem;padding:8px 20px;border-radius:20px;text-decoration:none;}
.hp-promo-btn:hover{background:#ffd166;}

/* ---------- Trust badges ---------- */
.hp-trust{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;background:var(--hp-cream);border:1px solid var(--hp-line);border-radius:var(--hp-radius);padding:18px 22px;margin:30px 0;}
.hp-trust-item{display:flex;align-items:center;gap:10px;font-family:var(--hp-font);}
.hp-trust-item i{color:var(--hp-gold);font-size:1.5rem;width:30px;text-align:center;}
.hp-trust-item b{display:block;font-size:.82rem;color:var(--hp-ink);} .hp-trust-item span{font-size:.7rem;color:var(--hp-muted);}

/* ---------- Footer promos ---------- */
.hp-footer-promos{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:30px 0;font-family:var(--hp-font);}
.hp-fp{position:relative;overflow:hidden;border-radius:var(--hp-radius);padding:26px;color:#fff;box-shadow:var(--hp-shadow);min-height:200px;display:flex;align-items:center;background-size:cover;background-position:center;}
.hp-fp::before{content:'';position:absolute;inset:0;z-index:0;}
.hp-fp-news::before{background:linear-gradient(120deg,rgba(58,21,51,.94),rgba(109,42,92,.85));}
.hp-fp-mega::before{background:linear-gradient(120deg,rgba(246,183,60,.94),rgba(239,125,52,.88));}
.hp-fp-in{position:relative;z-index:1;width:100%;}
.hp-fp h4{font-size:1.25rem;font-weight:800;} .hp-fp p{font-size:.84rem;opacity:.95;margin:4px 0 14px;}
.hp-news-form{display:flex;gap:8px;flex-wrap:wrap;}
.hp-news-form input{flex:1;min-width:150px;border:none;border-radius:10px;padding:12px 14px;font-family:inherit;font-size:.84rem;outline:none;color:#1a1a1a;}
.hp-news-form button{background:var(--hp-gold);color:#1a1a1a;border:none;font-weight:800;padding:0 22px;border-radius:10px;cursor:pointer;font-family:inherit;}
.hp-news-msg{font-size:.76rem;margin-top:8px;min-height:16px;} .hp-news-msg.ok{color:#9ff5c0;} .hp-news-msg.err{color:#ffc2c2;}
.hp-mega-big{font-size:2rem;font-weight:900;line-height:1;margin:2px 0;}

/* ---------- Toast ---------- */
.hp-toast{position:fixed;bottom:26px;left:50%;transform:translateX(-50%) translateY(120px);background:#1a1a1a;color:#fff;padding:12px 22px;border-radius:30px;font-size:.85rem;font-family:var(--hp-font);z-index:100001;opacity:0;transition:.35s;}
.hp-toast.show{transform:translateX(-50%) translateY(0);opacity:1;}

/* ---------- Responsive ---------- */
@media (max-width:900px){
  .hp-hero{grid-template-columns:1fr;} .hp-hero-side{grid-template-columns:repeat(2,1fr);grid-template-rows:none;}
  .hp-hero-text{max-width:70%;} .hp-hero-text h1{font-size:1.8rem;}
  .hp-promos{grid-template-columns:1fr;} .hp-footer-promos{grid-template-columns:1fr;}
  .hp-trust{gap:16px;justify-content:flex-start;}
}
@media (max-width:560px){
  .hp-title{font-size:1.1rem;} .hp-hero-main{min-height:260px;} .hp-hero-slide{padding:22px;}
  .hp-hero-text{max-width:82%;} .hp-hero-text h1{font-size:1.4rem;}
  .hp-card{width:160px;} .hp-card-media{height:190px;}
  .hp-sbc{width:120px;} .hp-sbc-img{height:120px;}
  .hp-cat{width:72px;} .hp-cat-ic{width:62px;height:62px;}
  .hp-rail-arrow,.hp-hero-arrow{display:none;}
  .hp-offer-inner{font-size:.76rem;gap:10px;padding:8px 12px;}
  .hp-benefit span{display:none;}
}