.ex-crumb{padding-block:var(--s-4) var(--s-3)}
.ex-crumb ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.35rem .6rem;
  font-size:14px;color:var(--fg-2)}
.ex-crumb li + li::before{content:"›";margin-inline-end:.6rem;color:var(--slate)}
html[dir="rtl"] .ex-crumb li + li::before{content:"‹"}
.ex-crumb a{color:var(--teal);text-decoration:none;min-block-size:24px;display:inline-block}
.ex-crumb a:hover{text-decoration:underline}
.ex-crumb [aria-current]{color:var(--ink);font-weight:600}

.ex-hero{background:var(--petrol);color:var(--white)}
.ex-hero-in{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:var(--s-7);
  align-items:center;padding-block:var(--s-7)}
.ex-hero h1{margin:0 0 var(--s-4);font-size:clamp(34px,4.6vw,60px);line-height:1.06;font-weight:700;
  text-wrap:balance}
html[lang="ar"] .ex-hero h1{line-height:1.3}
.ex-lede{margin:0 0 var(--s-5);max-inline-size:52ch;font-size:clamp(16px,1.4vw,19px);line-height:1.6}
html[lang="ar"] .ex-lede{line-height:1.9}
.ex-cta{display:flex;flex-wrap:wrap;gap:var(--s-3)}
.ex-hero-film{aspect-ratio:16/9;border-radius:3px;overflow:hidden;background:var(--ink)}
.ex-hero-film video,.ex-hero-film picture,.ex-hero-film img{display:block;inline-size:100%;
  block-size:100%;object-fit:cover}

.ex-sec{padding-block:var(--band)}
.ex-sunk{background:var(--bg-sunk)}

.ex-bento{list-style:none;margin:var(--s-6) 0 0;padding:0;display:grid;gap:var(--s-4);
  grid-template-columns:repeat(12,minmax(0,1fr))}
.ex-tile{grid-column:span 6;display:flex;flex-direction:column;gap:var(--s-3);min-inline-size:0;
  padding:var(--s-5);border:1px solid var(--rule);border-radius:3px;background:var(--white)}
.ex-w7{grid-column:span 7}.ex-w5{grid-column:span 5}.ex-w6{grid-column:span 6}.ex-w3{grid-column:span 3}
.ex-tile--dark{background:var(--petrol);border-color:var(--petrol);color:var(--white)}
.ex-tile--sunk{background:var(--bg-sunk)}
.ex-n{font-size:13px;font-weight:700;letter-spacing:.12em;color:var(--teal)}
.ex-tile--dark .ex-n{color:var(--mint)}
.ex-tile h3{margin:0;font-size:24px;line-height:1.2;font-weight:700}
.ex-tile h3 a{color:inherit;text-decoration:none}
.ex-tile h3 a:hover{text-decoration:underline}
.ex-tile p{margin:0;font-size:16px;line-height:1.55;color:var(--fg-2)}
html[lang="ar"] .ex-tile p{line-height:1.8}
.ex-tile--dark p{color:var(--white)}
.ex-kids{list-style:none;margin:0;padding:0;display:grid;gap:var(--s-2)}
.ex-kids li{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--s-3);
  padding-block:var(--s-2);border-block-end:1px solid var(--rule)}
.ex-kids a{color:var(--ink);font-weight:600;text-decoration:none;min-block-size:44px;
  display:inline-flex;align-items:center}
.ex-kids a:hover{color:var(--teal)}
.ex-tile-a{margin-block-start:auto;padding-block-start:var(--s-3);display:flex;flex-wrap:wrap;
  align-items:center;justify-content:space-between;gap:var(--s-3)}
.ex-more{color:var(--teal);font-weight:600;text-decoration:none;min-block-size:44px;
  display:inline-flex;align-items:center}
.ex-more:hover{text-decoration:underline}
.ex-tile--dark .ex-more{color:var(--white)}
.ex-add{min-block-size:44px;padding:.55rem 1rem;border:1px solid var(--teal);border-radius:3px;
  background:transparent;color:var(--teal);font-size:15px;font-weight:600;cursor:pointer;
  max-inline-size:100%;white-space:normal;overflow-wrap:anywhere}
.ex-add:hover{background:var(--teal);color:var(--white)}
.ex-add--sm{padding:.4rem .8rem;font-size:14px}
.ex-tile--dark .ex-add{border-color:var(--white);color:var(--white)}
.ex-tile--dark .ex-add:hover{background:var(--white);color:var(--petrol)}

.ex-figs{margin-block-start:var(--s-6);display:grid;gap:var(--s-5);
  grid-template-columns:minmax(0,2fr) minmax(0,1fr) minmax(0,1fr);align-items:start}
.ex-fig{margin:0;min-inline-size:0}
.ex-fig-img{aspect-ratio:4/3;overflow:hidden;border-radius:3px;background:var(--bg)}
.ex-fig--lead .ex-fig-img{aspect-ratio:3/2}
.ex-fig-img picture,.ex-fig-img img{display:block;inline-size:100%;block-size:100%;object-fit:cover}
.ex-fig figcaption{margin-block-start:var(--s-3);display:grid;gap:.15rem}
.ex-fig figcaption strong{font-size:17px}
.ex-fig figcaption span{font-size:15px;color:var(--fg-2)}

.ex-brief{list-style:none;margin:var(--s-6) 0 0;padding:0;display:grid;gap:var(--s-4);
  grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr))}
.ex-brief li{border-block-start:2px solid var(--teal);padding-block-start:var(--s-3);font-size:17px;
  line-height:1.5}
html[lang="ar"] .ex-brief li{line-height:1.8}

.ex-rel{padding-block:var(--s-7);border-block-start:1px solid var(--rule)}
.ex-rel h2{margin:0 0 var(--s-4);font-size:22px}
.ex-rel-l{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:var(--s-3)}
.ex-rel-l a{display:inline-flex;align-items:center;min-block-size:48px;padding:.6rem 1.2rem;
  border:1px solid var(--control-border);border-radius:99px;color:var(--ink);font-weight:600;
  text-decoration:none}
.ex-rel-l a:hover{background:var(--petrol);color:var(--white);border-color:var(--petrol)}

@media (max-width:900px){
  .ex-hero-in{grid-template-columns:1fr;gap:var(--s-5);padding-block:var(--s-5)}
  .ex-hero-film{order:-1}
  .ex-bento{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ex-tile,.ex-w7,.ex-w5,.ex-w6,.ex-w3{grid-column:span 1}
  .ex-tile--dark,.ex-tile--sunk{grid-column:1 / -1}
  .ex-figs{grid-template-columns:1fr}
}
@media (max-width:620px){
  .ex-bento{grid-template-columns:1fr}
  .ex-tile{padding:var(--s-4)}
}
@media (prefers-reduced-motion:reduce){ .ex-add,.ex-rel-l a{transition:none} }

.ex-stand{padding-block:0 var(--band)}
.ex-stand-fig{margin:0;aspect-ratio:21/9;overflow:hidden;border-radius:3px;background:var(--bg-sunk)}
.ex-stand-fig picture,.ex-stand-fig img{display:block;inline-size:100%;block-size:100%;object-fit:cover;object-position:50% 55%}
@media (max-width:620px){ .ex-stand-fig{aspect-ratio:4/3} }