@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 400 800;
  font-stretch: 62% 125%;
  font-display: swap;
  src: url(fonts/archivo-latin-normal-400-800.510b8100.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Bodoni Moda';
  font-style: italic;
  font-weight: 400 700;
  font-display: swap;
  src: url(fonts/bodoni-moda-latin-italic-400-700.9d952bcb.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Bodoni Moda';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url(fonts/bodoni-moda-latin-normal-400-700.fe6c560d.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Cairo';
  font-style: normal;
  font-weight: 300 800;
  font-display: swap;
  src: url(fonts/cairo-arabic-normal-300-800.4233697b.woff2) format('woff2');
  unicode-range: U+0600-06FF, U+0750-077F, U+0870-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC, U+102E0-102FB, U+10E60-10E7E, U+10EC2-10EC7, U+10EC9-10EEE, U+10EF0-10EFF, U+1EE00-1EE03, U+1EE05-1EE1F, U+1EE21-1EE22, U+1EE24, U+1EE27, U+1EE29-1EE32, U+1EE34-1EE37, U+1EE39, U+1EE3B, U+1EE42, U+1EE47, U+1EE49, U+1EE4B, U+1EE4D-1EE4F, U+1EE51-1EE52, U+1EE54, U+1EE57, U+1EE59, U+1EE5B, U+1EE5D, U+1EE5F, U+1EE61-1EE62, U+1EE64, U+1EE67-1EE6A, U+1EE6C-1EE72, U+1EE74-1EE77, U+1EE79-1EE7C, U+1EE7E, U+1EE80-1EE89, U+1EE8B-1EE9B, U+1EEA1-1EEA3, U+1EEA5-1EEA9, U+1EEAB-1EEBB, U+1EEF0-1EEF1;
}
@font-face {
  font-family: 'Cairo';
  font-style: normal;
  font-weight: 300 800;
  font-display: swap;
  src: url(fonts/cairo-latin-normal-300-800.f5513930.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Jost';
  font-style: normal;
  font-weight: 300 600;
  font-display: swap;
  src: url(fonts/jost-latin-normal-300-600.180347d9.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Tajawal';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/tajawal-arabic-normal-400.27fee47d.woff2) format('woff2');
  unicode-range: U+0600-06FF, U+0750-077F, U+0870-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC, U+102E0-102FB, U+10E60-10E7E, U+10EC2-10EC7, U+10EC9-10EEE, U+10EF0-10EFF, U+1EE00-1EE03, U+1EE05-1EE1F, U+1EE21-1EE22, U+1EE24, U+1EE27, U+1EE29-1EE32, U+1EE34-1EE37, U+1EE39, U+1EE3B, U+1EE42, U+1EE47, U+1EE49, U+1EE4B, U+1EE4D-1EE4F, U+1EE51-1EE52, U+1EE54, U+1EE57, U+1EE59, U+1EE5B, U+1EE5D, U+1EE5F, U+1EE61-1EE62, U+1EE64, U+1EE67-1EE6A, U+1EE6C-1EE72, U+1EE74-1EE77, U+1EE79-1EE7C, U+1EE7E, U+1EE80-1EE89, U+1EE8B-1EE9B, U+1EEA1-1EEA3, U+1EEA5-1EEA9, U+1EEAB-1EEBB, U+1EEF0-1EEF1;
}
@font-face {
  font-family: 'Tajawal';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/tajawal-latin-normal-400.4743f7bf.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Tajawal';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(fonts/tajawal-arabic-normal-500.2a5446b9.woff2) format('woff2');
  unicode-range: U+0600-06FF, U+0750-077F, U+0870-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC, U+102E0-102FB, U+10E60-10E7E, U+10EC2-10EC7, U+10EC9-10EEE, U+10EF0-10EFF, U+1EE00-1EE03, U+1EE05-1EE1F, U+1EE21-1EE22, U+1EE24, U+1EE27, U+1EE29-1EE32, U+1EE34-1EE37, U+1EE39, U+1EE3B, U+1EE42, U+1EE47, U+1EE49, U+1EE4B, U+1EE4D-1EE4F, U+1EE51-1EE52, U+1EE54, U+1EE57, U+1EE59, U+1EE5B, U+1EE5D, U+1EE5F, U+1EE61-1EE62, U+1EE64, U+1EE67-1EE6A, U+1EE6C-1EE72, U+1EE74-1EE77, U+1EE79-1EE7C, U+1EE7E, U+1EE80-1EE89, U+1EE8B-1EE9B, U+1EEA1-1EEA3, U+1EEA5-1EEA9, U+1EEAB-1EEBB, U+1EEF0-1EEF1;
}
@font-face {
  font-family: 'Tajawal';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(fonts/tajawal-latin-normal-500.ff51e147.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Tajawal';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(fonts/tajawal-arabic-normal-700.ab2e4bbd.woff2) format('woff2');
  unicode-range: U+0600-06FF, U+0750-077F, U+0870-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC, U+102E0-102FB, U+10E60-10E7E, U+10EC2-10EC7, U+10EC9-10EEE, U+10EF0-10EFF, U+1EE00-1EE03, U+1EE05-1EE1F, U+1EE21-1EE22, U+1EE24, U+1EE27, U+1EE29-1EE32, U+1EE34-1EE37, U+1EE39, U+1EE3B, U+1EE42, U+1EE47, U+1EE49, U+1EE4B, U+1EE4D-1EE4F, U+1EE51-1EE52, U+1EE54, U+1EE57, U+1EE59, U+1EE5B, U+1EE5D, U+1EE5F, U+1EE61-1EE62, U+1EE64, U+1EE67-1EE6A, U+1EE6C-1EE72, U+1EE74-1EE77, U+1EE79-1EE7C, U+1EE7E, U+1EE80-1EE89, U+1EE8B-1EE9B, U+1EEA1-1EEA3, U+1EEA5-1EEA9, U+1EEAB-1EEBB, U+1EEF0-1EEF1;
}
@font-face {
  font-family: 'Tajawal';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(fonts/tajawal-latin-normal-700.f74b378c.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
:root {
  --navy-950: oklch(0.086 0.06 264.1);
  --navy-900: oklch(0.159 0.072 261.7);
  --navy-800: oklch(0.208 0.09 261.1);
  --navy-600: oklch(0.284 0.135 262.4);
  --gold: oklch(0.788 0.039 75.1);
  --gold-deep: oklch(0.626 0.085 79.9);
  --sand: oklch(0.886 0.025 71.4);
  --ivory: oklch(0.94 0.017 76.1);
  --sky: oklch(0.718 0.098 243.7);
  --sky-pale: oklch(0.86 0.06 240);
  --emerald: oklch(0.662 0.114 173);
  --onyx: oklch(0.146 0.003 68.6);
  --ink: oklch(0.193 0.005 67.5);
  --white: oklch(0.985 0.004 80);

  --f-display: 'Bodoni Moda', 'Didot', 'Times New Roman', serif;
  --f-text: 'Jost', 'Avenir Next', 'Helvetica Neue', Arial, sans-serif;
  --f-city: 'Archivo', 'Arial Narrow', Arial, sans-serif;

  --t-xxl: clamp(3rem, 1.6rem + 7vw, 9rem);
  --t-xl: clamp(2.5rem, 1.7rem + 4.2vw, 5.75rem);
  --t-l: clamp(1.9rem, 1.4rem + 2.3vw, 3.5rem);
  --t-m: clamp(1.3rem, 1.15rem + 0.8vw, 1.85rem);
  --t-lead: clamp(1.0625rem, 1rem + 0.35vw, 1.3125rem);
  --t-small: 0.9rem;

  --pad: clamp(1.25rem, 4.2vw, 4.5rem);
  --top: calc(var(--pad) + 3.25rem);
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --fg: var(--white);
  --soft: color-mix(in oklab, var(--fg) 80%, transparent);
  --accent: var(--gold);
  --ui: var(--white);
  --scrim: 0 0 20;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; background: var(--navy-950); }
body {
  margin: 0; background: var(--navy-950); color: var(--fg);
  font: 400 1rem/1.6 var(--f-text); font-kerning: normal; -webkit-font-smoothing: antialiased;
  overflow-x: clip;
}
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-stopped { overflow: hidden; }
img, svg, video { display: block; max-width: 100%; }
h1, h2, h3, h4, p, ol, ul, figure, blockquote, address { margin: 0; padding: 0; }
ol, ul { list-style: none; }
address { font-style: normal; }
a { color: inherit; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 4px; border-radius: 2px; }

.skip { position: fixed; inset-inline-start: 1rem; top: -4rem; z-index: 40; padding: 0.6rem 1rem; background: var(--white); color: var(--navy-950); text-decoration: none; }
.skip:focus { top: 1rem; }
.skip--plain { border: 0; font: inherit; cursor: pointer; }
.static .skip--plain, .no-js .skip--plain { display: none; }

#stage { position: fixed; top: 0; left: 0; width: 100%; height: 100vh; height: 100lvh; z-index: 0; display: none; }
.film #stage { display: block; }
main { position: relative; z-index: 1; }
.shot, .flow { color: var(--fg); }
.shot, .flow, .on-dark, .es__facts { --soft: color-mix(in oklab, var(--fg) 82%, transparent); --mute: color-mix(in oklab, var(--fg) 68%, transparent); }

/* type */
.ln { display: block; overflow: hidden; padding-block: 0.12em; margin-block: -0.12em; }
.ln > span { display: block; }
@media (min-width: 720px) { .ln { white-space: nowrap; } }
.h-xxl, .h-xl, .h-l { font-family: var(--f-display); font-weight: 400; line-height: 1.02; letter-spacing: -0.012em; text-wrap: balance; }
.h-xxl { font-size: var(--t-xxl); }
.h-xl { font-size: var(--t-xl); }
.h-l { font-size: var(--t-l); line-height: 1.06; }
.lead { font-size: var(--t-lead); line-height: 1.55; color: var(--soft); max-width: 34rem; text-wrap: pretty; }
.body { color: var(--soft); max-width: 32rem; text-wrap: pretty; }
.note { font-size: var(--t-small); color: var(--mute, var(--soft)); max-width: 30rem; }
.slate { font-size: var(--t-small); letter-spacing: 0.04em; color: var(--accent); }
.slate::before { content: ''; display: inline-block; width: 1.75rem; height: 1px; margin-inline-end: 0.75rem; vertical-align: 0.3em; background: currentColor; }
.beat__in > * + * { margin-top: 1.1rem; }
.beat__in > .slate + * { margin-top: 0.9rem; }

.act-city { --accent: var(--sky-pale); }
.act-city .h-xxl, .act-city .h-xl, .act-city .h-l {
  font-family: var(--f-city); font-stretch: 66%; font-weight: 700; text-transform: uppercase; letter-spacing: 0; line-height: 0.94;
}
.act-city .h-l { font-stretch: 72%; }
.act-jc { --accent: var(--gold); --scrim: 8 7 6; }
.act-es { --accent: var(--gold-deep); --fg: var(--ink); }
.act-es .h-xl, .act-es .h-l { font-family: var(--f-text); font-weight: 300; text-transform: uppercase; letter-spacing: 0.16em; line-height: 1.14; }
.act-es .h-xl { font-size: clamp(2rem, 1.4rem + 3.2vw, 4.5rem); }
.on-dark { --fg: var(--white); --accent: var(--gold); color: var(--fg); }

.btn {
  display: inline-flex; align-items: center; min-height: 3rem; padding: 0.7rem 1.5rem; border: 1px solid var(--accent);
  color: var(--fg); text-decoration: none; font-size: 1rem; letter-spacing: 0.02em; transition: background-color 0.25s var(--ease), color 0.25s var(--ease);
}
.btn:hover, .btn:focus-visible { background: var(--accent); color: var(--navy-950); }
.link { display: inline-block; padding-block: 0.4rem; color: var(--fg); text-decoration: underline; text-decoration-color: var(--accent); text-underline-offset: 0.35em; text-decoration-thickness: 1px; transition: text-underline-offset 0.25s var(--ease); }
.link:hover, .link:focus-visible { text-underline-offset: 0.55em; }
.quote p { font-family: var(--f-display); font-size: clamp(1.35rem, 1.05rem + 1.5vw, 2.4rem); line-height: 1.3; text-wrap: balance; }
.quote p::before { content: '\201C'; }
.quote p::after { content: '\201D'; }
[lang='ar'] .quote p::before { content: '\00AB'; }
[lang='ar'] .quote p::after { content: '\00BB'; }
.quote footer { margin-top: 1rem; font-size: var(--t-small); color: var(--accent); }
.logo { display: inline-block; background: currentColor; -webkit-mask-position: center; mask-position: center; -webkit-mask-size: contain; mask-size: contain; -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; }

/* chrome */
.chrome { position: fixed; inset: 0 0 auto 0; z-index: 10; display: flex; align-items: center; justify-content: space-between; padding: 1.1rem var(--pad); color: var(--ui); pointer-events: none; transition: color 0.4s var(--ease); }
.chrome > * { pointer-events: auto; }
.chrome::before { content: ''; position: absolute; inset: 0 0 -2rem 0; z-index: -1; pointer-events: none; background: linear-gradient(rgb(0 0 20 / 0.42), rgb(0 0 20 / 0)); opacity: 0; transition: opacity 0.4s var(--ease); }
.film[data-tone='dark'] .chrome::before { opacity: 1; }
.menu-open .chrome::before { opacity: 0; }
.chrome__logo { display: block; }
.logo--chrome { width: 8.25rem; height: 2.25rem; }
.chrome__side { display: flex; align-items: center; gap: clamp(0.75rem, 2vw, 1.75rem); }
.chrome__lang { padding: 0.55rem 0.25rem; text-decoration: none; font-size: 0.95rem; }
.chrome__lang:hover { text-decoration: underline; text-underline-offset: 0.3em; }
.chrome__menu { display: inline-flex; align-items: center; gap: 0.7rem; min-height: 2.75rem; padding: 0.4rem 0; border: 0; background: none; color: inherit; font: inherit; font-size: 0.95rem; cursor: pointer; }
.chrome__menu i { position: relative; width: 1.6rem; height: 0.5rem; border-block: 1px solid currentColor; transition: height 0.3s var(--ease); }
.chrome__menu[aria-expanded='true'] i { height: 0; }
html[data-tone='light'] { --ui: var(--navy-900); }
html.menu-open { --ui: var(--white); }

.chapters { position: fixed; inset: 0; z-index: 9; display: grid; align-content: center; padding: var(--top) var(--pad) var(--pad); background: color-mix(in oklab, var(--navy-950) 94%, transparent); opacity: 0; visibility: hidden; transition: opacity 0.35s var(--ease), visibility 0s 0.35s; }
.menu-open .chapters { opacity: 1; visibility: visible; transition-delay: 0s; }
.chapters ol { counter-reset: ch; display: grid; gap: clamp(0.4rem, 1.4vh, 1rem); }
.chapters a { display: inline-block; font-family: var(--f-display); font-size: clamp(1.6rem, 1.1rem + 2.6vw, 3.4rem); line-height: 1.15; text-decoration: none; color: var(--white); opacity: 0.72; transition: opacity 0.25s var(--ease), translate 0.35s var(--ease); }
.chapters a:hover, .chapters a:focus-visible { opacity: 1; translate: 0.6rem 0; }
[dir='rtl'] .chapters a:hover, [dir='rtl'] .chapters a:focus-visible { translate: -0.6rem 0; }

.gauge { position: fixed; top: 1.1rem; left: 50%; translate: -50% 0; z-index: 8; display: none; align-items: center; gap: 0.7rem; height: 2.75rem; color: var(--ui); font-size: 0.85rem; pointer-events: none; transition: color 0.4s var(--ease); }
.film .gauge { display: flex; }
.gauge svg { flex: none; width: 1.7rem; height: 1.7rem; rotate: -90deg; }
.gauge circle { fill: none; stroke: currentColor; stroke-width: 1.2; opacity: 0.3; }
.gauge .gauge__arc { opacity: 1; stroke-dasharray: 100; stroke-dashoffset: 100; }
.gauge__label { max-width: 34vw; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; opacity: 0.9; }

.loader { position: fixed; inset: 0; z-index: 30; display: none; place-items: center; background: var(--navy-950); color: var(--gold); }
.js .loader { display: grid; }
.loader svg { grid-area: 1 / 1; width: min(46vmin, 15rem); }
.loader circle { transform: rotate(-90deg); transform-origin: 60px 60px; }
.loader circle { fill: none; stroke: currentColor; stroke-width: 0.6; }
.loader__track { opacity: 0.2; }
.loader__arc { stroke-dasharray: 100; stroke-dashoffset: 100; transition: stroke-dashoffset 0.5s var(--ease); }
.logo--loader { grid-area: 1 / 1; width: min(15vmin, 5rem); height: min(16vmin, 5.4rem); }
.loader.is-done { opacity: 0; visibility: hidden; transition: opacity 0.7s var(--ease), visibility 0s 0.7s; }

/* film mode */
.film .shot { position: relative; height: calc(var(--len) * 100vh); height: calc(var(--len) * 100lvh); }
.film .frame { position: sticky; top: 0; height: 100vh; height: 100svh; overflow: hidden; overflow: clip; }
.film .still { display: none; }
.film .beat { position: absolute; inset: 0; display: grid; padding: var(--top) var(--pad) calc(var(--pad) + 0.6rem); opacity: 0; visibility: hidden; }
.film .beat::before { content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none; }
.film .beat--bl { align-content: end; justify-items: start; }
.film .beat--br { align-content: end; justify-items: end; }
.film .beat--l { align-content: center; justify-items: start; }
.film .beat--r { align-content: center; justify-items: end; }
.film .beat--c { place-content: center; justify-items: center; text-align: center; }
.film .beat--c .lead, .film .beat--c .body { margin-inline: auto; }
.film .beat--bl::before, .film .beat--l::before { background: linear-gradient(to top right, rgb(var(--scrim) / 0.82) 0%, rgb(var(--scrim) / 0.46) 30%, rgb(var(--scrim) / 0) 60%); }
.film .beat--br::before, .film .beat--r::before { background: linear-gradient(to top left, rgb(var(--scrim) / 0.82) 0%, rgb(var(--scrim) / 0.46) 30%, rgb(var(--scrim) / 0) 60%); }
[dir='rtl'].film .beat--bl::before, [dir='rtl'].film .beat--l::before { background: linear-gradient(to top left, rgb(var(--scrim) / 0.82) 0%, rgb(var(--scrim) / 0.46) 30%, rgb(var(--scrim) / 0) 60%); }
[dir='rtl'].film .beat--br::before, [dir='rtl'].film .beat--r::before { background: linear-gradient(to top right, rgb(var(--scrim) / 0.82) 0%, rgb(var(--scrim) / 0.46) 30%, rgb(var(--scrim) / 0) 60%); }
.film .beat--c::before { background: radial-gradient(ellipse 70% 62% at 50% 50%, rgb(var(--scrim) / 0.6) 0%, rgb(var(--scrim) / 0) 100%); }
.beat__in { max-width: min(100%, 72rem); }
.beat__in--wide .lead, .beat__in--wide .body { max-width: 40rem; }
.anchor { position: absolute; top: 0; }
.film .anchor { top: calc(var(--at) * 100vh); top: calc(var(--at) * 100lvh); }
.win { pointer-events: none; margin-inline: auto; }
.film .act-es .beat--c::before { background: none; }

/* hero */
.hero { position: relative; display: grid; justify-items: center; gap: 1.25rem; padding: var(--top) var(--pad) var(--pad); text-align: center; color: var(--ivory); }
.film .hero { position: absolute; inset: 0; align-content: center; }
.wm { --wm: clamp(3.3rem, 17.2vw, 19rem); font: 300 var(--wm)/1 var(--f-text); color: var(--gold); }
.wm__row { display: flex; align-items: center; justify-content: center; gap: 0.19em; }
.wm__l { display: block; }
.wm__o { flex: none; width: 0.735em; height: 0.735em; border: 0.037em solid currentColor; border-radius: 50%; }
.static .wm__o, .no-js .wm__o { border-width: 0.06em; }
.wm__sub { display: block; margin-top: 0.75em; font-size: clamp(0.72rem, 1.9vw, 1.6rem); letter-spacing: 0.72em; text-indent: 0.72em; text-transform: uppercase; color: var(--ivory); }
.hero__line { max-width: 31rem; margin-top: clamp(1rem, 4vh, 2.75rem); font-size: var(--t-lead); line-height: 1.5; text-wrap: balance; }
.hero__news { display: inline-flex; align-items: baseline; gap: 0.7rem; max-width: 34rem; padding: 0.5rem 0; font-size: var(--t-small); color: var(--sky-pale); text-decoration: none; text-align: start; }
.hero__news:hover { text-decoration: underline; text-underline-offset: 0.3em; }
.hero__dot { flex: none; width: 0.5rem; height: 0.5rem; border-radius: 50%; background: var(--sky); translate: 0 -0.05em; }
.hero__cue { display: none; }
.film .hero__cue { display: block; position: absolute; inset-inline: 0; bottom: 1.4rem; font-size: 0.85rem; letter-spacing: 0.08em; color: color-mix(in oklab, var(--ivory) 70%, transparent); }
.film .hero__cue span { display: inline-block; padding-bottom: 2.6rem; background: linear-gradient(currentColor, currentColor) 50% 100% / 1px 2rem no-repeat; animation: cue 2.4s var(--ease) infinite; }
@keyframes cue { 0% { background-size: 1px 0; background-position: 50% calc(100% - 2rem); } 50% { background-size: 1px 2rem; background-position: 50% 100%; } 100% { background-size: 1px 0; background-position: 50% 100%; } }

/* pins on the masterplan */
.pins { display: none; }
.film .pins { display: block; position: absolute; inset: 0; pointer-events: none; }
.pin { position: absolute; left: 0; top: 0; direction: ltr; display: flex; align-items: center; gap: 0.6rem; opacity: 0; white-space: nowrap; font-size: 0.9rem; color: var(--white); will-change: transform, opacity; }
.pin i { flex: none; width: 0.6rem; height: 0.6rem; margin: -0.3rem 0 0 -0.3rem; border-radius: 50%; background: var(--white); box-shadow: 0 0 0 0.3rem rgb(255 255 255 / 0.22); }
.pin b { font-weight: 400; padding: 0.2rem 0.65rem; background: rgb(0 0 20 / 0.62); }

/* strip */
.shot--strip { --card-h: min(46svh, 52vw); }
.film .shot--strip { --fg: var(--navy-900); --accent: var(--navy-600); }
.strip__head { padding: 0 var(--pad) clamp(1rem, 3vh, 2rem); }
.static .strip__head, .no-js .strip__head { padding-top: var(--top); }
.strip__head .lead { margin-top: 0.9rem; }
.strip__track { display: flex; gap: clamp(0.75rem, 1.6vw, 1.6rem); padding: 0 var(--pad); width: max-content; }
.card { position: relative; width: calc(var(--card-h) * 1.62); flex: none; color: var(--white); }
.card__media { height: var(--card-h); overflow: hidden; background: var(--navy-800); }
.card__media img { width: 118%; max-width: none; height: 100%; object-fit: cover; margin-inline-start: -9%; }
.card__cap { position: absolute; inset: auto 0 0 0; padding: 4rem clamp(1rem, 1.6vw, 1.6rem) clamp(0.9rem, 1.4vw, 1.4rem); background: linear-gradient(to top, rgb(0 0 20 / 0.84), rgb(0 0 20 / 0)); }
.card__name { font: 700 var(--t-m)/1 var(--f-city); font-stretch: 72%; text-transform: uppercase; }
.card__line { margin-top: 0.3rem; color: rgb(255 255 255 / 0.86); }
.card--text { display: grid; align-content: center; width: min(78vw, 26rem); height: var(--card-h); padding-inline: clamp(1rem, 3vw, 2.5rem); color: var(--fg); border-inline-start: 1px solid currentColor; }
@media (min-width: 821px) {
  .film .strip__head { display: flex; align-items: end; justify-content: space-between; gap: 2rem; }
  .film .strip__head h2 { display: flex; gap: 0.2em; }
  .film .strip__head .lead { max-width: 25rem; margin: 0 0 0.5rem; }
  .film .shot--strip { --card-h: min(58svh, 37vw); }
}
.film .shot--strip .frame { display: grid; grid-template-columns: minmax(0, 1fr); grid-template-rows: auto auto; align-content: end; padding-bottom: clamp(2rem, 6vh, 4rem); }
.film .strip__track { will-change: transform; }

/* chapter and homes */
.logo--mc { width: min(64vw, 19rem); height: min(17vw, 5.1rem); margin-bottom: 0.6rem; }
.film .cap .beat__in { max-width: 30rem; }
.cap .btn { margin-top: 0.4rem; }
.homes__rail { display: none; }
.film .homes__rail { display: block; position: absolute; inset-block-start: var(--top); inset-inline-end: var(--pad); text-align: end; z-index: 2; }
.homes__index { margin-top: 0.9rem; display: grid; gap: 0.3rem; font: 700 1.05rem/1.2 var(--f-city); font-stretch: 78%; text-transform: uppercase; }
.homes__index li { opacity: 0.42; transition: opacity 0.3s var(--ease); }
.homes__index li.is-on { opacity: 1; color: var(--sky-pale); }

/* clock */
.clock { display: grid; gap: var(--pad); padding: var(--top) var(--pad) var(--pad); }
.film .clock { position: absolute; inset: 0; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); align-items: center; }
.film .clock::before { content: ''; position: absolute; inset: 0; z-index: -1; background: rgb(0 0 20 / 0.5); }
.clock__dial { width: min(100%, 68svh); justify-self: center; overflow: visible; }
.clock__dial .ring { fill: none; stroke: rgb(255 255 255 / 0.28); stroke-width: 1; }
.clock__dial .tk { stroke: rgb(255 255 255 / 0.5); stroke-width: 1; }
.clock__dial .tk--m { stroke: var(--white); stroke-width: 1.6; }
.clock__dial .num { fill: rgb(255 255 255 / 0.7); font: 400 18px var(--f-text); text-anchor: middle; }
.clock__dial .dot { fill: var(--navy-950); stroke: var(--sky); stroke-width: 2; }
.clock__dial .dot.is-on { fill: var(--sky); }
.clock__dial .arc { fill: none; stroke: var(--sky); stroke-width: 3; stroke-dasharray: 100; stroke-dashoffset: 100; }
.clock__dial .hand line { stroke: var(--white); stroke-width: 1.6; }
.clock__dial .hand circle { fill: var(--white); }
.clock__dial .hand { transform-origin: 300px 300px; }
.clock__dial .big { fill: var(--white); font: 700 150px/1 var(--f-city); font-stretch: 66%; text-anchor: middle; }
.clock__dial .unit { fill: var(--sky-pale); font: 400 22px var(--f-text); text-anchor: middle; }
.clock__copy > * + * { margin-top: 1.1rem; }
.clock__list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.15rem 1.5rem; max-width: 34rem; }
.clock__list li { display: flex; align-items: baseline; gap: 0.4rem; padding-block: 0.34rem; border-bottom: 1px solid rgb(255 255 255 / 0.16); }
.film .clock__list li { opacity: 0.38; transition: opacity 0.3s var(--ease); }
.film .clock__list li.is-on { opacity: 1; }
.clock__list .m { min-width: 1.25rem; font: 700 1.5rem/1 var(--f-city); font-stretch: 70%; color: var(--sky-pale); white-space: nowrap; }
.clock__list .n { margin-inline-start: 0.5rem; }
.clock__list .u { font-size: 0.8rem; color: var(--soft); }
.clock__list .n { font-size: 0.98rem; }

/* record */
.record__photo { width: min(60vw, 26rem); }
.record__photo img { width: 100%; height: auto; }
.record__photo figcaption { margin-top: 0.5rem; font-size: var(--t-small); color: var(--soft); }
.film .record__photo { position: absolute; inset-inline-end: var(--pad); top: 50%; width: min(34vw, 30rem); opacity: 0; }
.film .record__photo img { box-shadow: 0 1.5rem 4rem rgb(0 0 20 / 0.5); }
.shot--record .btn { margin-top: 1.5rem; }

/* jacob */
.rings { display: none; }
.film .rings { display: block; position: absolute; left: 50%; top: 50%; width: min(150vmin, 150svh); translate: -50% -50%; opacity: 0; overflow: visible; }
.rings circle { fill: none; stroke: var(--gold); stroke-width: 0.6; opacity: 0.7; }
.rings line { stroke: var(--gold); stroke-width: 0.8; opacity: 0.8; }
.mv { transform-origin: 400px 400px; }
.win--jc { width: min(46vw, 27svh); height: min(60vw, 35svh); margin-bottom: 1.6rem; }
.logo--jc { width: min(62vw, 20rem); height: min(9vw, 2.9rem); color: var(--white); }
.jc__by { margin-top: 0.5rem !important; font-size: var(--t-small); letter-spacing: 0.3em; text-transform: uppercase; color: var(--gold); }
.dial { display: none; }
.film .dial { display: block; position: absolute; left: 0; top: 0; width: 100px; height: 100px; opacity: 0; overflow: visible; pointer-events: none; }
.dial circle { fill: none; stroke: var(--gold); stroke-width: 0.8; }
.dial line { stroke: var(--gold); stroke-width: 1; }
.dial .dial__hand { stroke: var(--white); stroke-width: 1.2; transform-origin: 200px 200px; }
.ladder__list { display: grid; gap: 0.9rem; margin-top: 1rem; }
.ladder__list li { display: grid; grid-template-columns: clamp(5.5rem, 13vw, 10rem) 1fr; gap: 1.1rem; align-items: center; }
.ladder__list figure { aspect-ratio: 16 / 10; overflow: hidden; }
.ladder__list img { width: 100%; height: 100%; object-fit: cover; }
.ladder__list h4 { font: 400 var(--t-m)/1.15 var(--f-display); }
.ladder__list p { margin-top: 0.25rem; font-size: 0.98rem; color: var(--soft); }
.film .ladder::before { background: linear-gradient(to left, rgb(var(--scrim) / 0.86) 0%, rgb(var(--scrim) / 0.6) 42%, rgb(var(--scrim) / 0) 74%); }
[dir='rtl'].film .ladder::before { background: linear-gradient(to right, rgb(var(--scrim) / 0.86) 0%, rgb(var(--scrim) / 0.6) 42%, rgb(var(--scrim) / 0) 74%); }
.clubs__list { display: grid; gap: 2rem; }
.clubs__list h4 { margin-top: 0.9rem; font: 400 var(--t-m)/1.15 var(--f-display); }
.clubs__list p { margin-top: 0.25rem; font-size: 0.98rem; color: var(--soft); }
.film .clubs { align-content: center; justify-items: center; gap: clamp(1rem, 3vh, 2.2rem); text-align: center; }
.film .clubs__list { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(1rem, 4vw, 4rem); width: min(100%, 76rem); }
.film .clubs__list li { display: grid; justify-items: center; }
.win--club { width: min(100%, 15rem); aspect-ratio: 4 / 5; }

/* elie saab */
.win--es { width: min(44vw, 25svh); height: min(66vw, 38svh); margin-bottom: 1.4rem; }
.logo--es { width: clamp(5.5rem, 12vh, 8rem); height: auto; }
.es__title .slate { color: var(--gold-deep); }
.es__level { display: grid; justify-items: start; }
.film .es__tower { align-content: end; }
.film .es__level { position: absolute; inset-inline-end: var(--pad); top: 50%; translate: 0 -50%; justify-items: end; text-align: end; color: var(--navy-900); }
.es__label { font-size: var(--t-small); letter-spacing: 0.3em; text-transform: uppercase; }
.es__num { font: 300 clamp(5rem, 3rem + 12vw, 13rem)/0.95 var(--f-text); font-variant-numeric: tabular-nums; }
.es__of { font-size: 1.05rem; letter-spacing: 0.12em; }
.es__mark { margin-top: 1rem; padding: 0.3rem 0.8rem; font-size: var(--t-small); background: rgb(0 0 20 / 0.5); color: var(--white); opacity: 0; }
.film .es__facts { color: var(--white); --fg: var(--white); }
.film .es__tower::before { background: linear-gradient(to top, rgb(10 16 40 / 0.8) 0%, rgb(10 16 40 / 0.42) 34%, rgb(10 16 40 / 0) 62%); }
.awards { display: grid; gap: 0.8rem; margin-top: 1rem; }
.awards li { font: 400 var(--t-m)/1.25 var(--f-display); max-width: 30rem; }
.awards + .link { margin-top: 1.4rem; }

/* ohana by the sea */
.act-obs { --accent: oklch(0.86 0.065 195); --scrim: 2 20 30; }
.act-obs .h-xxl, .act-obs .h-xl, .act-obs .h-l { font-style: italic; }
.act-obs .h-xxl { line-height: 0.98; font-size: clamp(3rem, 1.8rem + 5.6vw, 7.25rem); }
.film .obs__title { align-content: center; justify-items: center; gap: clamp(1.2rem, 4.5vh, 3rem); text-align: center; }
.obs__title .lead { margin-top: 0.6rem; }
.film .obs__title::before { background: none; }
.obs__title .beat__in { display: grid; justify-items: center; }
.win--obs { justify-self: stretch; margin-inline: calc(var(--pad) * -1); height: min(20svh, 28vw); }
.logo--obs { width: clamp(3.4rem, 8.5vh, 5.2rem); aspect-ratio: 1; color: var(--accent); }
.sizes { display: grid; margin-top: 1rem; max-width: 25rem; }
.sizes li { display: flex; align-items: baseline; justify-content: space-between; gap: 2rem; padding-block: 0.5rem; border-bottom: 1px solid rgb(255 255 255 / 0.22); }
.sizes b { font: italic 400 var(--t-m)/1.1 var(--f-display); }
.sizes span { color: var(--soft); }
.ticks { display: grid; gap: 0.3rem 2rem; margin-top: 1rem; }
.ticks li { position: relative; padding-inline-start: 1.5rem; }
.ticks li::before { content: ''; position: absolute; inset-inline-start: 0; top: 0.8em; width: 0.85rem; height: 1px; background: var(--accent); }
.obs__near .btn { margin-top: 1.4rem; }
.film .obs__life { grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); align-content: end; align-items: end; gap: var(--pad); }
.film .obs__life::before { background: linear-gradient(to top, rgb(var(--scrim) / 0.92) 0%, rgb(var(--scrim) / 0.6) 46%, rgb(var(--scrim) / 0) 84%); }
.static .obs__life, .no-js .obs__life { display: grid; gap: 2rem; }
.static .shot--obs, .no-js .shot--obs { background: oklch(0.2 0.04 215); }
.static .obs__title .beat__in, .no-js .obs__title .beat__in { justify-items: start; }
@media (min-width: 821px) { .film .obs__life > .beat__in:first-child .ticks { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 820px) {
  .film .obs__life { grid-template-columns: 1fr; gap: 1.1rem; }
  .film .obs__life .ticks { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.2rem 1rem; font-size: 0.9rem; }
  .film .obs__near .ticks { grid-template-columns: 1fr; }
  .obs__near .btn { margin-top: 0.9rem; }
}
[lang='ar'] .act-obs .h-xxl, [lang='ar'] .act-obs .h-xl, [lang='ar'] .act-obs .h-l, [lang='ar'] .sizes b { font-style: normal; }

/* family */
.flow { position: relative; z-index: 2; background: var(--ivory); color: var(--ink); --fg: var(--ink); --accent: var(--gold-deep); padding: clamp(5rem, 16vh, 12rem) var(--pad) clamp(4rem, 12vh, 9rem); }
.flow__head { max-width: 46rem; }
.flow__head > * + * { margin-top: 1.1rem; }
.place { position: relative; display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); align-items: center; margin-top: clamp(5rem, 18vh, 13rem); }
.place__a { grid-column: 1 / span 7; grid-row: 1; overflow: hidden; aspect-ratio: 3 / 2; }
.place__b { grid-column: 6 / span 3; grid-row: 1; align-self: end; z-index: 1; overflow: hidden; aspect-ratio: 4 / 5; translate: 0 34%; box-shadow: 0 2rem 4rem rgb(22 20 18 / 0.22); }
.place__a img, .place__b img { width: 100%; height: 118%; object-fit: cover; }
.place__copy { grid-column: 9 / span 4; grid-row: 1; align-self: center; z-index: 2; padding-inline-start: clamp(1.25rem, 2.6vw, 2.75rem); }
.place__copy > * + * { margin-top: 0.9rem; }
.place--1 .place__a { grid-column: 6 / span 7; }
.place--1 .place__b { grid-column: 5 / span 3; }
.place--1 .place__copy { grid-column: 1 / span 4; padding-inline: 0 clamp(1.25rem, 2.6vw, 2.75rem); }

/* people */
.people__trip { display: none; }
.film .people__thesis { align-content: center; justify-items: center; gap: clamp(1.2rem, 4vh, 2.6rem); text-align: center; }
.film .people__trip { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(0.75rem, 3vw, 3rem); width: min(100%, 60rem); }
.film .people__trip li { display: grid; justify-items: center; gap: 0.9rem; font-size: var(--t-small); color: var(--soft); }
.win--trip { width: min(100%, 13.5rem); aspect-ratio: 4 / 5; }
.quote--thesis { max-width: 50rem; }
.film .people__quotes { align-content: end; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--pad); direction: ltr; }
[dir='rtl'] .people__quotes .quote { direction: rtl; }
.film .people__quotes::before { background: linear-gradient(to top, rgb(0 0 20 / 0.86) 0%, rgb(0 0 20 / 0.5) 34%, rgb(0 0 20 / 0) 62%); }
.people__quotes .quote { max-width: 30rem; }
.people__quotes .quote p { font-size: clamp(1.15rem, 1rem + 0.7vw, 1.6rem); }
.people__quotes .quote--ceo { justify-self: end; }
.people__quotes footer b { display: block; font: 400 1.15rem/1.3 var(--f-display); color: var(--fg); }

/* finale and footer */
.finale { display: grid; justify-items: center; gap: 1.1rem; padding: var(--top) var(--pad) var(--pad); text-align: center; }
.film .finale { position: absolute; inset: 0; align-content: center; }
.wm--end { --wm: clamp(3rem, 12.5vw, 11.5rem); margin-bottom: clamp(0.5rem, 3vh, 2rem); }
.contact { display: grid; justify-items: center; gap: 0.35rem; margin-top: 0.6rem; }
.contact li:first-child { display: grid; justify-items: center; gap: 0.4rem; margin-bottom: 0.6rem; }
.foot { position: relative; z-index: 2; display: grid; gap: 0.7rem; padding: clamp(2.5rem, 8vh, 5rem) var(--pad); background: var(--navy-950); color: color-mix(in oklab, var(--white) 70%, transparent); font-size: var(--t-small); }
.foot p { max-width: 52rem; }

/* static reading mode: no film, plain page */
.static .shot, .no-js .shot { padding-bottom: clamp(3rem, 10vh, 7rem); }
.static .still img, .no-js .still img { width: 100%; height: auto; max-height: 92vh; object-fit: cover; }
.static .beat, .no-js .beat { padding: clamp(1.6rem, 5vh, 3rem) var(--pad) 0; }
.static .shot--es, .no-js .shot--es { background: var(--ivory); color: var(--ink); }
.static .shot--es .on-dark, .no-js .shot--es .on-dark { --fg: var(--ink); --accent: var(--gold-deep); color: var(--ink); }
.static .shot--jc, .no-js .shot--jc { background: var(--onyx); }
.static .strip__view, .no-js .strip__view { overflow-x: auto; padding-bottom: 1rem; }
.static .clubs__list, .no-js .clubs__list { grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr)); padding-top: 1.5rem; }
.static .people__quotes, .no-js .people__quotes { display: grid; gap: 2rem; }
.static .win, .no-js .win, .static .gauge, .static .hero__cue { display: none; }
.static .es__num, .no-js .es__num, .static .clock__dial, .no-js .clock__dial { display: none; }
.static .es__mark, .no-js .es__mark { opacity: 1; justify-self: start; }
.static .jc__title .beat__in, .static .es__title .beat__in { display: grid; justify-items: start; }
.static .hero, .no-js .hero { min-height: 82vh; align-content: center; }
.static .record__photo, .no-js .record__photo { margin: 2rem var(--pad) 0; }
.static .chrome, .no-js .chrome { position: absolute; }
.no-js .chrome__menu, .no-js .loader { display: none; }
.no-js .chapters { position: static; opacity: 1; visibility: visible; padding: 5rem var(--pad) 1rem; }

/* narrow screens */
@media (max-width: 820px) {
  .film .clock { grid-template-columns: 1fr; align-content: center; gap: 1rem; }
  .clock__dial { width: min(58vw, 30svh); }
  .clock__list { gap: 0 1rem; }
  .clock__list li { padding-block: 0.22rem; }
  .clock__list .m { font-size: 1.2rem; }
  .clock__list .n { font-size: 0.86rem; }
  .film .record__photo { top: var(--top); width: 46vw; }
  .film .clubs__list { grid-template-columns: 1fr; gap: 0.9rem; width: min(100%, 22rem); }
  .film .clubs__list li { grid-template-columns: 38% 1fr; column-gap: 1rem; justify-items: start; align-items: center; text-align: start; }
  .film .clubs__list .win { grid-row: 1 / span 2; }
  .win--club { aspect-ratio: 5 / 4; }
  .clubs__list h4 { margin-top: 0; align-self: end; }
  .clubs__list p { align-self: start; }
  .film .people__quotes { grid-template-columns: 1fr; gap: 1.2rem; }
  .people__quotes .quote--ceo { justify-self: start; }
  .people__quotes .quote p { font-size: 1.15rem; }
  .film .es__level { top: calc(var(--top) + 1.2rem); translate: none; }
  .film .shot--strip { --card-h: min(52svh, 112vw); }
  .film .card { width: 76vw; }
  .film .card--text { width: 76vw; }
  .es__num { font-size: clamp(4rem, 22vw, 7rem); }
  .place { grid-template-columns: 1fr; margin-top: clamp(4rem, 12vh, 7rem); }
  .place__a, .place--1 .place__a { grid-column: 1; grid-row: 1; }
  .place__b, .place--1 .place__b { grid-column: 1; grid-row: 2; width: 56%; justify-self: end; margin-top: -18%; translate: none; }
  .place__copy, .place--1 .place__copy { grid-column: 1; grid-row: 3; padding: 1.5rem 0 0; }
  .ladder__list li { grid-template-columns: 5.2rem 1fr; gap: 0.8rem; }
  .ladder__list { gap: 0.6rem; }
  .film .ladder { align-content: end; }
  .film .ladder::before { background: linear-gradient(to top, rgb(var(--scrim) / 0.9) 0%, rgb(var(--scrim) / 0.72) 50%, rgb(var(--scrim) / 0) 82%) !important; }
  .film .beat--bl::before, .film .beat--br::before, .film .beat--l::before, .film .beat--r::before { background: linear-gradient(to top, rgb(var(--scrim) / 0.86) 0%, rgb(var(--scrim) / 0.5) 36%, rgb(var(--scrim) / 0) 66%) !important; }
  .film .homes__rail { display: none; }
  .gauge__label { display: none; }
}

/* arabic */
[lang='ar'] { --f-display: 'Cairo', 'Geeza Pro', Tahoma, sans-serif; --f-text: 'Tajawal', 'Geeza Pro', Tahoma, sans-serif; --f-city: 'Cairo', 'Geeza Pro', Tahoma, sans-serif; }
[lang='ar'] body { line-height: 1.75; }
[lang='ar'] .h-xxl, [lang='ar'] .h-xl, [lang='ar'] .h-l { letter-spacing: 0; line-height: 1.3; font-weight: 600; text-transform: none; }
[lang='ar'] .act-city .h-xxl, [lang='ar'] .act-city .h-xl, [lang='ar'] .act-city .h-l { font-weight: 800; line-height: 1.25; }
[lang='ar'] .act-es .h-xl, [lang='ar'] .act-es .h-l { font-family: var(--f-display); font-weight: 300; letter-spacing: 0; line-height: 1.35; }
[lang='ar'] .ln { padding-block: 0.22em; margin-block: -0.22em; }
[lang='ar'] .slate, [lang='ar'] .jc__by, [lang='ar'] .es__label { letter-spacing: 0; }
[lang='ar'] .quote p, [lang='ar'] .awards li, [lang='ar'] .ladder__list h4, [lang='ar'] .clubs__list h4 { font-weight: 500; line-height: 1.6; }
[lang='ar'] .card__name, [lang='ar'] .homes__index, [lang='ar'] .clock__list .m { font-weight: 700; }
[lang='ar'] .wm, [lang='ar'] .wm__sub, [lang='ar'] .jc__by { font-family: 'Jost', 'Avenir Next', sans-serif; }
[lang='ar'] .jc__by { letter-spacing: 0.3em; }
[lang='ar'] .clock__dial .big { font-family: 'Archivo', sans-serif; }
[lang='ar'] .es__num { font-family: 'Jost', sans-serif; }
[lang='ar'] .chrome__lang { font-family: 'Jost', 'Avenir Next', sans-serif; }
[lang='en'] .chrome__lang { font-family: 'Tajawal', 'Geeza Pro', sans-serif; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; }
}