:root{
  --gold:#c99b4b;
  --gold-dark:#b5843f;
  --bg:#fff9f0;
  --muted:#6d6d6d;
  --card:#fff;
  --radius:12px;
  --shadow: 0 8px 24px rgba(0,0,0,0.08);
  font-family: 'Tajawal', system-ui, -apple-system, 'Segoe UI', Roboto, Arial;
}
*{box-sizing:border-box}
html,body{height:100%;margin:0;padding:0;direction:rtl;background:var(--bg);color:#222}
.container{max-width:980px;margin:0 auto;padding:16px}
.hero{padding:20px 0 6px;text-align:center}
.brand .logo{font-weight:900;font-size:30px;color:var(--gold)}
.brand .logo span{color:var(--gold-dark)}
.tagline{margin:6px 0 0;color:var(--muted);font-size:14px}
.welcome{font-size:20px;margin:8px 0 6px}
.subtitle{color:var(--muted);font-size:14px;margin:0 0 18px}
.card{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);padding:14px;margin:12px 0}
.categories .cats-track{display:flex;gap:10px;overflow-x:auto;padding:6px 4px}
.categories a{background:linear-gradient(180deg,var(--gold),var(--gold-dark));color:#fff;padding:8px 14px;border-radius:20px;text-decoration:none;white-space:nowrap;font-weight:700}

/* form */
.form-section label{display:block;margin-bottom:10px;font-size:14px}
.form-section input{width:100%;padding:12px;border-radius:10px;border:1px solid #eee;margin-top:6px;font-size:14px}
.actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center;justify-content:flex-start}
.cta{background:linear-gradient(180deg,var(--gold),var(--gold-dark));border:none;color:#fff;padding:12px 18px;border-radius:12px;font-weight:700;cursor:pointer;box-shadow:0 8px 20px rgba(0,0,0,0.08)}
.lead{color:var(--muted)}

/* modal */
.modal{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;padding:20px;background:rgba(0,0,0,0.28);z-index:200;visibility:hidden;opacity:0;transition:opacity .18s}
.modal[aria-hidden="false"]{visibility:visible;opacity:1}
.modal-content{max-width:420px;width:100%;text-align:center;position:relative;padding:18px;border-radius:12px}
.modal-close{position:absolute;left:10px;top:8px;border:none;background:transparent;font-size:24px;cursor:pointer}
.code-box{border-radius:10px;padding:12px;margin:10px auto;font-weight:800;background:linear-gradient(90deg,#fff8ef,#fff);max-width:220px}
.muted{color:var(--muted);font-size:13px}

/* slideshow */
.slideshow{display:flex;gap:12px;overflow-x:auto;padding:8px 4px}
.slide{flex:0 0 220px;border-radius:12px;overflow:hidden;border:4px solid rgba(201,155,75,0.15);background:#fff;text-decoration:none;color:inherit;box-shadow:0 8px 20px rgba(0,0,0,0.06);display:block}
.slide img{width:100%;height:160px;object-fit:cover;display:block}
.slide .caption{padding:8px;font-weight:700;text-align:center;background:linear-gradient(180deg, rgba(201,155,75,0.06), transparent)}

/* whatsapp floating button */
.whatsapp-fab{position:fixed;right:16px;bottom:16px;width:56px;height:56px;border-radius:50%;background:#25D366;display:flex;align-items:center;justify-content:center;color:#fff;z-index:300;text-decoration:none;box-shadow:0 8px 24px rgba(0,0,0,0.2)}
.whatsapp-fab svg{width:26px;height:26px}

/* footer */
.footer{text-align:center;padding:18px 8px;color:var(--muted);font-size:13px}

/* responsive */
@media(min-width:720px){.slide{flex:0 0 260px}.slide img{height:180px}}