/* ===== ENDORSER LOGO WALL — shared by index.html + pledge.html =====
   Relies on the page's :root palette tokens (--ink, --paper, --red, --yellow,
   --ink-2, --muted, --f-display, --f-tech, --ease). Both pages define them. */

.org-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(208px,1fr));gap:.85rem;margin-top:1.4rem}
.org-card{display:flex;flex-direction:column;border:3px solid var(--ink);background:var(--paper);
  position:relative;transition:transform .2s var(--ease),box-shadow .2s var(--ease)}
.org-card:hover{transform:translate(-3px,-3px);box-shadow:7px 7px 0 var(--ink);z-index:2}
.org-logo{flex:1;display:flex;align-items:center;justify-content:center;background:#fff;
  padding:1.5rem 1.4rem;min-height:132px;position:relative;overflow:hidden}
.org-logo::before{content:'';position:absolute;top:8px;right:8px;width:12px;height:12px;background:var(--red);z-index:1}
.org-logo img{max-width:100%;max-height:98px;width:auto;height:auto;object-fit:contain}
.org-name{font-family:var(--f-tech);font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  line-height:1.3;background:var(--ink);color:var(--paper);padding:.7rem .85rem;display:flex;align-items:center;min-height:46px}
/* inverted card — for white-on-transparent logos (e.g. Voters of Tomorrow) */
.org-card.invert .org-logo{background:var(--ink)}
.org-card.invert .org-logo::before{background:var(--yellow)}
.org-card.invert .org-name{border-top:3px solid var(--red)}

/* heading + lede for the cloned endorser block (self-contained, no class
   collisions with either page's existing styles) */
.e-title{font-family:var(--f-display);font-size:clamp(1.4rem,2.6vw,2rem);text-transform:uppercase;
  letter-spacing:-.02em;margin:0 0 .6rem;color:var(--ink)}
.e-title .red{color:var(--red)}
.e-lede{font-family:var(--f-tech);font-size:clamp(1rem,1.5vw,1.18rem);line-height:1.65;max-width:760px;
  margin-bottom:.4rem;font-weight:500;color:var(--ink-2)}
.e-noscript{display:block;font-family:var(--f-tech);font-size:14px;color:var(--muted);padding:1.2rem 0}

/* ===== MOBILE: two compact columns so the endorser wall takes less vertical space ===== */
@media (max-width:600px){
  .org-grid{grid-template-columns:1fr 1fr;gap:.5rem;margin-top:1rem}
  .org-card{border-width:2px}
  /* :hover can stick after a tap on touch devices — keep cards flat on small screens */
  .org-card:hover{transform:none;box-shadow:none}
  .org-logo{min-height:84px;padding:.85rem .7rem}
  .org-logo img{max-height:58px}
  .org-logo::before{width:9px;height:9px;top:6px;right:6px}
  .org-name{font-size:8.5px;letter-spacing:.05em;padding:.5rem .55rem;min-height:36px}
}