/* Promotions page styles – focused, minimal, and non-duplicative */
.hero-promo {
  padding-block: var(--space-16);
  background: linear-gradient(180deg, color-mix(in srgb, var(--color-primary) 6%, transparent), transparent 60%);
}
.hero-inner { display: grid; grid-template-columns: 1.2fr 1fr; gap: var(--space-8); align-items: center; }
.hero-media { position: relative; min-height: 320px; }
.hero-badge { position: absolute; top: var(--space-4); left: var(--space-4); }
.hero-copy h1 { font-family: "Playfair Display", serif; }
.hero-actions { display: flex; gap: var(--space-3); margin-top: var(--space-4); }

.section-stack { display: grid; gap: var(--space-8); margin-block: var(--space-16); }
.card-inner { padding: var(--space-2) 0; }

/* Countdown appearance */
.countdown { margin-top: var(--space-3); font-weight: 600; }
.countdown::before { content: "Eindigt over "; color: var(--color-muted); font-weight: 400; }

/* Media tweaks for seasonal and collab blocks */
.seasonal-media, .collab-media { min-height: 220px; border: 1px solid var(--color-border); border-radius: var(--radius-md); overflow: hidden; }

/* Referral share row */
.referral-row, .newsletter-cta, .newsletter-row { display: grid; grid-template-columns: 1fr auto; gap: var(--space-3); }

@media (max-width: 960px) {
  .hero-inner { grid-template-columns: 1fr; }
}