/* =========================================================
   NOOR STORE — Inspired by safa.store
   Aesthetic: Clean luxury editorial with warm ivory + deep plum accents
   Fonts: Cormorant Garamond (display) + Jost (body)
   ========================================================= */

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,600;0,700;1,400;1,600&family=Jost:wght@300;400;500;600&display=swap');

:root {
  --ivory: #faf8f5;
  --ivory2: #f3ede4;
  --ivory3: #ece4d8;
  --plum: #2d1b2e;
  --plum2: #4a2d4e;
  --gold: #c9a96e;
  --gold2: #e8d5b0;
  --rose: #b5484a;
  --rose-light: #fdf0f0;
  --sage: #6b8f71;
  --sage-light: #edf3ee;
  --text: #1c1018;
  --text2: #5a4a52;
  --text3: #9a8898;
  --white: #ffffff;
  --border: #e8e0d8;
  --shadow-xs: 0 1px 4px rgba(45,27,46,.06);
  --shadow-sm: 0 4px 16px rgba(45,27,46,.08);
  --shadow-md: 0 8px 32px rgba(45,27,46,.12);
  --shadow-lg: 0 20px 60px rgba(45,27,46,.16);
  --r: 4px;
  --r2: 10px;
  --r3: 20px;
  --trans: all .25s cubic-bezier(.4,0,.2,1);
}

*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body { font-family:'Jost',sans-serif; background:var(--ivory); color:var(--text); font-size:14px; line-height:1.6; overflow-x:hidden; }
img { max-width:100%; display:block; }
a { color:inherit; text-decoration:none; }
button { cursor:pointer; font-family:'Jost',sans-serif; }

/* ===== ANNOUNCEMENT BAR ===== */
.announce-bar { background:var(--plum); color:var(--gold2); font-size:12px; text-align:center; padding:9px 20px; letter-spacing:.8px; }
.announce-bar a { color:var(--gold2); text-decoration:underline; }

/* ===== HEADER ===== */
.site-header { background:var(--white); border-bottom:1px solid var(--border); position:sticky; top:0; z-index:200; }
.header-inner { display:flex; align-items:center; justify-content:space-between; padding:0 40px; height:68px; max-width:1400px; margin:0 auto; }
.header-logo { display:flex; align-items:center; gap:10px; }
.header-logo img { height:44px; }
.logo-emoji { font-size:26px; }
.logo-text { display:flex; flex-direction:column; line-height:1; }
.logo-name { font-family:'Cormorant Garamond',serif; font-size:22px; font-weight:700; color:var(--plum); letter-spacing:1px; }
.logo-sub { font-size:9px; letter-spacing:3px; text-transform:uppercase; color:var(--gold); }

.header-nav { display:flex; align-items:center; gap:30px; }
.nav-link { font-size:13px; font-weight:500; color:var(--text2); letter-spacing:.3px; transition:var(--trans); position:relative; padding:4px 0; }
.nav-link::after { content:''; position:absolute; bottom:-2px; left:0; width:0; height:1px; background:var(--plum); transition:var(--trans); }
.nav-link:hover { color:var(--plum); }
.nav-link:hover::after { width:100%; }

.header-actions { display:flex; align-items:center; gap:16px; }
.header-btn { background:none; border:none; padding:8px; color:var(--text2); transition:var(--trans); position:relative; display:flex; align-items:center; gap:6px; font-size:13px; font-weight:500; }
.header-btn:hover { color:var(--plum); }
.cart-badge { background:var(--plum); color:var(--gold2); width:18px; height:18px; border-radius:50%; font-size:10px; font-weight:700; display:flex; align-items:center; justify-content:center; }
.account-pill { display:flex; align-items:center; gap:7px; background:var(--ivory2); border:1px solid var(--border); padding:6px 14px; border-radius:50px; font-size:12px; font-weight:600; color:var(--plum); transition:var(--trans); }
.account-pill:hover { background:var(--plum); color:var(--gold2); border-color:var(--plum); }
.account-pill-av { width:20px; height:20px; background:var(--plum); color:var(--gold2); border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:10px; font-weight:700; }

/* Mobile menu toggle */
.menu-toggle { display:none; background:none; border:none; padding:6px; color:var(--plum); }

/* ===== HERO BANNER ===== */
.hero-banner { background:var(--plum); color:var(--white); padding:80px 40px; overflow:hidden; position:relative; min-height:480px; display:flex; align-items:center; }
.hero-banner::before { content:''; position:absolute; inset:0; background:radial-gradient(ellipse at 70% 50%, rgba(201,169,110,.2) 0%, transparent 60%); }
.hero-inner { max-width:1400px; margin:0 auto; width:100%; display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:center; position:relative; z-index:2; }
.hero-eyebrow { font-size:11px; letter-spacing:3px; text-transform:uppercase; color:var(--gold); margin-bottom:16px; }
.hero-title { font-family:'Cormorant Garamond',serif; font-size:clamp(42px,5vw,68px); font-weight:600; line-height:1.08; margin-bottom:20px; color:var(--white); }
.hero-title em { font-style:italic; color:var(--gold2); }
.hero-desc { font-size:15px; color:rgba(255,255,255,.7); max-width:420px; margin-bottom:32px; line-height:1.8; }
.hero-cta { display:inline-flex; align-items:center; gap:8px; background:var(--gold); color:var(--plum); padding:14px 32px; font-size:13px; font-weight:600; letter-spacing:.5px; text-transform:uppercase; transition:var(--trans); border-radius:var(--r); }
.hero-cta:hover { background:var(--gold2); transform:translateY(-2px); box-shadow:0 8px 24px rgba(201,169,110,.4); }
.hero-visual-wrap { display:flex; justify-content:center; align-items:center; }
.hero-visual { width:340px; height:400px; background:rgba(255,255,255,.08); border-radius:var(--r3); display:flex; align-items:center; justify-content:center; border:1px solid rgba(255,255,255,.1); backdrop-filter:blur(10px); }
.hero-visual .emoji { font-size:120px; filter:drop-shadow(0 20px 40px rgba(0,0,0,.3)); animation:float 4s ease-in-out infinite; }
@keyframes float { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-14px)} }

/* ===== FEATURES STRIP ===== */
.features-strip { background:var(--ivory2); border-top:1px solid var(--border); border-bottom:1px solid var(--border); }
.features-strip-inner { max-width:1400px; margin:0 auto; padding:16px 40px; display:flex; justify-content:center; gap:48px; flex-wrap:wrap; }
.feature-item { display:flex; align-items:center; gap:10px; font-size:12px; color:var(--text2); letter-spacing:.3px; }
.feature-item .fi { font-size:18px; }

/* ===== SECTION STYLES ===== */
.section { padding:60px 40px; max-width:1400px; margin:0 auto; }
.section-header { display:flex; align-items:baseline; justify-content:space-between; margin-bottom:32px; flex-wrap:wrap; gap:12px; }
.section-title { font-family:'Cormorant Garamond',serif; font-size:32px; font-weight:600; color:var(--plum); }
.section-link { font-size:12px; color:var(--gold); letter-spacing:.5px; text-transform:uppercase; display:flex; align-items:center; gap:4px; transition:var(--trans); }
.section-link:hover { color:var(--plum); }
.section-label { font-size:10px; letter-spacing:3px; text-transform:uppercase; color:var(--gold); margin-bottom:8px; }

/* ===== PRODUCT GRID ===== */
.products-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:20px; }
.products-grid-5 { grid-template-columns:repeat(5,1fr); }
.product-card { background:var(--white); border:1px solid var(--border); border-radius:var(--r2); overflow:hidden; transition:var(--trans); position:relative; }
.product-card:hover { box-shadow:var(--shadow-md); transform:translateY(-3px); border-color:var(--ivory3); }
.product-card-img { position:relative; overflow:hidden; background:var(--ivory2); aspect-ratio:3/4; display:flex; align-items:center; justify-content:center; }
.product-card-img img { width:100%; height:100%; object-fit:cover; transition:transform .5s ease; }
.product-card:hover .product-card-img img { transform:scale(1.04); }
.product-emoji-placeholder { font-size:72px; filter:drop-shadow(0 4px 12px rgba(0,0,0,.1)); }
.product-card-actions { position:absolute; bottom:10px; left:0; right:0; display:flex; justify-content:center; gap:8px; opacity:0; transform:translateY(8px); transition:var(--trans); }
.product-card:hover .product-card-actions { opacity:1; transform:translateY(0); }
.pc-action-btn { width:36px; height:36px; border-radius:50%; border:none; display:flex; align-items:center; justify-content:center; font-size:15px; transition:var(--trans); box-shadow:var(--shadow-sm); }
.pc-action-btn.wish { background:var(--white); color:var(--text2); }
.pc-action-btn.wish.active, .pc-action-btn.wish:hover { background:var(--rose); color:var(--white); }
.pc-action-btn.quick { background:var(--plum); color:var(--gold2); }
.pc-action-btn.quick:hover { background:var(--gold); color:var(--plum); }
.product-badge { position:absolute; top:10px; left:10px; padding:3px 9px; font-size:10px; font-weight:600; letter-spacing:.5px; text-transform:uppercase; border-radius:var(--r); }
.pb-sale { background:var(--rose); color:var(--white); }
.pb-new { background:var(--sage); color:var(--white); }
.pb-best { background:var(--plum); color:var(--gold2); }
.pb-custom { background:var(--gold); color:var(--plum); }
.out-of-stock-overlay { position:absolute; inset:0; background:rgba(255,255,255,.75); display:flex; align-items:center; justify-content:center; font-size:13px; font-weight:600; color:var(--text2); letter-spacing:.5px; text-transform:uppercase; }
.product-card-body { padding:14px 16px; }
.product-cat { font-size:10px; letter-spacing:1.5px; text-transform:uppercase; color:var(--gold); margin-bottom:4px; }
.product-name { font-family:'Cormorant Garamond',serif; font-size:17px; font-weight:600; color:var(--plum); line-height:1.3; margin-bottom:6px; }
.product-desc { font-size:12px; color:var(--text3); line-height:1.5; margin-bottom:10px; }
.product-pricing { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.price-current { font-size:16px; font-weight:600; color:var(--plum); }
.price-original { font-size:13px; color:var(--text3); text-decoration:line-through; }
.price-pct { font-size:11px; color:var(--rose); font-weight:600; }
.product-meta { display:flex; align-items:center; justify-content:space-between; margin-top:10px; }
.stock-low { font-size:11px; color:var(--rose); font-weight:500; }
.stock-ok { font-size:11px; color:var(--sage); }

/* ===== FILTERS BAR ===== */
.filters-bar { background:var(--white); border-bottom:1px solid var(--border); padding:14px 40px; }
.filters-inner { max-width:1400px; margin:0 auto; display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; }
.filter-chips { display:flex; gap:8px; flex-wrap:wrap; align-items:center; }
.filter-chip { padding:7px 16px; border-radius:50px; border:1.5px solid var(--border); font-size:12px; font-weight:500; color:var(--text2); background:var(--white); transition:var(--trans); text-decoration:none; }
.filter-chip:hover, .filter-chip.active { background:var(--plum); border-color:var(--plum); color:var(--gold2); }
.sort-select { padding:7px 12px; border:1.5px solid var(--border); border-radius:var(--r2); font-size:12px; font-family:'Jost',sans-serif; color:var(--text2); background:var(--white); cursor:pointer; }
.sort-select:focus { outline:none; border-color:var(--plum); }
.search-form { display:flex; gap:8px; }
.search-input { padding:7px 14px; border:1.5px solid var(--border); border-radius:50px; font-size:12px; font-family:'Jost',sans-serif; color:var(--text); background:var(--white); width:180px; }
.search-input:focus { outline:none; border-color:var(--plum); }
.search-btn { padding:7px 16px; background:var(--plum); color:var(--gold2); border:none; border-radius:50px; font-size:12px; font-weight:600; }

/* ===== CATEGORY TILES ===== */
.cat-tiles { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.cat-tile { position:relative; border-radius:var(--r2); overflow:hidden; background:var(--plum); aspect-ratio:4/5; display:flex; align-items:flex-end; cursor:pointer; transition:var(--trans); }
.cat-tile:hover { transform:translateY(-4px); box-shadow:var(--shadow-md); }
.cat-tile-bg { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; font-size:80px; background:linear-gradient(135deg,var(--plum2),var(--plum)); }
.cat-tile-overlay { position:relative; z-index:2; padding:20px; width:100%; background:linear-gradient(to top,rgba(0,0,0,.7) 0%,transparent 100%); }
.cat-tile-name { font-family:'Cormorant Garamond',serif; font-size:18px; color:var(--white); font-weight:600; }
.cat-tile-count { font-size:11px; color:rgba(255,255,255,.6); }

/* ===== QUICK ADD MODAL ===== */
.modal-overlay { position:fixed; inset:0; background:rgba(0,0,0,.55); z-index:1000; display:flex; align-items:center; justify-content:center; opacity:0; pointer-events:none; transition:opacity .25s; }
.modal-overlay.open { opacity:1; pointer-events:all; }
.modal-box { background:var(--white); border-radius:var(--r3); padding:32px; width:92%; max-width:440px; max-height:90vh; overflow-y:auto; transform:translateY(16px); transition:transform .25s; }
.modal-overlay.open .modal-box { transform:translateY(0); }
.modal-close { position:absolute; top:16px; right:16px; background:var(--ivory2); border:none; width:28px; height:28px; border-radius:50%; font-size:13px; color:var(--text2); transition:var(--trans); }
.modal-close:hover { background:var(--plum); color:var(--white); }
.modal-title { font-family:'Cormorant Garamond',serif; font-size:22px; font-weight:600; color:var(--plum); margin-bottom:20px; }

/* ===== SIZE BUTTONS ===== */
.size-label { font-size:11px; font-weight:600; text-transform:uppercase; letter-spacing:.8px; color:var(--text2); margin-bottom:10px; }
.size-btns { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:20px; }
.sz-btn { padding:7px 14px; border:1.5px solid var(--border); border-radius:var(--r); font-size:13px; font-weight:500; color:var(--text2); background:var(--white); transition:var(--trans); }
.sz-btn:hover { border-color:var(--plum); color:var(--plum); }
.sz-btn.active { background:var(--plum); border-color:var(--plum); color:var(--gold2); }
.sz-btn.oos { opacity:.4; cursor:not-allowed; text-decoration:line-through; }
.sz-btn.low { border-color:var(--rose); color:var(--rose); }

/* ===== QTY CONTROL ===== */
.qty-ctrl { display:inline-flex; align-items:center; border:1.5px solid var(--border); border-radius:var(--r); overflow:hidden; }
.qty-btn { background:var(--ivory2); border:none; width:36px; height:36px; font-size:18px; color:var(--text2); transition:var(--trans); }
.qty-btn:hover { background:var(--plum); color:var(--white); }
.qty-val { padding:0 18px; font-size:15px; font-weight:600; color:var(--text); min-width:44px; text-align:center; }
.qty-ctrl.lg .qty-btn { width:42px; height:42px; }
.qty-ctrl.lg .qty-val { font-size:17px; padding:0 22px; }

/* ===== BUTTONS ===== */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:12px 26px; font-size:13px; font-weight:600; letter-spacing:.3px; border:none; border-radius:var(--r); transition:var(--trans); cursor:pointer; }
.btn-plum { background:var(--plum); color:var(--gold2); }
.btn-plum:hover { background:var(--plum2); transform:translateY(-1px); box-shadow:var(--shadow-sm); }
.btn-gold { background:var(--gold); color:var(--plum); }
.btn-gold:hover { background:var(--gold2); }
.btn-outline { background:transparent; border:1.5px solid var(--plum); color:var(--plum); }
.btn-outline:hover { background:var(--plum); color:var(--gold2); }
.btn-ghost { background:transparent; border:1.5px solid var(--border); color:var(--text2); }
.btn-ghost:hover { border-color:var(--plum); color:var(--plum); }
.btn-whatsapp { background:#25D366; color:var(--white); }
.btn-whatsapp:hover { background:#128C7E; }
.btn-danger { background:#fef2f2; border:1.5px solid #fecaca; color:#b91c1c; }
.btn-danger:hover { background:#fee2e2; }
.btn-sm { padding:8px 16px; font-size:12px; }
.btn-lg { padding:15px 36px; font-size:14px; }
.btn-full { width:100%; }
.btn-icon { width:36px; height:36px; padding:0; }

/* ===== PINCODE CHECKER ===== */
.pincode-box { background:var(--ivory2); border:1px solid var(--border); border-radius:var(--r2); padding:16px 18px; margin:16px 0; }
.pincode-label { font-size:11px; font-weight:600; text-transform:uppercase; letter-spacing:.8px; color:var(--text2); margin-bottom:10px; }
.pincode-row { display:flex; gap:8px; }
.pincode-input { flex:1; padding:9px 14px; border:1.5px solid var(--border); border-radius:var(--r); font-size:13px; font-family:'Jost',sans-serif; background:var(--white); }
.pincode-input:focus { outline:none; border-color:var(--plum); }
.pincode-result { margin-top:10px; font-size:13px; border-radius:var(--r); padding:8px 12px; }
.pincode-ok { background:var(--sage-light); color:var(--sage); border:1px solid rgba(107,143,113,.2); }
.pincode-fail { background:var(--rose-light); color:var(--rose); border:1px solid rgba(181,72,74,.2); }

/* ===== COUPON ===== */
.coupon-box { background:var(--ivory2); border:1px dashed var(--gold); border-radius:var(--r2); padding:16px 18px; margin:12px 0; }
.coupon-row { display:flex; gap:8px; }
.coupon-input { flex:1; padding:9px 14px; border:1.5px solid var(--border); border-radius:var(--r); font-size:13px; font-family:'Jost',sans-serif; background:var(--white); text-transform:uppercase; letter-spacing:.5px; }
.coupon-input:focus { outline:none; border-color:var(--gold); }
.coupon-result { margin-top:10px; font-size:13px; border-radius:var(--r); padding:8px 12px; }
.coupon-ok { background:var(--sage-light); color:var(--sage); }
.coupon-fail { background:var(--rose-light); color:var(--rose); }

/* ===== CART PAGE ===== */
.cart-wrap { max-width:1200px; margin:0 auto; padding:48px 40px; display:grid; grid-template-columns:1fr 360px; gap:40px; align-items:start; }
.cart-item { display:grid; grid-template-columns:80px 1fr auto; gap:16px; align-items:center; padding:18px 0; border-bottom:1px solid var(--border); }
.cart-thumb { width:80px; height:96px; border-radius:var(--r2); overflow:hidden; background:var(--ivory2); display:flex; align-items:center; justify-content:center; font-size:36px; flex-shrink:0; }
.cart-thumb img { width:100%; height:100%; object-fit:cover; }
.cart-item-name { font-family:'Cormorant Garamond',serif; font-size:17px; font-weight:600; color:var(--plum); margin-bottom:4px; }
.cart-item-size { font-size:12px; color:var(--text3); margin-bottom:8px; }
.cart-item-price { font-size:14px; font-weight:600; color:var(--text); }
.cart-remove { background:none; border:none; color:var(--text3); font-size:16px; padding:4px; transition:var(--trans); }
.cart-remove:hover { color:var(--rose); }
.cart-summary-box { background:var(--white); border:1px solid var(--border); border-radius:var(--r2); padding:24px; position:sticky; top:88px; }
.summary-title { font-family:'Cormorant Garamond',serif; font-size:22px; font-weight:600; color:var(--plum); margin-bottom:20px; }
.summary-row { display:flex; justify-content:space-between; padding:10px 0; border-bottom:1px solid var(--border); font-size:14px; color:var(--text2); }
.summary-row.total { font-size:18px; font-weight:700; color:var(--plum); border-bottom:none; padding-top:14px; }
.free-del-hint { font-size:12px; text-align:center; background:var(--sage-light); color:var(--sage); padding:8px; border-radius:var(--r); margin:10px 0; }

/* ===== CHECKOUT ===== */
.checkout-wrap { max-width:1100px; margin:0 auto; padding:48px 40px; display:grid; grid-template-columns:1fr 380px; gap:40px; align-items:start; }
.checkout-card { background:var(--white); border:1px solid var(--border); border-radius:var(--r2); padding:28px; margin-bottom:16px; }
.checkout-card h3 { font-family:'Cormorant Garamond',serif; font-size:20px; font-weight:600; color:var(--plum); margin-bottom:20px; }
.saved-addr-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-bottom:16px; }
.saved-addr { border:1.5px solid var(--border); border-radius:var(--r2); padding:12px; cursor:pointer; transition:var(--trans); font-size:13px; }
.saved-addr:hover, .saved-addr.sel { border-color:var(--plum); background:rgba(45,27,46,.03); }
.saved-addr-label { font-weight:600; color:var(--plum); margin-bottom:4px; font-size:12px; text-transform:uppercase; letter-spacing:.5px; }

/* ===== FORMS ===== */
.field-label { font-size:11px; font-weight:600; text-transform:uppercase; letter-spacing:.8px; color:var(--text2); display:block; margin-bottom:6px; }
.field-input { width:100%; padding:11px 14px; border:1.5px solid var(--border); border-radius:var(--r); font-size:14px; font-family:'Jost',sans-serif; color:var(--text); background:var(--white); transition:border-color .2s; }
.field-input:focus { outline:none; border-color:var(--plum); }
.field-input::placeholder { color:var(--text3); }
textarea.field-input { resize:vertical; min-height:80px; }
select.field-input { cursor:pointer; }
.form-group { margin-bottom:16px; }
.form-grid-2 { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.form-check { display:flex; align-items:center; gap:8px; font-size:13px; color:var(--text2); cursor:pointer; }
.form-check input { width:15px; height:15px; accent-color:var(--plum); }

/* ===== PRODUCT DETAIL ===== */
.pd-wrap { max-width:1200px; margin:0 auto; padding:40px; display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:start; }
.pd-gallery { position:sticky; top:90px; }
.pd-main-img { border-radius:var(--r2); overflow:hidden; background:var(--ivory2); aspect-ratio:3/4; display:flex; align-items:center; justify-content:center; margin-bottom:12px; }
.pd-main-img img { width:100%; height:100%; object-fit:cover; }
.pd-thumbs { display:flex; gap:8px; flex-wrap:wrap; }
.pd-thumb { width:64px; height:72px; border-radius:var(--r); overflow:hidden; background:var(--ivory2); border:2px solid transparent; cursor:pointer; transition:var(--trans); flex-shrink:0; display:flex; align-items:center; justify-content:center; font-size:22px; }
.pd-thumb.active, .pd-thumb:hover { border-color:var(--plum); }
.pd-thumb img { width:100%; height:100%; object-fit:cover; }
.pd-info { }
.pd-category { font-size:10px; letter-spacing:2px; text-transform:uppercase; color:var(--gold); margin-bottom:8px; }
.pd-name { font-family:'Cormorant Garamond',serif; font-size:clamp(26px,3vw,38px); font-weight:600; color:var(--plum); line-height:1.15; margin-bottom:10px; }
.pd-stars { display:flex; align-items:center; gap:6px; font-size:13px; color:var(--text3); margin-bottom:14px; }
.stars-row { color:#f59e0b; font-size:14px; letter-spacing:-1px; }
.pd-price-row { display:flex; align-items:baseline; gap:12px; margin-bottom:18px; }
.pd-price { font-family:'Cormorant Garamond',serif; font-size:32px; font-weight:600; color:var(--plum); }
.pd-orig { font-size:18px; color:var(--text3); text-decoration:line-through; }
.pd-disc { font-size:13px; font-weight:600; color:var(--rose); background:var(--rose-light); padding:3px 8px; border-radius:var(--r); }
.pd-desc { font-size:14px; color:var(--text2); line-height:1.8; margin-bottom:20px; }
.pd-attrs { background:var(--ivory2); border-radius:var(--r2); padding:16px; margin-bottom:20px; }
.pd-attr { display:flex; gap:12px; padding:6px 0; font-size:13px; border-bottom:1px solid var(--border); }
.pd-attr:last-child { border:none; }
.pd-attr-key { color:var(--text3); min-width:120px; }
.pd-attr-val { color:var(--text); font-weight:500; }
.size-guide-btn { background:none; border:none; font-size:12px; color:var(--gold); text-decoration:underline; cursor:pointer; margin-left:auto; }
.pd-add-row { display:flex; gap:12px; align-items:center; flex-wrap:wrap; margin-top:20px; }
.pd-features { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:20px; }
.pd-feat { display:flex; align-items:center; gap:8px; font-size:12px; color:var(--text2); background:var(--ivory2); padding:10px 12px; border-radius:var(--r); }

/* ===== ORDER SUCCESS ===== */
.success-wrap { max-width:600px; margin:80px auto; padding:0 20px; text-align:center; }
.success-icon { width:80px; height:80px; background:var(--sage); border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:36px; color:var(--white); margin:0 auto 24px; animation:pop .5s cubic-bezier(.175,.885,.32,1.275); }
@keyframes pop { from{transform:scale(0);opacity:0} to{transform:scale(1);opacity:1} }
.success-h1 { font-family:'Cormorant Garamond',serif; font-size:40px; color:var(--plum); margin-bottom:8px; }
.success-sub { color:var(--text3); margin-bottom:32px; }
.success-order-box { background:var(--white); border:1px solid var(--border); border-radius:var(--r2); padding:24px; text-align:left; margin-bottom:24px; }
.success-item { display:flex; justify-content:space-between; font-size:13px; color:var(--text2); padding:8px 0; border-bottom:1px solid var(--border); }
.success-total { display:flex; justify-content:flex-end; padding-top:12px; font-size:17px; font-weight:700; color:var(--plum); }

/* ===== ACCOUNT ===== */
.account-wrap { max-width:1100px; margin:0 auto; padding:48px 40px; display:grid; grid-template-columns:260px 1fr; gap:32px; align-items:start; }
.account-sidebar-card { background:var(--white); border:1px solid var(--border); border-radius:var(--r2); overflow:hidden; position:sticky; top:88px; }
.account-avatar-area { padding:24px; text-align:center; background:var(--plum); color:var(--white); }
.account-av { width:60px; height:60px; background:var(--gold); color:var(--plum); border-radius:50%; font-size:22px; font-weight:700; display:flex; align-items:center; justify-content:center; margin:0 auto 12px; }
.account-av-name { font-family:'Cormorant Garamond',serif; font-size:18px; }
.account-av-phone { font-size:12px; color:rgba(255,255,255,.6); margin-top:4px; }
.account-nav a { display:flex; align-items:center; gap:10px; padding:13px 20px; font-size:13px; color:var(--text2); border-bottom:1px solid var(--border); transition:var(--trans); font-weight:500; }
.account-nav a:hover, .account-nav a.active { background:var(--ivory2); color:var(--plum); }
.account-tab { display:none; }
.account-tab.active { display:block; }
.account-card { background:var(--white); border:1px solid var(--border); border-radius:var(--r2); padding:28px; }
.account-card-h { font-family:'Cormorant Garamond',serif; font-size:24px; font-weight:600; color:var(--plum); margin-bottom:22px; }
.addr-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.addr-card { border:1.5px solid var(--border); border-radius:var(--r2); padding:14px; transition:var(--trans); }
.addr-card.default { border-color:var(--plum); background:rgba(45,27,46,.02); }
.addr-label { font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.8px; color:var(--plum); margin-bottom:6px; }
.addr-default-badge { font-size:10px; background:var(--plum); color:var(--gold2); padding:2px 7px; border-radius:50px; margin-left:8px; }
.addr-text { font-size:12px; color:var(--text2); line-height:1.7; }
.addr-actions { display:flex; gap:8px; margin-top:10px; padding-top:8px; border-top:1px solid var(--border); }
.link-btn { background:none; border:none; font-size:12px; color:var(--text3); cursor:pointer; transition:var(--trans); }
.link-btn:hover { color:var(--plum); }
.link-btn.danger:hover { color:var(--rose); }
.order-item-card { border:1px solid var(--border); border-radius:var(--r2); padding:16px; margin-bottom:12px; transition:var(--trans); }
.order-item-card:hover { box-shadow:var(--shadow-xs); }
.oi-header { display:flex; justify-content:space-between; align-items:center; margin-bottom:10px; flex-wrap:wrap; gap:8px; }
.oi-num { font-family:'Cormorant Garamond',serif; font-size:16px; font-weight:600; color:var(--plum); }
.oi-date { font-size:11px; color:var(--text3); }
.oi-chips { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:10px; }
.oi-chip { font-size:11px; background:var(--ivory2); color:var(--text2); padding:2px 8px; border-radius:50px; }
.oi-footer { display:flex; justify-content:space-between; align-items:center; }
.oi-total { font-weight:700; color:var(--plum); }
.status-badge { display:inline-flex; align-items:center; padding:3px 10px; border-radius:50px; font-size:11px; font-weight:600; text-transform:uppercase; letter-spacing:.4px; }
.st-pending { background:#fef3c7; color:#92400e; }
.st-confirmed { background:#dbeafe; color:#1e40af; }
.st-processing { background:#ede9fe; color:#5b21b6; }
.st-shipped { background:#fef3c7; color:#b45309; }
.st-delivered { background:#d1fae5; color:#065f46; }
.st-cancelled { background:#fee2e2; color:#991b1b; }
.st-returned { background:#f3f4f6; color:#374151; }
.st-paid { background:#d1fae5; color:#065f46; }
.st-unpaid { background:#fef3c7; color:#92400e; }

/* ===== TOAST ===== */
.toast { position:fixed; bottom:24px; right:24px; background:var(--plum); color:var(--gold2); padding:13px 22px; border-radius:var(--r2); font-size:13px; font-weight:500; z-index:9999; opacity:0; transform:translateY(16px); transition:all .3s; box-shadow:var(--shadow-md); max-width:280px; }
.toast.show { opacity:1; transform:translateY(0); }
.toast.success { background:var(--sage); color:var(--white); }
.toast.error { background:var(--rose); color:var(--white); }

/* ===== REVIEWS ===== */
.reviews-section { padding:40px; background:var(--ivory2); }
.review-card { background:var(--white); border:1px solid var(--border); border-radius:var(--r2); padding:18px; margin-bottom:12px; }
.review-header { display:flex; justify-content:space-between; align-items:center; margin-bottom:8px; }
.review-name { font-weight:600; font-size:14px; }
.review-date { font-size:11px; color:var(--text3); }
.review-text { font-size:13px; color:var(--text2); line-height:1.6; }

/* ===== FOOTER ===== */
.site-footer { background:var(--plum); color:rgba(255,255,255,.7); }
.footer-top { max-width:1400px; margin:0 auto; padding:56px 40px 40px; display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:48px; }
.footer-brand-name { font-family:'Cormorant Garamond',serif; font-size:22px; color:var(--gold2); display:flex; align-items:center; gap:8px; margin-bottom:12px; }
.footer-desc { font-size:13px; line-height:1.8; max-width:280px; }
.footer-col h4 { font-size:11px; font-weight:600; text-transform:uppercase; letter-spacing:1.5px; color:var(--gold); margin-bottom:14px; }
.footer-col a { display:block; font-size:13px; margin-bottom:8px; color:rgba(255,255,255,.6); transition:var(--trans); }
.footer-col a:hover { color:var(--gold2); }
.footer-social { display:flex; gap:10px; margin-top:16px; }
.social-btn { width:36px; height:36px; border-radius:50%; background:rgba(255,255,255,.1); display:flex; align-items:center; justify-content:center; font-size:15px; transition:var(--trans); }
.social-btn:hover { background:var(--gold); }
.footer-bottom { border-top:1px solid rgba(255,255,255,.08); padding:16px 40px; max-width:1400px; margin:0 auto; display:flex; justify-content:space-between; align-items:center; font-size:12px; flex-wrap:wrap; gap:8px; }

/* ===== BREADCRUMB ===== */
.breadcrumb { display:flex; align-items:center; gap:6px; padding:14px 40px; max-width:1400px; margin:0 auto; font-size:12px; color:var(--text3); }
.breadcrumb a { color:var(--text3); transition:var(--trans); }
.breadcrumb a:hover { color:var(--plum); }
.breadcrumb span { color:var(--text3); }

/* ===== EMPTY STATES ===== */
.empty-state { text-align:center; padding:80px 20px; }
.empty-icon { font-size:64px; margin-bottom:16px; }
.empty-h { font-family:'Cormorant Garamond',serif; font-size:28px; color:var(--plum); margin-bottom:8px; }
.empty-p { color:var(--text3); margin-bottom:24px; }

/* ===== ALERT ===== */
.alert { padding:12px 16px; border-radius:var(--r); font-size:13px; margin-bottom:16px; }
.alert-success { background:var(--sage-light); border:1px solid rgba(107,143,113,.2); color:var(--sage); }
.alert-error { background:var(--rose-light); border:1px solid rgba(181,72,74,.2); color:var(--rose); }

/* =========================================================
   RESPONSIVE
   ========================================================= */
@media(max-width:1100px) {
  .products-grid-5 { grid-template-columns:repeat(4,1fr); }
  .footer-top { grid-template-columns:1fr 1fr; }
  .pd-wrap { padding:24px; gap:36px; }
}
@media(max-width:900px) {
  .header-inner { padding:0 20px; }
  .header-nav { display:none; }
  .menu-toggle { display:flex; }
  .hero-inner { grid-template-columns:1fr; }
  .hero-visual-wrap { display:none; }
  .hero-banner { padding:48px 24px; min-height:auto; }
  .section { padding:40px 20px; }
  .filters-bar { padding:12px 20px; }
  .pd-wrap { grid-template-columns:1fr; }
  .pd-gallery { position:static; }
  .cart-wrap { grid-template-columns:1fr; }
  .checkout-wrap { grid-template-columns:1fr; }
  .account-wrap { grid-template-columns:1fr; }
  .account-sidebar-card { position:static; }
  .cat-tiles { grid-template-columns:repeat(2,1fr); }
  .features-strip-inner { gap:20px; padding:14px 20px; }
  .footer-top { grid-template-columns:1fr 1fr; padding:40px 20px; gap:28px; }
  .footer-bottom { padding:14px 20px; }
  .breadcrumb { padding:12px 20px; }
}
@media(max-width:640px) {
  .products-grid { grid-template-columns:repeat(2,1fr); gap:12px; }
  .products-grid-5 { grid-template-columns:repeat(2,1fr); }
  .cat-tiles { grid-template-columns:repeat(2,1fr); }
  .form-grid-2 { grid-template-columns:1fr; }
  .addr-grid { grid-template-columns:1fr; }
  .saved-addr-grid { grid-template-columns:1fr; }
  .footer-top { grid-template-columns:1fr; }
  .hero-title { font-size:36px; }
  .cart-item { grid-template-columns:64px 1fr; }
  .cart-item .qty-ctrl { grid-column:2; }
  .breadcrumb { display:none; }
  .pd-add-row { flex-direction:column; }
  .pd-features { grid-template-columns:1fr; }
}

/* Mobile nav drawer */
.mobile-nav { display:none; position:fixed; inset:0; z-index:500; }
.mobile-nav.open { display:block; }
.mobile-nav-overlay { position:absolute; inset:0; background:rgba(0,0,0,.5); }
.mobile-nav-drawer { position:absolute; left:0; top:0; bottom:0; width:280px; background:var(--white); padding:24px 20px; overflow-y:auto; }
.mobile-nav-close { position:absolute; top:16px; right:16px; background:none; border:none; font-size:22px; color:var(--plum); }
.mobile-nav-drawer .nav-link { display:block; padding:13px 0; border-bottom:1px solid var(--border); font-size:15px; color:var(--plum); font-weight:500; }