/* ============================================================================
   BURJAK INSTITUTE — BI-WEB-P1 — Home Approval Specimen VC1.3
   Concept C — Editorial Threshold · responsive (one DOM per language)
   Self-hosted Founder-supplied Noto. No external/CDN dependency. No JS.
   PREVIEW-ONLY · NON-PRODUCTION · NON-DEPLOYED
   ============================================================================ */
@font-face{font-family:"Noto Naskh Arabic";font-weight:400;font-style:normal;font-display:swap;src:url("../fonts/noto-naskh-arabic-400.woff2") format("woff2");}
@font-face{font-family:"Noto Naskh Arabic";font-weight:700;font-style:normal;font-display:swap;src:url("../fonts/noto-naskh-arabic-700.woff2") format("woff2");}
@font-face{font-family:"Noto Serif";font-weight:400;font-style:normal;font-display:swap;src:url("../fonts/noto-serif-400.woff2") format("woff2");}
@font-face{font-family:"Noto Serif";font-weight:600;font-style:normal;font-display:swap;src:url("../fonts/noto-serif-600.woff2") format("woff2");}

:root{--ink:#1B1B1B;--paper:#FEFDFB;--n1:#6f6f69;--hair:rgba(27,27,27,.15);--anchor:#1F3A5F;
  --rd-ar:"Noto Naskh Arabic",serif;--rd-lat:"Noto Serif",Georgia,"Times New Roman",serif}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--rd-lat)}
.wrap{display:block}

/* brand */
.wordmark{margin:0;font-family:var(--rd-lat);font-weight:400;letter-spacing:.34em;text-transform:uppercase;color:var(--ink)}
.wm-name{font-size:17.5px} /* CP-2.1 (D-02): was 15px — wordmark raised as primary identity anchor */
.reg{font-size:.6em;vertical-align:.55em;letter-spacing:0;margin-inline-start:.1em;color:var(--n1)}
.slogan{margin:15px 0 0;color:var(--anchor)} /* CP-2.1B: was 9px — +6px net gap wordmark→slogan (desktop) */
.reg-inline{font-size:.6em;vertical-align:.5em;line-height:0;letter-spacing:0;margin-inline-start:.04em;color:var(--n1)}
.lat{font-family:var(--rd-lat)}

/* threshold */
.thr{text-align:center;padding:60px 56px 38px}
.thr-hair{border:0;border-top:1px solid var(--anchor);opacity:.55;width:60px;margin:26px auto}
.lead-wrap{margin:0 auto}
.lead{margin:0}
h1.h1{margin:14px auto 0} /* CP-2.1B: was 6px — +8px net gap slogan→H1 (desktop) */

/* movements */
.mv{margin:0 auto;padding:6px 56px 58px}
.mv-item{border-top:1px solid var(--hair);padding-top:26px;margin-top:26px}
.mv-item:first-child{border-top:0;margin-top:6px;padding-top:6px}
h2{color:var(--ink);margin:0 0 10px}
.body{color:#232320;margin:0}

/* ================= Arabic (desktop base) ================= */
html[lang="ar"] .slogan{font-family:var(--rd-ar);font-size:15px}
html[lang="ar"] .h1{font-family:var(--rd-ar);font-weight:700;font-size:19.5px;line-height:1.5;max-width:24ch} /* CP-2.1A: was 22.5px (CP-2.1) — reduce H1 dominance under wordmark */
html[lang="ar"] .lead{font-family:var(--rd-ar);font-size:20px;line-height:1.9;text-align:justify;text-align-last:right}
html[lang="ar"] .lead-wrap{max-width:660px}
html[lang="ar"] .mv{max-width:720px}
html[lang="ar"] .body{font-family:var(--rd-ar);font-size:19px;line-height:1.92;text-align:justify;text-align-last:right}
html[lang="ar"] h2{font-family:var(--rd-ar);font-weight:700;font-size:21px;text-align:right}

/* ================= English (desktop base) ================= */
html[lang="en"] .slogan{font-family:var(--rd-lat);font-weight:400;font-size:12px;letter-spacing:.01em}
html[lang="en"] .h1{font-family:var(--rd-lat);font-weight:600;font-size:20px;line-height:1.4;max-width:26ch} /* CP-2.1A: was 21.5px (CP-2.1) — reduce H1 dominance under wordmark */
html[lang="en"] .lead{font-family:var(--rd-lat);font-size:18px;line-height:1.72;text-align:justify;text-align-last:left}
html[lang="en"] .lead-wrap{max-width:640px}
html[lang="en"] .mv{max-width:680px}
html[lang="en"] .body{font-family:var(--rd-lat);font-size:17px;line-height:1.74;text-align:justify;text-align-last:left}
html[lang="en"] h2{font-family:var(--rd-lat);font-weight:600;font-size:20px}

/* ================= Tablet (<=1024px) ================= */
@media (max-width:1024px){
  .thr{padding:48px 40px 34px}
  .mv{padding:6px 40px 48px}
  html[lang="ar"] .mv,html[lang="en"] .mv{max-width:640px}
  html[lang="ar"] .lead-wrap,html[lang="en"] .lead-wrap{max-width:600px}
}

/* ================= Mobile (<=640px) ================= */
@media (max-width:640px){
  .thr{padding:30px 16px 24px}
  .mv{padding:4px 16px 34px}
  .thr-hair{margin:20px auto}
  html[lang="ar"] .mv,html[lang="en"] .mv,html[lang="ar"] .lead-wrap,html[lang="en"] .lead-wrap{max-width:none}
  /* Arabic mobile */
  html[lang="ar"] .wm-name{font-size:15px} /* CP-2.1 (D-02): was 13px — wordmark not visually weak on mobile */
  html[lang="ar"] .slogan{font-size:14px;margin-top:13px} /* CP-2.1B: +4px net gap wordmark→slogan (mobile), was 9px */
  html[lang="ar"] .h1{font-size:18.5px;line-height:1.45;margin-top:12px} /* CP-2.1A size; CP-2.1B: +6px net gap slogan→H1 (mobile), was 6px */
  html[lang="ar"] .lead{font-size:17.5px;line-height:1.9}
  html[lang="ar"] .body{font-size:17px;line-height:1.9}
  html[lang="ar"] h2{font-size:19px}
  /* English mobile — left / ragged-right, no justification, no hyphenation */
  html[lang="en"] .wm-name{font-size:15px} /* CP-2.1 (D-02): was 13.5px — wordmark not visually weak on mobile */
  html[lang="en"] .slogan{font-size:10.5px;margin-top:10px} /* CP-2.1B: +4px net gap wordmark→slogan (mobile), was 6px */
  html[lang="en"] .h1{font-size:18.5px;line-height:1.35;margin-top:12px} /* CP-2.1A size; CP-2.1B: +6px net gap slogan→H1 (mobile), was 6px */
  html[lang="en"] .lead{font-size:16.5px;line-height:1.65;text-align:left;text-align-last:left;-webkit-hyphens:none;hyphens:none}
  html[lang="en"] .body{font-size:15.5px;line-height:1.68;text-align:left;text-align-last:left;-webkit-hyphens:none;hyphens:none}
  html[lang="en"] h2{font-size:18px}
}
@media print{body{background:#fff}}
