body { margin: 0; background: #F8F9F7; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
  ::selection { background: #7CE3DE; color: #1E1F2A; }
  input::placeholder { color: #A2A7B5; }
  .bk-sponsor-card { background: #FFFFFF; border: 1px solid #E7EAE4; border-radius: 20px; padding: clamp(26px,2.4vw,40px); display: flex; flex-direction: column; gap: 14px; min-height: 240px; transition: transform .3s ease, border-color .3s ease; }
  .bk-sponsor-card:hover { transform: translateY(-4px); border-color: #7CE3DE; }
  .bk-input { font-family: 'Instrument Sans', sans-serif; font-size: 15px; padding: 12px 14px; border: 1px solid #D5D9D2; border-radius: 10px; background: #F8F9F7; color: #1E1F2A; outline: none; transition: border-color .2s ease; width: 100%; box-sizing: border-box; }
  .bk-input:focus { border-color: #7CE3DE; }
  .bk-cta-mint { transition: box-shadow .3s ease; }
  .bk-cta-mint:hover { box-shadow: 0 10px 28px rgba(124,227,222,.45); }
  .bk-supporter-card { background:#F8F9F7;border:1px solid rgba(255,255,255,.9);border-radius:16px;padding:14px 16px;display:flex;align-items:center;gap:12px; }
  .bk-donate-toggle { font-family:'Instrument Sans',sans-serif; font-size:14px; font-weight:600; padding:10px 16px; border-radius:99px; border:1px solid #D5D9D2; background:#F8F9F7; color:#1E1F2A; cursor:pointer; }
  .bk-donate-toggle.is-active { background:#1E1F2A; color:#F8F9F7; border-color:#1E1F2A; }
  .bk-supporter-pill { display:inline-flex;align-items:center;gap:9px;background:#F8F9F7;border:1px solid rgba(255,255,255,.9);border-radius:99px;padding:6px 14px 6px 6px;font-size:clamp(13px,.75vw,17px);color:#1E1F2A; }
  .bk-donor-card { background:#FFFFFF; border:1px solid #E7EAE4; border-radius:16px; padding:14px 16px; display:flex; align-items:center; gap:13px; transition:transform .25s ease, border-color .25s ease, box-shadow .25s ease; }
  .bk-donor-card:hover { transform:translateY(-3px); border-color:#7CE3DE; box-shadow:0 10px 24px rgba(30,31,42,.07); }
  .bk-donor-avatar { width:42px; height:42px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; font-family:'IBM Plex Mono',monospace; font-size:11px; font-weight:600; color:#1E1F2A; flex-shrink:0; overflow:hidden; background:#DCE0D8; box-shadow:inset 0 0 0 1px rgba(30,31,42,.07); }
  .bk-donor-body { min-width:0; flex:1; display:flex; flex-direction:column; gap:5px; }
  .bk-donor-name { margin:0; font-weight:650; font-size:14.5px; line-height:1.25; color:#1E1F2A; text-wrap:pretty; }
  .bk-donor-kind { display:inline-flex; align-self:flex-start; font-family:'IBM Plex Mono',monospace; font-size:10px; letter-spacing:.05em; text-transform:uppercase; color:#6E7484; background:#F1F3EE; border-radius:99px; padding:3px 9px; }
  .bk-donor-amount { font-family:'IBM Plex Mono',monospace; font-size:12px; font-weight:600; color:#12706B; white-space:nowrap; flex-shrink:0; align-self:center; background:#F1FCFB; border:1px solid #D6F5F3; border-radius:99px; padding:5px 11px; }

  /* --- Main sponsor block: responsive two-column card ----------------------
     Was previously an inline `display:grid;grid-template-columns:1.2fr 1fr`
     with no breakpoint at all, so narrow viewports squeezed both the copy
     and the logo box into unreadably thin columns. Below 760px this now
     stacks to a single column, with the logo panel moving to the bottom
     and its divider switching from a left border to a top border. */
  .bk-main-sponsor { display: grid; grid-template-columns: 1.2fr 1fr; }
  .bk-main-sponsor-media { background: #262836; border-left: 1px solid #343648; }
  @media (max-width: 760px) {
    .bk-main-sponsor { grid-template-columns: 1fr; }
    .bk-main-sponsor-media { border-left: none; border-top: 1px solid #343648; min-height: 200px !important; padding: 32px !important; }
  }

/* Perf: header/footer placeholders + font fallbacks */
birkly-header{display:block;min-height:72px}
birkly-footer{display:block;min-height:280px}