@font-face {
  font-family: 'Peyda';
  src: url('../fonts/Peyda-Regular.woff2') format('woff2');
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: 'Peyda';
  src: url('../fonts/Peyda-Bold.woff2') format('woff2');
  font-weight: 700;
  font-display: swap;
}
@font-face {
  font-family: 'Peyda';
  src: url('../fonts/Peyda-ExtraBold.woff2') format('woff2');
  font-weight: 800;
  font-display: swap;
}
@font-face {
  font-family: 'YekanBakh';
  src: url('../fonts/YekanBakh-Regular.woff2') format('woff2');
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: 'YekanBakh';
  src: url('../fonts/YekanBakh-Bold.woff2') format('woff2');
  font-weight: 700;
  font-display: swap;
}
@font-face {
  font-family: 'YekanBakh';
  src: url('../fonts/YekanBakh-ExtraBold.woff2') format('woff2');
  font-weight: 800;
  font-display: swap;
}

:root{
  --espresso:#1c2748;
  --espresso-2:#212d52;
  --cream:#f8f4ec;
  --cream-2:#ece3d3;
  --gold:#b8794f;
  --gold-dark:#8a5a38;
  --ink:#221c14;
  --ink-soft:#6b6152;
  --sage:#7c8b5f;
  --sage-dark:#4c5638;
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  font-family:'Peyda', sans-serif;
  background:var(--cream);
  color:var(--ink);
  line-height:1.7;
}

/* ---------- HERO ---------- */
.hero{
  background:var(--espresso);
  color:var(--cream);
  padding:0 0 34px;
  text-align:center;
}
.hero-topbar{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:18px 22px;
}
.hero-topbar .fa-name{
  font-family:'YekanBakh', sans-serif;
  font-weight:700;
  font-size:22px;
  color:var(--gold);
}
.hero-topbar .en-name{
  font-family:'Peyda', sans-serif;
  font-size:12px;
  letter-spacing:2px;
  text-transform:uppercase;
  color:#cfa27c;
}
.hero-emblem{
  position:relative;
  width:118px;
  height:118px;
  margin:6px auto 14px;
  display:flex;
  align-items:center;
  justify-content:center;
}
.hero-emblem .ring{
  position:absolute;
  inset:0;
  border-radius:50%;
  background:conic-gradient(from 0deg,
      transparent 0deg, var(--gold) 40deg, transparent 90deg,
      transparent 180deg, var(--gold) 220deg, transparent 270deg, transparent 360deg);
  -webkit-mask:radial-gradient(farthest-side, transparent calc(100% - 3px), #000 calc(100% - 2px));
          mask:radial-gradient(farthest-side, transparent calc(100% - 3px), #000 calc(100% - 2px));
  animation:heroRingSpin 22s linear infinite;
}
@keyframes heroRingSpin{ to{ transform:rotate(360deg); } }
.hero-logo{
  width:80px;
  display:block;
  filter:drop-shadow(0 6px 16px rgba(0,0,0,0.35));
}
.hero p{margin-top:10px; color:#e7ddc9; font-size:14px;}

/* ---------- MAIN MENU TOGGLE ---------- */
.maintabs-wrap{
  position:sticky;
  top:0;
  z-index:30;
  background:var(--espresso);
  border-bottom:1px solid rgba(201,154,59,0.25);
  transition:all .3s ease;
}
.maintabs{
  max-width:520px;
  margin:0 auto;
  display:flex;
  padding:12px 20px;
  gap:8px;
  transition:padding .3s ease;
}
.maintabs button{
  flex:1;
  font-family:'Peyda', sans-serif;
  font-weight:600;
  font-size:14.5px;
  padding:11px 10px;
  border-radius:999px;
  border:1px solid rgba(201,154,59,0.35);
  background:transparent;
  color:#e7d9c4;
  cursor:pointer;
  transition:all .3s ease;
}
.maintabs button.active{
  background:var(--gold);
  color:var(--espresso);
  border-color:var(--gold);
}
.maintabs-wrap.compact .maintabs{ padding:6px 20px; }
.maintabs-wrap.compact .maintabs button{
  font-size:11.5px;
  padding:5px 8px;
  font-weight:500;
}

/* ---------- SUBCATEGORY NAV ---------- */
.catnav-wrap{
  position:sticky;
  top:52px;
  z-index:20;
  background:var(--cream);
  border-bottom:1px solid var(--cream-2);
  box-shadow:0 4px 14px -8px rgba(43,31,26,0.18);
  transition:top .3s ease;
}
.catnav{
  display:flex;
  gap:8px;
  overflow-x:auto;
  padding:12px 20px;
  scrollbar-width:none;
  transition:padding .3s ease;
}
.catnav::-webkit-scrollbar{display:none;}
.catnav button{
  flex:none;
  font-family:'Peyda', sans-serif;
  font-weight:600;
  font-size:13px;
  color:var(--ink-soft);
  background:transparent;
  border:1px solid var(--cream-2);
  border-radius:999px;
  padding:7px 16px;
  cursor:pointer;
  transition:all .3s ease;
  white-space:nowrap;
}
.catnav button.active{
  background:var(--espresso);
  color:var(--gold);
  border-color:var(--espresso);
}
.catnav-wrap.expanded{ top:34px; }
.catnav-wrap.expanded .catnav{ padding:16px 20px; }
.catnav-wrap.expanded .catnav button{
  font-size:15.5px;
  padding:11px 22px;
  font-weight:700;
}

/* ---------- MAIN GROUPS ---------- */
.menu-group{display:none;}
.menu-group.active{display:block;}

.menu-wrap{
  max-width:760px;
  margin:0 auto;
  padding:6px 20px 80px;
}

section.subcat{
  padding-top:44px;
  scroll-margin-top:112px;
}
.cat-head{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:18px;
}
.cat-icon{
  width:38px; height:38px;
  flex:none;
  border-radius:50%;
  background:var(--espresso);
  display:flex; align-items:center; justify-content:center;
}
.cat-icon svg{width:19px; height:19px;}
.cat-head h2{
  font-family:'YekanBakh', sans-serif;
  font-weight:700;
  font-size:20px;
  color:var(--ink);
}
.cat-head span{
  display:block;
  font-size:12px;
  color:var(--ink-soft);
  margin-top:1px;
}

/* ---------- ITEM ROWS (list style, dense) ---------- */
.item-list{border-top:1px solid var(--cream-2);}
.item-row{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:16px;
  padding:14px 2px;
  border-bottom:1px dashed var(--cream-2);
}
.item-thumb{
  flex:none;
  width:52px; height:52px;
  border-radius:12px;
  object-fit:cover;
  background:var(--cream-2);
}
.item-info{flex:1; min-width:0;}
.item-name{font-weight:600; font-size:15px; color:var(--ink);}
.item-desc{
  font-size:12.5px;
  color:var(--ink-soft);
  margin-top:4px;
}
.item-row.unavailable{ opacity:.5; }
.item-row.unavailable .item-prices{ display:none; }
.item-row.unavailable .item-info::after{
  content:"ناموجود";
  display:inline-block;
  margin-inline-start:8px;
  font-size:11px;
  font-weight:700;
  color:#a33;
}

.item-prices{
  flex:none;
  text-align:left;
  display:flex;
  flex-direction:column;
  gap:3px;
  min-width:88px;
}
.price-single{font-weight:700; font-size:15px; color:var(--sage-dark); white-space:nowrap;}
.price-single::after{content:" ت"; font-size:11px; font-weight:400; color:var(--ink-soft);}
.price-variant{font-size:12.5px; color:var(--sage-dark); white-space:nowrap;}
.price-variant b{font-weight:700;}
.price-variant .vlabel{color:var(--ink-soft); font-weight:400;}

/* ---------- CONTACT / FOOTER ---------- */
.contact-banner{
  background:var(--espresso);
  overflow:hidden;
}
.contact-banner img{
  width:100%;
  display:block;
  max-height:220px;
  object-fit:cover;
  opacity:0.85;
}
.contact-info{
  background:var(--espresso);
  color:#e7ddc9;
  padding:28px 24px 8px;
  text-align:center;
}
.contact-info h3{
  font-family:'YekanBakh', sans-serif;
  font-weight:700;
  font-size:20px;
  color:var(--gold);
  margin-bottom:14px;
}
.contact-row{
  display:flex;
  justify-content:center;
  gap:22px;
  flex-wrap:wrap;
  font-size:13px;
  margin-bottom:10px;
}
.contact-row a{
  color:inherit;
  text-decoration:none;
  direction:rtl;
  unicode-bidi:isolate;
  transition:color .2s ease;
}
.contact-row a:hover{ color:var(--gold); }
.contact-addr{
  font-size:12.5px;
  color:#c8bda6;
  max-width:360px;
  margin:0 auto 6px;
}
.ig-link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:38px; height:38px;
  margin-top:6px;
  border-radius:50%;
  border:1px solid rgba(201,154,59,0.4);
  color:#e7ddc9;
  transition:all .25s ease;
}
.ig-link:hover{
  background:var(--gold);
  border-color:var(--gold);
  color:var(--espresso);
}
.ig-link svg{width:19px; height:19px;}

footer{
  text-align:center;
  padding:20px 20px 40px;
  background:var(--espresso);
  color:#8f8571;
  font-size:11.5px;
}
