/* ============================================================
   ICZ: Leadership page (scoped)
   Extends the shared shell (styles.css); never forks it.
   All rules gated under body.page-leadership.
   Tokens, nav, footer, buttons, bands, cards, reveals = shared.
   Reference grammar reused:
   - hero VARIANT = the same pale band + faceted motif, but a
     split text/image composition (image-framing device from the
     reference people rail), so it reads SECONDARY to the home hero.
   - EXCO + committees = the reference deal-card grid grammar
     (white logo/figure plate + meta), reused verbatim in shape.
   ============================================================ */

/* ---------- HERO VARIANT: split text + image-framed media ---------- */
.page-leadership .lead-hero {
  position: relative; overflow: clip;
  padding-top: clamp(7rem, 6rem + 8vw, 10rem);
  padding-bottom: var(--band-y);
  background:
    radial-gradient(110% 85% at 88% -12%, rgba(24,144,200,.16), transparent 56%),
    radial-gradient(90% 80% at -6% 8%, rgba(248,176,16,.08), transparent 50%),
    var(--canvas);
}
.page-leadership .lead-hero__inner {
  display: grid; grid-template-columns: 1fr; gap: clamp(1.75rem, 4vw, 3rem);
  align-items: center;
}
.page-leadership .lead-hero__eyebrow { margin-bottom: 1rem; }
.page-leadership .lead-hero h1 {
  /* one step below the home display so the secondary read is unmistakable */
  font-size: clamp(2.5rem, 1.6rem + 4.4vw, 4.6rem);
  letter-spacing: -0.03em; line-height: 1; margin-bottom: 1.3rem;
}
.page-leadership .lead-hero__lead {
  font-size: var(--fs-lead); color: var(--ink-soft); max-width: 36rem; margin-bottom: 1.8rem;
}
.page-leadership .lead-hero__cta { display: flex; flex-wrap: wrap; gap: .75rem; }

/* image-framed media tile (the reference's rounded-rect framing, not full-bleed) */
.page-leadership .lead-hero__media {
  position: relative; border-radius: var(--r-card-lg); overflow: hidden;
  aspect-ratio: 16 / 11; background: var(--canvas-royal-2);
  box-shadow: 0 30px 60px -32px rgba(10,22,34,.4);
}
.page-leadership .lead-hero__media img { width: 100%; height: 100%; object-fit: cover; }
/* small faceted gold accent corner = the secondary-accent punctuation */
.page-leadership .lead-hero__media::after {
  content: ""; position: absolute; left: 0; bottom: 0;
  width: 42%; height: 36%; pointer-events: none;
  background: linear-gradient(135deg, transparent 55%, rgba(24,144,200,.22) 100%);
}
.page-leadership .lead-hero__tag {
  position: absolute; left: 1rem; bottom: 1rem; z-index: 2;
  display: inline-flex; align-items: center; gap: .5rem;
  background: rgba(10,22,34,.62); backdrop-filter: blur(8px);
  color: #fff; font-size: .8rem; font-weight: 600;
  padding: .5rem .9rem; border-radius: var(--r-pill);
}
.page-leadership .lead-hero__tag::before {
  content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--gold);
}

/* ---------- EXCO leadership cards (deal-card grammar, royal band) ---------- */
.page-leadership .exco { background: var(--canvas-royal); color: #fff; padding-block: var(--band-y); position: relative; overflow: clip; }
.page-leadership .exco__head { max-width: 52rem; margin-bottom: clamp(1.8rem,3.5vw,2.8rem); }
.page-leadership .exco__head .eyebrow { color: rgba(255,255,255,.85); margin-bottom: .9rem; }
.page-leadership .exco__head h2 { font-size: var(--fs-h2); }
.page-leadership .exco__head p { color: rgba(255,255,255,.82); margin-top: 1rem; font-size: var(--fs-lead); max-width: 42rem; }

.page-leadership .exco__grid { display: grid; grid-template-columns: 1fr; gap: 1rem; }
.page-leadership .exco-card {
  background: var(--surface); border-radius: var(--r-card); overflow: hidden;
  display: flex; flex-direction: column;
  transition: transform var(--t-fast) var(--ease-out), box-shadow var(--t-fast);
}
.page-leadership .exco-card:hover { transform: translateY(-4px); box-shadow: 0 18px 40px -24px rgba(6,38,58,.6); }
/* single clean white plate: monogram + name + role, no redundant footer label */
.page-leadership .exco-card__plate {
  padding: 1.6rem 1.4rem; min-height: 7.5rem;
  display: flex; align-items: center; gap: 1rem;
}
.page-leadership .exco-card__mono {
  flex-shrink: 0; width: 60px; height: 60px; border-radius: 50%;
  background: var(--canvas); color: var(--accent);
  display: grid; place-items: center;
  font-size: 1.45rem; font-weight: 700; letter-spacing: -0.02em;
  font-variant-numeric: tabular-nums;
}
.page-leadership .exco-card__who { min-width: 0; }
.page-leadership .exco-card__name { color: var(--ink); font-size: 1.18rem; font-weight: 600; letter-spacing: -0.01em; line-height: 1.15; }
.page-leadership .exco-card__role { color: var(--ink-soft); font-size: .9rem; margin-top: .2rem; }

/* ---------- GOVERNANCE band (near-black, code of conduct + purpose) ---------- */
.page-leadership .gov { background: var(--canvas-ink); color: #fff; padding-block: var(--band-y); }
.page-leadership .gov__head { max-width: 50rem; margin-bottom: clamp(2rem,4vw,3rem); }
.page-leadership .gov__head .eyebrow { color: var(--accent-bright); margin-bottom: .9rem; }
.page-leadership .gov__head h2 { font-size: var(--fs-h2); }
.page-leadership .gov__head p { color: rgba(255,255,255,.72); margin-top: 1rem; font-size: var(--fs-lead); }

.page-leadership .gov__grid { display: grid; grid-template-columns: 1fr; gap: 2.5rem; align-items: start; }

/* purpose: three objects as a hairline-divided list (reference scrub-row grammar, static) */
.page-leadership .gov__purpose { display: flex; flex-direction: column; }
.page-leadership .gov-obj { border-top: 1px solid var(--line-dark); padding: 1.4rem 0; display: grid; grid-template-columns: auto 1fr; gap: 1.2rem; align-items: start; }
.page-leadership .gov-obj:last-child { border-bottom: 1px solid var(--line-dark); }
.page-leadership .gov-obj__num { font-size: 1.4rem; font-weight: 700; color: var(--accent-bright); font-variant-numeric: tabular-nums; line-height: 1; }
.page-leadership .gov-obj__txt { color: rgba(255,255,255,.8); font-size: .98rem; }
.page-leadership .gov-obj__txt strong { color: #fff; font-weight: 600; display: block; margin-bottom: .25rem; }

/* code of conduct: compact chip rail (real "+" not used; these are labels) */
.page-leadership .gov__code { background: rgba(255,255,255,.04); border: 1px solid var(--line-dark); border-radius: var(--r-card); padding: clamp(1.4rem,3vw,2rem); }
.page-leadership .gov__code h3 { font-size: 1.3rem; font-weight: 600; margin-bottom: .4rem; }
.page-leadership .gov__code p { color: rgba(255,255,255,.7); font-size: .95rem; margin-bottom: 1.3rem; }
.page-leadership .gov__tags { display: flex; flex-wrap: wrap; gap: .55rem; }
.page-leadership .gov-tag {
  font-size: .85rem; font-weight: 600; color: #fff;
  background: rgba(24,144,200,.18); border: 1px solid rgba(24,144,200,.4);
  padding: .5rem .95rem; border-radius: var(--r-pill);
}

/* ---------- COMMITTEES grid (deal-card grammar, pale band, white plates) ---------- */
.page-leadership .committees { background: var(--canvas); padding-block: var(--band-y); }
.page-leadership .committees__head { max-width: 50rem; margin-bottom: clamp(2rem,4vw,3rem); }
.page-leadership .committees__head .eyebrow { margin-bottom: .9rem; }
.page-leadership .committees__head h2 { font-size: var(--fs-h2); }
.page-leadership .committees__head p { color: var(--ink-soft); margin-top: 1rem; font-size: var(--fs-lead); max-width: 44rem; }

.page-leadership .committees__grid { display: grid; grid-template-columns: 1fr; gap: 1rem; }
.page-leadership .cmt-card {
  position: relative; background: var(--surface); border-radius: var(--r-card);
  padding: 1.4rem; display: flex; flex-direction: column; gap: .6rem; min-height: 8.5rem;
  transition: transform var(--t-fast) var(--ease-out), box-shadow var(--t-fast);
}
.page-leadership .cmt-card:hover { transform: translateY(-4px); box-shadow: 0 18px 40px -24px rgba(10,22,34,.35); }
.page-leadership .cmt-card__num { font-size: .8rem; font-weight: 700; color: var(--accent); font-variant-numeric: tabular-nums; letter-spacing: .04em; }
.page-leadership .cmt-card__name { margin-top: auto; font-size: 1.08rem; font-weight: 600; letter-spacing: -0.01em; line-height: 1.2; }

/* ---------- RESPONSIVE (mobile-first; these are the up-breakpoints) ---------- */
@media (min-width: 600px) {
  .page-leadership .exco__grid { grid-template-columns: repeat(2, 1fr); }
  .page-leadership .committees__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 861px) {
  .page-leadership .lead-hero__inner { grid-template-columns: 1.05fr .95fr; }
  .page-leadership .exco__grid { grid-template-columns: repeat(4, 1fr); }
  .page-leadership .gov__grid { grid-template-columns: 1.1fr 1fr; gap: clamp(2.5rem,5vw,4.5rem); }
  .page-leadership .committees__grid { grid-template-columns: repeat(3, 1fr); }
}
@media (min-width: 1100px) {
  .page-leadership .committees__grid { grid-template-columns: repeat(4, 1fr); }
}