/* ════════════════════════════════════════════════════════════════════
   BANNER.CSS — Luxury event popup styles
   ════════════════════════════════════════════════════════════════════ */

/* ── Keyframes ──────────────────────────────────────────────────────── */
@keyframes banner-backdrop-in {
    from { opacity: 0; }
    to   { opacity: 1; }
}
@keyframes banner-card-in {
    from { opacity: 0; transform: translateY(32px) scale(0.96); }
    to   { opacity: 1; transform: translateY(0)    scale(1);    }
}
@keyframes banner-shimmer {
    0%   { transform: translateX(-130%) skewX(-18deg); }
    100% { transform: translateX(230%)  skewX(-18deg); }
}
@keyframes banner-glow-pulse {
    0%, 100% { box-shadow:
        0 32px 80px rgba(44,31,36,0.55),
        0  8px 24px rgba(44,31,36,0.30); }
    50%       { box-shadow:
        0 40px 100px rgba(44,31,36,0.65),
        0 10px  28px rgba(183,110,121,0.25); }
}

/* ── Backdrop ───────────────────────────────────────────────────────── */
#workshop-banner-backdrop {
    position: fixed;
    inset: 0;
    z-index: 2147483646;
    background: rgba(20, 12, 15, 0.72);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    isolation: isolate;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    animation: banner-backdrop-in 0.55s ease forwards;
}
#workshop-banner-backdrop.banner-hiding {
    opacity: 0;
    transition: opacity 0.45s ease;
}

/* ── Card ───────────────────────────────────────────────────────────── */
#workshop-banner-card {
    position: relative;
    background: linear-gradient(160deg, #FAF7F5 0%, #F5EEF0 60%, #FAF7F5 100%);
    border-radius: 22px;
    overflow: hidden;
    max-width: min(900px, 94vw);
    width: 100%;
    display: flex;
    flex-direction: row;
    animation: banner-card-in 0.65s cubic-bezier(0.22,1,0.36,1) forwards;
    animation-delay: 0.1s;
    opacity: 0;
    animation-fill-mode: forwards;

    /* gold top accent */
    border-top: 1px solid rgba(201,169,110,0.55);

    /* shadows */
    animation: banner-card-in 0.65s cubic-bezier(0.22,1,0.36,1) 0.1s both,
               banner-glow-pulse 4s ease-in-out 1s infinite;
}

/* thin gold line along top edge */
#workshop-banner-card::before {
    content: '';
    position: absolute;
    top: 0; left: 10%; right: 10%;
    height: 1px;
    background: linear-gradient(90deg, transparent, #C9A96E, rgba(183,110,121,0.8), #C9A96E, transparent);
    z-index: 2;
    border-radius: 1px;
}

/* ── Media column (left) ────────────────────────────────────────────── */
#workshop-banner-media {
    flex: 0 0 42%;
    min-height: 360px;
    position: relative;
    overflow: hidden;
    border-radius: 22px 0 0 22px;
}
#workshop-banner-media img,
#workshop-banner-media video {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
/* gradient overlay on media for smooth blend into text */
#workshop-banner-media::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(
        to right,
        transparent 60%,
        rgba(245,238,240,0.55) 100%
    );
    z-index: 1;
}

/* ── Text column (right) ─────────────────────────────────────────────── */
#workshop-banner-content {
    flex: 1;
    padding: clamp(28px, 4vw, 52px) clamp(24px, 3.5vw, 48px) clamp(28px, 4vw, 52px) clamp(24px, 3vw, 40px);
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: clamp(10px, 1.5vw, 18px);
    position: relative;
}

/* eyebrow */
#workshop-banner-eyebrow {
    font-family: 'Tenor Sans', Arial, sans-serif;
    font-size: clamp(9px, 0.65vw + 0.3rem, 11.5px);
    letter-spacing: clamp(2.5px, 0.4vw, 4.5px);
    text-transform: uppercase;
    color: #C9A96E;
    display: flex;
    align-items: center;
    gap: 10px;
}
#workshop-banner-eyebrow::before {
    content: '';
    display: inline-block;
    width: clamp(20px, 3vw, 36px);
    height: 1px;
    background: linear-gradient(90deg, #C9A96E, transparent);
    flex-shrink: 0;
}

/* title */
#workshop-banner-title {
    font-family: 'Cormorant Garamond', Georgia, serif;
    font-size: clamp(22px, 3vw + 0.5rem, 38px);
    font-weight: 300;
    color: #2C1F24;
    line-height: 1.2;
    letter-spacing: 0.3px;
    margin: 0;
}

/* subtitle */
#workshop-banner-subtitle {
    font-family: 'Cormorant Garamond', Georgia, serif;
    font-size: clamp(13px, 1.2vw + 0.3rem, 17px);
    font-style: italic;
    font-weight: 300;
    color: #B76E79;
    margin: 0;
    letter-spacing: 0.4px;
}

/* thin gold rule */
#workshop-banner-rule {
    width: clamp(40px, 8vw, 80px);
    height: 1px;
    background: linear-gradient(90deg, #C9A96E, rgba(183,110,121,0.4), transparent);
    flex-shrink: 0;
}

/* body text */
#workshop-banner-body {
    font-family: 'Tenor Sans', Arial, sans-serif;
    font-size: clamp(13px, 0.85vw + 0.4rem, 15.5px);
    line-height: 1.85;
    color: #4a3a3e;
    margin: 0;
}

/* ── CTA Button ──────────────────────────────────────────────────────── */
#workshop-banner-btn {
    display: inline-block;
    position: relative;
    overflow: hidden;
    align-self: flex-start;
    background: linear-gradient(135deg, #B76E79 0%, #8B4E58 100%);
    color: #FFFFFF;
    border: none;
    border-radius: clamp(8px, 1.2vw, 14px);
    padding: clamp(13px, 1.3vw, 18px) clamp(26px, 3vw, 44px);
    font-family: 'Tenor Sans', Arial, sans-serif;
    font-size: clamp(10px, 0.7vw + 0.35rem, 13px);
    letter-spacing: clamp(2px, 0.3vw, 3.5px);
    text-transform: uppercase;
    cursor: pointer;
    text-decoration: none;
    box-shadow:
        0 8px 28px rgba(183,110,121,0.42),
        0 2px  8px rgba(44,31,36,0.18),
        inset 0 1px 0 rgba(255,255,255,0.15);
    transition: box-shadow 0.35s ease, transform 0.25s ease, background 0.35s ease;
    margin-top: clamp(4px, 0.6vw, 8px);
}
#workshop-banner-btn::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(201,169,110,0.7), transparent);
    z-index: 2;
}
#workshop-banner-btn::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(
        110deg,
        transparent 30%,
        rgba(255,255,255,0.22) 50%,
        transparent 70%
    );
    transform: translateX(-130%) skewX(-18deg);
    z-index: 3;
    pointer-events: none;
}
#workshop-banner-btn:hover::after {
    animation: banner-shimmer 0.6s ease forwards;
}
#workshop-banner-btn:hover {
    background: linear-gradient(135deg, #8B4E58 0%, #B76E79 100%);
    box-shadow:
        0 14px 40px rgba(183,110,121,0.52),
        0  4px 14px rgba(44,31,36,0.22),
        inset 0 1px 0 rgba(255,255,255,0.18);
    transform: translateY(-2px);
}

/* ── Close button (×) ────────────────────────────────────────────────── */
#workshop-banner-close-x {
    position: absolute;
    top: clamp(12px, 1.5vw, 20px);
    right: clamp(12px, 1.5vw, 20px);
    z-index: 10;
    width: clamp(28px, 3vw, 36px);
    height: clamp(28px, 3vw, 36px);
    border: 1px solid rgba(183,110,121,0.35);
    border-radius: 50%;
    background: rgba(250,247,245,0.88);
    color: #7A6065;
    font-size: clamp(14px, 1.4vw, 18px);
    line-height: 1;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.25s, color 0.25s, border-color 0.25s, transform 0.25s;
    backdrop-filter: blur(4px);
}
#workshop-banner-close-x:hover {
    background: #B76E79;
    color: #FFFFFF;
    border-color: #B76E79;
    transform: rotate(90deg);
}

/* ── Close text link ─────────────────────────────────────────────────── */
#workshop-banner-close-link {
    font-family: 'Tenor Sans', Arial, sans-serif;
    font-size: clamp(10px, 0.65vw + 0.3rem, 12px);
    letter-spacing: clamp(1px, 0.2vw, 2px);
    color: #7A6065;
    cursor: pointer;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border: none;
    background: none;
    padding: 0;
    transition: color 0.25s;
    align-self: flex-start;
}
#workshop-banner-close-link:hover { color: #B76E79; }

/* ── No media: full-width single column ──────────────────────────────── */
#workshop-banner-card.no-media {
    flex-direction: column;
    max-width: min(560px, 94vw);
}
#workshop-banner-card.no-media #workshop-banner-content {
    padding: clamp(36px, 5vw, 60px) clamp(28px, 4vw, 52px);
}

/* ── Mobile: stack vertically ────────────────────────────────────────── */
@media (max-width: 640px) {
    #workshop-banner-card {
        flex-direction: column;
        max-width: 96vw;
        border-radius: 16px;
    }
    #workshop-banner-media {
        flex: 0 0 auto;
        min-height: 200px;
        max-height: 240px;
        border-radius: 16px 16px 0 0;
    }
    #workshop-banner-media::after {
        background: linear-gradient(
            to bottom,
            transparent 50%,
            rgba(245,238,240,0.55) 100%
        );
    }
    #workshop-banner-content {
        padding: 24px 22px 28px;
    }
    #workshop-banner-btn {
        align-self: stretch;
        text-align: center;
    }
}

/* ════════════════════════════════════════════════════════════════════
   FLOATING WORKSHOP BUTTON
   Mirrors the #floatingRDV luxury style but positioned bottom-left
   and uses gold/dark as its base (distinct from the rose RDV button).
   ════════════════════════════════════════════════════════════════════ */
@keyframes workshop-float-enter {
    from { opacity: 0; transform: translateY(28px) scale(0.92); }
    to   { opacity: 1; transform: translateY(0)    scale(1);    }
}
@keyframes workshop-glow-pulse {
    0%, 100% { box-shadow:
        0 12px 36px rgba(44,31,36,0.50),
        0  4px 14px rgba(201,169,110,0.22); }
    50%       { box-shadow:
        0 18px 52px rgba(44,31,36,0.60),
        0  6px 20px rgba(201,169,110,0.42); }
}

#floatingWorkshop {
    position: fixed;
    bottom: clamp(20px, 3vw, 40px);
    left:   clamp(20px, 3vw, 40px);   /* left side — mirrors RDV on the right */
    z-index: 9998;
    border: none;
    outline: none;
    border-radius: clamp(10px, 1.4vw, 18px);
    padding: 0;
    cursor: pointer;
    overflow: hidden;
    display: block;
    width: auto;
    opacity: 0;
    pointer-events: none;
    transform: translateY(28px) scale(0.92);
    transition: opacity 0.5s cubic-bezier(0.22,1,0.36,1),
                transform 0.5s cubic-bezier(0.22,1,0.36,1),
                box-shadow 0.4s ease;
    animation: workshop-glow-pulse 3.6s ease-in-out infinite paused;
    box-shadow:
        0 12px 36px rgba(44,31,36,0.50),
        0  4px 14px rgba(201,169,110,0.22),
        inset 0 1px 0 rgba(255,255,255,0.06);
    text-decoration: none;
}
#floatingWorkshop.visible {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0) scale(1);
    animation-play-state: running;
}

/* gold top-edge line */
#floatingWorkshop::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 2px;
    background: linear-gradient(90deg, transparent, #C9A96E, #B76E79, #C9A96E, transparent);
    z-index: 2;
}
/* shimmer sweep */
#floatingWorkshop::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(
        105deg,
        transparent 35%,
        rgba(255,255,255,0.16) 50%,
        transparent 65%
    );
    transform: translateX(-120%) skewX(-18deg);
    z-index: 3;
    pointer-events: none;
}
#floatingWorkshop:hover::after {
    animation: banner-shimmer 0.65s ease forwards;
}

/* inner wrapper — gold-dark gradient (distinct from rose RDV) */
.workshop-float-inner {
    position: relative;
    z-index: 4;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: clamp(3px, 0.4vw, 6px);
    background: linear-gradient(135deg, #2C1F24 0%, #3a2a1e 40%, #2C1F24 100%);
    padding: clamp(13px, 1.6vw, 22px) clamp(20px, 2.6vw, 42px);
    border-radius: clamp(10px, 1.4vw, 18px);
    transition: background 0.35s ease;
}
#floatingWorkshop:hover .workshop-float-inner {
    background: linear-gradient(135deg, #8B6914 0%, #C9A96E 50%, #8B6914 100%);
}

/* micro-label */
.workshop-float-label {
    font-family: 'Tenor Sans', Arial, sans-serif;
    font-size: clamp(8px, 0.55vw + 0.22rem, 10px);
    letter-spacing: clamp(2.5px, 0.38vw, 4.5px);
    text-transform: uppercase;
    color: #C9A96E;
    opacity: 0.9;
    line-height: 1;
    transition: color 0.35s, opacity 0.35s;
}
#floatingWorkshop:hover .workshop-float-label {
    color: rgba(255,255,255,0.75);
}

/* main text */
.workshop-float-text {
    font-family: 'Tenor Sans', Arial, sans-serif;
    font-size: clamp(10px, 0.75vw + 0.35rem, 13px);
    letter-spacing: clamp(2px, 0.3vw, 3.5px);
    text-transform: uppercase;
    color: #FAF7F5;
    line-height: 1;
    display: flex;
    align-items: center;
    gap: clamp(6px, 0.8vw, 10px);
    transition: color 0.35s;
}
#floatingWorkshop:hover .workshop-float-text { color: #2C1F24; }
.workshop-float-text i {
    color: #C9A96E;
    font-size: clamp(11px, 1vw + 0.15rem, 14px);
    transition: color 0.35s, transform 0.35s;
}
#floatingWorkshop:hover .workshop-float-text i {
    color: #2C1F24;
    transform: scale(1.15) rotate(-8deg);
}

/* gold rule */
.workshop-float-rule {
    width: 40%;
    height: 1px;
    background: linear-gradient(90deg, transparent, #C9A96E, transparent);
    margin-top: clamp(3px, 0.4vw, 6px);
    transition: width 0.4s ease;
}
#floatingWorkshop:hover .workshop-float-rule { width: 80%; }

/* Mobile: tuck it in a bit */
@media (max-width: 600px) {
    #floatingWorkshop { bottom: 16px; left: 16px; }
}

/* ════════════════════════════════════════════════════════════════════
   ANNOUNCEMENT BAR  (mode "bar")
   Attention-catching luxury top ribbon.
   A single click opens the full popup modal.
   ════════════════════════════════════════════════════════════════════ */
@keyframes bar-slide-down {
    from { opacity: 0; transform: translateY(-100%); }
    to   { opacity: 1; transform: translateY(0); }
}
/* Continuous slow shimmer sweep — runs on loop, always on */
@keyframes bar-shimmer-loop {
    0%   { transform: translateX(-180%) skewX(-18deg); }
    100% { transform: translateX(280%)  skewX(-18deg); }
}
/* Dot: ring-pulse ripple */
@keyframes bar-dot-ripple {
    0%   { box-shadow: 0 0 0 0   rgba(183,110,121,0.75); opacity: 1; }
    70%  { box-shadow: 0 0 0 7px rgba(183,110,121,0);    opacity: 0.8; }
    100% { box-shadow: 0 0 0 0   rgba(183,110,121,0);    opacity: 1; }
}
/* NEW badge pop */
@keyframes bar-badge-pop {
    0%   { transform: scale(0.7);  opacity: 0; }
    65%  { transform: scale(1.12); opacity: 1; }
    100% { transform: scale(1);    opacity: 1; }
}

#announcement-bar {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 100001;
    height: clamp(44px, 4vw, 56px);
    cursor: pointer;

    /* Rich rose-to-gold warm gradient — unmissable */
    background: linear-gradient(
        100deg,
        #5c1e28 0%,
        #8B4E58 22%,
        #B76E79 44%,
        #c9936b 62%,
        #C9A96E 78%,
        #8B4E58 92%,
        #5c1e28 100%
    );
    background-size: 200% 100%;

    /* Gold bottom border */
    border-bottom: 1px solid rgba(201,169,110,0.55);

    display: flex;
    align-items: center;
    justify-content: center;
    gap: clamp(8px, 1.6vw, 22px);

    animation: bar-slide-down 0.65s cubic-bezier(0.22,1,0.36,1) forwards;
    overflow: hidden;

    transition: filter 0.35s ease, box-shadow 0.35s ease;
    box-shadow:
        0 3px 22px rgba(139,78,88,0.55),
        0 1px  8px rgba(44,31,36,0.35);
}

/* Continuous shimmer sweep — subtle but alive */
#announcement-bar::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(
        105deg,
        transparent 25%,
        rgba(255,255,255,0.18) 50%,
        transparent 75%
    );
    animation: bar-shimmer-loop 3.2s ease-in-out infinite;
    z-index: 3;
    pointer-events: none;
}

/* Bottom edge glow line */
#announcement-bar::before {
    content: '';
    position: absolute;
    bottom: 0; left: 0; right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent 0%, rgba(255,255,255,0.35) 30%, rgba(201,169,110,0.7) 50%, rgba(255,255,255,0.35) 70%, transparent 100%);
    z-index: 2;
}

#announcement-bar:hover {
    filter: brightness(1.1) saturate(1.12);
    box-shadow:
        0 5px 32px rgba(139,78,88,0.70),
        0 2px 12px rgba(44,31,36,0.40);
}

/* ── "NEW" badge ── */
#announcement-bar .ann-badge {
    font-family: 'Tenor Sans', Arial, sans-serif;
    font-size: clamp(7px, 0.42vw + 0.18rem, 9px);
    letter-spacing: 2px;
    text-transform: uppercase;
    color: #2C1F24;
    background: #C9A96E;
    border-radius: 3px;
    padding: 3px 7px 2px;
    line-height: 1;
    flex-shrink: 0;
    position: relative;
    z-index: 4;
    font-weight: 600;
    animation: bar-badge-pop 0.55s cubic-bezier(0.22,1,0.36,1) 0.8s both;
}

/* ── Left / right decorative rules ── */
#announcement-bar .ann-rule {
    width: clamp(20px, 3vw, 44px);
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.55));
    flex-shrink: 0;
}
#announcement-bar .ann-rule-right {
    width: clamp(20px, 3vw, 44px);
    height: 1px;
    background: linear-gradient(90deg, rgba(255,255,255,0.55), transparent);
    flex-shrink: 0;
}

/* ── Pulsing live dot (ripple ring) ── */
#announcement-bar .ann-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #FAF7F5;
    flex-shrink: 0;
    position: relative;
    z-index: 4;
    animation: bar-dot-ripple 1.8s ease-out infinite;
}

/* ── Eyebrow label ── */
#announcement-bar .ann-eyebrow {
    font-family: 'Tenor Sans', Arial, sans-serif;
    font-size: clamp(8px, 0.5vw + 0.2rem, 10.5px);
    letter-spacing: clamp(2.5px, 0.4vw, 4px);
    text-transform: uppercase;
    color: rgba(255,255,255,0.72);
    flex-shrink: 0;
    line-height: 1;
    position: relative;
    z-index: 4;
}

/* ── Separator dot ── */
#announcement-bar .ann-sep {
    width: 3px;
    height: 3px;
    border-radius: 50%;
    background: rgba(255,255,255,0.45);
    flex-shrink: 0;
}

/* ── Main title ── */
#announcement-bar .ann-title {
    font-family: 'Cormorant Garamond', Georgia, serif;
    font-size: clamp(15px, 1.3vw + 0.25rem, 20px);
    font-weight: 400;
    font-style: italic;
    letter-spacing: 0.4px;
    color: #FFFFFF;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1;
    position: relative;
    z-index: 4;
    text-shadow: 0 1px 8px rgba(44,31,36,0.35);
    transition: letter-spacing 0.3s ease;
}
#announcement-bar:hover .ann-title {
    letter-spacing: 0.7px;
}

/* ── Subtitle / date ── */
#announcement-bar .ann-subtitle {
    font-family: 'Tenor Sans', Arial, sans-serif;
    font-size: clamp(8.5px, 0.5vw + 0.2rem, 11px);
    letter-spacing: clamp(1.5px, 0.25vw, 2.5px);
    text-transform: uppercase;
    color: rgba(255,255,255,0.62);
    flex-shrink: 0;
    white-space: nowrap;
    line-height: 1;
    position: relative;
    z-index: 4;
    transition: color 0.3s ease;
}
#announcement-bar:hover .ann-subtitle {
    color: rgba(255,255,255,0.88);
}

/* ── "Découvrir →" CTA pill ── */
#announcement-bar .ann-cta {
    font-family: 'Tenor Sans', Arial, sans-serif;
    font-size: clamp(8.5px, 0.48vw + 0.22rem, 11px);
    letter-spacing: clamp(1.5px, 0.28vw, 3px);
    text-transform: uppercase;
    color: #2C1F24;
    background: rgba(255,255,255,0.88);
    flex-shrink: 0;
    border: none;
    border-radius: 20px;
    padding: clamp(4px,0.4vw,6px) clamp(10px,1.2vw,18px);
    line-height: 1;
    position: relative;
    z-index: 4;
    font-weight: 600;
    transition: background 0.3s ease, color 0.3s ease, transform 0.25s ease,
                box-shadow 0.3s ease;
    white-space: nowrap;
    box-shadow: 0 2px 8px rgba(44,31,36,0.20);
}
#announcement-bar:hover .ann-cta {
    background: #FFFFFF;
    color: #8B4E58;
    transform: scale(1.04);
    box-shadow: 0 4px 14px rgba(44,31,36,0.28);
}

/* ── Hiding state (fade-up) ── */
#announcement-bar.bar-hiding {
    opacity: 0;
    transform: translateY(-100%);
    transition: opacity 0.4s ease, transform 0.4s ease;
    pointer-events: none;
}

/* ── Push page content down so it's not covered by the bar + fixed header ── */
/* (body padding-top is set dynamically by the scroll-hide JS in each page) */

/* ── When bar is active, header sits below it ── */
body.has-announcement-bar .site-header {
    top: clamp(44px, 4vw, 56px);
}

/* ── Compact header: mid-page scroll-up shows nav pill only ── */
.site-header.header-compact {
    background: transparent;
    border-bottom-color: transparent;
    box-shadow: none;
    padding-top: clamp(6px, 0.8vw, 10px);
    padding-bottom: clamp(6px, 0.8vw, 10px);
    pointer-events: none;
}

/* ── Mobile burger: slide-up when scrolling down mid-page ── */
@media screen and (max-width: 760px) {
    #navWrap {
        transition: transform 0.38s cubic-bezier(0.22,1,0.36,1);
    }
    #navWrap.nav-scroll-hidden {
        transform: translateY(calc(-100vh));
        pointer-events: none;
    }
}
.site-header .logo-area,
.site-header .logo-tagline {
    transition: opacity 0.32s ease, max-height 0.32s ease, margin 0.32s ease;
}
.site-header.header-compact .logo-area,
.site-header.header-compact .logo-tagline {
    opacity: 0;
    max-height: 0;
    overflow: hidden;
    margin: 0;
    padding: 0;
    pointer-events: none;
}
.site-header.header-compact .nav-wrap {
    margin-top: 0;
    pointer-events: auto;
}

/* ── Mobile: keep only dot + title + CTA ── */
@media (max-width: 600px) {
    #announcement-bar .ann-rule,
    #announcement-bar .ann-rule-right,
    #announcement-bar .ann-subtitle,
    #announcement-bar .ann-eyebrow,
    #announcement-bar .ann-badge {
        display: none;
    }
    #announcement-bar .ann-cta {
        font-size: 9px;
        padding: 4px 10px;
    }
}