:root{
  --black:#0b0906;
  --panel:#17130f;
  --panel-2:#1e1811;
  --gold:#c9a24c;
  --gold-light:#f1dd9c;
  --gold-deep:#7a5f26;
  --cream:#f3ead1;
  --cream-dim:#cdbfa0;
  --wine:#7c2020;
  --wine-light:#a5342f;
  --green:#25c95a;
  --line: rgba(201,162,76,0.28);
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:
    radial-gradient(ellipse at top, rgba(201,162,76,0.07), transparent 55%),
    var(--black);
  color:var(--cream);
  font-family:'Jost', sans-serif;
  font-weight:400;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
::selection{background:var(--gold); color:#1a1206;}

a{color:inherit;}
h1,h2,h3{margin:0; font-family:'Playfair Display', serif;}

/* ---------- dot-grid signature motif ---------- */
.dotgrid{display:flex; justify-content:center; gap:8px; align-items:center;}
.dotgrid span{width:5px; height:5px; border-radius:50%; background:var(--gold); opacity:.85;}

/* ---------- ambient embers ---------- */
.embers{
  position:fixed; inset:0; pointer-events:none; z-index:1; overflow:hidden;
}
.embers span{
  position:absolute; bottom:-10px;
  width:3px; height:3px; border-radius:50%;
  background:var(--gold);
  opacity:0;
  animation: rise linear infinite;
  box-shadow:0 0 6px 1px rgba(201,162,76,0.6);
}
@keyframes rise{
  0%{opacity:0; transform:translateY(0) translateX(0);}
  8%{opacity:.7;}
  90%{opacity:.5;}
  100%{opacity:0; transform:translateY(-100vh) translateX(var(--drift, 20px));}
}

/* ---------- HEADER ---------- */
header{
  position:sticky; top:0; z-index:40;
  background:rgba(11,9,6,0.92);
  backdrop-filter: blur(10px);
  border-bottom:1px solid var(--line);
}
.header-inner{
  max-width:1180px; margin:0 auto;
  display:flex; align-items:center; justify-content:space-between;
  padding:14px 20px; gap:16px;
}
.brand{display:flex; align-items:center; gap:12px;}
.crest{width:40px; height:40px; flex:none; transition:transform .6s ease;}
.spin-hover:hover{transform:rotate(8deg) scale(1.08);}
.brand-text{line-height:1;}
.brand-name{
  font-family:'Alex Brush', cursive;
  font-size:30px;
  color:var(--gold-light);
  letter-spacing:.5px;
}
.brand-sub{
  font-family:'Cinzel', serif;
  font-size:10px; letter-spacing:5px;
  color:var(--cream-dim); margin-top:-4px;
}
.header-actions{display:flex; align-items:center; gap:14px;}
.wa-pill{
  display:flex; align-items:center; gap:8px;
  border:1px solid var(--line);
  padding:8px 14px; border-radius:100px;
  font-size:13px; color:var(--cream-dim);
  text-decoration:none; transition:.2s;
}
.wa-pill:hover{border-color:var(--gold); color:var(--gold-light); box-shadow:0 0 14px rgba(201,162,76,.25);}
.cart-btn{
  position:relative;
  background:none; border:1px solid var(--gold-deep);
  width:42px; height:42px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  cursor:pointer; color:var(--gold-light);
  transition:.25s;
}
.cart-btn:hover{background:var(--gold); color:#1a1206; border-color:var(--gold); transform:scale(1.06);}
.cart-btn.bump{animation:bump .35s ease;}
@keyframes bump{
  0%{transform:scale(1);} 35%{transform:scale(1.28);} 100%{transform:scale(1);}
}
.cart-count{
  position:absolute; top:-6px; right:-6px;
  background:var(--wine-light); color:var(--cream);
  font-size:11px; font-weight:600;
  min-width:19px; height:19px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  border:1.5px solid var(--black);
}

/* ---------- HERO ---------- */
.hero{
  position:relative; padding:64px 20px 44px;
  text-align:center; overflow:hidden;
  border-bottom:1px solid var(--line);
}
.hero::before{
  content:""; position:absolute; inset:0;
  background-image: radial-gradient(circle, var(--gold) 1px, transparent 1.4px);
  background-size: 26px 26px; opacity:.05; pointer-events:none;
}
.hero-glow{
  position:absolute; top:-120px; left:50%; transform:translateX(-50%);
  width:520px; height:320px;
  background:radial-gradient(ellipse, rgba(201,162,76,0.18), transparent 70%);
  filter:blur(10px);
  animation: pulseGlow 6s ease-in-out infinite;
}
@keyframes pulseGlow{
  0%,100%{opacity:.6; transform:translateX(-50%) scale(1);}
  50%{opacity:1; transform:translateX(-50%) scale(1.08);}
}
.hero-crest{width:74px; height:74px; margin:0 auto 18px; animation: floatY 5s ease-in-out infinite;}
@keyframes floatY{
  0%,100%{transform:translateY(0);}
  50%{transform:translateY(-8px);}
}
.hero h1{
  font-family:'Alex Brush', cursive;
  font-size:min(15vw, 92px);
  line-height:1;
}
.shimmer-text{
  background:linear-gradient(90deg, var(--gold-deep) 0%, var(--gold-light) 25%, var(--gold) 50%, var(--gold-light) 75%, var(--gold-deep) 100%);
  background-size:250% auto;
  -webkit-background-clip:text; background-clip:text; color:transparent;
  animation: shimmer 6s linear infinite;
}
@keyframes shimmer{
  0%{background-position:0% 50%;}
  100%{background-position:250% 50%;}
}
.hero .sub{
  font-family:'Cinzel', serif; letter-spacing:9px; font-size:13px;
  color:var(--cream-dim); margin-top:6px;
}
.hero p.tag{
  max-width:520px; margin:22px auto 0; color:var(--cream-dim);
  font-size:15px; line-height:1.7;
}
.hero-stars{margin-top:16px; color:var(--gold); font-size:14px; letter-spacing:3px;}

.halfhalf-banner{
  margin:28px auto 0; display:flex; align-items:center; gap:10px;
  background:linear-gradient(90deg, rgba(124,32,32,0.25), rgba(201,162,76,0.18));
  border:1px solid var(--gold-deep);
  color:var(--gold-light);
  padding:12px 22px; border-radius:100px;
  font-size:13.5px; cursor:pointer;
  transition:.25s;
  position:relative; z-index:2;
}
.halfhalf-banner:hover{
  border-color:var(--gold); box-shadow:0 0 22px rgba(201,162,76,0.3);
  transform:translateY(-2px);
}
.hb-icon{font-size:17px; animation: spinSlow 4s linear infinite;}
@keyframes spinSlow{ to{ transform:rotate(360deg); } }
.hb-arrow{transition:.2s;}
.halfhalf-banner:hover .hb-arrow{transform:translateX(4px);}

/* ---------- CATEGORY NAV ---------- */
.catnav-wrap{
  position:sticky; top:69px; z-index:30;
  background:rgba(11,9,6,0.95);
  border-bottom:1px solid var(--line);
  backdrop-filter: blur(10px);
}
.catnav{
  max-width:1180px; margin:0 auto;
  display:flex; gap:8px; padding:12px 20px;
  overflow-x:auto; scrollbar-width:none;
}
.catnav::-webkit-scrollbar{display:none;}
.catnav button{
  flex:none; background:transparent; border:1px solid var(--gold-deep);
  color:var(--cream-dim); padding:9px 18px; border-radius:100px;
  font-family:'Jost', sans-serif; font-size:13px; letter-spacing:.5px;
  cursor:pointer; transition:.2s; white-space:nowrap;
}
.catnav button.active, .catnav button:hover{
  background:var(--gold); border-color:var(--gold); color:#1a1206; font-weight:500;
}
.catnav button.special{
  border-color:var(--wine-light); color:var(--gold-light);
}
.catnav button.special:hover{background:var(--wine-light); border-color:var(--wine-light); color:var(--cream);}

/* ---------- MAIN / MENU ---------- */
main{max-width:1180px; margin:0 auto; padding:44px 20px 100px; position:relative; z-index:2;}
.cat-section{margin-bottom:56px; scroll-margin-top:150px;}
.cat-header{display:flex; align-items:center; gap:18px; margin-bottom:26px;}
.cat-header h2{font-size:26px; color:var(--gold-light); white-space:nowrap;}
.cat-rule{flex:1; height:1px; background:linear-gradient(90deg, var(--line), transparent);}

.grid{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(300px,1fr));
  gap:16px;
}
.item-card{
  background:linear-gradient(160deg, var(--panel), var(--panel-2));
  border:1px solid var(--line);
  border-radius:10px;
  padding:18px 18px 16px;
  display:flex; flex-direction:column; gap:10px;
  position:relative;
  opacity:0; transform:translateY(18px);
  transition:opacity .5s ease, transform .5s ease, border-color .2s, box-shadow .2s;
  transition-delay:var(--d, 0ms);
}
.item-card.in-view{opacity:1; transform:translateY(0);}
.item-card:hover{
  border-color:var(--gold);
  transform:translateY(-4px);
  box-shadow:0 14px 30px rgba(0,0,0,0.35), 0 0 0 1px rgba(201,162,76,.15);
}
.item-top{display:flex; justify-content:space-between; gap:10px; align-items:flex-start;}
.item-name-row{display:flex; align-items:baseline; gap:8px; flex-wrap:wrap;}
.item-num{font-family:'Cinzel', serif; font-size:11px; color:var(--gold-deep);}
.item-name{font-family:'Playfair Display', serif; font-weight:600; font-size:17px; color:var(--cream);}
.badge-novo{
  background:var(--wine-light); color:var(--cream);
  font-size:9px; letter-spacing:1px; font-weight:600;
  padding:3px 7px; border-radius:4px; text-transform:uppercase;
  animation: badgePulse 2.4s ease-in-out infinite;
}
@keyframes badgePulse{
  0%,100%{box-shadow:0 0 0 rgba(165,52,47,0);}
  50%{box-shadow:0 0 10px rgba(165,52,47,0.65);}
}
.item-desc{color:var(--cream-dim); font-size:13px; line-height:1.5; min-height:36px;}
.item-bottom{
  display:flex; align-items:center; justify-content:space-between;
  margin-top:auto; padding-top:8px; border-top:1px dashed var(--line);
}
.item-price{font-family:'Playfair Display', serif; font-weight:700; color:var(--gold-light); font-size:17px;}

.add-btn{
  background:transparent; border:1px solid var(--gold);
  color:var(--gold-light); width:34px; height:34px; border-radius:50%;
  font-size:18px; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  transition:.15s;
}
.add-btn:hover{background:var(--gold); color:#1a1206; transform:scale(1.08);}
.add-btn:active{transform:scale(.92);}

.qty-row{display:flex; align-items:center; gap:10px;}
.qty-row button{
  background:transparent; border:1px solid var(--gold-deep);
  color:var(--gold-light); width:28px; height:28px; border-radius:50%;
  font-size:15px; cursor:pointer; line-height:1; transition:.15s;
}
.qty-row button:hover{background:var(--gold); color:#1a1206;}
.qty-row span{min-width:16px; text-align:center; font-size:14px;}

/* ---------- FOOTER ---------- */
footer{
  border-top:1px solid var(--line);
  padding:40px 20px 30px; text-align:center;
  background:var(--panel);
  position:relative; z-index:2;
}
footer .crest{width:34px; height:34px; margin:0 auto 12px; opacity:.9;}
footer .fname{font-family:'Playfair Display', serif; color:var(--gold-light); font-size:15px; letter-spacing:1px;}
footer .ftag{color:var(--cream-dim); font-size:12.5px; margin-top:6px;}
footer .dotgrid{margin-top:18px;}

/* ---------- TOAST ---------- */
.toast{
  position:fixed; left:50%; bottom:26px; transform:translate(-50%, 20px);
  background:var(--gold); color:#1a1206;
  padding:11px 22px; border-radius:100px;
  font-size:13.5px; font-weight:500;
  box-shadow:0 10px 26px rgba(0,0,0,0.4);
  z-index:80; opacity:0; pointer-events:none;
  transition:opacity .3s ease, transform .3s ease;
}
.toast.show{opacity:1; transform:translate(-50%, 0);}

/* ---------- FLOATING CART (mobile) ---------- */
.floating-cart{
  position:fixed; left:16px; right:16px; bottom:16px; z-index:45;
  background:var(--wine); color:var(--cream);
  border-radius:14px; padding:14px 18px;
  display:none; align-items:center; justify-content:space-between;
  box-shadow:0 10px 30px rgba(0,0,0,0.5);
  cursor:pointer; border:1px solid rgba(255,255,255,0.08);
  transform:translateY(120%); transition:transform .35s ease;
}
.floating-cart.show{display:flex; transform:translateY(0);}
.floating-cart .fc-left{display:flex; align-items:center; gap:10px; font-size:14px;}
.floating-cart .fc-count{
  background:rgba(255,255,255,0.18); width:24px; height:24px; border-radius:50%;
  display:flex; align-items:center; justify-content:center; font-size:12px; font-weight:600;
}
.floating-cart .fc-total{font-family:'Playfair Display', serif; font-weight:700;}

/* ---------- CART DRAWER ---------- */
.overlay{
  position:fixed; inset:0; background:rgba(0,0,0,0.6);
  z-index:50; opacity:0; pointer-events:none; transition:.25s;
}
.overlay.open{opacity:1; pointer-events:auto;}
.drawer{
  position:fixed; top:0; right:0; height:100%;
  width:min(420px, 100%);
  background:var(--panel);
  border-left:1px solid var(--line);
  z-index:60;
  transform:translateX(100%);
  transition:.35s cubic-bezier(.16,1,.3,1);
  display:flex; flex-direction:column;
}
.drawer.open{transform:translateX(0);}
.drawer-head{
  display:flex; align-items:center; justify-content:space-between;
  padding:20px; border-bottom:1px solid var(--line);
}
.drawer-head h3{font-size:20px; color:var(--gold-light);}
.drawer-close{background:none; border:none; color:var(--cream-dim); font-size:22px; cursor:pointer; line-height:1; transition:.2s;}
.drawer-close:hover{color:var(--gold); transform:rotate(90deg);}
.drawer-body{flex:1; overflow-y:auto; padding:16px 20px;}
.empty-cart{text-align:center; color:var(--cream-dim); padding:60px 10px; font-size:14px;}
.empty-cart .dotgrid{margin-bottom:16px;}

.cart-item{
  display:flex; justify-content:space-between; gap:12px;
  padding:14px 0; border-bottom:1px solid var(--line);
  animation: fadeInUp .3s ease;
}
@keyframes fadeInUp{
  from{opacity:0; transform:translateY(8px);}
  to{opacity:1; transform:translateY(0);}
}
.ci-name{font-family:'Playfair Display', serif; font-size:14.5px; color:var(--cream);}
.ci-unit{font-size:12px; color:var(--cream-dim); margin-top:2px;}
.ci-right{display:flex; flex-direction:column; align-items:flex-end; gap:8px;}
.ci-remove{background:none; border:none; color:var(--wine-light); font-size:11px; cursor:pointer; text-decoration:underline; padding:0;}
.ci-subtotal{font-family:'Playfair Display', serif; color:var(--gold-light); font-size:14px; font-weight:600;}

.drawer-foot{border-top:1px solid var(--line); padding:18px 20px 22px;}
.field label{
  display:block; font-size:11.5px; letter-spacing:.5px; color:var(--cream-dim);
  margin-bottom:6px; text-transform:uppercase;
}
.field textarea, .field select{
  width:100%; background:var(--panel-2); border:1px solid var(--line);
  border-radius:8px; color:var(--cream); padding:10px 12px;
  font-family:'Jost', sans-serif; font-size:13.5px; resize:vertical;
  transition:border-color .2s;
}
.field textarea:focus, .field select:focus{outline:none; border-color:var(--gold);}
.field{margin-bottom:14px;}
.field textarea{min-height:56px;}

.totals-block{margin:14px 0 16px;}
.mini-row{
  display:flex; justify-content:space-between;
  font-size:13px; color:var(--cream-dim); padding:3px 0;
}
.total-row{
  display:flex; justify-content:space-between; align-items:baseline;
  margin-top:8px; padding-top:8px; border-top:1px dashed var(--line);
}
.total-row span:first-child{color:var(--cream-dim); font-size:13px; letter-spacing:1px; text-transform:uppercase;}
.total-row span:last-child{font-family:'Playfair Display', serif; color:var(--gold-light); font-size:24px; font-weight:700;}
.send-btn{
  width:100%;
  background:linear-gradient(180deg, #25c95a, #1fae4c);
  color:#0b1a0e; border:none; border-radius:10px; padding:14px;
  font-family:'Jost', sans-serif; font-weight:600; font-size:15px; letter-spacing:.3px;
  cursor:pointer; display:flex; align-items:center; justify-content:center; gap:9px;
  transition:.2s;
}
.send-btn:hover{filter:brightness(1.08); transform:translateY(-1px);}
.send-btn:disabled{opacity:.4; cursor:not-allowed; transform:none;}

/* ---------- HALF & HALF MODAL ---------- */
.modal{
  position:fixed; top:50%; left:50%;
  transform:translate(-50%, -50%) scale(.92);
  width:min(440px, 92vw);
  max-height:88vh; overflow-y:auto;
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:16px;
  z-index:70;
  opacity:0; pointer-events:none;
  transition:.28s cubic-bezier(.16,1,.3,1);
  box-shadow:0 30px 60px rgba(0,0,0,0.5);
}
.modal.open{opacity:1; pointer-events:auto; transform:translate(-50%, -50%) scale(1);}
.modal-head{
  display:flex; align-items:center; justify-content:space-between;
  padding:20px 20px 4px;
}
.modal-head h3{font-size:20px; color:var(--gold-light);}
.modal-body{padding:16px 20px 22px;}
.modal-hint{font-size:12.5px; color:var(--cream-dim); line-height:1.6; margin:6px 0 16px;}
.segmented{
  display:flex; gap:6px; padding:0 20px; margin-top:6px;
}
.segmented button{
  flex:1; background:var(--panel-2); border:1px solid var(--line);
  color:var(--cream-dim); padding:8px; border-radius:8px;
  font-size:13px; cursor:pointer; transition:.2s;
}
.segmented button.active{background:var(--gold); border-color:var(--gold); color:#1a1206; font-weight:600;}
.half-preview{
  background:var(--panel-2); border:1px dashed var(--line);
  border-radius:10px; padding:14px; margin:6px 0 18px;
  font-size:13.5px; color:var(--cream-dim); text-align:center; line-height:1.6;
}
.half-preview strong{color:var(--gold-light); font-family:'Playfair Display', serif; font-size:16px;}
.add-half-btn{background:linear-gradient(180deg, var(--gold-light), var(--gold)); color:#1a1206;}

@media(max-width:640px){
  .brand-name{font-size:24px;}
  .hero h1{font-size:20vw;}
  .halfhalf-banner{font-size:12px; padding:10px 16px; text-align:left;}
  .floating-cart{display:none;}
  .floating-cart.show{display:flex;}
}

@media (prefers-reduced-motion: reduce){
  *{animation:none !important; transition:none !important;}
}
