/*
HAZEM AL-ZUBI - ARABIC TYPOGRAPHY & IDENTITY LOCK - V3
HHS council-role pass: Creative Direction, Typography, Cultural, Experience,
Technical, Rights, Accessibility and Red Team. Hala remains final approver.
No font binaries are bundled.
*/
:root{
  --hz-basalt:#0B0A08;
  --hz-basalt-2:#15120F;
  --hz-limestone:#ECE4D7;
  --hz-limestone-2:#D7CEC0;
  --hz-ink:#17140F;
  --hz-bronze:#A7794C;
  --hz-bronze-dark:#765033;
  --hz-clay:#8D5A3E;
  --hz-patina:#1B3D46;
  --hz-mineral:#3E8599;
  --hz-ar-monument:'Noto Sans Arabic',Tahoma,Arial,sans-serif;
  --hz-ar-voice:'Noto Naskh Arabic','Noto Sans Arabic',Tahoma,Arial,sans-serif;
  --hz-ar-ui:'Noto Sans Arabic',Tahoma,Arial,sans-serif;
  --hz-latin-display:'Newsreader',Georgia,'Times New Roman',serif;
  --hz-latin-ui:'IBM Plex Sans',Arial,Helvetica,sans-serif;
  --hz-mono:'IBM Plex Mono','SFMono-Regular',Consolas,monospace;

  /* Remap the inherited website tokens to the approved identity lock. */
  --basalt:var(--hz-basalt);
  --basalt-2:var(--hz-basalt-2);
  --stone:var(--hz-limestone);
  --stone-2:var(--hz-limestone-2);
  --lime-1:var(--hz-limestone);
  --lime-2:#C4BDB0;
  --lime-3:#A29B8F;
  --lime-4:#847E71;
  --ink:var(--hz-ink);
  --bronze:var(--hz-bronze);
  --gilt:var(--hz-bronze);
  --gilt-deep:var(--hz-bronze-dark);
  --clay:var(--hz-clay);
  --patina:var(--hz-patina);
  --brand-teal:var(--hz-patina);
  --patina-bright:var(--hz-mineral);
  --accent-teal:var(--hz-mineral);
  --display:var(--hz-latin-display);
  --serif:var(--hz-latin-display);
  --ui:var(--hz-latin-ui);
  --sans:var(--hz-latin-ui);
  --mono:var(--hz-mono);
  --arabic:var(--hz-ar-monument);
  --arabic-ui:var(--hz-ar-ui);
  --naskh:var(--hz-ar-voice);
}
html{font-synthesis:none;text-rendering:optimizeLegibility}
::selection{background:var(--hz-bronze);color:var(--hz-basalt)}
:focus-visible{outline-color:var(--hz-mineral)!important}

/* Official mark: flat material colour only. */
.brand img,.hero-brand img,.payoff-logo,.footer-logo-official,.tb-logo,.tb-mark,
.seal-open,.foot-seal,.wm{filter:none!important}
.hero-brand{width:clamp(400px,32vw,520px)}
.brand img{width:42px}
.payoff-logo{width:clamp(320px,29vw,450px)}
.footer-logo-official{width:clamp(250px,25vw,370px)}
.topbar .tb-logo{width:clamp(180px,18vw,260px);height:auto}
.topbar .w{min-height:76px}

/* Arabic system. Structure is semi-condensed sans; human speech is Naskh; UI is sans. */
html[dir='rtl'] body{
  font-family:var(--hz-ar-ui)!important;
  font-size:20px;
  line-height:1.82;
  font-weight:400;
  letter-spacing:normal!important;
}
html[dir='rtl'] p,
html[dir='rtl'] .body-large,
html[dir='rtl'] .body-copy,
html[dir='rtl'] .sentence-support,
html[dir='rtl'] .proof-item span,
html[dir='rtl'] .material p,
html[dir='rtl'] .room-copy small,
html[dir='rtl'] .record-panel,
html[dir='rtl'] .ain-uncertain,
html[dir='rtl'] .ain-fact p,
html[dir='rtl'] .ain-evidence-item p,
html[dir='rtl'] .lede,
html[dir='rtl'] .row .t,
html[dir='rtl'] .prow .txt,
html[dir='rtl'] .ctline,
html[dir='rtl'] .room-line{
  font-family:var(--hz-ar-ui)!important;
  font-weight:400;
  line-height:1.88;
  letter-spacing:normal!important;
}
html[dir='rtl'] h1,
html[dir='rtl'] h2,
html[dir='rtl'] h3,
html[dir='rtl'] .display,
html[dir='rtl'] .display-xl,
html[dir='rtl'] .display-lg,
html[dir='rtl'] .display-md,
html[dir='rtl'] .display-sm,
html[dir='rtl'] .weight-copy h1,
html[dir='rtl'] .evidence-frame strong,
html[dir='rtl'] .name-copy h2,
html[dir='rtl'] .name-copy .arabic-name,
html[dir='rtl'] .ground-name,
html[dir='rtl'] .material .dual,
html[dir='rtl'] .rupture-copy .display-md,
html[dir='rtl'] .room-copy b,
html[dir='rtl'] .room-copy h3,
html[dir='rtl'] .room-ar,
html[dir='rtl'] .rules li,
html[dir='rtl'] .payoff-copy p,
html[dir='rtl'] .intent-button,
html[dir='rtl'] .footer-name,
html[dir='rtl'] .pagehead h1,
html[dir='rtl'] .pagehead h2,
html[dir='rtl'] .pagehead h3,
html[dir='rtl'] .mv h3,
html[dir='rtl'] .ain-page-hero h1,
html[dir='rtl'] .ain-open-question,
html[dir='rtl'] .ain-page-open,
html[dir='rtl'] .life-beautiful,
html[dir='rtl'] main h2.r,
html[dir='rtl'] main h3.r{
  font-family:var(--hz-ar-monument)!important;
  font-weight:700!important;
  font-stretch:75%;
  font-variation-settings:'wdth' 75;
  letter-spacing:normal!important;
  text-transform:none!important;
}
html[dir='rtl'] .quote-card blockquote,
html[dir='rtl'] .voice-item blockquote,
html[dir='rtl'] .ain-hazem-quote blockquote,
html[dir='rtl'] .turn-copy .then,
html[dir='rtl'] .turn-copy .now,
html[dir='rtl'] .sea-lines,
html[dir='rtl'] .quote,
html[dir='rtl'] .thesis-line{
  font-family:var(--hz-ar-voice)!important;
  font-weight:600!important;
  letter-spacing:normal!important;
}
html[dir='rtl'] nav,
html[dir='rtl'] .main-nav a,
html[dir='rtl'] .language-nav a,
html[dir='rtl'] .eyebrow,
html[dir='rtl'] .meta,
html[dir='rtl'] .role,
html[dir='rtl'] .side-note,
html[dir='rtl'] .text-link,
html[dir='rtl'] .pill-link,
html[dir='rtl'] .field label,
html[dir='rtl'] .form-submit,
html[dir='rtl'] .form-note,
html[dir='rtl'] .contact-card,
html[dir='rtl'] .footer-fine,
html[dir='rtl'] .footer-credit,
html[dir='rtl'] .tb-links,
html[dir='rtl'] .k,
html[dir='rtl'] .btn,
html[dir='rtl'] .seedeeper,
html[dir='rtl'] figcaption,
html[dir='rtl'] .genlabel,
html[dir='rtl'] .pending,
html[dir='rtl'] .ain-source-line,
html[dir='rtl'] .ain-source-panel,
html[dir='rtl'] .ain-fact,
html[dir='rtl'] .ain-evidence-item,
html[dir='rtl'] .ain-evidence-link,
html[dir='rtl'] .room-line{
  font-family:var(--hz-ar-ui)!important;
  letter-spacing:normal!important;
  text-transform:none!important;
}
html[dir='rtl'] [lang='en'],
html[dir='rtl'] [dir='ltr']:not(time):not(.scene-count):not(.impossible-counter){
  font-family:var(--hz-latin-display);
  letter-spacing:normal;
}
html[dir='rtl'] time,
html[dir='rtl'] .scene-count,
html[dir='rtl'] .strata-row time,
html[dir='rtl'] .rules li:before,
html[dir='rtl'] .row .y,
html[dir='rtl'] .quote .s,
html[dir='rtl'] .prow .src,
html[dir='rtl'] .false-year,
html[dir='rtl'] .ain-age strong,
html[dir='rtl'] .ain-page-age{
  font-family:var(--hz-mono)!important;
  direction:ltr;
  unicode-bidi:isolate;
}

/* Readability floor. */
html[dir='rtl'] .main-nav a{font-size:15px!important;font-weight:600;padding:10px 0}
html[dir='rtl'] .language-nav a{font-size:13px!important;font-weight:600}
html[dir='rtl'] .eyebrow{font-size:15px!important;line-height:1.55;margin-bottom:28px;font-weight:600}
html[dir='rtl'] .meta{font-size:15px!important;line-height:1.85}
html[dir='rtl'] .weight-copy .side-note{font-size:15px!important;line-height:1.95;letter-spacing:normal!important;text-transform:none!important;width:min(250px,20vw)}
html[dir='rtl'] .text-link,
html[dir='rtl'] .pill-link,
html[dir='rtl'] .btn,
html[dir='rtl'] .seedeeper a,
html[dir='rtl'] .form-submit{font-size:15px!important;font-weight:600;letter-spacing:normal!important;text-transform:none!important}
html[dir='rtl'] figcaption{font-size:14px!important;line-height:1.75}
html[dir='rtl'] .scene-count,
html[dir='rtl'] .scroll-cue,
html[dir='rtl'] .impossible-counter{font-size:12px!important}
html[dir='rtl'] .proof-item span,
html[dir='rtl'] .strata-row span,
html[dir='rtl'] .room-copy small,
html[dir='rtl'] .ain-source-line,
html[dir='rtl'] .ain-source-panel,
html[dir='rtl'] .ain-evidence-item span,
html[dir='rtl'] .form-note,
html[dir='rtl'] .footer-fine{font-size:15px!important;line-height:1.85}
html[dir='rtl'] .topbar .tb-links a{font-size:15px!important;font-weight:600;letter-spacing:normal!important;text-transform:none!important}

/* Locked Arabic hierarchy. */
html[dir='rtl'] .weight-copy h1{font-size:clamp(68px,5.9vw,94px)!important;line-height:1.38!important;max-width:9.8ch!important;text-wrap:balance}
html[dir='rtl'] .display{font-size:clamp(68px,7.7vw,112px)!important;line-height:1.36!important;max-width:15ch}
html[dir='rtl'] .display-md{font-size:clamp(54px,5.7vw,84px)!important;line-height:1.42!important;max-width:19ch}
html[dir='rtl'] .display-sm{font-size:clamp(40px,4.25vw,62px)!important;line-height:1.45!important;max-width:22ch}
html[dir='rtl'] .body-large{font-size:clamp(21px,1.75vw,27px)!important;line-height:1.90!important;max-width:39ch!important}
html[dir='rtl'] .body-copy,
html[dir='rtl'] .pagehead .lede,
html[dir='rtl'] .lede,
html[dir='rtl'] .row .t,
html[dir='rtl'] .prow .txt,
html[dir='rtl'] .ctline{font-size:clamp(19px,1.42vw,23px)!important;line-height:1.92!important}
html[dir='rtl'] .pagehead h1{font-size:clamp(62px,7vw,98px)!important;line-height:1.40!important;max-width:15ch!important}
html[dir='rtl'] .pagehead .ar-h{font-size:24px!important;line-height:1.75;font-weight:600}
html[dir='rtl'] main h2.r{font-size:clamp(44px,5.1vw,74px)!important;line-height:1.44!important}
html[dir='rtl'] main h3.r{font-size:clamp(34px,4vw,54px)!important;line-height:1.48!important}
html[dir='rtl'] .name-copy h2{font-size:clamp(76px,8.5vw,124px)!important;line-height:1.32!important}
html[dir='rtl'] .ground .ground-name{font-size:clamp(84px,10.5vw,154px)!important;line-height:1.20!important}
html[dir='rtl'] .quote-card blockquote,
html[dir='rtl'] .voice-item blockquote,
html[dir='rtl'] .ain-hazem-quote blockquote{font-size:clamp(38px,4.3vw,62px)!important;line-height:1.55!important}
html[dir='rtl'] .turn-copy .then{font-size:clamp(34px,3.6vw,52px)!important;line-height:1.55!important}
html[dir='rtl'] .turn-copy .now{font-size:clamp(56px,6.8vw,98px)!important;line-height:1.42!important}
html[dir='rtl'] .sea-lines{font-size:clamp(58px,7.4vw,108px)!important;line-height:1.46!important}
html[dir='rtl'] .room-copy b{font-size:clamp(38px,3.6vw,54px)!important;line-height:1.42!important}
html[dir='rtl'] .material .dual{font-size:clamp(40px,4.1vw,62px)!important;line-height:1.45!important}
html[dir='rtl'] .material .dual span[lang='en']{font-family:var(--hz-latin-display)!important;font-size:.46em!important}
html[dir='rtl'] .rules li{font-size:clamp(39px,4.8vw,66px)!important;line-height:1.55!important}
html[dir='rtl'] .payoff-copy p{font-size:clamp(70px,8vw,116px)!important;line-height:1.42!important}
html[dir='rtl'] .intent-button{font-size:clamp(29px,3.1vw,43px)!important;line-height:1.5!important}
html[dir='rtl'] .mv h3{font-size:clamp(36px,4.1vw,54px)!important;line-height:1.48!important;max-width:20ch}
html[dir='rtl'] .room-ar{font-size:clamp(34px,3.4vw,48px)!important;line-height:1.48!important}
html[dir='rtl'] .room-en{font-size:19px!important;line-height:1.45!important;color:var(--hz-bronze)}
html[dir='rtl'] .room-line{font-size:17px!important;line-height:1.85!important}
html[dir='rtl'] .w{max-width:1280px;padding-left:clamp(24px,4.5vw,72px);padding-right:clamp(24px,4.5vw,72px)}
html[dir='rtl'] .pagehead{padding-top:88px}
html[dir='rtl'] .n{max-width:38em}
html[dir='rtl'] .ain-page-hero .body-large,
html[dir='rtl'] .ain-page-hero .ain-source-line{color:#D7CEC0!important;text-shadow:0 1px 18px rgba(0,0,0,.38)}

/* Colour roles. */
html[dir='rtl'] .eyebrow,
html[dir='rtl'] .scene-count,
html[dir='rtl'] .strata-row time,
html[dir='rtl'] .proof-item b,
html[dir='rtl'] .lineage-chain i,
html[dir='rtl'] .quote-card cite,
html[dir='rtl'] .voice-item cite,
html[dir='rtl'] .room-copy span,
html[dir='rtl'] .footer-name span,
html[dir='rtl'] .ain-age span,
html[dir='rtl'] .ain-fact span,
html[dir='rtl'] .ain-evidence-item span{color:var(--hz-bronze)}
.scene-ivory .eyebrow,.scene-ivory .life-beautiful,.pagehead .ar-h,.room-ar,.ain-answer-line,.ain-open-question,.ain-page-open{color:var(--hz-bronze-dark)}

@media(max-width:1040px){
  .topbar .tb-logo{width:190px}
  html[dir='rtl'] .main-nav a{font-size:14px!important}
  html[dir='rtl'] .weight-copy .side-note{width:220px}
}
@media(max-width:760px){
  .hero-brand{width:clamp(150px,52vw,210px);top:82px}
  .brand img{width:40px}
  .footer-logo-official{width:min(76vw,320px)}
  .topbar .tb-logo{width:154px}
  .topbar .w{min-height:66px}
  html[dir='rtl'] body{font-size:18.5px;line-height:1.84}
  html[dir='rtl'] .main-nav a,
  html[dir='rtl'] .topbar .tb-links a{font-size:18px!important;line-height:1.55}
  html[dir='rtl'] .language-nav a{font-size:14px!important}
  html[dir='rtl'] .eyebrow{font-size:16px!important;line-height:1.55;margin-bottom:24px}
  html[dir='rtl'] .meta{font-size:16px!important;line-height:1.8}
  html[dir='rtl'] .weight-copy{padding-top:245px!important;padding-bottom:120px!important}
  html[dir='rtl'] .weight-copy h1{font-size:clamp(47px,12.4vw,60px)!important;line-height:1.48!important;max-width:7.8ch!important}
  html[dir='rtl'] .weight-copy .side-note{font-size:16px!important;line-height:1.9!important;width:min(190px,52vw)!important}
  html[dir='rtl'] .display{font-size:clamp(48px,13vw,64px)!important;line-height:1.46!important;max-width:100%!important}
  html[dir='rtl'] .display-md{font-size:clamp(40px,10.8vw,54px)!important;line-height:1.52!important;max-width:100%!important}
  html[dir='rtl'] .display-sm{font-size:clamp(34px,9.2vw,46px)!important;line-height:1.55!important;max-width:100%!important}
  html[dir='rtl'] .body-large{font-size:19px!important;line-height:1.95!important;max-width:100%!important}
  html[dir='rtl'] .body-copy,
  html[dir='rtl'] .pagehead .lede,
  html[dir='rtl'] .lede,
  html[dir='rtl'] .row .t,
  html[dir='rtl'] .prow .txt,
  html[dir='rtl'] .ctline{font-size:18px!important;line-height:1.95!important;max-width:100%!important}
  html[dir='rtl'] .pagehead{padding-top:64px}
  html[dir='rtl'] .pagehead h1{font-size:clamp(46px,12vw,62px)!important;line-height:1.48!important;max-width:100%!important}
  html[dir='rtl'] .pagehead .ar-h{font-size:20px!important}
  html[dir='rtl'] main h2.r{font-size:clamp(36px,10.4vw,48px)!important;line-height:1.52!important}
  html[dir='rtl'] main h3.r{font-size:clamp(31px,8.8vw,42px)!important;line-height:1.54!important}
  html[dir='rtl'] .name-copy h2{font-size:clamp(58px,16vw,78px)!important;line-height:1.40!important}
  html[dir='rtl'] .ground .ground-name{font-size:clamp(60px,16vw,82px)!important;line-height:1.32!important}
  html[dir='rtl'] .quote-card blockquote,
  html[dir='rtl'] .voice-item blockquote,
  html[dir='rtl'] .ain-hazem-quote blockquote{font-size:clamp(34px,9.7vw,46px)!important;line-height:1.62!important}
  html[dir='rtl'] .turn-copy .then{font-size:clamp(30px,8.4vw,40px)!important;line-height:1.62!important}
  html[dir='rtl'] .turn-copy .now{font-size:clamp(48px,13vw,66px)!important;line-height:1.52!important}
  html[dir='rtl'] .sea-lines{font-size:clamp(46px,12vw,62px)!important;line-height:1.58!important}
  html[dir='rtl'] .rules li{font-size:clamp(34px,9.7vw,48px)!important;line-height:1.62!important}
  html[dir='rtl'] .payoff-copy p{font-size:clamp(52px,14vw,70px)!important;line-height:1.50!important}
  html[dir='rtl'] .intent-button{font-size:27px!important;line-height:1.55!important}
  html[dir='rtl'] .mv h3{font-size:clamp(31px,8.7vw,42px)!important;line-height:1.55!important}
  html[dir='rtl'] .room-ar{font-size:34px!important}
  html[dir='rtl'] .room-en{font-size:18px!important}
  html[dir='rtl'] .room-line{font-size:17px!important}
  html[dir='rtl'] .proof-item span,
  html[dir='rtl'] .strata-row span,
  html[dir='rtl'] .room-copy small,
  html[dir='rtl'] .ain-source-line,
  html[dir='rtl'] .ain-source-panel,
  html[dir='rtl'] .form-note,
  html[dir='rtl'] .footer-fine,
  html[dir='rtl'] figcaption{font-size:15px!important}
  html[dir='rtl'] .hero-picture{left:-34vw!important;right:auto!important;width:78vw!important}
}
@media(max-width:430px){
  html[dir='rtl'] .hero-picture{left:-31vw!important;width:76vw!important}
  html[dir='rtl'] .weight-copy h1{font-size:clamp(48px,13vw,58px)!important;max-width:7.3ch!important;line-height:1.48!important}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important}}

/* ============================================================
   V9 · LAUNCH LOCK (04 Sep 2026) — approved Identity Lock p.06/p.09
   ============================================================ */
/* Logo placement */
.footer-logo-official{width:clamp(220px,22vw,300px)!important}
.topbar .tb-logo{width:clamp(220px,18vw,300px)!important}
.ain-page .brand,.ain-page .brand img{width:44px!important}
@media(max-width:1040px){
  .topbar .tb-logo{width:44px!important}
  html[dir='rtl'] .main-nav a{font-size:15px!important}
}
@media(max-width:760px){
  .topbar .tb-logo{width:40px!important}
  .footer-logo-official{width:min(72vw,300px)!important;min-width:220px}
  html[dir='rtl'] .language-nav a{font-size:15px!important}
  html[dir='rtl'] figcaption{font-size:15px!important}
}
/* Type floors */
html[dir='rtl'] .language-nav a{font-size:15px!important}
html[dir='rtl'] figcaption{font-size:15px!important}
html[dir='rtl'] .impossible-counter{font-size:15px!important}

/* Five-name lineage monument */
.names-monument-five span{font-size:clamp(40px,7.2vw,116px);line-height:.86}
@media(max-width:760px){.names-monument-five span{font-size:13vw;line-height:.96}}
html[dir='rtl'] .names-monument-five span{font-family:var(--hz-latin-display)!important;direction:ltr;text-align:right}

/* Voice quotations (Baghdad, watch, close) */
.baghdad-voice,.watch-voice,.payoff-voice{margin:44px 0 0;padding:0;border:0;max-width:34ch}
.baghdad-voice p,.watch-voice p,.payoff-voice p{margin:0;font-family:var(--hz-latin-display);font-style:italic;font-weight:300;font-size:clamp(24px,2.4vw,36px);line-height:1.28;letter-spacing:-.01em;color:var(--hz-limestone)}
.baghdad-voice cite,.watch-voice cite,.payoff-voice cite{display:block;margin-top:18px;font-family:var(--hz-latin-ui);font-style:normal;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--hz-bronze)}
html[dir='rtl'] .baghdad-voice p,html[dir='rtl'] .watch-voice p,html[dir='rtl'] .payoff-voice p{font-family:var(--hz-ar-voice)!important;font-style:normal;font-weight:600;font-size:clamp(26px,2.6vw,40px);line-height:1.62;letter-spacing:normal}
html[dir='rtl'] .baghdad-voice cite,html[dir='rtl'] .watch-voice cite,html[dir='rtl'] .payoff-voice cite{font-family:var(--hz-ar-monument)!important;font-size:15px;letter-spacing:normal;text-transform:none}
.payoff-voice{margin:0 0 40px;max-width:30ch}
.payoff-voice p{font-size:clamp(22px,2.1vw,32px);color:rgba(236,228,215,.86)}
@media(max-width:760px){.payoff-voice{margin-bottom:28px}.payoff-voice p{font-size:20px}}

/* 09b · The watch */
.watch{position:relative;min-height:100svh;display:grid;align-items:center;background:var(--hz-basalt);overflow:hidden;padding:0!important}
.watch-figure{position:absolute;inset:0;margin:0}
.watch-figure picture,.watch-figure img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
.watch-figure::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(11,10,8,.88) 0%,rgba(11,10,8,.62) 42%,rgba(11,10,8,.06) 72%)}
html[dir='rtl'] .watch-figure::after{background:linear-gradient(90deg,rgba(11,10,8,.88) 0%,rgba(11,10,8,.62) 42%,rgba(11,10,8,.06) 72%)}
.watch-figure figcaption{position:absolute;right:var(--safe,5vw);bottom:22px;z-index:2;margin:0;font-family:var(--hz-latin-ui);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:rgba(236,228,215,.55)}
html[dir='rtl'] .watch-figure figcaption{font-family:var(--hz-ar-monument)!important;font-size:15px!important;letter-spacing:normal;text-transform:none;right:auto;left:var(--safe,5vw)}
.watch-copy{position:relative;z-index:2;width:min(1380px,100%);margin:0 auto;padding:120px var(--safe,5vw)}
.watch-copy .display-md{max-width:14ch}
.watch-copy .body-large{max-width:38ch}
.watch-caption{margin-top:38px;color:var(--hz-bronze)}
@media(min-width:761px){html[dir='rtl'] .watch-copy{padding:120px calc(var(--safe,5vw) + 40%) 120px var(--safe,5vw);text-align:right}}
@media(max-width:760px){
  .watch{align-items:start}
  .watch-figure::after{background:linear-gradient(180deg,rgba(11,10,8,.90) 0%,rgba(11,10,8,.66) 46%,rgba(11,10,8,.02) 72%)}
  .watch-copy{padding:96px var(--safe,5vw) 60vh}
  .watch-figure figcaption{bottom:14px}
}

/* ============================================================
   V12 · Studio credit — HHS PRIMARY_STACK, reverse (HHS Ivory), clear space X = ½ cap height
   ============================================================ */
.hhs-credit{display:inline-flex;flex-direction:column;align-items:flex-end;gap:14px;text-decoration:none;color:inherit;padding:18px 0 4px}
.hhs-credit .hhs-stack{display:block;width:clamp(160px,13vw,200px);height:auto;opacity:.92;transition:opacity .5s ease;animation:none!important}
.hhs-credit:hover .hhs-stack{opacity:1}
.hhs-credit .hhs-credit-line{font-family:var(--hz-latin-ui);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--hz-bronze);line-height:1.6}
html[dir='rtl'] .hhs-credit{align-items:flex-start;text-align:left}
html[dir='rtl'] .hhs-credit .hhs-credit-line{font-family:var(--hz-ar-monument)!important;font-size:15px;letter-spacing:normal;text-transform:none}
.footer-credit{text-align:right}
html[dir='rtl'] .footer-credit{text-align:left}
.colophon .hhs-credit{align-items:center;text-align:center}
.colophon .hhs-credit .hhs-stack{width:clamp(160px,16vw,220px)}
.colophon .hhs-credit .hhs-credit-line{color:var(--hz-bronze)}
@media(max-width:760px){.hhs-credit .hhs-stack,.colophon .hhs-credit .hhs-stack{width:160px}}

/* ============================================================
   V14 · Client request (Hazem, 4 Sep 2026): the name next to the seal in every header
   ============================================================ */
.site-header .brand,.site-header .brand img{width:clamp(220px,18vw,300px)!important;height:auto;animation:none!important}
.ain-page .brand,.ain-page .brand img{width:clamp(220px,18vw,300px)!important}
.topbar .tb-logo{width:clamp(220px,18vw,300px)!important;height:auto}
@media(max-width:1040px){.topbar .tb-logo{width:200px!important}.site-header .brand,.site-header .brand img,.ain-page .brand,.ain-page .brand img{width:200px!important}}
@media(max-width:760px){.topbar .tb-logo,.site-header .brand,.site-header .brand img,.ain-page .brand,.ain-page .brand img{width:168px!important}.header-inner{gap:14px}}

/* The invitation is a document: shown whole, never cropped */
.hall-gallery figure:first-child{background:#0B0A08}
.hall-gallery figure:first-child img{object-fit:contain!important;object-position:center!important;padding:3%;filter:none!important;box-sizing:border-box}
figure:has(> img[src*="azzawi-invitation"]) img,figure:has(> img[srcset*="azzawi-invitation"]) img{object-fit:contain!important;object-position:center!important;background:#0B0A08}
figure:has(> img[src*="azzawi-invitation"]),figure:has(> img[srcset*="azzawi-invitation"]){background:#0B0A08;aspect-ratio:auto}

/* ============================================================
   V15 · Narrow documentary photographs are never stretched: shown at their true proportion
   over a blurred field of the same photograph (the field is the photo itself, not a generated texture)
   ============================================================ */
.evidence-frame.ef-narrow::before{content:"";position:absolute;inset:-8%;background:url('../img/head-figures.jpg') center/cover no-repeat;filter:blur(34px) saturate(.6) brightness(.32);transform:scale(1.08)}
.evidence-frame.ef-narrow img{object-fit:contain!important;object-position:center!important;filter:saturate(.85) contrast(1.05) brightness(.9)!important;padding:4vh 0;box-sizing:border-box}
.evidence-frame.ef-narrow figcaption{position:relative;z-index:2}
@media(max-width:760px){.evidence-frame.ef-narrow img{padding:2vh 0}}

/* ============================================================
   V16 · Scene 11: the number 9,000 is never clipped (RTL and LTR, every width)
   ============================================================ */
.ain-age{overflow:visible!important}
.ain-age strong{font-size:clamp(96px,11.2vw,200px)!important;letter-spacing:-.045em!important;line-height:.8!important;white-space:nowrap;max-width:100%}
html[dir='rtl'] .ain-age strong{direction:ltr;unicode-bidi:isolate;text-align:right;font-family:var(--hz-latin-display)!important;letter-spacing:-.03em!important}
@media(max-width:980px){.ain-age strong{font-size:clamp(96px,20vw,190px)!important}}
@media(max-width:760px){.ain-age strong{font-size:clamp(88px,24vw,140px)!important}}

/* ============================================================
   V16 · Scene 15 under "reduce motion" (Windows: Animation effects off):
   the six layers still appear, one per step, without transitions — never an empty black stage
   ============================================================ */
@media(prefers-reduced-motion:reduce){
  .impossible-layer{display:block!important;opacity:0;clip-path:none!important;transition:none!important}
  .impossible-layer.active{opacity:1}
  .impossible-steps{display:block!important}
  .impossible-scroll{height:auto!important}
  .impossible-layer img{filter:saturate(.85) contrast(1.06) brightness(.8)}
}

/* ============================================================
   V17 · Footer hierarchy: Hazem's mark leads; the studio signature is a credit, at its minimum
   ============================================================ */
.foot-seal.foot-lockup{width:clamp(240px,22vw,300px)!important;height:auto;animation:none!important;opacity:1}
.footer-logo-official{width:clamp(240px,22vw,300px)!important}
.hhs-credit .hhs-stack,.colophon .hhs-credit .hhs-stack{width:150px!important;opacity:.78}
.hhs-credit:hover .hhs-stack{opacity:1}
.colophon{margin-top:44px!important}
.colophon .role{margin-bottom:12px!important}
.hhs-credit .hhs-credit-line{font-size:11px}
html[dir='rtl'] .hhs-credit .hhs-credit-line{font-size:14px}
@media(max-width:760px){.foot-seal.foot-lockup,.footer-logo-official{width:220px!important}.hhs-credit .hhs-stack,.colophon .hhs-credit .hhs-stack{width:150px!important}}

/* ============================================================
   V18 · Language switcher readable on every page (Latin pages were 10 px, muted)
   ============================================================ */
.language-nav a{font-size:14px!important;letter-spacing:.14em;color:rgba(236,228,215,.72)!important;padding:8px 2px}
.language-nav a[aria-current="page"]{color:var(--hz-limestone)!important;font-weight:500}
.language-nav a:hover{color:var(--hz-limestone)!important}
.language-nav{gap:18px}
.langswitch{font-size:13px!important;letter-spacing:.12em;color:rgba(236,228,215,.78)!important}
.langswitch.now{color:var(--hz-limestone)!important;font-weight:600}
html[dir='rtl'] .language-nav a,html[dir='rtl'] .langswitch{font-size:15px!important}
@media(max-width:760px){.language-nav a{font-size:15px!important}.langswitch{font-size:14px!important}}

/* V19 · studio credit: a little smaller than V16, not the floor — 176 px desktop, 150 px phone */
.hhs-credit .hhs-stack,.colophon .hhs-credit .hhs-stack{width:176px!important;opacity:.82}
@media(max-width:760px){.hhs-credit .hhs-stack,.colophon .hhs-credit .hhs-stack{width:150px!important}}

/* ============================================================
   V20 · Scene 05: his name as it is written in his own mark — the bronze lockup, not a typeset heading
   ============================================================ */
.name-copy .name-mark{display:block;width:min(100%,560px);height:auto;margin:6px 0 0}
.name-copy .arabic-name{font-family:var(--hz-ar-monument)!important;font-weight:700;font-stretch:75%;font-size:clamp(34px,3.4vw,52px)!important;line-height:1.5;color:var(--hz-bronze);margin:26px 0 0!important;text-align:left;direction:rtl}
@media(max-width:760px){.name-copy .name-mark{width:min(100%,340px)}.name-copy .arabic-name{font-size:32px!important}}

/* V21 · Scene 15 never black: the first layer is visible by default, without any script */
.impossible-layer:first-child{opacity:1;clip-path:circle(80% at var(--hole-x,50%) var(--hole-y,50%))}
.impossible-layer.active{opacity:1;clip-path:circle(80% at var(--hole-x,50%) var(--hole-y,50%))}
.impossible-layer.active ~ .impossible-layer:first-child{opacity:0}
.impossible-stage:has(.impossible-layer.active) .impossible-layer:first-child:not(.active){opacity:0;clip-path:circle(12% at var(--hole-x,50%) var(--hole-y,50%))}
@media(max-width:760px){.impossible-layer:first-child{opacity:1}}
/* V21 · THE ACTUAL CAUSE: .scene{overflow:hidden} on the section defeated position:sticky on the stage,
   so the six images scrolled away and the six steps scrolled over an empty black section.
   overflow:clip clips the same way but lets the stage stick. */
.scene.impossible{overflow:clip!important}
.impossible-scroll{overflow:visible}

/* ============================================================
   V22 · Scene 15 rebuilt as six plain full-height frames. No sticky, no clip-path, no script:
   each image with its line, one after the other. Labels at readable size.
   ============================================================ */
.impossible-stack{margin:0 calc(var(--safe,5vw) * -1);background:#060606}
.impossible-frame{position:relative;min-height:100svh;margin:0;overflow:hidden;background:#060606}
.impossible-frame img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:var(--position,center);filter:saturate(.82) contrast(1.06) brightness(.78)}
.impossible-frame-last img{object-fit:contain;filter:contrast(1.06) brightness(.92)}
.impossible-frame::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.12),transparent 40%,rgba(0,0,0,.6));pointer-events:none}
.impossible-frame figcaption{position:absolute;left:var(--safe,5vw);right:var(--safe,5vw);bottom:9vh;z-index:2;display:flex;flex-direction:column;gap:12px;color:var(--hz-limestone)}
.impossible-frame figcaption span:last-child{font-family:var(--hz-latin-display);font-weight:300;font-size:clamp(34px,4.2vw,64px);line-height:1.05;letter-spacing:-.02em;max-width:18ch;text-shadow:0 2px 24px rgba(0,0,0,.6)}
.impossible-frame .impossible-num{font-family:var(--hz-mono);font-size:13px;letter-spacing:.16em;color:var(--hz-bronze)}
html[dir='rtl'] .impossible-frame figcaption{text-align:right}
html[dir='rtl'] .impossible-frame figcaption span:last-child{font-family:var(--hz-ar-monument)!important;font-weight:700;font-stretch:75%;font-size:clamp(34px,4vw,60px);line-height:1.35;letter-spacing:normal}
html[dir='rtl'] .impossible-frame .impossible-num{font-size:14px;direction:ltr;text-align:right}
@media(max-width:760px){.impossible-frame{min-height:84svh}.impossible-frame figcaption{bottom:7vh}.impossible-frame figcaption span:last-child{font-size:34px}}

/* V23 · Scene 16: the disc sits exactly in its circular frame (the photograph has the disc at 55.6% / 42.2%, 72% wide) */
.disc img{transform:translate(-5.6%,7.8%) scale(1.42);transform-origin:55.6% 42.2%;object-fit:cover}
