@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@500;600;700&family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;1,400&display=swap');
:root{
  --black:#050505; --charcoal:#0B0B0B;
  --gold:#D4AF37; --gold-light:#F6D77A; --cream:#FFF1C7;
  --line:rgba(212,175,55,.35);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:env(safe-area-inset-top,0px)}
body{background:var(--black);color:var(--cream);font-family:'Cormorant Garamond',serif;font-size:18px;overflow-x:hidden;
  padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer}
img{max-width:100%}

/* INTRO */
#intro{position:fixed;inset:0;background:radial-gradient(ellipse at 50% 40%,#1a1206 0%,#050505 70%);
  display:flex;align-items:center;justify-content:center;z-index:9999;transition:opacity 1.1s ease, visibility 1.1s}
#intro .logo{font-family:'Cinzel',serif;text-align:center;opacity:0;transform:scale(.96);animation:introIn 2.2s ease forwards .3s}
#intro .logo h1{font-size:clamp(2.5rem,8vw,5.5rem);letter-spacing:.35em;
  background:linear-gradient(100deg,#8a6a1f,var(--gold) 30%,var(--gold-light) 50%,var(--gold) 70%,#8a6a1f);
  background-size:250% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:shine 3.5s linear infinite}
#intro .logo p{margin-top:.6rem;letter-spacing:.6em;font-size:.9rem;color:var(--gold-light);font-style:italic}
@keyframes introIn{to{opacity:1;transform:scale(1)}}
@keyframes shine{0%{background-position:0% 0}100%{background-position:250% 0}}
#intro.hide{opacity:0;visibility:hidden}
.particle{position:absolute;width:2px;height:2px;background:var(--gold-light);border-radius:50%;animation:drift linear infinite}
@keyframes drift{from{transform:translateY(0)}to{transform:translateY(-100vh)}}

/* HEADER */
header{position:sticky;top:env(safe-area-inset-top,0px);z-index:500;background:rgba(5,5,5,.6);
  backdrop-filter:blur(6px);border-bottom:1px solid var(--line)}
header.scrolled{background:rgba(5,5,5,.92);backdrop-filter:blur(14px)}
.nav-wrap{max-width:1300px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;padding:.9rem 1.5rem}
.brand{font-family:'Cinzel',serif;font-size:1.3rem;letter-spacing:.2em;
  background:linear-gradient(120deg,#a9812c,var(--gold-light));-webkit-background-clip:text;background-clip:text;color:transparent}
nav.primary{display:flex;gap:2.2rem}
nav.primary a{font-size:.95rem;letter-spacing:.12em;position:relative;padding-bottom:4px}
nav.primary a::after{content:'';position:absolute;left:0;bottom:0;width:0;height:1px;background:var(--gold);transition:.35s}
nav.primary a:hover{color:var(--gold-light)}
nav.primary a:hover::after{width:100%}
.icons{display:flex;gap:1.3rem;align-items:center;font-size:1.15rem}
.icons button,.icons a{background:none;border:none;color:var(--cream);position:relative}
.icons button:hover,.icons a:hover{color:var(--gold-light)}
.badge{position:absolute;top:-8px;right:-10px;background:var(--gold);color:#000;font-size:.6rem;font-family:'Cinzel';
  border-radius:50%;width:16px;height:16px;display:flex;align-items:center;justify-content:center}
.hamburger{display:none;background:none;border:none;color:var(--gold);font-size:1.4rem}
#searchBox{display:none;position:absolute;top:100%;left:0;right:0;background:rgba(5,5,5,.97);border-top:1px solid var(--line);padding:1rem 1.5rem}
#searchBox.open{display:block}
#searchBox input{width:100%;max-width:600px;background:transparent;border:none;border-bottom:1px solid var(--gold);
  color:var(--cream);font-size:1.3rem;padding:.4rem 0;outline:none;font-family:inherit}
.mobile-nav{display:none;flex-direction:column;gap:1rem;padding:1rem 1.5rem;background:rgba(5,5,5,.97);border-top:1px solid var(--line)}
.mobile-nav.open{display:flex}

/* HERO (home only) */
.hero{position:relative;min-height:88vh;display:flex;align-items:center;overflow:hidden;
  background:radial-gradient(ellipse at 30% 30%,#1c1408,#0b0b0b 55%,#050505)}
.hero::before{content:'';position:absolute;inset:0;background:
  radial-gradient(circle at 80% 20%,rgba(212,175,55,.12),transparent 40%),
  radial-gradient(circle at 20% 80%,rgba(246,215,122,.08),transparent 45%);animation:slowzoom 18s ease-in-out infinite alternate}
@keyframes slowzoom{to{transform:scale(1.06)}}
.hero-inner{position:relative;z-index:2;max-width:1300px;margin:0 auto;padding:2rem}
.hero-inner .tag{letter-spacing:.5em;color:var(--gold);font-size:.85rem;opacity:0;animation:fadeUp 1s ease forwards 2.6s}
.hero-inner h1{font-family:'Cinzel',serif;font-size:clamp(3rem,9vw,6.5rem);line-height:1;margin:.5rem 0;
  background:linear-gradient(100deg,#8a6a1f,var(--gold) 40%,var(--gold-light) 55%,var(--gold) 70%,#8a6a1f);
  background-size:220% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;
  animation:fadeUp 1s ease forwards 2.8s, shine 6s linear infinite 3.8s;opacity:0}
.hero-inner .lede{max-width:520px;color:#e9dcb8;font-size:1.15rem;line-height:1.6;opacity:0;animation:fadeUp 1s ease forwards 3.1s}
.hero-btns{display:flex;gap:1rem;margin-top:2rem;opacity:0;animation:fadeUp 1s ease forwards 3.4s;flex-wrap:wrap}
@keyframes fadeUp{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}
.btn{padding:.9rem 2rem;border:1px solid var(--gold);background:transparent;color:var(--gold-light);
  letter-spacing:.15em;font-size:.85rem;transition:.4s;font-family:'Cinzel',serif;display:inline-block}
.btn:hover{background:var(--gold);color:#000}
.btn.solid{background:var(--gold);color:#000}
.btn.solid:hover{background:var(--gold-light)}
.btn.block{width:100%;text-align:center}

/* PAGE HEADER BAND (category & static pages) */
.page-band{background:linear-gradient(180deg,#140f08,#050505);border-bottom:1px solid var(--line);padding:3.5rem 1.5rem 2rem;text-align:center}
.page-band h1{font-family:'Cinzel';font-size:2.4rem;color:var(--gold-light)}
.page-band p{color:#c9b98a;font-style:italic;margin-top:.5rem}
.crumbs{font-size:.85rem;color:#a99a6c;margin-top:.8rem}
.crumbs a:hover{color:var(--gold-light)}

section{max-width:1300px;margin:0 auto;padding:4rem 1.5rem}
.sec-head{text-align:center;margin-bottom:2.5rem}
.sec-head h2{font-family:'Cinzel';font-size:2.2rem;color:var(--gold-light)}
.sec-head p{color:#c9b98a;margin-top:.4rem;font-style:italic}

.cat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.2rem}
.cat-card{position:relative;height:340px;border:1px solid var(--line);overflow:hidden;display:block}
.cat-card img{width:100%;height:100%;object-fit:cover;transition:transform .8s ease;filter:brightness(.55)}
.cat-card:hover img{transform:scale(1.1)}
.cat-card .ov{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;padding:1.4rem;
  background:linear-gradient(0deg,rgba(0,0,0,.85),transparent 60%)}
.cat-card h3{font-family:'Cinzel';color:var(--gold-light);letter-spacing:.1em}
.cat-card p{font-size:.9rem;color:#d8c99a;margin:.3rem 0 .6rem}
.cat-card span{font-size:.75rem;letter-spacing:.15em;color:var(--gold);border-bottom:1px solid var(--gold)}

.prod-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.3rem}
.card{background:linear-gradient(160deg,#0d0a06,#080605);border:1px solid var(--line);padding:1rem;transition:.4s;position:relative}
.card:hover{border-color:var(--gold);box-shadow:0 8px 30px rgba(212,175,55,.15);transform:translateY(-4px)}
.card a.thumb{display:block}
.card img{width:100%;height:180px;object-fit:cover;margin-bottom:.8rem}
.card h4{font-size:1.05rem;color:var(--cream)}
.card h4:hover{color:var(--gold-light)}
.stars{color:var(--gold);font-size:.85rem;margin:.2rem 0}
.price{display:flex;gap:.6rem;align-items:baseline;margin:.3rem 0;flex-wrap:wrap}
.price .now{color:var(--gold-light);font-size:1.2rem;font-weight:600}
.price .was{color:#8a8070;text-decoration:line-through;font-size:.9rem}
.price .off{color:#e39a4a;font-size:.75rem}
.card-actions{display:flex;gap:.5rem;margin-top:.6rem}
.card-actions button{flex:1;padding:.5rem;font-size:.75rem;letter-spacing:.08em;border:1px solid var(--gold);background:transparent;color:var(--gold-light)}
.card-actions button:hover{background:var(--gold);color:#000}
.wish{background:none;border:none;color:var(--gold);font-size:1.2rem;position:absolute;top:1rem;right:1rem;z-index:2}
.wish.active{color:#e34a6f}
.empty-note{color:#8a7d55;grid-column:1/-1;text-align:center;padding:2rem 0}

/* DRAWERS */
.drawer{position:fixed;top:0;right:-420px;width:400px;max-width:92vw;height:100%;background:#0a0805;
  border-left:1px solid var(--gold);z-index:900;transition:right .45s ease;display:flex;flex-direction:column;
  padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
.drawer.open{right:0}
.drawer-head{display:flex;justify-content:space-between;align-items:center;padding:1.2rem 1.4rem;border-bottom:1px solid var(--line)}
.drawer-head h3{font-family:'Cinzel';color:var(--gold-light)}
.drawer-body{flex:1;overflow-y:auto;padding:1rem 1.4rem}
.drawer-item{display:flex;gap:.8rem;border-bottom:1px solid #201a10;padding:.8rem 0}
.drawer-item img{width:64px;height:64px;object-fit:cover}
.qty{display:flex;align-items:center;gap:.5rem;margin-top:.3rem}
.qty button{background:none;border:1px solid var(--gold);color:var(--gold);width:22px;height:22px}
.drawer-foot{padding:1.2rem 1.4rem;border-top:1px solid var(--line)}
.drawer-foot .row{display:flex;justify-content:space-between;color:#c9b98a;margin:.2rem 0}
.overlay{position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:800;display:none}
.overlay.show{display:block}
.close-x{background:none;border:none;color:var(--gold);font-size:1.3rem}
.remove{color:#e34a6f;background:none;border:none;font-size:.8rem;margin-top:.3rem}

#toast{position:fixed;bottom:30px;left:50%;transform:translateX(-50%) translateY(20px);background:#111;
  border:1px solid var(--gold);color:var(--gold-light);padding:.8rem 1.6rem;font-size:.95rem;z-index:1000;
  opacity:0;transition:.4s;pointer-events:none}
#toast.show{opacity:1;transform:translateX(-50%) translateY(0)}

/* FOOTER (Flipkart-style) */
footer{background:#070502;border-top:4px solid var(--line)}
.foot-top{max-width:1300px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr 1fr 1fr 1.3fr 1.3fr;gap:1.5rem;padding:2.8rem 1.5rem}
footer h5{color:#7d7266;letter-spacing:.05em;margin-bottom:.9rem;font-family:'Cinzel';font-size:.78rem;font-weight:500}
footer ul{list-style:none}
footer li{margin:.55rem 0}
footer li a{color:#d8cba0;font-size:.92rem}
footer li a:hover{color:var(--gold-light)}
.foot-top address{font-style:normal;color:#c3b48a;font-size:.9rem;line-height:1.6}
.foot-social{display:flex;gap:.8rem;margin-top:.8rem;font-size:1.1rem}
.foot-brand-line{max-width:1300px;margin:0 auto;padding:1.8rem 1.5rem;border-top:1px solid var(--line);
  display:flex;justify-content:space-between;flex-wrap:wrap;gap:1rem;align-items:center}
.foot-brand-line h2{font-family:'Cinzel';color:var(--gold-light);font-size:1.5rem}
.foot-brand-line .tag{color:#a99a6c;font-style:italic;font-size:.95rem}
.foot-owner{color:var(--gold);letter-spacing:.15em;font-size:.8rem;font-family:'Cinzel';margin-top:.4rem}
.foot-bottom{max-width:1300px;margin:0 auto;padding:1.2rem 1.5rem;border-top:1px solid var(--line);
  display:flex;justify-content:space-between;flex-wrap:wrap;gap:1rem;color:#7a6f52;font-size:.85rem}

/* AUTH & ACCOUNT PAGES */
.auth-wrap{max-width:420px;margin:3rem auto 5rem;background:linear-gradient(160deg,#0d0a06,#080605);
  border:1px solid var(--line);padding:2.5rem}
.auth-wrap h2{font-family:'Cinzel';color:var(--gold-light);text-align:center;margin-bottom:1.6rem}
.field{margin-bottom:1.2rem}
.field label{display:block;font-size:.85rem;letter-spacing:.08em;color:#c9b98a;margin-bottom:.4rem}
.field input{width:100%;background:transparent;border:1px solid var(--line);color:var(--cream);
  padding:.7rem .8rem;font-family:inherit;font-size:1.05rem;outline:none}
.field input:focus{border-color:var(--gold)}
.auth-switch{text-align:center;margin-top:1.2rem;color:#a99a6c;font-size:.9rem}
.auth-switch a{color:var(--gold-light)}
.auth-note{background:rgba(212,175,55,.08);border:1px solid var(--line);padding:.7rem 1rem;font-size:.85rem;color:#c9b98a;margin-bottom:1.4rem}

.acc-wrap{max-width:1100px;margin:0 auto;padding:3rem 1.5rem 5rem;display:grid;grid-template-columns:230px 1fr;gap:2rem}
.acc-side a{display:block;padding:.8rem 1rem;border:1px solid var(--line);margin-bottom:.6rem;color:#d8cba0}
.acc-side a.active,.acc-side a:hover{border-color:var(--gold);color:var(--gold-light);background:rgba(212,175,55,.06)}
.acc-panel{background:linear-gradient(160deg,#0d0a06,#080605);border:1px solid var(--line);padding:2rem;min-height:300px}
.acc-panel h3{font-family:'Cinzel';color:var(--gold-light);margin-bottom:1rem}
.order-empty,.addr-empty{color:#8a7d55;font-style:italic}
.addr-item{border:1px solid var(--line);padding:1rem;margin-bottom:.8rem}
.addr-item button{margin-top:.5rem}

/* PRODUCT DETAIL PAGE */
.pd-wrap{max-width:1200px;margin:0 auto;padding:3rem 1.5rem 5rem;display:grid;grid-template-columns:1fr 1.2fr;gap:3rem}
.pd-img img{width:100%;border:1px solid var(--line)}
.pd-title{font-size:1.6rem;color:var(--cream);margin-bottom:.3rem}
.pd-price{display:flex;align-items:baseline;gap:.8rem;margin:.8rem 0}
.pd-price .now{font-size:2rem;color:var(--gold-light);font-family:'Cinzel'}
.pd-price .was{color:#8a8070;text-decoration:line-through}
.pd-price .off{color:#e39a4a}
.pd-actions{display:flex;gap:1rem;margin:1.5rem 0}
.pd-actions button{flex:1}
.pd-delivery{border:1px solid var(--line);padding:1rem;margin:1.2rem 0;font-size:.9rem;color:#c9b98a}
.pd-perks{display:flex;gap:1.5rem;flex-wrap:wrap;margin:1rem 0;font-size:.85rem;color:#c9b98a}
table.pd-highlights{width:100%;border-collapse:collapse;margin-top:1rem}
table.pd-highlights td{padding:.5rem 0;border-bottom:1px solid #201a10;font-size:.92rem}
table.pd-highlights td:first-child{color:#a99a6c;width:40%}
.pd-desc{margin-top:2.5rem;max-width:900px}
.pd-desc h3{font-family:'Cinzel';color:var(--gold-light);margin-bottom:.6rem}

@media(max-width:900px){
  nav.primary{display:none}
  .hamburger{display:block}
  .cat-grid,.prod-grid{grid-template-columns:repeat(2,1fr)}
  .foot-top{grid-template-columns:1fr 1fr}
  .acc-wrap{grid-template-columns:1fr}
  .pd-wrap{grid-template-columns:1fr}
}
