/* ============================================================================
   ANAKOTA — production stylesheet
   Tokens → base → motion → components → responsive
   Radius 0 · no shadows · no glass · transform+opacity only
   ========================================================================== */

/* ---------- TOKENS ---------- */
:root{
  --cream:#F2ECE0; --cream-2:#EAE2D3; --paper:#FBF7EF;
  --ink:#1A1712;   --soft:#4A4238;
  --clay:#B4552F;  --clay-dk:#9E4826;      /* AA-safe for <14px */
  --fig:#3E4A32;   --brass:#A8813F;
  --char:#0A0908;  --ember:#D4521E;
  --rule:rgba(26,23,18,.15); --rule-2:rgba(26,23,18,.30);

  --serif:'Bodoni Moda',Georgia,serif;
  --ar:'Amiri',serif;
  --sans:'Jost',system-ui,sans-serif;
  --mono:'Space Mono',ui-monospace,monospace;

  --s-1:4px;--s-2:8px;--s-3:12px;--s-4:16px;--s-5:24px;
  --s-6:32px;--s-7:48px;--s-8:64px;--s-9:96px;

  --pad:clamp(16px,3.6vw,54px);
  --section:clamp(48px,7vw,104px);
  --radius:0;

  --e-out:cubic-bezier(.19,.86,.28,1);
  --e-in:cubic-bezier(.55,0,.78,.35);
  --t-exit:250ms;--t-fast:400ms;--t-base:950ms;--t-slow:1600ms;
}


/* Arabic never inherits Latin tracking, casing or font stack.
   Naskh letterforms join — tracking severs the joins. */
[lang="ar"]{font-family:var(--ar);letter-spacing:0!important;text-transform:none!important;
 font-size:1.12em;line-height:1.5}

/* ---------- RESET / BASE ---------- */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  background:var(--cream);color:var(--ink);
  font-family:var(--sans);font-weight:300;font-size:14.5px;line-height:2.05;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
  overflow-x:hidden;touch-action:manipulation;
}
img,video{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
::selection{background:var(--clay);color:var(--cream)}
:focus-visible{outline:2px solid var(--clay);outline-offset:2px}
:is(h1,h2,h3,h4){font-weight:400;text-wrap:balance}

.skip{position:absolute;inset-inline-start:-9999px;top:0;z-index:999;
 background:var(--ink);color:var(--cream);padding:14px 22px;font-family:var(--mono);
 font-size:11px;letter-spacing:.16em;text-transform:uppercase}
.skip:focus{inset-inline-start:0}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}

.paper-grain{position:fixed;inset:0;pointer-events:none;z-index:9990;opacity:.05;mix-blend-mode:multiply;
 background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='4'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)'/%3E%3C/svg%3E")}

/* ---------- MOTION — five ideas, transform+opacity only ---------- */
[data-reveal]{will-change:transform,opacity}
[data-reveal][data-in]{will-change:auto}

[data-reveal="rise"]{opacity:0;transform:translateY(18px);
 transition:opacity var(--t-base) var(--e-out),transform var(--t-base) var(--e-out)}
[data-reveal="rise"][data-in]{opacity:1;transform:none}

[data-reveal="set"] .ln{display:block;overflow:hidden}
[data-reveal="set"] .ln>i{display:block;font-style:inherit;transform:translateY(106%);
 transition:transform 1050ms var(--e-out)}
[data-reveal="set"][data-in] .ln>i{transform:none}
[data-reveal="set"][data-in] .ln:nth-child(2)>i{transition-delay:70ms}
[data-reveal="set"][data-in] .ln:nth-child(3)>i{transition-delay:140ms}

[data-reveal="settle"] img{transform:scale(1.03);transition:transform var(--t-slow) var(--e-out)}
[data-reveal="settle"][data-in] img{transform:none}

[data-reveal="draw"]{transform:scaleX(0);transform-origin:left;
 transition:transform 900ms var(--e-out)}
[data-reveal="draw"][data-in]{transform:scaleX(1)}

[data-delay="1"]{transition-delay:100ms}
[data-delay="2"]{transition-delay:200ms}
[data-delay="3"]{transition-delay:300ms}
[data-reveal="set"][data-delay="2"][data-in] .ln>i{transition-delay:200ms}

/* ---------- LOADER ---------- */
#loader{position:fixed;inset:0;z-index:9995;background:var(--cream);display:grid;place-items:center;
 transition:opacity 700ms var(--e-out),visibility 700ms}
#loader[data-gone]{opacity:0;visibility:hidden}
#loader .lw{text-align:center}
#loader .ln1{font-family:var(--serif);font-size:15px;letter-spacing:.5em;padding-inline-start:.5em;
 opacity:0;animation:fadeIn 900ms var(--e-out) 400ms forwards}
#loader .ln2{font-family:var(--ar);font-size:13px;color:var(--fig);margin-top:9px;
 opacity:0;animation:fadeIn 900ms var(--e-out) 900ms forwards}
@keyframes fadeIn{to{opacity:1}}

/* ---------- MASTHEAD ---------- */
.mast{position:relative;z-index:40;background:var(--cream)}
.flagrow{display:flex;justify-content:space-between;align-items:flex-end;gap:var(--s-4);
 flex-wrap:wrap;padding:clamp(22px,3vw,36px) var(--pad) var(--s-3)}
.flag{font-family:var(--serif);font-size:clamp(1.4rem,4vw,2.6rem);letter-spacing:.16em;
 line-height:1;padding-inline-start:.16em}
.flag .sub{display:block;font-family:var(--ar);font-size:clamp(11px,1.4vw,14px);
 letter-spacing:0;color:var(--fig);margin-top:7px}
.dateline{font-family:var(--mono);font-size:9px;letter-spacing:.14em;text-transform:uppercase;
 color:rgba(26,23,18,.42);text-align:end;line-height:1.95}
.status{display:inline-flex;align-items:center;gap:7px;color:var(--fig)}
.status::before{content:"";width:5px;height:5px;background:var(--fig);border-radius:50%}
.status[data-closed]{color:var(--clay-dk)}
.status[data-closed]::before{background:var(--clay-dk)}

.nav{display:flex;flex-wrap:wrap;border-top:1px solid var(--ink);border-bottom:1px solid var(--rule)}
.nav a{flex:1 1 auto;min-width:118px;padding:13px var(--pad);border-inline-end:1px solid var(--rule);
 font-family:var(--mono);font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;
 color:rgba(26,23,18,.62);transition:background var(--t-fast) var(--e-out),color var(--t-fast) var(--e-out)}
.nav a:last-child{border-inline-end:0}
.nav a .num{color:var(--clay-dk);margin-inline-end:7px}
.nav a:hover,.nav a:focus-visible{background:var(--ink);color:var(--cream)}
.nav a:hover .num{color:var(--ember)}
.nav a[data-res]{color:var(--clay-dk);font-weight:700}

/* sticky bar */
.sticky{position:fixed;top:0;inset-inline:0;z-index:60;background:var(--cream);
 border-bottom:1px solid var(--ink);display:flex;justify-content:space-between;align-items:center;
 gap:var(--s-4);padding:10px var(--pad);transform:translateY(-101%);
 transition:transform var(--t-exit) var(--e-in)}
.sticky[data-on]{transform:none;transition:transform var(--t-fast) var(--e-out)}
.sticky .sm{font-family:var(--serif);font-size:12px;letter-spacing:.3em}
.sticky .sc{font-family:var(--mono);font-size:9px;letter-spacing:.14em;text-transform:uppercase;
 color:rgba(26,23,18,.42)}
.sticky .sr{font-family:var(--mono);font-size:9px;letter-spacing:.14em;text-transform:uppercase;
 color:var(--clay-dk);border-bottom:1px solid var(--clay-dk);padding-bottom:2px}

/* mobile bar */
.mbar{position:fixed;inset-inline:0;bottom:0;z-index:70;display:none;border-top:1px solid var(--ink);
 background:var(--cream);transform:translateY(101%);transition:transform var(--t-exit) var(--e-in);
 padding-bottom:env(safe-area-inset-bottom)}
.mbar[data-on]{transform:none;transition:transform var(--t-fast) var(--e-out)}
.mbar a{flex:1;text-align:center;padding:17px 8px;min-height:48px;
 font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase}
.mbar a+a{background:var(--ink);color:var(--cream)}

/* ---------- M1 THRESHOLD ---------- */
.threshold{min-height:clamp(56px,16svh,200px)}


/* ---------- M2 SENTENCE ---------- */
.sentence{padding:clamp(24px,4vw,56px) var(--pad) clamp(46px,7vw,96px)}
.folio{font-family:var(--mono);font-size:9.5px;letter-spacing:.24em;text-transform:uppercase;
 color:var(--clay-dk);margin-bottom:clamp(18px,2.4vw,30px)}
h1{font-family:var(--serif);font-size:clamp(2.4rem,7.4vw,6rem);line-height:1;
 letter-spacing:-.02em;max-width:14ch}
h1 em{font-style:italic;color:var(--clay)}
.sentence .ar-lede{font-family:var(--ar);direction:rtl;font-size:clamp(1.2rem,3vw,2.2rem);
 color:var(--fig);margin-top:clamp(18px,2.6vw,30px);line-height:1.6;max-width:22ch}
.hairline{height:1px;background:var(--rule);margin:0 var(--pad)}

/* ---------- M3 PROOF ---------- */
.proof{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,4vw,72px);
 padding:clamp(44px,6vw,88px) var(--pad);align-items:end}
.figure{overflow:hidden;background:var(--cream-2)}
.figure img{width:100%;height:100%;object-fit:cover}
.ratio-34{aspect-ratio:3/4}
.ratio-wide{aspect-ratio:16/8}
.caption{font-family:var(--mono);font-size:9.5px;letter-spacing:.07em;text-transform:uppercase;
 color:#6F6558;line-height:1.9;border-top:1px solid var(--rule);padding-top:10px;margin-top:11px}
.caption b{color:var(--clay-dk);font-weight:400}
.proof p{font-size:14.5px;line-height:2.05;color:var(--soft);max-width:42ch}
.proof p+p{margin-top:var(--s-4)}
.pullquote{font-family:var(--serif);font-style:italic;font-size:clamp(1.2rem,2.4vw,1.85rem);
 line-height:1.42;border-inline-start:2px solid var(--clay);padding-inline-start:20px;margin:var(--s-6) 0}

/* ---------- M4 BILINGUAL ---------- */
.bilingual{background:var(--cream-2);border-top:1px solid var(--ink)}
.bilingual .head{padding:clamp(26px,3.4vw,44px) var(--pad) 0}
.bigrid{display:grid;grid-template-columns:1fr 1px 1fr;
 padding:clamp(20px,2.6vw,34px) var(--pad) clamp(46px,6vw,88px)}
.vrule{background:var(--rule);transform:scaleY(0);transform-origin:center;
 transition:transform 1200ms var(--e-out)}
.vrule[data-in]{transform:scaleY(1)}
.bicol{padding-inline:clamp(16px,2.4vw,40px)}
.bicol:first-of-type{padding-inline-start:0}
.bicol:last-of-type{padding-inline-end:0}

.bicol h2{font-family:var(--serif);font-size:clamp(1.35rem,2.8vw,2.1rem);line-height:1.16;margin-bottom:var(--s-4)}
.bicol p{font-size:14px;line-height:2.05;color:var(--soft)}
.bicol[dir="rtl"]{text-align:right}
.bicol[dir="rtl"] h2{font-family:var(--ar);font-weight:700;color:var(--fig);
 font-size:clamp(1.45rem,3vw,2.3rem);line-height:1.5}
.bicol[dir="rtl"] p{font-family:var(--ar);font-size:16.5px;line-height:2.1}

/* ---------- M5 FIRE (the one hard cut, the one parallax) ---------- */
.fire{position:relative;min-height:78svh;background:var(--char);color:#EFE7DA;
 display:grid;place-items:center;overflow:hidden;content-visibility:auto;
 contain-intrinsic-size:auto 700px}
.fire .plate{position:absolute;inset:-6% 0;will-change:transform}
.fire .glow{position:absolute;inset:0;background:
 radial-gradient(46% 40% at 52% 74%,rgba(212,82,30,.40),transparent 62%),
 radial-gradient(58% 48% at 24% 94%,rgba(255,140,40,.16),transparent 62%),
 linear-gradient(#090807,#150C06)}
.fire video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.86}
.fire .vignette{position:absolute;inset:0;
 background:radial-gradient(94% 80% at 50% 54%,transparent,rgba(0,0,0,.55))}
.fire .inner{position:relative;z-index:3;text-align:center;padding:clamp(78px,11vw,132px) var(--pad)}
.fire .inner::before{content:'';position:absolute;inset:-8% -6%;z-index:-1;
 background:radial-gradient(58% 52% at 50% 50%,rgba(0,0,0,.62),transparent 72%)}
.fire h2,.fire .ar{text-shadow:0 1px 24px rgba(0,0,0,.55)}
.fire h2{font-family:var(--serif);font-size:clamp(1.6rem,4.8vw,3.7rem);line-height:1.09;
 max-width:19ch;margin-inline:auto;color:#F8F2E8}
.fire .ar{font-family:var(--ar);direction:rtl;font-size:clamp(1.05rem,2.3vw,1.7rem);
 color:#D9924E;margin-top:var(--s-4)}
.fire .tc{position:absolute;top:22px;inset-inline:var(--pad);z-index:4;display:flex;
 justify-content:space-between;gap:var(--s-4);font-family:var(--mono);font-size:9px;
 letter-spacing:.24em;text-transform:uppercase;color:rgba(239,231,218,.42)}
.fire .principles{position:absolute;bottom:22px;inset-inline:var(--pad);z-index:4;display:flex;
 justify-content:space-between;gap:var(--s-3);flex-wrap:wrap;font-family:var(--mono);font-size:9px;
 letter-spacing:.18em;text-transform:uppercase;color:rgba(239,231,218,.45)}
.fire .principles b{color:#D9924E;font-weight:400;margin-inline-end:7px}
.fire .principles .ara{font-family:var(--ar);font-size:12px;margin-inline-end:6px}

/* ---------- M6 TABLE — portrait photograph, text beside it ---------- */
.tablemoment{padding:clamp(46px,7vw,100px) var(--pad) clamp(28px,4vw,52px);
 display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(28px,5vw,80px);align-items:center;
 max-width:1500px;margin-inline:auto}
/* No fixed ratio, no object-fit. The photograph decides its own shape. */
.photo{background:var(--cream-2);max-width:640px;margin-inline-start:auto}
.photo img{width:100%;height:auto;display:block}
.tablemoment h2{font-family:var(--serif);font-size:clamp(1.8rem,4.4vw,3.4rem);
 line-height:1.04;max-width:15ch;margin-bottom:var(--s-5)}
.tablemoment h2 em{font-style:italic;color:var(--clay)}
.tablemoment .aside{font-size:14px;line-height:2.05;color:var(--soft);max-width:38ch}
.tablemoment .caption{max-width:38ch;margin-top:var(--s-5)}
@media(max-width:880px){
 .tablemoment{grid-template-columns:1fr;gap:var(--s-5)}
 .photo{max-width:none;margin-inline:0}
}

/* ---------- M7 MENU ---------- */
.menu{padding:clamp(46px,6vw,88px) 0 clamp(48px,6vw,92px);border-top:1px solid var(--ink);
 background:var(--cream-2);content-visibility:auto;contain-intrinsic-size:auto 620px}
.menu .head{padding:0 var(--pad);display:flex;justify-content:space-between;align-items:flex-end;
 gap:var(--s-5);flex-wrap:wrap;margin-bottom:clamp(22px,3vw,38px)}
.menu .folio{position:sticky;top:60px}
.menu h2{font-family:var(--serif);font-size:clamp(1.6rem,3.8vw,2.9rem);line-height:1.06}
.hint{font-family:var(--mono);font-size:9px;letter-spacing:.16em;text-transform:uppercase;
 color:rgba(26,23,18,.42)}
.tray{display:flex;overflow-x:auto;padding-inline:var(--pad);cursor:grab;
 scrollbar-width:none;-ms-overflow-style:none;overscroll-behavior-inline:contain}
.tray::-webkit-scrollbar{display:none}
.tray[data-dragging]{cursor:grabbing}
.chapter{flex:0 0 clamp(190px,24vw,262px);background:var(--cream);border:1px solid var(--rule);
 border-inline-end:0;padding:20px 20px 24px;min-height:190px;
 transition:background var(--t-fast) var(--e-out)}
.chapter:last-child{border-inline-end:1px solid var(--rule)}
.chapter:hover,.chapter:focus-within{background:var(--paper)}
.chapter .n{font-family:var(--mono);font-size:9px;letter-spacing:.2em;color:var(--clay-dk);margin-bottom:var(--s-6)}
.chapter .ara{font-family:var(--ar);direction:rtl;text-align:right;font-size:1.3rem;color:var(--fig)}
.chapter .eng{font-family:var(--serif);font-size:14px;letter-spacing:.1em;text-transform:uppercase;margin-top:3px}
.chapter .note{font-family:var(--mono);font-size:9px;color:rgba(26,23,18,.42);margin-top:var(--s-4);
 border-top:1px solid var(--rule);padding-top:var(--s-2);letter-spacing:.08em}
.menu .more{padding:var(--s-5) var(--pad) 0}
.menu .more a{font-family:var(--mono);font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;
 color:var(--clay-dk);border-bottom:1px solid var(--clay-dk);padding-bottom:3px}

/* ---------- M8 PEOPLE ---------- */
.people{padding:clamp(46px,7vw,100px) var(--pad);content-visibility:auto;contain-intrinsic-size:auto 700px}
.people h2{font-family:var(--serif);font-size:clamp(1.7rem,4.2vw,3rem);line-height:1.05;max-width:17ch}
.pgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(18px,2.6vw,40px);
 margin-top:clamp(24px,3vw,40px)}
.person .portrait{aspect-ratio:4/5;background:linear-gradient(200deg,rgba(180,85,47,.22),rgba(62,74,50,.26));
 display:grid;place-items:center}
.person .portrait span{font-family:var(--mono);font-size:9px;letter-spacing:.14em;
 text-transform:uppercase;color:#8C5330;text-align:center;padding:0 12px}
.person .name{font-family:var(--serif);font-size:clamp(1.05rem,2vw,1.4rem);margin-top:var(--s-3)}
.person .role{font-family:var(--mono);font-size:9px;letter-spacing:.16em;text-transform:uppercase;
 color:var(--clay-dk);margin-top:4px}
.person .line{font-size:13px;line-height:1.9;color:var(--soft);margin-top:var(--s-2)}
.todo{color:#8C5330;font-style:italic}


/* ---------- MEDIA BAND ---------- */
.band{padding:clamp(20px,3vw,44px) var(--pad) clamp(44px,6vw,86px);
 content-visibility:auto;contain-intrinsic-size:auto 620px}
.bandgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(12px,1.6vw,26px)}
.bandcell{overflow:hidden}
.bandcell>img,.bandcell>video{width:100%;aspect-ratio:3/4;object-fit:cover;
 transform:scale(1.03);transition:transform var(--t-slow) var(--e-out);background:var(--cream-2)}
.bandcell[data-in]>img,.bandcell[data-in]>video{transform:none}
.bandcell .caption{margin-top:10px}
@media(max-width:880px){
 .bandgrid{grid-template-columns:1fr 1fr;gap:10px}
 .bandcell:last-child{grid-column:1 / -1}
 .bandcell:last-child>img{aspect-ratio:16/9}
}
.maplink{display:inline-block;margin-top:6px;font-family:var(--mono);font-size:9.5px;
 letter-spacing:.16em;text-transform:uppercase;color:var(--clay-dk);
 border-bottom:1px solid var(--clay-dk);padding-bottom:3px}
.maplink:hover{color:var(--ink);border-color:var(--ink)}

/* ---------- M9 ASK ---------- */
.ask{border-top:1px solid var(--ink);padding:clamp(46px,7vw,96px) var(--pad) clamp(40px,5vw,72px);
 display:grid;grid-template-columns:1fr 1fr;gap:clamp(26px,4vw,72px)}
.ask h2{font-family:var(--serif);font-size:clamp(1.9rem,4.6vw,3.4rem);line-height:1.04;margin-bottom:var(--s-4)}
.ask .lede{font-size:14.5px;line-height:2.05;color:var(--soft);max-width:40ch}
.datarow{display:grid;grid-template-columns:112px 1fr;gap:var(--s-4);padding:15px 0;
 border-bottom:1px solid var(--rule);align-items:baseline}
.datarow:first-child{border-top:1px solid var(--rule)}
.datarow dt{font-family:var(--mono);font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:var(--clay-dk)}
.datarow dd{font-size:14.5px;line-height:1.7}
.datarow dd a{border-bottom:1px solid var(--brass);padding-bottom:2px}
.datarow dd a:hover{border-color:var(--clay)}

.booking{margin-top:var(--s-6);border-top:1px solid var(--rule);padding-top:var(--s-5)}
.fields{display:flex;flex-wrap:wrap;gap:var(--s-5)}
.field{flex:1 1 130px;min-width:130px}
.field label{display:block;font-family:var(--mono);font-size:9px;letter-spacing:.16em;
 text-transform:uppercase;color:var(--clay-dk);margin-bottom:var(--s-2)}
.field input,.field select{width:100%;background:none;border:0;border-bottom:1px solid var(--rule-2);
 border-radius:var(--radius);padding:11px 0;min-height:44px;
 font-family:var(--sans);font-size:14.5px;color:var(--ink)}
.field input:focus,.field select:focus{outline:none;border-bottom:2px solid var(--clay)}
.actions{display:flex;flex-wrap:wrap;gap:var(--s-5);align-items:center;margin-top:var(--s-6)}
.btn{display:inline-block;background:var(--ink);color:var(--cream);padding:16px 32px;min-height:48px;
 font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;
 transition:background var(--t-fast) var(--e-out)}
.btn:hover,.btn:focus-visible{background:var(--clay)}
.btn:active{background:var(--clay-dk)}
.textlink{position:relative;font-family:var(--mono);font-size:9.5px;letter-spacing:.14em;
 text-transform:uppercase;color:var(--soft);padding-bottom:4px}
.textlink::after{content:"";position:absolute;inset-inline-start:0;bottom:0;height:1px;width:100%;
 background:var(--clay);transform:scaleX(.34);transform-origin:inline-start;
 transition:transform 500ms var(--e-out)}
.textlink:hover::after,.textlink:focus-visible::after{transform:scaleX(1)}
.note-large{font-family:var(--mono);font-size:9px;letter-spacing:.14em;text-transform:uppercase;
 color:var(--clay-dk);margin-top:var(--s-3);min-height:14px}

/* ---------- M10 HANDOVER ---------- */
.handover{border-top:1px solid var(--ink);padding:clamp(40px,6vw,80px) var(--pad) 30px;text-align:center}
.handover .wordmark{font-family:var(--serif);font-size:clamp(2.4rem,10vw,7rem);letter-spacing:.1em;
 line-height:.92;transform:scale(.96);transition:transform 1800ms var(--e-out)}
.handover[data-in] .wordmark{transform:scale(1)}
.handover .ar{font-family:var(--ar);direction:rtl;font-size:clamp(1.1rem,2.4vw,1.7rem);
 color:var(--fig);margin-top:var(--s-3)}
.handover .send{margin-top:clamp(26px,4vw,44px);font-family:var(--serif);font-style:italic;
 font-size:clamp(1.05rem,2.2vw,1.5rem)}
.share{margin-top:var(--s-4);border:1px solid var(--ink);padding:14px 30px;min-height:48px;
 font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;
 transition:background var(--t-fast) var(--e-out),color var(--t-fast) var(--e-out)}
.share:hover,.share:focus-visible{background:var(--ink);color:var(--cream)}
.colophon{display:flex;justify-content:space-between;gap:var(--s-3) var(--s-6);flex-wrap:wrap;
 margin-top:clamp(34px,5vw,60px);padding-top:var(--s-5);border-top:1px solid var(--rule);
 font-family:var(--mono);font-size:9px;letter-spacing:.14em;text-transform:uppercase;
 color:rgba(26,23,18,.42);text-align:start}
.colophon a{margin-inline-end:18px;color:rgba(26,23,18,.55)}
.colophon a:hover{color:var(--clay-dk)}

/* ---------- RESPONSIVE ---------- */
@media (max-width:1199px){
  .proof{gap:clamp(24px,4vw,48px)}
}
@media (max-width:880px){
  .proof{grid-template-columns:1fr;gap:var(--s-6)}
  .bigrid{grid-template-columns:1fr;gap:var(--s-6)}
  .vrule{height:1px;width:100%;transform:scaleX(0)}
  .vrule[data-in]{transform:scaleX(1)}
  .bicol{padding-inline:0}
  .bicol[dir="rtl"]{order:-1}          /* Arabic first on mobile — deliberate */
  .pgrid{grid-template-columns:1fr}
  .ask{grid-template-columns:1fr}
}
@media (max-width:700px){
  body{padding-bottom:60px}
  .nav{display:none}
  .sticky{display:none}
  .mbar{display:flex}
  .dateline{text-align:start}
  .datarow{grid-template-columns:1fr;gap:var(--s-1)}
  .menu .folio{position:static}
  .threshold{min-height:44px}
  .fire .principles{gap:var(--s-2);font-size:8px}
}
@media (min-width:1600px){
  .proof,.ask,.tablemoment,.people{max-width:1600px;margin-inline:auto}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;
   transition-duration:.001ms!important}
  [data-reveal]{opacity:1!important;transform:none!important}
  [data-reveal="set"] .ln>i{transform:none!important}
  [data-reveal="settle"] img{transform:none!important}
  .vrule{transform:none!important}
  .handover .wordmark{transform:none!important}
}
@media print{
  .sticky,.mbar,.fire,.tray,#loader,.paper-grain{display:none!important}
  body{background:#fff;color:#000}
}