@charset "UTF-8";

/* ═══════════════════════════════════════════════════
   عتبات المستقبل — نظام التصميم
   الألوان مستخرجة من غلاف الكتاب
   ═══════════════════════════════════════════════════ */

:root{
  /* الألوان */
  --oat:#DCD4BA;
  --oat-light:#EAE4D2;
  --oat-deep:#C7BC9C;
  --ink:#211A16;
  --ink-soft:#5A4F45;
  --oxblood:#82302E;
  --clay:#A1685D;
  --paper:#F2EEE2;

  /* الخطوط */
  --display:"Amiri",Georgia,serif;
  --wordmark:"Aref Ruqaa",Georgia,serif;
  --body:"IBM Plex Sans Arabic",system-ui,-apple-system,sans-serif;

  /* مقياس النص */
  --t-xs:.78rem;
  --t-sm:.875rem;
  --t-base:1rem;
  --t-lg:1.0625rem;
  --t-xl:1.25rem;
  --t-2xl:1.625rem;
  --t-3xl:2.125rem;
  --t-4xl:clamp(2.4rem,7vw,3.6rem);

  /* المسافات */
  --s1:.25rem; --s2:.5rem;  --s3:.75rem; --s4:1rem;
  --s5:1.5rem; --s6:2rem;   --s7:3rem;   --s8:4rem;
  --s9:6rem;

  /* العرض */
  --measure:38rem;      /* عرض القراءة المريح */
  --wide:68rem;         /* عرض الحاوية */
}

*,*::before,*::after{box-sizing:border-box}
*{margin:0;padding:0}

html{
  scroll-behavior:smooth;
  -webkit-text-size-adjust:100%;
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
  }
}

body{
  background:var(--oat);
  color:var(--ink);
  font-family:var(--body);
  font-weight:300;
  font-size:var(--t-base);
  line-height:1.95;
  -webkit-font-smoothing:antialiased;
  min-height:100svh;
  display:flex;
  flex-direction:column;
}

img{max-width:100%;height:auto;display:block}

/* ── التخطيط ─────────────────────────────────────── */
.container{
  width:100%;
  max-width:var(--wide);
  margin-inline:auto;
  padding-inline:var(--s5);
}
.measure{max-width:var(--measure)}
main{flex:1}

.section{padding-block:var(--s8)}
.section--tight{padding-block:var(--s7)}

/* ── العناوين ────────────────────────────────────── */
h1,h2,h3,h4{
  font-family:var(--display);
  font-weight:700;
  line-height:1.5;
  letter-spacing:0;
}
h1{font-size:var(--t-4xl);line-height:1.25}
h2{font-size:var(--t-3xl);margin-bottom:var(--s4)}
h3{font-size:var(--t-xl);margin-bottom:var(--s3)}
h4{font-size:var(--t-lg);font-family:var(--body);font-weight:500}

p+p{margin-top:var(--s4)}

a{color:var(--oxblood);text-decoration:none;transition:color .18s}
a:hover{color:var(--clay)}
:focus-visible{outline:2px solid var(--oxblood);outline-offset:3px}

/* ── عناصر صغيرة ─────────────────────────────────── */
.eyebrow{
  font-family:var(--body);
  font-size:var(--t-xs);
  font-weight:500;
  letter-spacing:.28em;
  color:var(--oxblood);
  margin-bottom:var(--s4);
  display:block;
}
.lede{font-size:var(--t-lg);line-height:2.05;color:var(--ink-soft)}
.muted{color:var(--ink-soft)}
.small{font-size:var(--t-sm)}

.rule{
  width:2.5rem;height:1px;
  background:var(--oxblood);opacity:.55;
  border:0;margin-block:var(--s6);
}
.rule--full{width:100%;background:var(--oat-deep);opacity:1}

/* قوس فاصل مستمدّ من حقل المسارات */
.arc{
  display:block;width:100%;height:44px;
  margin-block:var(--s7);
  overflow:visible;
}
.arc path{fill:none;stroke:var(--oat-deep);stroke-width:1}
.arc circle{fill:var(--oxblood);opacity:.7}

/* ── الترويسة ────────────────────────────────────── */
.site-header{
  border-bottom:1px solid var(--oat-deep);
  background:var(--oat);
  position:relative;
  z-index:20;
}
.site-header__inner{
  display:flex;align-items:center;justify-content:space-between;
  gap:var(--s5);
  padding-block:var(--s4);
}
.wordmark{
  font-family:var(--wordmark);
  font-weight:700;
  font-size:1.5rem;
  color:var(--ink);
  line-height:1.2;
  white-space:nowrap;
}
.wordmark:hover{color:var(--ink)}
.wordmark small{
  display:block;
  font-family:var(--body);
  font-size:var(--t-xs);
  font-weight:300;
  color:var(--ink-soft);
  letter-spacing:.02em;
}

.nav{display:flex;gap:var(--s5);flex-wrap:wrap;align-items:center}
.nav a{
  font-size:var(--t-sm);
  font-weight:400;
  color:var(--ink-soft);
  padding-block:var(--s1);
  border-bottom:1px solid transparent;
  white-space:nowrap;
}
.nav a:hover{color:var(--ink)}
.nav a[aria-current=page]{
  color:var(--oxblood);
  border-bottom-color:var(--oxblood);
  font-weight:500;
}

.nav-toggle{
  display:none;
  background:none;border:1px solid var(--oat-deep);
  border-radius:2px;
  color:var(--ink);
  font-family:var(--body);font-size:var(--t-sm);
  padding:.45rem .9rem;cursor:pointer;
}

@media (max-width:900px){
  .nav-toggle{display:block}
  .nav{
    display:none;
    position:absolute;inset-inline:0;top:100%;
    flex-direction:column;align-items:flex-start;
    gap:0;
    background:var(--oat-light);
    border-bottom:1px solid var(--oat-deep);
    padding:var(--s3) var(--s5) var(--s5);
  }
  .nav.is-open{display:flex}
  .nav a{
    width:100%;
    padding-block:var(--s3);
    border-bottom:1px solid var(--oat-deep);
  }
  .nav a[aria-current=page]{border-bottom-color:var(--oxblood)}
}

/* ── الواجهة ─────────────────────────────────────── */
.hero{
  padding-block:var(--s8) var(--s7);
  position:relative;
  overflow:hidden;
}
.hero__grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);
  gap:var(--s8);
  align-items:center;
}
.hero__cover{
  position:relative;
  justify-self:center;
  max-width:22rem;width:100%;
}
.hero__cover img{
  width:100%;
  box-shadow:0 2px 0 var(--oat-deep),0 18px 40px -18px rgba(33,26,22,.45);
}
.hero__cover-fallback{
  aspect-ratio:1/1.45;
  background:var(--oat-light);
  border:1px solid var(--oat-deep);
  display:grid;place-items:center;
  text-align:center;padding:var(--s5);
  color:var(--ink-soft);font-size:var(--t-sm);
}
.hero h1{margin-bottom:var(--s3)}
.hero__subtitle{
  font-size:var(--t-xl);
  color:var(--oxblood);
  font-weight:400;
  margin-bottom:var(--s5);
}
.hero__byline{
  font-size:var(--t-sm);
  color:var(--ink-soft);
  line-height:2;
  margin-bottom:var(--s6);
}
.hero__byline strong{font-weight:500;color:var(--ink)}

.pullquote{
  font-family:var(--body);
  font-weight:300;
  font-size:var(--t-xl);
  line-height:1.9;
  color:var(--oxblood);
  border-inline-start:2px solid var(--oxblood);
  padding-inline-start:var(--s4);
  margin-block:var(--s6);
}

@media (max-width:820px){
  .hero__grid{grid-template-columns:1fr;gap:var(--s7)}
  .hero__cover{max-width:16rem;order:-1}
}

/* ── الأزرار ─────────────────────────────────────── */
.btn{
  display:inline-block;
  font-family:var(--body);
  font-size:var(--t-sm);font-weight:500;
  padding:.75rem 1.5rem;
  border:1px solid var(--oxblood);
  border-radius:2px;
  cursor:pointer;
  transition:background .18s,color .18s,border-color .18s;
}
.btn--primary{background:var(--oxblood);color:var(--paper)}
.btn--primary:hover{background:var(--clay);border-color:var(--clay);color:var(--paper)}
.btn--ghost{background:transparent;color:var(--oxblood)}
.btn--ghost:hover{background:var(--oxblood);color:var(--paper)}
.btn-row{display:flex;gap:var(--s3);flex-wrap:wrap;align-items:center}

/* ── البطاقات ────────────────────────────────────── */
.cards{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));
  gap:var(--s5);
}
.card{
  background:var(--oat-light);
  border:1px solid var(--oat-deep);
  padding:var(--s5);
  display:flex;flex-direction:column;
  transition:border-color .18s;
}
.card:hover{border-color:var(--clay)}
.card__no{
  font-size:var(--t-xs);
  letter-spacing:.2em;
  color:var(--oxblood);
  font-weight:500;
  margin-bottom:var(--s2);
}
.card h3{margin-bottom:var(--s3)}
.card p{font-size:var(--t-sm);line-height:1.95;color:var(--ink-soft)}
.card__foot{
  margin-top:var(--s4);
  padding-top:var(--s3);
  border-top:1px solid var(--oat-deep);
  font-size:var(--t-xs);color:var(--ink-soft);
}

/* ── فهرس الفصول ─────────────────────────────────── */
.toc{margin-top:var(--s5)}
.toc__part{margin-bottom:var(--s7)}
.toc__part-head{
  display:flex;align-items:baseline;gap:var(--s3);
  padding-bottom:var(--s3);
  border-bottom:1px solid var(--oat-deep);
  margin-bottom:var(--s4);
}
.toc__part-no{
  font-size:var(--t-xs);letter-spacing:.2em;
  color:var(--oxblood);font-weight:500;
}
.toc__part-title{
  font-family:var(--display);font-size:var(--t-xl);font-weight:700;
}
.toc__item{
  display:flex;align-items:baseline;gap:var(--s3);
  padding-block:var(--s3);
  border-bottom:1px solid rgba(199,188,156,.5);
}
.toc__item:last-child{border-bottom:0}
.toc__num{
  flex:0 0 1.75rem;
  font-size:var(--t-sm);color:var(--oxblood);
  font-weight:500;font-variant-numeric:tabular-nums;
}
.toc__title{flex:1;font-size:var(--t-base);line-height:1.7}
.toc__page{
  font-size:var(--t-xs);color:var(--ink-soft);
  font-variant-numeric:tabular-nums;
  direction:ltr;unicode-bidi:isolate;
}

/* ── الشراء ──────────────────────────────────────── */
.vendors{display:grid;gap:var(--s3);margin-top:var(--s5)}
.vendor{
  display:flex;align-items:center;justify-content:space-between;
  gap:var(--s4);flex-wrap:wrap;
  background:var(--oat-light);
  border:1px solid var(--oat-deep);
  padding:var(--s4) var(--s5);
  transition:border-color .18s;
}
.vendor:hover{border-color:var(--clay)}
.vendor__name{font-weight:500;font-size:var(--t-base)}
.vendor__note{font-size:var(--t-xs);color:var(--ink-soft);display:block;font-weight:300}

.meta-list{
  display:grid;gap:var(--s2);
  font-size:var(--t-sm);color:var(--ink-soft);
  margin-top:var(--s5);
}
.meta-list div{display:flex;gap:var(--s3)}
.meta-list dt{flex:0 0 7rem;color:var(--ink);font-weight:400}
.meta-list dd{direction:ltr;unicode-bidi:isolate;text-align:start}
.meta-list dd.rtl{direction:rtl}

/* ── النماذج ─────────────────────────────────────── */
.form{display:grid;gap:var(--s4);max-width:32rem;margin-top:var(--s5)}
.field{display:grid;gap:var(--s2)}
.field label{font-size:var(--t-sm);font-weight:400}
.field input,.field textarea,.field select{
  font-family:inherit;font-size:var(--t-base);font-weight:300;
  color:var(--ink);background:var(--paper);
  border:1px solid var(--oat-deep);border-radius:2px;
  padding:.7rem .9rem;
  transition:border-color .18s;
  width:100%;
}
.field textarea{min-height:9rem;resize:vertical;line-height:1.9}
.field input:focus,.field textarea:focus{outline:none;border-color:var(--oxblood)}
.field input:focus-visible,.field textarea:focus-visible{outline:2px solid var(--oxblood);outline-offset:2px}
.field__hint{font-size:var(--t-xs);color:var(--ink-soft)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

.notice{
  background:var(--oat-light);
  border-inline-start:2px solid var(--oxblood);
  padding:var(--s4) var(--s5);
  font-size:var(--t-sm);line-height:1.95;
  color:var(--ink-soft);
}

/* ── صفحة قيد الإنشاء ────────────────────────────── */
.pending{
  text-align:center;
  padding-block:var(--s9);
  max-width:34rem;margin-inline:auto;
}
.pending .eyebrow{margin-bottom:var(--s5)}
.pending p{color:var(--ink-soft);margin-bottom:var(--s6)}

/* ── التذييل ─────────────────────────────────────── */
.site-footer{
  border-top:1px solid var(--oat-deep);
  margin-top:var(--s8);
  padding-block:var(--s7) var(--s6);
  position:relative;
  overflow:hidden;
}
.site-footer__field{
  position:absolute;inset-inline:0;bottom:0;
  height:180px;width:100%;
  pointer-events:none;opacity:.5;
}
.site-footer__field path{fill:none;stroke:var(--ink-soft);stroke-width:.5;opacity:.3}
.site-footer__field circle{fill:var(--oxblood);opacity:.6}
.site-footer__inner{position:relative;z-index:1}
.footer-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(12rem,1fr));
  gap:var(--s6);
  margin-bottom:var(--s6);
}
.footer-col h4{
  font-size:var(--t-xs);letter-spacing:.2em;
  color:var(--oxblood);font-weight:500;
  margin-bottom:var(--s3);
}
.footer-col ul{list-style:none;display:grid;gap:var(--s2)}
.footer-col a{font-size:var(--t-sm);color:var(--ink-soft)}
.footer-col a:hover{color:var(--oxblood)}
.footer-bottom{
  display:flex;justify-content:space-between;
  gap:var(--s4);flex-wrap:wrap;
  padding-top:var(--s5);
  border-top:1px solid var(--oat-deep);
  font-size:var(--t-xs);color:var(--ink-soft);
}
.footer-bottom .domain{direction:ltr;unicode-bidi:isolate}

/* ── مساعدات ─────────────────────────────────────── */
.skip-link{
  position:absolute;inset-inline-start:-9999px;top:0;
  background:var(--oxblood);color:var(--paper);
  padding:var(--s3) var(--s4);z-index:100;
}
.skip-link:focus{inset-inline-start:0;color:var(--paper)}
.ltr{direction:ltr;unicode-bidi:isolate;display:inline-block}
.mt-6{margin-top:var(--s6)}
.mb-0{margin-bottom:0}

/* ── نموذج التواصل والرسائل الواردة ─────────────────── */
.notice--ok{border-inline-start-color:#5C6B3A;color:var(--ink)}
.notice--err{border-inline-start-color:var(--oxblood);color:var(--ink)}
.inbox-item{background:var(--oat-light);border:1px solid var(--oat-deep);border-radius:2px;padding:var(--s4) var(--s5);margin-block:var(--s4)}
.inbox-item__head{display:flex;flex-wrap:wrap;gap:var(--s3);align-items:baseline;font-size:var(--t-sm)}
.inbox-item__meta{color:var(--ink-soft);font-size:var(--t-xs)}
.inbox-item h3{margin-block:var(--s3) var(--s2)}
.inbox-item__body{white-space:pre-wrap;line-height:1.95}
.inbox-item__log{margin-top:var(--s3);font-size:var(--t-xs)}
.inbox-item__log summary{cursor:pointer;color:var(--oxblood)}
.inbox-item__log pre{background:var(--paper);border:1px solid var(--oat-deep);padding:var(--s3);margin-top:var(--s2);white-space:pre-wrap;word-break:break-all;text-align:left;font-size:.75rem;line-height:1.6;max-height:28rem;overflow:auto}

/* ── المعاينة ─────────────────────────────────────────── */
.samples{display:grid;gap:var(--s4)}
.sample{background:var(--oat-light);border:1px solid var(--oat-deep);border-radius:2px;padding:var(--s5)}
.sample h3{margin-block:var(--s2) var(--s3)}
.sample .card__foot{display:flex;flex-wrap:wrap;gap:var(--s3);margin-top:var(--s4)}
.sample--pending{background:transparent;border-style:dashed}
.sample--pending h3{color:var(--ink-soft)}
.sample__soon{font-size:var(--t-sm);color:var(--ink-soft)}

/* ── أقسام قيد الإنشاء في القوائم ─────────────────── */
.nav .nav__soon{color:var(--ink-soft);opacity:.5;cursor:default;font-size:var(--t-sm);padding-block:var(--s1)}
.footer-col .soon{color:var(--ink-soft);opacity:.6}
.footer-col .soon::after{content:" · قريبًا";font-size:.7em}
.footer-credit{font-size:var(--t-xs);color:var(--ink-soft);margin-top:var(--s3)}
.footer-credit a{color:var(--ink-soft);border-bottom:1px solid var(--oat-deep)}
.footer-credit a:hover{color:var(--ink)}

/* ── الأقسام: تعقيبات · مراجعات · فعاليات · حلقات ─── */
.entries{display:grid;gap:var(--s5)}
.entry{background:var(--oat-light);border:1px solid var(--oat-deep);border-radius:2px;padding:var(--s5)}
.entry h3{margin-block:var(--s2) var(--s2)}
.entry h3 a{color:var(--ink)}
.entry h3 a:hover{color:var(--oxblood)}
.entry__by{font-size:var(--t-sm);color:var(--ink-soft);margin-bottom:var(--s3)}
.entry__excerpt{font-size:var(--t-base);line-height:1.95;color:var(--ink);border-inline-start:2px solid var(--oat-deep);padding-inline-start:var(--s4);margin-block:var(--s3)}
.entry .card__foot{display:flex;flex-wrap:wrap;gap:var(--s3)}
.entry__more{margin-top:var(--s4);font-size:var(--t-sm)}
.entry__more summary{cursor:pointer;color:var(--oxblood)}
.video{position:relative;aspect-ratio:16/9;background:var(--ink);margin-block:var(--s4)}
.video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

/* ── نصّ منسّق من اللوحة (Markdown) ───────────────── */
.prose{line-height:2.05}
.prose p+p{margin-top:var(--s4)}
.prose h2,.prose h3,.prose h4{margin-top:var(--s6);margin-bottom:var(--s3)}
.prose h2{font-size:var(--t-2xl)}
.prose h3{font-size:var(--t-xl)}
.prose h4{font-size:var(--t-lg);font-family:var(--display)}
.prose blockquote{border-inline-start:2px solid var(--oxblood);padding-inline-start:var(--s4);margin-block:var(--s5);color:var(--ink-soft)}
.prose ul,.prose ol{padding-inline-start:var(--s6);margin-block:var(--s4)}
.prose li+li{margin-top:var(--s2)}
.prose hr{margin-block:var(--s6)}
.prose a{border-bottom:1px solid var(--clay)}
.prose--sm{font-size:var(--t-sm);line-height:1.95;margin-top:var(--s3)}
