/* Partners: compact cards, 3 per row, each with a dropdown description. */
.partners-list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
  align-items: start;
}
@media (max-width: 900px) { .partners-list { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) { .partners-list { grid-template-columns: 1fr; } }
/* The global `.acc-item + .acc-item { margin-top }` (for stacked accordions)
   pushes every card after the first down 12px, which misaligns the grid row —
   the grid `gap` already spaces the cards, so cancel it here. */
.partners-list .partner + .partner { margin-top: 0; }
/* Whole card is the click target now, so show the pointer across all of it. */
.partner.acc-item { cursor: pointer; }
/* No card frame around a partner: the global .acc-item box (border + surface
   fill + rounded corners) drew a rectangle around the pfp and name, so drop it
   here. Padding stays, so the spacing and the grid rhythm are unchanged. */
.partner.acc-item,
.partner.acc-item.open { border: 0; border-radius: 0; background: none; }
.partner .partner-links a, .partner .partner-del { cursor: pointer; }

/* The head is a div acting as a button (see partners.js); make sure nothing
   ever paints a box behind the pfp + name — no fill, border or inset. */
.partner-head {
  position: relative; display: flex; align-items: center; gap: 11px; padding: 0 28px 0 0;
  width: 100%; margin: 0; background: none; border: 0; border-radius: 0; box-shadow: none;
  color: inherit; font: inherit; text-align: left; cursor: pointer; appearance: none;
}
.partner-head:focus-visible { outline: 2px solid var(--accent); outline-offset: 4px; border-radius: 4px; }
.partner-pfp {
  width: 36px; height: 36px; border-radius: 50%; object-fit: cover; flex: 0 0 auto;
  border: 1px solid var(--hairline-strong); background: var(--surface-2);
}
.partner-name { flex: 1; font-size: 15px; font-weight: 800; text-align: left; overflow-wrap: anywhere; }
/* tiny caret in the top corner, instead of a big centered arrow */
.partner-caret {
  position: absolute; top: 8px; right: 10px;
  width: 14px; height: 14px; color: var(--text-mute);
  transition: transform var(--t) var(--e-out);
}
.partner.acc-item.open .partner-caret { transform: rotate(180deg); color: var(--text); }
/* links + banner sit outside the dropdown (always visible) */
.partner > .partner-links { padding: 0 16px 12px; }
.partner > .partner-banner { margin: 0 0 2px; }
.partner-desc { padding-top: 4px; }
.partner.acc-item { padding: 14px 16px; }
.partner.acc-item .acc-head { padding: 0; }
.partner-del {
  appearance: none; border: 0; cursor: pointer;
  width: 24px; height: 24px; border-radius: 7px; font-size: 15px; line-height: 1;
  color: var(--text-mute); background: transparent; flex: 0 0 auto;
}
.partner-del:hover { background: rgba(255,90,90,.18); color: #ff8a8a; }

.partner-body { color: var(--text-dim); }
.partner-banner {
  width: 100%; max-height: 120px; object-fit: cover;
  border-radius: var(--r-sm); border: 1px solid var(--hairline); margin-bottom: 4px;
}
.partner-desc p { margin-bottom: 10px; font-size: 13px; line-height: 1.6; }
.partner-links { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.partner-links .btn { padding: 6px 11px; font-size: 12px; }