:root{--ink:#17201d;--paper:#f0eee6;--cream:#ddd6c5;--orange:#e9572b;--green:#23453d;--line:rgba(23,32,29,.22);--naskh:"Noto Naskh Arabic",serif;--kufi:"Noto Kufi Arabic",sans-serif;--mono:"IBM Plex Mono",monospace}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--naskh);line-height:1.85}
a{color:inherit}
.skip-link{position:fixed;top:-5rem;right:1rem;z-index:30;background:#fff;padding:.8rem}.skip-link:focus{top:1rem}
.bio-nav{position:sticky;top:0;z-index:20;min-height:76px;padding:0 clamp(20px,5vw,72px);display:flex;align-items:center;justify-content:space-between;background:rgba(23,32,29,.97);color:#fff;border-bottom:1px solid rgba(255,255,255,.14);backdrop-filter:blur(14px)}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;font-family:var(--kufi);font-size:.82rem}.brand b{width:38px;height:38px;display:grid;place-items:center;border:1px solid var(--orange);color:var(--orange)}
.bio-nav nav{display:flex;gap:28px;font-family:var(--kufi);font-size:.72rem}.bio-nav nav a{text-underline-offset:5px}
.bio-hero{min-height:78vh;padding:clamp(70px,10vw,150px) clamp(20px,8vw,130px);display:grid;grid-template-columns:minmax(140px,.45fr) minmax(0,1.55fr);gap:7vw;align-items:end;position:relative;overflow:hidden;border-bottom:1px solid var(--ink)}
.bio-hero::after{content:"";position:absolute;width:clamp(220px,35vw,560px);aspect-ratio:1;border-radius:50%;background:var(--orange);top:-18%;left:-8%;mix-blend-mode:multiply;opacity:.9}
.hero-number{font:500 clamp(3.2rem,7vw,7rem)/.82 var(--mono);letter-spacing:-.08em;color:var(--orange);direction:ltr;position:relative;z-index:1}
.hero-copy{position:relative;z-index:1;max-width:990px}.kicker,.section-label{margin:0 0 1.5rem;color:var(--orange);font:500 .7rem/1.8 var(--kufi)}
h1{margin:0;font:700 clamp(4rem,9vw,9rem)/.98 var(--naskh);letter-spacing:-.035em}.lead{max-width:820px;margin:2rem 0 0;font:500 clamp(1.2rem,2vw,1.65rem)/1.95 var(--naskh)}
.source-button{display:inline-flex;margin-top:2.2rem;padding:12px 18px;border:1px solid var(--ink);background:var(--ink);color:white;text-decoration:none;font-family:var(--kufi);font-size:.72rem}.source-button:hover{background:var(--orange);border-color:var(--orange)}
.identity{padding:clamp(60px,8vw,100px) clamp(20px,8vw,130px);background:var(--cream);border-bottom:1px solid var(--ink)}
.identity>p{max-width:1200px;margin-inline:auto}.identity dl{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--ink);border-right:1px solid var(--ink)}
.identity dl div{min-height:135px;padding:22px;border-left:1px solid var(--ink);border-bottom:1px solid var(--ink)}.identity dt{color:#59615d;font:500 .66rem var(--kufi)}.identity dd{margin:12px 0 0;font:600 clamp(1.05rem,1.7vw,1.35rem)/1.65 var(--naskh)}
.biography-body{padding:clamp(70px,10vw,150px) clamp(20px,8vw,130px);max-width:1460px;margin:auto}.biography-body section{display:grid;grid-template-columns:90px minmax(0,840px);gap:clamp(20px,5vw,75px);justify-content:center;padding:clamp(45px,7vw,90px) 0;border-bottom:1px solid var(--line)}.biography-body section:first-child{padding-top:0}.biography-body section:last-child{border-bottom:0;padding-bottom:0}
.biography-body section>span{color:var(--orange);font:500 .72rem var(--mono);direction:ltr}.biography-body h2,.source-note h2{margin:0 0 1.6rem;font:700 clamp(2.4rem,4.5vw,4.6rem)/1.12 var(--naskh)}.biography-body p{font-size:clamp(1.08rem,1.5vw,1.28rem);margin:0 0 1.1rem}.biography-body p:last-child{margin-bottom:0}.biography-body section:nth-child(even) div{padding-right:clamp(0px,5vw,80px)}
.source-note{padding:clamp(65px,8vw,115px) clamp(20px,8vw,130px);display:grid;grid-template-columns:1fr 1fr;gap:8vw;background:var(--green);color:var(--paper)}.source-note .section-label{color:var(--orange)}.source-note p:not(.section-label){font-size:1.1rem;color:#d5dbd4}.source-note a{display:inline-block;margin-top:1.2rem;color:var(--orange);font-family:var(--kufi);font-size:.75rem;text-underline-offset:5px}
footer{min-height:150px;padding:35px clamp(20px,5vw,72px);display:flex;align-items:center;justify-content:space-between;gap:30px;background:#101714;color:white;font-family:var(--kufi);font-size:.68rem}footer span{color:var(--orange)}
@media(max-width:800px){.bio-hero{grid-template-columns:1fr;align-items:start}.hero-number{font-size:3.6rem}.identity dl{grid-template-columns:1fr 1fr}.biography-body section{grid-template-columns:48px minmax(0,1fr)}.source-note{grid-template-columns:1fr}.biography-body section:nth-child(even) div{padding-right:0}}
@media(max-width:520px){.bio-nav{min-height:64px}.brand span{display:none}.bio-nav nav{gap:14px}.bio-nav nav a:first-child{display:none}.bio-hero{min-height:auto;padding-top:70px}.bio-hero::after{top:-7%;left:-35%}h1{font-size:3.65rem}.identity dl{grid-template-columns:1fr}.biography-body section{grid-template-columns:1fr;gap:12px}.biography-body section>span{padding-bottom:10px;border-bottom:1px solid var(--orange);width:35px}.source-note h2{font-size:2.6rem}footer{align-items:flex-start;flex-direction:column}}
@media print{.bio-nav,.source-button,footer{display:none}.bio-hero{min-height:auto}.source-note{background:white;color:#000}.source-note p:not(.section-label){color:#000}}