/* ============================================================================
   SADER — CONTACT  (s-contact)
   "Correspondence" — a quiet-luxury contact page built as a letter to the
   institution. Four editorial sections that bookend a cinematic dark hero with
   a dark "glowing-sheet" contact form, a light correspondence index of offices,
   and a dark careers band. Class system matched 1:1 with contact.html and
   ar/contact.html. RTL-native via logical properties + [dir="rtl"] overrides.
   ============================================================================ */

/* Shared image treatment — aged, monochrome, high presence (matches archive). */
.s-contact-hero__img,
.s-contact-family__media img {
  filter: grayscale(1) sepia(0.10) contrast(1.06) brightness(0.42);
  transition: filter 700ms var(--ease), transform 900ms var(--ease);
}


/* ============================================================================
   1 · HERO — full-bleed reading room, ledger of figures
   ============================================================================ */
.s-contact-hero {
  position: relative;
  min-block-size: 100svh;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  overflow: hidden;
  background-color: #080808;
}

.s-contact-hero__media {
  position: absolute;
  inset: -8% 0;
  z-index: 0;
  transform: translateY(var(--parallax-y, 0));
}
.s-contact-hero__img {
  inline-size: 100%;
  block-size: 100%;
  object-fit: cover;
  object-position: center 32%;
}

.s-contact-hero__scrim {
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    linear-gradient(to top, #080808 2%, rgba(8,8,8,0.20) 48%, rgba(8,8,8,0.55) 100%),
    linear-gradient(to right, rgba(8,8,8,0.80) 0%, transparent 62%);
  pointer-events: none;
}
[dir="rtl"] .s-contact-hero__scrim {
  background:
    linear-gradient(to top, #080808 2%, rgba(8,8,8,0.20) 48%, rgba(8,8,8,0.55) 100%),
    linear-gradient(to left, rgba(8,8,8,0.80) 0%, transparent 62%);
}

.s-contact-hero__inner {
  position: relative;
  z-index: 2;
  inline-size: min(var(--container), 100% - 2 * var(--gutter));
  margin-inline: auto;
  /* Shared hero offset: eyebrow starts at header-h + space-9 from the top. */
  padding-block: calc(var(--header-h) + var(--space-9)) clamp(var(--space-9), 10vh, var(--space-11));
}
.s-contact-hero__copy { max-inline-size: 64rem; }

.s-contact-hero__kicker {
  color: rgba(255,255,255,0.55);
  margin-block-end: var(--space-6);
}

.s-contact-hero__headline {
  font-family: var(--font-display);
  font-size: clamp(3.25rem, 1.4rem + 7.6vw, 8.5rem);
  font-weight: var(--fw-light);
  line-height: 0.96;
  letter-spacing: var(--tracking-display);
  color: #F6F4F0;
  margin: 0 0 var(--space-7);
}
.s-contact-hero__headline em {
  font-style: italic;
  font-weight: var(--fw-regular);
  color: rgba(246,244,240,0.72);
}
[dir="rtl"] .s-contact-hero__headline { line-height: 1.12; }
[dir="rtl"] .s-contact-hero__headline em { font-style: normal; }

.s-contact-hero__lead {
  font-family: var(--font-body);
  font-size: clamp(var(--fs-body), 0.95rem + 0.5vw, var(--fs-lead));
  line-height: var(--lh-body);
  color: rgba(255,255,255,0.60);
  max-inline-size: 52ch;
  margin: 0 0 var(--space-8);
}

.s-contact-hero__ledger {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(var(--space-6), 5vw, var(--space-10));
  margin: 0;
  padding-block-start: var(--space-6);
  border-block-start: 1px solid rgba(255,255,255,0.16);
  max-inline-size: 48rem;
}
.s-contact-hero__fig { display: flex; flex-direction: column; gap: 2px; }
.s-contact-hero__fig dt {
  order: 2;
  font-family: var(--font-body);
  font-size: var(--fs-micro);
  font-weight: var(--fw-medium);
  letter-spacing: var(--tracking-eyebrow);
  text-transform: uppercase;
  color: rgba(255,255,255,0.40);
}
[dir="rtl"] .s-contact-hero__fig dt { letter-spacing: var(--tracking-wide); }
.s-contact-hero__fig dd {
  order: 1;
  margin: 0;
  font-family: var(--font-display);
  font-size: clamp(1.5rem, 1rem + 1.6vw, 2.5rem);
  font-weight: var(--fw-light);
  line-height: 1.05;
  letter-spacing: var(--tracking-tight);
  color: #F6F4F0;
}

.s-contact-hero__scroll {
  position: absolute;
  z-index: 3;
  inset-block-end: clamp(var(--space-5), 4vh, var(--space-7));
  inset-inline-start: 50%;
  transform: translateX(-50%);
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-3);
  color: rgba(255,255,255,0.40);
  font-family: var(--font-body);
  font-size: var(--fs-micro);
  font-weight: var(--fw-medium);
  letter-spacing: var(--tracking-eyebrow);
  text-transform: uppercase;
  text-decoration: none;
  transition: color var(--dur-fast) var(--ease);
}
[dir="rtl"] .s-contact-hero__scroll { transform: translateX(50%); letter-spacing: var(--tracking-wide); }
.s-contact-hero__scroll:hover { color: rgba(255,255,255,0.80); }
.s-contact-hero__scroll-line {
  inline-size: 1px;
  block-size: clamp(36px, 5vh, 54px);
  background: linear-gradient(to bottom, rgba(255,255,255,0.45), transparent);
  transform-origin: top center;
}
.js-motion .s-contact-hero__scroll-line { animation: contact-cue 2.2s var(--ease-in-out) infinite; }
@keyframes contact-cue {
  0%,100% { transform: scaleY(1);   opacity: 0.55; }
  50%     { transform: scaleY(1.35); opacity: 1;   }
}
@media (max-width: 640px) { .s-contact-hero__scroll-label { display: none; } }


/* ============================================================================
   2 · CONTACT CORE — dark: engraved ledger + glowing correspondence sheet
   ============================================================================ */
.s-contact-core {
  position: relative;
  padding-block: clamp(var(--space-10), 8vw, var(--space-12));
  background-color: #0C0C0C;
  background-image:
    radial-gradient(110% 70% at 16% 0%, rgba(255,255,255,0.05), transparent 55%),
    radial-gradient(90% 60% at 92% 100%, rgba(255,255,255,0.035), transparent 55%);
  overflow: hidden;
  border-block-start: 1px solid rgba(255,255,255,0.06);
}
.s-contact-core__inner {
  display: grid;
  grid-template-columns: minmax(0, 0.85fr) minmax(0, 1fr);
  gap: clamp(var(--space-8), 6vw, var(--space-11));
  align-items: start;
  inline-size: min(var(--container), 100% - 2 * var(--gutter));
  margin-inline: auto;
}

/* LEFT — the letterhead ----------------------------------------------------- */
.s-contact-core__ledger { display: flex; flex-direction: column; }
.s-contact-core__ledger .eyebrow {
  color: rgba(255,255,255,0.45);
  margin-block-end: var(--space-5);
}
.s-contact-core__title {
  font-family: var(--font-display);
  font-size: clamp(1.875rem, 1.2rem + 2.6vw, 3.25rem);
  font-weight: var(--fw-light);
  line-height: 1.06;
  letter-spacing: var(--tracking-tight);
  color: #F4F2EE;
  margin: 0 0 var(--space-5);
}
.s-contact-core__title em { font-style: italic; color: rgba(244,242,238,0.66); }
[dir="rtl"] .s-contact-core__title { line-height: 1.28; }
[dir="rtl"] .s-contact-core__title em { font-style: normal; }
.s-contact-core__intro {
  font-family: var(--font-body);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  color: rgba(255,255,255,0.52);
  max-inline-size: 42ch;
  margin: 0 0 var(--space-8);
}

/* Engraved hairline-ruled ledger */
.contact-ledger {
  margin: 0 0 var(--space-8);
  border-block-start: 1px solid rgba(255,255,255,0.12);
}
.contact-ledger__row {
  display: grid;
  grid-template-columns: minmax(8rem, 0.5fr) minmax(0, 1fr);
  gap: var(--space-4);
  align-items: baseline;
  padding-block: var(--space-5);
  border-block-end: 1px solid rgba(255,255,255,0.12);
}
.contact-ledger__label {
  font-family: var(--font-body);
  font-size: var(--fs-micro);
  font-weight: var(--fw-medium);
  letter-spacing: var(--tracking-eyebrow);
  text-transform: uppercase;
  color: rgba(255,255,255,0.40);
}
[dir="rtl"] .contact-ledger__label { letter-spacing: var(--tracking-wide); }
.contact-ledger__value {
  margin: 0;
  font-family: var(--font-display);
  font-size: var(--fs-h4);
  font-weight: var(--fw-light);
  line-height: 1.25;
  color: rgba(255,255,255,0.90);
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.contact-ledger__sub {
  font-family: var(--font-body);
  font-size: var(--fs-caption);
  letter-spacing: var(--tracking-wide);
  color: rgba(255,255,255,0.42);
}
[dir="rtl"] .contact-ledger__sub { letter-spacing: 0; }
.contact-ledger__link {
  color: rgba(255,255,255,0.90);
  text-decoration: none;
  border-block-end: 1px solid rgba(255,255,255,0.22);
  padding-block-end: 2px;
  transition: border-color var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease);
}
.contact-ledger__link:hover { color: #fff; border-color: rgba(255,255,255,0.7); }

/* Social row */
.contact-ledger__social { display: flex; flex-direction: column; gap: var(--space-4); }
.contact-ledger__social-label {
  font-family: var(--font-body);
  font-size: var(--fs-micro);
  font-weight: var(--fw-medium);
  letter-spacing: var(--tracking-eyebrow);
  text-transform: uppercase;
  color: rgba(255,255,255,0.34);
}
[dir="rtl"] .contact-ledger__social-label { letter-spacing: var(--tracking-wide); }
.contact-ledger__social-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-5) var(--space-7);
}
.contact-ledger__social-link { color: rgba(255,255,255,0.66); }
.contact-ledger__social-link:hover { color: #fff; }

/* RIGHT — the correspondence sheet (glowing panel) -------------------------- */
.s-contact-core__sheet {
  position: relative;
  background-color: rgba(255,255,255,0.025);
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: var(--radius-xs);
  padding: clamp(var(--space-6), 4vw, var(--space-9));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.06),
    0 30px 70px -40px rgba(0,0,0,0.9);
  isolation: isolate;
}
/* soft inset radial highlight — the "glow" */
.s-contact-core__sheet::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  border-radius: inherit;
  background: radial-gradient(120% 80% at 50% -10%, rgba(255,255,255,0.06), transparent 60%);
  pointer-events: none;
}

/* the hairline that "rules itself" across the top */
.contact-form__rule {
  block-size: 1px;
  inline-size: 100%;
  background: linear-gradient(to right, rgba(255,255,255,0.45), rgba(255,255,255,0.10));
  margin-block-end: clamp(var(--space-6), 3vw, var(--space-8));
  transform-origin: left center;
}
[dir="rtl"] .contact-form__rule {
  background: linear-gradient(to left, rgba(255,255,255,0.45), rgba(255,255,255,0.10));
  transform-origin: right center;
}
.js-motion .contact-form__rule { transform: scaleX(0); transition: transform var(--dur-base) var(--ease); }
.js-motion .contact-form__rule.is-in { transform: scaleX(1); }

.contact-form { display: block; }

.contact-form__head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--space-3) var(--space-5);
  margin-block-end: var(--space-7);
}
.contact-form__legend {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  margin: 0;
  font-family: var(--font-display);
  font-size: var(--fs-h3);
  font-weight: var(--fw-light);
  line-height: 1;
  color: #F4F2EE;
}
.contact-form__legend-no {
  font-family: var(--font-display);
  font-style: italic;
  font-size: var(--fs-body);
  font-weight: var(--fw-regular);
  color: rgba(255,255,255,0.32);
}
[dir="rtl"] .contact-form__legend-no { font-style: normal; }
.contact-form__note {
  margin: 0;
  font-family: var(--font-body);
  font-size: var(--fs-caption);
  color: rgba(255,255,255,0.40);
}
.contact-form__note i {
  font-style: normal;
  color: rgba(255,255,255,0.62);
}

.contact-form__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(var(--space-5), 2.5vw, var(--space-7)) var(--space-6);
}
.contact-form__field { display: flex; flex-direction: column; gap: var(--space-3); }
.contact-form__field--full { grid-column: 1 / -1; }
.contact-form__label {
  font-family: var(--font-body);
  font-size: var(--fs-micro);
  font-weight: var(--fw-medium);
  letter-spacing: var(--tracking-eyebrow);
  text-transform: uppercase;
  color: rgba(255,255,255,0.50);
}
[dir="rtl"] .contact-form__label { letter-spacing: var(--tracking-wide); }
.contact-form__label i {
  font-style: normal;
  color: rgba(255,255,255,0.62);
  margin-inline-start: 2px;
}

/* Field base: typography + reset, transparent ground */
.contact-form__input {
  inline-size: 100%;
  font-family: var(--font-body);
  font-size: var(--fs-body);
  color: #F4F2EE;
  background-color: transparent;
  border: 0;
  border-radius: 0;
  padding: var(--space-3) 0;
  transition: border-color var(--dur-fast) var(--ease), background-color var(--dur-fast) var(--ease);
  -webkit-appearance: none;
  appearance: none;
}
/* Stationery line: a single bottom hairline that inks on focus */
.contact-form__line {
  border-block-end: 1px solid rgba(255,255,255,0.22);
}
textarea.contact-form__input { resize: vertical; min-block-size: 4.5rem; line-height: var(--lh-body); }
select.contact-form__input {
  cursor: pointer;
  padding-inline-end: var(--space-7);
  background-image: linear-gradient(45deg, transparent 50%, rgba(255,255,255,0.5) 50%),
                    linear-gradient(135deg, rgba(255,255,255,0.5) 50%, transparent 50%);
  background-position: calc(100% - 12px) 1.25em, calc(100% - 6px) 1.25em;
  background-size: 6px 6px, 6px 6px;
  background-repeat: no-repeat;
}
[dir="rtl"] select.contact-form__input {
  padding-inline-end: 0;
  padding-inline-start: var(--space-7);
  background-position: 12px 1.25em, 6px 1.25em;
}
select.contact-form__input option { color: #111; }
.contact-form__input:focus {
  outline: none;
  border-color: #FFFFFF;
  background-color: rgba(255,255,255,0.04);
}
/* Invalid state — monochrome only (no colour hue, WCAG 1.4.1): a stronger
   white hairline + thickened underline so it reads as emphasis, not colour.
   Paired with aria-invalid + focus move in contact.js for AT conveyance. */
.contact-form__input.is-invalid,
.contact-form__input[aria-invalid="true"] {
  border-color: #FFFFFF;
  border-block-end-width: 2px;
  background-color: rgba(255,255,255,0.06);
}
.contact-form__input::placeholder { color: rgba(255,255,255,0.30); }

.contact-form__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-4) var(--space-7);
  margin-block-start: clamp(var(--space-7), 4vw, var(--space-9));
  padding-block-start: var(--space-6);
  border-block-start: 1px solid rgba(255,255,255,0.12);
}
.contact-form__submit {
  --_bg: #F4F2EE; --_fg: #0E0E0E;
  background-color: var(--_bg); color: var(--_fg); border-color: var(--_bg);
}
.contact-form__submit:hover { --_bg: #FFFFFF; --_fg: #0E0E0E; }
.contact-form__alt { color: rgba(255,255,255,0.62); }
.contact-form__alt:hover { color: #fff; }

/* Success panel — the "wax seal" in pure type */
.contact-form__success {
  text-align: center;
  padding-block: clamp(var(--space-7), 5vw, var(--space-10));
  display: flex;
  flex-direction: column;
  align-items: center;
}
.contact-form__success[hidden] { display: none; }
.contact-form__seal {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  inline-size: 4.5rem;
  block-size: 4.5rem;
  border: 1px solid rgba(255,255,255,0.30);
  border-radius: 50%;
  font-family: var(--font-display);
  font-size: 2.5rem;
  font-weight: var(--fw-light);
  font-style: italic;
  color: rgba(255,255,255,0.86);
  margin-block-end: var(--space-5);
}
[dir="rtl"] .contact-form__seal { font-style: normal; }
.contact-form__success-title {
  font-family: var(--font-display);
  font-size: var(--fs-h3);
  font-weight: var(--fw-light);
  color: #F4F2EE;
  margin: 0 0 var(--space-3);
}
.contact-form__success-text {
  font-family: var(--font-body);
  font-size: var(--fs-small);
  line-height: var(--lh-body);
  color: rgba(255,255,255,0.55);
  max-inline-size: 42ch;
  margin: 0 0 var(--space-6);
}
.contact-form__success-reset { color: rgba(255,255,255,0.66); }
.contact-form__success-reset:hover { color: #fff; }

@media (max-width: 860px) {
  .s-contact-core__inner { grid-template-columns: 1fr; gap: var(--space-9); }
}
@media (max-width: 540px) {
  .contact-form__grid { grid-template-columns: 1fr; }
  .contact-ledger__row { grid-template-columns: 1fr; gap: var(--space-2); }
}


/* ============================================================================
   3 · NETWORK — light: a correspondence index of offices
   ============================================================================ */
.s-contact-network {
  padding-block: clamp(var(--space-10), 7vw, var(--space-12));
  background-color: var(--bg);
  background-image:
    repeating-linear-gradient(0deg, transparent 0 47px, rgba(127,127,127,0.05) 47px 48px),
    radial-gradient(140% 60% at 50% -10%, rgba(127,127,127,0.08), transparent 50%);
  border-block-start: 1px solid var(--line);
}
.s-contact-network__inner {
  inline-size: min(var(--container), 100% - 2 * var(--gutter));
  margin-inline: auto;
}
.s-contact-network__head {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  margin-block-end: clamp(var(--space-8), 5vw, var(--space-10));
  padding-block-end: var(--space-6);
  border-block-end: 1px solid #E2DFD8;
}
.s-contact-network__head .eyebrow { color: var(--text-muted); }
.s-contact-network__title {
  font-family: var(--font-display);
  font-size: clamp(2rem, 1.2rem + 2.8vw, 3.5rem);
  font-weight: var(--fw-light);
  line-height: 1.08;
  letter-spacing: var(--tracking-tight);
  color: var(--text);
  margin: 0;
}
.s-contact-network__title em { font-style: italic; color: var(--text-muted); }
[dir="rtl"] .s-contact-network__title { line-height: 1.3; }
[dir="rtl"] .s-contact-network__title em { font-style: normal; }
.s-contact-network__intro {
  font-family: var(--font-body);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  color: var(--text-muted);
  max-inline-size: 54ch;
  margin: 0;
}

/* Headquarters — full detail + grayscale map */
.contact-hq {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
  gap: clamp(var(--space-7), 5vw, var(--space-10));
  align-items: stretch;
  padding-block-end: clamp(var(--space-8), 5vw, var(--space-10));
  margin-block-end: clamp(var(--space-8), 5vw, var(--space-10));
  border-block-end: 1px solid #E2DFD8;
}
.contact-hq__detail { display: flex; flex-direction: column; }
.contact-hq__index {
  font-family: var(--font-display);
  font-size: var(--fs-h3);
  font-weight: var(--fw-light);
  font-style: italic;
  line-height: 1;
  color: var(--text-faint);
  margin-block-end: var(--space-4);
}
[dir="rtl"] .contact-hq__index { font-style: normal; }
.contact-hq__eyebrow {
  font-family: var(--font-body);
  font-size: var(--fs-micro);
  font-weight: var(--fw-medium);
  letter-spacing: var(--tracking-eyebrow);
  text-transform: uppercase;
  color: var(--text-muted);
  margin-block-end: var(--space-3);
}
[dir="rtl"] .contact-hq__eyebrow { letter-spacing: var(--tracking-wide); }
.contact-hq__name {
  font-family: var(--font-display);
  font-size: var(--fs-h2);
  font-weight: var(--fw-light);
  line-height: 1.1;
  color: var(--text);
  margin: 0 0 var(--space-2);
}
.contact-hq__city {
  font-family: var(--font-body);
  font-size: var(--fs-body);
  color: var(--text-muted);
  margin: 0 0 var(--space-6);
}
.contact-hq__lines {
  margin: 0 0 var(--space-6);
  border-block-start: 1px solid #E2DFD8;
}
.contact-hq__line {
  display: grid;
  grid-template-columns: minmax(7rem, 0.4fr) minmax(0, 1fr);
  gap: var(--space-4);
  align-items: baseline;
  padding-block: var(--space-4);
  border-block-end: 1px solid #E2DFD8;
}
.contact-hq__line dt {
  font-family: var(--font-body);
  font-size: var(--fs-micro);
  font-weight: var(--fw-medium);
  letter-spacing: var(--tracking-eyebrow);
  text-transform: uppercase;
  color: var(--text-muted);
}
[dir="rtl"] .contact-hq__line dt { letter-spacing: var(--tracking-wide); }
.contact-hq__line dd {
  margin: 0;
  font-family: var(--font-display);
  font-size: var(--fs-h4);
  font-weight: var(--fw-light);
  color: var(--text);
}
.contact-hq__link {
  color: var(--text);
  text-decoration: none;
  border-block-end: 1px solid var(--line);
  padding-block-end: 2px;
  transition: border-color var(--dur-fast) var(--ease);
}
.contact-hq__link:hover { border-color: var(--text); }
.contact-hq__map-link { color: var(--text-muted); margin-block-start: auto; }
.contact-hq__map-link:hover { color: var(--text); }

.contact-hq__map {
  position: relative;
  overflow: hidden;
  min-block-size: 22rem;
  background-color: var(--surface);
  border: 1px solid var(--line);
}
.contact-hq__map-frame {
  inline-size: 100%;
  block-size: 100%;
  min-block-size: 22rem;
  border: 0;
  display: block;
  filter: grayscale(1) contrast(1.05) brightness(0.9);
}

/* Regional presence — numbered ruled grid (country + city only) */
.contact-presence {
  list-style: none;
  margin: 0 0 var(--space-7);
  padding: 0;
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 0;
}
.contact-presence__item {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  padding: var(--space-7) var(--space-5) var(--space-6) 0;
  border-block-start: 1px solid var(--text);
  border-inline-end: 1px solid #E2DFD8;
}
.contact-presence__item:nth-child(5n)   { border-inline-end: 0; padding-inline-end: 0; }
.contact-presence__item:nth-child(5n+1) { padding-inline-start: 0; }
.contact-presence__num {
  font-family: var(--font-display);
  font-size: var(--fs-h4);
  font-weight: var(--fw-light);
  font-style: italic;
  line-height: 1;
  color: var(--text-faint);
}
[dir="rtl"] .contact-presence__num { font-style: normal; }
.contact-presence__country {
  font-family: var(--font-display);
  font-size: var(--fs-h4);
  font-weight: var(--fw-light);
  line-height: 1.2;
  color: var(--text);
  margin: 0;
}
.contact-presence__city {
  font-family: var(--font-body);
  font-size: var(--fs-caption);
  letter-spacing: var(--tracking-wide);
  text-transform: uppercase;
  color: var(--text-muted);
  margin: 0;
}
[dir="rtl"] .contact-presence__city { letter-spacing: 0; }

.s-contact-network__caption {
  font-family: var(--font-display);
  font-style: italic;
  font-size: var(--fs-lead);
  color: var(--text-muted);
  margin: 0;
}
[dir="rtl"] .s-contact-network__caption { font-style: normal; }

@media (max-width: 980px) {
  .contact-presence { grid-template-columns: repeat(3, 1fr); }
  .contact-presence__item { padding-inline-end: var(--space-5); border-inline-end: 1px solid #E2DFD8; }
  .contact-presence__item:nth-child(5n)   { border-inline-end: 1px solid #E2DFD8; padding-inline-end: var(--space-5); }
  .contact-presence__item:nth-child(5n+1) { padding-inline-start: var(--space-5); }
  .contact-presence__item:nth-child(3n)   { border-inline-end: 0; padding-inline-end: 0; }
  .contact-presence__item:nth-child(3n+1) { padding-inline-start: 0; }
}
@media (max-width: 860px) {
  .contact-hq { grid-template-columns: 1fr; gap: var(--space-7); }
  .contact-hq__map { min-block-size: 18rem; }
}
@media (max-width: 560px) {
  .contact-presence { grid-template-columns: repeat(2, 1fr); }
  .contact-presence__item,
  .contact-presence__item:nth-child(3n),
  .contact-presence__item:nth-child(5n) { border-inline-end: 1px solid #E2DFD8; padding-inline-end: var(--space-5); }
  .contact-presence__item:nth-child(2n)   { border-inline-end: 0; padding-inline-end: 0; }
  .contact-presence__item:nth-child(2n+1),
  .contact-presence__item:nth-child(3n+1),
  .contact-presence__item:nth-child(5n+1) { padding-inline-start: 0; }
  .contact-presence__item:nth-child(2n)   { padding-inline-start: var(--space-5); }
}
@media (max-width: 380px) {
  .contact-presence { grid-template-columns: 1fr; }
  .contact-presence__item,
  .contact-presence__item:nth-child(n) { border-inline-end: 0; padding-inline: 0; }
}


/* ============================================================================
   4 · FAMILY — full-bleed dark close, single careers CTA
   ============================================================================ */
.s-contact-family {
  position: relative;
  overflow: hidden;
  padding-block: clamp(var(--space-11), 12vw, calc(var(--space-12) + var(--space-6)));
  background-color: #080808;
}
.s-contact-family__media {
  position: absolute;
  inset: -8% 0;
  z-index: 0;
  transform: translateY(var(--parallax-y, 0));
}
.s-contact-family__media img {
  inline-size: 100%; block-size: 100%;
  object-fit: cover; object-position: center;
  filter: grayscale(1) sepia(0.10) contrast(1.05) brightness(0.34);
}
.s-contact-family__scrim {
  position: absolute; inset: 0; z-index: 1;
  background:
    linear-gradient(to right, rgba(8,8,8,0.88) 0%, rgba(8,8,8,0.55) 55%, rgba(8,8,8,0.30) 100%),
    linear-gradient(to top, rgba(8,8,8,0.6), transparent 60%);
  pointer-events: none;
}
[dir="rtl"] .s-contact-family__scrim {
  background:
    linear-gradient(to left, rgba(8,8,8,0.88) 0%, rgba(8,8,8,0.55) 55%, rgba(8,8,8,0.30) 100%),
    linear-gradient(to top, rgba(8,8,8,0.6), transparent 60%);
}
.s-contact-family__inner {
  position: relative;
  z-index: 2;
  inline-size: min(var(--container), 100% - 2 * var(--gutter));
  margin-inline: auto;
}
.s-contact-family__eyebrow { color: rgba(255,255,255,0.5); }
.s-contact-family__title {
  font-family: var(--font-display);
  font-size: clamp(2.25rem, 1.4rem + 3.4vw, 4.5rem);
  font-weight: var(--fw-light);
  line-height: 1.02;
  letter-spacing: var(--tracking-display);
  color: #F6F4F0;
  margin-block: var(--space-5) var(--space-6);
}
.s-contact-family__title em { font-style: italic; font-weight: var(--fw-regular); color: rgba(246,244,240,0.74); }
[dir="rtl"] .s-contact-family__title { line-height: 1.2; }
[dir="rtl"] .s-contact-family__title em { font-style: normal; }
.s-contact-family__desc {
  font-family: var(--font-body);
  font-size: var(--fs-lead);
  line-height: var(--lh-body);
  color: rgba(255,255,255,0.58);
  max-inline-size: 52ch;
  margin: 0 0 var(--space-8);
}
.s-contact-family__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-5) var(--space-7);
}
.s-contact-family__btn {
  --_bg: #F6F4F0; --_fg: #0E0E0E;
  background-color: var(--_bg);
  color: var(--_fg);
  border-color: var(--_bg);
}
.s-contact-family__btn:hover { --_bg: #FFFFFF; --_fg: #0E0E0E; }
.s-contact-family__secondary {
  font-family: var(--font-body);
  font-size: var(--fs-caption);
  letter-spacing: var(--tracking-wide);
  text-transform: uppercase;
  color: rgba(255,255,255,0.45);
  text-decoration: none;
  border-block-end: 1px solid rgba(255,255,255,0.25);
  padding-block-end: 3px;
  transition: color var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease);
}
.s-contact-family__secondary:hover { color: #fff; border-color: rgba(255,255,255,0.6); }
[dir="rtl"] .s-contact-family__secondary { letter-spacing: 0; }


/* ============================================================================
   Reduced motion
   ============================================================================ */
@media (prefers-reduced-motion: reduce) {
  .s-contact-hero__media,
  .s-contact-family__media { transform: none !important; }
  .s-contact-hero__scroll-line { animation: none; }
  .js-motion .contact-form__rule { transform: none; }
}
