/* ============================================================
   CANONICAL CONCIERGE CTA BACKGROUND (sitewide)
   ------------------------------------------------------------
   Any section inviting the user to call/book/contact the concierge
   uses the concierge image as a soft-smoke background.

   Apply by adding `.concierge-bg` to any container that wants
   the canonical look. Inline style sets the image:
     style="--concierge-bg: url('<?= img('concierge_banner') ?>');"

   The class layers:
     - blurred concierge image (atmosphere)
     - left-heavy linear scrim (text legibility)
     - soft warm-gold radial highlight at 80% center
   ============================================================ */

.concierge-bg {
    position: relative;
    overflow: hidden;
    isolation: isolate;
    background: #030303;
}

.concierge-bg::before {
    content: '';
    position: absolute; inset: -20px;
    background-image: var(--concierge-bg, none);
    background-size: cover;
    background-position: 70% center;
    filter: blur(1.5px) brightness(0.78) saturate(1.05);
    z-index: -2;
}

.concierge-bg::after {
    content: '';
    position: absolute; inset: 0;
    background:
        linear-gradient(90deg,
            rgba(3,3,3,0.78) 0%,
            rgba(3,3,3,0.50) 28%,
            rgba(3,3,3,0.15) 60%,
            rgba(3,3,3,0)    100%),
        radial-gradient(ellipse at 80% 50%, rgba(212,175,55,0.06), transparent 60%);
    pointer-events: none;
    z-index: -1;
}

.concierge-bg > * { position: relative; z-index: 1; }

/* Centred variant — for sections where copy is centred and we want
   a symmetric vignette instead of a left-heavy one. */
.concierge-bg--centred::after {
    background:
        radial-gradient(ellipse at 50% 60%, rgba(3,3,3,0.30) 0%, rgba(3,3,3,0.78) 75%),
        radial-gradient(ellipse at 80% 50%, rgba(212,175,55,0.06), transparent 60%);
}

/* Text helpers for content sitting on the smoke layer */
.concierge-bg .concierge-h2 {
    text-shadow: 0 2px 16px rgba(0,0,0,0.85), 0 1px 4px rgba(0,0,0,0.9);
}
.concierge-bg .concierge-lede {
    color: #fff;
    text-shadow: 0 1px 6px rgba(0,0,0,0.85);
}