@font-face{font-family:Tajawal;src:url('assets/fonts/Tajawal-Regular.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:Tajawal;src:url('assets/fonts/Tajawal-Medium.ttf') format('truetype');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:Tajawal;src:url('assets/fonts/Tajawal-Bold.ttf') format('truetype');font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:Tajawal;src:url('assets/fonts/Tajawal-ExtraBold.ttf') format('truetype');font-weight:800;font-style:normal;font-display:swap}
.language-switch button[lang=ar]{font-family:Tajawal,Arial,sans-serif;font-weight:700}
html[lang=ar] body{font-family:Tajawal,Arial,sans-serif;font-size:18px;font-synthesis:none}
html[lang=ar] h1,html[lang=ar] h2,html[lang=ar] h3,html[lang=ar] em{font-family:Tajawal,Arial,sans-serif;font-style:normal;letter-spacing:0;line-height:1.3;font-weight:700;text-wrap:balance}
html[lang=ar] p{line-height:1.85;text-wrap:pretty}
html[lang=ar] .eyebrow,html[lang=ar] .section-index{font-size:14px;font-weight:500;letter-spacing:0;line-height:1.6}
html[lang=ar] .section-index{display:flex;align-items:center;gap:14px;margin-bottom:28px;color:var(--muted)}
html[lang=ar] .section-index::before{content:'';width:28px;height:2px;background:var(--red);flex-shrink:0}
html[lang=ar] .manifesto .section-index,html[lang=ar] .practice .section-index,html[lang=ar] .leadership .section-index{color:#595a57}
html[lang=ar] .header .identity{font-size:32px;line-height:1.05;font-weight:800;gap:20px;min-width:240px}
html[lang=ar] .header .identity-sub{font-size:13px;line-height:1.5;font-weight:500;margin-top:14px}
html[lang=ar] .header nav a{font-size:15px;font-weight:500}
html[lang=ar] .header nav{gap:24px}
html[lang=ar] .contact-link{font-size:15px}
/* An Arabic text column on the left preserves the original film's aperture on the right. */
html[lang=ar] .opening-type{left:var(--pad);right:auto;width:min(61%,820px);bottom:19%;transform-origin:80% 55%;text-align:right}
html[lang=ar] .opening-type>.eyebrow{max-width:none;font-size:14px;margin-bottom:28px;color:#d4d3cf}
html[lang=ar] .opening h1{font-size:clamp(62px,7.3vw,118px);font-weight:800;line-height:1.2;max-width:none;text-wrap:nowrap}
html[lang=ar] .opening h1 em{font-size:1em;color:var(--paper);font-weight:800}
html[lang=ar] .opening h1 .accent{color:var(--red)}
html[lang=ar] .hero-shade{background:linear-gradient(90deg,#050606d9 0%,#0506069c 48%,#05060616 85%),linear-gradient(0deg,#101112c9,transparent 40%,#10111250)}
html[lang=ar] .hero-bottom-copy{justify-content:space-between;gap:32px;margin-top:34px;max-width:620px;margin-inline-start:auto}
html[lang=ar] .hero-bottom-copy p{font-size:18px;line-height:1.7;color:#d4d3cf}
html[lang=ar] .round-play{font-size:15px;font-weight:500;gap:14px;white-space:nowrap}
html[lang=ar] .round-play>span{width:56px;height:56px;flex-shrink:0}
html[lang=ar] .opening-footer{font-size:12px;letter-spacing:0}
html[lang=ar] .opening-footer button{font-size:13px}
html[lang=ar] .opening-reveal h2{font-size:clamp(38px,4.7vw,72px);line-height:1.45}
html[lang=ar] .section-pad{padding-block:100px}
html[lang=ar] .section-heading{align-items:center;margin-bottom:46px}
html[lang=ar] .section-heading h2{font-size:clamp(38px,4.4vw,64px);line-height:1.3}
html[lang=ar] .section-heading>p{font-size:17px;max-width:32ch}
html[lang=ar] .manifesto-body{grid-template-columns:1.2fr 1fr;gap:80px;align-items:center}
html[lang=ar] .manifesto h2,html[lang=ar] .leadership h2{font-size:clamp(38px,4vw,60px);line-height:1.5}
html[lang=ar] .manifesto-copy{max-width:470px}
html[lang=ar] .manifesto-copy p,html[lang=ar] .leadership-grid p{font-size:18px}
html[lang=ar] .metrics{margin-top:64px}
html[lang=ar] .metrics strong{font-weight:500;font-size:clamp(48px,5.5vw,76px)}
html[lang=ar] .metrics p{font-size:15px}
html[lang=ar] .story-layout{grid-template-columns:minmax(210px,.62fr) minmax(0,1.65fr);gap:48px}
html[lang=ar] .story-choice{padding:22px 0;gap:12px}
html[lang=ar] .story-choice b{font-weight:700;font-size:20px;line-height:1.5}
html[lang=ar] .story-choice small{font-size:13px;line-height:1.65;margin-top:5px}
html[lang=ar] .story-choice[aria-pressed=true]{border-inline-start:2px solid var(--red);padding-inline-start:16px}
html[lang=ar] .story-view h3{font-size:34px;line-height:1.4;margin-bottom:12px}
html[lang=ar] .story-view>p{font-size:17px;max-width:62ch}
html[lang=ar] .story-meta{margin-block:22px 10px}
html[lang=ar] .text-link,html[lang=ar] .pill{font-size:16px;font-weight:500}
html[lang=ar] .vertical-heading h2 br{display:none}
html[lang=ar] .vertical-heading h2 em::before{content:' '}
html[lang=ar] .vertical-heading h2{max-width:8em}
html[lang=ar] .vertical-card h3{font-size:22px;line-height:1.4}
html[lang=ar] .vertical-card p{font-size:14px}
html[lang=ar] .vertical-foot{font-size:13px;letter-spacing:0}
html[lang=ar] .small-star{display:none}
html[lang=ar] .practice-intro{gap:56px;margin-block:24px 44px}
html[lang=ar] .practice-intro p{font-size:18px;max-width:55ch}
html[lang=ar] .workflow-tabs button{font-size:20px;font-weight:500;line-height:1.5;padding:21px 24px;gap:18px}
html[lang=ar] #workflow-panel{padding:40px;min-height:440px}
html[lang=ar] #workflow-title{font-size:34px;line-height:1.4}
html[lang=ar] #workflow-copy{font-size:18px;line-height:1.85}
html[lang=ar] .workflow-output>span,html[lang=ar] .human-check b{font-size:14px;font-weight:700;letter-spacing:0}
html[lang=ar] .workflow-output p,html[lang=ar] .human-check p{font-size:16px;line-height:1.8}
html[lang=ar] .lab-heading h3{font-size:32px;line-height:1.4}
html[lang=ar] .lab-heading>p{font-size:16px;max-width:40ch}
html[lang=ar] .lab-frames figcaption span{font-size:13px;letter-spacing:0;font-weight:700}
html[lang=ar] .lab-frames figcaption p{font-size:16px}
html[lang=ar] .identity-lab{gap:48px;padding:44px}
html[lang=ar] .identity-lab h3{font-size:42px;line-height:1.3;margin-bottom:22px}
html[lang=ar] .identity-lab p{font-size:17px}
html[lang=ar] .identity-steps{flex-wrap:wrap;gap:15px;font-size:13px;letter-spacing:0}
html[lang=ar] .identity-lab summary{font-size:16px}
html[lang=ar] .library-view button{font-size:16px;font-weight:500}
html[lang=ar] .library-view>span{font-size:15px}
html[lang=ar] .search-label>span,html[lang=ar] .format-label>span{font-size:14px;letter-spacing:0}
html[lang=ar] input,html[lang=ar] select{font-size:16px}
html[lang=ar] .filters button{font-size:15px;padding:10px 18px}
html[lang=ar] .library-status{font-size:13px;letter-spacing:0;gap:20px;flex-wrap:wrap}
html[lang=ar] .film-caption{padding-top:18px}
html[lang=ar] .film-caption h3,html[lang=ar] .collection-card .film-caption h3{font-size:23px;line-height:1.45;font-weight:700}
html[lang=ar] .film-caption p{font-size:12px;line-height:1.6;font-weight:500;color:#bab9b3;margin-bottom:7px}
html[lang=ar] .film-caption small{font-size:14px;line-height:1.7;display:block;margin-top:6px}
html[lang=ar] .film-tag{font-size:12px;letter-spacing:0}
html[lang=ar] .collection-dialog-content h2{font-size:44px}
html[lang=ar] .collection-dialog-content>p{font-size:17px}
html[lang=ar] .case-content h2{font-size:44px;line-height:1.35}
html[lang=ar] .case-content>p:not(.eyebrow){font-size:19px}
html[lang=ar] #case-body h3{font-size:16px;font-weight:700;letter-spacing:0;margin-bottom:10px}
html[lang=ar] #case-body p{font-size:17px;line-height:1.9}
html[lang=ar] .case-deliverables{font-size:14px;letter-spacing:0}
html[lang=ar] .screen-information h2{font-size:30px;line-height:1.4}
html[lang=ar] .screen-information p{font-size:16px}
html[lang=ar] .screen-top>span,html[lang=ar] .screen-information dt{font-size:13px;letter-spacing:0}
html[lang=ar] .screen-top button,html[lang=ar] #case-close{font-size:15px}
html[lang=ar] .career h3{font-size:24px}
html[lang=ar] .career span,html[lang=ar] .career p{font-size:15px}
html[lang=ar] .footer-title{font-family:Tajawal,Arial,sans-serif;font-size:clamp(48px,6vw,90px);line-height:1.35;font-weight:700}
html[lang=ar] .footer-bottom{font-size:13px;letter-spacing:0}
@media(max-width:1100px){html[lang=ar] .header nav{gap:16px}html[lang=ar] .header nav a{font-size:14px}html[lang=ar] .header .identity{min-width:190px;font-size:27px}html[lang=ar] .opening-type{width:68%}html[lang=ar] .hero-bottom-copy p{font-size:17px}}
@media(max-width:760px){
 html[lang=ar] .header .identity{font-size:27px;gap:12px;min-width:0}
 html[lang=ar] .header .identity-sub{font-size:12px;margin-top:9px}
 html[lang=ar] .header nav{gap:12px}
 html[lang=ar] .header nav a{font-size:13px}
 html[lang=ar] .opening-type{left:22px;right:22px;width:auto;bottom:20%}
 html[lang=ar] .opening-type>.eyebrow{font-size:12px;max-width:30ch;margin-bottom:20px}
 html[lang=ar] .opening h1{font-size:clamp(42px,11.8vw,74px);line-height:1.3}
 html[lang=ar] .hero-bottom-copy{display:block;margin-top:24px}
 html[lang=ar] .hero-bottom-copy p{font-size:16px;line-height:1.7}
 html[lang=ar] .round-play{margin-top:22px;font-size:14px;padding:0}
 html[lang=ar] .round-play>span{width:42px;height:42px}
 html[lang=ar] .hero-shade{background:linear-gradient(0deg,#080a0bd9 15%,#080a0b70 70%,#080a0b40)}
 html[lang=ar] .opening-footer{font-size:12px;align-items:center}
 html[lang=ar] .opening-footer a{max-width:16ch;line-height:1.6}
 html[lang=ar] .section-pad{padding-block:64px}
 html[lang=ar] .section-heading{margin-bottom:30px}
 html[lang=ar] .section-index{font-size:13px;margin-bottom:18px}
 html[lang=ar] .section-heading h2,html[lang=ar] .manifesto h2,html[lang=ar] .leadership h2{font-size:36px;line-height:1.4}
 html[lang=ar] .manifesto-body,html[lang=ar] .story-layout{grid-template-columns:1fr;gap:28px}
 html[lang=ar] .manifesto-copy p,html[lang=ar] .leadership-grid p,html[lang=ar] .practice-intro p{font-size:17px}
 html[lang=ar] .metrics{margin-top:38px;gap:28px 20px}
 html[lang=ar] .metrics p{font-size:14px}
 html[lang=ar] .story-choice{min-width:230px;padding-block:15px}
 html[lang=ar] .story-choice b{font-size:18px}
 html[lang=ar] .story-choice small{font-size:12px}
 html[lang=ar] .story-view h3{font-size:28px}
 html[lang=ar] .story-meta .eyebrow{font-size:12px}
 html[lang=ar] .story-view>p{font-size:16px}
 html[lang=ar] .vertical-heading{padding-bottom:0}
 html[lang=ar] .vertical-foot{font-size:12px;gap:16px}
 html[lang=ar] .practice-intro{gap:20px;margin-block:20px 30px}
 html[lang=ar] .workflow-tabs button{font-size:17px;padding:17px 20px;flex-basis:190px}
 html[lang=ar] #workflow-panel{padding:28px 24px;min-height:0}
 html[lang=ar] #workflow-title{font-size:28px}
 html[lang=ar] #workflow-copy{font-size:17px}
 html[lang=ar] .lab-heading h3{font-size:27px}
 html[lang=ar] .identity-lab{padding:26px 22px;gap:26px}
 html[lang=ar] .identity-lab h3{font-size:32px}
 html[lang=ar] .library-view button{font-size:14px;padding:12px 14px}
 html[lang=ar] .library-view>span{font-size:14px}
 html[lang=ar] .filters button{font-size:14px;padding:8px 12px}
 html[lang=ar] .collection-grid,html[lang=ar] .film-grid{grid-template-columns:1fr;gap:30px}
 html[lang=ar] .film-caption h3,html[lang=ar] .collection-card .film-caption h3{font-size:23px}
 html[lang=ar] .film-caption p{font-size:13px}
 html[lang=ar] .film-caption small{font-size:14px}
 html[lang=ar] .film-tag{font-size:12px;padding:4px 8px;bottom:10px;left:10px}
 html[lang=ar] .film-duration{font-size:12px;padding:4px 8px;bottom:10px;right:10px}
 html[lang=ar] .collection-editions{grid-template-columns:1fr}
 html[lang=ar] .collection-dialog-content h2,html[lang=ar] .case-content h2{font-size:30px}
 html[lang=ar] .case-content>p:not(.eyebrow){font-size:17px}
 html[lang=ar] .screen-information h2{font-size:27px}
 html[lang=ar] .footer-title{font-size:42px}
 html[lang=ar] .footer-bottom{font-size:12px}
}
@media(max-width:360px){html[lang=ar] .header nav a{font-size:12px}html[lang=ar] .opening h1{font-size:39px}html[lang=ar] .opening-type{bottom:18%}html[lang=ar] .hero-bottom-copy p{font-size:15px}}
