/* ════════════════════════════════════════════════════════════════════════
   ONO OS · Molecule · niceds-donate
   Atomic donate-section · auto-inject vor <footer> via .js
   BEM: .niceds-donate__{logo,eyebrow,h,lead,cta,btn}
   Variants: .niceds-donate--compact (kleinerer headline)
   Tokens (per-page über style="--nd-*: …" überschreibbar):
     --nd-bg-from   Top-Gradient-Color (default: var(--bg))
     --nd-bg-to     Bottom-Gradient-Color (default: var(--bg-tile))
     --nd-accent    CTA-Brand-Color (default: var(--orange) #FD9501)
     --nd-fg        Text-Color (default: var(--fg))
     --nd-fg-muted  Muted-Text (default: var(--fg-muted))
     --nd-line      Border (default: var(--line))
     --nd-max-w     Inner-Max-Width (default: 760px)
     --nd-pad-y     Vertikales Padding (default: 96px)
   Opt-out per page: <body data-donate-section="off">
   ════════════════════════════════════════════════════════════════════════ */
.niceds-donate {
  --nd-bg-from: var(--bg, #FAFAF6);
  --nd-bg-to: var(--bg-tile, #F0EDE5);
  --nd-accent: var(--orange, #FD9501);
  --nd-fg: var(--fg, #1A1A1A);
  --nd-fg-muted: var(--fg, #1A1A1A);
  --nd-line: var(--line, #DDD9D2);
  --nd-max-w: 760px;
  --nd-pad-y: 96px;

  padding: var(--nd-pad-y) 24px;
  background: linear-gradient(180deg, var(--nd-bg-from) 0%, var(--nd-bg-to) 100%);
  border-top: 1px solid var(--nd-line);
  text-align: center;
  color: var(--nd-fg);
  font-family: 'Haffer', -apple-system, BlinkMacSystemFont, Inter, system-ui, sans-serif;
  font-feature-settings: 'kern' 1, 'liga' 1, 'calt' 1, 'ss01' 1, 'ss03' 1, 'ss04' 1, 'ss05' 1, 'tnum' 1, 'zero' 1;
}
@media (prefers-color-scheme: dark) {
  .niceds-donate {
    --nd-bg-from: #0E0E10;
    --nd-bg-to: #1F1F23;
    --nd-fg: #FAFAF6;
    --nd-fg-muted: #FAFAF6;
    --nd-line: #2A2A2E;
  }
}

.niceds-donate__inner { max-width: var(--nd-max-w); margin: 0 auto }

.niceds-donate__logo {
  display: block;
  width: 80px; height: 80px;
  margin: 0 auto 24px;
  animation: niceds-donate-spin 14s linear infinite;
}
@keyframes niceds-donate-spin { to { transform: rotate(360deg) } }
@media (prefers-reduced-motion: reduce) {
  .niceds-donate__logo { animation: none }
}

.niceds-donate__eyebrow {
  display: inline-block;
  background: var(--nd-bg-to);
  color: var(--nd-fg);
  font-size: 13px; font-weight: 618;
  padding: 6px 14px;
  border-radius: 999px;
  border: 1px solid var(--nd-line);
  margin: 0 0 24px;
  text-transform: lowercase;
  font-feature-settings: inherit;
}

.niceds-donate__h {
  font-size: clamp(28px, 4vw, 48px);
  font-weight: 618;
  letter-spacing: -.025em;
  line-height: 1.1;
  margin: 0 0 24px;
  text-transform: lowercase;
  color: var(--nd-fg);
  font-feature-settings: inherit;
}
.niceds-donate--compact .niceds-donate__h {
  font-size: clamp(22px, 3vw, 36px);
}

.niceds-donate__lead {
  font-size: 18px;
  color: var(--nd-fg-muted);
  margin: 0 auto 40px;
  max-width: 600px;
  line-height: 1.55;
  text-transform: lowercase;
  font-feature-settings: inherit;
}

.niceds-donate__cta {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  justify-content: center;
}

.niceds-donate__btn {
  display: inline-block;
  padding: 14px 26px;
  background: var(--nd-accent);
  color: #fff;
  border-radius: 999px;
  corner-shape: superellipse;
  -webkit-corner-shape: superellipse;
  font-size: 14px; font-weight: 618;
  text-transform: lowercase;
  text-decoration: none;
  font-feature-settings: inherit;
  transition: background .18s ease, color .18s ease, border-color .18s ease, transform .18s ease;
  font-family: inherit;
  border: 1px solid var(--nd-accent);
  cursor: pointer;
}
.niceds-donate__btn:hover {
  background: var(--btn-hover-bg, #000);
  color: var(--btn-hover-fg, #fff);
  border-color: var(--btn-hover-border, #000);
  transform: translateY(-1px);
}

@media (max-width: 540px) {
  .niceds-donate { padding: 64px 20px }
}
