/* ahmedsimary.com — editorial restraint, human authority, live-event precision. */

/* ---------- fonts (self-hosted, latin subsets, OFL) ---------- */
@font-face{font-family:'IBM Plex Sans Condensed';font-style:normal;font-weight:400;font-display:swap;src:url('/assets/fonts/ibm-plex-sans-condensed-400-latin.woff2') format('woff2')}
@font-face{font-family:'IBM Plex Sans Condensed';font-style:normal;font-weight:500;font-display:swap;src:url('/assets/fonts/ibm-plex-sans-condensed-500-latin.woff2') format('woff2')}
@font-face{font-family:'IBM Plex Sans Condensed';font-style:normal;font-weight:600;font-display:swap;src:url('/assets/fonts/ibm-plex-sans-condensed-600-latin.woff2') format('woff2')}
@font-face{font-family:'Instrument Serif';font-style:italic;font-weight:400;font-display:swap;src:url('/assets/fonts/instrument-serif-400-italic-latin.woff2') format('woff2')}

/* ---------- tokens ---------- */
:root{
  --bg:#0c0c0b; --panel:#191816; --panel2:#131311;
  --text-primary:#f3efe7; --text-secondary:#aaa69e;
  --ink:var(--text-primary); --ink70:var(--text-secondary); --ink50:var(--text-secondary); --ink35:var(--text-secondary);
  --accent:#b89a67; --accent-strong:#d2b57b; --line:rgba(184,154,103,.62); --line-soft:rgba(184,154,103,.42);
  --font-display:'IBM Plex Sans Condensed','Arial Narrow',sans-serif;
  --font-body:'IBM Plex Sans Condensed','Arial Narrow',sans-serif;
  --font-editorial:'Instrument Serif',Georgia,serif;
  --disp:var(--font-body);
  --serif:var(--font-editorial);
  --ar-face:'Geeza Pro','Noto Naskh Arabic',serif;
  --text-xs:.6875rem; --text-sm:.75rem; --text-base:1rem; --text-lg:1.125rem; --text-xl:1.25rem; --text-2xl:1.5rem;
  --text-3xl:clamp(1.875rem,3.6vw,3.5rem); --text-4xl:clamp(2.25rem,5.2vw,5rem); --text-hero:clamp(2.75rem,7.2vw,7.375rem);
  --weight-regular:400; --weight-medium:500; --weight-semibold:600;
  --leading-tight:1; --leading-heading:1.08; --leading-body:1.7;
  --tracking-normal:0; --tracking-wide:.16em; --tracking-display:.22em;
  --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px; --space-5:24px;
  --space-6:32px; --space-7:48px; --space-8:64px; --space-9:96px; --space-10:128px;
  --section-space:clamp(64px,7vw,96px);
  --container-cinematic:1440px; --container-standard:1200px; --container-reading:720px; --container-form:820px;
  --card-border:var(--line-soft); --card-bg:var(--panel2); --radius:2px;
  --ease:cubic-bezier(.16,1,.3,1); --ease2:cubic-bezier(.4,0,.2,1);
  --mx:clamp(24px,6vw,120px); --maxw:var(--container-cinematic); --measure:74ch;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--text-primary);font-family:var(--font-body);font-size:var(--text-base);font-weight:var(--weight-regular);line-height:var(--leading-body);-webkit-font-smoothing:antialiased;overflow-x:hidden}
main [id]{scroll-margin-top:86px}
img,video{max-width:100%;display:block}
.media-pos-20{object-position:50% 20%}
.media-pos-30{object-position:50% 30%}
.media-pos-32{object-position:50% 32%}
.media-pos-35{object-position:50% 35%}
.media-pos-40{object-position:50% 40%}
.media-pos-45{object-position:50% 45%}
.media-pos-55{object-position:50% 55%}
.media-pos-60{object-position:50% 60%}
.media-pos-70{object-position:50% 70%}
a{color:inherit;text-decoration-color:var(--line);text-underline-offset:3px}
a:hover{text-decoration-color:var(--accent)}
:focus-visible{outline:2px solid var(--accent-strong);outline-offset:3px;border-radius:var(--radius)}
::selection{background:var(--accent);color:var(--bg)}
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:var(--space-4);top:-60px;z-index:300;background:var(--accent);color:var(--bg);padding:10px 18px;font-size:var(--text-sm);letter-spacing:var(--tracking-wide);text-decoration:none;transition:top 200ms var(--ease2)}
.skip:focus{top:12px}
.serif,.pull{font-family:var(--serif);font-style:italic;font-weight:500}
em.serif{color:var(--text-primary);letter-spacing:var(--tracking-normal)}
.eyebrow{font-size:var(--text-sm);letter-spacing:var(--tracking-display);text-transform:uppercase;color:var(--text-secondary);font-weight:var(--weight-medium);margin-bottom:var(--space-4);display:flex;align-items:center;gap:var(--space-3);width:fit-content}
.eyebrow::after{content:"";display:block;width:44px;height:1px;background:var(--accent);transform-origin:left}
.scene-label{font-size:var(--text-xs);letter-spacing:var(--tracking-display);text-transform:uppercase;color:var(--text-secondary);font-weight:var(--weight-medium)}
.ar-sig{font-family:var(--ar-face);color:var(--text-secondary);letter-spacing:var(--tracking-normal)}

/* ---------- header ---------- */
.hdr{position:sticky;top:0;z-index:100;display:flex;justify-content:space-between;align-items:center;gap:var(--space-4);padding:14px var(--mx);background:rgba(12,12,11,.88);backdrop-filter:blur(10px);border-bottom:1px solid var(--line-soft)}
.wm{font-family:var(--font-display);font-size:15px;letter-spacing:var(--tracking-display);text-transform:uppercase;font-weight:var(--weight-semibold);text-decoration:none;display:flex;flex-direction:column;line-height:1.2}
.wm .ar-sig{font-size:11px;font-weight:400}
.menu{display:flex;align-items:center;gap:var(--space-5);list-style:none}
.menu a{font-size:12.5px;letter-spacing:var(--tracking-display);text-transform:uppercase;color:var(--text-secondary);text-decoration:none;padding:6px 0;transition:color 180ms var(--ease2),opacity 180ms var(--ease2)}
.menu a:hover,.menu a[aria-current]{color:var(--ink)}
.menu a[aria-current]{border-bottom:1px solid var(--accent)}
.menu-split{width:1px;height:18px;background:var(--line)}
.menu-cv{color:var(--text-primary) !important}
.menu-btn{display:none;position:relative;z-index:101;background:none;border:1px solid var(--line);color:var(--ink);font-family:var(--font-body);font-size:var(--text-sm);letter-spacing:var(--tracking-display);text-transform:uppercase;padding:9px 16px;cursor:pointer;min-height:44px;border-radius:var(--radius)}
@media(max-width:1100px){
  .hdr{backdrop-filter:none;background:rgba(12,12,11,.98)}
  .menu-btn{display:block}
  .menu{position:fixed;inset:0;top:0;max-height:100dvh;overflow-y:auto;flex-direction:column;justify-content:center;background:rgba(12,12,11,.99);display:none;gap:var(--space-2);z-index:90}
  .menu.open{display:flex}
  .menu a{font-size:var(--text-xl);padding:var(--space-3) var(--space-5);min-height:44px;display:inline-block}
  .menu-split{display:none}
  body:has(.menu.open){overflow:hidden}
}
@media(max-width:1100px) and (max-height:600px){
  .menu{justify-content:flex-start;padding:72px var(--space-5) var(--space-5)}
}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 var(--space-5);border:1px solid var(--line);border-radius:var(--radius);background:transparent;color:var(--text-primary);font-family:var(--font-body);font-size:13px;font-weight:var(--weight-medium);letter-spacing:var(--tracking-display);line-height:1;text-align:center;text-transform:uppercase;text-decoration:none;cursor:pointer;transition:border-color 180ms var(--ease2),background 180ms var(--ease2),color 180ms var(--ease2),transform 180ms var(--ease2)}
.btn:hover{border-color:var(--accent);background:rgba(184,154,103,.08)}
.btn:active{transform:translateY(1px)}
.btn:disabled,.btn[aria-disabled="true"]{cursor:not-allowed;opacity:.45}
.btn-primary{background:var(--accent);border-color:var(--accent);color:var(--bg);font-weight:var(--weight-semibold)}
.btn-primary:hover{background:var(--accent-strong);border-color:var(--accent-strong)}
.btn-ghost{background:transparent;color:var(--text-primary)}

/* ---------- hero ---------- */
.hero{position:relative;min-height:92svh;display:flex;align-items:flex-end;overflow:hidden}
.hero-media{position:absolute;inset:0}
.hero-poster,.hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:brightness(.55) contrast(1.06) saturate(.75)}
.hero-video{opacity:0;transition:opacity 800ms var(--ease)}
.hero-video.playing{opacity:1}
.hero-scrim{position:absolute;inset:0;background:linear-gradient(to top,var(--bg) 6%,rgba(12,12,11,.58) 45%,rgba(12,12,11,.36)),linear-gradient(100deg,rgba(12,12,11,.78) 20%,transparent 65%)}
.hero-inner{position:relative;z-index:2;width:100%;max-width:var(--container-cinematic);margin:0 auto;padding:18vh var(--mx) 10vh}
.hero-h1{font-family:var(--font-display);font-size:var(--text-hero);font-weight:var(--weight-semibold);line-height:.98;letter-spacing:var(--tracking-normal);text-transform:uppercase;margin:var(--space-5) 0 var(--space-6)}
.hero-h1 .hero-serif{display:block;font-family:var(--font-editorial);font-style:italic;font-weight:400;text-transform:lowercase;color:var(--text-primary);font-size:.72em}
.rv-line{display:block}
.hero-support{max-width:56ch;font-size:17px;color:var(--text-secondary);letter-spacing:var(--tracking-normal);line-height:var(--leading-body)}
.hero-proof{margin:var(--space-5) 0 var(--space-6);font-size:13px;letter-spacing:var(--tracking-display);text-transform:uppercase;color:var(--text-secondary)}
.hero-ctas{display:flex;flex-wrap:wrap;gap:var(--space-3)}
.hero-pause{position:absolute;right:var(--mx);bottom:var(--space-5);z-index:5;background:rgba(12,12,11,.68);border:1px solid var(--line);border-radius:var(--radius);color:var(--text-secondary);font-family:var(--font-body);font-size:var(--text-xs);letter-spacing:var(--tracking-display);text-transform:uppercase;padding:10px 16px;cursor:pointer;min-height:44px}

/* ---------- sections ---------- */
.sect{padding:var(--section-space) var(--mx);max-width:var(--container-cinematic);margin:0 auto}
.sect-h{font-family:var(--font-display);font-size:var(--text-3xl);font-weight:var(--weight-semibold);text-transform:uppercase;line-height:var(--leading-heading);max-width:24ch}
.sect-copy{margin-top:var(--space-5);max-width:60ch;color:var(--text-secondary);font-size:16.5px;line-height:var(--leading-body)}
.sect-more{margin-top:var(--space-6);font-size:14px;letter-spacing:.06em}
.sect-more a,.case-cta{text-decoration:underline;text-decoration-color:var(--line);text-decoration-thickness:1px;text-underline-offset:5px}
.sect-more a:hover,.case-cta:hover{text-decoration-color:var(--accent)}
.closing-min{text-align:left;border-top:1px solid var(--line-soft)}
.closing-min .hero-ctas{margin-top:var(--space-5)}

/* ---------- metrics ---------- */
.metrics-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-7) 5vw;margin-top:var(--space-8)}
.metric{display:flex;flex-direction:column}
.metric-rule{height:1px;background:var(--accent);width:64%;margin-bottom:var(--space-5)}
.metric-val{font-family:var(--font-display);font-size:var(--text-3xl);font-weight:var(--weight-semibold);font-variant-numeric:tabular-nums;line-height:var(--leading-tight)}
.metric-label{margin-top:var(--space-3);font-size:var(--text-sm);letter-spacing:var(--tracking-display);text-transform:uppercase;color:var(--text-secondary);max-width:24ch}
.metrics-note{margin-top:var(--space-7);font-size:13px;color:var(--text-secondary);max-width:70ch}
.metrics-note a{color:var(--text-secondary)}

/* ---------- case cards ---------- */
.case-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-5);margin-top:var(--space-7)}
.case-card{display:flex;flex-direction:column;gap:var(--space-2);text-decoration:none;border:1px solid var(--card-border);border-radius:var(--radius);background:var(--card-bg);padding:0 0 var(--space-5);overflow:hidden;transition:border-color 220ms var(--ease2),transform 350ms var(--ease)}
.case-card:hover{border-color:var(--accent);transform:translateY(-3px)}
.case-media{display:block;aspect-ratio:16/10;overflow:hidden;margin-bottom:var(--space-3)}
.case-media img{width:100%;height:100%;object-fit:cover;filter:contrast(1.06) saturate(.82) brightness(.9);transition:transform 900ms var(--ease)}
.case-card:hover .case-media img{transform:scale(1.04)}
.case-media-logo{background:#f6f7f3}
.case-media-logo img{object-fit:contain;padding:5%;filter:none}
.case-media-typo{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-3);background:radial-gradient(ellipse at 60% 40%,var(--panel),var(--bg) 75%)}
.case-big{font-family:var(--font-display);font-size:clamp(30px,3vw,46px);font-weight:var(--weight-semibold);font-variant-numeric:tabular-nums}
.case-big-label{font-size:10px;letter-spacing:var(--tracking-display);text-transform:uppercase;color:var(--text-secondary)}
.case-card .scene-label,.case-card .case-title,.case-card .case-kicker,.case-card .case-stats,.case-card .case-cta{padding:0 var(--space-5)}
.case-title{font-family:var(--font-display);font-size:var(--text-2xl);font-weight:var(--weight-semibold);text-transform:uppercase;line-height:1.12}
.case-kicker{font-family:var(--font-editorial);font-style:italic;color:var(--text-secondary);font-size:var(--text-base)}
.case-stats{font-size:12.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--text-secondary)}
.case-cta{margin-top:var(--space-2);font-size:var(--text-sm);letter-spacing:var(--tracking-display);text-transform:uppercase;color:var(--text-primary)}

/* ---------- disciplines ---------- */
.disc-grid{display:grid;grid-template-columns:minmax(240px,340px) 1fr;gap:5vw;margin-top:var(--space-8);align-items:start}
.disc-cols{display:grid;gap:var(--space-7)}
.disc h3{font-family:var(--font-display);font-size:22px;text-transform:uppercase;font-weight:var(--weight-semibold);margin:6px 0 10px}
.disc-num{color:var(--text-secondary);font-size:var(--text-base)}
.disc p{color:var(--text-secondary);max-width:64ch}
.tags{display:flex;flex-wrap:wrap;gap:var(--space-2);margin-top:var(--space-4);list-style:none}
.tags span,.tags li{font-size:var(--text-xs);letter-spacing:var(--tracking-wide);text-transform:uppercase;color:var(--text-secondary);border:1px solid var(--line-soft);padding:6px 12px}

/* ---------- portrait films ---------- */
.film{position:relative;aspect-ratio:3/4;overflow:hidden;background:var(--card-bg);border:1px solid var(--card-border);border-radius:var(--radius)}
.film video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 30%;filter:saturate(.72) contrast(1.06) brightness(.9)}
.film .film-fallback{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.film video{z-index:1;opacity:0;transition:opacity 600ms var(--ease)}
.film video.playing{opacity:1}
.film-warm{position:absolute;inset:0;z-index:2;background:linear-gradient(200deg,rgba(184,154,103,.14),transparent 60%);mix-blend-mode:overlay;pointer-events:none}
.film::after{content:"";position:absolute;right:-2%;bottom:-2%;width:38%;height:32%;z-index:2;background:radial-gradient(closest-side at 75% 75%,rgba(12,12,11,.9),transparent);pointer-events:none}
.film-pause{position:absolute;left:10px;bottom:10px;z-index:4;background:rgba(12,12,11,.72);border:1px solid var(--line);border-radius:var(--radius);color:var(--text-secondary);font-family:var(--font-body);font-size:10px;letter-spacing:var(--tracking-wide);text-transform:uppercase;padding:8px 12px;cursor:pointer}
.film-caption{margin-top:var(--space-3);font-size:var(--text-sm);color:var(--text-secondary);letter-spacing:.08em}

/* ---------- manifesto ---------- */
.man-grid{display:grid;grid-template-columns:1.5fr 1fr;gap:6vw;align-items:start}
.man-body{margin-top:var(--space-5);font-size:16.5px;line-height:1.8;color:var(--text-secondary);max-width:60ch;letter-spacing:var(--tracking-normal)}
.pull{font-size:clamp(20px,2vw,28px);color:var(--text-secondary);margin-top:var(--space-6);line-height:1.45;max-width:44ch}
.man-film{max-width:380px}

/* ---------- clients ---------- */
.client-marquee{margin-top:var(--space-6);border-top:1px solid var(--line-soft);border-bottom:1px solid var(--line-soft);overflow:hidden}
.client-wall{display:flex;flex-wrap:wrap;gap:var(--space-3) 34px;list-style:none;padding:var(--space-6) 0}
.client-heading{margin-top:var(--space-2)}
.client-wall li{font-size:clamp(17px,1.6vw,24px);text-transform:uppercase;font-weight:var(--weight-medium);letter-spacing:.08em;color:var(--text-secondary);white-space:nowrap}
.client-wall a{display:flex;flex-direction:column;gap:5px;text-decoration:none;color:inherit}
.client-wall strong{font:inherit;color:inherit}
.client-wall span{font-size:10px;letter-spacing:.12em;color:var(--text-secondary);font-weight:var(--weight-regular)}
.client-wall a:hover strong,.client-wall a:focus-visible strong{color:var(--accent)}
.client-wall li::after{content:"✦";color:var(--accent);font-size:10px;margin-left:34px;vertical-align:middle}
.client-wall li:last-child::after{content:""}
.js .client-marquee.is-ready .client-marquee-track{display:flex;gap:34px;width:max-content;will-change:transform;animation:client-flow 36s linear infinite;animation-play-state:paused}
.js .client-marquee.is-ready .client-wall{flex:0 0 auto;flex-wrap:nowrap}
.js .client-marquee.is-ready.marquee-active .client-marquee-track{animation-play-state:running}
.js .client-marquee.is-ready.marquee-active:hover .client-marquee-track{animation-play-state:paused}
.client-wall li:nth-child(4n+2){color:var(--text-primary)}
@keyframes client-flow{to{transform:translateX(calc(-50% - 17px))}}

/* ---------- recommendations ---------- */
.rec-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-5);margin-top:var(--space-7)}
.rec{border:1px solid var(--card-border);border-radius:var(--radius);background:var(--card-bg);padding:var(--space-6)}
.rec-quote{font-family:var(--font-editorial);font-style:italic;font-size:19px;line-height:1.55;color:var(--text-primary)}
.rec-who{margin-top:var(--space-5);font-size:14px;font-weight:var(--weight-semibold);letter-spacing:.06em;text-transform:uppercase;display:flex;flex-direction:column;gap:var(--space-1)}
.rec-who span{font-weight:var(--weight-regular);font-size:var(--text-sm);letter-spacing:.14em;color:var(--text-secondary)}
.rec-verified{color:var(--text-secondary) !important;font-size:10px !important;letter-spacing:var(--tracking-display) !important}

/* ---------- posts ---------- */
.post-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-5);margin-top:var(--space-7)}
.post-grid-index{grid-template-columns:repeat(3,1fr)}
.post-card{height:100%}
.post-card-link{display:flex;flex-direction:column;gap:var(--space-2);height:100%;text-decoration:none;border:1px solid var(--card-border);border-radius:var(--radius);background:var(--card-bg);padding-bottom:var(--space-5);overflow:hidden;transition:border-color 220ms var(--ease2)}
.post-card-link:hover{border-color:var(--accent)}
.post-cover{display:block;aspect-ratio:16/9;overflow:hidden;margin-bottom:var(--space-3)}
.post-cover img{width:100%;height:100%;object-fit:cover;filter:contrast(1.05) saturate(.7) brightness(.85)}
.post-meta,.post-title,.post-desc{padding:0 var(--space-5)}
.post-meta{font-size:var(--text-xs);letter-spacing:var(--tracking-display);text-transform:uppercase;color:var(--text-secondary)}
.post-title{font-family:var(--font-display);font-size:var(--text-xl);font-weight:var(--weight-semibold);line-height:1.3;text-transform:none;letter-spacing:var(--tracking-normal)}
.post-desc{font-size:14px;color:var(--text-secondary);line-height:1.6}

/* ---------- closing ---------- */
.closing{border-top:1px solid var(--line-soft)}
.closing-h{font-family:var(--font-display);font-size:clamp(38px,5.4vw,84px);font-weight:var(--weight-semibold);text-transform:uppercase;line-height:var(--leading-tight);max-width:16ch;margin-bottom:var(--space-5)}
.closing-h .serif{display:block;font-size:.7em;text-transform:none}
.closing-line-wrap{display:flex;align-items:flex-end;gap:var(--space-6);margin-top:var(--space-8)}
.closing-film{width:210px;flex:none}
.closing-line{font-size:clamp(18px,1.8vw,26px);color:var(--text-secondary);max-width:40ch}

/* ---------- page scaffolding ---------- */
.page-head{padding:clamp(64px,8vw,112px) var(--mx) var(--space-7);max-width:var(--container-cinematic);margin:0 auto}
.page-head + .sect{padding-top:var(--space-6)}
.crumbs{font-size:var(--text-xs);letter-spacing:var(--tracking-display);text-transform:uppercase;color:var(--text-secondary);margin-bottom:var(--space-5)}
.crumbs a{color:var(--text-secondary);text-decoration:none}
.crumbs a:hover{color:var(--ink)}
.page-h1{font-family:var(--font-display);font-size:var(--text-4xl);font-weight:var(--weight-semibold);text-transform:uppercase;line-height:1.03;max-width:20ch}
.page-intro{margin-top:var(--space-5);max-width:62ch;font-size:17px;color:var(--text-secondary);line-height:1.75}
.page-actions{margin-top:var(--space-6);display:flex;gap:var(--space-3);flex-wrap:wrap}

/* ---------- work archive ---------- */
.archive-list{list-style:none;margin-top:var(--space-7);display:grid;gap:1px;background:var(--line-soft)}
.archive-item{display:flex;gap:var(--space-5);background:var(--bg);padding:var(--space-5) 0;align-items:center}
.archive-link{display:flex;gap:var(--space-5);width:100%;align-items:center;color:inherit;text-decoration:none;transition:background-color 180ms var(--ease2),padding 180ms var(--ease2)}
.archive-link:hover,.archive-link:focus-visible{background:var(--panel);padding-left:var(--space-4);padding-right:var(--space-4)}
.archive-thumb{width:180px;flex:none;aspect-ratio:16/10;overflow:hidden}
.archive-thumb img{width:100%;height:100%;object-fit:cover;filter:contrast(1.05) saturate(.75) brightness(.85)}
.archive-body h3{font-family:var(--font-display);font-size:var(--text-xl);text-transform:uppercase;font-weight:var(--weight-semibold)}
.archive-kicker{font-family:var(--font-editorial);font-style:italic;color:var(--text-secondary);font-size:15px;margin:var(--space-1) 0}
.archive-stats{font-size:var(--text-sm);letter-spacing:.14em;text-transform:uppercase;color:var(--text-secondary)}
.archive-filter{color:var(--text-secondary)}

/* ---------- case study ---------- */
.case-head .scene-label{margin-bottom:var(--space-3)}
.assignment{display:grid;grid-template-columns:repeat(4,auto);gap:var(--space-3) var(--space-7);margin-top:var(--space-6);border-top:1px solid var(--line-soft);padding-top:var(--space-5);width:fit-content}
.assignment dt{font-size:10px;letter-spacing:var(--tracking-display);text-transform:uppercase;color:var(--text-secondary)}
.assignment dd{font-size:14.5px;margin-top:6px;letter-spacing:.04em}
.case-hero-media{width:calc(100% - 2*var(--mx));margin:var(--space-6) auto;max-width:var(--container-cinematic)}
.case-hero-media img{width:100%;max-height:64vh;object-fit:cover;filter:contrast(1.06) saturate(.82) brightness(.9)}
.case-hero-media figcaption{font-size:var(--text-sm);color:var(--text-secondary);margin-top:var(--space-3);letter-spacing:.1em}
.case-hero-logo{background:#f6f7f3;padding:clamp(24px,5vw,72px)}
.case-hero-logo img{height:min(54vh,560px);object-fit:contain;filter:none}
.case-hero-logo figcaption{color:#555;text-align:center}
.case-media-typo.case-hero-media{aspect-ratio:21/9;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;border:1px solid var(--line-soft)}
.case-constellation{position:relative}
.case-constellation svg{position:absolute;inset:0;width:100%;height:100%}
.case-constellation svg line{stroke:rgba(184,154,103,.32);stroke-width:.6}
.case-constellation svg circle{fill:var(--accent)}
.case-constellation .case-big,.case-constellation .case-big-label{position:relative;z-index:2}
.case-body{padding:var(--space-6) var(--mx) var(--space-8);max-width:calc(var(--container-reading) + 2*var(--mx));margin:0 auto}
.case-body h2{font-size:14px;letter-spacing:var(--tracking-display);text-transform:uppercase;color:var(--text-primary);margin:var(--space-7) 0 var(--space-4);font-weight:var(--weight-medium)}
.case-body p{font-size:16.5px;line-height:1.8;color:var(--text-secondary)}
.case-body p.pull{color:var(--text-secondary)}
.case-system,.case-results{list-style:none;display:grid;gap:var(--space-3)}
.case-system li,.case-results li{font-size:var(--text-base);line-height:1.65;color:var(--text-secondary);padding-left:22px;position:relative}
.case-system li::before{content:"—";position:absolute;left:0;color:var(--accent)}
.case-results li{font-size:18px;color:var(--ink)}
.case-results li::before{content:"✦";position:absolute;left:0;color:var(--accent);font-size:var(--text-xs);top:6px}
.related-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-5)}
.related-card{display:flex;flex-direction:column;gap:var(--space-2);border:1px solid var(--card-border);border-radius:var(--radius);background:var(--card-bg);padding:var(--space-5);text-decoration:none;transition:border-color 180ms var(--ease2)}
.related-card:hover{border-color:var(--accent)}
.related-title{font-family:var(--font-display);font-size:17px;font-weight:var(--weight-semibold);line-height:1.35}
.related-sub{font-size:var(--text-sm);letter-spacing:var(--tracking-wide);text-transform:uppercase;color:var(--text-secondary)}

/* ---------- experience ---------- */
.roles{list-style:none;display:grid;gap:1px;background:var(--line-soft);counter-reset:none}
.role{display:grid;grid-template-columns:minmax(220px,340px) 1fr;gap:4vw;background:var(--bg);padding:var(--space-7) 0;scroll-margin-top:90px}
.role-head h2{font-family:var(--font-display);font-size:var(--text-2xl);text-transform:uppercase;font-weight:var(--weight-semibold)}
.role-title{font-family:var(--font-editorial);font-style:italic;color:var(--text-secondary);font-size:var(--text-base);margin:6px 0}
.role-meta{font-size:var(--text-sm);letter-spacing:var(--tracking-wide);text-transform:uppercase;color:var(--text-secondary)}
.role-body p{font-size:15.5px;color:var(--text-secondary);line-height:var(--leading-body);max-width:66ch}
.role-body ul{list-style:none;margin-top:var(--space-4);display:grid;gap:9px}
.role-body li{font-size:14.5px;color:var(--text-secondary);line-height:1.65;padding-left:20px;position:relative}
.role-body li::before{content:"—";position:absolute;left:0;color:var(--accent)}

/* ---------- about ---------- */
.about-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:6vw;align-items:start}
.about-film{max-width:360px;justify-self:end}
.about-langs{display:flex;gap:var(--space-5);flex-wrap:wrap;margin-top:var(--space-5);font-size:14px;color:var(--text-secondary)}
.lead-list{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:var(--space-5) 5vw;margin-top:var(--space-7);counter-reset:lead}
.lead-list li{border-top:1px solid var(--line-soft);padding-top:var(--space-4);counter-increment:lead;position:relative}
.lead-list h3{font-family:var(--font-display);font-size:var(--text-lg);text-transform:uppercase;font-weight:var(--weight-semibold);display:inline-block}
.lead-list h3::before{content:counter(lead,decimal-leading-zero);font-family:var(--font-editorial);font-style:italic;color:var(--text-secondary);margin-right:var(--space-3);font-size:15px}
.lead-list p{font-size:14.5px;color:var(--text-secondary);margin-top:6px;max-width:52ch}
.toolkit{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-5) 5vw;margin-top:var(--space-7)}
.toolkit dt{font-size:var(--text-sm);letter-spacing:var(--tracking-display);text-transform:uppercase;color:var(--text-primary);margin-bottom:var(--space-2)}
.toolkit dd{font-size:15px;color:var(--text-secondary)}
.about-foot-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:5vw;margin-bottom:var(--space-7)}
.about-foot-grid p{color:var(--text-secondary);font-size:15px}

/* ---------- insights ---------- */
.cat-nav{display:flex;flex-wrap:wrap;gap:var(--space-2);margin-top:var(--space-5)}
.cat{background:none;border:1px solid var(--line-soft);border-radius:var(--radius);color:var(--text-secondary);font-family:var(--font-body);font-size:var(--text-sm);letter-spacing:var(--tracking-wide);text-transform:uppercase;padding:10px 16px;cursor:pointer;min-height:44px}
.cat.is-active{border-color:var(--accent);color:var(--text-primary)}
.article-head{max-width:calc(var(--container-form) + 2*var(--mx))}
.article-h1{text-transform:none;font-size:clamp(30px,4vw,58px);letter-spacing:var(--tracking-normal);max-width:24ch}
.scenario-note{margin-top:var(--space-4);font-size:13px;color:var(--text-secondary);border:1px solid var(--line-soft);border-radius:var(--radius);padding:10px 16px;width:fit-content}
.article-cover{width:calc(100% - 2*var(--mx));margin:var(--space-5) auto 0;max-width:var(--container-cinematic)}
.article-cover img{width:100%;max-height:46vh;object-fit:cover;filter:contrast(1.05) saturate(.7) brightness(.85)}
.article-layout{display:grid;grid-template-columns:minmax(0,240px) minmax(0,var(--container-reading));justify-content:center;gap:6vw;padding:var(--space-8) var(--mx);max-width:var(--container-cinematic);margin:0 auto}
.article-layout:has(> .article-body:only-child){grid-template-columns:minmax(0,var(--container-reading))}
.toc{position:sticky;top:90px;align-self:start;min-width:0;border:1px solid var(--card-border);border-radius:var(--radius);padding:var(--space-5)}
.toc h2{font-size:var(--text-xs);letter-spacing:var(--tracking-display);text-transform:uppercase;color:var(--text-primary);margin-bottom:var(--space-3);font-weight:var(--weight-medium)}
.toc ol{list-style:none;display:grid;gap:var(--space-2)}
.toc a{font-size:13.5px;color:var(--text-secondary);text-decoration:none;line-height:1.45}
.toc a:hover{color:var(--ink)}
.article-body{min-width:0;font-size:16.5px;line-height:1.85;color:var(--text-secondary);letter-spacing:var(--tracking-normal)}
.article-body h2{font-family:var(--font-display);font-size:22px;font-weight:var(--weight-semibold);color:var(--text-primary);margin:var(--space-7) 0 var(--space-4);line-height:1.3;scroll-margin-top:90px}
.article-body h3{font-family:var(--font-display);font-size:var(--text-lg);font-weight:var(--weight-semibold);color:var(--text-primary);margin:var(--space-6) 0 var(--space-3)}
.article-body p{margin-bottom:18px}
.article-body ul,.article-body ol{margin:0 0 18px 22px}
.article-body li{margin-bottom:8px}
.article-body table{border-collapse:collapse;margin:20px 0;width:100%}
.article-body caption{caption-side:top;text-align:left;margin-bottom:10px;color:var(--text-primary);font-size:14px;font-weight:var(--weight-semibold)}
.article-body th,.article-body td{border:1px solid var(--line-soft);padding:10px 14px;text-align:left;font-size:14.5px}
.article-body thead th{background:var(--panel);color:var(--text-primary)}
.article-body blockquote{border-left:2px solid var(--accent);padding-left:var(--space-5);font-family:var(--font-editorial);font-style:italic;font-size:19px;margin:var(--space-5) 0;color:var(--text-secondary)}
.article-proof{border-top:1px solid var(--line-soft);border-bottom:1px solid var(--line-soft);margin-top:var(--space-7);padding:var(--space-5) 0}
.article-proof .eyebrow{margin:0 0 var(--space-3)}
.article-proof a{display:flex;flex-direction:column;gap:6px;text-decoration:none}
.article-proof strong{font-family:var(--font-display);font-size:var(--text-lg);color:var(--text-primary)}
.article-proof span{font-size:14px;color:var(--text-secondary)}
.article-proof a:hover strong,.article-proof a:focus-visible strong{color:var(--accent)}
.article-share{display:flex;gap:var(--space-5);align-items:center;border-top:1px solid var(--line-soft);margin-top:var(--space-7);padding-top:var(--space-5)}
.article-share .eyebrow{margin:0}
.article-share a{font-size:13px;letter-spacing:.1em}
.author-bio{border:1px solid var(--card-border);border-radius:var(--radius);background:var(--card-bg);padding:var(--space-5);margin-top:var(--space-6)}
.author-bio p{margin:0;font-size:14.5px}
.article-nav{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-5);padding:0 var(--mx);max-width:var(--container-cinematic);margin:0 auto}
.article-nav-item{display:flex;flex-direction:column;gap:6px;border:1px solid var(--card-border);border-radius:var(--radius);padding:var(--space-5);text-decoration:none;font-size:var(--text-base);font-weight:var(--weight-semibold);line-height:1.35;transition:border-color 180ms var(--ease2)}
.article-nav-item:hover{border-color:var(--accent)}
.article-nav-item .eyebrow{margin:0}

/* ---------- contact ---------- */
.contact-grid{display:grid;grid-template-columns:minmax(260px,380px) minmax(0,1fr);gap:6vw;align-items:start}
.contact-grid > *{min-width:0}
.type-list,.direct-list{list-style:none;display:grid;gap:10px;margin-bottom:var(--space-7)}
.type-list li{font-size:15px;color:var(--text-secondary);padding-left:20px;position:relative}
.type-list li::before{content:"✦";position:absolute;left:0;color:var(--accent);font-size:10px;top:6px}
.direct-list li{font-size:15px;color:var(--text-secondary);overflow-wrap:anywhere}
.contact-form{border:1px solid var(--card-border);border-radius:var(--radius);background:var(--card-bg);padding:clamp(24px,3vw,44px)}
.contact-form .sect-h{font-size:clamp(24px,2.4vw,34px);margin-bottom:var(--space-5)}
.field{display:flex;flex-direction:column;gap:var(--space-2);margin-bottom:var(--space-5)}
.field label{font-size:var(--text-sm);letter-spacing:var(--tracking-display);text-transform:uppercase;color:var(--text-secondary)}
.field input,.field select,.field textarea{width:100%;min-width:0;background:var(--bg);border:1px solid var(--line-soft);border-radius:var(--radius);color:var(--text-primary);font-family:var(--font-body);font-size:var(--text-base);padding:13px 14px;min-height:48px}
.field input:focus,.field select:focus,.field textarea:focus{outline:2px solid var(--accent-strong);outline-offset:0;border-color:var(--accent)}
.field input[aria-invalid="true"],.field textarea[aria-invalid="true"]{border-color:#ff625d}
.hp-field{position:absolute;left:-9999px;opacity:0;height:0;overflow:hidden}
.form-privacy{font-size:13px;color:var(--text-secondary);margin:6px 0 var(--space-4)}
.form-status{min-height:22px;font-size:14px;margin-bottom:var(--space-3)}
.form-status.ok,.form-status.err{color:var(--text-primary)}
.form-fallback{margin-top:var(--space-4);font-size:13.5px;color:var(--text-secondary)}

/* ---------- arabic ---------- */
[dir="rtl"] body,[dir="rtl"] .page-h1,[dir="rtl"] .man-body{font-family:var(--ar-face)}
.ar-h1{font-family:var(--ar-face);text-transform:none;font-size:clamp(40px,6vw,88px)}
.ar-sub{font-family:var(--ar-face);color:var(--text-secondary);font-size:20px}
.ar-copy{font-family:var(--ar-face);font-size:18px;line-height:2;max-width:60ch}
.ar-metrics{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-5)}
.ar-metrics li{font-family:var(--ar-face);border-top:1px solid var(--line);padding-top:var(--space-4);font-size:17px}
.ar-tags{list-style:none}
.ar-tags li{font-family:var(--ar-face);font-size:14px;letter-spacing:0;text-transform:none}
.ar-profile-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(260px,.75fr);gap:clamp(32px,6vw,88px);align-items:center}
.ar-profile-media{aspect-ratio:3/4;overflow:hidden;max-width:420px;justify-self:end}
.ar-profile-media img{width:100%;height:100%;object-fit:cover;object-position:50% 28%;filter:contrast(1.04) saturate(.88)}
[dir="rtl"] .hdr,[dir="rtl"] .ftr{direction:rtl}

/* ---------- footer ---------- */
.ftr{margin-top:var(--space-9);padding:0 var(--mx) var(--space-7)}
.ftr-rule{height:1px;background:var(--line);max-width:var(--container-cinematic);margin:0 auto var(--space-7)}
.ftr-grid{display:grid;grid-template-columns:1.2fr 1fr auto;gap:var(--space-7);max-width:var(--container-cinematic);margin:0 auto}
.ftr-name{font-family:var(--font-display);font-size:var(--text-base);letter-spacing:var(--tracking-wide);text-transform:uppercase;font-weight:var(--weight-semibold)}
.ftr-name .ar-sig{font-size:13px;margin-left:10px}
.ftr-line{font-size:13.5px;color:var(--text-secondary);margin-top:var(--space-2)}
.ftr-nav{display:grid;grid-template-columns:1fr 1fr;gap:10px var(--space-6);align-content:start}
.ftr-nav a,.ftr-actions a{font-size:12.5px;letter-spacing:var(--tracking-wide);text-transform:uppercase;color:var(--text-secondary);text-decoration:none;padding:4px 0;min-height:44px;display:flex;align-items:center}
.ftr-nav a:hover,.ftr-actions a:hover{color:var(--ink)}
.ftr-actions{display:grid;gap:10px;align-content:start}
.ftr-actions a{color:var(--text-primary)}
.ftr-base{display:flex;justify-content:space-between;align-items:center;max-width:var(--container-cinematic);margin:var(--space-7) auto 0;font-size:11.5px;letter-spacing:var(--tracking-wide);text-transform:uppercase;color:var(--text-secondary)}
.fin{font-family:var(--font-editorial);font-style:italic;color:var(--text-secondary);letter-spacing:.1em}

/* ---------- reveals (enhancement only) ---------- */
.js .rv{opacity:1;transform:translateY(22px);transition:transform 800ms var(--ease) var(--rv-delay,0ms)}
.js .rv.in{transform:none}
.js :is(.metric,.case-card,.rec,.post-card,.disc):nth-child(2){--rv-delay:65ms}
.js :is(.metric,.case-card,.rec,.post-card,.disc):nth-child(3){--rv-delay:130ms}
.js :is(.metric,.case-card,.rec,.post-card,.disc):nth-child(4){--rv-delay:195ms}
.js :is(.metric,.case-card,.rec,.post-card,.disc):nth-child(5){--rv-delay:260ms}
.js :is(.metric,.case-card,.rec,.post-card,.disc):nth-child(6){--rv-delay:325ms}
.js .eyebrow.rv::after{transform:scaleX(0);transition:transform 700ms var(--ease) calc(var(--rv-delay,0ms) + 180ms)}
.js .eyebrow.rv.in::after{transform:scaleX(1)}
.js .metric.rv .metric-rule{transform:scaleX(0);transform-origin:left;transition:transform 850ms var(--ease) calc(var(--rv-delay,0ms) + 80ms)}
.js .metric.rv .metric-val,.js .metric.rv .metric-label{opacity:1;transform:translateY(12px);transition:transform 750ms var(--ease)}
.js .metric.rv .metric-label{transition-delay:160ms}
.js .metric.rv.in .metric-rule{transform:scaleX(1)}
.js .metric.rv.in .metric-val,.js .metric.rv.in .metric-label{opacity:1;transform:none}
.js .case-card.rv .case-media img{transform:scale(1.08)}
.js .case-card.rv.in .case-media img{transform:scale(1)}
.js .case-card.rv.in:hover .case-media img{transform:scale(1.04)}

/* ---------- responsive ---------- */
@media(max-width:1100px){
  .metrics-grid{grid-template-columns:repeat(2,1fr)}
  .case-cards,.rec-grid,.post-grid{grid-template-columns:1fr 1fr}
  .related-grid{grid-template-columns:1fr}
  .article-layout{grid-template-columns:1fr}
  .toc{position:static;margin-bottom:var(--space-6)}
}
@media(max-width:760px){
  :root{--mx:clamp(20px,6vw,32px);--section-space:var(--space-8)}
  .hero{min-height:calc(100svh - 96px)}
  .hero-inner{padding:clamp(56px,8vh,80px) var(--mx) var(--space-4)}
  .hero-h1{font-size:clamp(40px,11vw,52px)}
  .hero-ctas,.page-actions{align-items:stretch;flex-direction:column}
  .hero-ctas .btn,.page-actions .btn{width:100%;max-width:340px}
  .page-head{padding-top:var(--space-8);padding-bottom:var(--space-5)}
  .page-head + .sect{padding-top:var(--space-5)}
  .metrics-grid,.case-cards,.rec-grid,.post-grid,.lead-list,.toolkit,.about-foot-grid,.ar-metrics,.ar-profile-grid{grid-template-columns:1fr}
  .metrics-grid,.case-cards,.rec-grid,.post-grid,.lead-list,.toolkit{gap:var(--space-5);margin-top:var(--space-6)}
  .man-grid,.disc-grid,.about-grid,.contact-grid{grid-template-columns:1fr}
  .man-film,.about-film{max-width:320px}
  .role{grid-template-columns:1fr;gap:var(--space-4);padding:var(--space-6) 0}
  .assignment{grid-template-columns:1fr 1fr}
  .ar-profile-grid{display:flex;flex-direction:column}
  .ar-profile-copy{display:contents}
  .ar-profile-copy .ar-h1{order:0}
  .ar-profile-copy .ar-sub{order:1}
  .ar-profile-media{order:2;max-width:360px;align-self:stretch;margin:var(--space-5) 0}
  .ar-profile-copy .ar-copy{order:3}
  .archive-item{flex-direction:column;align-items:flex-start}
  .archive-link{flex-direction:column;align-items:flex-start}
  .archive-thumb{width:100%}
  .closing-line-wrap{flex-direction:column;align-items:flex-start}
  .article-layout{padding-top:var(--space-7);padding-bottom:var(--space-7)}
  .article-body table{display:block;max-width:100%;overflow-x:auto}
  .article-nav{grid-template-columns:1fr}
  .contact-form{order:1;padding:var(--space-5)}
  .contact-side{order:2}
  .ftr{margin-top:var(--space-8);padding-bottom:var(--space-6)}
  .ftr-grid{grid-template-columns:1fr;gap:var(--space-6)}
  .ftr-nav{grid-template-columns:1fr 1fr}
}
@media(max-width:430px){
  :root{--mx:20px}
  .hero-h1{font-size:clamp(38px,11vw,48px)}
  .page-h1{font-size:clamp(34px,10vw,44px)}
  .article-h1{font-size:clamp(30px,8.5vw,38px)}
  .ar-h1{font-size:clamp(38px,11vw,52px)}
  .hero-ctas .btn,.page-actions .btn{max-width:none}
  .assignment{grid-template-columns:1fr;gap:var(--space-4)}
  .article-share{align-items:flex-start;flex-direction:column}
  .ftr-base{align-items:flex-start;flex-direction:column;gap:var(--space-3)}
}

/* ---------- reduced motion ---------- */
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none !important;transition:none !important}
  .js .rv{opacity:1;transform:none}
  .js .client-marquee.is-ready .client-marquee-track{animation:none}
  .hero-video,.film video{display:none}
}

/* ---------- print ---------- */
@media print{
  .hdr,.ftr,.hero-media,.film,.hero-pause{display:none}
  body{background:#fff;color:#000}
}