@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);
  --bronze: oklch(0.47 0.08 78);
  --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; }
/* selected text wears the brand, not the system blue; the header and other furniture cannot be selected by a stray drag */
::selection { background: rgb(201 183 159 / 0.4); color: inherit; }
.shot--strip ::selection, .act-es ::selection { background: rgb(0 32 107 / 0.2); }
.chrome, .gauge, .chapters__head, .pins, .hero__cue, .wm, .loader, .halo, .count__ring, .rings, .dial { -webkit-user-select: none; user-select: none; }

.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; }
.film[data-tone='light'] .chrome::before { opacity: 1; background: linear-gradient(color-mix(in oklab, var(--ivory) 92%, transparent) 35%, color-mix(in oklab, var(--ivory) 0%, transparent)); }
.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; }
/* the tone recolours the header furniture only: set on the root, the colour is inherited by every element and each
   flip restyles the whole document in the middle of the scroll */
html[data-tone='light'] :is(.chrome, .gauge, .halo) { --ui: var(--navy-900); }
html.menu-open :is(.chrome, .gauge, .halo) { --ui: var(--white); }

/* one row as tall as the screen: the two lists sit in its middle, and a list taller than the screen scrolls from its top */
.chapters { position: fixed; inset: 0; z-index: 9; display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); grid-template-rows: 1fr; align-items: center; gap: clamp(1.5rem, 5vw, 5rem); padding: var(--top) var(--pad) var(--pad); overflow-y: auto; overscroll-behavior: contain; 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 { display: grid; gap: clamp(0.3rem, 1.2vh, 0.9rem); }
.chapters__head { margin-bottom: clamp(0.6rem, 2vh, 1.3rem); font-size: var(--t-small); letter-spacing: 0.04em; color: var(--gold); }
.chapters a { display: inline-block; font-family: var(--f-display); font-size: clamp(1.4rem, 0.95rem + 1.9vw, 2.6rem); 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; }
/* the diamond stands inside the title: a scrim would grey it, and the title already sits on near black */
.film .jc__title::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 { position: relative; width: min(100%, 68svh); aspect-ratio: 1; justify-self: center; }
.clock__dial svg { position: absolute; inset: 0; width: 100%; height: 100%; 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 { will-change: transform; }
.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); aspect-ratio: 1; translate: -50% -50%; opacity: 0; }
.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 { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; will-change: transform; }
.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; }
.film .ladder .beat__in { max-width: 36rem; }
.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; }

/* reading sections and the footer sit on a picture, never on a flat colour */
.flow, .foot { position: relative; z-index: 2; isolation: isolate; overflow: clip; background: var(--navy-950); color: var(--ivory); --fg: var(--ivory); --accent: var(--gold); }
.flow { padding: clamp(5rem, 14vh, 10rem) var(--pad); }
.flow__bg { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; }
.flow::before, .foot::before { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(rgb(0 0 20 / 0.5), rgb(0 0 20 / 0.8)); }

/* lebanon */
.win--place { justify-self: center; width: min(100%, 62svh); aspect-ratio: 1; }
.place .beat__in { max-width: 30rem; }
.film .place { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: center; gap: var(--pad); }
.film .place--1 .win { order: 2; }
.film .place--1 .beat__in { justify-self: end; }

/* build your villa */
.step__n { position: relative; display: block; width: max-content; font: 400 clamp(5rem, 22svh, 13rem)/0.86 'Bodoni Moda', 'Didot', serif; color: transparent; -webkit-text-stroke: 1px var(--gold); }
.step__n::after { content: attr(data-n); position: absolute; inset: 0; color: var(--gold); -webkit-text-stroke: 0; opacity: var(--on, 1); }
.brief { max-width: 62rem; }
.brief__title { font: 400 var(--t-small)/1.4 var(--f-text); letter-spacing: 0.04em; color: var(--accent); }
.brief__line { margin-top: 1rem; font: 400 clamp(1.45rem, 1.05rem + 1.9vw, 2.9rem)/1.55 var(--f-display); text-wrap: pretty; }
.brief__pick { position: relative; display: inline-block; max-width: 100%; }
.brief__pick::after { content: ''; position: absolute; inset-inline-end: 0.22em; top: 50%; width: 0.3em; height: 0.3em; border-right: 1px solid var(--gold); border-bottom: 1px solid var(--gold); transform: translateY(-75%) rotate(45deg); pointer-events: none; }
.brief select { appearance: none; -webkit-appearance: none; max-width: 100%; margin: 0; padding: 0; padding-inline-end: 1em; border: 0; border-bottom: 1px solid var(--gold); border-radius: 0; background: none; color: var(--gold); font: inherit; font-style: italic; line-height: 1.2; text-overflow: ellipsis; cursor: pointer; }
.brief select:focus-visible { outline: 2px solid var(--gold); outline-offset: 4px; }
.brief option { font: 400 1rem var(--f-text); color: var(--ink); background: var(--ivory); }
.brief__go { display: flex; flex-wrap: wrap; align-items: center; gap: 0.75rem 2rem; margin-top: clamp(1.5rem, 4vh, 2.4rem); }
.brief .note { margin-top: 1rem; }
.brief__plain { margin-top: 2.5rem; }
.no-js .brief { display: none; }
.film .brief-beat::before { background: none; }
.film .brief__go { justify-content: center; }
.film .brief .note { margin-inline: auto; }

/* investing */
.reasons__list { display: grid; gap: 1rem; }
.reasons__list h3 { font: 400 var(--t-m)/1.2 var(--f-display); }
.reasons__list p { max-width: 34rem; margin-top: 0.3rem; color: var(--soft); }
.win--reason { justify-self: center; width: min(100%, 50svh); aspect-ratio: 4 / 5; }
.film .reasons { grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr); align-items: center; gap: var(--pad); }
.film .reasons__list { position: relative; gap: 0.15rem; padding-bottom: 6.4rem; }
.film .reasons__list h3 { font-size: clamp(1.35rem, 0.9rem + 1.5vw, 2.2rem); line-height: 1.22; opacity: 0.36; transition: opacity 0.35s var(--ease), translate 0.5s var(--ease), color 0.35s var(--ease); }
.film .reasons__list li.is-on h3 { opacity: 1; translate: 0.8rem 0; color: var(--gold); }
[dir='rtl'].film .reasons__list li.is-on h3 { translate: -0.8rem 0; }
.film .reasons__list p { position: absolute; inset: auto 0 0 0; min-height: 5rem; margin: 0; font-size: var(--t-lead); opacity: 0; visibility: hidden; transition: opacity 0.35s var(--ease), visibility 0s 0.35s; }
.film .reasons__list li.is-on p { opacity: 1; visibility: visible; transition-delay: 0s; }
.ticks--two { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 46rem; }
.uae .btn { margin-top: 1.4rem; }

/* recognition */
.laurels__list { display: grid; gap: 1.1rem; margin-top: 1rem; }
.laurels__list li { position: relative; padding-inline-start: 1.7rem; }
.laurels__list li::before { content: ''; position: absolute; inset-inline-start: 0; top: 0.85em; width: 1rem; height: 1px; background: var(--gold); }
.laurels__list h3 { max-width: 34rem; font: 400 clamp(1.4rem, 1rem + 1.6vw, 2.4rem)/1.18 var(--f-display); text-wrap: balance; }
.laurels__list p { margin-top: 0.25rem; font-size: var(--t-small); letter-spacing: 0.02em; color: var(--gold); }
.laurels .note { margin-top: 1.6rem; }

/* newsroom */
.shot--news { --ncard-h: min(42svh, 30vw); }
.news__head { display: flex; align-items: end; justify-content: space-between; gap: 2rem; padding: 0 var(--pad) clamp(1rem, 3vh, 2rem); }
.static .news__head, .no-js .news__head { padding-top: var(--top); }
.news__year { font: 300 clamp(3rem, 12svh, 8rem)/0.9 'Jost', 'Avenir Next', sans-serif; font-variant-numeric: tabular-nums; color: transparent; -webkit-text-stroke: 1px color-mix(in oklab, var(--gold) 75%, transparent); }
.news__track { display: flex; gap: clamp(1rem, 2vw, 2.2rem); width: max-content; padding: 0 var(--pad); }
.ncard { flex: none; display: grid; align-content: start; gap: 0.9rem; width: calc(var(--ncard-h) * 1.5); }
.ncard__media { height: var(--ncard-h); overflow: hidden; background: var(--navy-800); }
.ncard__media img { width: 112%; max-width: none; height: 100%; margin-inline-start: -6%; object-fit: cover; }
.ncard time { font-size: var(--t-small); letter-spacing: 0.04em; font-variant-numeric: tabular-nums; color: var(--gold); }
.ncard h3 { margin-top: 0.35rem; font: 400 clamp(1.15rem, 0.95rem + 0.8vw, 1.7rem)/1.28 var(--f-display); text-wrap: pretty; }
.ncard--text { align-content: end; height: calc(var(--ncard-h) + 7.5rem); padding: 1.4rem; border: 1px solid color-mix(in oklab, var(--gold) 45%, transparent); }
.ncard--text h3 { font-size: clamp(1.4rem, 1.1rem + 1.2vw, 2.3rem); }
.film .shot--news .frame { display: grid; grid-template-columns: minmax(0, 1fr); align-content: center; padding-top: calc(var(--top) - 1.5rem); }
.film .news__track { will-change: transform; }
.static .news__view, .no-js .news__view { overflow-x: auto; padding-bottom: 1rem; }

/* brokers */
.brokers__lead > * + * { margin-top: 1.1rem; }
.brokers__list > * + * { margin-top: 1.2rem; }
.perks { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.2rem 2.5rem; max-width: 46rem; }
.film .brokers .beat__in { display: grid; grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr); align-items: end; gap: var(--pad); width: 100%; max-width: none; }
.film .brokers .beat__in > * + * { margin-top: 0; }
.perks h3 { font: 400 var(--t-m)/1.2 var(--f-display); color: var(--gold); }
.perks p { margin-top: 0.25rem; color: var(--soft); }

/* questions */
.faq__in { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); gap: clamp(1.5rem, 5vw, 6rem); max-width: 86rem; margin-inline: auto; }
.faq__head { position: sticky; top: 6.5rem; align-self: start; }
.faq details { position: relative; }
.faq details::before { content: ''; position: absolute; inset: 0 0 auto 0; height: 1px; background: color-mix(in oklab, var(--gold) 55%, transparent); transform: scaleX(var(--ln, 1)); transform-origin: left; }
[dir='rtl'] .faq details::before { transform-origin: right; }
.faq summary { display: flex; align-items: baseline; justify-content: space-between; gap: 1.5rem; padding-block: 1.25rem; list-style: none; font: 400 var(--t-m)/1.25 var(--f-display); cursor: pointer; transition: color 0.3s var(--ease); }
.faq summary:hover, .faq details[open] summary { color: var(--gold); }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: ''; flex: none; width: 0.6rem; height: 0.6rem; border-right: 1px solid var(--gold); border-bottom: 1px solid var(--gold); rotate: 45deg; translate: -0.2rem -0.15rem; transition: rotate 0.3s var(--ease), translate 0.3s var(--ease); }
.faq details[open] summary::after { rotate: 225deg; translate: -0.2rem 0.2rem; }
.faq details p { max-width: 42rem; padding-bottom: 1.5rem; color: var(--soft); }


/* 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); }

/* build your villa */

/* the house */
.count, .values { padding: clamp(1.6rem, 5vh, 3rem) var(--pad) 0; }
.count__o { display: none; }
.count__list { display: grid; grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr)); align-items: end; gap: 1.6rem 2rem; }
.count__list li { display: grid; align-content: start; gap: 0.3rem; }
.count__fig { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 0.6rem; color: var(--gold); }
.count__n { font: 300 clamp(3rem, 2rem + 4vw, 5rem)/1 'Jost', 'Avenir Next', sans-serif; font-variant-numeric: tabular-nums; }
.count__pre, .count__suf { font-size: var(--t-m); color: var(--gold); }
.count__l { color: var(--soft); }
.film .count { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: center; gap: var(--pad); padding: var(--top) var(--pad) var(--pad); }
.film .count__o { position: relative; display: block; justify-self: end; width: min(62vmin, 34rem); aspect-ratio: 1; }
.win--count { position: absolute; inset: 0.6%; }
.count__ring { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.count__ring circle { fill: none; stroke: var(--gold); stroke-width: 0.5; opacity: 0.4; }
.count__ring .count__arc { stroke-width: 1.5; opacity: 1; stroke-dasharray: 100; stroke-dashoffset: 100; }
.film .count__list { grid-template-columns: minmax(0, 1fr); }
.film .count__list li { grid-area: 1 / 1; align-content: center; gap: 0.5rem; opacity: 0; visibility: hidden; }
.film .count__n { font-size: clamp(5rem, 2rem + 11vw, 13rem); line-height: 0.92; }
.film .count__pre, .film .count__suf { font-size: var(--t-l); }
.film .count__l { font-size: var(--t-m); color: var(--ivory); }
.values__list { display: grid; gap: 1.6rem; margin-top: 1.2rem; }
.values__name { font: 400 var(--t-l)/1.08 var(--f-display); }
.values__sub { color: var(--accent); }
.values__text > * + * { margin-top: 0.5rem; }
.values__vision { margin-top: 1.6rem; }
.film .values { align-content: center; padding: var(--top) var(--pad) var(--pad); }
.film .values__in { width: min(100%, 78rem); margin-inline: auto; }
.film .values__list { position: relative; gap: 0.35rem; margin-top: 1.4rem; }
.film .values__list li { width: 58%; }
.film .values__name { font-size: clamp(2.1rem, 1.3rem + 3.4vw, 4.6rem); line-height: 1.06; opacity: 0.26; transition: opacity 0.4s var(--ease), translate 0.6s var(--ease); }
.film .values__list li.is-on .values__name { opacity: 1; translate: 0.9rem 0; }
[dir='rtl'].film .values__list li.is-on .values__name { translate: -0.9rem 0; }
.film .values__text { position: absolute; inset-inline-end: 0; top: 50%; width: 37%; translate: 0 -50%; opacity: 0; visibility: hidden; transition: opacity 0.4s var(--ease), visibility 0s 0.4s; }
.film .values__list li.is-on .values__text { opacity: 1; visibility: visible; transition-delay: 0s; }
.film .values__sub { font: italic 400 var(--t-l)/1.15 var(--f-display); color: var(--gold); }
.film .values__text .body { margin-top: 1rem; }
.film .values__vision { margin-top: clamp(1.4rem, 5vh, 3rem); max-width: 36rem; font-size: 1rem; color: var(--soft); }

/* investing, recognition, newsroom, brokers, questions */

/* the O that follows the pointer */
.halo { position: fixed; left: 0; top: 0; z-index: 20; width: 2.4rem; height: 2.4rem; margin: -1.2rem 0 0 -1.2rem; border: 1px solid var(--ui); border-radius: 50%; pointer-events: none; opacity: 0; transition: opacity 0.3s var(--ease), scale 0.35s var(--ease), background-color 0.35s var(--ease), border-color 0.4s var(--ease); will-change: transform; }
.halo.is-on { opacity: 0.65; }
.halo.is-hot { scale: 1.9; border-color: var(--gold); background: color-mix(in oklab, var(--gold) 16%, transparent); opacity: 1; }
.static .halo { display: none; }

/* contact and offices */
.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(2.6rem, 9vw, 8rem); margin-bottom: clamp(0.4rem, 2vh, 1.4rem); }
.channels { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); width: min(100%, 70rem); margin-top: clamp(1rem, 4vh, 2.6rem); }
.channels li + li { border-inline-start: 1px solid color-mix(in oklab, var(--gold) 45%, transparent); }
.channel { display: grid; justify-items: center; gap: 0.5rem; padding: 0.6rem 1.2rem 0.8rem; color: var(--fg); text-decoration: none; }
.channel__label { font-size: var(--t-small); letter-spacing: 0.04em; color: var(--gold); }
.channel__value { font: 400 clamp(1.5rem, 0.9rem + 1.9vw, 2.7rem)/1.1 var(--f-display); white-space: nowrap; transition: color 0.3s var(--ease); }
.channel__note { font-size: var(--t-small); color: var(--mute); }
.channel:hover .channel__value, .channel:focus-visible .channel__value { color: var(--gold); }
.finale__brokers { margin-top: 0.6rem; }
.foot { display: grid; gap: 1.6rem; padding: clamp(3rem, 9vh, 6rem) var(--pad) clamp(2rem, 6vh, 3.5rem); font-size: var(--t-small); color: color-mix(in oklab, var(--white) 78%, transparent); }
.foot__title { font: 400 var(--t-l)/1.1 var(--f-display); color: var(--ivory); }
.offices { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 2rem; padding-bottom: clamp(1.6rem, 5vh, 3rem); border-bottom: 1px solid color-mix(in oklab, var(--gold) 40%, transparent); }
.offices li { display: grid; align-content: start; justify-items: start; gap: 0.3rem; }
.offices h3 { font: 400 var(--t-m)/1.2 var(--f-display); color: var(--white); }
.offices p { color: var(--gold); }
.offices .link { padding-block: 0.15rem; }
.foot > .link { justify-self: start; }

/* 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; }

/* a scene has one screen to fit in: its type also answers to the height of that screen */
@supports (height: 1svh) {
  :root {
    --t-xxl: min(clamp(3rem, 1.6rem + 7vw, 9rem), 17svh);
    --t-xl: min(clamp(2.5rem, 1.7rem + 4.2vw, 5.75rem), 11.5svh);
    --t-l: min(clamp(1.9rem, 1.4rem + 2.3vw, 3.5rem), 8svh);
  }
  .act-es .h-xl { font-size: min(clamp(2rem, 1.4rem + 3.2vw, 4.5rem), 10svh); }
  .act-obs .h-xxl { font-size: min(clamp(3rem, 1.8rem + 5.6vw, 7.25rem), 15svh); }
  .film .count__n { font-size: min(clamp(5rem, 2rem + 11vw, 13rem), 30svh); }
  .film .values__name { font-size: min(clamp(2.1rem, 1.3rem + 3.4vw, 4.6rem), 9.2svh); }
  .film .reasons__list h3 { font-size: min(clamp(1.35rem, 0.9rem + 1.5vw, 2.2rem), 4.6svh); }
  .laurels__list h3 { font-size: min(clamp(1.4rem, 1rem + 1.6vw, 2.4rem), 5.6svh); }
  .es__num { font-size: min(clamp(5rem, 3rem + 12vw, 13rem), 28svh); }
  .film .quote p { font-size: min(clamp(1.35rem, 1.05rem + 1.5vw, 2.4rem), 5.4svh); }
}

/* 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); }
  .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; }
  .film .place { grid-template-columns: minmax(0, 1fr); align-content: center; justify-items: center; gap: 1.4rem; text-align: center; }
  .film .place--1 .win { order: 0; }
  .film .place .beat__in, .film .place--1 .beat__in { justify-self: center; }
  .film .place .lead { margin-inline: auto; }
  .win--place { width: min(70vw, 36svh); }
  .film .reasons { grid-template-columns: minmax(0, 1fr); align-content: center; gap: 1.1rem; }
  .win--reason { order: -1; width: 100%; max-height: 24svh; aspect-ratio: 16 / 9; }
  .film .reasons__list h3 { font-size: clamp(1.02rem, 4.2vw, 1.3rem); }
  .film .reasons__list p { font-size: 0.98rem; }
  .ticks--two { grid-template-columns: minmax(0, 1fr); }
  .shot--news { --ncard-h: min(34svh, 52vw); }
  .news__head { gap: 0.8rem; }
  .news__year { font-size: clamp(2rem, 10.5vw, 3rem); }
  .perks { grid-template-columns: minmax(0, 1fr); gap: 0.8rem; }
  .film .brokers .beat__in { grid-template-columns: minmax(0, 1fr); gap: 1.2rem; }
  .faq__in { grid-template-columns: minmax(0, 1fr); gap: 1.4rem; }
  .faq__head { position: static; }
  .channels { grid-template-columns: minmax(0, 1fr); }
  .channels li + li { border-inline-start: 0; border-top: 1px solid color-mix(in oklab, var(--gold) 45%, transparent); }
  .channel { gap: 0.25rem; padding: 0.75rem 0; }
  .offices { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .gauge__label { display: none; }
  .chapters { grid-template-columns: minmax(0, 1fr); grid-template-rows: auto; align-items: start; align-content: start; gap: 1.6rem; }
  .film .count { grid-template-columns: minmax(0, 1fr); align-content: center; justify-items: center; gap: 1.6rem; text-align: center; }
  .film .count__o { justify-self: center; width: min(66vw, 38svh); }
  .film .count__list { width: 100%; }
  .film .count__list li { justify-items: center; }
  .film .count__fig { justify-content: center; }
  .film .count__n { font-size: clamp(4.2rem, 23vw, 7.5rem); }
  .film .values__list { padding-bottom: 11.5rem; }
  .film .values__list li { width: auto; }
  .film .values__text { top: auto; bottom: 0; width: 100%; min-height: 10.5rem; translate: none; }
  .film .values__sub { font-size: var(--t-m); }
  .film .values__vision { display: none; }
}

/* a tablet held upright has the width for three across */
@media (min-width: 600px) and (max-width: 820px) {
  .film .clubs__list { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.4rem; width: 100%; }
  .film .clubs__list li { grid-template-columns: minmax(0, 1fr); justify-items: center; text-align: center; }
  .film .clubs__list .win { grid-row: auto; }
  .win--club { aspect-ratio: 4 / 5; }
  .clubs__list h4 { margin-top: 0.9rem; }
  .film .values__list { padding-bottom: 0; }
  .film .values__list li { width: 56%; }
  .film .values__text { top: 50%; bottom: auto; width: 40%; min-height: 0; translate: 0 -50%; }
  .film .values__vision { display: block; }
}

/* a small laptop window: the tallest scenes give up a little height */
@media (min-width: 821px) and (max-height: 760px) {
  .beat__in > * + * { margin-top: 0.85rem; }
  .win--jc { width: 21svh; height: 28svh; margin-bottom: 1rem; }
  .win--es { width: 17svh; height: 26svh; margin-bottom: 0.8rem; }
  .logo--es { width: clamp(3rem, 9.5svh, 8rem); }
  .act-es .h-xl { font-size: min(clamp(2rem, 1.4rem + 3.2vw, 4.5rem), 8.6svh); }
  .wm--end { --wm: min(9vw, 15svh); margin-bottom: 0.3rem; }
  .shot--news { --ncard-h: min(36svh, 28vw); }
  .finale { gap: 0.7rem; }
  .win--place { width: min(100%, 56svh); }
}

/* a phone held sideways: the header shrinks, every scene sheds what it can spare */
@media (max-height: 520px) and (orientation: landscape) {
  :root { --top: 3.5rem; --t-lead: 0.98rem; --t-m: 1.15rem; }
  .chrome { padding-block: 0.55rem; }
  .logo--chrome { width: 6.6rem; height: 1.8rem; }
  .gauge { top: 0.4rem; }
  .film .beat { padding-bottom: 0.9rem; }
  .beat__in > * + * { margin-top: 0.55rem; }
  .lead { line-height: 1.4; }
  .btn { min-height: 2.4rem; padding-block: 0.4rem; }
  .quote footer { margin-top: 0.5rem; }
  .hero { gap: 0.5rem; }
  .wm { --wm: min(17.2vw, 34svh); }
  .hero__line { margin-top: 0.3rem; }
  .film .hero__cue { display: none; }
  .logo--mc { width: 11rem; height: 2.9rem; margin-bottom: 0; }
  .film .clock { gap: 1.5rem; padding-bottom: 0.8rem; }
  .clock__dial { width: min(100%, 60svh); }
  .clock__copy > * + * { margin-top: 0.5rem; }
  .clock__list li { padding-block: 0.1rem; }
  .clock__list .m { font-size: 1.15rem; }
  .clock .note { display: none; }
  .film .record__photo { width: min(30vw, 44svh); }
  .win--jc { width: 16svh; height: 21svh; margin-bottom: 0.5rem; }
  .logo--jc { width: 11rem; height: 1.6rem; }
  .jc__by { margin-top: 0.2rem !important; font-size: 0.7rem; }
  .ladder__list { gap: 0.35rem; margin-top: 0.4rem; }
  .ladder__list li { grid-template-columns: 4.4rem 1fr; gap: 0.8rem; }
  .ladder__list h4 { font-size: 1.05rem; }
  .ladder__list p { margin-top: 0; font-size: 0.85rem; }
  .ladder .note { display: none; }
  .film .clubs { gap: 0.6rem; }
  .win--club { width: min(100%, 10.5rem); aspect-ratio: 5 / 4; }
  .clubs__list h4 { margin-top: 0.4rem; font-size: 1.05rem; }
  .clubs__list p { display: none; }
  .win--es { width: 15svh; height: 22svh; margin-bottom: 0.4rem; }
  .logo--es { width: 3rem; }
  .es__title .lead { display: none; }
  .es__mark { margin-top: 0.4rem; }
  .awards { gap: 0.4rem; margin-top: 0.5rem; }
  .awards li { font-size: 1.05rem; }
  .win--obs { height: 15svh; }
  .logo--obs { width: 2.4rem; }
  .film .obs__title { gap: 0.6rem; }
  .ticks { gap: 0.05rem 1.5rem; margin-top: 0.4rem; font-size: 0.88rem; }
  .sizes { margin-top: 0.4rem; }
  .sizes li { padding-block: 0.2rem; }
  .obs__near .btn, .cap .btn { margin-top: 0.5rem; }
  .film .values__vision { display: none; }
  .film .people__thesis { gap: 0.6rem; }
  .win--trip { width: min(100%, 6.2rem); }
  .film .people__trip li { gap: 0.3rem; font-size: 0.75rem; }
  .win--place { width: min(100%, 56svh); }
  .film .reasons__list { padding-bottom: 4.6rem; }
  .film .reasons__list p { min-height: 0; font-size: 0.92rem; }
  .perks { gap: 0.5rem 2rem; margin-top: 0.6rem; }
  .brokers .body, .laurels .note, .brief .note { display: none; }
  .shot--news { --ncard-h: 30svh; }
  .news__head { padding-bottom: 0.4rem; }
  .ncard { gap: 0.4rem; }
  .ncard h3 { font-size: 0.95rem; }
  .ncard--text { height: calc(var(--ncard-h) + 5rem); padding: 0.8rem; }
  .finale { gap: 0.45rem; }
  .finale .lead { display: none; }
  .finale .h-xl { font-size: var(--t-l); }
  .channels { margin-top: 0.4rem; }
  .channel { gap: 0.15rem; padding-block: 0.2rem; }
  .wm--end { --wm: 19svh; margin-bottom: 0; }
  .film .clock { grid-template-columns: minmax(0, 0.55fr) minmax(0, 1.45fr); }
  .clock__list { max-width: none; }
  .shot--record [data-beat='num'] .beat__in { max-width: 60%; }
  .film .record__photo figcaption { display: none; }
  .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.88) 0%, rgb(var(--scrim) / 0.62) 55%, rgb(var(--scrim) / 0.2) 100%) !important; }
}

/* 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'] .values__name, [lang='ar'] .reasons__list h3, [lang='ar'] .laurels__list h3, [lang='ar'] .ncard h3, [lang='ar'] .perks h3, [lang='ar'] .faq summary, [lang='ar'] .offices h3, [lang='ar'] .foot__title, [lang='ar'] .brief__line { font-weight: 500; line-height: 1.6; }
[lang='ar'] .brief select, [lang='ar'].film .values__sub { font-style: normal; }
[lang='ar'] .channel__value { font-family: 'Jost', 'Avenir Next', sans-serif; }
[lang='ar'].film .values__name { font-weight: 600; line-height: 1.35; }
[lang='ar'].film .values__sub { font-weight: 500; line-height: 1.5; }
[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; }
}