/* ===== ثيم الزيتون — مشترك بين الصفحتين ===== */
:root{
  --paper:#f7f2e4;        /* خلفية بلون الورق */
  --paper-2:#efe7d1;
  --card:#fffdf6;
  --ink:#2b2a1f;
  --muted:#6f6a55;
  --line:#ddd3b6;
  --olive-900:#26301a;    /* زيتوني غامق جداً */
  --olive-800:#34421f;
  --olive-700:#45592a;
  --olive-600:#5d7334;    /* ورق الزيتون */
  --olive-400:#93a65e;
  --olive-200:#d3dcb1;
  --olive-100:#e8edd4;
  --bark:#6b4f35;         /* لون الأغصان والجذع */
  --bark-2:#8a6a48;
  --fruit:#3f2c3d;        /* ثمرة الزيتون الناضجة */
  --fruit-green:#8f9d3c;  /* ثمرة الزيتون الخضراء */
  --gold:#b8892f;
  --shadow:0 6px 24px #2b2a1f14;
  --radius:18px;
  --font-body:"Tajawal",Tahoma,Arial,sans-serif;
  --font-title:"Amiri","Traditional Arabic",serif;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:var(--font-body);font-size:17px;line-height:1.85;
  background-image:
    radial-gradient(circle at 12% 8%, #ffffff80 0, transparent 40%),
    radial-gradient(circle at 90% 60%, #e9dfc480 0, transparent 45%);
}
a{color:var(--olive-700)}
img{max-width:100%}

/* ===== الرأس ===== */
.site-header{
  position:relative;overflow:hidden;color:#f5f1df;
  background:
    radial-gradient(ellipse at 80% 0%, #6d8540 0, transparent 55%),
    linear-gradient(160deg,var(--olive-900),var(--olive-700));
}
.site-header .wrap{position:relative;z-index:2;padding:22px 18px 0}
.topnav{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.topnav .brand{font-family:var(--font-title);font-size:20px;font-weight:700;margin-inline-end:auto;color:#fff;text-decoration:none;display:flex;align-items:center;gap:8px}
.topnav a.navlink{color:#e8eccd;text-decoration:none;padding:6px 14px;border-radius:999px;font-size:15px;border:1px solid transparent}
.topnav a.navlink:hover{border-color:#ffffff40}
.topnav a.navlink.active{background:#ffffff1f;border-color:#ffffff33;color:#fff}
.topnav a.admin-pill{background:#fbf4dc;color:#7a5a18;font-weight:700;font-size:14px}
.topnav a.admin-pill:hover{border-color:#e2cf9f}
.hero{padding:44px 0 64px;max-width:640px}
.hero h1{font-family:var(--font-title);font-size:clamp(34px,6vw,58px);line-height:1.25;margin:0 0 10px;font-weight:700}
.hero p{margin:0;color:#dfe5c4;font-size:clamp(16px,2.2vw,19px)}
.hero.compact{padding:26px 0 44px}
.hero.compact h1{font-size:clamp(30px,5vw,44px)}
.header-branch{position:absolute;z-index:1;left:-30px;bottom:-14px;width:min(560px,70vw);opacity:.95;pointer-events:none}
.header-wave{display:block;width:100%;height:34px;position:relative;z-index:2;margin-top:-1px}

/* ===== التخطيط العام ===== */
.wrap{max-width:1160px;margin:auto}
main{max-width:1160px;margin:0 auto;padding:24px 16px 50px}
.section{margin:0 0 46px}
.section-title{display:flex;align-items:center;gap:12px;font-family:var(--font-title);font-size:clamp(26px,4vw,36px);color:var(--olive-800);margin:0 0 6px;line-height:1.3}
.section-title svg{flex:none;width:38px;height:38px}
.section-sub{color:var(--muted);margin:0 0 22px}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:22px;box-shadow:var(--shadow)}
.card h3{font-family:var(--font-title);color:var(--olive-700);font-size:24px;margin:0 0 8px}
.card p{margin:0 0 10px;text-align:justify}
.card p:last-child{margin-bottom:0}
strong{color:var(--olive-800)}
em{color:var(--bark);font-style:normal;font-weight:700}

.btn{font:inherit;font-size:15px;cursor:pointer;border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:999px;padding:8px 16px;display:inline-flex;align-items:center;gap:6px;text-decoration:none;line-height:1.4;transition:background .2s,border-color .2s}
.btn:hover{border-color:var(--olive-400);background:var(--olive-100)}
.btn.primary{background:var(--olive-700);border-color:var(--olive-700);color:#fff}
.btn.primary:hover{background:var(--olive-800)}
.btn.gold{background:var(--gold);border-color:var(--gold);color:#fff}
.btn:focus-visible,.navlink:focus-visible{outline:3px solid var(--olive-400);outline-offset:2px}

.site-footer{text-align:center;color:var(--muted);font-size:14px;padding:26px 16px 34px;border-top:1px solid var(--line);max-width:1160px;margin:0 auto}
.site-footer svg{width:54px;height:auto;display:block;margin:0 auto 6px;opacity:.8}

@media (max-width:640px){
  body{font-size:16px}
  .hero{padding:28px 0 48px}
  .card{padding:16px;border-radius:14px}
  .header-branch{width:86vw;left:-40px;opacity:.55}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}
}