/* =============================================================
   نشرة النظام الجديد — واجهة الموقع
   Palette sampled from the masthead logo: carmine #9B1214 on white,
   ink black for type.  Display face: Amiri (naskh, print heritage).
   UI face: IBM Plex Sans Arabic.
   ============================================================= */

:root{
  --ink:#111010;
  --ink-soft:#34302C;
  --muted:#6E675F;
  --paper:#F5F3EB;
  --tint:#FAF8F4;
  --tint-2:#F3EFE9;
  --rule:#E6E1DA;
  --crimson:#9B1214;
  --crimson-2:#C1272D;
  --crimson-deep:#6E0D10;

  --display:'Amiri','Noto Naskh Arabic',Georgia,serif;
  --ui:'IBM Plex Sans Arabic','Segoe UI',system-ui,sans-serif;

  --wrap:1180px;
  --gap:clamp(1.25rem,3vw,2.25rem);
  --shadow:0 1px 2px rgba(17,16,16,.05), 0 8px 24px -18px rgba(17,16,16,.35);
}

*,*::before,*::after{box-sizing:border-box}

html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--ui);
  font-size:16px;
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
}

img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
a:hover{color:var(--crimson)}
:focus-visible{outline:2px solid var(--crimson);outline-offset:3px}

.wrap{width:min(100% - 2.2rem,var(--wrap));margin-inline:auto}

.skip{position:absolute;inset-inline-start:-9999px;top:0;background:var(--ink);color:#fff;padding:.6rem 1rem;z-index:99}
.skip:focus{inset-inline-start:0}

/* ---------- شريط علوي ---------- */
.topbar{background:var(--ink);color:#CFC9C2;font-size:.78rem;letter-spacing:.01em}
.topbar-in{display:flex;justify-content:space-between;align-items:center;min-height:34px;gap:1rem;flex-wrap:wrap}
.topbar-date{opacity:.85}
.topbar-links{display:flex;gap:1.1rem}
.topbar-links a{opacity:.85}
.topbar-links a:hover{color:#fff;opacity:1}

/* ---------- الترويسة ---------- */
.masthead{background:var(--paper);text-align:center;padding:clamp(1.4rem,3.4vw,2.6rem) 0 1rem}
.masthead-in{display:flex;flex-direction:column;align-items:center;gap:.35rem}
.brand img{width:min(340px,62vw);height:auto}
.brand-tag{
  margin:0;font-family:var(--ui);font-size:.76rem;font-weight:500;
  letter-spacing:.34em;color:var(--muted);
  padding-inline-start:.34em; /* balance the tracking on the last letter */
}

/* ---------- القائمة ---------- */
.mainnav{
  position:sticky;top:0;z-index:50;background:rgba(245,243,235,.97);
  backdrop-filter:saturate(150%) blur(6px);
  border-top:1px solid var(--rule);
  border-bottom:3px double var(--ink);
}
.mainnav-in{display:flex;align-items:center;gap:.75rem;min-height:52px}
.navlist{display:flex;list-style:none;margin:0;padding:0;gap:.15rem;flex:1;flex-wrap:wrap}
.navlist a{
  display:block;padding:.85rem .95rem;font-size:.94rem;font-weight:600;
  color:var(--ink-soft);position:relative;
}
.navlist a::after{
  content:"";position:absolute;inset-inline:.95rem;bottom:.55rem;height:2px;
  background:var(--crimson);transform:scaleX(0);transform-origin:right;
  transition:transform .22s ease;
}
.navlist a:hover::after,.navlist a.is-on::after{transform:scaleX(1)}
.navlist a.is-on{color:var(--crimson)}

.nav-mini-brand{display:none;padding-inline-end:.6rem}
.nav-mini-brand img{width:64px}
.mainnav.is-stuck .nav-mini-brand{display:block}

.nav-toggle{
  display:none;align-items:center;gap:.5rem;background:none;border:0;cursor:pointer;
  font-family:var(--ui);font-size:.9rem;font-weight:600;color:var(--ink);padding:.7rem .2rem;
}
.nav-toggle-bars{display:inline-flex;flex-direction:column;gap:3px;width:18px}
.nav-toggle-bars i{height:2px;background:var(--ink);border-radius:2px}

.navsearch{display:flex;align-items:center;border:1px solid var(--rule);border-radius:2px;background:var(--tint)}
.navsearch input{
  border:0;background:none;padding:.42rem .7rem;font-family:var(--ui);font-size:.85rem;
  width:8.5rem;color:var(--ink);
}
.navsearch input:focus{outline:none;width:11rem}
.navsearch input{transition:width .2s ease}
.navsearch button{border:0;background:none;cursor:pointer;color:var(--muted);padding:.3rem .55rem;display:flex}
.navsearch button:hover{color:var(--crimson)}

/* ---------- العنوان القوسي (التوقيع البصري) ---------- */
/* The thin red arc that cradles the logo is reused as the rule
   under every section heading — the site's signature device.     */
.sec-head{margin:0 0 1.4rem;text-align:center}
.sec-head h2{
  font-family:var(--display);font-weight:700;
  font-size:clamp(1.5rem,3vw,2rem);margin:0;line-height:1.3;
}
.sec-head .arc{display:block;margin:.15rem auto 0;width:min(230px,60%);height:14px;color:var(--crimson)}
.sec-head .sub{font-size:.85rem;color:var(--muted);margin:.35rem 0 0}
.sec-head--start{text-align:start}
.sec-head--start .arc{margin-inline:0}

/* الترويسة الجانبية */
.side-head{
  font-family:var(--ui);font-size:.76rem;font-weight:700;letter-spacing:.22em;
  color:var(--crimson);margin:0 0 .9rem;padding-bottom:.55rem;
  border-bottom:1px solid var(--rule);
}

/* ---------- كلمات دالة ---------- */
.kicker{
  font-family:var(--ui);font-size:.7rem;font-weight:700;letter-spacing:.18em;
  color:var(--crimson);text-transform:none;display:inline-block;margin-bottom:.5rem;
}
.meta{font-family:var(--ui);font-size:.8rem;color:var(--muted);display:flex;gap:.7rem;flex-wrap:wrap;align-items:center}
.meta a{color:var(--ink-soft);font-weight:600}
.meta a:hover{color:var(--crimson)}
.meta .dot{width:3px;height:3px;border-radius:50%;background:var(--rule);display:inline-block}

/* ---------- الصفحة الرئيسية: الافتتاحية ---------- */
.lead{padding:clamp(1.8rem,4vw,3rem) 0 clamp(2rem,4.5vw,3.2rem)}
.lead-grid{display:grid;grid-template-columns:1.35fr .95fr;gap:clamp(1.5rem,3.5vw,3rem);align-items:start}
.lead-main{border-inline-end:1px solid var(--rule);padding-inline-end:clamp(1.5rem,3.5vw,3rem)}
.lead-figure{position:relative;margin:0 0 1.1rem;background:var(--tint-2)}
.lead-figure img{width:100%;aspect-ratio:16/9;object-fit:cover}
.lead-title{
  font-family:var(--display);font-weight:700;line-height:1.28;
  font-size:clamp(1.9rem,4.4vw,3.05rem);margin:.2rem 0 .7rem;letter-spacing:-.01em;
}
.lead-title a:hover{color:var(--crimson)}
.lead-excerpt{
  font-family:var(--display);font-size:1.16rem;line-height:1.9;color:var(--ink-soft);
  margin:0 0 .9rem;
}

/* عمود الأحدث */
.digest{list-style:none;margin:0;padding:0}
.digest li{padding:.95rem 0;border-bottom:1px solid var(--rule);display:flex;gap:.9rem;align-items:flex-start}
.digest li:first-child{padding-top:0}
.digest li:last-child{border-bottom:0}
.digest-num{
  font-family:var(--ui);font-size:.74rem;font-weight:700;color:var(--crimson);
  min-width:1.5rem;padding-top:.25rem;font-variant-numeric:tabular-nums;
}
.digest-t{font-family:var(--display);font-size:1.08rem;font-weight:700;line-height:1.5;margin:0 0 .25rem}
.digest-m{font-size:.75rem;color:var(--muted)}

/* ---------- شبكة البطاقات ---------- */
.band{padding:clamp(2rem,5vw,3.4rem) 0}
.band--tint{background:var(--tint);border-block:1px solid var(--rule)}
.grid{display:grid;gap:clamp(1.4rem,2.6vw,2.2rem)}
.grid-3{grid-template-columns:repeat(3,1fr)}
.grid-2{grid-template-columns:repeat(2,1fr)}
/* A single article should not sit stranded in a three-column row */
.grid-1{grid-template-columns:minmax(0,640px);justify-content:center}

/* بطاقات الأقسام */
.sections{
  display:grid;grid-template-columns:repeat(3,1fr);gap:1px;
  background:var(--rule);border:1px solid var(--rule);
}
.sec-card{background:var(--paper);padding:1.7rem 1.4rem;text-align:center;transition:background .2s}
.sec-card:hover{background:var(--tint);color:inherit}
.sec-card .n{
  font-family:var(--ui);font-size:.7rem;font-weight:700;letter-spacing:.16em;color:var(--crimson);
}
.sec-card h3{font-family:var(--display);font-size:1.6rem;font-weight:700;margin:.4rem 0 0}
.sec-card p{font-size:.88rem;color:var(--muted);margin:.55rem 0 0;line-height:1.8}

.card{display:flex;flex-direction:column}
.card-fig{background:var(--tint-2);margin-bottom:.85rem;overflow:hidden}
.card-fig img{width:100%;aspect-ratio:3/2;object-fit:cover;transition:transform .5s cubic-bezier(.2,.7,.3,1)}
.card:hover .card-fig img{transform:scale(1.035)}

/* Most articles in this bulletin are text only. Rather than repeat a
   placeholder image, those become typographic cards — the way a printed
   contents page sets an essay that carries no picture. */
.card--text{
  background:var(--paper);border:1px solid var(--rule);border-top:2px solid var(--crimson);
  padding:1.25rem 1.2rem 1.15rem;
}
.card--text .card-t{font-size:1.42rem;line-height:1.4}
.card--text .card-x{font-family:var(--display);font-size:1.03rem;line-height:1.85;color:var(--ink-soft)}
.card--text .card-m{padding-top:.85rem;border-top:1px solid var(--rule)}

.card-t{font-family:var(--display);font-weight:700;font-size:1.3rem;line-height:1.45;margin:0 0 .5rem}
.card-x{font-size:.9rem;color:var(--muted);margin:0 0 .7rem;line-height:1.75}
.card-m{margin-top:auto}

/* بطاقة أفقية */
.hcard{display:grid;grid-template-columns:118px 1fr;gap:1rem;align-items:start;padding:1rem 0;border-bottom:1px solid var(--rule)}
.hcard:last-child{border-bottom:0}
.hcard img{aspect-ratio:1;object-fit:cover;background:var(--tint-2)}
.hcard-t{font-family:var(--display);font-weight:700;font-size:1.1rem;line-height:1.5;margin:.1rem 0 .35rem}

/* ---------- صفحة المقال ---------- */
.art-head{padding:clamp(1.8rem,4vw,2.8rem) 0 0;text-align:center}
.art-head .kicker{margin-bottom:.75rem}
.art-title{
  font-family:var(--display);font-weight:700;line-height:1.26;
  font-size:clamp(1.9rem,4.6vw,3.15rem);margin:0 auto .8rem;max-width:20ch;letter-spacing:-.01em;
}
.art-meta{justify-content:center;padding-bottom:1.3rem}
.art-author{font-family:var(--display);font-size:1.05rem;font-weight:700;color:var(--ink)}

.art-figure{margin:0 0 clamp(1.4rem,3vw,2.2rem);background:var(--tint-2)}
.art-figure img{width:100%;max-height:min(60vh,560px);object-fit:cover}
.art-figure figcaption{font-size:.78rem;color:var(--muted);padding:.55rem .2rem;text-align:center}

.art-body{
  font-family:var(--display);font-size:1.24rem;line-height:2.05;color:var(--ink);
  width:min(100%,68ch);margin-inline:auto;
}
.art-body p{margin:0 0 1.35em}
/* Arabic is cursive, so a drop cap would cut the first letter away from its
   word. Editorial weight goes to the whole opening paragraph instead. */
.art-body > p:first-of-type{
  font-size:1.1em;line-height:1.95;color:var(--ink);
  border-inline-start:2px solid var(--crimson);padding-inline-start:1.1em;
}
.art-body h2,.art-body h3{font-weight:700;line-height:1.4;margin:2em 0 .6em}
.art-body h2{font-size:1.5em}
.art-body h3{font-size:1.24em}
.art-body a{color:var(--crimson);text-decoration:underline;text-underline-offset:.22em;text-decoration-thickness:1px}
.art-body ul,.art-body ol{padding-inline-start:1.4em;margin:0 0 1.35em}
.art-body li{margin-bottom:.5em}
.art-body img{margin:1.6em auto;box-shadow:var(--shadow)}
.art-body blockquote{
  margin:1.8em 0;padding:.2em 1.3em;border-inline-start:3px solid var(--crimson);
  font-size:1.1em;line-height:1.85;color:var(--ink-soft);
}
.art-body blockquote p:last-child{margin-bottom:0}
.art-body hr{border:0;border-top:1px solid var(--rule);margin:2.4em auto;width:34%}

.art-foot{
  width:min(100%,68ch);margin:2.4rem auto 0;padding-top:1.3rem;border-top:1px solid var(--rule);
  display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap;
}
.share{display:flex;gap:.45rem;align-items:center}
.share span{font-size:.78rem;color:var(--muted);margin-inline-end:.2rem}
.share a{
  width:32px;height:32px;display:grid;place-items:center;border:1px solid var(--rule);
  border-radius:50%;color:var(--ink-soft);transition:.18s;
}
.share a:hover{background:var(--crimson);border-color:var(--crimson);color:#fff}

/* ---------- صفحة ثابتة ---------- */
.page-body{
  font-family:var(--display);font-size:1.16rem;line-height:1.98;
  width:min(100%,70ch);margin-inline:auto;
}
.page-body h2{font-size:1.5em;margin:1.9em 0 .55em;font-weight:700}
.page-body h3{font-size:1.22em;margin:1.7em 0 .5em;font-weight:700}
.page-body p{margin:0 0 1.25em}
.page-body ul,.page-body ol{padding-inline-start:1.4em}
.page-body li{margin-bottom:.5em}
.page-body a{color:var(--crimson);text-decoration:underline;text-underline-offset:.2em}
.page-body img{margin:1.5em auto}
.page-body blockquote{margin:1.6em 0;padding:.2em 1.2em;border-inline-start:3px solid var(--crimson);color:var(--ink-soft)}
.page-body table{width:100%;border-collapse:collapse;margin:1.5em 0;font-family:var(--ui);font-size:.95rem}
.page-body th,.page-body td{border:1px solid var(--rule);padding:.6rem .8rem;text-align:start}
.page-body th{background:var(--tint)}

/* بطاقة عضو هيئة التحرير */
.person{
  display:grid;grid-template-columns:auto 1fr;gap:1.4rem;align-items:start;
  border:1px solid var(--rule);padding:1.4rem;margin:1.5em 0;background:var(--tint);
}
.person-name{font-family:var(--display);font-size:1.35rem;font-weight:700;margin:0 0 .2rem}
.person-role{font-family:var(--ui);font-size:.76rem;letter-spacing:.14em;color:var(--crimson);margin:0 0 .7rem}

/* ---------- ترويسة الأقسام ---------- */
.pagehead{padding:clamp(1.8rem,4vw,2.8rem) 0 0;text-align:center}
.pagehead h1{font-family:var(--display);font-weight:700;font-size:clamp(1.8rem,4vw,2.7rem);margin:0}
.pagehead .arc{display:block;margin:.2rem auto 0;width:min(230px,58%);height:14px;color:var(--crimson)}
.pagehead p{color:var(--muted);margin:.6rem auto 0;max-width:60ch;font-size:.98rem}
.crumbs{font-size:.78rem;color:var(--muted);margin-bottom:.9rem}
.crumbs a:hover{color:var(--crimson)}

/* ---------- التنقل بين الصفحات ---------- */
.pager{display:flex;gap:.35rem;justify-content:center;align-items:center;margin-top:2.6rem;flex-wrap:wrap}
.pager-num,.pager-btn{
  min-width:2.3rem;height:2.3rem;display:grid;place-items:center;padding-inline:.6rem;
  border:1px solid var(--rule);font-size:.85rem;font-weight:600;color:var(--ink-soft);
}
.pager-num:hover,.pager-btn:hover{border-color:var(--ink);color:var(--ink)}
.pager-num.is-on{background:var(--crimson);border-color:var(--crimson);color:#fff}

/* ---------- نموذج التواصل ---------- */
.form-grid{display:grid;gap:1rem;grid-template-columns:1fr 1fr}
.field{display:flex;flex-direction:column;gap:.35rem}
.field--full{grid-column:1/-1}
.field label{font-size:.82rem;font-weight:600;color:var(--ink-soft)}
.field input,.field textarea,.field select{
  font-family:var(--ui);font-size:.95rem;padding:.65rem .8rem;border:1px solid var(--rule);
  background:var(--paper);color:var(--ink);border-radius:2px;
}
.field input:focus,.field textarea:focus{outline:none;border-color:var(--crimson)}
.field textarea{min-height:170px;resize:vertical;line-height:1.8}
.btn{
  display:inline-flex;align-items:center;gap:.5rem;background:var(--crimson);color:#fff;
  border:0;padding:.72rem 1.6rem;font-family:var(--ui);font-size:.92rem;font-weight:600;
  cursor:pointer;border-radius:2px;transition:background .18s;
}
.btn:hover{background:var(--crimson-deep);color:#fff}
.btn--ghost{background:none;border:1px solid var(--ink);color:var(--ink)}
.btn--ghost:hover{background:var(--ink);color:#fff}

.notice{padding:.9rem 1.1rem;border-inline-start:3px solid var(--crimson);background:var(--tint);margin-bottom:1.4rem;font-size:.92rem}
.notice--ok{border-color:#1E7A34;background:#F1F8F2}

.contact-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:clamp(1.6rem,4vw,3.4rem);align-items:start}
.contact-card{border:1px solid var(--rule);padding:1.4rem;background:var(--tint)}
.contact-card h3{font-family:var(--display);font-size:1.2rem;margin:0 0 .8rem}
.contact-list{list-style:none;margin:0;padding:0;font-size:.94rem}
.contact-list li{padding:.5rem 0;border-bottom:1px dotted var(--rule)}
.contact-list li:last-child{border-bottom:0}
.contact-list b{display:block;font-size:.76rem;letter-spacing:.1em;color:var(--crimson);font-weight:700;margin-bottom:.1rem}

/* ---------- لا نتائج / 404 ---------- */
.empty{text-align:center;padding:clamp(3rem,9vw,6rem) 0}
.empty h1{font-family:var(--display);font-size:clamp(2rem,6vw,3.4rem);margin:0 0 .5rem}
.empty p{color:var(--muted);margin:0 0 1.6rem}

/* ---------- التذييل ---------- */
.foot{background:var(--ink);color:#B9B3AC;margin-top:clamp(1rem,2.5vw,2rem);font-size:.9rem}
.foot-in{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.2fr;gap:2rem;padding:clamp(2.2rem,5vw,3.4rem) 0}
.foot-brand img{width:190px;margin-bottom:.9rem}
.foot-brand p{margin:0;line-height:1.9;font-size:.88rem;color:#9A948D}
.foot h3{
  font-family:var(--ui);font-size:.74rem;font-weight:700;letter-spacing:.2em;color:#fff;
  margin:0 0 .9rem;padding-bottom:.5rem;border-bottom:1px solid rgba(255,255,255,.14);
}
.foot ul{list-style:none;margin:0;padding:0}
.foot li{padding:.28rem 0}
.foot a:hover{color:#fff}
.foot-contact li{color:#9A948D}
.foot-bar{border-top:1px solid rgba(255,255,255,.12);font-size:.78rem;color:#8B857E}
.foot-bar-in{display:flex;justify-content:space-between;align-items:center;min-height:46px;gap:1rem;flex-wrap:wrap}
.foot-admin{opacity:.6}
.foot-admin:hover{opacity:1;color:#fff}

/* ---------- استجابة الشاشات ---------- */
@media (max-width:960px){
  .lead-grid{grid-template-columns:1fr}
  .lead-main{border-inline-end:0;padding-inline-end:0;border-bottom:1px solid var(--rule);padding-bottom:1.8rem}
  .grid-3{grid-template-columns:repeat(2,1fr)}
  .sections{grid-template-columns:1fr;gap:1px}
  .contact-grid{grid-template-columns:1fr}
  .foot-in{grid-template-columns:1fr 1fr;gap:1.6rem}
}
@media (max-width:680px){
  .grid-3,.grid-2,.grid-1{grid-template-columns:1fr}
  .sections{grid-template-columns:1fr}
  .form-grid{grid-template-columns:1fr}
  .foot-in{grid-template-columns:1fr}
  .art-body{font-size:1.14rem;line-height:1.95}
  .nav-toggle{display:flex}
  .mainnav-in{flex-wrap:wrap;gap:.4rem}
  .navlist{
    display:none;flex-direction:column;width:100%;order:3;
    border-top:1px solid var(--rule);padding:.4rem 0 .8rem;
  }
  .navlist.is-open{display:flex}
  .navlist li{width:100%}
  .navlist a{padding:.7rem .2rem}
  .navlist a::after{inset-inline:.2rem;bottom:.4rem}
  .navsearch{margin-inline-start:auto}
  .navsearch input{width:6.5rem}
  .navsearch input:focus{width:8.5rem}
  .person{grid-template-columns:1fr}
  .hcard{grid-template-columns:88px 1fr}
  .topbar-links a:not(:last-child){display:none}
}

@media (prefers-reduced-motion:reduce){
  *{animation-duration:.01ms !important;transition-duration:.01ms !important;scroll-behavior:auto !important}
  .card:hover .card-fig img{transform:none}
}

/* ---------- الطباعة ---------- */
@media print{
  .topbar,.mainnav,.foot,.share,.band--tint{display:none !important}
  body{font-size:12pt}
  .art-body{width:100%;font-size:12pt;line-height:1.7}
  a{text-decoration:none;color:#000}
}
/* ---------- إبراز الأقسام في القائمة ---------- */
.navlist li:nth-child(-n+4) a{font-weight:700;font-size:1.02rem;color:var(--ink)}
.navlist li:nth-child(n+5)  a{font-weight:500;color:var(--muted)}
.navlist li a.is-on{color:var(--crimson)}

/* ---------- صور مصغّرة في قائمة أحدث ما نُشر ---------- */
.digest-thumb{flex:0 0 66px;width:66px;height:66px;overflow:hidden;background:var(--tint-2);display:block}
.digest-thumb img{width:100%;height:100%;object-fit:cover;transition:transform .4s cubic-bezier(.2,.7,.3,1)}
.digest li:hover .digest-thumb img{transform:scale(1.06)}
.digest-thumb--none{display:grid;place-items:center;background:var(--tint);border:1px solid var(--rule)}
.digest-thumb--none span{font-family:var(--ui);font-size:.88rem;font-weight:700;color:var(--crimson)}