/* ============================================================
   Muslih — muslih.net · long-form document layout
   For legal / informational pages (privacy, terms, disclaimer,
   research). Loads after styles.css and reuses its tokens —
   no tokens are redefined here.
   ============================================================ */

.doc-page{padding:clamp(48px,8vw,88px) 0 clamp(64px,10vw,110px)}
.doc-wrap{max-width:760px;margin:0 auto;padding:0 16px}

.doc-header{margin-bottom:clamp(28px,5vw,44px)}
.doc-header h1{font-size:clamp(1.9rem,5vw,2.6rem);margin-bottom:12px}
.doc-header .updated{font-size:.86rem;color:var(--muted);font-style:italic}

.prose{max-width:none;color:var(--ink-2);font-size:1.02rem;line-height:1.75}
.prose > p:first-child{margin-top:0}
.prose p{margin:0 0 18px}
.prose h2{font-family:'Lora',Georgia,serif;font-weight:600;color:var(--ink);font-size:1.3rem;margin:40px 0 14px;padding-top:18px;border-top:1px solid var(--line)}
.prose h2:first-of-type{margin-top:24px}
.prose h3{font-family:'Lora',Georgia,serif;font-weight:600;color:var(--ink);font-size:1.05rem;margin:22px 0 10px}
.prose strong{color:var(--ink);font-weight:700}
.prose em{font-style:italic}
.prose a{color:var(--teal);text-decoration:underline;text-underline-offset:2px}
.prose a:hover{color:var(--ink)}
.prose ul,.prose ol{margin:0 0 18px;padding-left:1.4em}
.prose li{margin-bottom:8px}
.prose li::marker{color:var(--muted)}

.prose table{width:100%;border-collapse:collapse;margin:18px 0 24px;font-size:.95rem}
.prose th,.prose td{border:1px solid var(--line);padding:10px 14px;text-align:left}
.prose th{background:var(--surface-2);font-weight:700;color:var(--ink)}

/* ---------- research.html cards ---------- */
.doi-card{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:20px 24px;margin:26px 0;box-shadow:var(--shadow)}
.doi-card .doi-label{font-size:.74rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom:8px}
.doi-card a{font-weight:700;word-break:break-all}

.cite-block{font-size:.92rem;color:var(--ink-2);background:var(--surface-2);border-left:3px solid var(--teal);border-radius:0 12px 12px 0;padding:14px 18px;margin:18px 0;line-height:1.7}

.tier-list{margin:14px 0 22px;padding-left:22px}
.tier-list li{margin-bottom:8px}

@media (max-width:560px){
  .doc-wrap{padding:0 16px}
  .doi-card{padding:16px 18px}
}

/* ---------- Arabic site language ----------
   The documents are English only. The article sits in a dir="ltr" lang="en"
   island, so it keeps Latin fonts, spacing and left-to-right layout even when
   the rest of the page (nav, footer) is Arabic and right-to-left. */
.doc-note{display:none;font-size:.9rem;color:var(--muted);margin:0 0 18px}
html[lang="ar"] .doc-note{display:block}
.doc-en{font-family:'DM Sans',system-ui,-apple-system,'Segoe UI',sans-serif;font-size:1rem;text-align:left}
.doc-en :is(h1,h2,h3){font-family:'Lora',Georgia,'Times New Roman',serif;line-height:1.12;letter-spacing:-.01em}

/* Bilingual documents: English block for LTR, Arabic block for RTL. The
   courtesy note (.doc-note) only shows in Arabic. */
html[lang="ar"] .doc-en{display:none}
html:not([lang="ar"]) .doc-ar{display:none}
html:not([lang="ar"]) .doc-note{display:none}
.doc-ar{text-align:start}
.doc-ar h1,.doc-ar h2,.doc-ar h3{font-family:'Noto Naskh Arabic','Lora',serif;letter-spacing:0}
.doc-ar,.doc-ar p,.doc-ar li{font-family:'IBM Plex Sans Arabic','DM Sans',sans-serif}
.doc-ar ul{padding-inline-start:1.4em;padding-left:0}
.doc-ar .cite-block,.doc-ar [dir="ltr"]{text-align:left;font-family:'DM Sans',sans-serif}