.site-promotion-bar,
.promotion-hero-card,
.promotion-badge,
.promotion-detail {
    font-family: var(--promo-body-font, Inter, system-ui, sans-serif);
}

.site-promotion-bar {
    color: var(--promo-text, #fff);
    font-family: var(--promo-body-font, Inter, system-ui, sans-serif);
    font-size: clamp(9px, var(--promo-badge-size, 10px), 16px);
}
.site-promotion-bar small { color: var(--promo-muted, rgba(255,255,255,.72)); }

.promotion-hero-card { color: var(--promo-text, #fff) !important; }
.promotion-hero-card h3 {
    color: var(--promo-text, #fff);
    font-family: var(--promo-heading-font, "Cormorant Garamond", Georgia, serif) !important;
    font-size: clamp(24px, var(--promo-heading-size, 35px), 42px) !important;
}
.promotion-hero-card p { color: var(--promo-muted, #d5ceca) !important; font-size: clamp(12px, var(--promo-body-size, 17px), 24px); }
.promotion-hero-card small,
.promotion-hero-card b { font-family: var(--promo-body-font, Inter, system-ui, sans-serif); font-size: clamp(8px, var(--promo-badge-size, 10px), 18px); }

.promotion-badge { color: var(--promo-text, #fff) !important; font-family: var(--promo-body-font, Inter, system-ui, sans-serif); }
.promotion-badge strong { font-family: var(--promo-heading-font, "Cormorant Garamond", Georgia, serif); }
.promotion-badge span { color: var(--promo-text, #fff); font-size: clamp(8px, var(--promo-badge-size, 10px), 18px); }
.promotion-badge small { color: var(--promo-muted, rgba(255,255,255,.85)); font-size: clamp(8px, var(--promo-badge-size, 10px), 16px); }

.promotion-detail-hero { color: var(--promo-text, #29231c); }
.promotion-detail-hero > .container > span { color: var(--promo-text, var(--promo, #9b1c31)); font-family: var(--promo-body-font, Inter, sans-serif); font-size: clamp(9px, var(--promo-badge-size, 11px), 18px); }
.promotion-detail-hero h1 {
    color: var(--promo-text, #29231c);
    font-family: var(--promo-heading-font, "Cormorant Garamond", Georgia, serif);
    font-size: clamp(38px, var(--promo-heading-size, 72px), 120px);
}
.promotion-detail-hero p,
.promotion-copy { font-family: var(--promo-body-font, Inter, system-ui, sans-serif); font-size: clamp(14px, var(--promo-body-size, 17px), 32px); }
.promotion-detail-hero p { color: var(--promo-muted, #655e55); }
.promotion-detail-hero > .container > div { color: var(--promo-text, #fff); font-family: var(--promo-body-font, Inter, sans-serif); }

@media (max-width: 600px) {
    .promotion-detail-hero h1 { font-size: clamp(36px, 13vw, var(--promo-heading-size, 72px)); }
    .promotion-hero-card h3 { font-size: clamp(24px, 8vw, 36px) !important; }
}