.contact-person {
    display: grid; grid-template-columns: 168px 1fr; gap: clamp(24px, 4vw, 48px);
    align-items: center; padding: clamp(28px, 4vw, 44px);
    background: var(--surface-elev); border: 1px solid var(--border);
    border-radius: var(--radius-lg); max-width: 760px;
  }
  .contact-avatar {
    width: 168px; height: 168px; border-radius: 50%; overflow: hidden;
    display: flex; align-items: center; justify-content: center;
    background: linear-gradient(160deg, var(--accent-ink), var(--accent) 75%);
    color: #FBF7F0; font-size: 52px; font-weight: 600; letter-spacing: .02em;
  }
  .contact-avatar img { width: 100%; height: 100%; object-fit: cover; }
  .contact-info .role { color: var(--accent); font-weight: 600; font-size: 15px; margin-top: 6px; }
  .contact-info .org { color: var(--muted); font-size: 15px; margin-top: 2px; }
  .contact-info .email {
    display: inline-flex; align-items: center; gap: 9px; margin-top: 20px;
    color: var(--accent); font-weight: 500; font-size: 15px;
  }
  .contact-info .email svg { width: 17px; height: 17px; }
  .contact-info .email:hover { text-decoration: underline; }
  @media (max-width: 560px) {
    .contact-person { grid-template-columns: 1fr; justify-items: start; text-align: left; }
    .contact-avatar { width: 132px; height: 132px; font-size: 42px; }
    .contact-info .email { justify-content: center; }
  }

  .contact-info .email + .email { margin-left: 18px; }
  .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }