@font-face {
  font-family: 'Libre Caslon Display';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/libre-caslon-display-normal-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Libre Caslon Display';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/libre-caslon-display-normal-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Playfair Display';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/playfair-display-italic-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Playfair Display';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/playfair-display-italic-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 400 600;
  font-display: swap;
  src: url(fonts/playfair-display-normal-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 400 600;
  font-display: swap;
  src: url(fonts/playfair-display-normal-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Plus Jakarta Sans';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url(fonts/plus-jakarta-sans-normal-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Plus Jakarta Sans';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url(fonts/plus-jakarta-sans-normal-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ==========================================================================
   USMBA Design System — Tokens & Variables
   Strict Institutional Editorial Palette (U.S.–Mexico Bilateral Identity)
   ========================================================================== */

:root {
  /* Color Palette */
  --black: #142d3e;
  --black-hover: #25485e;
  --ink: #243743;
  --ink-secondary: #52616a;
  --muted: #68767d;
  --subtle: #9ca3af;
  --paper: #fffefa;
  --bg-subtle: #f4f1eb;
  --bg-muted: #eae6de;
  --line: #deded6;
  --line-strong: #b9bdb8;
  --bronze: #85653c;
  --bronze-light: #d8bb86;

  /* Typography */
  --serif: 'Playfair Display', Georgia, serif;
  --serif-display: 'Libre Caslon Display', 'Playfair Display', Georgia, serif;
  --sans: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

  /* Geometry & Elevation */
  --radius-sm: 2px;
  --radius-md: 3px;
  --shadow-sm: 0 1px 3px rgba(20, 45, 62, 0.05);
  --shadow-md: 0 4px 16px rgba(20, 45, 62, 0.08);

  /* Transitions */
  --ease-fast: 0.15s ease;
  --ease-smooth: 0.25s ease;
}

/* ==========================================================================
   USMBA Base Styles — Reset, Typography, Accessibility & Foundation
   ========================================================================== */

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  scroll-padding-top: 80px;
}

body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--sans);
  font-size: 14.5px;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

::selection {
  background: #dbc69f;
  color: #142d3e;
}

h1, h2, h3, h4, p {
  margin-top: 0;
}

h1, h2, h3 {
  font-family: var(--serif);
  font-weight: 400;
  color: var(--black);
  text-wrap: balance;
}

p {
  text-wrap: pretty;
}

a {
  color: inherit;
  text-decoration: none;
  transition: color var(--ease-fast), border-color var(--ease-fast), background-color var(--ease-fast);
}

button {
  font: inherit;
  cursor: pointer;
  border: none;
  background: transparent;
}

img {
  display: block;
  max-width: 100%;
  height: auto;
}

:focus-visible {
  outline: 2px solid var(--bronze);
  outline-offset: 4px;
}

/* Central Content Container */
.wrap {
  width: min(1200px, calc(100% - 64px));
  margin-inline: auto;
}

/* Accessibility Skip Link */
.skip-link {
  position: fixed;
  left: 20px;
  top: -100px;
  padding: 10px 18px;
  background: var(--black);
  color: var(--paper);
  font-weight: 600;
  font-size: 12px;
  z-index: 1000;
  border-radius: var(--radius-sm);
  transition: top 0.2s ease;
}

.skip-link:focus {
  top: 15px;
}

@media (max-width: 1150px) {
  .wrap {
    width: calc(100% - 44px);
  }
}

@media (max-width: 600px) {
  .wrap {
    width: calc(100% - 32px);
  }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation: none !important;
    transition: none !important;
  }
}

/* ==========================================================================
   USMBA Layout Styles — Utility Top Bar, Header / Nav, Footer & Shell
   ========================================================================== */

/* --------------------------------------------------------------------------
   Utility Top Bar
   -------------------------------------------------------------------------- */
.utility {
  background: var(--black);
  color: #d6dfe2;
  font-size: 10px;
  letter-spacing: 0.03em;
}

.utility-wrap {
  display: flex;
  justify-content: space-between;
  align-items: center;
  min-height: 28px;
  gap: 16px;
  padding-block: 4px;
}

.utility a {
  color: #ffffff;
  font-weight: 500;
  transition: color var(--ease-fast);
}

.utility a:hover {
  color: var(--bronze-light);
  text-decoration: underline;
}

.utility-actions,
.utility-right {
  display: flex;
  align-items: center;
  gap: 16px;
}

.utility-dot {
  background: var(--bronze-light);
  width: 4px;
  height: 4px;
  border-radius: 50%;
  display: inline-block;
}

.lang-switch {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  background: transparent;
  padding: 0;
  border: 0;
}

.lang-btn {
  background: transparent;
  border: none;
  color: #9ca3af;
  font-family: var(--sans);
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: 0.8px;
  cursor: pointer;
  padding: 2px 4px;
  line-height: 1;
  transition: color var(--ease-fast);
}

.lang-btn:hover {
  color: #ffffff;
}

.lang-btn.active {
  color: var(--bronze-light);
  font-weight: 700;
}

.lang-sep {
  color: #8c9ba3;
  font-size: 10px;
  user-select: none;
}

/* --------------------------------------------------------------------------
   Main Navigation Header
   -------------------------------------------------------------------------- */
.header {
  background: var(--paper);
  position: sticky;
  top: 0;
  z-index: 40;
  border-bottom: 1px solid var(--line);
}

.nav-wrap {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 22px;
  min-height: 66px;
}

.brand {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: 172px;
  flex-shrink: 0;
}

.brand img {
  width: 154px;
  height: auto;
}

.brand > span {
  display: block;
  font-size: 7px;
  font-weight: 700;
  letter-spacing: 1.2px;
  line-height: 1.4;
  color: var(--ink);
  margin-top: 2px;
}

.header nav {
  display: flex;
  align-items: center;
  gap: 20px;
  font-size: 12px;
  font-weight: 500;
}

.header nav > a:not(.button) {
  color: var(--ink-secondary);
  padding-block: 6px;
  position: relative;
  white-space: nowrap;
}

.header nav > a:not(.button)::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0%;
  height: 1.5px;
  background: var(--bronze);
  transition: width var(--ease-fast);
}

.header nav > a:not(.button):hover {
  color: var(--black);
}

.header nav > a:not(.button):hover::after,
.header nav > a[aria-current="page"]::after {
  width: 100%;
}

.menu-toggle {
  display: none;
}

/* --------------------------------------------------------------------------
   Global Footer
   -------------------------------------------------------------------------- */
.footer {
  background: #edf0ee;
  border-top: 1px solid var(--line);
  padding-block: 40px 22px;
}

.footer-content {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.footer-primary {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 24px;
  padding-bottom: 24px;
  border-bottom: 1px solid var(--line);
}

.footer-brand {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.footer-brand .brand {
  width: auto;
  gap: 3px;
}

.footer-brand .brand img {
  width: 150px;
}

.footer-brand .brand span {
  font-size: 7.5px;
  color: var(--muted);
}

.footer-motto {
  font-family: var(--serif);
  font-style: italic;
  font-size: 13.5px;
  color: var(--ink-secondary);
  margin: 4px 0 0 0;
}

.footer-links-nav {
  display: flex;
  align-items: center;
  gap: 18px;
  flex-wrap: wrap;
}

.footer-nav-link {
  border: 0;
  border-radius: 0;
  padding: 4px 0;
  background: transparent;
  font-size: 11px;
  font-weight: 500;
  color: var(--ink-secondary);
  transition: color var(--ease-fast);
}

.footer-nav-link:hover {
  background: transparent;
  color: var(--bronze);
}

.footer-secondary {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 10px;
  color: var(--muted);
  gap: 16px;
  flex-wrap: wrap;
}

.copyright {
  color: var(--muted);
}

.legal-links {
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

.legal-links a {
  color: var(--ink-secondary);
  transition: color var(--ease-fast);
}

.legal-links a:hover {
  color: var(--bronze);
}

.legal-sep {
  color: var(--line-strong);
}

.disclaimer {
  font-size: 10px;
  color: var(--muted);
  line-height: 1.6;
  margin: 0;
  padding-top: 14px;
  border-top: 1px dashed var(--line);
}

/* --------------------------------------------------------------------------
   Responsive Layout Rules
   -------------------------------------------------------------------------- */
@media (max-width: 1150px) {
  .header nav {
    gap: 14px;
    font-size: 11px;
  }
  .brand {
    width: 154px;
  }
  .brand img {
    width: 140px;
  }
}

@media (max-width: 1000px) and (min-width: 901px) {
  .header nav {
    gap: 10px;
    font-size: 10px;
  }
  .nav-wrap {
    gap: 14px;
  }
}

@media (max-width: 900px) {
  .nav-wrap {
    min-height: 60px;
  }
  .menu-toggle {
    display: flex;
    align-items: center;
    gap: 6px;
    background: transparent;
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    padding: 6px 10px;
    color: var(--black);
    font-size: 11px;
    font-weight: 600;
    min-height: 38px;
  }
  .header nav {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: var(--paper);
    padding: 16px 24px;
    border-bottom: 1px solid var(--line);
    box-shadow: var(--shadow-md);
    flex-direction: column;
    align-items: stretch;
    font-size: 13.5px;
    gap: 0;
  }
  .header nav.is-open {
    display: flex;
  }
  .header nav > a:not(.button) {
    padding-block: 10px;
    border-bottom: 1px solid var(--line);
  }
  .header nav .button {
    margin-top: 12px;
    justify-content: center;
  }
  .footer-primary {
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
  }
}

@media (max-width: 600px) {
  .utility-wrap {
    justify-content: flex-end;
    min-height: 28px;
  }
  .utility-wrap > [data-i18n="utility-motto"],
  .utility-left {
    display: none;
  }
  .utility-actions,
  .utility-right {
    gap: 16px;
  }
  .brand img {
    width: 136px;
  }
  .brand > span {
    font-size: 6px;
  }
  .footer {
    padding-block: 30px 18px;
  }
  .footer-links-nav {
    gap: 10px 16px;
  }
}

/* ==========================================================================
   USMBA Reusable Components — Buttons, Badges, Links & Breadcrumbs
   ========================================================================== */

/* --------------------------------------------------------------------------
   Buttons
   -------------------------------------------------------------------------- */
.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 40px;
  padding: 10px 18px;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.35;
  border-radius: var(--radius-sm);
  transition: all var(--ease-fast);
  letter-spacing: .15px;
  border: 1px solid transparent;
  cursor: pointer;
  white-space: nowrap;
}

.button.small {
  min-height: 36px;
  padding: 8px 14px;
  font-size: 11px;
}

.button.primary {
  background: var(--black);
  color: var(--paper);
  border-color: var(--black);
  box-shadow: none;
}

.button.primary:hover {
  background: var(--black-hover);
  border-color: var(--black-hover);
}

.button.outline {
  background: transparent;
  color: var(--black);
  border: 1px solid var(--line-strong);
}

.button.outline:hover {
  background: var(--bg-subtle);
  border-color: var(--black);
}

.button.light {
  background: var(--bronze-light);
  border-color: var(--bronze-light);
  color: var(--black);
}

.button.light:hover {
  background: #ead1a5;
  border-color: #ead1a5;
}

.button-arrow {
  display: inline-block;
  margin-left: 6px;
  transition: transform 0.2s ease;
}

.button:hover .button-arrow {
  transform: translate(2px, -2px);
}

/* --------------------------------------------------------------------------
   Badges & Eyebrows
   -------------------------------------------------------------------------- */
.section-badge,
.hero-eyebrow {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 9.5px;
  letter-spacing: 1.6px;
  font-weight: 700;
  color: var(--bronze);
  margin-bottom: 14px;
  text-transform: uppercase;
}

.badge-rule,
.eyebrow-line {
  display: inline-block;
  width: 28px;
  height: 1.5px;
  background: var(--bronze);
}

.tag-badge {
  display: inline-block;
  background: var(--bg-subtle);
  color: var(--bronze);
  border: 0;
  border-radius: var(--radius-sm);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .8px;
  padding: 3px 8px;
  text-transform: uppercase;
}

/* --------------------------------------------------------------------------
   Text Links
   -------------------------------------------------------------------------- */
.text-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  font-weight: 600;
  color: var(--black);
  border-bottom: 1px solid var(--line-strong);
  padding-bottom: 2px;
  transition: all var(--ease-fast);
}

.text-link:hover {
  border-color: var(--bronze);
  color: var(--bronze);
}

.text-link.pale {
  color: #d1d5db;
  border-color: #4b5563;
}

.text-link.pale:hover {
  color: #ffffff;
  border-color: #ffffff;
}

/* --------------------------------------------------------------------------
   Breadcrumbs
   -------------------------------------------------------------------------- */
.breadcrumbs,
.member-breadcrumbs,
.news-breadcrumbs,
.login-breadcrumbs,
.article-breadcrumbs {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 18px;
  font-size: 10px;
  color: var(--muted);
}

.breadcrumbs a,
.member-breadcrumbs a,
.news-breadcrumbs a,
.login-breadcrumbs a,
.article-breadcrumbs a {
  color: var(--ink-secondary);
  transition: color var(--ease-fast);
}

.breadcrumbs a:hover,
.member-breadcrumbs a:hover,
.news-breadcrumbs a:hover,
.login-breadcrumbs a:hover,
.article-breadcrumbs a:hover {
  color: var(--black);
}

/* ==========================================================================
   USMBA Homepage Styles — Hero, Foundation Ribbon, About, Pillars,
   Leadership, Insights Preview, Join CTA & Contact
   ========================================================================== */

/* --------------------------------------------------------------------------
   Hero Section (Compact Editorial)
   -------------------------------------------------------------------------- */
.hero {
  background: var(--black);
  padding: 0;
  border: 0;
}

.hero-wrap {
  display: grid;
  grid-template-columns: 1.08fr 1fr;
  gap: 36px;
  align-items: stretch;
  min-height: 440px;
}

.hero-content {
  padding: 34px 0 28px;
  align-self: center;
}

.hero .hero-eyebrow {
  color: var(--bronze-light);
  margin-bottom: 14px;
}

.hero .eyebrow-line {
  background: var(--bronze-light);
}

.hero h1 {
  color: #fffefa;
  font-size: clamp(38px, 4vw, 54px);
  line-height: 1.12;
  letter-spacing: -1.2px;
  margin-bottom: 16px;
}

.hero h1 em {
  font-style: italic;
  color: var(--bronze-light);
}

.hero-description {
  color: #d1dbe0;
  max-width: 480px;
  font-size: 13px;
  line-height: 1.65;
  margin-bottom: 22px;
}

.hero-actions {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 22px;
  flex-wrap: wrap;
}

.hero-actions .primary {
  background: var(--bronze-light);
  border-color: var(--bronze-light);
  color: var(--black);
}

.hero-actions .primary:hover {
  background: #ead1a5;
  border-color: #ead1a5;
}

.hero-actions .outline {
  background: transparent;
  border: 0;
  border-bottom: 1px solid #647580;
  color: #fffefa;
  padding-inline: 0;
  border-radius: 0;
}

.hero-actions .outline:hover {
  border-color: var(--bronze-light);
  color: var(--bronze-light);
}

.hero-meta {
  display: flex;
  align-items: center;
  gap: 8px;
  border-top: 1px solid #3d5260;
  padding-top: 14px;
  font-size: 8.5px;
  letter-spacing: 1.4px;
  font-weight: 600;
}

.meta-item {
  color: #c4cfd4;
}

.hero-media {
  min-width: 0;
}

.media-card {
  position: relative;
  height: 100%;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  background: #354852;
  margin: 0;
  overflow: hidden;
}

.media-aspect {
  height: 100%;
  min-height: 440px;
  max-height: 480px;
  aspect-ratio: auto;
  overflow: hidden;
}

.media-aspect img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 65%;
  transition: transform 0.4s ease;
}

.media-card:hover .media-aspect img {
  transform: scale(1.02);
}

.media-caption {
  position: absolute;
  bottom: 0;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px 18px;
  padding: 12px 18px;
  background: rgba(20, 45, 62, 0.94);
  backdrop-filter: blur(4px);
  color: #fffefa;
  border: 0;
}

.caption-content {
  display: grid;
  gap: 5px;
}

.caption-title {
  color: var(--bronze-light);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 1.2px;
  text-transform: uppercase;
}

.caption-text {
  color: #e5e8e7;
  font-size: 10px;
  margin-left: 0;
}

.caption-date {
  color: #fffefa;
  font-size: 11px;
  font-weight: 600;
  line-height: 1.5;
}

/* --------------------------------------------------------------------------
   Foundation Ribbon (Intro Strip)
   -------------------------------------------------------------------------- */
.intro-strip {
  background: var(--bg-subtle);
  border-bottom: 1px solid var(--line);
}

.strip-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr) auto;
  align-items: center;
  padding-block: 20px;
}

.strip-col {
  padding-inline: 24px;
  border-right: 1px solid var(--line);
}

.strip-col:first-child {
  padding-left: 0;
}

.strip-num {
  display: block;
  font-size: 9px;
  letter-spacing: 1.5px;
  font-weight: 700;
  color: var(--bronze);
  margin-bottom: 2px;
}

.strip-grid strong {
  display: block;
  font-family: var(--serif);
  font-size: 22px;
  font-weight: 400;
  line-height: 1.15;
  color: var(--black);
  margin-block: 3px;
}

.strip-grid span:not(.strip-num) {
  font-size: 10px;
  color: var(--ink-secondary);
  display: block;
}

.strip-action {
  border-right: none;
  padding-right: 0;
  padding-left: 24px;
  display: flex;
  justify-content: flex-end;
}

.strip-button {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: 0;
  border-bottom: 1px solid var(--bronze);
  border-radius: 0;
  background: transparent;
  padding-inline: 0;
  font-size: 11.5px;
  font-weight: 600;
  color: var(--black);
  cursor: pointer;
  white-space: nowrap;
}

.strip-button:hover {
  color: var(--bronze);
  background: transparent;
  border-color: var(--black);
}

.strip-button span {
  color: inherit !important;
}

/* --------------------------------------------------------------------------
   About Overview Section (Compact Editorial Synthesis)
   -------------------------------------------------------------------------- */
.about {
  display: grid;
  grid-template-columns: 0.9fr 1.1fr;
  gap: 36px;
  align-items: start;
  padding-block: 34px 28px;
}

.about-title-col {
  padding-right: 10px;
}

.about-title-col .section-badge {
  margin-bottom: 10px;
}

.about h2 {
  font-size: clamp(26px, 2.6vw, 35px);
  line-height: 1.15;
  margin-bottom: 14px;
  letter-spacing: -0.6px;
}

.about h2 em {
  font-style: italic;
  font-weight: 400;
  color: var(--ink-secondary);
}

.about-subnote {
  border-left: 2px solid var(--bronze);
  padding-left: 14px;
  margin-top: 16px;
}

.about-subnote span {
  font-size: 9px;
  letter-spacing: 1.5px;
  font-weight: 700;
  color: var(--muted);
  display: block;
  margin-bottom: 3px;
}

.about-subnote p {
  font-size: 12px;
  color: var(--ink-secondary);
  line-height: 1.55;
  margin: 0;
  max-width: 300px;
}

.about-copy-col {
  border-left: 1px solid var(--line);
  padding-left: 32px;
}

.large-copy {
  font-family: var(--serif);
  font-size: clamp(16px, 1.6vw, 20px);
  line-height: 1.35;
  color: var(--black);
  margin-bottom: 10px;
}

.about-text {
  font-size: 13px;
  color: var(--ink-secondary);
  line-height: 1.6;
  margin-bottom: 14px;
}

.about-highlights {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  margin-top: 0;
  margin-bottom: 16px;
  padding-block: 12px;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.highlight-item {
  display: flex;
  flex-direction: column;
  gap: 3px;
  padding: 12px 14px;
  background: var(--bg-subtle);
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
}

.highlight-num {
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 1.2px;
  color: var(--bronze);
}

.highlight-item h4 {
  font-size: 13px;
  font-weight: 700;
  color: var(--black);
  line-height: 1.3;
  margin: 0;
}

.highlight-item p {
  font-size: 11.5px;
  line-height: 1.5;
  color: var(--ink-secondary);
  margin: 0;
}

.about-footer {
  margin-top: 0;
}

.about-footer .button {
  min-height: 35px;
  padding: 7px 15px;
  font-size: 11px;
}

/* --------------------------------------------------------------------------
   Strategic Pillars Section
   -------------------------------------------------------------------------- */
.pillars {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
  margin-block: 0 42px;
  border-block: 1px solid var(--line);
}

.pillar {
  display: flex;
  flex-direction: column;
  border: 0;
  border-right: 1px solid var(--line);
  border-radius: 0;
  padding: 20px 18px;
  background: transparent;
  box-shadow: none;
  transition: background-color var(--ease-fast);
}

.pillar:last-child {
  border-right: 0;
}

.pillar:hover {
  background: var(--bg-subtle);
}

.pillar-number {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 1.5px;
  color: var(--bronze);
  margin-bottom: 8px;
}

.pillar h3 {
  font-size: 21px;
  line-height: 1.25;
  margin-bottom: 8px;
}

.pillar p {
  font-size: 12px;
  line-height: 1.65;
  color: var(--ink-secondary);
  margin: 0;
}

/* --------------------------------------------------------------------------
   Institutional Leadership Section (Preview)
   -------------------------------------------------------------------------- */
.home-leadership {
  padding-block: 52px 56px;
  background: var(--bg-subtle);
  border-block: 1px solid var(--line);
}

.home-leadership-heading {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 24px;
  margin-bottom: 24px;
}

.home-leadership h2 {
  font-size: clamp(28px, 3.2vw, 38px);
  line-height: 1.2;
  margin: 0;
}

.home-leadership h2 em {
  font-weight: 400;
  color: var(--ink-secondary);
}

.home-leaders {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 22px;
}

.home-leader {
  display: grid;
  grid-template-columns: 42% 1fr;
  background: var(--paper);
  min-width: 0;
  border-bottom: 2px solid var(--bronze);
  border-radius: var(--radius-sm);
  overflow: hidden;
  transition: border-color var(--ease-fast);
}

.home-leader img {
  width: 100%;
  height: auto;
  aspect-ratio: 1;
  object-fit: contain;
  object-position: center;
  align-self: center;
  background: var(--bg-subtle);
}

.home-leader-copy {
  padding: 20px 20px;
  align-self: center;
}

.home-leader-role {
  display: block;
  font-size: 9px;
  letter-spacing: 1.2px;
  color: var(--bronze);
  text-transform: uppercase;
  line-height: 1.6;
  margin-bottom: 8px;
}

.home-leader h3 {
  font-size: 22px;
  line-height: 1.25;
  margin-bottom: 8px;
  transition: color var(--ease-fast);
}

.home-leader p {
  font-size: 11px;
  color: var(--ink-secondary);
  margin-bottom: 14px;
  line-height: 1.6;
}

.home-leader .text-link {
  font-size: 10px;
}

.home-leader:hover h3 {
  color: var(--bronze);
}

/* --------------------------------------------------------------------------
   Insights & Articles Preview Section
   -------------------------------------------------------------------------- */
.articles {
  padding-block: 54px 60px;
}

.section-heading {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  margin-bottom: 24px;
  gap: 20px;
}

.section-heading h2 {
  font-size: clamp(28px, 3.2vw, 38px);
  line-height: 1.2;
  margin: 0;
}

.article-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  column-gap: 28px;
  row-gap: 38px;
}

.article-card {
  display: flex;
  flex-direction: column;
  padding: 18px 0 0;
  border: 0;
  border-top: 2px solid var(--bronze);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  min-width: 0;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.article-prose,
.article-headline,
.article-lede,
.article-summary {
  min-width: 0;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.article-meta {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
}

.article-date {
  font-size: 9px;
  color: var(--muted);
}

.article-card h2,
.article-card h3 {
  font-size: 21px;
  line-height: 1.3;
  margin-block: 14px 10px;
}

.article-summary {
  font-size: 12px;
  line-height: 1.7;
  color: var(--ink-secondary);
  margin-bottom: 14px;
}

.article-link {
  margin-top: auto;
  font-size: 11px;
}

/* --------------------------------------------------------------------------
   Join / Membership Callout Section (Compact Ribbon)
   -------------------------------------------------------------------------- */
.join {
  background: var(--black);
  border-top: 2px solid var(--bronze);
  padding-block: 26px 22px;
  color: var(--paper);
}

.join-wrap {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
}

.join-copy {
  max-width: 660px;
}

.join-copy .section-badge {
  color: var(--bronze-light);
  font-size: 9px;
  letter-spacing: 1.4px;
  margin-bottom: 6px;
}

.join-copy .badge-rule {
  background: var(--bronze-light);
  width: 22px;
}

.join-copy h2 {
  color: #fffefa;
  font-size: clamp(22px, 2.3vw, 29px);
  line-height: 1.15;
  margin-bottom: 5px;
}

.join-copy h2 em {
  font-style: italic;
  color: var(--bronze-light);
}

.join-desc {
  color: #d2dce0;
  font-size: 12.5px;
  line-height: 1.5;
  margin: 0;
}

.join-action {
  flex-shrink: 0;
}

.join-action .button.primary {
  background: var(--bronze-light);
  border-color: var(--bronze-light);
  color: var(--black);
  min-height: 38px;
  padding: 8px 18px;
  font-size: 11.5px;
}

.join-action .button.primary:hover {
  background: #ead1a5;
  border-color: #ead1a5;
}

/* --------------------------------------------------------------------------
   Contact Section (Compact & Well-Framed)
   -------------------------------------------------------------------------- */
.contact {
  display: grid;
  grid-template-columns: 1.05fr 0.95fr;
  gap: 36px;
  padding-block: 34px 28px;
  align-items: center;
}

.contact-left .section-badge {
  font-size: 9px;
  letter-spacing: 1.4px;
  margin-bottom: 8px;
}

.contact-left h2 {
  font-size: clamp(24px, 2.5vw, 32px);
  line-height: 1.15;
  margin: 0;
}

.contact-left h2 em {
  font-style: italic;
  font-weight: 400;
  color: var(--ink-secondary);
}

.contact-lead {
  font-size: 12.5px;
  line-height: 1.55;
  color: var(--ink-secondary);
  margin-top: 10px;
  margin-bottom: 0;
  max-width: 440px;
}

.contact-card {
  padding: 18px 22px;
  border-radius: var(--radius-sm);
  box-shadow: none;
  background: var(--bg-subtle);
  border-top: 2px solid var(--bronze);
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.contact-row {
  display: flex;
  flex-direction: column;
  gap: 3px;
  padding-bottom: 9px;
  border-bottom: 1px solid var(--line);
}

.contact-label {
  font-size: 8.5px;
  font-weight: 700;
  letter-spacing: 1.3px;
  color: var(--muted);
  text-transform: uppercase;
}

.contact-email {
  font-family: var(--serif);
  font-size: clamp(15px, 1.6vw, 19px);
  color: var(--black);
  display: inline-flex;
  align-items: center;
  gap: 6px;
  overflow-wrap: anywhere;
  transition: color var(--ease-fast);
}

.contact-email:hover {
  color: var(--bronze);
}

.contact-location {
  font-size: 12px;
  color: var(--ink-secondary);
}

.contact-cta {
  padding-top: 2px;
}

.contact-cta .button {
  width: 100%;
  min-height: 35px;
  padding: 7px 14px;
  font-size: 11px;
}

/* --------------------------------------------------------------------------
   Responsive Breakpoints for Homepage
   -------------------------------------------------------------------------- */
@media (max-width: 1150px) {
  .hero-wrap {
    gap: 26px;
  }
  .hero h1 {
    font-size: 46px;
  }
  .home-leader h3 {
    font-size: 20px;
  }
  .home-leader-copy {
    padding: 18px 16px;
  }
}

@media (max-width: 900px) {
  .hero-wrap {
    grid-template-columns: 1fr 1fr;
    min-height: 400px;
    gap: 22px;
    padding-block: 0;
  }
  .hero-content {
    padding-block: 30px;
  }
  .hero h1 {
    font-size: clamp(32px, 5vw, 44px);
    letter-spacing: -1px;
  }
  .hero-description {
    font-size: 12px;
  }
  .hero .hero-eyebrow {
    font-size: 8px;
    letter-spacing: 1px;
  }
  .hero-actions {
    align-items: flex-start;
    flex-direction: column;
    gap: 10px;
  }
  .media-aspect {
    min-height: 400px;
  }
  .strip-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
  }
  .strip-col {
    padding-inline: 0;
    border-right: none;
  }
  .strip-action {
    padding-left: 0;
    justify-content: flex-start;
  }
  .about {
    grid-template-columns: 1fr;
    gap: 26px;
    padding-block: 44px 32px;
  }
  .about-copy-col {
    padding-left: 0;
    border-left: none;
    border-top: 1px solid var(--line);
    padding-top: 24px;
  }
  .about-highlights {
    grid-template-columns: 1fr;
    gap: 12px;
  }
  .pillars {
    grid-template-columns: 1fr;
    margin-bottom: 38px;
  }
  .pillar {
    border-right: 0;
    border-bottom: 1px solid var(--line);
    padding-inline: 0;
  }
  .pillar:last-child {
    border-bottom: 0;
  }
  .home-leadership {
    padding-block: 42px;
  }
  .home-leadership-heading {
    flex-direction: column;
    align-items: flex-start;
    gap: 18px;
  }
  .home-leaders {
    grid-template-columns: 1fr;
    gap: 18px;
  }
  .home-leader {
    grid-template-columns: minmax(0, 34%) minmax(0, 1fr);
  }
  .home-leader-copy {
    padding: 20px;
  }
  .articles {
    padding-block: 44px;
  }
  .section-heading {
    flex-direction: column;
    align-items: flex-start;
    gap: 18px;
  }
  .article-grid {
    grid-template-columns: 1fr;
    gap: 26px;
  }
  .join {
    padding-block: 38px;
  }
  .join-wrap {
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
  }
  .contact {
    grid-template-columns: 1fr;
    padding-block: 44px;
    gap: 28px;
  }
}

@media (max-width: 600px) {
  .hero-wrap {
    grid-template-columns: 1fr;
    gap: 0;
    min-height: auto;
  }
  .hero-content {
    padding: 28px 0 22px;
  }
  .hero h1 {
    font-size: clamp(32px, 8vw, 42px);
    margin-bottom: 14px;
  }
  .hero .hero-eyebrow {
    font-size: 8px;
    margin-bottom: 14px;
  }
  .hero-description {
    font-size: 12px;
    line-height: 1.65;
    margin-bottom: 18px;
  }
  .hero-actions {
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px 16px;
    margin-bottom: 20px;
  }
  .hero-actions .button {
    width: auto;
    font-size: 11px;
    padding-inline: 14px;
  }
  .hero-meta {
    font-size: 8px;
    letter-spacing: 1px;
    padding-top: 12px;
  }
  .hero-media {
    margin-bottom: 14px;
  }
  .media-aspect {
    min-height: 0;
    height: 260px;
  }
  .media-aspect img {
    object-position: center 65%;
  }
  .media-caption {
    padding: 10px 14px;
    background: #142d3ee8;
  }
  .strip-grid {
    grid-template-columns: 1fr 1fr;
    gap: 16px 18px;
    padding-block: 20px;
  }
  .strip-grid > div {
    border: 0;
    padding: 0;
  }
  .strip-grid strong {
    font-size: 20px;
  }
  .strip-grid span:not(.strip-num) {
    font-size: 9px;
    line-height: 1.6;
  }
  .strip-action {
    align-self: center;
  }
  .strip-button {
    white-space: normal;
  }
  .home-leadership-heading,
  .section-heading {
    flex-direction: column;
    align-items: flex-start;
    gap: 18px;
  }
  .home-leaders {
    grid-template-columns: 1fr;
  }
  .home-leader {
    grid-template-columns: 38% 1fr;
  }
  .home-leader img {
    height: auto;
    aspect-ratio: 1;
  }
  .home-leader-copy {
    padding: 18px 14px;
  }
  .home-leader h3 {
    font-size: 20px;
  }
  .home-leader-role {
    font-size: 8px;
  }
  .contact-card {
    padding: 20px;
  }
  .join-copy h2 {
    font-size: 30px;
  }
}

/* ==========================================================================
   About Page Styles (Architectural & Minimalist — Strict Monochrome)
   ========================================================================== */

/* Active Navigation */
.about-page .header a[aria-current="page"] {
  color: var(--black);
  font-weight: 600;
  border-bottom: 2px solid var(--black);
  padding-bottom: 2px;
}

/* ==========================================================================
   About Hero
   ========================================================================== */
.about-hero {
  background: var(--paper);
  border-bottom: 1px solid var(--line);
  padding-block: 36px 32px;
}

.about-hero-grid {
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: 48px;
  align-items: center;
}

.breadcrumbs {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 11px;
  font-weight: 500;
  color: var(--muted);
  margin-bottom: 16px;
}

.breadcrumbs a {
  color: var(--ink-secondary);
  transition: color 0.15s ease;
}

.breadcrumbs a:hover {
  color: var(--black);
}

.about-hero-copy .section-badge {
  margin-bottom: 14px;
}

.about-hero h1 {
  font-family: var(--serif);
  font-size: clamp(38px, 4.2vw, 54px);
  letter-spacing: -1px;
  line-height: 1.08;
  color: var(--black);
  margin-bottom: 16px;
}

.about-hero h1 em {
  font-style: italic;
  font-weight: 400;
  color: var(--ink-secondary);
}

.about-lede {
  font-size: 15px;
  line-height: 1.75;
  color: var(--ink-secondary);
  margin-bottom: 20px;
  max-width: 520px;
}

.hero-anchor-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  font-weight: 600;
  color: var(--black);
  border-bottom: 1px solid var(--line-strong);
  padding-bottom: 2px;
}

.hero-anchor-link:hover {
  border-color: var(--black);
}

.about-hero-image {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  overflow: hidden;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.03);
}

.about-hero-media {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 10;
  overflow: hidden;
  background: var(--bg-muted);
}

.about-hero-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.heritage-note {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 16px;
  background: var(--bg-subtle);
  border-top: 1px solid var(--line);
  font-size: 10px;
  letter-spacing: 1.2px;
  font-weight: 700;
  color: var(--muted);
}

.heritage-note strong {
  font-family: var(--serif);
  font-size: 14px;
  font-weight: 600;
  color: var(--black);
  letter-spacing: 0;
}

/* ==========================================================================
   In-Page Section Navigation
   ========================================================================== */
.about-sections {
  background: var(--bg-subtle);
  border-bottom: 1px solid var(--line);
}

.about-sections > div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding-block: 14px;
}

.about-sections-label {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1.5px;
  color: var(--muted);
}

.about-sections-links {
  display: flex;
  align-items: center;
  gap: 28px;
}

.about-sections a {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  font-weight: 600;
  color: var(--ink-secondary);
  transition: color 0.15s ease;
}

.about-sections a:hover {
  color: var(--black);
}

/* ==========================================================================
   Purpose Section
   ========================================================================== */
.purpose-section {
  padding-block: 48px 36px;
}

.purpose-intro {
  display: grid;
  grid-template-columns: 0.9fr 1.1fr;
  gap: 48px;
  align-items: start;
}

.purpose-intro h2 {
  font-family: var(--serif);
  font-size: clamp(32px, 3.5vw, 44px);
  letter-spacing: -0.8px;
  line-height: 1.1;
  color: var(--black);
  margin: 0;
}

.purpose-intro h2 em {
  font-style: italic;
  font-weight: 400;
  color: var(--ink-secondary);
}

.purpose-description {
  border-left: 1px solid var(--line);
  padding-left: 48px;
}

.purpose-description .large-copy {
  font-family: var(--serif);
  font-size: clamp(19px, 1.9vw, 23px);
  line-height: 1.35;
  color: var(--black);
  margin-bottom: 14px;
}

.purpose-description p:not(.large-copy) {
  font-size: 14px;
  line-height: 1.75;
  color: var(--ink-secondary);
  margin-bottom: 14px;
}

.purpose-cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
  margin-top: 36px;
}

.purpose-card {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  padding: 24px 22px;
  display: flex;
  flex-direction: column;
  transition: border-color 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
}

.purpose-card:hover {
  border-color: var(--black);
  transform: translateY(-2px);
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.03);
}

.purpose-number {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1.2px;
  color: var(--muted);
  margin-bottom: 12px;
}

.purpose-card h3 {
  font-family: var(--serif);
  font-size: 21px;
  line-height: 1.25;
  color: var(--black);
  margin-bottom: 8px;
}

.purpose-card p {
  font-size: 13px;
  line-height: 1.65;
  color: var(--ink-secondary);
  margin-bottom: 16px;
  flex-grow: 1;
}

.purpose-card .card-link {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  font-weight: 600;
  color: var(--black);
  border-bottom: 1px solid var(--line-strong);
  padding-bottom: 2px;
  align-self: flex-start;
}

.purpose-card:hover .card-link {
  border-color: var(--black);
}

/* ==========================================================================
   History Section
   ========================================================================== */
.history-section {
  background: var(--bg-subtle);
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  padding-block: 48px 40px;
}

.history-heading {
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: 48px;
  align-items: end;
  margin-bottom: 32px;
  padding-bottom: 18px;
  border-bottom: 1px solid var(--line);
}

.history-heading h2 {
  font-family: var(--serif);
  font-size: clamp(32px, 3.5vw, 42px);
  letter-spacing: -0.8px;
  line-height: 1.1;
  color: var(--black);
  margin: 0;
}

.history-heading h2 em {
  font-style: italic;
  font-weight: 400;
  color: var(--ink-secondary);
}

.history-heading > p {
  font-size: 14px;
  line-height: 1.75;
  color: var(--ink-secondary);
  margin: 0;
}

.timeline {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
  list-style: none;
  padding: 0;
  margin: 0;
}

.timeline-item {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  padding: 24px 22px;
  display: flex;
  flex-direction: column;
  transition: border-color 0.15s ease, transform 0.15s ease;
}

.timeline-item:hover {
  border-color: var(--black);
  transform: translateY(-2px);
}

.timeline-date {
  font-size: 9.5px;
  font-weight: 700;
  letter-spacing: 1.5px;
  color: var(--muted);
  text-transform: uppercase;
}

.timeline strong {
  display: block;
  font-family: var(--serif);
  font-size: 36px;
  font-weight: 400;
  line-height: 1.1;
  color: var(--black);
  margin: 6px 0 10px;
}

.timeline h3 {
  font-size: 17px;
  font-weight: 700;
  line-height: 1.3;
  color: var(--black);
  margin-bottom: 8px;
}

.timeline p {
  font-size: 13px;
  line-height: 1.65;
  color: var(--ink-secondary);
  margin: 0;
}

/* ==========================================================================
   Leadership Section
   ========================================================================== */
.leadership-section {
  padding-block: 48px;
}

.leadership-heading {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  margin-bottom: 26px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--line);
}

.leadership-heading h2 {
  font-family: var(--serif);
  font-size: clamp(30px, 3.2vw, 38px);
  letter-spacing: -0.8px;
  line-height: 1.1;
  color: var(--black);
  margin: 0;
}

.leadership-heading h2 em {
  font-style: italic;
  font-weight: 400;
  color: var(--ink-secondary);
}

.leaders {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
}

.leader {
  display: flex;
  align-items: center;
  gap: 20px;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  overflow: hidden;
  transition: border-color 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
  text-decoration: none;
}

.leader:hover {
  border-color: var(--black);
  transform: translateY(-2px);
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.03);
}

.portrait {
  width: 38%;
  height: 210px;
  overflow: hidden;
  background: var(--bg-muted);
  flex-shrink: 0;
}

.portrait img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top;
}

.leader-info {
  padding: 18px 18px 18px 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.leader-role {
  font-size: 9.5px;
  font-weight: 700;
  letter-spacing: 1.4px;
  color: var(--muted);
  text-transform: uppercase;
}

.leader-info h3 {
  font-family: var(--serif);
  font-size: 21px;
  line-height: 1.2;
  color: var(--black);
  margin: 0;
}

.leader-link {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  font-weight: 600;
  color: var(--black);
  margin-top: 6px;
}

/* ==========================================================================
   Responsive Overrides for About Page
   ========================================================================== */
@media (max-width: 900px) {
  .about-hero-grid {
    grid-template-columns: 1fr;
    gap: 32px;
  }
  .about-sections > div {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
  }
  .about-sections-links {
    flex-wrap: wrap;
    gap: 16px;
  }
  .purpose-intro {
    grid-template-columns: 1fr;
    gap: 24px;
  }
  .purpose-description {
    border-left: none;
    padding-left: 0;
    border-top: 1px solid var(--line);
    padding-top: 20px;
  }
  .purpose-cards {
    grid-template-columns: 1fr;
    gap: 18px;
  }
  .history-heading {
    grid-template-columns: 1fr;
    gap: 16px;
  }
  .timeline {
    grid-template-columns: 1fr;
    gap: 16px;
  }
  .leaders {
    grid-template-columns: 1fr;
    gap: 18px;
  }
}

@media (max-width: 600px) {
  .leader {
    flex-direction: column;
    align-items: stretch;
  }
  .portrait {
    width: 100%;
    height: 240px;
  }
  .leader-info {
    padding: 16px;
  }
}

/* Board profiles share the same visual language as the co-chairs. */
.leader-info { min-width: 0; }
.leader-firm { margin: 0; font-size: 11.5px; line-height: 1.45; color: var(--ink-secondary); }
.board-subheading { margin: 28px 0 14px; font-family: var(--serif); font-size: 24px; }
.board-members { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; }
.board-members .leader { flex-direction: column; align-items: stretch; gap: 0; }
.board-members .portrait { width: 100%; height: auto; aspect-ratio: 4 / 3.8; background: var(--bg-subtle); overflow: hidden; }
.board-members .portrait > figure,
.portrait > figure.wp-block-image { width: 100%; height: 100%; margin: 0; display: block; }
/* Fill the portrait frame cleanly while preserving the headshot alignment. */
.board-members .portrait img { width: 100%; height: 100%; object-fit: cover; object-position: center top; display: block; }
/* Landscape portraits fill the frame by trimming only the side margins. */
.board-members .portrait .board-photo-landscape img,
.board-members .portrait img.board-photo-landscape { object-fit: cover; object-position: center top; }
.board-members .leader-info { padding: 14px 16px; gap: 4px; flex-grow: 1; }
.board-members .leader-info h3 { font-size: 17.5px; line-height: 1.22; }
.board-members .leader-role { font-size: 8.5px; letter-spacing: 1.2px; }
.board-members .leader-link { margin-top: auto; padding-top: 6px; font-size: 11px; }
@media (max-width: 1040px) {
  .board-members { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 780px) {
  .board-members { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 520px) {
  .board-members { grid-template-columns: 1fr; }
  .leadership-heading { align-items: flex-start; flex-direction: column; gap: 18px; }
}

/* 2026 roster supplied by the association, grouped as in its memorandum. */
.board-source-note { color: var(--muted); font-size: 12px; line-height: 1.7; margin-block: 0 22px; }
.board-roster-nav { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 32px; }
.board-roster-nav a { display: inline-flex; align-items: center; gap: 24px; padding: 12px 18px; border: 1px solid var(--line); font-size: 12px; }
.board-roster-nav a:hover { border-color: var(--bronze); }
.board-count { color: var(--bronze); font-weight: 600; }
.board-roster-group { scroll-margin-top: 120px; }
.board-roster-group .board-subheading { margin-block: 36px 20px; }
.board-photo-pending { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; background: var(--bg-subtle); color: var(--bronze); }
.portrait .board-photo-pending { width: 100%; height: 100%; aspect-ratio: 1; }
.board-photo-pending > span { font-family: var(--serif); font-size: 64px; font-weight: 400; }
.board-photo-pending small { font-size: 11px; color: var(--muted); }

/* ==========================================================================
   Membership Page Styles (Architectural Minimalist — Strict Monochrome)
   ========================================================================== */

/* Active Navigation */
.membership-page .header a[aria-current="page"] {
  color: var(--black);
  font-weight: 600;
  border-bottom: 2px solid var(--black);
  padding-bottom: 2px;
}

/* ==========================================================================
   Membership Hero
   ========================================================================== */
.membership-hero {
  background: var(--paper);
  border-bottom: 1px solid var(--line);
  padding-block: 36px 36px;
}

.member-breadcrumbs {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 11px;
  font-weight: 500;
  color: var(--muted);
  margin-bottom: 16px;
}

.member-breadcrumbs a {
  color: var(--ink-secondary);
  transition: color 0.15s ease;
}

.member-breadcrumbs a:hover {
  color: var(--black);
}

.member-hero-grid {
  display: grid;
  grid-template-columns: 1.15fr 0.85fr;
  gap: 48px;
  align-items: center;
}

.member-hero-copy .section-badge {
  margin-bottom: 14px;
}

.membership-hero h1 {
  font-family: var(--serif);
  font-size: clamp(38px, 4.2vw, 54px);
  letter-spacing: -1px;
  line-height: 1.08;
  color: var(--black);
  margin-bottom: 16px;
}

.membership-hero h1 em {
  font-style: italic;
  font-weight: 400;
  color: var(--ink-secondary);
}

.member-intro {
  font-size: 15px;
  line-height: 1.75;
  color: var(--ink-secondary);
  max-width: 540px;
  margin-bottom: 24px;
}

.member-hero-actions {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
}

.hero-anchor-sub {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--ink-secondary);
  padding: 8px 14px;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: var(--paper);
  transition: all 0.15s ease;
}

.hero-anchor-sub:hover {
  border-color: var(--black);
  color: var(--black);
}

/* Membership Value Panel (Right column of Hero) */
.member-value-card {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  padding: 24px 22px;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.03);
}

.member-value-header {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1.5px;
  color: var(--muted);
  text-transform: uppercase;
  margin-bottom: 16px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--line);
}

.member-benefits {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.member-benefits li {
  display: grid;
  grid-template-columns: 28px 1fr;
  gap: 12px;
  align-items: start;
}

.benefit-num {
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 1px;
  color: var(--muted);
  padding-top: 2px;
}

.benefit-body h2 {
  font-family: var(--serif);
  font-size: 17px;
  line-height: 1.25;
  color: var(--black);
  margin-bottom: 4px;
}

.benefit-body p {
  font-size: 12.5px;
  line-height: 1.6;
  color: var(--ink-secondary);
  margin: 0;
}

/* ==========================================================================
   Plan Sections
   ========================================================================== */
.plan-section {
  padding-block: 48px 36px;
}

.plans-heading {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 32px;
  margin-bottom: 28px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--line);
}

.plans-heading h2 {
  font-family: var(--serif);
  font-size: clamp(30px, 3.2vw, 40px);
  letter-spacing: -0.8px;
  line-height: 1.1;
  color: var(--black);
  margin: 0;
}

.plans-heading h2 em {
  font-style: italic;
  font-weight: 400;
  color: var(--ink-secondary);
}

.plans-heading > p {
  font-size: 13.5px;
  line-height: 1.7;
  color: var(--ink-secondary);
  max-width: 380px;
  margin: 0;
}

/* Plan Cards Grid */
.plan-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 20px;
}

.institution-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
  padding-bottom: 40px;
}

.plan-card {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  padding: 24px 20px 20px;
  display: flex;
  flex-direction: column;
  position: relative;
  transition: border-color 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
}

.plan-card:hover {
  border-color: var(--black);
  transform: translateY(-2px);
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.04);
}

.plan-card.featured {
  border-color: var(--black);
  background: var(--paper);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.05);
}

.plan-badge-top {
  position: absolute;
  top: -10px;
  left: 18px;
  background: var(--black);
  color: var(--paper);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 1.2px;
  padding: 3px 8px;
  border-radius: 3px;
  text-transform: uppercase;
}

.plan-type {
  font-size: 9.5px;
  font-weight: 700;
  letter-spacing: 1.3px;
  color: var(--muted);
  text-transform: uppercase;
  margin-bottom: 8px;
}

.plan-card h3 {
  font-family: var(--serif);
  font-size: 22px;
  line-height: 1.2;
  color: var(--black);
  margin-bottom: 12px;
  min-height: 52px;
}

.plan-price {
  display: flex;
  align-items: baseline;
  gap: 6px;
  margin-bottom: 10px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--line);
}

.plan-price strong {
  font-family: var(--serif);
  font-size: 40px;
  font-weight: 400;
  line-height: 1;
  color: var(--black);
  letter-spacing: -1px;
}

.plan-price span {
  font-size: 12px;
  color: var(--muted);
  font-weight: 500;
}

.plan-eligibility {
  font-size: 12px;
  line-height: 1.6;
  color: var(--ink-secondary);
  min-height: 40px;
  margin-bottom: 16px;
}

.plan-features {
  border-top: 1px solid var(--line);
  list-style: none;
  padding: 14px 0 0;
  margin: 0 0 20px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  flex-grow: 1;
}

.plan-features li {
  font-size: 12px;
  line-height: 1.6;
  color: var(--ink-secondary);
  position: relative;
  padding-left: 18px;
}

.plan-features li::before {
  content: '·';
  position: absolute;
  left: 4px;
  top: -2px;
  font-size: 18px;
  font-weight: 700;
  color: var(--black);
}

.plan-card .button {
  width: 100%;
  justify-content: center;
  padding: 10px 14px;
  font-size: 12px;
  margin-top: auto;
}

.plan-card.featured .button {
  background: var(--black);
  color: var(--paper);
  border-color: var(--black);
}

.plan-card.featured .button:hover {
  background: #374151;
  border-color: #374151;
}

.plan-source {
  font-size: 11.5px;
  color: var(--muted);
  margin-top: 22px;
  line-height: 1.6;
}

.plan-source a {
  color: var(--black);
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* ==========================================================================
   Organization Memberships Section
   ========================================================================== */
.organization-section {
  background: var(--bg-subtle);
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  padding-block: 48px 40px;
}

.organization-section .plan-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.organization-section .plan-card h3 {
  min-height: auto;
}

.organization-section .plan-eligibility {
  min-height: auto;
}

/* ==========================================================================
   Guidance / FAQ Section
   ========================================================================== */
.membership-help {
  display: grid;
  grid-template-columns: 0.9fr 1.1fr;
  gap: 56px;
  padding-block: 52px 40px;
  align-items: start;
}

.help-left h2 {
  font-family: var(--serif);
  font-size: clamp(30px, 3.2vw, 40px);
  letter-spacing: -0.8px;
  line-height: 1.1;
  color: var(--black);
  margin-bottom: 14px;
}

.help-left h2 em {
  font-style: italic;
  font-weight: 400;
  color: var(--ink-secondary);
}

.help-left p {
  font-size: 13.5px;
  line-height: 1.7;
  color: var(--ink-secondary);
  margin-bottom: 18px;
  max-width: 380px;
}

.help-contact-card {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  padding: 16px 20px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  max-width: 360px;
}

.help-contact-label {
  font-size: 9.5px;
  font-weight: 700;
  letter-spacing: 1.4px;
  color: var(--muted);
  text-transform: uppercase;
}

.help-contact-email {
  font-family: var(--serif);
  font-size: 17px;
  color: var(--black);
  display: inline-flex;
  align-items: center;
  gap: 6px;
  transition: color 0.15s ease;
}

.help-contact-email:hover {
  color: var(--ink-secondary);
}

/* Member FAQ Accordion */
.member-faq {
  border-top: 1px solid var(--line);
}

.member-faq details {
  border-bottom: 1px solid var(--line);
  padding-block: 16px;
  transition: background-color 0.15s ease;
}

.member-faq details[open] {
  background-color: var(--paper);
  padding-inline: 14px;
  border-radius: var(--radius-sm);
}

.member-faq summary {
  font-family: var(--serif);
  font-size: 17px;
  font-weight: 400;
  line-height: 1.3;
  color: var(--black);
  cursor: pointer;
  list-style: none;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
}

.member-faq summary::-webkit-details-marker {
  display: none;
}

.member-faq summary::after {
  content: '+';
  font-family: var(--sans);
  font-size: 18px;
  font-weight: 400;
  color: var(--muted);
  transition: transform 0.15s ease;
}

.member-faq details[open] summary::after {
  content: '−';
  color: var(--black);
}

.member-faq details p {
  font-size: 13px;
  line-height: 1.7;
  color: var(--ink-secondary);
  margin: 12px 0 4px;
  max-width: none;
}

.member-faq a {
  color: var(--black);
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* ==========================================================================
   Existing Member Sign-in Callout
   ========================================================================== */
.member-signin {
  background: var(--bg-subtle);
  border-top: 1px solid var(--line);
  padding-block: 36px;
}

.signin-wrap {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 24px;
}

.signin-copy h2 {
  font-family: var(--serif);
  font-size: 24px;
  line-height: 1.2;
  color: var(--black);
  margin-bottom: 4px;
}

.signin-copy p {
  font-size: 13.5px;
  color: var(--ink-secondary);
  margin: 0;
}

/* ==========================================================================
   Responsive Overrides for Membership Page
   ========================================================================== */
@media (max-width: 1100px) {
  .plan-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .member-hero-grid {
    gap: 32px;
  }
  .membership-help {
    gap: 36px;
  }
}

@media (max-width: 800px) {
  .institution-grid {
    grid-template-columns: 1fr;
  }
  .member-hero-grid {
    grid-template-columns: 1fr;
    gap: 28px;
  }
  .plans-heading {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
  }
  .plans-heading > p {
    max-width: none;
  }
  .organization-section .plan-grid {
    grid-template-columns: 1fr;
  }
  .membership-help {
    grid-template-columns: 1fr;
    gap: 28px;
  }
  .signin-wrap {
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
  }
  .signin-wrap .button {
    width: 100%;
    justify-content: center;
  }
}

@media (max-width: 520px) {
  .plan-grid {
    grid-template-columns: 1fr;
  }
  .plan-card h3 {
    min-height: auto;
  }
  .plan-eligibility {
    min-height: auto;
  }
}

/* ==========================================================================
   News & Events Page Styles (Architectural Minimalist — Strict Monochrome)
   ========================================================================== */

/* Active Navigation */
.news-page .header a[aria-current="page"] {
  color: var(--black);
  font-weight: 600;
  border-bottom: 2px solid var(--black);
  padding-bottom: 2px;
}

/* ==========================================================================
   Hero Section
   ========================================================================== */
.news-hero {
  background: var(--paper);
  border-bottom: 1px solid var(--line);
  padding-block: 36px 32px;
}

.news-breadcrumbs {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 11px;
  font-weight: 500;
  color: var(--muted);
  margin-bottom: 16px;
}

.news-breadcrumbs a {
  color: var(--ink-secondary);
  transition: color 0.15s ease;
}

.news-breadcrumbs a:hover {
  color: var(--black);
}

.news-hero-grid {
  display: grid;
  grid-template-columns: 1.15fr 0.85fr;
  gap: 48px;
  align-items: center;
}

.news-hero-copy .section-badge {
  margin-bottom: 14px;
}

.news-hero h1 {
  font-family: var(--serif);
  font-size: clamp(38px, 4.2vw, 54px);
  letter-spacing: -1px;
  line-height: 1.08;
  color: var(--black);
  margin-bottom: 0;
}

.news-hero h1 em {
  font-style: italic;
  font-weight: 400;
  color: var(--ink-secondary);
}

.news-hero-side p {
  font-size: 15px;
  line-height: 1.75;
  color: var(--ink-secondary);
  margin-bottom: 18px;
  max-width: 440px;
}

.hero-anchor-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  font-weight: 600;
  color: var(--black);
  border-bottom: 1px solid var(--line-strong);
  padding-bottom: 2px;
}

.hero-anchor-link:hover {
  border-color: var(--black);
}

/* ==========================================================================
   Featured Event Section (Conference 2026)
   ========================================================================== */
.featured-event-section {
  padding-block: 48px;
  border-bottom: 1px solid var(--line);
}

.featured-event {
  display: grid;
  grid-template-columns: minmax(280px, 0.75fr) 1.25fr;
  gap: 52px;
  align-items: center;
}

.event-poster {
  display: block;
  max-width: 380px;
  width: 100%;
  padding: 10px;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.03);
  transition: transform 0.15s ease, border-color 0.15s ease;
}

.event-poster:hover {
  border-color: var(--black);
  transform: translateY(-2px);
}

.event-poster img {
  width: 100%;
  height: auto;
  border-radius: var(--radius-sm);
  display: block;
}

.featured-copy .event-labels {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 9.5px;
  font-weight: 700;
  letter-spacing: 1.3px;
  margin-bottom: 16px;
}

.label-conf {
  color: var(--black);
}

.past-event {
  background: var(--bg-muted);
  color: var(--muted);
  padding: 3px 8px;
  border-radius: 3px;
}

.featured-copy h2 {
  font-family: var(--serif);
  font-size: clamp(34px, 3.8vw, 46px);
  letter-spacing: -0.8px;
  line-height: 1.1;
  color: var(--black);
  margin-bottom: 8px;
}

.featured-copy h2 em {
  font-style: italic;
  font-weight: 400;
  color: var(--ink-secondary);
}

.featured-copy .large-copy {
  font-family: var(--serif);
  font-size: clamp(19px, 2vw, 24px);
  line-height: 1.3;
  color: var(--ink-secondary);
  margin-bottom: 18px;
}

.event-facts {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
  margin: 0 0 20px;
  border-block: 1px solid var(--line);
  padding-block: 14px;
}

.event-facts dt {
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 1.5px;
  color: var(--muted);
  text-transform: uppercase;
  margin-bottom: 4px;
}

.event-facts dd {
  margin: 0;
  font-size: 13.5px;
  font-weight: 500;
  color: var(--black);
}

.event-description {
  font-size: 13.5px;
  line-height: 1.7;
  color: var(--ink-secondary);
  max-width: 560px;
  margin-bottom: 22px;
}

/* ==========================================================================
   Resources Section (Webinars, Panels, Newsletters)
   ========================================================================== */
.resource-section {
  padding-block: 48px 40px;
  background: var(--bg-subtle);
  border-bottom: 1px solid var(--line);
}

.resource-heading {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 32px;
  margin-bottom: 24px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--line);
}

.resource-heading h2 {
  font-family: var(--serif);
  font-size: clamp(30px, 3.2vw, 40px);
  letter-spacing: -0.8px;
  line-height: 1.1;
  color: var(--black);
  margin: 0;
}

.resource-heading h2 em {
  font-style: italic;
  font-weight: 400;
  color: var(--ink-secondary);
}

.resource-heading > p {
  font-size: 13.5px;
  line-height: 1.7;
  color: var(--ink-secondary);
  max-width: 360px;
  margin: 0;
}

/* Filtering & Search Tools */
.resource-tools {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
  margin-bottom: 16px;
  flex-wrap: wrap;
}

.resource-filters {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.resource-filters button {
  background: var(--paper);
  color: var(--ink-secondary);
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  font-size: 12px;
  font-weight: 600;
  padding: 8px 14px;
  cursor: pointer;
  transition: all 0.15s ease;
}

.resource-filters button:hover {
  border-color: var(--black);
  color: var(--black);
}

.resource-filters button[aria-pressed="true"] {
  background: var(--black);
  border-color: var(--black);
  color: var(--paper);
}

.resource-search {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 260px;
}

.resource-search label {
  font-size: 9.5px;
  font-weight: 700;
  letter-spacing: 1.2px;
  color: var(--muted);
  text-transform: uppercase;
  white-space: nowrap;
}

.resource-search input {
  font-family: var(--sans);
  font-size: 12.5px;
  border: 1px solid var(--line);
  background: var(--paper);
  color: var(--black);
  padding: 8px 12px;
  width: 100%;
  border-radius: var(--radius-sm);
  transition: border-color 0.15s ease;
}

.resource-search input:focus {
  outline: none;
  border-color: var(--black);
}

.resource-count {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.8px;
  color: var(--muted);
  text-transform: uppercase;
  margin: 10px 0 18px;
}

/* Resource Cards Grid */
.resource-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 22px;
}

.resource-card {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  padding: 22px 20px;
  display: flex;
  flex-direction: column;
  transition: border-color 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
}

.resource-card:hover {
  border-color: var(--black);
  transform: translateY(-2px);
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.03);
}

.resource-top-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
}

.resource-badge {
  font-size: 9.5px;
  font-weight: 700;
  letter-spacing: 1.2px;
  background: var(--bg-muted);
  color: var(--black);
  padding: 3px 8px;
  border-radius: 3px;
  text-transform: uppercase;
}

.resource-tag {
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.8px;
  color: var(--muted);
  text-transform: uppercase;
}

.resource-body {
  display: flex;
  flex-direction: column;
  flex: 1;
}

.resource-topic {
  font-size: 10.5px;
  font-weight: 600;
  color: var(--muted);
  letter-spacing: 0.5px;
  margin-bottom: 6px;
  text-transform: uppercase;
}

.resource-body h3 {
  font-family: var(--serif);
  font-size: 20px;
  line-height: 1.25;
  color: var(--black);
  margin-bottom: 10px;
}

.resource-body p {
  font-size: 13px;
  line-height: 1.65;
  color: var(--ink-secondary);
  margin-bottom: 18px;
  flex-grow: 1;
}

.resource-body .text-link {
  font-size: 12px;
  font-weight: 600;
  color: var(--black);
  display: inline-flex;
  align-items: center;
  gap: 4px;
  border-bottom: 1px solid var(--line-strong);
  padding-bottom: 2px;
  align-self: flex-start;
  margin-top: auto;
}

.resource-card:hover .text-link {
  border-color: var(--black);
}

.archive-note {
  font-size: 11px;
  color: var(--muted);
  line-height: 1.6;
  margin: 24px 0 0;
  padding-top: 14px;
  border-top: 1px dashed var(--line);
}

.empty-resources {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  padding: 36px 24px;
  text-align: center;
  margin-block: 20px;
}

.empty-resources h3 {
  font-family: var(--serif);
  font-size: 24px;
  margin-bottom: 8px;
  color: var(--black);
}

.empty-resources p {
  font-size: 13.5px;
  color: var(--ink-secondary);
  margin-bottom: 16px;
}

/* ==========================================================================
   Connect / Additional Links Section
   ========================================================================== */
.news-connect-section {
  padding-block: 48px;
}

.news-connect {
  display: grid;
  grid-template-columns: 0.95fr 1fr 1fr;
  gap: 32px;
  align-items: stretch;
}

.news-connect-left .section-badge {
  margin-bottom: 12px;
}

.news-connect-left h2 {
  font-family: var(--serif);
  font-size: clamp(28px, 3vw, 36px);
  letter-spacing: -0.6px;
  line-height: 1.15;
  color: var(--black);
  margin: 0;
}

.news-connect-left h2 em {
  font-style: italic;
  font-weight: 400;
  color: var(--ink-secondary);
}

.news-link-card {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  padding: 24px 22px;
  display: flex;
  flex-direction: column;
  transition: border-color 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
  text-decoration: none;
}

.news-link-card:hover {
  border-color: var(--black);
  transform: translateY(-2px);
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.03);
}

.news-link-num {
  font-size: 9.5px;
  font-weight: 700;
  letter-spacing: 1.4px;
  color: var(--muted);
  text-transform: uppercase;
  margin-bottom: 12px;
}

.news-link-card h3 {
  font-family: var(--serif);
  font-size: 20px;
  line-height: 1.25;
  color: var(--black);
  margin-bottom: 8px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.news-link-card p {
  font-size: 13px;
  line-height: 1.65;
  color: var(--ink-secondary);
  margin: 0;
  flex-grow: 1;
}

.resource-card[hidden],
.resource-tools[hidden],
.empty-resources[hidden] {
  display: none !important;
}

/* ==========================================================================
   Responsive Overrides for News & Events Page
   ========================================================================== */
@media (max-width: 1000px) {
  .news-hero-grid {
    gap: 32px;
    grid-template-columns: 1.1fr 0.9fr;
  }
  .featured-event {
    gap: 36px;
    grid-template-columns: 1fr;
  }
  .event-poster {
    max-width: 320px;
  }
  .resource-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .news-connect {
    grid-template-columns: 1fr;
    gap: 20px;
  }
}

@media (max-width: 700px) {
  .news-hero-grid {
    grid-template-columns: 1fr;
    gap: 20px;
  }
  .news-hero-side p {
    max-width: none;
  }
  .resource-heading {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
  }
  .resource-heading > p {
    max-width: none;
  }
  .resource-tools {
    flex-direction: column;
    align-items: stretch;
    gap: 14px;
  }
  .resource-search {
    width: 100%;
    min-width: 0;
  }
  .resource-grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }
  .event-facts {
    grid-template-columns: 1fr;
    gap: 12px;
  }
}

/* Annual conference and historical conference archive. */
.annual-hero { background: var(--paper); padding-block: 32px 52px; }
.annual-hero-grid { display: grid; grid-template-columns: 1.05fr 1fr; align-items: center; gap: 64px; }
.annual-hero h1 { font-family: var(--serif); font-size: clamp(40px, 5vw, 66px); line-height: 1.08; letter-spacing: -1.5px; margin-block: 18px 24px; }
.annual-hero h1 em { color: var(--bronze); font-weight: 400; }
.annual-date { font-size: 20px; font-weight: 600; margin-bottom: 6px; }
.annual-location { color: var(--ink-secondary); font-size: 13px; }
.annual-notice { border-top: 1px solid var(--line); padding-top: 20px; margin-block: 26px; max-width: 440px; }
.annual-notice h2 { font-family: var(--serif); font-size: 24px; margin-bottom: 8px; }
.annual-notice p { color: var(--ink-secondary); font-size: 14px; line-height: 1.8; margin: 0; }
.annual-photo { margin: 0; }
.annual-photo img { width: 100%; height: 450px; object-fit: cover; object-position: center 58%; }
.annual-photo figcaption { color: var(--muted); font-size: 11px; padding-top: 12px; }
.gallery-page .section { padding-block: 36px 52px; }
.archive-heading { font-family: var(--serif); font-size: 30px; margin-bottom: 24px; }
.conference-archive-grid { max-width: 900px; }
.conference-archive-card { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 32px; align-items: center; border: 1px solid var(--line); background: var(--paper); }
.conference-archive-poster { display: block; background: var(--bg-subtle); }
.conference-archive-poster img { display: block; width: 100%; height: auto; }
.conference-archive-copy { padding: 24px 24px 24px 0; }
.conference-archive-copy h3 { font-family: var(--serif); font-size: 25px; margin-block: 16px 12px; }
.conference-archive-copy p { color: var(--ink-secondary); font-size: 14px; line-height: 1.7; }
.conference-archive-copy .archive-date { font-size: 12px; margin-block: 16px 24px; }
@media (max-width: 700px) {
  .annual-hero-grid, .conference-archive-card { grid-template-columns: 1fr; gap: 28px; }
  .annual-hero { padding-bottom: 32px; }
  .annual-photo img { height: 300px; }
  .annual-date { font-size: 18px; }
  .conference-archive-copy { padding: 0 24px 24px; }
}

/* Upcoming and recent association events. */
.event-agenda { padding-block: 28px 40px; }
.agenda-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; }
.agenda-grid > section { display: flex; flex-direction: column; min-width: 0; }
.agenda-heading { font-family: var(--serif); font-size: 26px; margin: 0 0 14px; }
.agenda-card { background: var(--paper); border: 1px solid var(--line); border-top: 3px solid var(--line-strong); padding: 24px 28px; flex: 1; display: flex; flex-direction: column; }
.agenda-card-upcoming { border-top-color: var(--bronze); background: var(--bg-subtle); }
.agenda-labels { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; min-height: 24px; margin-bottom: 18px; }
.agenda-status { font-size: 9px; letter-spacing: 1.4px; font-weight: 700; color: var(--bronze); }
.agenda-access { font-size: 10px; font-weight: 600; color: var(--black); border: 1px solid var(--line-strong); padding: 3px 8px; }
.agenda-city { font-size: 10px; letter-spacing: 1.7px; color: var(--muted); margin-bottom: 8px; }
.agenda-card h3 { font-family: var(--serif); font-size: clamp(25px, 2.6vw, 32px); line-height: 1.18; margin-bottom: 12px; }
.agenda-date { color: var(--black); font-weight: 600; font-size: 14px; margin-bottom: 20px; }
.agenda-facts { border-top: 1px solid var(--line); margin: 0 0 22px; padding-top: 18px; display: grid; gap: 14px; }
.agenda-facts dt { font-size: 9px; font-weight: 700; color: var(--muted); letter-spacing: 1.4px; margin-bottom: 4px; }
.agenda-facts dd { margin: 0; font-size: 13px; line-height: 1.7; color: var(--ink); }
.agenda-map { display: inline-flex; align-items: center; align-self: flex-start; gap: 10px; color: var(--black); font-size: 12px; font-weight: 600; border-bottom: 1px solid var(--line-strong); padding-bottom: 3px; margin-top: auto; }
.agenda-map:hover { color: var(--bronze); border-color: var(--bronze); }
@media (max-width: 700px) { .agenda-grid { grid-template-columns: 1fr; gap: 26px; } .agenda-card { padding: 22px; } }

/* ==========================================================================
   USMBA — Directory Styles
   Sober, dignified legal roster aesthetic
   ========================================================================== */

.directory-hero {
  border-bottom: 1px solid var(--line);
  padding-bottom: 36px;
  margin-bottom: 36px;
}

.directory-hero-copy {
  max-width: 780px;
}

.directory-hero-copy h1 {
  font-family: var(--serif);
  font-size: clamp(32px, 4vw, 46px);
  line-height: 1.15;
  color: var(--black);
  margin-bottom: 14px;
}

.directory-hero-copy h1 em {
  font-style: italic;
  font-weight: 400;
}

.directory-hero-copy p {
  font-size: 15px;
  line-height: 1.65;
  color: var(--ink-secondary);
  margin: 0;
}

/* Directory Controls: Search & Filter */
.directory-controls {
  margin-bottom: 32px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.directory-search-bar {
  display: flex;
  gap: 12px;
  max-width: 600px;
}

.directory-input {
  flex-grow: 1;
  padding: 10px 14px;
  border: 1px solid var(--line-strong);
  border-radius: var(--radius-sm);
  font-family: var(--sans);
  font-size: 13.5px;
  background: var(--paper);
  color: var(--black);
}

.directory-input:focus {
  outline: none;
  border-color: var(--black);
}

.directory-filters {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.filter-btn {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  padding: 6px 12px;
  font-size: 11.5px;
  font-weight: 600;
  color: var(--ink-secondary);
  cursor: pointer;
  transition: all 0.15s ease;
}

.filter-btn:hover {
  border-color: var(--black);
  color: var(--black);
}

.filter-btn.active {
  background: var(--black);
  color: var(--paper);
  border-color: var(--black);
}

/* Directory Roster Grid */
.directory-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
  margin-bottom: 48px;
}

.member-card {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  padding: 18px 16px;
  display: flex;
  flex-direction: column;
  transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}

.member-card:hover {
  transform: translateY(-3px);
  border-color: var(--black);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.05);
}

.member-header {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 16px;
}

.member-avatar {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: var(--bg-muted);
  border: 1px solid var(--line-strong);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  font-weight: 700;
  color: var(--black);
  flex-shrink: 0;
}

.member-title-block h3 {
  font-family: var(--serif);
  font-size: 18.5px;
  line-height: 1.25;
  color: var(--black);
  margin: 0 0 2px 0;
}

.member-role {
  font-size: 11.5px;
  font-weight: 600;
  letter-spacing: 0.5px;
  color: var(--muted);
  text-transform: uppercase;
}

.member-firm {
  font-size: 13px;
  font-weight: 600;
  color: var(--ink);
  margin-bottom: 8px;
}

.member-details {
  font-size: 12.5px;
  line-height: 1.6;
  color: var(--ink-secondary);
  margin-bottom: 16px;
  flex-grow: 1;
}

.member-meta {
  padding-top: 12px;
  border-top: 1px solid var(--line);
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 11px;
  font-weight: 600;
  color: var(--muted);
}

.member-location {
  letter-spacing: 0.5px;
}

.member-contact-link {
  color: var(--black);
  text-decoration: none;
  border-bottom: 1px solid var(--line-strong);
  padding-bottom: 1px;
  transition: border-color 0.15s;
}

.member-contact-link:hover {
  border-color: var(--black);
}

@media (max-width: 1080px) {
  .directory-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 820px) {
  .directory-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 540px) {
  .directory-grid {
    grid-template-columns: 1fr;
  }
  .directory-search-bar {
    max-width: 100%;
  }
}

/* Locally stored portraits keep the roster available without external images. */
.member-photo {
  display: block;
  width: calc(100% + 32px);
  max-width: none;
  height: auto;
  aspect-ratio: 4 / 3.8;
  object-fit: cover;
  object-position: center top;
  background: var(--bg-subtle);
  margin: -18px -16px 14px;
  border-radius: var(--radius-sm) var(--radius-sm) 0 0;
  overflow: hidden;
}
.member-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
  display: block;
}
/* Landscape portraits fill the square by trimming only the side margins. */
img.member-photo.board-photo-landscape,
.member-photo.board-photo-landscape img { object-fit: cover; object-position: center top; }
.member-card { min-width: 0; scroll-margin-top: 110px; }
.member-card:target { border-color: var(--black); }
.member-title-block { min-width: 0; }

.board-source-note { color: var(--muted); font-size: 12px; line-height: 1.7; margin-bottom: 24px; }
.member-photo.board-photo-pending { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; background: var(--bg-subtle); color: var(--bronze); }
.board-photo-pending > span { font-family: var(--serif); font-size: 64px; }
.board-photo-pending small { font-size: 11px; color: var(--muted); }
.member-card .member-meta { margin-top: auto; }

/* ==========================================================================
   USMBA — editorial.css (Legacy compatibility wrapper)
   Note: All styles have been cleanly modularized into:
   - css/variables.css (Design tokens & palette)
   - css/base.css (Resets, typography, layout container)
   - css/layout.css (Utility bar, navigation header, footer)
   - css/components.css (Buttons, badges, links, breadcrumbs)
   - css/home.css (Homepage hero, about, pillars, leadership, articles, join, contact)
   ========================================================================== */

/* ==========================================================================
   USMBA — Article Reader Page Styles
   Strictly Sober, Serious, Editorial Legal Publication Aesthetic
   ========================================================================== */

.article-page {
  background-color: var(--paper);
}

/* Breadcrumbs */
.article-breadcrumbs {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 11px;
  letter-spacing: 0.5px;
  color: var(--muted);
  padding-block: 22px 14px;
}

.article-breadcrumbs a {
  color: var(--ink-secondary);
  transition: color 0.15s;
}

.article-breadcrumbs a:hover {
  color: var(--black);
}

.article-breadcrumbs span[aria-current="page"] {
  color: var(--black);
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 480px;
}

/* Article Hero Header */
.article-hero {
  border-bottom: 1px solid var(--line);
  padding-bottom: 36px;
  margin-bottom: 40px;
}

.article-hero-wrap {
  max-width: 860px;
  margin-inline: auto;
}

.article-meta-top {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 18px;
  flex-wrap: wrap;
}

.article-meta-top .tag-badge {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1.5px;
  background: var(--bg-muted);
  color: var(--black);
  padding: 4px 10px;
  border-radius: var(--radius-sm);
  border: 1px solid var(--line);
}

.article-meta-top .article-date-time {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 1px;
  color: var(--muted);
}

.article-headline {
  font-family: var(--serif);
  font-size: clamp(32px, 4.2vw, 48px);
  font-weight: 700;
  line-height: 1.18;
  letter-spacing: -0.6px;
  color: var(--black);
  margin-bottom: 22px;
}

.article-lede {
  font-family: var(--serif);
  font-style: italic;
  font-size: clamp(17px, 2vw, 20px);
  line-height: 1.6;
  color: var(--ink-secondary);
  margin-bottom: 30px;
  border-left: 2px solid var(--black);
  padding-left: 18px;
}

/* Author byline & Utility bar */
.article-byline-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: 22px;
  border-top: 1px solid var(--line);
  gap: 20px;
  flex-wrap: wrap;
}

.author-block {
  display: flex;
  align-items: center;
  gap: 14px;
}

.author-seal {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background: var(--bg-muted);
  border: 1px solid var(--line-strong);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.5px;
  color: var(--black);
  flex-shrink: 0;
}

.author-info {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.author-name {
  font-size: 13.5px;
  font-weight: 700;
  color: var(--black);
}

.author-title {
  font-size: 11.5px;
  color: var(--ink-secondary);
}

.article-actions {
  display: flex;
  align-items: center;
  gap: 10px;
}

.action-btn {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  padding: 7px 14px;
  font-size: 11.5px;
  font-weight: 600;
  color: var(--ink);
  display: inline-flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
  transition: all 0.15s ease;
}

.action-btn:hover {
  border-color: var(--black);
  color: var(--black);
  background: var(--bg-subtle);
}

/* Article Body Content */
.article-container {
  max-width: 860px;
  margin-inline: auto;
  padding-bottom: 60px;
}

.article-content {
  font-size: 16.5px;
  line-height: 1.8;
  color: #232B38;
}

.article-content p {
  margin-bottom: 24px;
}

.article-content h2 {
  font-family: var(--serif);
  font-size: 26px;
  font-weight: 700;
  line-height: 1.28;
  color: var(--black);
  margin-top: 44px;
  margin-bottom: 18px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--line);
}

.article-content h3 {
  font-family: var(--sans);
  font-size: 17.5px;
  font-weight: 700;
  line-height: 1.4;
  color: var(--black);
  margin-top: 32px;
  margin-bottom: 12px;
  letter-spacing: -0.2px;
}

.article-content ul,
.article-content ol {
  margin-bottom: 26px;
  padding-left: 24px;
}

.article-content li {
  margin-bottom: 10px;
  line-height: 1.7;
}

.article-content blockquote {
  margin: 36px 0;
  padding: 22px 28px;
  background: var(--bg-subtle);
  border: 1px solid var(--line);
  border-left: 3px solid var(--black);
  border-radius: var(--radius-sm);
}

.article-content blockquote p {
  font-family: var(--serif);
  font-style: italic;
  font-size: 18px;
  line-height: 1.6;
  color: var(--black);
  margin: 0;
}

.article-content .callout-box {
  margin: 32px 0;
  padding: 24px 26px;
  background: var(--bg-muted);
  border: 1px solid var(--line-strong);
  border-radius: var(--radius-sm);
}

.callout-box h4 {
  font-size: 12px;
  letter-spacing: 1.5px;
  font-weight: 700;
  color: var(--black);
  margin-top: 0;
  margin-bottom: 10px;
  text-transform: uppercase;
}

.callout-box p {
  font-size: 14px;
  line-height: 1.65;
  color: var(--ink-secondary);
  margin-bottom: 0;
}

/* Citations & Footnotes */
.article-citations {
  margin-top: 48px;
  padding-top: 24px;
  border-top: 1px solid var(--line);
  font-size: 12px;
  line-height: 1.7;
  color: var(--muted);
}

.article-citations h4 {
  font-size: 11px;
  letter-spacing: 1.5px;
  font-weight: 700;
  color: var(--black);
  margin-bottom: 12px;
  text-transform: uppercase;
}

.article-citations ol {
  padding-left: 20px;
  margin: 0;
}

.article-citations li {
  margin-bottom: 8px;
}

/* Author Committee Box */
.committee-card {
  margin-top: 52px;
  padding: 28px 30px;
  background: var(--bg-subtle);
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  display: flex;
  align-items: flex-start;
  gap: 20px;
}

.committee-seal {
  width: 52px;
  height: 52px;
  border-radius: var(--radius-sm);
  background: var(--black);
  color: var(--paper);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  font-weight: 700;
  flex-shrink: 0;
}

.committee-details h4 {
  font-size: 14px;
  font-weight: 700;
  color: var(--black);
  margin: 0 0 4px 0;
}

.committee-details p {
  font-size: 12.5px;
  line-height: 1.65;
  color: var(--ink-secondary);
  margin: 0;
}

/* Related Articles Section */
.related-section {
  background: var(--bg-subtle);
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  padding-block: 54px;
}

.related-section .section-heading {
  margin-bottom: 30px;
}

.related-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
}

@media (max-width: 768px) {
  .related-grid {
    grid-template-columns: 1fr;
  }

  .article-byline-bar {
    flex-direction: column;
    align-items: flex-start;
  }

  .committee-card {
    flex-direction: column;
  }
}

.usmba-decoration-1 { padding: 24px 22px; background: var(--bg-subtle); border: 1px solid var(--line); border-radius: var(--radius-sm); }
.usmba-decoration-2 { font-size: 10.5px; font-weight: 700; letter-spacing: 1.5px; color: var(--muted); }
.usmba-decoration-3 { font-size: 16px; margin: 8px 0 6px 0; color: var(--black); }
.usmba-decoration-4 { font-size: 12.5px; line-height: 1.6; color: var(--ink-secondary); margin: 0; }

/* Match the institutional layout with core block markup. */
.usmba-template-bar,
.usmba-template-header,
.usmba-template-footer,
.usmba-content { margin-block: 0; }

.usmba-nav-wrap {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    min-height: 82px;
}

.usmba-site-brand { flex: 0 0 auto; }
.usmba-site-brand .wp-block-site-logo { margin: 0; }
.usmba-brand-caption {
    font-size: 0.58rem;
    font-weight: 700;
    letter-spacing: .08em;
    margin: 0;
}
.usmba-template-header {
    background: var(--paper);
    border-bottom: 1px solid var(--line);
    position: sticky;
    top: 0;
    z-index: 20;
}
.admin-bar .usmba-template-header { top: var(--wp-admin--admin-bar--height, 32px); }
.usmba-main-navigation { font-size: 0.8rem; font-weight: 600; }
.usmba-main-navigation .wp-block-navigation__container { gap: clamp(.8rem, 2vw, 1.65rem); }
.usmba-main-navigation .wp-block-navigation-item__content:hover,
.usmba-main-navigation .current-menu-item .wp-block-navigation-item__content { color: var(--bronze); }
.usmba-join-nav > a {
    background-color: var(--black);
    color: var(--paper) !important;
    padding: .58rem .9rem;
}

.utility p, .usmba-inline-link, .footer p, .lang-btn { margin: 0; }
.utility-actions, .lang-switch, .legal-links, .footer-links-nav { display: flex; flex-wrap: wrap; }
.lang-switch { gap: .45rem; }
.lang-btn a[aria-current] { color: var(--bronze-light); text-decoration: underline; }
.lang-sep { display: none; }
.usmba-template-footer .footer { margin-top: 0; }
.usmba-template-footer .wp-block-site-logo { margin-bottom: 12px; }
.usmba-template-footer .usmba-bg-dark .wp-block-site-logo img { filter: brightness(0) invert(1); }
.usmba-template-footer .legal-links { gap: 14px; }
.usmba-template-footer .disclaimer { margin-top: 1rem; }
.usmba-content:has(.usmba-portal) > .wp-block-post-content > h1.wp-block-heading:first-child { display: none; }

.usmba-content .wp-block-image { margin-block: 0; }
.usmba-content .wp-block-image img { display: block; }
.usmba-content .wp-block-image.media-card img {
    width: 100%;
    height: 100%;
    min-height: 440px;
    max-height: 480px;
    object-fit: cover;
    object-position: center 65%;
}
.usmba-content .wp-block-image.media-card figcaption {
    position: absolute;
    inset: auto 0 0;
    margin: 0;
    text-align: start;
    padding: .65rem 1rem;
    background: rgba(20, 45, 62, .94);
}
.usmba-content .media-card .caption-title, .usmba-content .media-card .caption-text { display: block; }
.usmba-content .hero-eyebrow,
.usmba-content .hero-meta,
.usmba-content .article-header,
.usmba-content .agenda-labels { margin-top: 0; }
.usmba-content .hero-meta p,
.usmba-content .article-header p,
.usmba-content .agenda-labels p,
.usmba-content .member-role,
.usmba-content .member-location,
.usmba-content .plan-price p,
.usmba-content .contact-label { margin: 0; }
.usmba-content .home-leader figure { flex: none; }
.usmba-content .wp-block-image.member-photo {
    overflow: hidden;
    margin: -18px -16px 14px;
    width: calc(100% + 32px);
}
.usmba-content .wp-block-image.member-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
}
.usmba-content .board-photo-pending p { margin: 0; }
.usmba-content .pillar-link { margin-top: auto; }
.usmba-content .about-subnote p:first-child { font-weight: 700; }
.usmba-content .agenda-facts .usmba-dt { font-size: .63rem; letter-spacing: .1em; font-weight: 700; margin: 0; }
.usmba-content .agenda-facts .usmba-dd { margin: 0 0 .6em; }
.usmba-content .usmba-editorial-entry { max-width: 800px; padding-block: clamp(2rem, 6vw, 5rem); }
.usmba-content .usmba-editorial-entry .article-headline { margin-block: .65em; }
.usmba-content .usmba-editorial-entry .article-prose a { text-decoration: underline; overflow-wrap: anywhere; }
.usmba-content .article-grid h2 { font-size: clamp(1.3rem, 2vw, 1.8rem); }
.usmba-content .usmba-inline-link > a:hover { text-decoration: underline; }
.usmba-content .wp-block-post-content a[href^="mailto:"] { overflow-wrap: anywhere; }

.usmba-content .wp-block-button.usmba-button {
    padding: 0;
    border: 0;
    display: block;
    background: transparent;
}
.usmba-content .usmba-button .wp-block-button__link {
    font-size: .78rem;
    font-weight: 700;
    padding: .78rem 1rem;
}
.usmba-content .usmba-button.is-style-outline .wp-block-button__link {
    color: var(--black);
    border: 1px solid var(--black);
}
.usmba-content .hero-actions .usmba-button.primary .wp-block-button__link {
    background-color: var(--bronze-light);
    color: var(--black);
}
.usmba-content .hero-actions .usmba-button.primary .wp-block-button__link:hover { background-color: #ead1a5; }
.usmba-content .hero-actions .usmba-button.is-style-outline .wp-block-button__link {
    background-color: transparent;
    border: 0;
    border-bottom: 1px solid #647580;
    color: var(--paper);
    border-radius: 0;
    padding-inline: 0;
}
.usmba-content .hero-actions .usmba-button.is-style-outline .wp-block-button__link:hover {
    color: var(--bronze-light);
    border-color: var(--bronze-light);
}
.usmba-content .usmba-button.light .wp-block-button__link {
    color: var(--black);
    background-color: var(--paper);
}
.usmba-content .usmba-button.strip-button .wp-block-button__link {
    color: var(--paper);
    border: 1px solid currentColor;
}
.usmba-content .usmba-button.light .wp-block-button__link:hover,
.usmba-content .usmba-button.is-style-outline .wp-block-button__link:hover {
    color: var(--paper);
    background: var(--black-hover);
}
.usmba-content .resource-filters .wp-block-button__link,
.usmba-content .directory-filters .wp-block-button__link {
    background: var(--paper);
    color: var(--black);
    border: 1px solid var(--line);
    padding: .5rem .7rem;
    text-align: left;
}
.usmba-content .resource-filters .wp-block-button__link[aria-pressed="true"],
.usmba-content .directory-filters .wp-block-button__link[aria-pressed="true"] {
    background: var(--black);
    color: var(--paper);
}
.usmba-content .resource-filters,
.usmba-content .directory-filters { display: flex; flex-wrap: wrap; gap: .45rem; }
.usmba-content .directory-search-bar { width: 100%; max-width: 560px; }
.usmba-content .usmba-local-search { width: 100%; flex: 1 1 100%; }
.usmba-content .usmba-local-search .wp-block-search__inside-wrapper { width: 100%; display: flex; }
.usmba-content .usmba-local-search .wp-block-search__input {
    width: 100%;
    max-width: 100%;
    min-height: 44px;
    padding: 0.6rem 0.95rem;
    font-family: var(--sans);
    font-size: 0.9rem;
    border: 1px solid var(--line-strong);
    border-radius: var(--radius-sm);
    background: var(--paper);
    color: var(--black);
}
.usmba-content .usmba-local-search .wp-block-search__input:focus {
    outline: none;
    border-color: var(--black);
}
.usmba-filter-status { color: var(--muted); margin: .65rem 0; }
.usmba-content [hidden] { display: none !important; }

/* Insights & Analysis Editorial Filter Bar */
.usmba-insights-toolbar {
    margin: 1.5rem 0 2.25rem;
    padding: 1.25rem 1.4rem;
    background: var(--bg-subtle);
    border: 1px solid var(--line);
    display: grid;
    gap: 1rem;
}

.usmba-insights-controls {
    display: grid;
    grid-template-columns: minmax(0, 1.8fr) minmax(170px, 0.8fr) minmax(150px, 0.7fr);
    gap: 0.85rem;
    align-items: end;
}

.usmba-insights-search-wrap,
.usmba-insights-select-wrap {
    display: grid;
    gap: 0.35rem;
    min-width: 0;
}

.usmba-insights-select-wrap span {
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--muted);
}

.usmba-insights-search,
.usmba-insights-source,
.usmba-insights-sort {
    width: 100%;
    height: 40px;
    padding: 0 0.85rem;
    background: var(--paper);
    color: var(--black);
    border: 1px solid var(--line);
    border-radius: 0;
    font-family: var(--sans);
    font-size: 0.85rem;
    transition: border-color 0.15s ease;
}

.usmba-insights-search:focus,
.usmba-insights-source:focus,
.usmba-insights-sort:focus {
    outline: none;
    border-color: var(--black);
}

.usmba-insights-topics {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
    padding-top: 0.85rem;
    border-top: 1px solid var(--line);
}

.usmba-topic-pill {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    height: 32px;
    padding: 0 0.75rem;
    background: var(--paper);
    color: var(--ink);
    border: 1px solid var(--line);
    border-radius: 0;
    font-family: var(--sans);
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    cursor: pointer;
    transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.usmba-topic-pill:hover {
    border-color: var(--black);
    color: var(--black);
}

.usmba-topic-pill[aria-pressed="true"] {
    background: var(--black);
    border-color: var(--black);
    color: var(--paper);
}

.usmba-topic-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 18px;
    padding: 0 4px;
    font-size: 0.66rem;
    background: var(--bg-subtle);
    color: var(--muted);
}

.usmba-topic-pill[aria-pressed="true"] .usmba-topic-count {
    background: rgba(255, 254, 250, 0.18);
    color: var(--paper);
}

.usmba-insights-status-bar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding-top: 0.25rem;
}

.usmba-insights-status-bar .usmba-filter-status {
    margin: 0;
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--muted);
}

.usmba-insights-reset {
    padding: 0;
    background: transparent;
    border: 0;
    border-bottom: 1px solid var(--black);
    color: var(--black);
    font-family: var(--sans);
    font-size: 0.76rem;
    font-weight: 600;
    cursor: pointer;
}

.usmba-insights-empty {
    margin-top: 1rem;
    padding: 2.25rem 1.5rem;
    text-align: center;
    background: var(--bg-subtle);
    border: 1px solid var(--line);
    color: var(--ink-secondary);
    font-size: 0.92rem;
}

@media (max-width: 782px) {
    .usmba-insights-controls {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 782px) {
    .usmba-nav-wrap { min-height: 65px; }
    .usmba-site-brand .wp-block-site-logo img { width: 150px; }
    .usmba-brand-caption { font-size: 0.48rem; }
    .utility-wrap { flex-wrap: wrap; }
    .usmba-content .wp-block-image.media-card img { min-height: 270px; max-height: 340px; }
}

.usmba-content .wp-block-image.board-photo-landscape img {object-fit:cover;object-position:65% center;width:100%;height:100%;}

/* ==========================================================================
   USMBA Flexible & Editable Layout System (Dynamic Grids, Columns & Media)
   ========================================================================== */

/* 1. Auto-adapt 2-column institutional sections when user adds a 3rd or 4th column/image */
@media (min-width: 901px) {
  :is(.about-hero-grid, .hero-wrap, .about, .purpose-intro, .history-heading, .member-hero-grid, .news-hero-grid, .annual-hero-grid, .contact, .membership-help, .featured-event, .conference-archive-card):not([class*="usmba-cols-"]):has(> :only-child) {
    grid-template-columns: 1fr;
  }
  :is(.about-hero-grid, .hero-wrap, .about, .purpose-intro, .history-heading, .member-hero-grid, .news-hero-grid, .annual-hero-grid, .contact, .membership-help, .featured-event, .conference-archive-card):not([class*="usmba-cols-"]):has(> :nth-child(3):last-child) {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 32px;
  }
  :is(.about-hero-grid, .hero-wrap, .about, .purpose-intro, .history-heading, .member-hero-grid, .news-hero-grid, .annual-hero-grid, .contact, .membership-help, .featured-event, .conference-archive-card):not([class*="usmba-cols-"]):has(> :nth-child(4)) {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 24px;
  }
  :is(.about, .purpose-intro):has(> :nth-child(3)) :is(.about-copy-col, .purpose-description) {
    padding-left: 24px;
  }
}

/* 2. Explicit Column Count Controls (.usmba-cols-*) */
:is(.wp-block-group, .wp-block-columns)[class*="usmba-cols-"] {
  display: grid !important;
}
:is(.wp-block-group, .wp-block-columns).usmba-cols-1 {
  grid-template-columns: 1fr !important;
}
@media (min-width: 901px) {
  :is(.wp-block-group, .wp-block-columns).usmba-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  :is(.wp-block-group, .wp-block-columns).usmba-cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
  :is(.wp-block-group, .wp-block-columns).usmba-cols-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  }
  :is(.wp-block-group, .wp-block-columns).usmba-cols-auto {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)) !important;
  }

  /* 3. Two-Column Proportions (.usmba-ratio-*) */
  :is(.wp-block-group, .wp-block-columns).usmba-ratio-50-50 {
    grid-template-columns: 1fr 1fr !important;
  }
  :is(.wp-block-group, .wp-block-columns).usmba-ratio-60-40 {
    grid-template-columns: 1.2fr 0.8fr !important;
  }
  :is(.wp-block-group, .wp-block-columns).usmba-ratio-40-60 {
    grid-template-columns: 0.8fr 1.2fr !important;
  }
  :is(.wp-block-group, .wp-block-columns).usmba-ratio-65-35 {
    grid-template-columns: 1.35fr 0.65fr !important;
  }
  :is(.wp-block-group, .wp-block-columns).usmba-ratio-35-65 {
    grid-template-columns: 0.65fr 1.35fr !important;
  }
}

@media (max-width: 900px) and (min-width: 601px) {
  :is(.wp-block-group, .wp-block-columns):is(.usmba-cols-3, .usmba-cols-4) {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  :is(.wp-block-group, .wp-block-columns):is(.usmba-cols-2, [class*="usmba-ratio-"]) {
    grid-template-columns: 1fr !important;
  }
}
@media (max-width: 600px) {
  :is(.wp-block-group, .wp-block-columns)[class*="usmba-cols-"],
  :is(.wp-block-group, .wp-block-columns)[class*="usmba-ratio-"] {
    grid-template-columns: 1fr !important;
  }
}

/* 4. Column Order / Visual Reversal (.usmba-reverse) */
@media (min-width: 901px) {
  .usmba-reverse > :nth-child(1) { order: 2; }
  .usmba-reverse > :nth-child(2) { order: 1; }
  .usmba-reverse > :nth-child(3) { order: 3; }
  .usmba-reverse .about-copy-col,
  .usmba-reverse .purpose-description {
    border-left: none;
    padding-left: 0;
    border-right: 1px solid var(--line);
    padding-right: 32px;
  }
}

/* 5. Vertical Alignment (.usmba-valign-*) & Gap (.usmba-gap-*) */
.usmba-valign-start { align-items: start !important; }
.usmba-valign-center { align-items: center !important; }
.usmba-valign-end { align-items: end !important; }
.usmba-valign-stretch { align-items: stretch !important; }

.usmba-gap-none { gap: 0px !important; }
.usmba-gap-sm { gap: 16px !important; }
.usmba-gap-md { gap: 28px !important; }
.usmba-gap-lg { gap: 48px !important; }

/* 6. Section Backgrounds, Padding & Borders */
.usmba-bg-paper {
  background-color: var(--paper) !important;
  color: var(--ink) !important;
}
.usmba-bg-subtle {
  background-color: var(--bg-subtle) !important;
  color: var(--ink) !important;
}
.usmba-bg-dark {
  background-color: var(--black) !important;
  color: var(--paper) !important;
}
.usmba-bg-dark :is(h1, h2, h3, h4, strong) {
  color: var(--paper);
}
.usmba-bg-dark :is(h1 em, h2 em, .section-badge, .hero-eyebrow) {
  color: var(--bronze-light);
}
.usmba-bg-dark :is(p, li) {
  color: #d1dbe0;
}

.usmba-pad-none { padding-block: 0 !important; }
.usmba-pad-sm { padding-block: 24px !important; }
.usmba-pad-md { padding-block: 44px !important; }
.usmba-pad-lg { padding-block: 68px !important; }

.usmba-border-none { border-top: 0 !important; border-bottom: 0 !important; }
.usmba-border-bottom { border-bottom: 1px solid var(--line) !important; }
.usmba-border-both { border-block: 1px solid var(--line) !important; }
.usmba-border-bronze { border-top: 2px solid var(--bronze) !important; }

/* 7. Multi-Image & Flexible Image Containers (e.g. inside .about-hero-image, .hero-media, or new columns) */
.about-hero-image {
  display: flex;
  flex-direction: column;
  gap: 0;
}
.about-hero-image.usmba-media-side-by-side,
.about-hero-media:has(> .wp-block-image:nth-child(2)) {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 10px;
  aspect-ratio: auto;
  padding: 10px;
  background: var(--bg-subtle);
}
.about-hero-image.usmba-media-stack .about-hero-media:has(> .wp-block-image:nth-child(2)) {
  grid-template-columns: 1fr;
}
.about-hero-image > .wp-block-image {
  width: 100%;
  margin: 0;
}
.about-hero-image > .wp-block-image img {
  width: 100%;
  height: auto;
  object-fit: cover;
  display: block;
}
.about-hero-image > .wp-block-image + .wp-block-image,
.about-hero-media + .wp-block-image,
.about-hero-media + .about-hero-media {
  border-top: 1px solid var(--line);
}

/* 8. Image Aspect Ratio, Object Fit, Position & Frame Controls */
.wp-block-image[class*="usmba-aspect-"] img,
.about-hero-media[class*="usmba-aspect-"] {
  width: 100%;
  height: 100%;
}
.wp-block-image.usmba-aspect-auto img,
.about-hero-image:has(.usmba-aspect-auto) .about-hero-media {
  aspect-ratio: auto !important;
  height: auto !important;
  max-height: none !important;
  min-height: 0 !important;
}
.wp-block-image.usmba-aspect-16-9 img,
.about-hero-image:has(.usmba-aspect-16-9) .about-hero-media {
  aspect-ratio: 16 / 9 !important;
}
.wp-block-image.usmba-aspect-16-10 img,
.about-hero-image:has(.usmba-aspect-16-10) .about-hero-media {
  aspect-ratio: 16 / 10 !important;
}
.wp-block-image.usmba-aspect-4-3 img,
.about-hero-image:has(.usmba-aspect-4-3) .about-hero-media {
  aspect-ratio: 4 / 3 !important;
}
.wp-block-image.usmba-aspect-1-1 img,
.about-hero-image:has(.usmba-aspect-1-1) .about-hero-media {
  aspect-ratio: 1 / 1 !important;
}
.wp-block-image.usmba-aspect-3-4 img,
.about-hero-image:has(.usmba-aspect-3-4) .about-hero-media {
  aspect-ratio: 3 / 4 !important;
}

.wp-block-image.usmba-fit-cover img { object-fit: cover !important; }
.wp-block-image.usmba-fit-contain img { object-fit: contain !important; background: var(--bg-subtle); }

.wp-block-image.usmba-pos-center img { object-position: center center !important; }
.wp-block-image.usmba-pos-top img { object-position: center top !important; }
.wp-block-image.usmba-pos-bottom img { object-position: center bottom !important; }
.wp-block-image.usmba-pos-left img { object-position: left center !important; }
.wp-block-image.usmba-pos-right img { object-position: right center !important; }

.usmba-frame-card {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  overflow: hidden;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.03);
}
.usmba-frame-padded {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  padding: 22px;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.03);
}
.usmba-frame-none {
  border: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}

/* 9. Native WordPress Columns & Media-Text Integration inside USMBA */
.usmba-content .wp-block-columns {
  gap: 32px;
  margin-block: 0;
}
.usmba-content .wp-block-column {
  min-width: 0;
}
.usmba-content .wp-block-media-text {
  gap: 36px;
}
.usmba-flex-section {
  padding-block: 44px;
  border-bottom: 1px solid var(--line);
}
.usmba-col-card {
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-width: 0;
}
.usmba-col-card h2,
.usmba-col-card h3 {
  font-family: var(--serif);
  color: var(--black);
  margin: 0;
}
.usmba-col-card p {
  color: var(--ink-secondary);
  margin: 0;
}

/* ==========================================================================
   10. Directory Member Profile Detail View (?perfil=<slug>)
   ========================================================================== */
.usmba-card-photo-link {
  display: block;
  width: 100%;
  height: 100%;
}

.usmba-card-photo-link img {
  transition: transform 0.25s ease;
}

.member-card:hover .usmba-card-photo-link img {
  transform: scale(1.03);
}

.usmba-card-title-link {
  color: inherit;
  text-decoration: none;
}

.usmba-card-title-link:hover {
  text-decoration: underline;
}

.usmba-member-profile-view {
  padding-block: 36px 72px;
}

.usmba-member-profile-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  padding-bottom: 18px;
  margin-bottom: 32px;
  border-bottom: 1px solid var(--line);
}

.usmba-member-profile-back {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  font-weight: 600;
  color: var(--black);
  text-decoration: none;
  padding: 8px 14px;
  border: 1px solid var(--line-strong);
  background: var(--paper);
  transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.usmba-member-profile-back:hover {
  background: var(--black);
  color: var(--paper);
  border-color: var(--black);
}

.usmba-member-profile-crumb {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 1.2px;
  text-transform: uppercase;
  color: var(--muted);
}

.usmba-member-profile-grid {
  display: grid;
  grid-template-columns: 320px minmax(0, 1fr);
  gap: 44px;
  align-items: start;
}

.usmba-member-profile-aside {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.usmba-member-profile-portrait {
  width: 100%;
  aspect-ratio: 4 / 4.2;
  background: var(--bg-subtle);
  border: 1px solid var(--line);
  overflow: hidden;
}

.usmba-member-profile-portrait img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
  display: block;
}

.usmba-member-profile-meta-card {
  background: var(--bg-subtle);
  border: 1px solid var(--line);
  padding: 20px 22px;
}

.usmba-member-profile-meta-heading {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1.4px;
  text-transform: uppercase;
  color: var(--muted);
  margin: 0 0 14px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--line);
}

.usmba-member-profile-dl {
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.usmba-member-profile-dl > div {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.usmba-member-profile-dl dt {
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.8px;
  text-transform: uppercase;
  color: var(--muted);
}

.usmba-member-profile-dl dd {
  margin: 0;
  font-size: 13.5px;
  line-height: 1.5;
  color: var(--ink);
  overflow-wrap: anywhere;
}

.usmba-member-profile-dl dd a {
  color: var(--black);
  font-weight: 600;
  text-decoration: underline;
}

.usmba-member-profile-main {
  min-width: 0;
}

.usmba-member-profile-name {
  font-family: var(--serif);
  font-size: clamp(32px, 3.6vw, 46px);
  line-height: 1.1;
  letter-spacing: -0.6px;
  color: var(--black);
  margin: 8px 0 10px;
}

.usmba-member-profile-subtitle {
  font-size: 16px;
  line-height: 1.55;
  color: var(--ink-secondary);
  margin: 0 0 22px;
}

.usmba-member-profile-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 28px;
  padding-bottom: 24px;
  border-bottom: 1px solid var(--line);
}

.usmba-member-profile-tag {
  display: inline-block;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.4px;
  padding: 5px 12px;
  background: var(--bg-subtle);
  border: 1px solid var(--line);
  color: var(--black);
}

.usmba-member-profile-bio h2 {
  font-family: var(--serif);
  font-size: 24px;
  color: var(--black);
  margin: 0 0 14px;
}

.usmba-member-profile-bio p {
  font-size: 15.5px;
  line-height: 1.78;
  color: var(--ink);
  margin: 0 0 16px;
}

.usmba-member-profile-education {
  margin-top: 28px;
  padding: 20px 24px;
  background: var(--bg-subtle);
  border-left: 3px solid var(--black);
}

.usmba-member-profile-education h3 {
  font-family: var(--serif);
  font-size: 18px;
  color: var(--black);
  margin: 0 0 6px;
}

.usmba-member-profile-education p {
  font-size: 14px;
  line-height: 1.65;
  color: var(--ink-secondary);
  margin: 0;
}

.usmba-member-profile-pager {
  margin-top: 40px;
  padding-top: 24px;
  border-top: 1px solid var(--line);
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.usmba-member-profile-pager-link {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 16px 20px;
  border: 1px solid var(--line);
  background: var(--paper);
  text-decoration: none;
  transition: border-color 0.15s ease, transform 0.15s ease;
}

.usmba-member-profile-pager-link:hover {
  border-color: var(--black);
  transform: translateY(-2px);
}

.usmba-member-profile-pager-link.is-next {
  text-align: right;
  align-items: flex-end;
}

.usmba-member-profile-pager-link span {
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--muted);
}

.usmba-member-profile-pager-link strong {
  font-family: var(--serif);
  font-size: 18px;
  color: var(--black);
}

.usmba-member-profile-pager-link small {
  font-size: 12.5px;
  color: var(--ink-secondary);
}

@media (max-width: 860px) {
  .usmba-member-profile-grid {
    grid-template-columns: 1fr;
    gap: 28px;
  }
  .usmba-member-profile-aside {
    max-width: 380px;
  }
  .usmba-member-profile-pager {
    grid-template-columns: 1fr;
  }
  .usmba-member-profile-pager-link.is-next {
    text-align: left;
    align-items: flex-start;
  }
}