/* Geschenk-Baustein auf Stuhl-Seiten (Astro, Farben --color-kl-*), 14.10.2026.
   Der Baustein ist für die Premium-Seiten gebaut; hier bekommt er deren Größen aus den Farben des Ladens. */
:root {
  --gold: var(--color-kl-gold); --gold-hell: var(--color-kl-gold-l); --gold-tief: var(--color-kl-wood);
  --text: var(--color-kl-cream); --leise: var(--color-kl-muted);
  --linie: rgba(255, 255, 255, .1); --linie-stark: rgba(255, 255, 255, .22);
  --bg: var(--color-kl-black); --bg-2: var(--color-kl-coal); --bg-3: var(--color-kl-card);
  --schrift-text: var(--font-body, Inter, system-ui, sans-serif); --schrift-titel: var(--font-display, Georgia, serif);
  --schatten: 0 24px 70px rgba(0, 0, 0, .55);
}
.rv .wrap { max-width: 1180px; margin: 0 auto; padding: 0 20px; }
.rv .btn, .rf .btn, .rn .btn { position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 50px; padding: 0 24px;
  border-radius: 999px; font-family: var(--schrift-text); font-weight: 700; font-size: 14px; letter-spacing: .04em; text-decoration: none; cursor: pointer;
  border: 0; background: none; transition: transform .3s, box-shadow .3s, border-color .3s, color .3s; overflow: hidden; }
.rv .btn--gold, .rf .btn--gold, .rn .btn--gold { background: linear-gradient(180deg, var(--gold-hell), var(--gold) 60%); color: var(--color-kl-onacc, #120d06); box-shadow: 0 10px 30px rgba(0, 0, 0, .3); }
.rv .btn--rand, .rf .btn--rand, .rn .btn--rand { border: 1px solid var(--linie-stark); color: var(--text); }
.rv .btn--rand:hover, .rf .btn--rand:hover, .rn .btn--rand:hover { border-color: var(--gold); color: var(--gold-hell); }
