:root{ --brand:#8C3A2F; --ink:#222; --muted:#6b7280; --paper:#fff; --page:#d9d8d27c; }
html,body{ background:var(--page); color:var(--ink); font-family:'Tajawal', system-ui, -apple-system, Segoe UI, Roboto, 'Noto Sans Arabic', sans-serif; }
.page{ max-width:980px; margin:40px auto; padding:40px 32px; background:var(--paper); box-shadow:0 10px 30px rgba(0,0,0,.04); }
.title{ letter-spacing:.2em; font-size:45px; font-weight:600; color:#2b2b2b; }
.brand{ color:var(--brand); font-weight:700; }
.muted{ color:var(--muted); }
.section-title{ color:var(--brand); font-weight:700; font-size:22px; letter-spacing:.08em; }
.rule{ border-top:2px solid #e5e7eb; margin:.5rem 0 1.25rem; }
.header{ display:flex; justify-content:space-between; align-items:end; gap:16px; flex-wrap:wrap; }
.category-grid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(210px, 1fr)); gap:16px; margin-top:24px; }
.category-card{ display:block; text-decoration:none; color:inherit; border:1px solid #ececec; background:#faf7f4; border-radius:16px; padding:18px; transition:transform .2s ease, box-shadow .2s ease; }
.category-card:hover{ transform:translateY(-2px); box-shadow:0 12px 20px rgba(0,0,0,.08); }
.category-card .card-en{ font-size:14px; letter-spacing:.08em; color:var(--muted); margin-top:6px; text-transform:uppercase; }
.category-card .card-ar{ font-size:20px; font-weight:700; }
.item-grid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(210px, 1fr)); gap:18px; }
.item-card{ border:1px solid #eee; border-radius:16px; overflow:hidden; background:#fff; display:flex; flex-direction:column; height:100%; }
.item-media{ background:#f3f2ee; padding:0px; display:flex; align-items:center; justify-content:center; min-height:140px; }
.item-media img{ width:100%; min-height:140px;  }

.item-body{ padding:16px; display:flex;flex-direction:column; gap:8px; }
.item-name{ font-weight:700; font-size:18px; }
.item-name-en{ font-size:14px; color:var(--muted); letter-spacing:.06em; text-transform:uppercase; }
.item-price{ font-weight:700; color:#111; }
.back-link{  font-size: 25px; justify-content: center;align-items: center;display: flex; align-items:center; gap:8px; color:#2b2b2b; text-decoration:none; font-weight:600; }
.back-link:hover{ text-decoration:underline; }
@media (max-width:600px){
  .page{ margin:16px; padding:24px 18px; }
  .title{ font-size:34px; }
  .item-media{ min-height:220px; }
  .item-media img{ width:100%;  }

 
}
@media print{
  .page{ margin:0; padding:12mm; }
  a[href]:after{ content:'' !important; }
}