/* ---- Hero promo card (admin → Hero Promo) ---- */
.hero-promo-card {
    --hpc-scale: 1;
    position: relative; z-index: 3; margin: 0 0 48px; max-width: calc(300px * var(--hpc-scale));
    border-radius: 20px; padding: calc(22px * var(--hpc-scale)) calc(24px * var(--hpc-scale));
    box-shadow: 0 10px 30px rgba(0,0,0,.25);
}
.hero-promo-card--brand { background: linear-gradient(135deg, var(--brand), #3b74d6); }
.hero-promo-card--gold  { background: linear-gradient(135deg, #f59f00, #ffd43b); }
.hero-promo-card--teal  { background: linear-gradient(135deg, #0ca678, #38d9a9); }
.hero-promo-card--coral { background: linear-gradient(135deg, #ff9a56, #ff6b8b); }
.hpc-ribbon {
    position: absolute; top: -10px; left: 20px; background: #ffd23f; color: #7a4a00;
    font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em;
    padding: 4px 12px; border-radius: 999px; box-shadow: 0 3px 8px rgba(0,0,0,.2); transform: rotate(-4deg);
}
.hpc-icon { font-size: calc(30px * var(--hpc-scale)); margin-bottom: 6px; }
.hpc-image-link { display: block; margin: 0 0 14px; }
.hpc-image { width: 100%; max-height: calc(150px * var(--hpc-scale)); object-fit: cover; border-radius: 12px; display: block; box-sizing: border-box; border: var(--hpc-stroke-w, 0px) solid var(--hpc-stroke-c, #fff); }
.hero-promo-card h3 { font-size: calc(1.3rem * var(--hpc-scale)); font-weight: 800; color: #fff; margin: 0 0 6px; line-height: 1.2; }
.hero-promo-card p { font-size: calc(13.5px * var(--hpc-scale)); color: rgba(255,255,255,.92); line-height: 1.5; margin: 0 0 16px; }
.hpc-btn {
    display: inline-flex; align-items: center; background: #fff; text-decoration: none;
    font-size: calc(14px * var(--hpc-scale)); font-weight: 800;
    padding: calc(10px * var(--hpc-scale)) calc(20px * var(--hpc-scale)); border-radius: 999px;
    transition: transform .15s, box-shadow .15s;
}
.hpc-btn:hover { transform: translateY(-2px); box-shadow: 0 6px 16px rgba(0,0,0,.2); text-decoration: none; }
.hero-promo-card--brand .hpc-btn { color: var(--brand); }
.hero-promo-card--gold .hpc-btn  { color: #e8590c; }
.hero-promo-card--teal .hpc-btn  { color: #0ca678; }
.hero-promo-card--coral .hpc-btn { color: #ff6b8b; }
.hero-promo-card--image-only { padding: 0; background: none; box-shadow: none; max-width: calc(260px * var(--hpc-scale)); }
.hero-promo-card--image-only .hpc-image-solo {
    border-radius: 20px; box-shadow: 0 10px 30px rgba(0,0,0,.25); max-height: calc(220px * var(--hpc-scale)); width: auto; max-width: 100%;
}
/* Wide screens: float it on the side of the hero opposite the text; narrow screens: stacked under the text. */
@media (min-width: 992px) {
    .hero-promo-card { position: absolute; top: 50%; right: 48px; margin: 0; transform: translateY(-50%); }
    .hero-pos-right .hero-promo-card { right: auto; left: 48px; }
}
@media (min-width: 992px) {
    .hero-pos-center .hero-promo-card { position: relative; top: auto; right: auto; transform: none; margin: 0 auto 48px; }
}