:root{
  --bg:#0a0a0a;
  --bg-2:#111111;
  --bg-3:#1a1a1a;
  --gold:#c9a14a;
  --gold-2:#e8c878;
  --gold-soft:#b89238;
  --text:#f5f1e8;
  --muted:#9a9285;
  --border:rgba(201,161,74,.25);
  --radius:14px;
  --shadow:0 20px 60px rgba(0,0,0,.6);
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{background:var(--bg);color:var(--text);font-family:'Inter',sans-serif;line-height:1.6;-webkit-font-smoothing:antialiased}
body{overflow-x:hidden}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}
img{max-width:100%;display:block}
.container{max-width:1280px;margin:0 auto;padding:0 24px}
h1,h2,h3,h4{font-family:'Cormorant Garamond',serif;font-weight:500;letter-spacing:.02em}

/* ===== HEADER ===== */
header{position:sticky;top:0;z-index:100;background:rgba(10,10,10,.85);backdrop-filter:blur(12px);border-bottom:1px solid var(--border)}
.nav{display:flex;align-items:center;justify-content:space-between;height:96px}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none}
.logo img{height:80px;width:auto;mix-blend-mode:screen;filter:contrast(1.6) brightness(1.2);-webkit-mask-image:radial-gradient(ellipse 90% 90% at 50% 50%, #000 70%, transparent 100%);mask-image:radial-gradient(ellipse 90% 90% at 50% 50%, #000 70%, transparent 100%);}
nav ul{display:flex;gap:36px;list-style:none}
nav a{font-size:.82rem;text-transform:uppercase;letter-spacing:.18em;color:var(--text);opacity:.85;transition:.3s;position:relative;padding:6px 0}
nav a:hover{color:var(--gold-2);opacity:1}
nav a::after{content:"";position:absolute;left:0;bottom:0;width:0;height:1px;background:var(--gold);transition:.3s}
nav a:hover::after{width:100%}
.dropdown{position:relative}
.dropdown-menu{position:absolute;top:100%;left:-20px;min-width:200px;background:var(--bg-2);border:1px solid var(--border);padding:14px 0;opacity:0;visibility:hidden;transform:translateY(-6px);transition:.25s;box-shadow:var(--shadow)}
.dropdown:hover .dropdown-menu{opacity:1;visibility:visible;transform:translateY(0)}
.dropdown-menu a{display:block;padding:10px 22px;font-size:.78rem}
.dropdown-menu a:hover{background:var(--bg-3);color:var(--gold-2)}
.icons{display:flex;align-items:center;gap:18px}
.cart-pill{display:flex;align-items:center;gap:12px;background:var(--gold-2);color:#0a0a0a;padding:8px 24px 8px 16px;border-radius:999px;font-family:'Cormorant Garamond',serif;text-decoration:none;transition:.3s;box-shadow:0 4px 14px rgba(201,161,74,.3);border:none;cursor:pointer;}
.cart-pill:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(201,161,74,.4);}
.cart-pill svg{width:22px;height:22px;}
.cart-pill-info{display:flex;flex-direction:column;align-items:flex-start;line-height:1.2;}
.cart-pill-title{font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;font-weight:600;font-family:'Inter',sans-serif;opacity:0.8;}
.cart-pill-price{font-size:1.1rem;font-weight:700;}
@keyframes cartBlink { 0% { box-shadow: 0 0 0 0 rgba(201,161,74,.7); } 50% { box-shadow: 0 0 0 10px rgba(201,161,74,0); } 100% { box-shadow: 0 0 0 0 rgba(201,161,74,0); } }
.cart-pill.blinking { animation: cartBlink 1.5s infinite; }
.menu-toggle{display:none;font-size:1.5rem;color:var(--gold-2)}

/* ===== HERO ===== */
.hero{position:relative;min-height:88vh;display:flex;align-items:center;overflow:hidden;background:radial-gradient(ellipse at 70% 50%,rgba(201,161,74,.15),transparent 60%),var(--bg)}
.hero::before{content:"";position:absolute;inset:0;background:url('img/hero.jpg') center/cover no-repeat;opacity:.45;mask-image:linear-gradient(to right,transparent 20%,#000 70%)}
.hero-content{position:relative;z-index:2;max-width:640px;padding:80px 0}
.hero-eyebrow{color:var(--gold-2);letter-spacing:.4em;text-transform:uppercase;font-size:.75rem;margin-bottom:24px}
.hero h1{font-size:clamp(3rem,7vw,6rem);line-height:1;margin-bottom:24px;background:linear-gradient(135deg,#fff 30%,var(--gold-2));-webkit-background-clip:text;background-clip:text;color:transparent}
.hero p{font-size:1.15rem;color:var(--muted);margin-bottom:40px;max-width:520px}
.hero-cta{display:flex;gap:16px;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;gap:10px;padding:16px 32px;font-size:.78rem;letter-spacing:.22em;text-transform:uppercase;font-weight:600;transition:.3s;border:1px solid transparent;cursor:pointer}
.btn-gold{background:linear-gradient(135deg,var(--gold),var(--gold-soft));color:#0a0a0a}
.btn-gold:hover{transform:translateY(-2px);box-shadow:0 12px 32px rgba(201,161,74,.4)}
.btn-outline{border-color:var(--gold);color:var(--gold-2)}
.btn-outline:hover{background:var(--gold);color:#0a0a0a}

/* ===== PROMO BANNER ===== */
.promo{background:linear-gradient(90deg,#1a1408,#2d2210,#1a1408);border-top:1px solid var(--border);border-bottom:1px solid var(--border);padding:14px 0;text-align:center;font-size:.82rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-2)}

/* ===== SECTIONS ===== */
section{padding:100px 0}
.section-head{text-align:center;margin-bottom:70px}
.section-head .eyebrow{color:var(--gold);letter-spacing:.4em;text-transform:uppercase;font-size:.72rem;margin-bottom:18px}
.section-head h2{font-size:clamp(2.4rem,4.5vw,3.8rem);margin-bottom:18px}
.section-head p{color:var(--muted);max-width:560px;margin:0 auto}
.divider{width:60px;height:1px;background:var(--gold);margin:18px auto}

/* ===== PRODUCT GRID ===== */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:36px}
.card{background:linear-gradient(180deg,var(--bg-2),var(--bg-3));border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;transition:.4s;position:relative;display:flex;flex-direction:column}
.card:hover{transform:translateY(-8px);border-color:var(--gold);box-shadow:0 30px 60px rgba(0,0,0,.7),0 0 0 1px rgba(201,161,74,.3)}
.card-img{position:relative;aspect-ratio:1/1;overflow:hidden;background:#000}
.card-img img{width:100%;height:100%;object-fit:cover;transition:.7s}
.card:hover .card-img img{transform:scale(1.06)}
.badge{position:absolute;top:14px;left:14px;background:var(--gold);color:#000;font-size:.65rem;font-weight:700;letter-spacing:.15em;padding:6px 12px;text-transform:uppercase;z-index:2}
.badge.new{background:#1a1a1a;color:var(--gold-2);border:1px solid var(--gold)}
.swap-img{display:none !important}
.gallery-btn { position: absolute; top: 50%; transform: translateY(-50%); width: 32px; height: 32px; border-radius: 50%; background: rgba(0,0,0,0.6); color: var(--gold-2); display: flex; align-items: center; justify-content: center; font-size: 1.2rem; z-index: 3; opacity: 0; transition: .3s; backdrop-filter: blur(4px); }
.card-img:hover .gallery-btn { opacity: 1; }
.gallery-btn:hover { background: var(--gold); color: #000; }
.gallery-btn.prev { left: 10px; }
.gallery-btn.next { right: 10px; }
.gallery-dots { position: absolute; bottom: 12px; left: 0; right: 0; display: flex; justify-content: center; gap: 6px; z-index: 3; }
.gallery-dots .dot { width: 6px; height: 6px; border-radius: 50%; background: rgba(255,255,255,0.4); transition: .3s; }
.gallery-dots .dot.active { background: var(--gold); transform: scale(1.3); }
.card-body{padding:22px;display:flex;flex-direction:column;flex:1}
.card-brand{font-size:.7rem;letter-spacing:.3em;text-transform:uppercase;color:var(--gold);margin-bottom:8px}
.card-name{font-family:'Cormorant Garamond',serif;font-size:1.45rem;margin-bottom:10px;color:var(--text)}
.card-desc{font-size:.85rem;color:var(--muted);margin-bottom:14px;flex:1}
.accords{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:16px}
.accord{font-size:.65rem;padding:4px 10px;border:1px solid var(--gold-soft);border-radius:999px;color:var(--gold-2);letter-spacing:.1em;text-transform:uppercase;background:rgba(201,161,74,.06)}
.price-row{display:flex;align-items:baseline;gap:10px;margin-bottom:16px}
.price{font-family:'Cormorant Garamond',serif;font-size:1.6rem;color:var(--gold-2);font-weight:600}
.price-old{text-decoration:line-through;color:var(--muted);font-size:.95rem}
.add-btn{width:100%;padding:14px;border:1px solid var(--gold);background:transparent;color:var(--gold-2);font-size:.72rem;letter-spacing:.22em;text-transform:uppercase;font-weight:600;transition:.3s;margin-top:auto;}
.add-btn:hover{background:var(--gold);color:#0a0a0a}
.variants-wrap{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px;}
.variant-btn{padding:6px 10px;font-size:.7rem;border:1px solid var(--border);background:var(--bg-3);color:var(--text);border-radius:4px;cursor:pointer;transition:.2s;}
.variant-btn.active{border-color:var(--gold);background:rgba(201,161,74,.1);color:var(--gold-2);}
.variant-btn:hover{border-color:var(--gold-soft);}
.ingredients{font-size:.7rem;color:var(--muted);margin-bottom:12px;font-style:italic;}

/* ===== SOCIAL SECTION ===== */
.social-section{background:linear-gradient(135deg,#120e05,#1c1608,#120e05);border-top:1px solid var(--border);border-bottom:1px solid var(--border);text-align:center;padding:70px 0;}
.social-section h2{font-size:clamp(2rem,4vw,3rem);margin-bottom:16px;}
.social-section p{color:var(--muted);margin-bottom:32px;}
.social-links{display:flex;gap:20px;justify-content:center;flex-wrap:wrap;}
.social-icon{display:flex;align-items:center;justify-content:center;width:56px;height:56px;border-radius:50%;background:rgba(201,161,74,.05);border:1px solid var(--border);color:var(--gold-2);transition:.3s;}
.social-icon:hover{background:var(--gold);color:#0a0a0a;transform:translateY(-4px);box-shadow:0 10px 20px rgba(201,161,74,.2);}

/* ===== FOOTER ===== */
footer{background:#050505;padding:70px 0 30px;border-top:1px solid var(--border)}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:50px;margin-bottom:50px}
.footer-brand h3{font-family:'Cormorant Garamond',serif;font-size:1.8rem;letter-spacing:.3em;color:var(--gold-2);margin-bottom:16px}
.footer-brand p{color:var(--muted);font-size:.9rem;max-width:380px}
.footer-col h4{font-size:.78rem;letter-spacing:.25em;text-transform:uppercase;color:var(--gold);margin-bottom:18px}
.footer-col ul{list-style:none;display:flex;flex-direction:column;gap:10px}
.footer-col a{color:var(--muted);font-size:.88rem;transition:.3s}
.footer-col a:hover{color:var(--gold-2)}
.footer-bot{border-top:1px solid var(--border);padding-top:24px;text-align:center;color:var(--muted);font-size:.8rem;letter-spacing:.15em}

/* ===== CART PAGE ===== */
.cart-page{padding:80px 0;min-height:70vh;}
.cart-page-title{text-align:center;font-size:3rem;color:var(--gold-2);margin-bottom:40px;}
.cart-layout{display:grid;grid-template-columns:1fr;max-width:800px;margin:0 auto;gap:40px;}
.cart-items-wrap{background:var(--bg-2);border:1px solid var(--border);border-radius:var(--radius);padding:30px;}
.cart-summary{background:var(--bg-2);border:1px solid var(--border);border-radius:var(--radius);padding:30px;}
.cart-item{display:flex;gap:20px;padding:20px 0;border-bottom:1px solid var(--border);}
.cart-item:last-child{border-bottom:none;padding-bottom:0;}
.cart-item img{width:100px;height:100px;object-fit:cover;border-radius:8px;border:1px solid var(--border);}
.cart-item-info{flex:1;}
.cart-item-info .name{font-family:'Cormorant Garamond',serif;font-size:1.3rem;color:var(--text);margin-bottom:4px;}
.cart-item-info .brand{font-size:.75rem;letter-spacing:.2em;color:var(--gold);text-transform:uppercase;}
.cart-item-info .p{color:var(--gold-2);font-weight:600;font-size:1.1rem;margin-top:10px;}
.qty{display:flex;align-items:center;gap:10px;margin-top:10px;}
.qty button{width:30px;height:30px;border:1px solid var(--border);color:var(--gold-2);font-size:1rem;border-radius:4px;transition:.2s;}
.qty button:hover{background:var(--gold);color:#000;border-color:var(--gold);}
.qty span{min-width:30px;text-align:center;font-weight:600;}
.remove{color:var(--muted);margin-left:20px;padding:4px;background:none;border:none;cursor:pointer;transition:.3s;display:flex;align-items:center;justify-content:center;}
.remove svg{width:20px;height:20px;}
.remove:hover{color:#ff4040;transform:scale(1.1);}
.empty{text-align:center;padding:60px 0;color:var(--muted);font-size:1.1rem;}
.total{display:flex;justify-content:space-between;font-size:1.2rem;margin-bottom:24px;border-bottom:1px solid var(--border);padding-bottom:20px;}
.total strong{color:var(--gold-2);font-family:'Cormorant Garamond',serif;font-size:2rem;}
.checkout-btn{width:100%;padding:16px;background:var(--gold);color:#0a0a0a;font-size:.85rem;letter-spacing:.22em;text-transform:uppercase;font-weight:700;transition:.3s;display:flex;align-items:center;justify-content:center;}
.checkout-btn:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(201,161,74,.3);}

/* ===== CHECKOUT FORM ===== */
.checkout-form { margin-top: 30px; }
.checkout-form.active { display: block; animation: fadeIn .25s; }
.form-group { margin-bottom: 16px; }
.form-group label { display: block; font-size: .8rem; color: var(--muted); margin-bottom: 6px; letter-spacing: .1em; text-transform: uppercase; }
.form-group input, .form-group textarea { width: 100%; padding: 12px 16px; background: rgba(0,0,0,.4); border: 1px solid var(--border); color: var(--text); font-family: inherit; font-size: .95rem; border-radius: 6px; outline: none; transition: .3s; }
.form-group input:focus, .form-group textarea:focus { border-color: var(--gold); }
.form-group textarea { resize: vertical; min-height: 80px; }
.checkout-submit { width: 100%; padding: 16px; background: var(--gold); color: #0a0a0a; font-size: .8rem; letter-spacing: .22em; text-transform: uppercase; font-weight: 700; transition: .3s; border: none; cursor: pointer; margin-top: 10px; }
.checkout-submit:hover { transform: translateY(-2px); box-shadow: 0 12px 30px rgba(201,161,74,.3); }
.checkout-submit:disabled { opacity: 0.7; cursor: not-allowed; transform: none; box-shadow: none; }

/* ===== MODALS ===== */
.modal { position: fixed; inset: 0; background: rgba(0,0,0,.8); z-index: 999; display: flex; align-items: center; justify-content: center; opacity: 0; pointer-events: none; transition: .3s; backdrop-filter: blur(4px); padding: 20px; }
.modal.active { opacity: 1; pointer-events: auto; }
.modal-box { background: var(--bg-2); border: 1px solid var(--border); border-radius: var(--radius); width: 100%; max-width: 500px; max-height: 90vh; overflow-y: auto; padding: 30px; transform: translateY(20px); transition: .3s; }
.modal.active .modal-box { transform: translateY(0); }
.modal-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 24px; border-bottom: 1px solid var(--border); padding-bottom: 16px; }
.modal-head h3 { font-family: 'Cormorant Garamond', serif; font-size: 1.8rem; color: var(--gold-2); }
.close-btn { background: transparent; border: none; color: var(--muted); font-size: 1.2rem; cursor: pointer; transition: .2s; }
.close-btn:hover { color: var(--text); }

/* ===== ABOUT MODAL ===== */
.about-body{color:var(--muted);font-size:.95rem;line-height:1.8;white-space:pre-line;}

/* ===== FLOAT WHATSAPP (Hidden if pure GS) ===== */
.wa-float{display:none;}

/* ===== TOAST ===== */
.toast{position:fixed;bottom:30px;left:50%;transform:translateX(-50%) translateY(120px);background:var(--bg-3);border:1px solid var(--gold);color:var(--gold-2);padding:14px 28px;border-radius:8px;font-size:.85rem;letter-spacing:.1em;z-index:300;transition:.4s;box-shadow:var(--shadow)}
.toast.show { opacity: 1; transform: translate(-50%, 0); }

/* ===== FLOATING WHATSAPP ===== */
.floating-wa {
  position: fixed;
  bottom: 25px;
  right: 25px;
  width: 56px;
  height: 56px;
  background-color: #25D366;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 12px rgba(0,0,0,0.4);
  z-index: 9999;
  transition: transform 0.3s ease;
}
.floating-wa:hover {
  transform: scale(1.1);
}

/* ===== ADMIN STYLES ===== */
.admin-header { display: flex; justify-content: space-between; align-items: center; padding: 30px 0; border-bottom: 1px solid var(--border); margin-bottom: 40px; }
.admin-table-wrap { overflow-x: auto; background: var(--bg-2); border: 1px solid var(--border); border-radius: var(--radius); }
.admin-table { width: 100%; border-collapse: collapse; text-align: left; }
.admin-table th, .admin-table td { padding: 16px 20px; border-bottom: 1px solid var(--border); }
.admin-table th { font-size: .75rem; text-transform: uppercase; letter-spacing: .15em; color: var(--gold); background: rgba(0,0,0,.3); }
.admin-table tr:last-child td { border-bottom: none; }
.admin-table img { width: 40px; height: 40px; object-fit: cover; border-radius: 4px; border: 1px solid var(--border); }
.admin-actions { display: flex; gap: 10px; }
.action-btn { padding: 6px 12px; font-size: .75rem; border: 1px solid var(--border); border-radius: 4px; color: var(--text); transition: .2s; }
.action-btn:hover { border-color: var(--gold); color: var(--gold-2); }
.action-btn.delete { color: #a04040; border-color: #502020; }
.action-btn.delete:hover { background: #a04040; color: #fff; border-color: #a04040; }
.config-section { background: var(--bg-2); border: 1px solid var(--border); border-radius: var(--radius); padding: 30px; margin-bottom: 40px; }
.config-section h3 { margin-bottom: 20px; color: var(--gold-2); }

/* ===== RESPONSIVE ===== */
@media (max-width:900px){
  nav ul{display:none;position:absolute;top:96px;left:0;right:0;background:var(--bg-2);flex-direction:column;padding:20px;border-bottom:1px solid var(--border);gap:0}
  nav ul.open{display:flex}
  nav ul li{padding:12px 0;border-bottom:1px solid var(--border)}
  .menu-toggle{display:block}
  .dropdown-menu{position:static;opacity:1;visibility:visible;transform:none;background:transparent;border:none;padding:8px 0 0;box-shadow:none;display:none}
  .dropdown.open .dropdown-menu{display:block}
  .hero{min-height:auto;padding:60px 0}
  .hero::before{opacity:.25;mask-image:none}
  section{padding:70px 0}
  .cart-layout{grid-template-columns:1fr;}
  .cart-summary{position:static;}
  .footer-grid{grid-template-columns:1fr;gap:40px;}
  .collection-toolbar{flex-direction:column;align-items:stretch !important;gap:15px !important;}
  .collection-toolbar input{max-width:100% !important;}
  .collection-toolbar > div{display:grid;grid-template-columns:1fr 1fr;}
}
@media (max-width:480px){
  .collection-toolbar > div{grid-template-columns:1fr;}
}