/* support.css — the Buy Me A Coffee block, for pages that do not load
 * films.css.
 *
 * These rules are a copy of the .support-strip and .btn-bmac blocks in
 * films.css, which is where the component started (WolfOut Rankings and the
 * Screening Room). Keeping one visual language across the site matters more
 * than avoiding the duplication, and only ten of twenty-three pages load
 * films.css. If you change one, change the other; they are meant to match.
 *
 * Custom properties are given fallbacks because the pages that need this file
 * are the ones without the theme's variables defined. */

.support-strip{background:var(--surface,#16161c);border:1px solid var(--border,#26262e);
  border-radius:var(--radius-lg,14px);padding:20px 24px;margin:44px auto 0;max-width:820px;width:calc(100% - 40px);
  display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap}
.support-strip .copy{font-size:14px;color:var(--text2,#b6b6c2);line-height:1.6;max-width:52ch;text-align:left}
.support-strip .copy strong{color:var(--text,#f2f2f5);font-size:15px}

.btn-bmac{background:#ffdd00;color:#000;border:none;padding:14px 26px;border-radius:10px;
  font-size:16px;font-weight:700;font-family:inherit;cursor:pointer;text-decoration:none;
  transition:filter .15s;white-space:nowrap;display:inline-block}
.btn-bmac:hover{filter:brightness(.9);text-decoration:none;color:#000}

@media(max-width:560px){
  .support-strip{flex-direction:column;align-items:stretch;text-align:center;margin-top:34px}
  .support-strip .copy{text-align:center;max-width:none}
  .btn-bmac{width:100%;text-align:center}
}