/* Sari Group. Navy first; every shape and edge sits on the logo's 30° rail. */

@font-face { font-family: 'Poppins'; src: url(/fonts/poppins-light.woff2) format('woff2'); font-weight: 300; font-display: swap; }
@font-face { font-family: 'Poppins'; src: url(/fonts/poppins-bold.woff2) format('woff2'); font-weight: 700; font-display: swap; }
@font-face { font-family: 'KO Sans'; src: url(/fonts/kosans-light.woff2) format('woff2'); font-weight: 300; font-display: swap; unicode-range: U+0600-06FF, U+0750-077F, U+FB50-FDFF, U+FE70-FEFF, U+200C-200F; }
@font-face { font-family: 'KO Sans'; src: url(/fonts/kosans-bold.woff2) format('woff2'); font-weight: 700; font-display: swap; unicode-range: U+0600-06FF, U+0750-077F, U+FB50-FDFF, U+FE70-FEFF, U+200C-200F; }

:root {
  --navy: #00556E;
  --deep: #003A4B;
  --rail: #2E7287;
  --mist: #E3ECEE;
  --paper: #F6F8F8;
  --white: #FFFFFF;
  --ink: #0E2F3A;
  --muted: #4A6670;
  --line: rgba(14, 47, 58, .16);
  --tint: #9CC0CA;

  --font: 'Poppins', 'KO Sans', system-ui, sans-serif;
  --k: 1;                      /* Arabic sets this larger so both scripts read the same size */
  --track: -0.025em;
  --lh-head: 1.04;
  --ease: cubic-bezier(.65, 0, .35, 1);
  --gutter: clamp(20px, 5vw, 64px);
  --head-h: 64px;
  --rise: clamp(28px, 3.6vw, 52px);

  /* colours for the current surface; dark surfaces override */
  --fg: var(--ink);
  --fg-soft: var(--muted);
  --rule: var(--line);
  --focus: var(--navy);
  --art-a: var(--navy);
  --art-b: var(--tint);
}
:lang(ar) { --font: 'KO Sans', 'Poppins', system-ui, sans-serif; --k: 1.08; --track: 0; --lh-head: 1.3; }

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; overflow-x: clip; scroll-padding-top: calc(var(--head-h) + 16px); }
body {
  margin: 0; background: var(--paper); color: var(--fg);
  font: 300 calc(1.0625rem * var(--k)) / 1.65 var(--font);
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; overflow-x: clip;
}
:lang(ar) body, body:lang(ar) { line-height: 1.8; }
img, svg { display: block; max-width: 100%; }
a { color: inherit; text-decoration-thickness: 1px; text-underline-offset: .2em; }
p { margin: 0 0 1em; }
p:last-child { margin-bottom: 0; }
ul, ol { margin: 0; padding: 0; list-style: none; }
h1, h2, h3, h4 { margin: 0; font-weight: 300; }
strong, b { font-weight: 700; }
button, input, select, textarea { font: inherit; color: inherit; }
[hidden] { display: none !important; }
::selection { background: var(--navy); color: var(--white); }

:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }
.vh { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.skip { position: absolute; inset-inline-start: 12px; top: -80px; z-index: 100; background: var(--white); color: var(--navy); padding: 12px 18px; font-weight: 700; }
.skip:focus { top: 12px; }

.wrap { width: 100%; max-width: calc(1280px + 2 * var(--gutter)); margin-inline: auto; padding-inline: var(--gutter); }

/* ───────── Type ───────── */
.display, .h1, .h2, .h3 { letter-spacing: var(--track); line-height: var(--lh-head); text-wrap: balance; }
.display { font-size: calc(var(--k) * clamp(2.6rem, 1.5rem + 4vw, 5.5rem)); }
.h1 { font-size: calc(var(--k) * clamp(2.5rem, 1.6rem + 3.6vw, 5rem)); }
.h2 { font-size: calc(var(--k) * clamp(1.9rem, 1.35rem + 2.1vw, 3.25rem)); }
.h2--xl { font-size: calc(var(--k) * clamp(2.4rem, 1.5rem + 3.5vw, 5rem)); }
.h3 { font-size: calc(var(--k) * clamp(1.4rem, 1.2rem + .7vw, 1.75rem)); }
.h4 { font-size: calc(var(--k) * 1.0625rem); font-weight: 700; line-height: 1.35; letter-spacing: 0; }
.lead { font-size: calc(var(--k) * clamp(1.125rem, 1.04rem + .35vw, 1.375rem)); line-height: 1.5; color: var(--fg-soft); max-width: 38em; text-wrap: pretty; }
.lead--xl { font-size: calc(var(--k) * clamp(1.35rem, 1.1rem + 1vw, 2rem)); line-height: 1.35; color: var(--fg); }
.h2 + .lead, .h1 + .lead, .display + .lead, .h2 + p, .h3 + p { margin-top: clamp(16px, 2vw, 28px); }
.muted { color: var(--fg-soft); }
.note { margin-top: 32px; color: var(--fg-soft); }
.gap-top { margin-top: clamp(40px, 5vw, 64px); }
.prose p { max-width: 36em; }
.prose--lead p { font-size: calc(var(--k) * clamp(1.125rem, 1.04rem + .35vw, 1.3rem)); line-height: 1.55; }
.prose .h2 { margin-bottom: clamp(20px, 2.5vw, 32px); }
.narrow { max-width: 760px; }

/* ───────── Buttons and links ───────── */
.actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: clamp(24px, 3vw, 40px); }
.btn {
  display: inline-flex; align-items: center; justify-content: center; min-height: 52px; padding: 0 26px;
  background: var(--navy); color: var(--white); border: 1px solid var(--navy);
  font-weight: 700; font-size: calc(var(--k) * .9375rem); line-height: 1.2; text-decoration: none; cursor: pointer;
  transition: background-color .2s, color .2s, border-color .2s;
}
.btn:hover { background: var(--deep); border-color: var(--deep); }
.btn--light { background: var(--white); color: var(--navy); border-color: var(--white); }
.btn--light:hover { background: var(--mist); border-color: var(--mist); color: var(--deep); }
.btn--ghost { background: transparent; color: var(--fg); border-color: currentColor; }
.btn--ghost:hover { background: rgba(255, 255, 255, .1); border-color: currentColor; }
.btn[disabled] { opacity: .6; cursor: progress; }

.link { display: inline-flex; align-items: center; gap: 12px; font-weight: 700; text-decoration: none; }
.link:hover { text-decoration: underline; }
.tick { width: 20px; height: 16px; flex: none; fill: currentColor; transition: transform .35s var(--ease); }
a:hover > .tick, a:focus-visible > .tick, .row:hover .tick, .news__item:hover .tick, .project:hover .tick { transform: translate(6px, -3.46px); }
[dir=rtl] a:hover > .tick, [dir=rtl] a:focus-visible > .tick, [dir=rtl] .row:hover .tick, [dir=rtl] .news__item:hover .tick, [dir=rtl] .project:hover .tick { transform: translate(-6px, 3.46px); }

/* ───────── Surfaces ───────── */
.sec { position: relative; padding-block: clamp(72px, 9vw, 136px); background: var(--bg, var(--paper)); }
.sec--paper { --bg: var(--paper); }
.sec--mist { --bg: var(--mist); }
.sec--navy, .hero, .phero, .head, .foot, .is-teaser, .is-bare {
  --fg: var(--white); --fg-soft: rgba(255, 255, 255, .78); --rule: rgba(255, 255, 255, .22); --focus: var(--white);
  --art-a: var(--white); --art-b: #5D9AAD;
  color: var(--fg);
}
.sec--navy { --bg: var(--navy); }

/* A stepped top edge: flat, then one climb on the 30° rail. It doesn't mirror in
   Arabic because it is the logo's own angle, not a reading direction. */
.step::before {
  content: ''; position: absolute; left: 0; right: 0; bottom: 100%; height: var(--rise); background: var(--bg);
  --x: 34%;
  clip-path: polygon(0 100%, var(--x) 100%, calc(var(--x) + var(--rise) * 1.7321) 0, 100% 0, 100% 100%);
  pointer-events: none;
}
@media (min-width: 900px) { .step::before { --x: 58%; } }

/* ───────── Header ───────── */
.head { position: sticky; top: 0; z-index: 50; background: var(--navy); }
.head__in { display: flex; align-items: center; gap: 20px; height: var(--head-h); }
.brand { display: block; flex: none; margin-inline-end: auto; padding-block: 8px; }
.lockup { height: 32px; width: auto; color: var(--white); }
.lang { font-weight: 700; font-size: .9375rem; text-decoration: none; padding: 10px 4px; }
.lang:lang(ar) { font-family: 'KO Sans', sans-serif; font-size: 1.0625rem; }
.lang:hover { text-decoration: underline; }
.menu-btn { display: inline-flex; align-items: center; gap: 10px; background: none; border: 0; padding: 10px 0; cursor: pointer; font-weight: 700; font-size: calc(var(--k) * .9375rem); }
.menu-btn__bars { position: relative; width: 22px; height: 14px; }
.menu-btn__bars i { position: absolute; inset-inline: 0; height: 2px; background: currentColor; transition: transform .3s var(--ease), top .3s var(--ease); }
.menu-btn__bars i:first-child { top: 2px; }
.menu-btn__bars i:last-child { top: 10px; }
.head.is-open .menu-btn__bars i:first-child { top: 6px; transform: rotate(30deg); }
.head.is-open .menu-btn__bars i:last-child { top: 6px; transform: rotate(-30deg); }

.nav__list a { text-decoration: none; }
@media (max-width: 1079px) {
  .nav { position: fixed; inset: var(--head-h) 0 0 0; z-index: 49; background: var(--navy); padding: 24px var(--gutter) 40px; overflow-y: auto; display: none; flex-direction: column; gap: 32px; }
  .head.is-open .nav { display: flex; }
  .no-js .nav { position: static; display: flex; padding: 8px 0 24px; }
  .no-js .head__in { flex-wrap: wrap; height: auto; }
  .no-js .menu-btn { display: none; }
  .nav__list { display: grid; gap: 4px; }
  .nav__list a { display: block; padding: 6px 0; font-size: calc(var(--k) * clamp(1.75rem, 1.3rem + 2vw, 2.5rem)); letter-spacing: var(--track); line-height: 1.25; }
  .nav__list a[aria-current] { font-weight: 700; }
  .nav__cta { align-self: flex-start; }
}
@media (min-width: 1080px) {
  :root { --head-h: 80px; }
  .lockup { height: 38px; }
  .menu-btn { display: none; }
  .nav { display: flex; align-items: center; gap: 32px; }
  .nav__list { display: flex; gap: 28px; }
  .nav__extra { display: none; }
  .nav__list a { position: relative; display: block; padding: 8px 0; font-size: calc(var(--k) * .9375rem); color: rgba(255, 255, 255, .82); }
  .nav__list a:hover, .nav__list a[aria-current] { color: var(--white); }
  .nav__list a[aria-current]::after { content: ''; position: absolute; inset-inline: 0; bottom: 0; height: 2px; background: currentColor; }
  .nav__cta { min-height: 44px; padding: 0 18px; }
  .lang { order: 3; }
}

/* ───────── Living mark ───────── */
.mark { overflow: visible; width: 100%; height: auto; }
.mark__ink { fill: var(--white); }
.mark__grid line { stroke: var(--white); stroke-opacity: .13; stroke-width: 1; vector-effect: non-scaling-stroke; }

/* ───────── Home hero ───────── */
.hero { position: relative; overflow: hidden; background: var(--navy); }
.hero__grid { display: grid; grid-template-areas: "mark" "text"; align-items: center; gap: clamp(32px, 5vw, 48px); padding-block: clamp(48px, 8vw, 96px) clamp(80px, 10vw, 128px); min-height: calc(100svh - var(--head-h)); }
.hero__mark { grid-area: mark; width: min(100%, 560px); justify-self: start; padding-top: 12px; }
.hero__text { grid-area: text; max-width: 40rem; }
.hero .display { max-width: 13em; }
@media (min-width: 900px) {
  .hero__grid { grid-template-areas: ". mark" "text text"; grid-template-columns: 1fr 1fr; column-gap: 64px; align-content: center; }
  .hero__mark { width: 100%; max-width: 600px; justify-self: end; padding-top: 0; }
  .hero__text { max-width: none; }
  .hero .display { max-width: 14em; }
  .hero .lead { max-width: 34em; }
}

/* ───────── Inner page hero ───────── */
.phero { background: var(--navy); overflow: hidden; }
.phero__grid { display: grid; gap: 40px; padding-block: clamp(48px, 8vw, 112px) clamp(72px, 9vw, 128px); align-items: center; }
.phero__art { width: min(46vw, 210px); justify-self: end; }
.phero .facts { margin-top: clamp(32px, 4vw, 48px); }
.phero .actions { margin-top: clamp(24px, 3vw, 36px); }
@media (min-width: 900px) {
  .phero__grid { grid-template-columns: 7fr 4fr; gap: 64px; }
  .phero__art { width: 100%; max-width: 420px; }
}
.phero--article .wrap { padding-block: clamp(48px, 8vw, 112px) clamp(64px, 8vw, 104px); }
.article__title { max-width: 18em; }
.article__meta { display: flex; flex-wrap: wrap; gap: 8px 24px; color: var(--fg-soft); margin: 0 0 20px; }

.crumbs { margin-bottom: clamp(24px, 3vw, 40px); font-size: calc(var(--k) * .875rem); color: var(--fg-soft); }
.crumbs ol { display: flex; flex-wrap: wrap; gap: 6px 0; }
.crumbs li { display: inline-flex; align-items: center; }
.crumbs li + li::before { content: ''; width: 10px; height: 8px; margin-inline: 10px; background: currentColor; clip-path: polygon(0 100%, 100% 28%, 100% 0, 0 72%); opacity: .7; }
.crumbs a { text-decoration: none; }
.crumbs a:hover { text-decoration: underline; color: var(--fg); }
.crumbs [aria-current] { color: var(--fg); }

/* ───────── Illustrations ───────── */
.art, .row__emblem { overflow: visible; width: 100%; height: auto; }
.art .t0, .row__emblem .t0 { fill: var(--art-a); }
.art .t1, .row__emblem .t1 { fill: var(--art-b); }

/* ───────── Split layout ───────── */
.split { display: grid; gap: clamp(32px, 5vw, 48px); }
.split__art { width: min(58vw, 260px); margin-top: clamp(32px, 5vw, 64px); }
.split__side.split__art { margin-top: 0; justify-self: end; }
@media (min-width: 900px) {
  .split { grid-template-columns: 5fr 7fr; gap: 64px; align-items: start; }
  .split--rev { grid-template-columns: 7fr 5fr; align-items: center; }
  .split__side { position: sticky; top: calc(var(--head-h) + 32px); }
  .split--rev .split__side { position: static; }
  .split__art { width: 100%; max-width: 380px; }
}

/* ───────── Company rows ───────── */
.rows { border-top: 1px solid var(--rule); }
.rows li { border-bottom: 1px solid var(--rule); }
.row { display: grid; grid-template-columns: 56px 1fr 20px; gap: 20px; align-items: start; padding-block: clamp(20px, 2.6vw, 32px); text-decoration: none; }
.row__emblem { width: 56px; margin-top: 6px; }
.row .tick { margin-top: 12px; }
.row__title { font-size: calc(var(--k) * clamp(1.4rem, 1.1rem + 1.1vw, 2rem)); letter-spacing: var(--track); line-height: 1.15; }
.row__meta { margin: 6px 0 0; font-weight: 700; font-size: calc(var(--k) * .875rem); color: var(--navy); }
.row__text { margin: 6px 0 0; color: var(--fg-soft); }
.row:hover .row__title { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .18em; }
@media (min-width: 640px) { .row { grid-template-columns: 72px 1fr 20px; gap: 28px; align-items: center; } .row__emblem { width: 72px; margin-top: 0; } .row .tick { margin-top: 0; } }

/* ───────── Lists of points ───────── */
.trio, .duo { border-top: 1px solid var(--rule); }
.trio li, .duo li { padding-block: clamp(20px, 2.6vw, 32px); border-bottom: 1px solid var(--rule); }
.trio .h4, .duo .h4 { font-size: calc(var(--k) * clamp(1.25rem, 1.1rem + .6vw, 1.6rem)); font-weight: 300; letter-spacing: var(--track); line-height: 1.2; margin-bottom: 8px; }
.trio p, .duo p { color: var(--fg-soft); max-width: 34em; }
.split__main > .lead + .trio { margin-top: clamp(28px, 3.5vw, 44px); }
@media (min-width: 640px) {
  .trio li { display: grid; grid-template-columns: 2fr 3fr; gap: 32px; align-items: baseline; }
  .trio .h4 { margin: 0; }
  .duo { display: grid; grid-template-columns: 1fr 1fr; column-gap: 40px; border-top: 0; }
  .duo li { border-top: 1px solid var(--rule); border-bottom: 0; }
}

/* ───────── Facts ───────── */
.facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 0 32px; margin: clamp(24px, 3vw, 36px) 0 0; }
.facts > div { padding-block: 14px; border-top: 1px solid var(--rule); }
.facts dt { font-size: calc(var(--k) * .8125rem); color: var(--fg-soft); }
.facts dd { margin: 4px 0 0; font-size: calc(var(--k) * 1.125rem); line-height: 1.35; }
.facts a { text-decoration: underline; }
.sec--paper > .wrap > .facts { margin-top: 0; }

/* ───────── Ezera ───────── */
.ezera {
  position: relative; display: grid; place-items: center; align-content: center; gap: clamp(24px, 4vw, 40px);
  aspect-ratio: 5 / 4; padding: 12%; background: #B6481D; color: #EADFD0;
  clip-path: polygon(0 0, calc(100% - 52px) 0, 100% 30px, 100% 100%, 0 100%);
}
.ezera__mark { width: 48%; height: auto; }
.ezera__word { display: block; width: 72%; aspect-ratio: 1400 / 184; background: currentColor; -webkit-mask: url(/img/ezera/wordmark.png) center / contain no-repeat; mask: url(/img/ezera/wordmark.png) center / contain no-repeat; }
.ezera--hero { width: 100%; }
.feature__grid { display: grid; gap: clamp(36px, 5vw, 64px); align-items: center; }
@media (min-width: 900px) { .feature__grid { grid-template-columns: 1fr 1fr; gap: 80px; } }

.project { display: grid; gap: clamp(28px, 4vw, 56px); text-decoration: none; align-items: center; }
.project__body .lead { margin-top: 16px; }
.project__body .link { margin-top: 28px; }
.project:hover .h2 { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .12em; }
@media (min-width: 900px) { .project { grid-template-columns: 6fr 5fr; gap: 72px; } }

/* ───────── News ───────── */
.news { border-top: 1px solid var(--rule); }
.news li { border-bottom: 1px solid var(--rule); }
.news__item { display: grid; grid-template-columns: 1fr 20px; gap: 8px 24px; padding-block: clamp(20px, 2.6vw, 32px); text-decoration: none; align-items: center; }
.news__item time { grid-column: 1 / -1; font-size: calc(var(--k) * .875rem); color: var(--fg-soft); }
.news__cat { margin: 0 0 4px; font-weight: 700; font-size: calc(var(--k) * .875rem); color: var(--navy); }
.news__title { font-size: calc(var(--k) * clamp(1.3rem, 1.1rem + .8vw, 1.75rem)); line-height: 1.2; letter-spacing: var(--track); }
.news__sum { margin: 8px 0 0; color: var(--fg-soft); }
.news__item:hover .news__title { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .18em; }
@media (min-width: 900px) {
  .news__item { grid-template-columns: 180px 1fr 20px; align-items: baseline; }
  .news__item time { grid-column: auto; }
}
.related { display: grid; gap: 8px; margin-top: 12px; }
.related a { text-decoration: underline; }

/* ───────── Contact band ───────── */
.band__grid { display: grid; gap: 40px; align-items: center; }
.band__art { width: min(60vw, 260px); justify-self: end; }
@media (min-width: 900px) { .band__grid { grid-template-columns: 8fr 4fr; gap: 80px; } .band__art { width: 100%; max-width: 340px; } }

/* ───────── Group structure ───────── */
.tree { margin-top: clamp(40px, 5vw, 72px); }
.tree__root { display: inline-flex; padding: 22px 28px; background: var(--navy); }
.tree__logo { height: 34px; width: auto; color: var(--white); }
.tree__kids { position: relative; margin-top: 0; padding-top: 28px; margin-inline-start: 28px; border-inline-start: 1px solid var(--navy); }
.tree__kids li { position: relative; padding-inline-start: 28px; }
.tree__kids li + li { margin-top: 20px; }
.tree__kids li::before { content: ''; position: absolute; inset-inline-start: 0; top: 1.05em; width: 18px; height: 1px; background: var(--navy); }
.tree__kids a { display: block; text-decoration: none; }
.tree__name { display: block; font-size: calc(var(--k) * clamp(1.25rem, 1.05rem + .8vw, 1.6rem)); line-height: 1.25; letter-spacing: var(--track); }
.tree__sector { display: block; color: var(--fg-soft); font-size: calc(var(--k) * .9375rem); }
.tree__kids a:hover .tree__name { text-decoration: underline; text-decoration-thickness: 1px; }
.tree__kids li:last-child { padding-bottom: 0; }
@media (min-width: 900px) {
  .tree { display: grid; justify-items: center; }
  .tree__kids { display: grid; grid-template-columns: repeat(5, 1fr); width: 100%; margin: 48px 0 0; padding-top: 0; border-inline-start: 0; border-top: 1px solid var(--navy); }
  .tree__kids::before { content: ''; position: absolute; left: 50%; top: -48px; height: 48px; width: 1px; background: var(--navy); }
  .tree__kids li { padding: 36px 20px 0; }
  .tree__kids li + li { margin-top: 0; }
  .tree__kids li::before { inset-inline-start: 20px; top: 0; width: 1px; height: 24px; }
}

/* ───────── People ───────── */
.people { border-top: 1px solid var(--rule); }
.people li { display: grid; gap: 4px; padding-block: 20px; border-bottom: 1px solid var(--rule); }
.people__role { font-weight: 700; font-size: calc(var(--k) * .875rem); color: var(--navy); }
.people__name { font-size: calc(var(--k) * 1.375rem); letter-spacing: var(--track); line-height: 1.25; }
.people__name.is-pending { color: var(--fg-soft); }
@media (min-width: 640px) { .people { display: grid; grid-template-columns: 1fr 1fr; column-gap: 40px; border-top: 0; } .people li { border-top: 1px solid var(--rule); border-bottom: 0; } }

/* ───────── Contact form ───────── */
.contact { display: grid; gap: 64px; }
@media (min-width: 960px) { .contact { grid-template-columns: 7fr 4fr; gap: 96px; align-items: start; } .office { position: sticky; top: calc(var(--head-h) + 32px); } }
.form { display: grid; gap: 24px; max-width: 640px; }
.field { border: 0; margin: 0; padding: 0; min-width: 0; }
.field > label, .field > legend { display: block; margin-bottom: 8px; font-weight: 700; font-size: calc(var(--k) * .9375rem); }
.field > legend.h3 { font-weight: 300; font-size: calc(var(--k) * clamp(1.4rem, 1.2rem + .7vw, 1.75rem)); margin-bottom: 16px; padding: 0; }
.input {
  width: 100%; min-height: 52px; padding: 12px 14px; background: var(--white); border: 1px solid #8FA9B1; border-radius: 0;
  font-size: max(16px, calc(var(--k) * 1rem)); line-height: 1.4; appearance: none; -webkit-appearance: none;
}
textarea.input { min-height: 120px; resize: vertical; }
.input:hover { border-color: var(--navy); }
.input:focus-visible { outline: 3px solid var(--navy); outline-offset: 1px; border-color: var(--navy); }
.input[aria-invalid="true"] { border-color: #A3261B; border-width: 2px; }
.phone { display: grid; grid-template-columns: minmax(0, 9.5rem) 1fr; gap: 8px; }
.phone__code { padding-inline: 12px 30px; background-image: linear-gradient(45deg, transparent 50%, var(--ink) 50%), linear-gradient(-45deg, transparent 50%, var(--ink) 50%); background-size: 6px 6px; background-repeat: no-repeat; background-position: calc(100% - 16px) 50%, calc(100% - 10px) 50%; }
/* The number reads left to right in both languages, code first */
[dir=rtl] .phone { direction: ltr; }
[dir=rtl] .phone__code { text-align: left; }
.hint { margin: 8px 0 0; font-size: calc(var(--k) * .875rem); color: var(--fg-soft); }
.err { margin: 8px 0 0; font-size: calc(var(--k) * .875rem); font-weight: 700; color: #A3261B; }
.err:empty { display: none; }
.chips { display: flex; flex-wrap: wrap; gap: 8px; }
.chip { position: relative; cursor: pointer; }
.chip input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.chip span { display: inline-flex; align-items: center; min-height: 44px; padding: 8px 16px; border: 1px solid #8FA9B1; background: var(--white); font-size: calc(var(--k) * .9375rem); transition: background-color .2s, color .2s, border-color .2s; }
.chip:hover span { border-color: var(--navy); }
.chip input:checked + span { background: var(--navy); border-color: var(--navy); color: var(--white); font-weight: 700; }
.chip input:focus-visible + span { outline: 3px solid var(--navy); outline-offset: 2px; }
.context { margin: 14px 0 0; font-weight: 700; color: var(--navy); }
.field > label.check { display: grid; grid-template-columns: 24px 1fr; gap: 12px; align-items: start; margin: 0; font-weight: 300; font-size: calc(var(--k) * .9375rem); line-height: 1.5; cursor: pointer; }
.check input { width: 22px; height: 22px; margin: 2px 0 0; accent-color: var(--navy); cursor: pointer; }
.check a { font-weight: 700; }
.hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.form .btn { justify-self: start; min-width: 200px; }
.done { padding: 32px 0; }
.done .h2 { margin-bottom: 12px; }

.office { border-top: 1px solid var(--rule); padding-top: 28px; }
.office .h4 { margin: 28px 0 8px; }
.office .h3 { margin-bottom: 12px; }
.office a { text-decoration: underline; }
.dept { display: grid; gap: 10px; margin: 0; }
.dept dt { font-size: calc(var(--k) * .875rem); color: var(--fg-soft); }
.dept dd { margin: 0; }

/* ───────── Legal pages ───────── */
.legal { max-width: 46rem; }
.legal .h3 { margin: 40px 0 12px; }
.legal .h3:first-child { margin-top: 0; }
.legal p { color: var(--fg-soft); }
.legal .muted { margin-top: 48px; }

/* ───────── Footer ───────── */
.foot { background: var(--deep); padding-block: clamp(56px, 7vw, 96px) 32px; font-size: calc(var(--k) * .9375rem); }
.foot__top { display: grid; gap: 48px; }
.foot__brand .lockup { height: 40px; }
.foot__brand { justify-self: start; }
.foot__cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 32px; }
.foot__h { font-weight: 700; font-size: calc(var(--k) * .9375rem); margin-bottom: 12px; color: var(--white); }
.foot__cols ul { display: grid; gap: 6px; }
.foot a { text-decoration: none; color: rgba(255, 255, 255, .8); }
.foot a:hover { color: var(--white); text-decoration: underline; }
.foot p { color: rgba(255, 255, 255, .8); margin: 0 0 6px; }
.foot__legal { display: grid; gap: 4px; margin-top: 56px; padding-top: 24px; border-top: 1px solid var(--rule); font-size: calc(var(--k) * .8125rem); }
.foot__legal p { color: rgba(255, 255, 255, .7); }
.foot__legal a { margin-inline-start: 12px; text-decoration: underline; }
.foot__sep { display: inline-block; width: 10px; height: 8px; margin-inline: 6px; background: currentColor; clip-path: polygon(0 100%, 100% 28%, 100% 0, 0 72%); opacity: .6; }
@media (min-width: 900px) { .foot__top { grid-template-columns: 4fr 8fr; } }

/* ───────── Teaser and 404 ───────── */
.is-teaser, .is-bare { background: var(--navy); min-height: 100svh; overflow: hidden; }
.teaser { min-height: 100svh; display: grid; place-items: center; padding: 48px var(--gutter); }
.teaser__lockup { display: grid; justify-items: center; gap: clamp(32px, 6vw, 56px); margin: 0; width: min(100%, 620px); }
.teaser__mark { display: block; width: 100%; }
.teaser__word { width: 52%; height: auto; color: var(--white); }
.bare { min-height: 100svh; display: grid; align-content: center; justify-items: start; gap: 40px; padding: 40px var(--gutter); max-width: 960px; margin-inline: auto; }
.bare__brand .lockup { height: 36px; }
.bare__mark { width: min(70vw, 360px); }
.nf .lead { margin-top: 16px; }

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