/* Site chrome for artanepartners.com: header and menu, page header, breadcrumb, footer,
   notices and the Arabic prompt. Injected into every public page by scripts/site-chrome.mjs
   (edit the partials once, re-inject). The structure is the October 2026 redesign's; the
   colours are the site's own (navy, cool off-white, the light-blue accent). Every class here is
   namespaced (hdr, menu, phead, crumbs, ftr, langprompt, ap-) so page styles are untouched. */

/* ---------- Fonts the chrome needs (the page bodies keep /fonts/fonts.css) ---------- */
@font-face { font-family: 'Display Fallback'; src: local('Georgia'); size-adjust: 95.3%; ascent-override: 80.9%; descent-override: 24%; line-gap-override: 0%; }
@font-face { font-family: 'Sans Fallback'; src: local('Arial'), local('ArialMT'); size-adjust: 103.2%; ascent-override: 96.1%; descent-override: 30%; line-gap-override: 0%; }
@font-face { font-family: 'Arabic Fallback'; src: local('Geeza Pro'), local('Segoe UI'), local('Tahoma'); size-adjust: 100%; }
@font-face { font-family: 'Markazi Text'; src: url('/fonts/ar/markazi-text-500-ar.woff2') format('woff2'); font-weight: 400 700; font-style: normal; font-display: swap; size-adjust: 112%; }
@font-face { font-family: 'IBM Plex Sans Arabic'; src: url('/fonts/ar/ibm-plex-sans-arabic-400.woff2') format('woff2'); font-weight: 300 400; font-style: normal; font-display: swap; }
@font-face { font-family: 'IBM Plex Sans Arabic'; src: url('/fonts/ar/ibm-plex-sans-arabic-500.woff2') format('woff2'); font-weight: 500 700; font-style: normal; font-display: swap; }
/* Only the glyphs of the language switch and prompt, so English pages never fetch a full Arabic face. */
@font-face { font-family: 'Arabic UI'; src: url('/fonts/ar/plex-arabic-ui-500.woff2') format('woff2'); font-weight: 400 600; font-style: normal; font-display: swap; }

:root {
    /* the site's palette */
    --ap-navy: #0F1829;
    --ap-navy-950: #070D18;
    --ap-navy-2: #1A2540;
    --ap-cream: #F7F7FA;
    --ap-cream-2: #ECEEF3;
    --ap-ink: #1F2733;
    --ap-body: #2F3845;
    --ap-muted: #5E6573;            /* 5.6:1 on --ap-cream */
    --ap-accent: #94D2FF;           /* the site's light blue: marks, rules and the lattice */
    --ap-accent-ink: #1F5E8C;       /* the accent as text on light: 6.6:1 */
    --ap-on-navy: #F2F4F8;
    --ap-on-navy-mu: #B8BECB;       /* 9.1:1 on navy */
    --ap-rule: rgba(15, 24, 41, 0.12);
    --ap-rule-2: rgba(15, 24, 41, 0.28);
    --ap-rule-navy: rgba(242, 244, 248, 0.16);
    /* type */
    --ap-display: 'Dashiell Fine', 'Display Fallback', Georgia, 'Times New Roman', serif;
    --ap-sans: 'DM Sans', 'Sans Fallback', system-ui, -apple-system, 'Segoe UI', Arial, sans-serif;
    --ap-ar-display: 'Markazi Text', 'Arabic Fallback', serif;
    --ap-ar-text: 'IBM Plex Sans Arabic', 'Arabic Fallback', 'Geeza Pro', 'Segoe UI', Tahoma, sans-serif;
    --ap-fs-small: 0.9375rem;
    --ap-fs-xs: 0.8125rem;
    --ap-lh-body: 1.65;
    /* space */
    --ap-1: 0.25rem; --ap-2: 0.5rem; --ap-3: 0.75rem; --ap-4: 1rem; --ap-5: 1.5rem; --ap-6: 2rem; --ap-7: 3rem; --ap-8: 4rem;
    --ap-gutter: clamp(1.25rem, 0.6rem + 3.2vw, 4rem);
    --ap-col-gap: clamp(1rem, 0.6rem + 1.6vw, 2.5rem);
    --ap-wrap: 82.5rem;
    --ap-hdr-h: 4.5rem;
    --ap-ease: cubic-bezier(0.2, 0.6, 0.2, 1);
}
html[lang="ar"] { --ap-fs-xs: 0.9375rem; } /* Arabic letterforms need 15 px at the smallest step */
/* The page's own font stacks get size-matched fallbacks (PERF-05): text set in Georgia or Arial
   while the web fonts load takes the same room, so nothing jumps when they arrive. This file loads
   after the pages' inline styles, so these win over the same variables there. */
:root { --display: 'Dashiell Fine', 'Display Fallback', Georgia, serif; --sans: 'DM Sans', 'Sans Fallback', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; }
/* Arabic pages set Latin words (names, Bloomberg, an LEI) in the Arabic faces' own Latin, which both
   files carry in full. With Dashiell or DM Sans first in the stack, every space and digit pulled
   about 170 KB of Latin fonts onto each Arabic page. */
html[lang="ar"] { --display: var(--ap-ar-display); --serif: var(--ap-ar-display); --sans: var(--ap-ar-text); --ap-display: var(--ap-ar-display); --ap-sans: var(--ap-ar-text); }

/* ---------- Type and spacing (a light layer over the page styles) ----------
   Only bare elements are touched; any page rule with a class keeps its own look. */
body { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
body p, body li { line-height: var(--ap-lh-body); }
body p:not([class]), body li:not([class]) { font-weight: 400; }
html[lang="ar"] body { font-family: var(--ap-ar-text); }
html[lang="ar"] :is(.hdr, .menu, .phead, .ftr, .crumbs) { font-family: var(--ap-ar-text); } /* the chrome's own sans would fall back to a system face for Arabic */
.ap-main { display: block; }
html[lang="ar"] :is(h1, h2, h3, h4) { font-family: var(--ap-ar-display); font-weight: 500; letter-spacing: 0; }
html[lang="ar"] body p, html[lang="ar"] body li { line-height: 1.9; }
:focus-visible { outline: 2px solid var(--ap-accent-ink); outline-offset: 2px; }

/* ---------- Utilities ---------- */
.vh { position: absolute !important; inline-size: 1px; block-size: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.skip { position: absolute; inset-inline-start: var(--ap-4); inset-block-start: -10rem; z-index: 100; background: var(--ap-navy); color: var(--ap-on-navy); padding: var(--ap-3) var(--ap-4); font: 500 var(--ap-fs-small)/1.2 var(--ap-sans); text-decoration: none; }
.skip:focus { inset-block-start: var(--ap-4); }
.lattice { inline-size: 100%; block-size: 100%; display: block; }

/* ---------- Security notice strip (the live site's, kept at the top at the owner's request)
   and the site-wide accents it carried: the light-blue bar before eyebrow labels, the selection ---------- */
.ap-fraud{background:#0F1829;color:#F2F4F8;position:relative;z-index:70;border-bottom:1px solid rgba(242,244,248,.10)}
/* site-wide brand accent system (shared via this block) */
::selection{background:#94D2FF;color:#0F1829}
.eyebrow::before,[class$="-eyebrow"]::before{content:"";display:inline-block;width:22px;height:2px;background:#94D2FF;margin-inline-end:10px;vertical-align:3px}
.ap-fraud .apf-inner{max-width:1480px;margin:0 auto;padding:9px clamp(20px,4vw,64px);display:flex;align-items:center;gap:clamp(14px,2vw,24px)}
.ap-fraud .apf-pill{flex:0 0 auto;display:inline-flex;align-items:center;gap:8px;color:#94D2FF;font-family:var(--sans,'DM Sans',-apple-system,sans-serif);font-size:11px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;line-height:1.3}
.ap-fraud .apf-pill svg{flex:0 0 auto}
.ap-fraud .apf-text{flex:1 1 auto;font-family:var(--sans,'DM Sans',-apple-system,sans-serif);font-size:13px;font-weight:400;line-height:1.5;color:rgba(242,244,248,.72)}
.ap-fraud .apf-actions{flex:0 0 auto;display:flex;align-items:center;gap:14px}
.ap-fraud .apf-more{display:inline-flex;align-items:center;gap:6px;background:none;border:0;cursor:pointer;font-family:var(--sans,'DM Sans',-apple-system,sans-serif);font-size:12.5px;font-weight:600;color:#F2F4F8;padding:6px 0}
.ap-fraud .apf-more svg{transition:transform .2s ease}
.ap-fraud .apf-more[aria-expanded="true"] svg{transform:rotate(180deg)}
.ap-fraud .apf-close{display:inline-flex;align-items:center;justify-content:center;background:none;border:0;cursor:pointer;color:rgba(242,244,248,.6);width:30px;height:30px;padding:0}
.ap-fraud .apf-close:hover,.ap-fraud .apf-more:hover{opacity:.75}
.ap-fraud .apf-panel{display:none;background:#F7F7FA;border-bottom:1px solid rgba(15,24,41,.12)}
.ap-fraud .apf-panel.open{display:block}
.ap-fraud .apf-panel-inner{max-width:1480px;margin:0 auto;padding:clamp(24px,3.6vh,40px) clamp(20px,4vw,64px)}
.ap-fraud .apf-panel-inner .apf-body{max-width:76ch;font-family:var(--sans,'DM Sans',-apple-system,sans-serif);font-size:15px;font-weight:300;line-height:1.7;color:#2F3845}
.ap-fraud .apf-panel-inner .apf-body p{margin:0 0 14px}
.ap-fraud .apf-panel-inner .apf-body strong{font-weight:600;color:#0F1829}
.ap-fraud .apf-panel-inner .apf-body a{color:#0F1829;font-weight:500;text-decoration:underline;text-underline-offset:2px}
@media(max-width:880px){
.ap-fraud .apf-inner{flex-wrap:wrap;gap:8px;padding-top:9px;padding-bottom:10px}
.ap-fraud .apf-text{flex:1 1 100%;order:3;font-size:12.5px}
.ap-fraud .apf-actions{margin-inline-start:auto;order:2}
}
html[lang="ar"] .ap-fraud .apf-pill{letter-spacing:0;text-transform:none;font-family:var(--ap-ar-text);font-size:13px}
html[lang="ar"] .ap-fraud .apf-text,html[lang="ar"] .ap-fraud .apf-more,html[lang="ar"] .ap-fraud .apf-panel-inner .apf-body{font-family:var(--ap-ar-text);line-height:1.8}
html[lang="ar"] .ap-fraud .apf-text{font-size:13.5px}
html[lang="ar"] .ap-fraud .apf-panel-inner .apf-body{font-size:16px;font-weight:400}

/* ---------- Header (always the site's navy) ---------- */
.hdr { position: sticky; inset-block-start: 0; z-index: 50; background: var(--ap-navy); border-block-end: 1px solid var(--ap-rule-navy); color: var(--ap-on-navy); font-family: var(--ap-sans); }
.hdr *, .menu *, .ftr *, .phead *, .langprompt * { box-sizing: border-box; }
.hdr, .menu, .ftr, .phead, .ap-fraud, .langprompt { text-align: start; } /* a page that centres its body (the 404) does not centre the chrome */
.hdr ul, .menu ul, .ftr ul, .crumbs ol { margin: 0; }
.hdr__in { display: flex; align-items: center; gap: var(--ap-6); block-size: var(--ap-hdr-h); max-inline-size: calc(var(--ap-wrap) + 2 * var(--ap-gutter)); margin-inline: auto; padding-inline: var(--ap-gutter); }
.hdr__brand { flex: none; display: inline-flex; align-items: center; padding-block: var(--ap-3); text-decoration: none; }
.hdr__brand img { display: block; inline-size: clamp(9.5rem, 8rem + 3vw, 12.25rem); block-size: auto; max-inline-size: none; }
.hdr__nav { flex: 1; display: none; }
.hdr__nav ul { list-style: none; padding: 0; display: flex; justify-content: center; gap: clamp(1rem, 0.2rem + 1.6vw, 2.25rem); }
.hdr__nav a { display: block; padding-block: var(--ap-2); font-size: var(--ap-fs-small); font-weight: 400; line-height: 1.4; color: var(--ap-on-navy-mu); text-decoration: none; border-block-end: 1px solid transparent; transition: border-color .2s var(--ap-ease), color .2s var(--ap-ease); }
.hdr__nav a:hover { color: var(--ap-on-navy); border-block-end-color: var(--ap-rule-navy); }
.hdr__nav a[aria-current="page"] { color: var(--ap-on-navy); border-block-end-color: var(--ap-accent); }
.hdr__tools { margin-inline-start: auto; display: flex; align-items: center; gap: var(--ap-4); }
.hdr__lang { display: inline-flex; align-items: center; min-block-size: 2.75rem; padding-inline: var(--ap-2); font-size: var(--ap-fs-small); font-weight: 500; color: var(--ap-on-navy); text-decoration: none; border-block-end: 1px solid var(--ap-rule-navy); }
.hdr__lang:lang(ar) { font-family: 'Arabic UI', var(--ap-ar-text); font-size: 1rem; }
.hdr__cta, .menu__cta { display: none; align-items: center; justify-content: center; min-block-size: 2.5rem; padding: 0.5rem 1rem; border: 1px solid var(--ap-rule-navy); border-radius: 2px; background: transparent; color: var(--ap-on-navy); font: 500 var(--ap-fs-small)/1.2 var(--ap-sans); text-decoration: none; transition: background-color .2s var(--ap-ease), color .2s var(--ap-ease), border-color .2s var(--ap-ease); }
.hdr__cta:hover { background: var(--ap-on-navy); color: var(--ap-navy); border-color: var(--ap-on-navy); }
.hdr__menu { display: inline-flex; align-items: center; min-block-size: 2.75rem; min-inline-size: 2.75rem; padding-inline: var(--ap-3); background: none; border: 1px solid var(--ap-rule-navy); border-radius: 2px; color: inherit; font: 500 var(--ap-fs-small)/1 var(--ap-sans); cursor: pointer; }
.hdr__menu-close { display: none; }
.hdr__menu[aria-expanded="true"] .hdr__menu-label { display: none; }
.hdr__menu[aria-expanded="true"] .hdr__menu-close { display: inline; }
.menu { border-block-start: 1px solid var(--ap-rule-navy); background: var(--ap-navy); color: var(--ap-on-navy); padding: var(--ap-5) var(--ap-gutter) calc(var(--ap-7) + env(safe-area-inset-bottom)); block-size: calc(100dvh - var(--ap-hdr-h)); overflow-y: auto; overscroll-behavior: contain; }
.menu ul { list-style: none; padding: 0; }
.menu li a { display: block; padding-block: var(--ap-4); border-block-end: 1px solid var(--ap-rule-navy); font-family: var(--ap-display); font-size: 1.625rem; line-height: 1.2; text-decoration: none; color: inherit; }
html[lang="ar"] .menu li a { font-family: var(--ap-ar-display); font-weight: 500; }
.menu li a[aria-current="page"] { color: var(--ap-accent); }
/* the phone menu: one full-width call to action under the links (the language switch stays in the bar above) */
.menu__cta { display: flex; inline-size: 100%; box-sizing: border-box; min-block-size: 3.25rem; margin-block-start: var(--ap-6); padding: 0.875rem 1.5rem; background: var(--ap-on-navy); color: var(--ap-navy); border-color: var(--ap-on-navy); font-size: 1rem; }
.menu__cta:hover { background: transparent; color: var(--ap-on-navy); }
.menu__more { list-style: none; padding: 0; margin-block-start: var(--ap-6); padding-block-start: var(--ap-3); border-block-start: 1px solid var(--ap-rule-navy); display: grid; gap: 0; }
.menu .menu__more a { display: inline-flex; align-items: center; min-block-size: 2.75rem; padding-block: 0; border: 0; font-family: inherit; font-size: var(--ap-fs-small); line-height: 1.4; color: inherit; opacity: 0.85; text-decoration: underline; text-decoration-color: currentColor; text-decoration-thickness: 1px; text-underline-offset: 0.25em; }
html.menu-open { overflow: hidden; }
@media (min-width: 40em) { .hdr__cta { display: inline-flex; } }
@media (min-width: 72em) { .hdr__nav { display: block; } .hdr__menu, .menu { display: none !important; } }
@media (max-width: 23.75em) { .hdr__in { gap: var(--ap-3); } .hdr__tools { gap: var(--ap-2); } .hdr__brand img { inline-size: 8.25rem; } .hdr__lang { padding-inline: var(--ap-1); } .hdr__menu { padding-inline: var(--ap-2); } }

/* ---------- Page header (inner pages): the site's off-white, the lattice at the far side ---------- */
.phead { position: relative; overflow: hidden; background: var(--ap-cream); border-block-end: 1px solid var(--ap-rule); padding-block: clamp(3.5rem, 2.2rem + 5vw, 7rem) clamp(2.5rem, 2rem + 2.5vw, 4.5rem); font-family: var(--ap-sans); color: var(--ap-body); }
.phead__screen { position: absolute; inset-block: 0; inset-inline-end: 0; inline-size: min(44%, 36rem); color: var(--ap-navy); opacity: 0.09; pointer-events: none; -webkit-mask-image: linear-gradient(to left, #000 30%, transparent); mask-image: linear-gradient(to left, #000 30%, transparent); }
[dir="rtl"] .phead__screen { -webkit-mask-image: linear-gradient(to right, #000 30%, transparent); mask-image: linear-gradient(to right, #000 30%, transparent); }
.phead__grid { position: relative; display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--ap-col-gap); row-gap: var(--ap-5); max-inline-size: calc(var(--ap-wrap) + 2 * var(--ap-gutter)); margin-inline: auto; padding-inline: var(--ap-gutter); }
/* The header's text sits in the page's own content column (the page's .container / .wrap /
   .article / .bio-main), as the live pages had it: those wrappers are repeated inside .phead with
   .phead__w, which keeps their width and side padding and drops everything else. */
.phead__w { margin-block: 0 !important; padding-block: 0 !important; min-block-size: 0 !important; background: none !important; border: 0 !important; box-shadow: none !important; text-align: start !important; position: relative; }
.phead__grid--fit { max-inline-size: none; margin-inline: 0; padding-inline: 0; grid-template-columns: minmax(0, 1fr); }
.phead__eyebrow { grid-column: 1 / -1; margin: 0; font-size: var(--ap-fs-xs); font-weight: 500; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ap-accent-ink); }
html[lang="ar"] .phead__eyebrow { letter-spacing: 0; text-transform: none; }
.phead .phead__title { grid-column: 1 / -1; margin: 0; max-inline-size: 16em; font-family: var(--ap-display); font-weight: 400; font-size: clamp(2.25rem, 1.6rem + 2.7vw, 4rem); line-height: 1.08; letter-spacing: 0; color: var(--ap-navy); text-wrap: balance; }
html[lang="ar"] .phead .phead__title { font-family: var(--ap-ar-display); font-weight: 500; line-height: 1.35; }
.phead .phead__lede { grid-column: 1 / -1; margin: 0; max-inline-size: 40em; font-size: clamp(1.125rem, 1.05rem + 0.35vw, 1.375rem); font-weight: 400; line-height: 1.55; color: var(--ap-body); }
html[lang="ar"] .phead .phead__lede { line-height: 1.85; }
.phead__meta { grid-column: 1 / -1; margin: 0; font-size: var(--ap-fs-small); color: var(--ap-muted); }
.phead__aside { grid-column: 1 / -1; }
@media (min-width: 64em) { .phead .phead__title { grid-column: 1 / span 9; } .phead .phead__lede { grid-column: 1 / span 8; } .phead__aside { grid-column: 1 / span 10; } }
@media (max-width: 47.99em) { .phead__screen { inline-size: 70%; opacity: 0.07; } }
.crumbs { grid-column: 1 / -1; }
.crumbs ol { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: var(--ap-2); font-size: var(--ap-fs-xs); color: var(--ap-muted); }
.crumbs li { line-height: 1.4; }
.crumbs li + li::before { content: '/'; margin-inline-end: var(--ap-2); color: var(--ap-rule-2); }
.crumbs a, .crumbs li[aria-current] { display: inline-block; padding-block: 0.25rem; } /* 24 px target (WCAG 2.5.8) */
.crumbs a { text-decoration: none; color: var(--ap-muted); }
.crumbs a:hover { color: var(--ap-ink); text-decoration: underline; }

/* ---------- Footer: navy, the light-blue lattice, the notices ---------- */
.ftr { position: relative; isolation: isolate; overflow: hidden; background: var(--ap-navy-950); color: var(--ap-on-navy-mu); font: 400 var(--ap-fs-small)/1.6 var(--ap-sans); }
html[lang="ar"] .ftr { font-family: var(--ap-ar-text); }
.ftr__screen { position: absolute; z-index: -1; inset-block: 0; inset-inline-end: 0; inline-size: min(48%, 40rem); /* the full height of the footer: no edge partway down */ color: var(--ap-accent); opacity: 0.12; pointer-events: none; -webkit-mask-image: linear-gradient(to left, #000 25%, transparent); mask-image: linear-gradient(to left, #000 25%, transparent); }
[dir="rtl"] .ftr__screen { -webkit-mask-image: linear-gradient(to right, #000 25%, transparent); mask-image: linear-gradient(to right, #000 25%, transparent); }
.ftr__in { max-inline-size: calc(var(--ap-wrap) + 2 * var(--ap-gutter)); margin-inline: auto; padding: clamp(3.5rem, 2.5rem + 4vw, 6rem) var(--ap-gutter) calc(var(--ap-7) + env(safe-area-inset-bottom)); }
.ftr p { margin: 0; max-inline-size: none; font-size: inherit; line-height: inherit; color: inherit; font-weight: 400; }
.ftr a { color: var(--ap-on-navy); text-decoration: none; overflow-wrap: anywhere; }
.ftr a:hover { text-decoration: underline; text-underline-offset: 0.2em; text-decoration-color: var(--ap-rule-navy); }
.ftr .ftr__h { color: var(--ap-on-navy); font-weight: 500; margin-block-end: var(--ap-3); }
.ftr .ftr__pro { border: 1px solid var(--ap-rule-navy); padding: var(--ap-4) var(--ap-5); margin-block-end: var(--ap-8); color: var(--ap-on-navy); max-inline-size: 60em; }
.ftr__top { display: grid; gap: var(--ap-7) var(--ap-col-gap); grid-template-columns: repeat(12, minmax(0, 1fr)); }
.ftr__brand { grid-column: 1 / -1; display: grid; gap: var(--ap-5); align-content: start; }
.ftr__brand img { display: block; inline-size: 13.75rem; block-size: auto; max-inline-size: none; }
.ftr .ftr__tag { max-inline-size: 26em; }
.ftr__nav ul, .ftr__links { list-style: none; padding: 0; }
.ftr__nav { grid-column: 1 / -1; display: grid; gap: var(--ap-6) var(--ap-col-gap); grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr)); }
.ftr__nav li + li { margin-block-start: var(--ap-2); }
.ftr__nav a { display: inline-block; padding-block: 0.15rem; }
@media (min-width: 64em) { .ftr__brand { grid-column: 1 / span 4; } .ftr__nav { grid-column: 6 / span 7; } }
.ftr__legal { margin-block-start: var(--ap-8); padding-block-start: var(--ap-6); border-block-start: 1px solid var(--ap-rule-navy); display: grid; gap: var(--ap-4); font-size: var(--ap-fs-xs); }
.ftr .ftr__disclaimer { max-inline-size: 70em; }
.ftr .ftr__reg { display: flex; flex-wrap: wrap; gap: var(--ap-1) var(--ap-4); }
.ftr__links { display: flex; flex-wrap: wrap; gap: var(--ap-2) var(--ap-5); }
.ftr__links a { display: inline-flex; min-block-size: 1.75rem; align-items: center; }

/* ---------- The Arabic prompt on English pages: offered, never forced ---------- */
.langprompt { position: fixed; z-index: 60; inset-block-end: calc(var(--ap-4) + env(safe-area-inset-bottom)); inset-inline: var(--ap-4); margin-inline: auto; max-inline-size: 30rem;
    display: flex; flex-wrap: wrap; align-items: center; gap: var(--ap-2) var(--ap-4); padding: var(--ap-3) var(--ap-3) var(--ap-3) var(--ap-5);
    background: var(--ap-navy); color: var(--ap-on-navy); font-family: 'Arabic UI', var(--ap-ar-text); font-size: 1rem; line-height: 1.6; border: 1px solid var(--ap-rule-navy); }
.langprompt[hidden] { display: none; }
.langprompt p { flex: 1 1 12rem; margin: 0; color: inherit; font-size: inherit; max-inline-size: none; }
.langprompt a { color: var(--ap-on-navy); font-weight: 500; text-decoration: underline; text-underline-offset: 0.3em; min-block-size: 2.75rem; display: inline-flex; align-items: center; }
.langprompt button { inline-size: 2.75rem; block-size: 2.75rem; background: none; border: 0; color: var(--ap-on-navy-mu); font-size: 1.5rem; line-height: 1; cursor: pointer; }
@media (prefers-reduced-motion: no-preference) { .langprompt { animation: ap-slidein .5s var(--ap-ease) both .4s; } }
@keyframes ap-slidein { from { transform: translateY(12px); } to { transform: none; } }

/* ---------- The lattice on the site's navy surfaces ----------
   The owner, 23 Oct: "I do like that pattern ... use more on the homepage". One motif, one rule:
   on navy surfaces and page headers, at the outer edge and fading towards the text, never behind
   body copy. CSS only (assets/brand/lattice-tile-*.svg), so page markup is untouched. */
:root { --ap-lattice: url('/assets/brand/lattice-tile-light.svg'); --ap-lattice-navy: url('/assets/brand/lattice-tile-navy.svg'); }
/* the home hero photograph carries no lattice (owner, 23 Oct: "remove this pattern ... from the hero image") */
/* light surfaces: the same lattice in navy, fainter, only where the space is empty */
.access-copy, .ap-briefings { position: relative; isolation: isolate; }
.access-copy::after, .ap-briefings::after, .capabilities-section::after {
    content: ""; position: absolute; z-index: -1; pointer-events: none; background: var(--ap-lattice-navy) repeat 100% 0 / 112px 112px; }
/* "Senior bankers on every mandate": the far edge of the panel, beyond the text */
.access-copy::after { inset-block: 0; inset-inline-end: 0; inset-inline-start: auto; inline-size: 46%; opacity: 0.07; -webkit-mask-image: linear-gradient(to left, #000 20%, transparent 95%); mask-image: linear-gradient(to left, #000 20%, transparent 95%); }
/* the subscribe band (light blue, on most pages): the right half, where the form is not */
.ap-briefings::after { inset-block: 0; inset-inline-end: 0; inset-inline-start: auto; inline-size: min(52%, 46rem); opacity: 0.07; -webkit-mask-image: linear-gradient(to left, #000 25%, transparent 95%); mask-image: linear-gradient(to left, #000 25%, transparent 95%); }
/* "Delivering for our clients": a quiet corner above the cards */
.capabilities-section::after { inset-block-start: 0; inset-inline-end: 0; inset-inline-start: auto; inline-size: min(42%, 34rem); block-size: 20rem; opacity: 0.06; -webkit-mask-image: radial-gradient(ellipse 100% 100% at 100% 0, #000 25%, transparent 72%); mask-image: radial-gradient(ellipse 100% 100% at 100% 0, #000 25%, transparent 72%); }
[dir="rtl"] :is(.access-copy, .ap-briefings, .capabilities-section)::after { background-position: 0 0; }
[dir="rtl"] :is(.access-copy, .ap-briefings)::after { -webkit-mask-image: linear-gradient(to right, #000 20%, transparent 95%); mask-image: linear-gradient(to right, #000 20%, transparent 95%); }
[dir="rtl"] .capabilities-section::after { -webkit-mask-image: radial-gradient(ellipse 100% 100% at 0 0, #000 25%, transparent 72%); mask-image: radial-gradient(ellipse 100% 100% at 0 0, #000 25%, transparent 72%); }
.capabilities-section { isolation: isolate; }
/* navy bands: the far edge, fading in (not the home's "What sets us apart" panel: the owner, 23 Oct) */
.relationship-band, .cta, .cta-strip { position: relative; isolation: isolate; }
.relationship-band::after, .cta::after, .cta-strip::after {
    content: ""; position: absolute; inset-block: 0; inset-inline-end: 0; inset-inline-start: auto; inline-size: min(52%, 34rem); z-index: -1; pointer-events: none;
    background: var(--ap-lattice) repeat 100% 0 / 112px 112px; opacity: 0.11;
    -webkit-mask-image: linear-gradient(to left, #000 15%, transparent 92%); mask-image: linear-gradient(to left, #000 15%, transparent 92%); }
[dir="rtl"] :is(.relationship-band, .cta, .cta-strip)::after { background-position: 0 0; -webkit-mask-image: linear-gradient(to right, #000 15%, transparent 92%); mask-image: linear-gradient(to right, #000 15%, transparent 92%); }
@media (max-width: 47.99em) { .relationship-band::after, .cta::after, .cta-strip::after { inline-size: 70%; opacity: 0.08; } .access-copy::after { inline-size: 60%; } .ap-briefings::after { inline-size: 70%; opacity: 0.07; } .capabilities-section::after { inline-size: 70%; block-size: 14rem; } }
@media print { .hero::after, .relationship-band::after, .cta::after, .cta-strip::after, .access-copy::after, .ap-briefings::after, .capabilities-section::after { display: none !important; } }

/* ---------- Narrow phones (320 px): nothing may push the page sideways ----------
   Long strings (email addresses, URLs, registry identifiers) break only where they would
   otherwise overflow; ordinary wrapping is unchanged. Card grids may shrink below their minimum. */
@media (max-width: 30em) {
    .ap-main :is(p, li, dd, dt, td, th, a, h1, h2, h3, h4, blockquote, figcaption, span) { overflow-wrap: anywhere; }
    .ap-main .cards { grid-template-columns: minmax(0, 1fr); }
}
/* the decorative blob on the capital-readiness funnel ran past the edge at tablet widths (already so before the refresh) */
html:has(.landing-blob) { overflow-x: clip; }

/* ---------- Right to left: a Latin block (a name, a deal) lines up with the Arabic column ---------- */
[dir="rtl"] :is(h1, h2, h3, h4, p, dd, dt, li)[dir="ltr"] { text-align: right; }

@media print {
    .hdr, .menu, .langprompt, .phead__screen, .ftr__screen, .skip { display: none !important; }
    .ftr { background: #fff; color: #000; }
}