/* ZNTRX STUDIO
   Layout: the ZNTRX "Signal Rig" catalogue. Mono rails and hard rules frame a lineup of titles;
   each title keeps one identity colour (a square marker, a frame), cyan is always the action. */
@font-face{font-family:"Bebas Neue";src:url("fonts/bebas-neue-400.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Roboto";src:url("fonts/roboto-400.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Roboto";src:url("fonts/roboto-500.woff2") format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Roboto";src:url("fonts/roboto-700.woff2") format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:"Roboto Mono";src:url("fonts/roboto-mono-500.woff2") format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Roboto Mono";src:url("fonts/roboto-mono-700.woff2") format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:"Noto Kufi Arabic";src:url("fonts/noto-kufi-arabic-400.woff2") format("woff2");font-weight:400;font-display:swap;unicode-range:U+0600-06FF,U+0750-077F,U+0870-08FF,U+FB50-FDFF,U+FE70-FEFF,U+200C-200E,U+2010-2011,U+204F,U+2E41}
@font-face{font-family:"Noto Kufi Arabic";src:url("fonts/noto-kufi-arabic-700.woff2") format("woff2");font-weight:700;font-display:swap;unicode-range:U+0600-06FF,U+0750-077F,U+0870-08FF,U+FB50-FDFF,U+FE70-FEFF,U+200C-200E,U+2010-2011,U+204F,U+2E41}
@font-face{font-family:"Noto Kufi Arabic";src:url("fonts/noto-kufi-arabic-800.woff2") format("woff2");font-weight:800;font-display:swap;unicode-range:U+0600-06FF,U+0750-077F,U+0870-08FF,U+FB50-FDFF,U+FE70-FEFF,U+200C-200E,U+2010-2011,U+204F,U+2E41}

:root{
  color-scheme:dark;
  /* ZNTRX Signal Rig */
  --ground:#080A0B; --panel:#111517; --raise:#171C1F; --line:#2A2F31; --line-2:#3B4245;
  --paper:#E8E9E6; --dim:#B4BAB9; --muted:#8D9697;
  --cyan:#4BC0C8; --magenta:#EC008C;
  /* one identity colour per title */
  --aw:#E5484D; --bl:#D8BD82; --ms:#0B6B45; --ms-sign:#F4F4F0; --ms-yellow:#F7C600;
  --dl-paper:#F4F5EF; --dl-ink:#131713; --dl-ink-2:#4C544D; --dl-hair:#D5D9CF;
  --dl-good:#17804B; --dl-official:#2547A8; --dl-strong:#0B7570; --dl-early:#8F5B00; --dl-belief:#646A64;
  /* type */
  --f-display:"Bebas Neue","Arial Narrow",Impact,sans-serif;
  --f-sans:"Roboto","Helvetica Neue",Arial,sans-serif;
  --f-mono:"Roboto Mono",ui-monospace,Consolas,monospace;
  --f-ar:"Noto Kufi Arabic","Roboto","Segoe UI",Tahoma,sans-serif;
  --f-ar-display:"Noto Kufi Arabic","Bebas Neue","Segoe UI",Tahoma,sans-serif;
  --max:1240px;
  --gut-l:max(16px, env(safe-area-inset-left, 0px));
  --gut-r:max(16px, env(safe-area-inset-right, 0px));
}
html[lang="ar"]{--f-sans:var(--f-ar);--f-mono:"Roboto Mono",var(--f-ar)}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(72px + env(safe-area-inset-top, 0px))}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important;animation:none!important}}
body{margin:0;background:var(--ground);color:var(--paper);font:400 17px/1.6 var(--f-sans);overflow-x:clip}
html[lang="ar"] body{font-size:16.5px;line-height:1.85}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top, 0px);z-index:60;background:var(--ground)}
img{max-width:100%;display:block}
a{color:inherit}
p{margin:0}
h1,h2,h3{margin:0;font-weight:400;text-wrap:balance}
:focus-visible{outline:2px solid var(--cyan);outline-offset:3px}
::selection{background:var(--cyan);color:var(--ground)}

/* language switching: every bilingual string ships both spans */
html:not([lang="ar"]) .t-ar{display:none!important}
html[lang="ar"] .t-en{display:none!important}

.wrap{width:100%;max-width:calc(var(--max) + 64px);margin-inline:auto;padding-left:var(--gut-l);padding-right:var(--gut-r)}
@media (min-width:720px){.wrap{padding-left:max(32px, env(safe-area-inset-left, 0px));padding-right:max(32px, env(safe-area-inset-right, 0px))}}
.skip{position:absolute;inset-inline-start:16px;top:0;transform:translateY(-120%);z-index:100;background:var(--cyan);color:var(--ground);padding:10px 14px;font:700 14px var(--f-mono)}
.skip:focus{transform:none;top:calc(8px + env(safe-area-inset-top, 0px))}

/* ---------- labels, rails, chips ---------- */
.label{font:700 11px/16px var(--f-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
html[lang="ar"] .label{letter-spacing:0;text-transform:none;font:700 13px/18px var(--f-ar)}
.label [lang="ar"],.chip [lang="ar"],.btn [lang="ar"]{letter-spacing:0;text-transform:none;font-family:var(--f-ar);unicode-bidi:isolate}
.rail{display:flex;flex-wrap:wrap;gap:8px 24px;justify-content:space-between;align-items:center;padding-bottom:12px;border-bottom:2px solid var(--paper)}
.rail.thin{border-bottom-width:1px;border-color:var(--line-2)}
.sq{display:inline-block;width:8px;height:8px;background:var(--c, var(--cyan));flex:none}
.code{display:inline-flex;align-items:center;gap:8px}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{display:inline-flex;align-items:center;gap:6px;min-height:26px;padding:3px 8px;border:1px solid var(--line-2);border-radius:4px;font:700 11px/1 var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--paper);white-space:nowrap}
html[lang="ar"] .chip{letter-spacing:0;font:700 13px/1 var(--f-ar)}
.chip.live{background:var(--cyan);border-color:var(--cyan);color:var(--ground)}
.chip.dev{color:var(--dim)}
.dot{color:var(--cyan)}

/* ---------- buttons ---------- */
.btns{display:flex;flex-wrap:wrap;gap:10px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:0 18px;border:1px solid var(--line-2);border-radius:4px;background:transparent;color:var(--paper);font:700 13px/1 var(--f-mono);letter-spacing:.12em;text-transform:uppercase;text-decoration:none;cursor:pointer;transition:background .15s,border-color .15s,color .15s}
html[lang="ar"] .btn{letter-spacing:0;font:700 15px/1 var(--f-ar)}
.btn:hover{border-color:var(--paper)}
.btn.go{background:var(--cyan);border-color:var(--cyan);color:var(--ground)}
.btn.go:hover{background:var(--paper);border-color:var(--paper)}
.btn .arr{font-family:var(--f-sans);font-size:16px;line-height:1}
html[dir="rtl"] .btn .arr.flip{transform:scaleX(-1)}
.btn.soon{cursor:default;color:var(--muted);border-style:dashed}
.btn.soon:hover{border-color:var(--line-2)}
.btn.soon b{color:var(--paper);font-weight:700}

/* ---------- header ---------- */
.top{position:sticky;top:env(safe-area-inset-top, 0px);z-index:50;background:rgba(8,10,11,.88);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.top .wrap{display:flex;align-items:center;gap:16px;min-height:64px}
.brand{display:inline-flex;align-items:center;text-decoration:none;margin-inline-end:auto;direction:ltr;padding-block:10px}
.brand .lockup{height:40px;width:auto}
.nav{display:flex;gap:4px}
.nav a{display:inline-flex;align-items:center;min-height:44px;padding:0 12px;text-decoration:none;font:700 12px/1 var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--dim)}
html[lang="ar"] .nav a{letter-spacing:0;font:700 15px/1 var(--f-ar)}
.nav a:hover,.nav a[aria-current="page"]{color:var(--paper)}
.lang{min-height:40px;padding:0 14px;border:1px solid var(--line-2);border-radius:4px;background:transparent;color:var(--paper);font:700 15px/1 var(--f-ar);cursor:pointer}
html[lang="ar"] .lang{font:700 12px/1 var(--f-mono);letter-spacing:.14em;text-transform:uppercase}
.lang:hover{border-color:var(--paper)}
@media (max-width:760px){.nav{display:none}.brand .lockup{height:34px}}

/* ---------- hero: "Jeddah, one shot" ----------
   Five chapters. Without JS (or with reduced motion) they stack as full-height panels.
   With JS the stage pins under the header and scroll moves one camera through them. */
:root{--hh:calc(65px + env(safe-area-inset-top, 0px))}
.oneshot{position:relative;background:#03070A}
.stage{position:relative}
.ch{position:relative;isolation:isolate;overflow:hidden;min-height:min(92svh,900px);display:flex;flex-direction:column;justify-content:flex-end}
.ch .bg{position:absolute;inset:0;z-index:-2;overflow:hidden;background:#03070A}
.ch .bg img,.ch .bg .lyr,.ch .bg canvas{position:absolute;inset:0;width:100%;height:100%}
.ch .bg img{object-fit:cover}
.ch .bg::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(0deg,rgba(3,7,10,.94) 0%,rgba(3,7,10,.6) 30%,rgba(3,7,10,0) 58%)}
@media (min-width:900px){
  .ch .bg::after{background:linear-gradient(0deg,rgba(3,7,10,.9) 0%,rgba(3,7,10,0) 46%),linear-gradient(90deg,rgba(3,7,10,.82) 0%,rgba(3,7,10,.4) 36%,rgba(3,7,10,0) 60%)}
  html[dir="rtl"] .ch .bg::after{background:linear-gradient(0deg,rgba(3,7,10,.9) 0%,rgba(3,7,10,0) 46%),linear-gradient(270deg,rgba(3,7,10,.82) 0%,rgba(3,7,10,.4) 36%,rgba(3,7,10,0) 60%)}
}
.ch .tx{position:relative;display:grid;gap:18px;align-content:end;justify-items:start;width:100%;max-width:calc(var(--max) + 64px);margin-inline:auto;
  padding:96px var(--gut-r) clamp(36px,7vh,72px) var(--gut-l)}
@media (min-width:720px){.ch .tx{padding-left:max(32px, env(safe-area-inset-left, 0px));padding-right:max(32px, env(safe-area-inset-right, 0px))}}
.ch .tx>*{max-width:min(640px,100%)}
.kicker{display:inline-flex;align-items:center;gap:10px;color:var(--paper)}
.kicker .sq{background:var(--c)}
.ch .line{font-size:clamp(18px,1.7vw,22px);line-height:1.5;color:var(--paper);max-width:40ch}
html[lang="ar"] .ch .line{font-size:clamp(17px,1.6vw,21px);line-height:1.8}

/* 1 · the Corniche */
.c-jed .bg img{object-position:56% 50%}
@media (min-width:900px){
  .c-jed .bg img{object-position:50% 50%}
  .c-jed h1 .br{display:none}
  .ch.c-jed .tx>h1{max-width:none}
  .c-jed h1{font-size:clamp(72px,7.2vw,120px)}
  html[lang="ar"] .c-jed h1{font-size:clamp(54px,5.6vw,92px)}
  .oneshot .ch.c-jed .bg::after{background:linear-gradient(0deg,rgba(3,7,10,.9) 0%,rgba(3,7,10,.6) 30%,rgba(3,7,10,0) 50%)}
  .c-jed .tx{gap:16px}
  .c-jed .lede{max-width:66ch}
}
.c-jed .tx{gap:22px}
.c-jed .rail{width:min(640px,100%);color:var(--paper);text-shadow:0 1px 3px rgba(0,0,0,.9),0 0 14px rgba(0,0,0,.8)}
.c-jed h1{font:400 clamp(76px,10.5vw,164px)/.84 var(--f-display);text-transform:uppercase;text-shadow:0 4px 30px rgba(0,0,0,.35)}
html[lang="ar"] .c-jed h1{font:800 clamp(54px,8vw,116px)/1.2 var(--f-ar-display)}
.lede{max-width:52ch;font-size:clamp(16.5px,1.4vw,19px);color:var(--dim)}
.lede b{color:var(--paper);font-weight:500}
html[lang="ar"] .lede{font-size:clamp(16px,1.35vw,18px)}
.founder{display:flex;flex-wrap:wrap;gap:6px 14px;align-items:center;padding-top:14px;border-top:1px solid var(--line-2);width:min(640px,100%)}
.founder b{font:700 15px/1.2 var(--f-sans);color:var(--paper)}
.cue{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px;color:var(--dim)}
.cue a{display:inline-flex;align-items:center;gap:6px;min-height:40px;color:var(--paper);text-underline-offset:4px}
.mouse{width:16px;height:26px;border:1.5px solid var(--dim);border-radius:9px;position:relative;flex:none}
.mouse::after{content:"";position:absolute;left:50%;top:5px;width:2px;height:6px;margin-left:-1px;border-radius:1px;background:var(--cyan);animation:wheel 1.6s ease-in-out infinite}
@keyframes wheel{0%{transform:none;opacity:1}70%{transform:translateY(8px);opacity:0}100%{opacity:0}}
.oneshot:not(.live) .cue .mouse{display:none}

/* 2 · under the water: AHEIMER WAVES */
.c-aw .bg img{object-position:50% 30%}
.caus{position:absolute;left:-384px;top:-384px;right:0;bottom:0;background:url("img/caustics.webp") 0 0/384px 384px;mix-blend-mode:screen;opacity:.3;pointer-events:none;animation:drift 16s linear infinite}
@keyframes drift{to{transform:translate(384px,384px)}}
.c-aw .bg .caus{opacity:.16}
.aw-logo{width:min(250px,52vw);height:auto;filter:drop-shadow(0 10px 30px rgba(0,0,0,.6))}

/* water, and the surfacing light (only in the pinned version) */
.fx{display:none;position:absolute;inset:0;pointer-events:none}
.water{background:linear-gradient(180deg,rgba(13,79,95,.8) 0%,rgba(8,47,58,.94) 16%,#04161C 60%,#020B0E 100%)}
.water .caus{opacity:.09}
.water::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(100deg,rgba(150,225,240,0) 0 7%,rgba(150,225,240,.07) 9%,rgba(150,225,240,0) 12%);-webkit-mask:linear-gradient(180deg,#000,transparent 70%);mask:linear-gradient(180deg,#000,transparent 70%)}
.water .edge{position:absolute;left:0;bottom:calc(100% - 1px);width:200%;height:clamp(36px,6vw,72px);fill:rgba(13,79,95,.8);animation:swell 7s linear infinite}
.water .edge .glint{fill:none;stroke:rgba(200,244,255,.75);stroke-width:2;vector-effect:non-scaling-stroke}
@keyframes swell{to{transform:translateX(-50%)}}
.bub i{position:absolute;bottom:-12px;left:var(--x);width:var(--s);height:var(--s);border-radius:50%;border:1px solid rgba(210,245,255,.55);animation:bub 5.5s var(--d) linear infinite}
@keyframes bub{to{transform:translateY(-110vh)}}

/* 3 · the majlis: Shaikh al-Baloot */
.c-bl .names .nar{color:var(--bl)}
.c-bl .names .nen{color:var(--paper)}
.c-bl .bg .lyr img{object-position:50% 50%}

/* 4 · the expressway: Mishwar Saree */
.c-ms{justify-content:flex-start}
.oneshot .ch.c-ms .bg::after{background:linear-gradient(180deg,rgba(3,7,10,.35) 0%,rgba(3,7,10,0) 30%)}
.c-ms .tx{max-width:none}
.c-ms .bg img{object-position:50% 60%}
.ch.c-ms .bg .car{position:absolute;inset:auto auto 3% 50%;width:clamp(110px,15vw,230px);height:auto;object-fit:contain;transform:translateX(calc(-50% + var(--lane, 0px)));filter:drop-shadow(0 14px 10px rgba(0,0,0,.4))}
.c-ms .tx{align-content:start;justify-items:center;padding-top:clamp(22px,5vh,56px);padding-bottom:0}
.gantry{position:absolute;left:0;right:0;top:calc(clamp(22px,5vh,56px) + 26px);height:16px;max-width:none!important;
  background:linear-gradient(180deg,#7C858A 0 2px,transparent 2px 14px,#4A5257 14px),repeating-linear-gradient(60deg,transparent 0 9px,#5C656A 9px 11px);
  box-shadow:0 6px 14px rgba(0,0,0,.35)}
.c-ms .sign{position:relative;text-decoration:none;max-width:min(560px,calc(100% - 10px));width:max-content;transition:filter .2s}
.c-ms .sign:hover{filter:brightness(1.08)}
.c-ms .sign .nar{font:800 clamp(40px,6vw,76px)/1.25 var(--f-ar-display)}
.c-ms .sign .nen{font:800 clamp(14px,1.5vw,19px)/1 var(--f-sans);letter-spacing:.32em;padding-left:.32em;direction:ltr}
.c-ms .sign .tag{font:500 clamp(14px,1.4vw,17px)/1.5 var(--f-sans)}
html[lang="ar"] .c-ms .sign .tag{font:700 clamp(15px,1.5vw,18px)/1.6 var(--f-ar)}
.c-ms .sign .exit{position:absolute;bottom:-17px;inset-inline-end:18px;padding:5px 10px;border-radius:4px;background:var(--ms-yellow);color:#131713;font:700 11px/1 var(--f-mono);letter-spacing:.14em;text-transform:uppercase;box-shadow:0 0 0 2px #fff}
html[lang="ar"] .c-ms .sign .exit{letter-spacing:0;font:700 13px/1 var(--f-ar)}

/* 5 · the corner shop: Daleel */
.oneshot .ch.c-dl .bg::after{background:radial-gradient(120% 90% at 50% 45%,rgba(3,7,10,0) 40%,rgba(3,7,10,.7) 100%)}
.c-dl .bg{container-type:size}
.c-dl .bg img{object-position:50% 46%}
.scan{position:absolute;left:50%;top:46%;width:calc(max(100cqw, 150cqh) * .1);height:calc(max(66.67cqw, 100cqh) * .29);transform:translate(-50%,-50%);
  --k:var(--cyan);
  background:linear-gradient(var(--k),var(--k)) 0 0/22px 3px,linear-gradient(var(--k),var(--k)) 0 0/3px 22px,
             linear-gradient(var(--k),var(--k)) 100% 0/22px 3px,linear-gradient(var(--k),var(--k)) 100% 0/3px 22px,
             linear-gradient(var(--k),var(--k)) 0 100%/22px 3px,linear-gradient(var(--k),var(--k)) 0 100%/3px 22px,
             linear-gradient(var(--k),var(--k)) 100% 100%/22px 3px,linear-gradient(var(--k),var(--k)) 100% 100%/3px 22px;
  background-repeat:no-repeat;filter:drop-shadow(0 0 6px rgba(75,192,200,.7))}
.scan i{position:absolute;left:6%;right:6%;top:0;height:2px;background:var(--cyan);box-shadow:0 0 14px 3px rgba(75,192,200,.75);animation:sweep 2.2s ease-in-out infinite alternate}
@keyframes sweep{to{top:calc(100% - 2px)}}
.hand{position:absolute;z-index:1;inset-inline-end:max(7%, 64px);bottom:-12%;width:clamp(150px,20vw,290px)}
.hand .phone{transform:rotate(-5deg);box-shadow:0 30px 70px rgba(0,0,0,.7),0 0 0 1px var(--line-2)}
html[dir="rtl"] .hand .phone{transform:rotate(5deg)}
.shelf-tag{display:grid;width:min(360px,100%);background:var(--dl-paper);color:var(--dl-ink);text-decoration:none;border-radius:4px;overflow:hidden;box-shadow:0 18px 44px rgba(0,0,0,.55);transition:transform .2s}
.shelf-tag:hover{transform:translateY(-2px)}
.shelf-tag .band{display:flex;justify-content:space-between;align-items:center;gap:12px;background:var(--dl-ink);color:var(--dl-paper);padding:6px 14px}
.shelf-tag .nar{font:800 24px/1.35 var(--f-ar-display)}
.shelf-tag .nen{font:800 17px/1 var(--f-sans);letter-spacing:.08em}
.shelf-tag .score{display:flex;align-items:flex-end;gap:6px;padding:12px 14px 2px}
.shelf-tag .num{display:inline-flex;align-items:flex-end;gap:4px}
.shelf-tag .score b{font:800 clamp(52px,5vw,64px)/.85 var(--f-sans);color:var(--dl-good);letter-spacing:-.02em}
.shelf-tag .score small{font:700 17px/1 var(--f-sans);color:var(--dl-ink-2);margin-bottom:4px}
.shelf-tag .score>span{margin-inline-start:auto;text-align:end;font:700 11px/1.45 var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--dl-ink-2)}
html[lang="ar"] .shelf-tag .score>span{letter-spacing:0;font:700 13px/1.6 var(--f-ar)}
.shelf-tag .say{padding:8px 14px 12px;font:500 16px/1.45 var(--f-sans)}
.shelf-tag .more{display:flex;justify-content:space-between;align-items:center;min-height:40px;border-top:1px dashed #B9BEB2;padding:6px 14px;font:700 11px/1 var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--dl-ink-2)}
html[lang="ar"] .shelf-tag .more{letter-spacing:0;font:700 13px/1 var(--f-ar)}

/* chapter track */
.track{display:none;position:absolute;z-index:5;inset-inline-end:max(10px, env(safe-area-inset-right, 0px));top:50%;transform:translateY(-50%);flex-direction:column;gap:2px}
.track button{display:flex;align-items:center;justify-content:flex-end;gap:10px;min-height:34px;min-width:34px;padding:0 6px;background:none;border:0;color:var(--dim);cursor:pointer;font:700 11px/1 var(--f-mono);letter-spacing:.14em;text-transform:uppercase}
html[lang="ar"] .track button{letter-spacing:0;font:700 13px/1 var(--f-ar)}
.track button span{order:-1;opacity:0;transition:opacity .25s;text-shadow:0 1px 8px rgba(0,0,0,.8)}
.track i{width:9px;height:9px;border:1.5px solid rgba(232,233,230,.8);flex:none;transition:transform .25s,background .25s,border-color .25s;box-shadow:0 0 8px rgba(0,0,0,.5)}
.track button.on i{background:var(--c);border-color:var(--c);transform:scale(1.35)}
.track button.on span{opacity:1;color:var(--paper)}
@media (min-width:1100px){.track button span{opacity:.6}.track:hover button span{opacity:1}}

/* ---- the pinned, scroll-driven version ---- */
.oneshot.live{height:640vh;height:640svh}
.oneshot.live .stage{position:sticky;top:var(--hh);height:calc(100svh - var(--hh));overflow:hidden}
.oneshot.live .ch{position:absolute;inset:0;min-height:0;display:block}
.oneshot.live .ch .tx{position:absolute;left:0;right:0;bottom:0}
.oneshot.live .c-ms .tx{top:0;bottom:auto}
.oneshot.live .fx{display:block}
.oneshot.live .track{display:flex}
.oneshot.live [data-tl]{will-change:transform,opacity}
.oneshot.live .c-dl .tx{z-index:2}
@media (max-width:719px){
  .c-dl{justify-content:flex-start}
  .c-dl .tx{padding-top:18px}
  .oneshot.live .c-dl .tx{top:0;bottom:auto}
  .c-dl .shelf-tag{width:min(300px,100%)}
  .c-dl .shelf-tag .score b{font-size:46px}
  .c-dl .shelf-tag .say{font-size:15px}
  .hand{width:44vw;bottom:-20%}
  .track{inset-inline-end:max(2px, env(safe-area-inset-right, 0px));gap:0}
  .track button{min-height:26px;min-width:22px;padding:0 6px}
  .track i{width:7px;height:7px}
  .track button span{display:none}
  .oneshot.live .ch .tx{padding-inline-end:34px}
  .oneshot.live .c-ms .tx{padding-inline-end:var(--gut-r)}
}
@media (max-height:620px) and (min-width:720px){.c-jed .lede{display:none}}

.tcard{position:relative;display:flex;flex-direction:column;justify-content:flex-end;min-height:100%;aspect-ratio:3/4;max-width:100%;overflow:hidden;border:1px solid var(--line);border-radius:12px;background:var(--panel);text-decoration:none;isolation:isolate}
.tcard>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transition:transform .5s ease}
.tcard>img.px{image-rendering:pixelated}
.tcard::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(8,10,11,0) 18%,rgba(8,10,11,.9) 48%,rgba(8,10,11,.98) 66%)}
.tcard>img.shot{object-position:center top}
.tcard:hover{border-color:var(--c)}
.tcard:hover>img{transform:scale(1.04)}
.tcard .in{display:grid;gap:6px;padding:14px}
@media (min-width:900px){.tcard .in{padding:18px;gap:8px}}
.tcard .nar{font:800 clamp(20px,2.3vw,28px)/1.15 var(--f-ar-display)}
.tcard .nen{font:400 clamp(22px,2.4vw,32px)/.95 var(--f-display);letter-spacing:.01em}
.tcard .meta{display:flex;flex-wrap:wrap;gap:6px 10px;align-items:center}
.tcard .label{color:var(--dim)}
@media (max-width:520px){.tcard .chip{font-size:10px;letter-spacing:.08em;padding:3px 6px}html[lang="ar"] .tcard .chip{font-size:12px}.tcard .meta .label{display:none}}

/* names: Arabic and English always shown together for a title */
.names{display:grid;gap:4px}
.names .nar{font:800 clamp(36px,4.6vw,60px)/1.15 var(--f-ar-display)}
.names .nen{font:400 clamp(32px,4vw,52px)/.92 var(--f-display);letter-spacing:.01em;color:var(--dim)}
html[lang="ar"] .names{direction:rtl}
.names .nen{direction:ltr;unicode-bidi:isolate}
html[lang="ar"] .names .nen{text-align:right}

/* ---------- sections ---------- */
.sec{padding-block:72px}
@media (min-width:900px){.sec{padding-block:112px}}
.sec-h{display:grid;gap:18px;margin-bottom:40px}
.h2{font:400 clamp(44px,7vw,96px)/.9 var(--f-display);text-transform:uppercase}
html[lang="ar"] .h2{font:800 clamp(38px,5.6vw,72px)/1.2 var(--f-ar-display)}

/* facts list */
.facts{display:grid;margin:0;border-top:1px solid var(--line-2)}
.facts>div{display:grid;grid-template-columns:minmax(96px,34%) 1fr;gap:16px;padding:12px 0;border-bottom:1px solid var(--line)}
.facts dt{font:700 11px/22px var(--f-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
html[lang="ar"] .facts dt{letter-spacing:0;font:700 14px/26px var(--f-ar)}
.facts dd{margin:0;min-width:0;color:var(--paper)}

/* flagship band: AHEIMER WAVES */
.flag{position:relative;isolation:isolate;overflow:hidden;border-block:1px solid var(--line);background:#06090D}
.flag>.bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;opacity:.62}
.flag::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(6,9,13,.94) 0%,rgba(6,9,13,.72) 46%,rgba(6,9,13,.25) 100%),linear-gradient(0deg,var(--ground) 0%,rgba(8,10,11,0) 32%)}
html[dir="rtl"] .flag::after{background:linear-gradient(270deg,rgba(6,9,13,.94) 0%,rgba(6,9,13,.72) 46%,rgba(6,9,13,.25) 100%),linear-gradient(0deg,var(--ground) 0%,rgba(8,10,11,0) 32%)}
.flag .wrap{padding-block:72px 64px;display:grid;gap:36px}
@media (min-width:980px){.flag .wrap{grid-template-columns:minmax(0,5fr) minmax(0,6fr);align-items:center;padding-block:120px 96px;gap:64px}}
.flag .wrap.flag-shots{grid-template-columns:minmax(0,1fr);padding-block:0 72px}
.flag .logo{width:min(320px,68vw);height:auto;filter:drop-shadow(0 10px 40px rgba(0,0,0,.6))}
.flag .copy{display:grid;gap:22px;min-width:0}
.flag .desc{font-size:clamp(17px,1.5vw,20px);color:var(--paper);max-width:56ch}
.pillars{display:flex;flex-wrap:wrap;gap:6px 18px;font:400 30px/1 var(--f-display);letter-spacing:.02em}
html[lang="ar"] .pillars{font:800 24px/1.3 var(--f-ar-display)}
.pillars>span{display:flex;flex-wrap:wrap;gap:6px 18px}
.pillars>span>span:nth-child(4){color:var(--aw)}
.shots{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding-block:10px 0}
.shots figure{margin:0;position:relative;overflow:hidden;border:1px solid var(--line);border-radius:12px;aspect-ratio:16/9;max-width:100%}
.shots figure:first-child{grid-column:1/-1}
.shots img{width:100%;height:100%;object-fit:cover}
@media (min-width:900px){.shots{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.shots figure:first-child{grid-column:auto}}

/* title rows (mini sections) */
.trow{display:grid;gap:36px;align-items:center}
@media (min-width:980px){.trow{grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:64px}.trow.flip{grid-template-columns:minmax(0,5fr) minmax(0,7fr)}.trow.flip .media{order:2}}
.trow .copy{display:grid;gap:22px;min-width:0}
.trow .pitch{color:var(--dim);max-width:52ch}
.trow-rail{margin-bottom:36px}

/* framed media */
.frame{position:relative;overflow:hidden;border:1px solid var(--line-2);border-radius:12px;background:var(--panel);max-width:100%}
.frame img{width:100%;height:auto}
.px{image-rendering:pixelated;image-rendering:crisp-edges}
.bl-media{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.bl-media .frame:first-child{grid-column:1/-1;border-color:color-mix(in srgb,var(--bl) 55%,var(--line-2))}
.bl-media .frame:not(:first-child) img{aspect-ratio:3/2;object-fit:cover}

/* phones */
.phones{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(8px,2vw,22px);align-items:start;padding-top:18px}

/* phones in their worlds */
.world{position:relative;isolation:isolate;overflow:hidden;border:1px solid var(--line-2);border-radius:12px;max-width:100%;min-width:0}
.world .phones{position:relative;z-index:2;width:80%;margin-inline:auto;gap:0 7%;padding:clamp(18px,3vw,30px) 0 clamp(26px,7%,52px)}
.world .phone{box-shadow:0 28px 30px -8px rgba(0,0,0,.55),0 0 0 1px rgba(0,0,0,.35)}
.media.two{max-width:560px}
.media.two .world .phones{grid-template-columns:repeat(2,minmax(0,1fr));width:62%;gap:0 10%}
.ms-world{background:#C9A16B}
.ms-world .sky{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 60%;z-index:-2}
.ms-world .asphalt{position:absolute;inset:0;width:100%;height:100%;z-index:-1}
.ms-world .gantry{top:30px;z-index:1}
.ms-world .sign.mini{position:relative;z-index:1;margin:14px auto 0;width:max-content;max-width:calc(100% - 28px);padding:6px 16px 7px;gap:2px;border-width:2px;border-radius:9px;box-shadow:0 0 0 3px var(--ms),0 10px 24px rgba(0,0,0,.35)}
.ms-world .sign.mini .nar{font:800 clamp(22px,2.4vw,30px)/1.3 var(--f-ar-display)}
.ms-world .sign.mini .nen{font:800 10.5px/1 var(--f-sans);letter-spacing:.32em;padding-left:.32em;direction:ltr}
.ms-world .phones{padding-top:clamp(16px,2.4vw,26px)}
.ms-world.bare .phones{padding-top:clamp(36px,6vw,64px)}
.dl-world{background:var(--dl-paper)}
.nlabel{position:absolute;z-index:0;left:-5%;right:-5%;top:0;padding:22px 9% 0;transform:rotate(-2.5deg);background:var(--dl-paper);color:var(--dl-ink);font-family:var(--f-sans);direction:ltr}
.nlabel span[lang="ar"]{font-family:var(--f-ar);text-align:right}
.nlabel .nh{display:flex;justify-content:space-between;align-items:baseline;gap:12px;font:900 clamp(24px,3vw,38px)/1.1 var(--f-sans);letter-spacing:-.01em;padding-bottom:6px;border-bottom:2px solid var(--dl-ink)}
.nlabel .nh span[lang="ar"]{font:800 clamp(20px,2.6vw,32px)/1.3 var(--f-ar)}
.nlabel .ns{display:flex;justify-content:space-between;font-size:14px;padding:5px 0;border-bottom:9px solid var(--dl-ink);color:var(--dl-ink-2)}
.nlabel .r{display:grid;grid-template-columns:1fr auto 1fr;gap:12px;align-items:baseline;padding:7px 0;border-bottom:1px solid var(--dl-hair);font-size:15px}
.nlabel .r b{font:700 15px/1 "Roboto Mono",monospace}
.nlabel .r.k{border-bottom:4px solid var(--dl-ink)}
.nlabel .r.k span{font-weight:700}
.nlabel .ni{display:flex;justify-content:space-between;gap:16px;padding:8px 0 40px;font-size:13px;color:var(--dl-ink-2)}
.sweep{position:absolute;z-index:1;left:0;right:0;top:0;height:2px;background:var(--cyan);box-shadow:0 0 18px 4px rgba(75,192,200,.55);animation:sweepy 3.4s ease-in-out infinite alternate}
.sweep::after{content:"";position:absolute;left:0;right:0;bottom:2px;height:70px;background:linear-gradient(0deg,rgba(75,192,200,.22),rgba(75,192,200,0))}
@keyframes sweepy{from{top:3%}to{top:97%}}
.dl-world .phones{padding-top:clamp(92px,11vw,132px)}
.phone{margin:0;border:clamp(4px,.7vw,7px) solid #1B2124;border-radius:clamp(18px,3vw,34px);overflow:hidden;background:#000;box-shadow:0 24px 60px rgba(0,0,0,.55),0 0 0 1px var(--line-2);aspect-ratio:390/844;max-width:100%}
.phone img{width:100%;height:100%;object-fit:cover}


/* studio */
.points{display:grid;gap:0;border-top:2px solid var(--paper)}
.points>div{display:grid;gap:8px;padding:22px 0;border-bottom:1px solid var(--line)}
@media (min-width:900px){.points>div{grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:32px}}
.points h3{font:400 32px/1 var(--f-display);text-transform:uppercase}
html[lang="ar"] .points h3{font:700 26px/1.3 var(--f-ar-display)}
.points p{color:var(--dim);max-width:60ch}
.studio-grid{display:grid;gap:40px}
@media (min-width:980px){.studio-grid{grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:64px;align-items:start}}
.studio-grid .intro{display:grid;gap:22px}
.studio-grid .intro p{color:var(--dim);max-width:46ch}
.stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-block:1px solid var(--line-2)}
.stats>div{display:grid;gap:4px;padding:12px 12px 12px 0}
.stats>div+div{padding-inline-start:14px;border-inline-start:1px solid var(--line)}
.stats b{font:400 clamp(30px,3.4vw,44px)/.9 var(--f-display)}
html[lang="ar"] .stats b{font:800 clamp(22px,2.6vw,30px)/1.2 var(--f-ar-display)}
.stats span{font:700 10.5px/1.35 var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
html[lang="ar"] .stats span{letter-spacing:0;font:700 12.5px/1.5 var(--f-ar)}

/* contact */
.contact{background:var(--panel);border-top:1px solid var(--line)}
.contact .wrap{display:grid;gap:28px;padding-block:72px}
@media (min-width:980px){.contact .wrap{grid-template-columns:minmax(0,6fr) minmax(0,6fr);align-items:end;padding-block:104px}}
.mail{display:grid;gap:14px;padding:22px;border:1px solid var(--line-2);border-radius:12px;background:var(--ground)}
.mail .addr{font:500 clamp(22px,3vw,32px)/1.2 var(--f-mono);letter-spacing:.01em;word-break:break-all;user-select:all;direction:ltr;text-align:start}
html[dir="rtl"] .mail .addr{text-align:right}
.copied{font:700 12px/1 var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--cyan);min-height:14px}
html[lang="ar"] .copied{letter-spacing:0;font:700 14px/1 var(--f-ar)}

/* footer */
.foot{border-top:1px solid var(--line);padding-block:40px calc(40px + env(safe-area-inset-bottom, 0px));color:var(--muted);font-size:14px}
.foot .wrap{display:grid;gap:24px}
@media (min-width:900px){.foot .wrap{grid-template-columns:1fr auto;align-items:end}}
.foot .brand .lockup{height:52px}
.foot-links{display:flex;flex-wrap:wrap;gap:6px 20px}
.foot-links a{display:inline-flex;align-items:center;min-height:40px;text-decoration:none;color:var(--dim)}
.foot-links a:hover{color:var(--paper)}

/* ---------- detail pages ---------- */
.crumb{display:flex;flex-wrap:wrap;gap:8px 16px;align-items:center;padding-block:20px}
.crumb a{display:inline-flex;align-items:center;gap:8px;min-height:40px;text-decoration:none}
.crumb a:hover{color:var(--paper)}
.dhero{position:relative;isolation:isolate;overflow:hidden}
.feat{display:grid;grid-template-columns:minmax(0,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:12px;overflow:hidden}
@media (min-width:640px){.feat{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1000px){.feat{grid-template-columns:repeat(3,minmax(0,1fr))}}
.feat>div{background:var(--ground);padding:24px;display:grid;gap:10px;align-content:start}
.feat h3{font:400 28px/1 var(--f-display);text-transform:uppercase;display:flex;gap:10px;align-items:center}
html[lang="ar"] .feat h3{font:700 22px/1.35 var(--f-ar-display)}
.feat p{color:var(--dim);font-size:16px}
html[lang="ar"] .feat p{font-size:17px}
.more{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:12px;list-style:none;margin:0;padding:0}
.more .tcard{aspect-ratio:4/3}
@media (max-width:640px){.more .tcard{aspect-ratio:1/1}}
.more .tcard>img.shot{object-position:center 16%}
.note{font-size:14px;color:var(--muted);max-width:70ch}

/* Shaikh al-Baloot detail */
.bl-page .wrap{display:grid;gap:36px;padding-block:24px 72px}
@media (min-width:980px){.bl-page .wrap{grid-template-columns:minmax(0,5fr) minmax(0,7fr);align-items:center;gap:56px}}
.bl-page .copy{display:grid;gap:22px;min-width:0}
.bl-page .pitch{color:var(--dim);max-width:54ch}
.bl-shot{border-color:color-mix(in srgb,var(--bl) 55%,var(--line-2));box-shadow:0 24px 60px rgba(0,0,0,.55)}
.frame img{display:block}
.bl-hero{border-bottom:1px solid var(--line)}
.bl-hero>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.bl-hero::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,var(--ground) 2%,rgba(8,10,11,.78) 40%,rgba(8,10,11,.2) 100%)}
.bl-hero .bl-in{display:grid;gap:22px;padding-block:min(30vw,300px) 56px}
.bl-hero .pitch{max-width:58ch;color:var(--paper)}
.brass{border:1px solid var(--bl);border-radius:12px;padding:22px;background:linear-gradient(180deg,rgba(216,189,130,.08),rgba(216,189,130,0))}
.brass .facts{border-top-color:rgba(216,189,130,.5)}
.brass .facts>div{border-bottom-color:rgba(216,189,130,.18)}
.gallery{display:grid;grid-template-columns:minmax(0,1fr);gap:16px}
@media (min-width:720px){.gallery{grid-template-columns:repeat(2,minmax(0,1fr))}}
.gallery .frame img{aspect-ratio:3/2;object-fit:cover}
.gallery figure{margin:0;display:grid;gap:8px}
.gallery figcaption{font-size:14px;color:var(--muted)}

/* Mishwar detail: the game's own road-sign language */
.sign{background:var(--ms);color:#fff;border:3px solid #fff;border-radius:14px;box-shadow:0 0 0 5px var(--ms),0 18px 40px rgba(0,0,0,.45);padding:22px 22px 18px;display:grid;justify-items:center;gap:6px;text-align:center;margin:5px}
.sign .nar{font:800 clamp(46px,7vw,84px)/1.25 var(--f-ar-display)}
.sign .nen{font:800 clamp(15px,1.6vw,20px)/1 var(--f-sans);letter-spacing:.32em;padding-left:.32em;direction:ltr}
.sign .rule{width:100%;height:3px;background:#fff;border-radius:1px;margin-block:10px 4px}
.sign .tag{font:800 clamp(16px,1.8vw,20px)/1.5 var(--f-ar)}
.sign .tag.en{font-family:var(--f-sans);font-weight:500}
.ms-hero .wrap{display:grid;gap:40px;padding-block:24px 72px}
@media (min-width:980px){.ms-hero .wrap{grid-template-columns:minmax(0,6fr) minmax(0,6fr);align-items:center;gap:64px}}
.ms-hero .copy{display:grid;gap:24px;min-width:0}
.roads{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,270px),1fr));gap:10px}
.road{display:grid;grid-template-columns:auto 1fr;gap:4px 12px;align-items:start;padding:12px 14px;border-radius:10px;background:#3A4146;border:2px solid #C3C8CC}
.road .n{grid-row:span 3;display:grid;place-items:center;min-width:30px;height:30px;padding:0 4px;border-radius:6px;background:var(--ms-sign);color:var(--dl-ink);font:900 16px/1 var(--f-sans)}
.road b{font-weight:700;line-height:1.3}
.road small{font-size:14px;color:#D8DDE0;line-height:1.4}
.road .boss{color:#FFC9C2;font-weight:700;font-size:14px}
.road.endless{background:var(--ms);border-color:#fff}
.road.endless .n{background:var(--ms-yellow)}
.drivers{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:minmax(0,1fr);gap:12px}
@media (min-width:640px){.drivers{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1100px){.drivers{grid-template-columns:repeat(4,minmax(0,1fr))}}
.drv{display:grid;gap:10px;align-content:start;padding:18px;border-radius:12px;background:var(--ms);border:2px solid #fff;box-shadow:0 0 0 4px var(--ms);margin:4px;color:#fff}
.drv h3{font:800 22px/1.25 var(--f-sans)}
html[lang="ar"] .drv h3{font:800 22px/1.5 var(--f-ar-display)}
.drv .car{font:700 11px/1 var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:#CFE5DA;padding-bottom:10px;border-bottom:2px solid rgba(255,255,255,.85)}
html[lang="ar"] .drv .car{letter-spacing:0;font:700 13px/1.4 var(--f-ar)}
.drv .ab{display:grid;gap:3px}
.drv .ab .k{justify-self:start;padding:3px 8px;border-radius:4px;font:700 10.5px/1.2 var(--f-mono);letter-spacing:.12em;text-transform:uppercase}
html[lang="ar"] .drv .ab .k{letter-spacing:0;font:700 12px/1.3 var(--f-ar)}
.drv .atk .k{background:var(--ms-yellow);color:#131713}
.drv .def .k{background:#0A4FA3;color:#fff;box-shadow:0 0 0 1px #fff}
.drv .perk .k{background:transparent;color:#fff;box-shadow:inset 0 0 0 1px rgba(255,255,255,.8)}
.drv .ab b{font-weight:700;line-height:1.35}
.drv .ab small{font-size:14px;line-height:1.45;color:#D9EBE2}
.pups{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:0}
.pups li{padding:8px 12px;border-radius:8px;background:#0A4FA3;border:2px solid #fff;color:#fff;font-weight:700;font-size:15px}
.pups li.on{background:var(--ms);box-shadow:0 0 0 2px var(--ms-yellow)}

/* Daleel detail: the app's printed-label language */
.dl-hero .wrap{display:grid;gap:40px;padding-block:24px 72px}
@media (min-width:980px){.dl-hero .wrap{grid-template-columns:minmax(0,5fr) minmax(0,7fr);align-items:center;gap:64px}}
.paper{background:var(--dl-paper);color:var(--dl-ink);border-radius:4px;padding:22px 22px 18px;box-shadow:0 20px 50px rgba(0,0,0,.45);max-width:100%}
.paper .top-rule{height:10px;background:var(--dl-ink);margin:-22px -22px 18px}
.paper .nar{font:800 clamp(56px,8vw,88px)/1.1 var(--f-ar-display)}
.paper .nen{font:800 clamp(30px,3.6vw,40px)/1 var(--f-sans);letter-spacing:-.01em}
.paper .tag{color:var(--dl-ink-2);margin-top:6px}
.label-panel{border:2px solid var(--dl-ink);padding:10px 14px;background:var(--dl-paper);color:var(--dl-ink);max-width:460px;font-family:var(--f-sans)}
.label-panel h3{font:900 30px/1 var(--f-sans);letter-spacing:-.01em;border-bottom:1px solid var(--dl-ink);padding-bottom:6px}
html[lang="ar"] .label-panel h3{font:700 28px/1.3 var(--f-ar-display)}
.label-panel .sub{font-size:14px;color:var(--dl-ink-2);padding-block:4px 6px;border-bottom:8px solid var(--dl-ink)}
.label-panel .row{display:flex;justify-content:space-between;gap:16px;padding:7px 0;border-bottom:1px solid var(--dl-hair);font-size:15px}
.label-panel .row.thick{border-bottom:4px solid var(--dl-ink)}
.label-panel .row b{font-weight:700}
.label-panel .row span:last-child{font-family:"Roboto Mono",var(--f-ar);font-weight:700;white-space:nowrap;direction:ltr}
.label-panel .foot-note{font-size:12px;color:var(--dl-ink-2);padding-top:8px}
.ev{display:grid;gap:10px;list-style:none;margin:0;padding:0}
.ev li{display:flex;gap:10px;align-items:baseline}
.ev i{flex:none;width:10px;height:10px;background:var(--e)}
.goals{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,180px),1fr));gap:8px;list-style:none;margin:0;padding:0}
.goals li{border:1px solid var(--line-2);border-radius:8px;padding:10px 12px;display:grid;gap:2px}
.goals small{color:var(--muted);font-size:13px;line-height:1.4}

.reveal{animation:rise .7s cubic-bezier(.2,.7,.2,1) both}
.reveal.d1{animation-delay:.06s}.reveal.d2{animation-delay:.12s}.reveal.d3{animation-delay:.18s}.reveal.d4{animation-delay:.24s}
@keyframes rise{from{transform:translateY(14px)}to{transform:none}}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}