@font-face{font-family:'Noto Kufi Arabic';font-style:normal;font-weight:600;font-display:swap;src:url(/assets/fonts/noto-kufi-arabic-arabic-600-normal.woff2) format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC;}
@font-face{font-family:'Noto Kufi Arabic';font-style:normal;font-weight:600;font-display:swap;src:url(/assets/fonts/noto-kufi-arabic-latin-600-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Noto Kufi Arabic';font-style:normal;font-weight:700;font-display:swap;src:url(/assets/fonts/noto-kufi-arabic-arabic-700-normal.woff2) format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC;}
@font-face{font-family:'Noto Kufi Arabic';font-style:normal;font-weight:700;font-display:swap;src:url(/assets/fonts/noto-kufi-arabic-latin-700-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Noto Naskh Arabic';font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/noto-naskh-arabic-arabic-400-normal.woff2) format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC;}
@font-face{font-family:'Noto Naskh Arabic';font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/noto-naskh-arabic-latin-400-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Noto Naskh Arabic';font-style:normal;font-weight:600;font-display:swap;src:url(/assets/fonts/noto-naskh-arabic-arabic-600-normal.woff2) format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC;}
@font-face{font-family:'Noto Naskh Arabic';font-style:normal;font-weight:600;font-display:swap;src:url(/assets/fonts/noto-naskh-arabic-latin-600-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Source Serif 4';font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/source-serif-4-latin-400-normal.woff2) format('woff2');}
@font-face{font-family:'Source Serif 4';font-style:normal;font-weight:600;font-display:swap;src:url(/assets/fonts/source-serif-4-latin-600-normal.woff2) format('woff2');}
:root{
  --paper:#F6F7F4;
  --ink:#1C2A28;
  --ink-2:#4B5855;
  --adobe:#8B5D3B;
  --adobe-soft:#EEE3D6;
  --palm:#2D5A4E;
  --rule:#D6DBD5;
  --kufi:"Noto Kufi Arabic","Segoe UI",Tahoma,sans-serif;
  --naskh:"Noto Naskh Arabic","Traditional Arabic","Times New Roman",serif;
  --serif:"Source Serif 4",Georgia,"Times New Roman",serif;
  --teeth:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='20'%3E%3Cpath d='M0 20 L14 0 L28 20 Z'/%3E%3C/svg%3E");
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--paper);color:var(--ink)}
[hidden]{display:none!important}

.view-ar{font-family:var(--naskh);font-size:1.125rem;line-height:1.95}
.view-en{font-family:var(--serif);font-size:1.125rem;line-height:1.65}
h1,h2,h3,.kufi{font-family:var(--kufi)}
.view-en h1,.view-en h2,.view-en h3{letter-spacing:-.01em}

a{color:var(--palm);text-decoration-thickness:1px;text-underline-offset:.28em}
a:hover{color:var(--ink)}
:focus-visible{outline:3px solid var(--adobe);outline-offset:3px;border-radius:2px}
.skip{position:absolute;inset-inline-start:1rem;top:-4rem;background:var(--ink);color:var(--paper);padding:.5rem 1rem;font-family:var(--kufi);font-size:.85rem;z-index:10}
.skip:focus{top:1rem}

/* شريط النموذج */
.proto{margin:0;background:var(--ink);color:var(--paper);font-family:var(--kufi);font-size:.8rem;line-height:1.7;padding:.5rem 1.5rem;text-align:center}

/* الرأس */
.head{max-width:1120px;margin:0 auto;padding:1.1rem 1.5rem;display:flex;align-items:center;gap:2rem}
.brand{font-family:var(--kufi);font-weight:700;font-size:1.05rem;color:var(--ink);text-decoration:none;white-space:nowrap}
.nav{display:flex;gap:1.5rem;margin-inline-start:auto;font-family:var(--kufi);font-weight:600;font-size:.88rem;line-height:1.6}
.nav a{color:var(--ink-2);text-decoration:none;white-space:nowrap}
.nav a:hover{color:var(--ink);text-decoration:underline}
.lang-btn{font-family:var(--kufi);font-weight:600;font-size:.85rem;line-height:1.6;background:transparent;border:1.5px solid var(--ink);color:var(--ink);padding:.3rem .95rem;border-radius:999px;cursor:pointer;white-space:nowrap}
.lang-btn:hover{background:var(--ink);color:var(--paper)}

/* الواجهة */
.hero{position:relative;z-index:1;max-width:1120px;margin:0 auto;padding:3.5rem 1.5rem 0;display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:4rem;align-items:end}
.hero h1{margin:0;font-weight:700;font-size:clamp(2.3rem,5.4vw,4.3rem);line-height:1.3}
.view-en .hero h1{line-height:1.12}
.honorific{display:block;font-size:.36em;font-weight:600;color:var(--adobe);margin-bottom:.5em;line-height:1.5}
.role{font-family:var(--kufi);font-weight:600;font-size:1.15rem;line-height:1.7;margin:1.4rem 0 1.2rem}
.lede{max-width:34em;color:var(--ink-2);margin:0 0 3.25rem}
.portrait{position:relative;aspect-ratio:4/5;background:var(--adobe-soft);display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;font-family:var(--kufi);font-size:.85rem;line-height:1.8;color:var(--adobe);margin-top:20px;margin-bottom:-20px}
.portrait::before{content:"";position:absolute;inset-inline:0;top:-20px;height:20px;background:var(--adobe-soft);-webkit-mask:var(--teeth) repeat-x left bottom/28px 20px;mask:var(--teeth) repeat-x left bottom/28px 20px}
.portrait img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 18%}

/* الجدار: شرفات نجدية تحمل المعلومات الأساسية */
.wall{position:relative;background:var(--adobe);color:var(--paper);margin-top:20px}
.wall::before{content:"";position:absolute;inset-inline:0;top:-20px;height:20px;background:var(--adobe);-webkit-mask:var(--teeth) repeat-x left bottom/28px 20px;mask:var(--teeth) repeat-x left bottom/28px 20px}
.facts{max-width:1120px;margin:0 auto;padding:2rem 1.5rem 2.25rem;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1.5rem 2.5rem}
.facts div{margin:0}
.facts dt{font-family:var(--kufi);font-weight:600;font-size:.8rem;line-height:1.6;color:#F1E6D8;margin-bottom:.3rem}
.facts dd{margin:0;font-weight:600;font-size:1.05rem;line-height:1.6}

/* الأقسام */
.sec{padding:4.5rem 0;border-top:1px solid var(--rule)}
.sec.first{border-top:0}
.sec-in{max-width:1120px;margin:0 auto;padding-inline:1.5rem;display:grid;grid-template-columns:210px minmax(0,1fr);gap:3rem}
.sec h2{margin:0;font-size:1.55rem;line-height:1.5;font-weight:700}
.sec h3{font-size:1.08rem;line-height:1.7;font-weight:700;margin:0}
.prose{max-width:40em}
.prose p{margin:0 0 1.15em}
.prose p:last-child{margin-bottom:0}
.sub{margin-top:2.75rem}
.sub h3{margin-bottom:.9rem}

/* المؤهلات */
.quals{list-style:none;margin:0;padding:0;max-width:44em}
.quals li{display:grid;grid-template-columns:5.5rem minmax(0,1fr);gap:1.5rem;padding:1rem 0;border-bottom:1px solid var(--rule)}
.quals li:first-child{padding-top:0}
.yr{font-family:var(--kufi);font-weight:600;font-size:.95rem;color:var(--adobe);line-height:1.9}
.quals strong{display:block;font-weight:600}
.quals small,.org{display:block;color:var(--ink-2);font-size:1rem}
.plain{margin:0;padding-inline-start:1.2rem;max-width:44em}
.plain li{margin-bottom:.35rem}

/* المسيرة: خط زمني من الأقدم إلى الأحدث */
.timeline{list-style:none;margin:0;padding:0;max-width:52em}
.timeline li{display:grid;grid-template-columns:15rem minmax(0,1fr)}
.timeline .when{white-space:nowrap}
.timeline .when{font-family:var(--kufi);font-weight:600;font-size:.88rem;line-height:1.9;color:var(--adobe);padding-inline-end:1.5rem;padding-bottom:1.6rem}
.timeline .what{position:relative;border-inline-start:2px solid var(--rule);padding-inline-start:1.75rem;padding-bottom:1.6rem}
.timeline .what::before{content:"";position:absolute;inset-inline-start:-8px;top:.55rem;width:14px;height:14px;background:var(--paper);border:2px solid var(--adobe);transform:rotate(45deg)}
.timeline li.now .what::before{background:var(--adobe)}
.timeline li:last-child .what,.timeline li:last-child .when{padding-bottom:0}
.timeline h3{font-size:1.02rem}
.now-tag{display:inline-block;font-family:var(--kufi);font-size:.75rem;font-weight:600;line-height:1.6;background:var(--adobe);color:var(--paper);padding:.05rem .6rem;border-radius:3px;margin-inline-start:.5rem;vertical-align:middle}

/* الإنجازات */
.ach{max-width:46em}
.ach-group{padding-bottom:2rem;margin-bottom:2rem;border-bottom:1px solid var(--rule)}
.ach-group:last-child{border-bottom:0;margin-bottom:0;padding-bottom:0}
.ach-group h3{display:flex;flex-wrap:wrap;align-items:baseline;gap:.25rem .9rem;margin-bottom:.75rem}
.period{font-family:var(--kufi);font-weight:600;font-size:.85rem;color:var(--adobe)}
.ach ul{list-style:none;margin:0;padding:0}
.ach li{position:relative;padding-inline-start:1.4rem;margin-bottom:.6rem}
.ach li::before{content:"";position:absolute;inset-inline-start:0;top:.8em;width:9px;height:7px;background:var(--adobe);clip-path:polygon(50% 0,100% 100%,0 100%)}
.view-en .ach li::before{top:.6em}
.quote{font-family:var(--kufi);font-weight:600}

/* الأسرة */
.family{background:var(--adobe-soft);border-top:0}
.cites{list-style:none;margin:2rem 0 0;padding:0;max-width:44em;display:grid;gap:1rem}
.cites li{background:var(--paper);padding:1.1rem 1.35rem;border-inline-start:4px solid var(--adobe)}
.cites cite{display:block;font-family:var(--kufi);font-style:normal;font-weight:700;font-size:1rem;line-height:1.7}
.cites .meta{display:block;color:var(--ink-2);font-size:.95rem;margin-bottom:.35rem}
.cites p{margin:0}

/* الأسئلة */
.faq{max-width:46em}
.faq details{border-bottom:1px solid var(--rule)}
.faq details:first-child{border-top:1px solid var(--rule)}
.faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1rem 0;font-family:var(--kufi);font-weight:600;font-size:1rem;line-height:1.7}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-family:var(--kufi);font-size:1.3rem;color:var(--adobe);line-height:1}
.faq details[open] summary::after{content:"−"}
.faq details p{margin:0 0 1.25rem;color:var(--ink-2)}

/* المراجع */
.refs{margin:0;padding-inline-start:1.4rem;max-width:46em;font-size:1rem}
.refs li{margin-bottom:.45rem}

/* التذييل */
.foot{background:var(--ink);color:var(--paper);padding:3rem 1.5rem}
.foot-in{max-width:1120px;margin:0 auto;display:flex;flex-wrap:wrap;justify-content:space-between;gap:1.5rem 3rem;font-size:1rem}
.foot strong{font-family:var(--kufi);font-weight:700;display:block;font-size:1.05rem}
.foot p{margin:0}
.foot a{color:var(--paper)}
.tbd{border-bottom:1.5px dashed #C9A27E;color:#F1E6D8}

@media (max-width:860px){
  .head{flex-wrap:wrap;gap:.75rem 1rem}
  .nav{order:3;width:100%;margin:0;overflow-x:auto;gap:1.25rem;padding-bottom:.25rem}
  .lang-btn{margin-inline-start:auto}
  .hero{grid-template-columns:1fr;gap:2rem;padding-top:2.25rem}
  .lede{margin-bottom:0}
  .portrait{width:240px;max-width:100%;aspect-ratio:1/1}
  .facts{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sec{padding:3.25rem 0}
  .sec-in{grid-template-columns:1fr;gap:1.5rem;padding-inline:1.25rem}
  .timeline li{grid-template-columns:1fr}
  .timeline .when{white-space:normal}
  .timeline .when{padding-bottom:.15rem;padding-inline-start:1.75rem;border-inline-start:2px solid var(--rule)}
}
@media (max-width:480px){
  .facts{grid-template-columns:1fr}
  .quals li{grid-template-columns:4.25rem minmax(0,1fr);gap:1rem}
}

.lang-btn{text-decoration:none;display:inline-block}