/* ==========================================================================
   TEAM PAGE — leaders section matches the About page treatment
   (About renders these same cards on a dark panel; team.html had them on the
   white section-light panel, so the identical cards read as a different design.)
   Colours mirror .about-dark exactly:
      section #14201A · card #1C2A22 · border rgba(244,239,228,.14)
      name #F4EFE4 · role #C97B4A · bio rgba(244,239,228,.78)
   ========================================================================== */

.section-light.leader-dark { background: var(--ink); }

.leader-dark h2,
.leader-dark h3 { color: var(--signal); }

.leader-dark p,
.leader-dark .lede { color: rgba(244, 239, 228, 0.82); }

.leader-dark .eyebrow { color: var(--copper-flare); }

.leader-dark .leader-card {
  background: var(--ink-soft);
  border-color: rgba(244, 239, 228, 0.14);
}

.leader-dark .leader-role { color: var(--copper-flare); }
.leader-dark .leader-bio { color: rgba(244, 239, 228, 0.78); }

.leader-dark .leader-link { color: var(--copper-flare); }
.leader-dark .leader-link:hover { color: var(--signal); }

/* keep the card hover lift readable on the dark panel */
.leader-dark .leader-card:hover {
  border-color: var(--copper-flare);
  box-shadow: 0 18px 40px -16px rgba(0, 0, 0, 0.55);
}

/* ---- Retail-logistics banner below the leadership cards ---- */
.leader-dark .team-banner {
  margin: var(--space-4) 0 0;
  border-radius: var(--radius-md);
  overflow: hidden;
  border: 1px solid rgba(244, 239, 228, 0.14);
  background: var(--ink-soft);
  box-shadow: 0 20px 48px -24px rgba(0, 0, 0, 0.6);
}
.leader-dark .team-banner img {
  display: block;
  width: 100%;
  height: auto;
}