/* ==================================================================
 * Booking Modal Template — Question of the Moment
 * Direct port of V129 from booking-modal-concepts-v26.html.
 * Selectors scoped under #rvbt-bm-qm-root for (1,0,0) specificity.
 * ================================================================== */

#rvbt-bm-qm-root {
    /* Local design tokens (mirror V26 :root tokens) */
    --cream: #F5F2F0;
    --cream-deep: #EFEAE5;
    --ivory: #FBF8F4;
    --paper: #FFFFFF;
    --sage: #7E8B7A;
    --sage-soft: #B7C0B1;
    --sage-mist: #E5EAE0;
    --gold: #B0925E;
    --gold-soft: #D4BC8E;
    --gold-mist: #EFE6D3;
    --ink: #1A1410;
    --ink-soft: #3A332C;
    --mute: #7A6F63;
    --mute-soft: #A89E92;
    --line: #E5DED5;
    --line-soft: #EFEAE0;
    --shadow-sm: 0 2px 8px rgba(26, 20, 16, 0.04);
    --shadow-md: 0 6px 24px rgba(26, 20, 16, 0.06);
    --shadow-lg: 0 18px 60px rgba(26, 20, 16, 0.08);
    --shadow-xl: 0 32px 96px rgba(26, 20, 16, 0.10);
    --r-sm: 6px;
    --r-md: 10px;
    --r-lg: 16px;
    --r-xl: 24px;

    /* V129 root: radial cream gradient, full-viewport canvas */
    background: radial-gradient(ellipse at center, var(--ivory) 0%, var(--cream-deep) 100%);
    min-height: 100vh;
    position: relative;
    box-sizing: border-box;
    font-family: 'Inter RVBT', 'Inter', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
    /* Explicit line-height — host body may set 1.6+, which inflates
       chip / picker heights. V129 source uses 1.6 on body but tight
       line-heights on individual components. Set our root to a neutral
       1.4 and override specific components below. */
    line-height: 1.4;
    color: var(--ink);
    -webkit-font-smoothing: antialiased;
    overflow: hidden;
}

#rvbt-bm-qm-root *,
#rvbt-bm-qm-root *::before,
#rvbt-bm-qm-root *::after {
    box-sizing: border-box;
}

/* Frame fills the canvas — center column with chips/question/pickers/foot.
   bottom padding reserved for the position:fixed .qm-foot bar. */
#rvbt-bm-qm-root .qm-frame {
    position: absolute;
    inset: 0;
    padding: 104px 32px 140px 32px;
    display: flex;
    flex-direction: column;
    align-items: center;
}

/* Park corner (top-left signature) */
#rvbt-bm-qm-root .qm-park-corner {
    position: absolute;
    top: 80px;
    left: 38px;
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 13px;
    color: var(--mute);
    letter-spacing: 0.18em;
    text-transform: uppercase;
}

/* 5-dot wizard progress */
#rvbt-bm-qm-root .qm-dots {
    display: flex;
    gap: 10px;
    margin-bottom: 18px;
}

#rvbt-bm-qm-root .qm-dots .d {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--mute-soft);
    transition: all 0.2s ease;
}

#rvbt-bm-qm-root .qm-dots .d.done {
    background: var(--sage);
    width: 24px;
    border-radius: 4px;
}

#rvbt-bm-qm-root .qm-dots .d.active {
    background: var(--gold);
    width: 32px;
    border-radius: 4px;
    box-shadow: 0 0 0 5px var(--gold-mist);
}

/* Subhead under dots */
#rvbt-bm-qm-root .qm-park {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 14px;
    color: var(--mute);
    letter-spacing: 0.18em;
    text-transform: uppercase;
    margin-bottom: 24px;
}

/* Chips row */
#rvbt-bm-qm-root .qm-chips {
    display: flex;
    gap: 10px;
    margin-bottom: 36px;
    flex-wrap: wrap;
    justify-content: center;
    max-width: 760px;
}

#rvbt-bm-qm-root .qm-chip {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 14px;
    border-radius: 999px;
    background: var(--paper);
    border: 1px solid var(--line-soft);
    font-size: 11px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--ink-soft);
    font-weight: 600;
    box-shadow: var(--shadow-sm);
    line-height: 1;
    white-space: nowrap;
}

#rvbt-bm-qm-root .qm-chip .ck {
    width: 14px;
    height: 14px;
    font-size: 9px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: var(--sage);
    color: var(--ivory);
    line-height: 1;
    flex-shrink: 0;
}

#rvbt-bm-qm-root .qm-chip [data-bm-adults-value],
#rvbt-bm-qm-root .qm-chip [data-bm-children-value],
#rvbt-bm-qm-root .qm-chip [data-bm-pets-value] {
    /* Inline counters — keep them flowing with the chip text */
    display: inline;
}

#rvbt-bm-qm-root .qm-chip.muted {
    background: transparent;
    border-style: dashed;
    color: var(--mute-soft);
    box-shadow: none;
}

/* Hero question */
#rvbt-bm-qm-root .qm-q {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 88px;
    line-height: 1.02;
    color: var(--ink);
    text-align: center;
    letter-spacing: -0.018em;
    margin: 0 0 8px;
    max-width: 1000px;
    font-weight: 400;
    /* Higher stacking order + page-bg fill so the ymap visually
       slides UNDER this heading when the date picker animates in. */
    position: relative;
    z-index: 5;
    background: var(--cream);
    padding: 6px 24px;
}

#rvbt-bm-qm-root .qm-q em {
    font-style: italic;
    color: var(--gold);
}

#rvbt-bm-qm-root .qm-sub {
    font-size: 13.5px;
    color: var(--mute);
    text-align: center;
    margin: 0 0 32px;
    letter-spacing: 0.04em;
}

/* Stay-type tabs (pill toggle) */
#rvbt-bm-qm-root .qm-tabs {
    display: inline-flex;
    background: var(--paper);
    border-radius: 999px;
    padding: 5px;
    gap: 2px;
    box-shadow: var(--shadow-sm);
    margin-bottom: 24px;
    border: 1px solid var(--line-soft);
}

#rvbt-bm-qm-root .qm-tabs .t {
    padding: 8px 18px;
    border-radius: 999px;
    font-size: 10.5px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    font-weight: 600;
    color: var(--mute);
    cursor: pointer;
    border: none;
    background: transparent;
    font-family: 'Inter RVBT', 'Inter', sans-serif;
    line-height: 1;
}

#rvbt-bm-qm-root .qm-tabs .t.active {
    background: var(--ink);
    color: var(--ivory);
}

/* Big date pickers — arrive | arrow | depart | nights */
#rvbt-bm-qm-root .qm-pickers {
    display: flex;
    align-items: stretch;
    gap: 14px;
    background: var(--paper);
    border: 1px solid var(--line-soft);
    border-radius: var(--r-xl);
    padding: 18px;
    box-shadow: var(--shadow-lg);
}

#rvbt-bm-qm-root .qm-date {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    padding: 14px 26px;
    border-radius: var(--r-lg);
    min-width: 200px;
}

#rvbt-bm-qm-root .qm-date.done {
    background: var(--ivory);
}

#rvbt-bm-qm-root .qm-date.active {
    background: var(--ink);
    color: var(--ivory);
    box-shadow: var(--shadow-md);
}

#rvbt-bm-qm-root .qm-date .dl {
    font-size: 10px;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    font-weight: 600;
    color: var(--mute);
    line-height: 1;
}

#rvbt-bm-qm-root .qm-date.active .dl {
    color: #8b6d3a;
}

#rvbt-bm-qm-root .qm-date .dn {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 46px;
    line-height: 1;
    color: inherit;
}

#rvbt-bm-qm-root .qm-date .dm {
    font-size: 11px;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    font-weight: 600;
    color: var(--mute);
    line-height: 1;
}

#rvbt-bm-qm-root .qm-date.active .dm {
    color: #8b6d3a;
}

#rvbt-bm-qm-root .qm-arrow {
    display: flex;
    align-items: center;
    color: var(--gold);
    font-size: 24px;
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
}

#rvbt-bm-qm-root .qm-nights {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 14px 22px;
    border-radius: var(--r-lg);
    background: var(--gold-mist);
    min-width: 120px;
}

#rvbt-bm-qm-root .qm-nights .nn {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 48px;
    line-height: 1;
    color: var(--gold);
}

#rvbt-bm-qm-root .qm-nights .nl {
    font-size: 10px;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    font-weight: 600;
    color: var(--gold);
    line-height: 1;
}

/* ── Step 1 stage: full-width carousel (date column + picker overlay removed) ─── */
#rvbt-bm-qm-root .qm-stage {
    align-self: stretch;
    width: auto;
    margin: 48px 6px 28px;
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: auto;
    gap: 0;
    align-items: start;
}

/* Vertical date card — slim column hugging the headline's left edge.
   No outer card; a right hairline separates it from the year strip. */
#rvbt-bm-qm-root .qm-pickers.qm-pickers--stack {
    flex-direction: column;
    align-items: stretch;
    gap: 8px;
    padding: 0 18px 0 0;
    background: transparent;
    border: 0;
    box-shadow: none;
    border-radius: 0;
    border-right: 1px solid var(--line-soft);
    grid-column: 1;
    grid-row: 1 / span 2;
    align-self: stretch;
}

#rvbt-bm-qm-root .qm-pickers--stack .qm-date {
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
    min-width: 0;
    padding: 12px 16px 14px;
    gap: 6px;
    border-radius: var(--r-md);
    background: transparent;
    transition: background .25s ease, border-color .25s ease;
    border: 1px solid transparent;
}

#rvbt-bm-qm-root .qm-pickers--stack .qm-date.done {
    background: rgba(251, 248, 244, 0.6);
    border-color: var(--line-soft);
}

/* Active = currently being chosen. Soft cream-to-gold gradient with
   warm gold-leaf text. Light, refined, in-palette. */
#rvbt-bm-qm-root .qm-pickers--stack .qm-date.active {
    background: linear-gradient(229deg, #ffffff 0%, #f4eddb 100%);
    color: #8b6d3a;
    border-color: rgba(176, 146, 94, 0.35);
    box-shadow:
        0 10px 22px -14px rgba(176, 146, 94, 0.25),
        inset 0 1px 0 rgba(255, 255, 255, 0.4);
    position: relative;
    overflow: hidden;
}

#rvbt-bm-qm-root .qm-pickers--stack .qm-date.active::before {
    content: "";
    position: absolute;
    left: 0;
    top: 22%;
    bottom: 22%;
    width: 2px;
    background: var(--gold);
    border-radius: 0 2px 2px 0;
}

#rvbt-bm-qm-root .qm-pickers--stack .qm-date-row {
    display: flex;
    align-items: baseline;
    gap: 12px;
    width: 100%;
}

#rvbt-bm-qm-root .qm-pickers--stack .qm-date .dn {
    font-size: 44px;
    line-height: 1;
    letter-spacing: -0.02em;
}

#rvbt-bm-qm-root .qm-pickers--stack .qm-date .dl {
    font-size: 9px;
}

#rvbt-bm-qm-root .qm-pickers--stack .qm-date .dm {
    margin-left: auto;
    text-align: right;
    line-height: 1.4;
    font-size: 10px;
    max-width: 60%;
}

/* Hide the heavy decorative dividers — segments stand on their own */
#rvbt-bm-qm-root .qm-pickers--stack .qm-stack-divider {
    display: none;
}

/* Nights — slim inline strip (not a heavy block).
   Sits below the dates with a hairline above and one gold mark on the left. */
#rvbt-bm-qm-root .qm-nights.qm-nights--stack {
    flex-direction: row;
    align-items: baseline;
    justify-content: flex-start;
    gap: 10px;
    width: 100%;
    min-width: 0;
    padding: 10px 16px 4px;
    margin-top: 2px;
    border-radius: 0;
    background: transparent;
    border-top: 1px solid var(--line-soft);
    position: relative;
}

#rvbt-bm-qm-root .qm-nights.qm-nights--stack::before {
    content: "";
    position: absolute;
    top: -1px;
    left: 16px;
    width: 18px;
    height: 1px;
    background: var(--gold);
}

#rvbt-bm-qm-root .qm-nights.qm-nights--stack .nn {
    font-size: 26px;
    color: var(--ink);
    letter-spacing: -0.01em;
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
}

#rvbt-bm-qm-root .qm-nights.qm-nights--stack .nl {
    font-size: 9.5px;
    color: var(--mute);
    letter-spacing: 0.22em;
}

/* ── Year availability area — unified strip + decorative gold-frame overlay ───────── */
#rvbt-bm-qm-root .ymap-wrap {
    align-self: stretch;
    background: transparent;
    border: 0;
    box-shadow: none;
    padding: 0;
    display: block;
    position: relative;
    min-width: 0;
}

#rvbt-bm-qm-root .ymap-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding-bottom: 4px;
    margin-bottom: 14px;
    border-bottom: 1px solid var(--line-soft);
}

/* Decorative gold-bordered overlay — sits ON TOP of the leftmost card slot,
   258px wide (= mini card 248 + gap 10). Cards pan UNDER this frame.
   pointer-events:none lets clicks pass through to the cards. */
#rvbt-bm-qm-root .ymap-feature {
    position: absolute;
    top: 55px;                        /* aligns with viewport top (head + margin) */
    left: 0;
    width: 258px;
    height: 368px;
    border: 2px solid var(--gold);
    border-radius: var(--r-lg);
    background: transparent;
    pointer-events: none;
    z-index: 3;
    /* Outer drop-shadow only — the inner inset gold tint created a visible
       sliver between the border and the featured card photo. */
    box-shadow: 0 14px 28px -16px rgba(176, 146, 94, 0.45);
}

#rvbt-bm-qm-root .ymap-head .ttl {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 26px;
    color: var(--ink);
    line-height: 1;
    letter-spacing: -0.005em;
}

#rvbt-bm-qm-root .ymap-head .ttl small {
    font-family: 'Inter RVBT', 'Inter', sans-serif;
    font-size: 9.5px;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: var(--mute);
    font-weight: 600;
    margin-left: 12px;
}

/* Carousel nav chevrons */
#rvbt-bm-qm-root .ymap-nav {
    display: inline-flex;
    gap: 8px;
}

#rvbt-bm-qm-root .ymap-arrow {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border: 1px solid var(--line);
    background: transparent;
    color: var(--ink-soft);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background .2s ease, border-color .2s ease, color .2s ease, transform .15s ease;
    padding: 0;
}

#rvbt-bm-qm-root .ymap-arrow:hover:not([disabled]) {
    border-color: var(--gold);
    color: var(--gold);
    background: rgba(176, 146, 94, 0.06);
    transform: translateY(-1px);
}

#rvbt-bm-qm-root .ymap-arrow:active:not([disabled]) {
    transform: translateY(0) scale(0.96);
}

#rvbt-bm-qm-root .ymap-arrow[disabled] {
    opacity: 0.32;
    cursor: not-allowed;
}

/* Carousel viewport: clips the strip; sits to the right of the featured month.
   Negative margin-left pulls the viewport's left edge BEHIND the featured frame
   so mini cards visually "slide under" the frame's right border. The strip
   inside has no left padding, so the leftmost card actually starts inside the
   overlap zone (hidden by the featured frame via z-index) and emerges to the
   right of the frame. z-index keeps the viewport below the featured panel. */
#rvbt-bm-qm-root .ymap-viewport {
    position: relative;
    overflow: hidden;
    align-self: center;
    /* 10px padding so the leftmost card has a 10px gap inside the gold border */
    padding-left: 10px;
    z-index: 1;
    height: 368px;
    /* Soft edge mask only on the RIGHT — left side passes cleanly under the frame */
    -webkit-mask-image: linear-gradient(90deg, black 0, black calc(100% - 24px), transparent 100%);
            mask-image: linear-gradient(90deg, black 0, black calc(100% - 24px), transparent 100%);
}

/* Strip is wider than the viewport — translateX moves it. */
#rvbt-bm-qm-root .ymap-strip {
    display: flex;
    align-items: center;
    /* 20px gap so the gap between the gold border's right edge and the next
       visible card is 10px (= strip-gap 20 minus the 10px inside-border gap
       on the featured card's right). stepWidth() reads this dynamically so
       the carousel snap math stays correct. */
    gap: 20px;
    height: 100%;
    will-change: transform;
    transition: transform .45s cubic-bezier(0.22, 0.61, 0.36, 1);
}

#rvbt-bm-qm-root .mini {
    /* Regular (non-featured) cards: 210×348. The featured card overrides
       flex-basis to 238 below — and the carousel's snap math reads each
       card's actual offsetLeft so variable widths work correctly. */
    flex: 0 0 210px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 14px 12px 16px;
    border: 1px solid var(--line-soft);
    border-radius: var(--r-md);
    background: var(--ivory);
    transition: background .25s ease, border-color .25s ease, transform .25s ease, box-shadow .25s ease;
    cursor: pointer;
    min-width: 0;
    height: 348px;
    align-self: center;
}

#rvbt-bm-qm-root .mini:hover {
    border-color: var(--gold-soft);
    background: #FFFCF6;
    transform: translateY(-3px);
    box-shadow: 0 12px 24px -16px rgba(26, 20, 16, 0.18);
}

#rvbt-bm-qm-root .mini.cur {
    background:
        radial-gradient(120% 120% at 50% 0%, rgba(255, 250, 235, 0.9) 0%, transparent 70%),
        linear-gradient(180deg, #FBF8F4 0%, #F4ECD9 100%);
    border-color: var(--gold);
    box-shadow: 0 14px 28px -16px rgba(176, 146, 94, 0.45), inset 0 0 0 1px rgba(176, 146, 94, 0.12);
}

/* ────────────────────────────────────────────────────────────────────────────
   .is-featured — applied by JS to whichever strip card is currently at idx 0
   under the gold-border overlay. The card keeps its 238×348 layout box (so
   carousel snap math holds and no overlap with neighbors) and gains the
   hover-look styling permanently: gold border, brighter photo bg, darker
   text. Rich content (calendar grid + date range + "Your selection") is
   injected by JS.
   ──────────────────────────────────────────────────────────────────────────── */
#rvbt-bm-qm-root .mini.is-featured {
    border-color: var(--gold);
    background-color: transparent;
    box-shadow: 0 18px 36px -18px rgba(26, 20, 16, 0.5);
    z-index: 1;
    /* Featured card is 238×348 — wider than the 210 mini cards so it visually
       fills the gold border with 10px gap on all four sides. */
    flex: 0 0 238px;
}
/* (Featured-card cream-wash overlay removed — the in-range scrim handles
   contrast against the seasonal photo, no double overlay needed.) */
/* Darker text on the lighter overlay (mirrors hover legibility treatment) */
#rvbt-bm-qm-root .mini.is-featured[data-season] .nm        { color: #2d2316; text-shadow: 0 1px 2px rgba(255, 250, 235, 0.6); }
#rvbt-bm-qm-root .mini.is-featured[data-season] .occ-num   { color: #2d2316; text-shadow: none; }
#rvbt-bm-qm-root .mini.is-featured[data-season] .occ-num small { color: #654f2a; text-shadow: none; }
#rvbt-bm-qm-root .mini.is-featured[data-season] .occ-label,
#rvbt-bm-qm-root .mini.is-featured[data-season] .occ-tier  { color: #2d2316; }
/* "Your selection" subtitle under the month name — visible only on featured */
#rvbt-bm-qm-root .mini .nm .your-selection { display: none; }
#rvbt-bm-qm-root .mini.is-featured .nm .your-selection {
    display: block;
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 8.5px;
    letter-spacing: 0.24em;
    text-transform: uppercase;
    color: #654f2a;
    font-weight: 600;
    margin-top: 3px;
}
#rvbt-bm-qm-root .mini.is-featured .mini-grid,
#rvbt-bm-qm-root .mini.is-featured .month-occ {
    display: none !important;
}
#rvbt-bm-qm-root .mini.is-featured .nm {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 22px;
    color: #7f6435;
    text-transform: none;
    letter-spacing: -0.01em;
    line-height: 1;
    text-align: left;
    font-weight: 500;
}

/* The injected featured content sits below the month name, fills the rest
   of the card. Calendar grid + date range meta. */
#rvbt-bm-qm-root .mini.is-featured .feature-content {
    display: flex;
    flex-direction: column;
    gap: 10px;
    flex: 1 1 auto;
    width: 100%;
    margin-top: 8px;
}
#rvbt-bm-qm-root .mini.is-featured .feature-grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    grid-template-rows: repeat(6, 1fr);
    gap: 2px;
    flex: 1 1 auto;
    min-width: 0;
}
#rvbt-bm-qm-root .mini.is-featured .feature-grid .d {
    /* No aspect-ratio — cells fill their grid cell (1fr × 1fr). Aspect-ratio
       was making cells square based on row height (33), which forced columns
       wider than the grid and caused horizontal overflow / clipping. */
    background: transparent;
    border-radius: 2px;
    min-width: 0;
    min-height: 0;
    transition: background .15s ease;
}
#rvbt-bm-qm-root .mini.is-featured .feature-grid .d.has {
    background: rgba(255, 250, 235, 0.45);
}
#rvbt-bm-qm-root .mini.is-featured .feature-grid .d.range {
    background: #8f7952b5;
    box-shadow: 0 0 0 1px rgba(176, 146, 94, 0.18);
}
#rvbt-bm-qm-root .mini.is-featured .feature-grid .d.endpoint {
    background: #00000082;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.3);
}
#rvbt-bm-qm-root .mini.is-featured .feature-meta {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
    padding-top: 10px;
}

/* ─── Interactive cal-grid (built on every card, shown by state) ───────────
   Decorative cards hide it. Featured / in-range / ranging-mode reveal it.
   Selected days carry .is-arrive / .is-depart, in-between days .is-range. */
#rvbt-bm-qm-root .mini .cal-grid {
    display: none;
    grid-template-columns: repeat(7, 1fr);
    grid-template-rows: repeat(6, 1fr);
    gap: 2px;
    width: 100%;
    flex: 1 1 auto;
    min-width: 0;
    margin-top: 4px;
    padding: 0;
}
#rvbt-bm-qm-root .mini.is-featured .cal-grid,
#rvbt-bm-qm-root .mini.in-range .cal-grid,
#rvbt-bm-qm-root .ymap-wrap.is-ranging .mini .cal-grid {
    display: grid;
}
#rvbt-bm-qm-root .mini .cal-grid .d {
    appearance: none;
    background: transparent;
    border: 1px solid transparent;
    /* Dark text — the in-range / ranging scrim now lightens the cell area,
       so dark digits read clearly against the cream-tinted photo. */
    color: rgba(26, 20, 16, 0.88);
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 11px;
    font-variant-numeric: tabular-nums;
    font-weight: 500;
    line-height: 1;
    border-radius: 4px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    min-width: 0;
    min-height: 0;
    transition: background .14s ease, color .14s ease, border-color .14s ease;
}
#rvbt-bm-qm-root .mini .cal-grid .d.has {
    background: rgba(255, 250, 235, 0.18);
}
#rvbt-bm-qm-root .ymap-wrap.is-ranging .mini .cal-grid .d.has:hover {
    background: rgba(26, 20, 16, 0.10);
    color: #1a1410;
    border-color: rgba(26, 20, 16, 0.18);
}
#rvbt-bm-qm-root .mini .cal-grid .d.is-other {
    color: rgba(26, 20, 16, 0.30);
    cursor: default;
    pointer-events: none;
    background: transparent;
}
#rvbt-bm-qm-root .mini .cal-grid .d.is-range {
    background: rgba(176, 146, 94, 0.70);
    color: #fff5e1;
    border-radius: 0;
    font-weight: 600;
}
#rvbt-bm-qm-root .mini .cal-grid .d.is-arrive,
#rvbt-bm-qm-root .mini .cal-grid .d.is-depart {
    background: #1a1410;
    color: #fff;
    border-color: #1a1410;
    box-shadow: 0 6px 16px -8px rgba(0, 0, 0, 0.65);
    font-weight: 700;
    border-radius: 6px;
}
#rvbt-bm-qm-root .mini .cal-grid .d.is-arrive {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}
#rvbt-bm-qm-root .mini .cal-grid .d.is-depart {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}
#rvbt-bm-qm-root .mini .cal-grid .d.is-arrive.is-depart {
    border-radius: 6px;
}
/* During ranging mode (or after a finalized selection), every in-play card
   — INCLUDING the featured one — gets a soft scrim so the grid + meta read
   crisply against the seasonal photo backgrounds. Top half stays bright so
   the calendar cells / day numbers feel airy; bottom half darkens so the
   white date/nights meta reads with strong contrast. */
#rvbt-bm-qm-root .ymap-wrap.is-ranging .mini::after,
#rvbt-bm-qm-root .mini.in-range::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg,
        rgba(255, 250, 235, 0.18) 0%,
        rgba(255, 250, 235, 0.06) 38%,
        rgba(20, 14, 8, 0.30) 62%,
        rgba(20, 14, 8, 0.70) 100%);
    pointer-events: none;
    z-index: 0;
    transition: background .25s ease;
}
/* Featured card with selection — DEFAULT: softer cream wash up top with
   a moderate dark anchor at the bottom so the WHITE date/nights meta
   stays clearly readable. HOVER: same shape but deeper / more saturated
   for emphasis. Meta text is white in both states. */
#rvbt-bm-qm-root .mini.is-featured.in-range::after,
#rvbt-bm-qm-root .mini.is-featured.in-range:hover::after {
    background: linear-gradient(180deg,
        rgba(251, 248, 244, 0.55) 0%,
        rgba(244, 236, 217, 0.42) 45%,
        rgba(20, 14, 8, 0.45) 70%,
        rgba(20, 14, 8, 0.82) 100%);
}
/* Apply the cream-wash :hover::before treatment by DEFAULT for the
   selected featured card — this is the layer that makes the hover look
   appear "soft + open". User wants this visible without needing to hover. */
#rvbt-bm-qm-root .mini.is-featured.in-range[data-season]::before {
    background:
        radial-gradient(120% 120% at 50% 0%, rgba(255, 250, 235, 0.45) 0%, rgba(255, 250, 235, 0.22) 70%),
        linear-gradient(180deg,
            rgba(251, 248, 244, 0.42) 0%,
            rgba(244, 236, 217, 0.28) 50%,
            rgba(244, 236, 217, 0.38) 100%) !important;
}
/* Month name sits in the light upper area → dark ink for legibility */
#rvbt-bm-qm-root .mini.is-featured.in-range .nm {
    color: #2d2316;
    text-shadow: 0 1px 2px rgba(255, 250, 235, 0.7);
}
/* Meta (date range + nights) — WHITE in both default + hover, anchored
   by the dark bottom of the gradient. Heavy text-shadow holds legibility
   even where the gradient softens. */
#rvbt-bm-qm-root .mini.is-featured.in-range .feature-meta .lbl {
    color: #fff;
    text-shadow:
        0 2px 8px rgba(0, 0, 0, 0.55),
        0 0 14px rgba(0, 0, 0, 0.35);
}
#rvbt-bm-qm-root .mini.is-featured.in-range .feature-meta .val {
    color: rgba(255, 245, 220, 0.94);
    text-shadow:
        0 2px 6px rgba(0, 0, 0, 0.55),
        0 0 12px rgba(0, 0, 0, 0.30);
}
#rvbt-bm-qm-root .mini { position: relative; }
#rvbt-bm-qm-root .mini > .nm,
#rvbt-bm-qm-root .mini > .cal-grid,
#rvbt-bm-qm-root .mini > .month-occ,
#rvbt-bm-qm-root .mini > .feature-content { position: relative; z-index: 1; }
/* Cursor hint: during ranging, the carousel itself reads as actionable */
#rvbt-bm-qm-root .ymap-wrap.is-ranging .mini { cursor: pointer; }
/* The featured-card grid is the user's anchor — explicit "click to start" hint */
#rvbt-bm-qm-root .ymap-wrap:not(.is-ranging) .mini.is-featured .cal-grid .d.has {
    cursor: pointer;
}

/* ─── Range-select hint overlay (animated "gif" over featured card) ──────
   Fires when guest clicks Continue without dates. A cursor traces from
   start to end; "Click to start" and "Click to end" tips fade in at each
   anchor. Uses CSS keyframes only (no JS animation tick / no GIF asset). */
#rvbt-bm-qm-root .mini.is-featured .bm-range-hint {
    position: absolute;
    inset: 0;
    z-index: 5;
    pointer-events: none;
    opacity: 0;
    transition: opacity .35s ease;
    border-radius: inherit;
    overflow: hidden;
}
#rvbt-bm-qm-root .mini.is-featured .bm-range-hint.is-visible { opacity: 1; }
#rvbt-bm-qm-root .mini.is-featured .bm-range-hint.is-leaving { opacity: 0; }
#rvbt-bm-qm-root .bm-range-hint .bm-rh-scrim {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg,
        rgba(20, 14, 8, 0.62) 0%,
        rgba(20, 14, 8, 0.78) 100%);
}
#rvbt-bm-qm-root .bm-range-hint .bm-rh-caption {
    position: absolute;
    left: 50%;
    bottom: 18px;
    transform: translateX(-50%);
    width: 86%;
    text-align: center;
    color: #fff;
}
#rvbt-bm-qm-root .bm-range-hint .bm-rh-caption strong {
    display: block;
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 18px;
    font-weight: 500;
    letter-spacing: 0.01em;
    margin-bottom: 4px;
    color: #fff;
}
#rvbt-bm-qm-root .bm-range-hint .bm-rh-caption span {
    display: block;
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 11px;
    line-height: 1.45;
    color: rgba(255, 250, 240, 0.88);
}
/* The cursor — sits at "start" cell, glides to "end" cell, loops */
#rvbt-bm-qm-root .bm-range-hint .bm-rh-cursor {
    position: absolute;
    top: 40%;
    left: 18%;
    width: 22px;
    height: 22px;
    filter: drop-shadow(0 4px 8px rgba(0, 0, 0, 0.55));
    animation: bm-rh-cursor-path 4.2s cubic-bezier(0.22, 0.61, 0.36, 1) infinite;
}
@keyframes bm-rh-cursor-path {
    0%, 8%   { top: 40%; left: 18%; opacity: 0; transform: scale(0.85); }
    14%      { top: 40%; left: 18%; opacity: 1; transform: scale(1); }
    /* Click pulse at start */
    18%      { transform: scale(0.78); }
    22%      { transform: scale(1); }
    /* Glide to end cell */
    55%      { top: 56%; left: 70%; opacity: 1; transform: scale(1); }
    /* Click pulse at end */
    62%      { transform: scale(0.78); }
    66%      { transform: scale(1); }
    /* Hold then fade */
    85%      { opacity: 1; transform: scale(1); }
    100%     { top: 56%; left: 70%; opacity: 0; transform: scale(0.85); }
}
/* "Click to start" tip — appears at start position */
#rvbt-bm-qm-root .bm-range-hint .bm-rh-tip {
    position: absolute;
    padding: 5px 10px;
    background: #fff;
    color: #1a1410;
    border-radius: 999px;
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 9px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    font-weight: 700;
    white-space: nowrap;
    box-shadow: 0 8px 22px -10px rgba(0, 0, 0, 0.55);
    opacity: 0;
}
#rvbt-bm-qm-root .bm-range-hint .bm-rh-tip--start {
    top: calc(40% - 22px);
    left: 18%;
    transform: translateX(-30%);
    animation: bm-rh-tip-start 4.2s ease-in-out infinite;
}
#rvbt-bm-qm-root .bm-range-hint .bm-rh-tip--end {
    top: calc(56% - 22px);
    left: 70%;
    transform: translateX(-50%);
    animation: bm-rh-tip-end 4.2s ease-in-out infinite;
}
@keyframes bm-rh-tip-start {
    0%, 8%   { opacity: 0; }
    14%, 28% { opacity: 1; }
    36%, 100% { opacity: 0; }
}
@keyframes bm-rh-tip-end {
    0%, 50%  { opacity: 0; }
    58%, 78% { opacity: 1; }
    86%, 100% { opacity: 0; }
}
#rvbt-bm-qm-root .mini.is-featured .feature-meta .lbl {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 22px;
    line-height: 1.05;
    letter-spacing: 0.005em;
    color: #fff;
    font-weight: 500;
    text-shadow: 0 2px 8px rgba(0, 0, 0, 0.45);
    width: 100%;
    text-transform: none;
}
#rvbt-bm-qm-root .mini.is-featured .feature-meta .val {
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-style: normal;
    font-size: 13px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    font-weight: 600;
    color: rgba(255, 245, 220, 0.92);
    text-shadow: 0 2px 6px rgba(0, 0, 0, 0.4);
    width: 100%;
}

#rvbt-bm-qm-root .mini .nm {
    font-family: 'Inter RVBT', 'Inter', sans-serif;
    font-size: 10px;
    letter-spacing: 0.24em;
    text-transform: uppercase;
    color: var(--mute);
    font-weight: 600;
    text-align: center;
    line-height: 1;
}

#rvbt-bm-qm-root .mini.cur .nm {
    color: var(--gold);
}

#rvbt-bm-qm-root .mini-grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 2px;
}

#rvbt-bm-qm-root .mini-grid .d {
    aspect-ratio: 1 / 1;
    background: transparent;
    border-radius: 2px;
    transition: background .15s ease;
}

#rvbt-bm-qm-root .mini-grid .d.has {
    background: var(--line-soft);
}

#rvbt-bm-qm-root .mini:hover .mini-grid .d.has {
    background: var(--line);
}

#rvbt-bm-qm-root .mini-grid .d.range {
    background: var(--gold);
    box-shadow: 0 0 0 1px rgba(176, 146, 94, 0.18);
}

#rvbt-bm-qm-root .mini-grid .d.endpoint {
    background: var(--ink);
    box-shadow: 0 0 0 1px rgba(26, 20, 16, 0.6);
}

/* Edge fades — soften the carousel boundary even past the mask */
#rvbt-bm-qm-root .ymap-fade {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 56px;
    pointer-events: none;
    z-index: 2;
}

#rvbt-bm-qm-root .ymap-fade--left {
    /* Hidden — cards now pass cleanly behind the featured frame's right border
       instead of fading at the viewport edge. */
    display: none;
}

#rvbt-bm-qm-root .ymap-fade--right {
    right: 0;
    background: linear-gradient(270deg, var(--cream) 0%, rgba(245, 242, 240, 0) 100%);
}

/* Hide the right fade when the strip can't slide further right (no off-screen content) */
#rvbt-bm-qm-root .ymap-wrap[data-bm-ymap-at-end="1"] .ymap-fade--right { opacity: 0; transition: opacity .25s ease; }
#rvbt-bm-qm-root .ymap-wrap[data-bm-ymap-at-start="1"] .ymap-fade--left { opacity: 0; transition: opacity .25s ease; }

/* Foot: preview (left) + cta (right) */
/* Foot is pinned to viewport bottom across every step that ships it.
   position:fixed used because #rvbt-bm-qm-root has overflow:hidden which
   breaks position:sticky inside this layout. */
#rvbt-bm-qm-root .qm-foot {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    max-width: none;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    padding: 24px max(32px, calc((100vw - 1100px) / 2)) 28px;
    z-index: 3;
    isolation: isolate;
    background: linear-gradient(to top, var(--cream) 0%, var(--cream) 55%, rgba(245, 242, 240, 0) 100%);
    pointer-events: auto;
}

#rvbt-bm-qm-root .qm-preview {
    flex: 1;
    text-align: left;
    color: var(--mute-soft);
    font-size: 11.5px;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    font-weight: 600;
    line-height: 1.6;
    border-left: 1px dashed var(--line);
    padding-left: 16px;
}

#rvbt-bm-qm-root .qm-preview b {
    display: block;
    font-size: 9.5px;
    letter-spacing: 0.24em;
    color: var(--mute);
    font-weight: 600;
    margin-bottom: 6px;
}

#rvbt-bm-qm-root .qm-cta {
    display: flex;
    align-items: center;
    gap: 14px;
}

#rvbt-bm-qm-root .qm-signin {
    font-size: 11px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--mute);
    font-weight: 600;
    text-decoration: none;
    padding: 14px 0;
}

#rvbt-bm-qm-root .qm-signin:hover {
    color: var(--ink);
}

#rvbt-bm-qm-root .cta {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 14px 24px;
    border-radius: 999px;
    background: var(--ink);
    color: var(--ivory);
    border: 0;
    font-size: 11px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    font-weight: 600;
    cursor: pointer;
    font-family: 'Inter RVBT', 'Inter', sans-serif;
    line-height: 1;
    box-shadow: var(--shadow-md);
    transition: background 0.18s ease;
}

#rvbt-bm-qm-root .cta:hover { background: var(--gold); }

#rvbt-bm-qm-root .cta .arrow {
    color: var(--gold);
    font-size: 14px;
}

#rvbt-bm-qm-root .cta:hover .arrow { color: var(--ivory); }

/* Faint mountain silhouette at bottom */
/* Mountains decorate the area behind/around qm-foot. JS relocates the
   <svg.qm-mtns> inside .qm-foot at runtime so they travel together when
   qm-foot becomes sticky at the bottom of the viewport. */
#rvbt-bm-qm-root .qm-mtns {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0;
    width: 100vw;
    max-width: 100vw;
    height: 140px;
    pointer-events: none;
    opacity: 0.18;
    z-index: -1;
}

/* Mobile fallback */
@media (max-width: 1100px) {
    #rvbt-bm-qm-root .qm-stage { grid-template-columns: 1fr; gap: 22px; }
    #rvbt-bm-qm-root .qm-pickers.qm-pickers--stack { grid-column: 1; grid-row: auto; }
    #rvbt-bm-qm-root .ymap-wrap { grid-column: 1; grid-row: auto; }
    #rvbt-bm-qm-root .ymap-strip { grid-template-columns: repeat(6, 1fr); }
}
@media (max-width: 900px) {
    #rvbt-bm-qm-root .qm-q { font-size: 56px; }
    #rvbt-bm-qm-root .qm-pickers { flex-direction: column; gap: 10px; }
    #rvbt-bm-qm-root .qm-date,
    #rvbt-bm-qm-root .qm-nights { width: 100%; min-width: 0; }
    #rvbt-bm-qm-root .qm-arrow { transform: rotate(90deg); justify-content: center; }
    #rvbt-bm-qm-root .qm-foot { flex-direction: column; align-items: stretch; gap: 18px; }
    #rvbt-bm-qm-root .qm-preview { border-left: 0; padding-left: 0; border-top: 1px dashed var(--line); padding-top: 14px; }
    #rvbt-bm-qm-root .qm-park-corner { display: none; }
}
@media (max-width: 600px) {
    #rvbt-bm-qm-root .qm-q { font-size: 40px; }
    #rvbt-bm-qm-root .qm-frame { padding: 80px 18px 32px 18px; }
    #rvbt-bm-qm-root .ymap-strip { grid-template-columns: repeat(4, 1fr); }
    #rvbt-bm-qm-root .ymap-wrap { padding: 18px 16px; }
    #rvbt-bm-qm-root .ymap-head .ttl { font-size: 18px; }
}

/* ==================================================================
 * Steps 2–5 — V129-aesthetic styles for sites/add-ons/guest/review.
 * All scoped under #rvbt-bm-qm-root for (1,0,0) specificity.
 * ================================================================== */

/* Frame variant for steps with longer content — let the canvas scroll */
#rvbt-bm-qm-root .qm-frame--scroll {
    position: relative;
    inset: auto;
    padding: 60px 32px 40px 32px;
}

/* Override the global `.qm-q { font-size: 88px }` for steps 2-5 — too tall
   when the page also has cards/forms. Bring it down to ~52px so the
   question stays the focal point but the rest fits the viewport. */
#rvbt-bm-qm-root[data-bm-step="2"] .qm-q,
#rvbt-bm-qm-root[data-bm-step="3"] .qm-q,
#rvbt-bm-qm-root[data-bm-step="4"] .qm-q,
#rvbt-bm-qm-root[data-bm-step="5"] .qm-q {
    font-size: 52px;
    margin-bottom: 6px;
    max-width: 880px;
}

/* ── Step 2 — Sites ─────────────────────────────────────────────── */
#rvbt-bm-qm-root .qm-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    max-width: 760px;
    margin: 8px auto 16px;
    gap: 16px;
}
#rvbt-bm-qm-root .qm-tools-left {
    display: inline-flex;
    background: var(--paper);
    border-radius: 999px;
    padding: 4px;
    gap: 2px;
    border: 1px solid var(--line-soft);
    box-shadow: var(--shadow-sm);
}
#rvbt-bm-qm-root .qm-toggle {
    padding: 7px 16px;
    border-radius: 999px;
    background: transparent;
    border: 0;
    font-family: 'Inter RVBT', 'Inter', sans-serif;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--mute);
    cursor: pointer;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: color 0.18s ease, background 0.18s ease;
}
#rvbt-bm-qm-root .qm-toggle svg { width: 13px; height: 13px; }
#rvbt-bm-qm-root .qm-toggle:hover { color: var(--ink); }
#rvbt-bm-qm-root .qm-toggle.is-active {
    background: linear-gradient(180deg, var(--ink-soft) 0%, var(--ink) 100%);
    color: var(--ivory);
    box-shadow: 0 2px 6px rgba(0,0,0,0.12);
}
#rvbt-bm-qm-root .qm-multi {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 11px;
    color: var(--mute);
    letter-spacing: 0.04em;
}

#rvbt-bm-qm-root .qm-sites {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 12px;
    width: 100%;
    max-width: 880px;
    margin: 0 auto 14px;
}
#rvbt-bm-qm-root .qm-site {
    background: var(--paper);
    border: 1px solid var(--line-soft);
    border-radius: var(--r-lg);
    padding: 14px 16px;
    box-shadow: var(--shadow-sm);
    cursor: pointer;
    transition: border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
    display: flex;
    flex-direction: column;
    gap: 6px;
    position: relative;
}
#rvbt-bm-qm-root .qm-site:hover {
    border-color: var(--gold);
    box-shadow: var(--shadow-md);
    transform: translateY(-1px);
}
#rvbt-bm-qm-root .qm-site.is-selected {
    border-color: var(--ink);
    box-shadow: 0 0 0 3px var(--gold-mist);
}
#rvbt-bm-qm-root .qm-site-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}
#rvbt-bm-qm-root .qm-site-name {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 22px;
    font-weight: 600;
    color: var(--ink);
    line-height: 1.1;
}
#rvbt-bm-qm-root .qm-site-cost {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 16px;
    color: var(--gold);
}
#rvbt-bm-qm-root .qm-site-meta {
    font-size: 11px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--mute);
    line-height: 1.4;
}
#rvbt-bm-qm-root .qm-site-toosmall {
    font-size: 10px;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: #a43333;
    margin-top: 4px;
    line-height: 1;
}
#rvbt-bm-qm-root .qm-map-host {
    width: 100%;
    max-width: 880px;
    margin: 0 auto 14px;
}
#rvbt-bm-qm-root .qm-map-placeholder {
    background: var(--paper);
    border: 1px dashed var(--line);
    border-radius: var(--r-lg);
    padding: 36px 20px;
    text-align: center;
    color: var(--mute);
    font-size: 13px;
}
#rvbt-bm-qm-root .qm-waitlist {
    color: var(--mute);
    font-size: 11px;
    letter-spacing: 0.04em;
    text-decoration: underline;
    text-underline-offset: 3px;
    margin-bottom: 16px;
}
#rvbt-bm-qm-root .qm-waitlist:hover { color: var(--ink); }

/* ──────────────────────────────────────────────────────────────────
   Step 5 — Sites (extended: group bar, loading/error/empty, card foot,
   map polygons + tooltip + legend)
   ────────────────────────────────────────────────────────────────── */

/* Group-booking bar — shown when 1+ sites selected */
#rvbt-bm-qm-root .qm-group-bar {
    width: 100%;
    max-width: 880px;
    margin: 0 auto 14px;
    padding: 12px 18px;
    background: linear-gradient(180deg, rgba(255, 254, 251, 0.7) 0%, rgba(244, 238, 226, 0.65) 100%);
    border: 1px solid rgba(176, 146, 94, 0.28);
    border-radius: var(--r-lg);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.7);
}
#rvbt-bm-qm-root .qm-group-bar[hidden] { display: none; }
#rvbt-bm-qm-root .qm-group-bar-text {
    display: inline-flex;
    align-items: baseline;
    gap: 8px;
}
#rvbt-bm-qm-root .qm-group-bar-text strong {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 26px;
    color: var(--gold-deep);
    line-height: 1;
    font-weight: 500;
}
#rvbt-bm-qm-root .qm-group-bar-label {
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 11px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--mute);
}
#rvbt-bm-qm-root .qm-group-clear {
    background: transparent;
    border: 1px solid rgba(176,146,94,0.28);
    color: var(--ink-soft);
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 10.5px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    font-weight: 500;
    padding: 7px 14px;
    border-radius: 999px;
    cursor: pointer;
    transition: color 0.18s ease, border-color 0.18s ease, background 0.18s ease;
}
#rvbt-bm-qm-root .qm-group-clear:hover {
    color: #C57878;
    border-color: #C57878;
    background: #FFF1F1;
}

/* Loading skeleton */
#rvbt-bm-qm-root .qm-sites-loading {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 12px;
    width: 100%;
    max-width: 880px;
    margin: 0 auto 14px;
}
#rvbt-bm-qm-root .qm-sites-loading[hidden] { display: none; }
#rvbt-bm-qm-root .qm-skel-card {
    height: 124px;
    border-radius: var(--r-lg);
    background:
        linear-gradient(90deg, rgba(255,254,251,0.4) 0%, rgba(244,238,226,0.7) 50%, rgba(255,254,251,0.4) 100%);
    background-size: 200% 100%;
    border: 1px solid rgba(176, 146, 94, 0.12);
    animation: qm-skeleton-shimmer 1.4s ease-in-out infinite;
}
@keyframes qm-skeleton-shimmer {
    0%   { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

/* Error + empty states */
#rvbt-bm-qm-root .qm-sites-error,
#rvbt-bm-qm-root .qm-sites-empty {
    width: 100%;
    max-width: 760px;
    margin: 4px auto 14px;
    padding: 22px 24px;
    background: linear-gradient(180deg, rgba(255, 254, 251, 0.7) 0%, rgba(244, 238, 226, 0.6) 100%);
    border: 1px solid rgba(176, 146, 94, 0.22);
    border-radius: var(--r-lg);
    display: flex;
    align-items: center;
    gap: 16px;
}
#rvbt-bm-qm-root .qm-sites-error[hidden],
#rvbt-bm-qm-root .qm-sites-empty[hidden] { display: none; }
#rvbt-bm-qm-root .qm-state-icon {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: var(--gold);
    color: var(--ivory);
    font-family: 'Inter RVBT', 'Inter', sans-serif;
    font-size: 18px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
}
#rvbt-bm-qm-root .qm-state-icon--soft {
    background: #c9bba0;
    font-weight: 400;
    font-size: 16px;
}
#rvbt-bm-qm-root .qm-state-title {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 22px;
    color: var(--ink);
    line-height: 1.1;
    font-weight: 500;
}
#rvbt-bm-qm-root .qm-state-sub {
    margin-top: 3px;
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 12.5px;
    color: var(--ink-soft);
    line-height: 1.4;
}

/* Site card improvements — meta dot, foot row with Select button */
#rvbt-bm-qm-root .qm-site-meta {
    display: flex;
    align-items: center;
    gap: 6px;
}
#rvbt-bm-qm-root .qm-site-dot {
    color: rgba(0,0,0,0.25);
    font-size: 14px;
    line-height: 1;
}
#rvbt-bm-qm-root .qm-site-foot {
    margin-top: 6px;
    padding-top: 10px;
    border-top: 1px solid rgba(176,146,94,0.14);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}
#rvbt-bm-qm-root .qm-site-select {
    background: transparent;
    border: 1px solid rgba(176,146,94,0.32);
    color: var(--ink-soft);
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 10.5px;
    font-weight: 600;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    padding: 7px 14px;
    border-radius: 999px;
    cursor: pointer;
    transition: color 0.18s ease, border-color 0.18s ease, background 0.18s ease, box-shadow 0.18s ease;
    margin-left: auto;
}
#rvbt-bm-qm-root .qm-site-select:hover {
    color: var(--gold-deep);
    border-color: var(--gold);
    background: var(--gold-mist);
}
#rvbt-bm-qm-root .qm-site.is-selected .qm-site-select {
    background: linear-gradient(180deg, var(--gold) 0%, var(--gold-deep) 100%);
    border-color: var(--gold-deep);
    color: var(--ivory);
    box-shadow: 0 3px 10px rgba(176, 146, 94, 0.28);
}
#rvbt-bm-qm-root .qm-site.is-selected .qm-site-select::before {
    content: "✓ ";
    margin-right: 2px;
}
#rvbt-bm-qm-root .qm-site.is-disabled {
    opacity: 0.55;
    cursor: not-allowed;
    pointer-events: none;
}
#rvbt-bm-qm-root .qm-site.is-disabled .qm-site-select { display: none; }
#rvbt-bm-qm-root .qm-site-cat {
    color: var(--gold-deep);
    font-weight: 600;
}

/* ─── Map view (scoped overrides for the shared rvbt-bm-map* shell) ── */
#rvbt-bm-qm-root .qm-map-host {
    background: linear-gradient(180deg, rgba(255, 254, 251, 0.6) 0%, rgba(244, 238, 226, 0.5) 100%);
    border: 1px solid rgba(176, 146, 94, 0.22);
    border-radius: var(--r-lg);
    padding: 14px;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.65);
}
#rvbt-bm-qm-root .qm-map-host[hidden] { display: none; }
#rvbt-bm-qm-root .qm-map-host .rvbt-bm-map {
    position: relative;
    border-radius: var(--r-md);
    overflow: hidden;
    background: #ECE6D9;
}
#rvbt-bm-qm-root .qm-map-host .rvbt-bm-map__img {
    display: block;
    width: 100%;
    height: auto;
}
#rvbt-bm-qm-root .qm-map-host .rvbt-bm-map__svg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
}
#rvbt-bm-qm-root .qm-map-host .rvbt-bm-map__poly {
    pointer-events: all;
    transition: fill 0.18s ease, stroke 0.18s ease, stroke-width 0.18s ease;
    stroke-width: 1.5;
}
#rvbt-bm-qm-root .qm-map-host .rvbt-bm-map__poly[data-state="available"] {
    fill: rgba(176, 146, 94, 0.22);
    stroke: var(--gold);
}
#rvbt-bm-qm-root .qm-map-host .rvbt-bm-map__poly[data-state="available"]:hover {
    fill: rgba(176, 146, 94, 0.42);
    stroke: var(--gold-deep);
    stroke-width: 2.5;
}
#rvbt-bm-qm-root .qm-map-host .rvbt-bm-map__poly[data-state="selected"] {
    fill: rgba(126, 139, 122, 0.55);
    stroke: #4F5F4B;
    stroke-width: 2.5;
}
#rvbt-bm-qm-root .qm-map-host .rvbt-bm-map__poly[data-state="booked"] {
    fill: rgba(120, 100, 80, 0.18);
    stroke: rgba(120, 100, 80, 0.38);
    cursor: not-allowed;
}
#rvbt-bm-qm-root .qm-map-host .rvbt-bm-map__tip {
    position: absolute;
    background: var(--ink);
    color: var(--ivory);
    padding: 10px 14px;
    border-radius: var(--r-md);
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 12px;
    line-height: 1.4;
    pointer-events: none;
    z-index: 10;
    max-width: 220px;
    box-shadow: 0 6px 22px rgba(0,0,0,0.25);
}
#rvbt-bm-qm-root .qm-map-host .rvbt-bm-map__tip[hidden] { display: none; }
#rvbt-bm-qm-root .qm-map-host .rvbt-bm-map__tip strong {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 18px;
    font-weight: 500;
    color: var(--ivory);
    display: block;
    margin-bottom: 2px;
}
#rvbt-bm-qm-root .qm-map-host .rvbt-bm-map__tip-cat {
    display: block;
    font-size: 10px;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--gold);
    margin-top: 2px;
}
#rvbt-bm-qm-root .qm-map-host .rvbt-bm-map__tip-price {
    display: block;
    color: var(--gold);
    font-weight: 600;
    margin-top: 4px;
    font-size: 13px;
}
#rvbt-bm-qm-root .qm-map-host .rvbt-bm-map__tip-price small {
    font-weight: 400;
    color: rgba(245, 240, 232, 0.7);
}
#rvbt-bm-qm-root .qm-map-host .rvbt-bm-map__tip-warn {
    display: block;
    color: #ffb4b4;
    margin-top: 4px;
    font-size: 11px;
}
#rvbt-bm-qm-root .qm-map-host .rvbt-bm-map__legend {
    margin-top: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 18px;
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 11px;
    color: var(--ink-soft);
    flex-wrap: wrap;
}
#rvbt-bm-qm-root .qm-map-host .rvbt-bm-map__legend span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    letter-spacing: 0.06em;
}
#rvbt-bm-qm-root .qm-map-host .rvbt-bm-map__sw {
    width: 14px;
    height: 14px;
    border-radius: 3px;
    display: inline-block;
}
#rvbt-bm-qm-root .qm-map-host .rvbt-bm-map__sw--avail  { background: rgba(176,146,94,0.32); border: 1px solid var(--gold); }
#rvbt-bm-qm-root .qm-map-host .rvbt-bm-map__sw--sel    { background: rgba(126,139,122,0.55); border: 1px solid #4F5F4B; }
#rvbt-bm-qm-root .qm-map-host .rvbt-bm-map__sw--booked { background: rgba(120,100,80,0.22); border: 1px solid rgba(120,100,80,0.45); }

/* Inline error inside map host (when map_url missing) */
#rvbt-bm-qm-root .qm-map-host .rvbt-bm-error {
    padding: 30px 20px;
    text-align: center;
    color: var(--ink-soft);
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 13px;
    line-height: 1.5;
}

/* ── Step 3 — Add-ons ───────────────────────────────────────────── */
#rvbt-bm-qm-root .qm-addons {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 12px;
    width: 100%;
    max-width: 880px;
    margin: 0 auto 14px;
}
#rvbt-bm-qm-root .qm-addon {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px 16px;
    background: var(--paper);
    border: 1px solid var(--line-soft);
    border-radius: var(--r-lg);
    cursor: pointer;
    transition: border-color 0.18s ease, box-shadow 0.18s ease;
    box-shadow: var(--shadow-sm);
}
#rvbt-bm-qm-root .qm-addon:hover { border-color: var(--gold); }
#rvbt-bm-qm-root .qm-addon.is-selected {
    border-color: var(--ink);
    background: var(--ivory);
}
#rvbt-bm-qm-root .qm-addon-tick {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: var(--ivory);
    border: 1px solid var(--line);
    color: var(--mute);
    font-size: 18px;
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    cursor: pointer;
    font-weight: 600;
}
#rvbt-bm-qm-root .qm-addon.is-selected .qm-addon-tick {
    background: var(--ink);
    color: var(--gold);
    border-color: var(--ink);
}
#rvbt-bm-qm-root .qm-addon-body { flex: 1; min-width: 0; }
#rvbt-bm-qm-root .qm-addon-name {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 18px;
    color: var(--ink);
    line-height: 1.2;
}
#rvbt-bm-qm-root .qm-addon-cost {
    font-size: 11px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--mute);
    margin-top: 2px;
    line-height: 1.2;
}

#rvbt-bm-qm-root .qm-running {
    display: inline-flex;
    align-items: baseline;
    gap: 14px;
    background: var(--gold-mist);
    border-radius: 999px;
    padding: 12px 22px;
    margin: 4px 0 18px;
}
#rvbt-bm-qm-root .qm-running-label {
    font-size: 10px;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: var(--gold);
    font-weight: 600;
}
#rvbt-bm-qm-root .qm-running-value {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 24px;
    color: var(--gold);
}

/* ── Step 4 — Guest form ────────────────────────────────────────── */
#rvbt-bm-qm-root .qm-form {
    width: 100%;
    max-width: 720px;
    margin: 0 auto 18px;
    background: var(--paper);
    border: 1px solid var(--line-soft);
    border-radius: var(--r-xl);
    padding: 24px;
    box-shadow: var(--shadow-md);
}
#rvbt-bm-qm-root .qm-form-grid {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 14px 18px;
}
#rvbt-bm-qm-root .qm-field {
    display: flex;
    flex-direction: column;
    gap: 4px;
}
#rvbt-bm-qm-root .qm-field--span { grid-column: 1 / -1; }
#rvbt-bm-qm-root .qm-field-lab {
    font-size: 9.5px;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: var(--mute);
    font-weight: 600;
    line-height: 1;
}
#rvbt-bm-qm-root .qm-field input,
#rvbt-bm-qm-root .qm-field textarea,
#rvbt-bm-qm-root .qm-field select {
    border: 0;
    border-bottom: 1px solid var(--line);
    background: transparent;
    padding: 6px 0;
    font-family: 'Inter RVBT', 'Inter', sans-serif;
    font-size: 14px;
    color: var(--ink);
    line-height: 1.4;
    width: 100%;
    transition: border-color 0.18s ease;
}
#rvbt-bm-qm-root .qm-field textarea { resize: vertical; min-height: 60px; }
#rvbt-bm-qm-root .qm-field input:focus,
#rvbt-bm-qm-root .qm-field textarea:focus,
#rvbt-bm-qm-root .qm-field select:focus {
    outline: none;
    border-bottom-color: var(--ink);
}
#rvbt-bm-qm-root .qm-terms-row {
    flex-direction: row;
    align-items: center;
    gap: 8px;
    font-size: 12px;
    color: var(--mute);
    margin-top: 4px;
    font-weight: 500;
    text-transform: none;
    letter-spacing: 0;
}
#rvbt-bm-qm-root .qm-terms-row input[type="checkbox"] {
    accent-color: var(--ink);
    width: 16px;
    height: 16px;
}

/* ── Step 5 — Review ────────────────────────────────────────────── */
#rvbt-bm-qm-root .qm-review {
    width: 100%;
    max-width: 720px;
    margin: 0 auto 14px;
    background: var(--paper);
    border: 1px solid var(--line-soft);
    border-radius: var(--r-xl);
    padding: 22px 26px;
    box-shadow: var(--shadow-md);
    display: flex;
    flex-direction: column;
    gap: 14px;
}
#rvbt-bm-qm-root .qm-review-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 16px;
    padding-bottom: 12px;
    border-bottom: 1px dotted var(--line);
}
#rvbt-bm-qm-root .qm-review-row:last-child { border-bottom: 0; padding-bottom: 0; }
#rvbt-bm-qm-root .qm-review-lab {
    font-size: 10px;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: var(--mute);
    font-weight: 600;
    flex-shrink: 0;
    line-height: 1.4;
}
#rvbt-bm-qm-root .qm-review-val {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 18px;
    color: var(--ink);
    text-align: right;
    line-height: 1.4;
}
#rvbt-bm-qm-root .qm-review-sub {
    font-size: 12px;
    color: var(--mute);
    font-family: 'Inter RVBT', 'Inter', sans-serif;
}

#rvbt-bm-qm-root .qm-pay {
    width: 100%;
    max-width: 720px;
    margin: 0 auto 14px;
}
#rvbt-bm-qm-root .qm-pay select {
    background: var(--paper);
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    padding: 12px 14px;
    font-size: 14px;
    color: var(--ink);
    width: 100%;
    font-family: 'Inter RVBT', 'Inter', sans-serif;
    line-height: 1.4;
}

#rvbt-bm-qm-root .qm-total {
    width: 100%;
    max-width: 720px;
    margin: 0 auto 18px;
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    background: var(--ink);
    color: var(--ivory);
    padding: 18px 26px;
    border-radius: var(--r-lg);
    box-shadow: var(--shadow-md);
}
#rvbt-bm-qm-root .qm-total-lab {
    font-size: 11px;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: var(--gold-soft);
    font-weight: 600;
}
#rvbt-bm-qm-root .qm-total-val {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 36px;
    line-height: 1;
    color: var(--gold);
}

#rvbt-bm-qm-root .cta--final {
    background: linear-gradient(135deg, var(--ink) 0%, var(--gold-deep, #8E7344) 100%);
    box-shadow: var(--shadow-lg);
}
#rvbt-bm-qm-root .cta--final:hover {
    background: var(--gold);
}

@media (max-width: 720px) {
    #rvbt-bm-qm-root .qm-form-grid { grid-template-columns: 1fr; }
    #rvbt-bm-qm-root .qm-toolbar { flex-direction: column; align-items: stretch; }
}

/* ── Step 2 — Rig type & length form ────────────────────────────── */
#rvbt-bm-qm-root .qm-rig {
    display: flex;
    gap: 18px;
    background: var(--paper);
    border: 1px solid var(--line-soft);
    border-radius: var(--r-xl);
    padding: 22px;
    box-shadow: var(--shadow-lg);
    margin-bottom: 14px;
    width: 100%;
    max-width: 720px;
}
#rvbt-bm-qm-root .qm-rig-field {
    display: flex;
    flex-direction: column;
    gap: 8px;
    flex: 1;
    min-width: 0;
}
#rvbt-bm-qm-root .qm-rig-label {
    font-size: 10px;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: var(--mute);
    font-weight: 600;
    line-height: 1;
}
#rvbt-bm-qm-root .qm-rig-select,
#rvbt-bm-qm-root .qm-rig-input {
    background: var(--ivory);
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    padding: 12px 14px;
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 22px;
    color: var(--ink);
    line-height: 1.2;
    width: 100%;
    transition: border-color 0.18s ease;
}
#rvbt-bm-qm-root .qm-rig-select:focus,
#rvbt-bm-qm-root .qm-rig-input:focus {
    outline: none;
    border-color: var(--ink);
    background: var(--paper);
}
#rvbt-bm-qm-root .qm-rig-hint {
    font-size: 12px;
    color: var(--mute);
    text-align: center;
    letter-spacing: 0.04em;
    margin: 0 0 14px;
}

/* ── Step 4 — Party counters ────────────────────────────────────── */
#rvbt-bm-qm-root .qm-counters {
    display: flex;
    gap: 16px;
    background: var(--paper);
    border: 1px solid var(--line-soft);
    border-radius: var(--r-xl);
    padding: 22px;
    box-shadow: var(--shadow-md);
    margin: 0 auto 18px;
    max-width: 720px;
    width: 100%;
    justify-content: center;
}
#rvbt-bm-qm-root .qm-counter {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    flex: 1;
    min-width: 0;
}
#rvbt-bm-qm-root .qm-counter-label {
    font-size: 10px;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: var(--mute);
    font-weight: 600;
    line-height: 1;
}
#rvbt-bm-qm-root .qm-counter-row {
    display: inline-flex;
    align-items: center;
    gap: 14px;
}
#rvbt-bm-qm-root .qm-counter-btn {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border: 1px solid var(--line);
    background: var(--ivory);
    color: var(--ink);
    cursor: pointer;
    font-size: 18px;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-family: 'Inter RVBT', 'Inter', sans-serif;
    transition: background 0.15s ease, border-color 0.15s ease;
}
#rvbt-bm-qm-root .qm-counter-btn:hover {
    background: var(--ink);
    color: var(--gold);
    border-color: var(--ink);
}
#rvbt-bm-qm-root .qm-counter-val {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 32px;
    color: var(--ink);
    line-height: 1;
    min-width: 32px;
    text-align: center;
}

@media (max-width: 600px) {
    #rvbt-bm-qm-root .qm-rig { flex-direction: column; }
    #rvbt-bm-qm-root .qm-counters { flex-wrap: wrap; }
    #rvbt-bm-qm-root .qm-counter { flex: 1 1 30%; }
}

/* ────────────────────────────────────────────────────────────────────
 * Step 2 — REDESIGNED rig picker
 *  - SVG radio cards (rig type)
 *  - Custom large-handle slider (length)
 *  - Multi-rig support (add another rig for group bookings)
 * ──────────────────────────────────────────────────────────────────── */

#rvbt-bm-qm-root .qm-rig-list {
    width: 100%;
    max-width: 900px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 18px;
}

#rvbt-bm-qm-root .qm-rig-card {
    background: #ffffff9c;
    border: 1px solid var(--line-soft);
    border-radius: var(--r-xl);
    padding: 22px 26px 26px;
    position: relative;
}

#rvbt-bm-qm-root .qm-rig-card-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 14px;
}

#rvbt-bm-qm-root .qm-rig-card-num {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 18px;
    color: var(--gold-deep, #8E7344);
    font-style: italic;
    letter-spacing: 0.04em;
}

#rvbt-bm-qm-root .qm-rig-remove {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: transparent;
    border: 1px solid var(--line);
    color: var(--mute);
    font-size: 16px;
    line-height: 1;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: all 0.18s ease;
}

#rvbt-bm-qm-root .qm-rig-remove:hover {
    background: #fdf5f5;
    border-color: #d8a3a3;
    color: #a43333;
}

/* SVG rig-type radio grid */
#rvbt-bm-qm-root .qm-rig-types {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
    margin-bottom: 22px;
}

#rvbt-bm-qm-root .qm-rig-type {
    background: var(--ivory);
    border: 2px solid var(--line-soft);
    border-radius: var(--r-lg);
    padding: 12px 8px 10px;
    cursor: pointer;
    transition: border-color 0.18s ease, background 0.18s ease, transform 0.12s ease, box-shadow 0.18s ease;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    position: relative;
    color: var(--mute);
}

#rvbt-bm-qm-root .qm-rig-type:hover {
    border-color: var(--gold);
    background: var(--paper);
    transform: translateY(-1px);
    color: var(--ink-soft);
}

#rvbt-bm-qm-root .qm-rig-type input[type="radio"] {
    position: absolute;
    opacity: 0;
    pointer-events: none;
    width: 0;
    height: 0;
}

#rvbt-bm-qm-root .qm-rig-type.is-selected {
    /* Soft cream-gold treatment instead of harsh dark ink */
    background: linear-gradient(180deg, var(--paper) 0%, var(--gold-mist) 100%);
    border-color: var(--gold);
    color: var(--ink);
    box-shadow: 0 8px 22px rgba(176, 146, 94, 0.22), 0 0 0 3px rgba(176, 146, 94, 0.12);
    transform: translateY(-1px);
}

#rvbt-bm-qm-root .qm-rig-type.is-selected .qm-rig-type-icon {
    color: var(--gold-deep, #8E7344);
}

#rvbt-bm-qm-root .qm-rig-type.is-selected .qm-rig-type-name {
    color: var(--ink);
    font-weight: 600;
}

#rvbt-bm-qm-root .qm-rig-type.is-selected .qm-rig-type-sub {
    color: var(--gold-deep, #8E7344);
    opacity: 1;
}

#rvbt-bm-qm-root .qm-rig-type.is-selected::after {
    /* Gold checkmark badge in top-right */
    content: "\2713";
    position: absolute;
    top: -6px;
    right: -6px;
    width: 22px;
    height: 22px;
    background: var(--gold);
    color: var(--ivory);
    border: 2px solid var(--paper);
    border-radius: 50%;
    font-size: 11px;
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    box-shadow: 0 2px 8px rgba(176, 146, 94, 0.45);
}

#rvbt-bm-qm-root .qm-rig-type-icon {
    width: 80px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: inherit;
}

#rvbt-bm-qm-root .qm-rig-type-icon svg {
    width: 100%;
    height: 100%;
    color: inherit;
}

#rvbt-bm-qm-root .qm-rig-type-label {
    text-align: center;
    line-height: 1.2;
}

#rvbt-bm-qm-root .qm-rig-type-name {
    display: block;
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 14px;
    color: inherit;
    line-height: 1.1;
}

#rvbt-bm-qm-root .qm-rig-type-sub {
    display: block;
    font-size: 8.5px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: inherit;
    opacity: 0.7;
    font-weight: 600;
    line-height: 1;
    margin-top: 3px;
}

/* Length slider */
#rvbt-bm-qm-root .qm-rig-length {
    background: var(--ivory);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    padding: 18px 22px 14px;
}

#rvbt-bm-qm-root .qm-rig-length-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    margin-bottom: 18px;
}

#rvbt-bm-qm-root .qm-rig-length-label {
    font-size: 10px;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: var(--mute);
    font-weight: 600;
}

#rvbt-bm-qm-root .qm-rig-length-display {
    display: inline-flex;
    align-items: baseline;
    gap: 6px;
}

#rvbt-bm-qm-root .qm-rig-length-num {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 38px;
    color: var(--ink);
    line-height: 1;
}

#rvbt-bm-qm-root .qm-rig-length-unit {
    font-size: 12px;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: var(--gold);
    font-weight: 600;
}

#rvbt-bm-qm-root .qm-slider-wrap {
    position: relative;
    height: 36px;
    display: flex;
    align-items: center;
    margin-bottom: 6px;
}

#rvbt-bm-qm-root .qm-slider-track {
    position: absolute;
    left: 18px;
    right: 18px;
    top: 50%;
    transform: translateY(-50%);
    height: 8px;
    background: var(--line-soft);
    border-radius: 99px;
    pointer-events: none;
}

#rvbt-bm-qm-root .qm-slider-fill {
    height: 100%;
    background: linear-gradient(90deg, var(--gold) 0%, var(--gold-deep, #8E7344) 100%);
    border-radius: 99px;
    box-shadow: 0 2px 8px rgba(176, 146, 94, 0.35);
}

/* Native range input — styled to render the large grabbable handle */
#rvbt-bm-qm-root .qm-slider-input {
    position: relative;
    width: 100%;
    height: 36px;
    background: transparent;
    margin: 0;
    padding: 0;
    appearance: none;
    -webkit-appearance: none;
    cursor: grab;
    z-index: 2;
}

#rvbt-bm-qm-root .qm-slider-input:active { cursor: grabbing; }

#rvbt-bm-qm-root .qm-slider-input:focus { outline: none; }

/* WebKit thumb */
#rvbt-bm-qm-root .qm-slider-input::-webkit-slider-runnable-track {
    height: 36px;
    background: transparent;
    border: 0;
}

#rvbt-bm-qm-root .qm-slider-input::-webkit-slider-thumb {
    appearance: none;
    -webkit-appearance: none;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: var(--ink);
    border: 3px solid var(--ivory);
    box-shadow: 0 6px 18px rgba(26, 20, 16, 0.32), inset 0 0 0 4px var(--ink), inset 0 0 0 6px var(--gold);
    cursor: grab;
    margin-top: 0;
    transition: transform 0.12s ease, box-shadow 0.12s ease;
}

#rvbt-bm-qm-root .qm-slider-input:hover::-webkit-slider-thumb {
    transform: scale(1.08);
}

#rvbt-bm-qm-root .qm-slider-input:active::-webkit-slider-thumb {
    transform: scale(1.12);
    cursor: grabbing;
    box-shadow: 0 10px 28px rgba(26, 20, 16, 0.42), inset 0 0 0 4px var(--ink), inset 0 0 0 6px var(--gold);
}

/* Firefox thumb + track */
#rvbt-bm-qm-root .qm-slider-input::-moz-range-track {
    height: 36px;
    background: transparent;
    border: 0;
}

#rvbt-bm-qm-root .qm-slider-input::-moz-range-thumb {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: var(--ink);
    border: 3px solid var(--ivory);
    box-shadow: 0 6px 18px rgba(26, 20, 16, 0.32);
    cursor: grab;
    transition: transform 0.12s ease;
}

#rvbt-bm-qm-root .qm-slider-input:hover::-moz-range-thumb { transform: scale(1.08); }

#rvbt-bm-qm-root .qm-slider-ticks {
    display: flex;
    justify-content: space-between;
    padding: 0 12px;
    margin-top: 4px;
    font-size: 9.5px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--mute-soft);
    font-weight: 600;
}

/* Add-another-rig button */
#rvbt-bm-qm-root .qm-rig-add {
    display: flex;
    align-items: center;
    gap: 16px;
    background: transparent;
    border: 2px dashed var(--gold);
    border-radius: var(--r-xl);
    padding: 16px 22px;
    width: 100%;
    max-width: 900px;
    margin: 16px auto 18px;
    cursor: pointer;
    color: var(--gold-deep, #8E7344);
    transition: background 0.18s ease, transform 0.12s ease;
    text-align: left;
    font-family: inherit;
}

#rvbt-bm-qm-root .qm-rig-add:hover {
    background: var(--gold-mist);
    transform: translateY(-1px);
}

#rvbt-bm-qm-root .qm-rig-add-plus {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: var(--gold);
    color: var(--ink);
    font-size: 22px;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    flex-shrink: 0;
    box-shadow: 0 4px 10px rgba(176, 146, 94, 0.35);
}

#rvbt-bm-qm-root .qm-rig-add-text {
    display: flex;
    flex-direction: column;
    gap: 2px;
    line-height: 1.3;
}

#rvbt-bm-qm-root .qm-rig-add-title {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 18px;
    color: var(--ink);
}

#rvbt-bm-qm-root .qm-rig-add-sub {
    font-size: 11px;
    letter-spacing: 0.06em;
    color: var(--mute);
}

/* Compact summary state — premium muted card that blends into the cream paper */
#rvbt-bm-qm-root .qm-rig-summary {
    display: none;
    align-items: center;
    gap: 18px;
    position: relative;
    z-index: 1;
}
#rvbt-bm-qm-root .qm-rig-card[data-collapsed="true"] {
    padding: 14px 22px 14px 26px;
    background: linear-gradient(180deg, rgba(255, 254, 251, 0.55) 0%, rgba(244, 238, 226, 0.5) 100%);
    border: 1px solid rgba(176, 146, 94, 0.16);
    border-radius: var(--r-lg);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.65),
        inset 0 -1px 0 rgba(176, 146, 94, 0.06);
    position: relative;
    overflow: hidden;
    transition: background 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;
}

/* Editorial gold rule on the left edge — like a fine letterhead mark */
#rvbt-bm-qm-root .qm-rig-card[data-collapsed="true"]::before {
    content: "";
    position: absolute;
    left: 0;
    top: 20%;
    bottom: 20%;
    width: 2px;
    background: linear-gradient(180deg,
        transparent 0%,
        rgba(176, 146, 94, 0.5) 22%,
        rgba(176, 146, 94, 0.75) 50%,
        rgba(176, 146, 94, 0.5) 78%,
        transparent 100%);
}

/* Soft warm-paper sheen at the top */
#rvbt-bm-qm-root .qm-rig-card[data-collapsed="true"]::after {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse 80% 60% at 50% -20%, rgba(255, 250, 235, 0.4) 0%, transparent 70%);
    pointer-events: none;
    z-index: 0;
}

#rvbt-bm-qm-root .qm-rig-card[data-collapsed="true"]:hover {
    background: linear-gradient(180deg, rgba(255, 254, 251, 0.85) 0%, rgba(248, 242, 228, 0.78) 100%);
    border-color: rgba(176, 146, 94, 0.3);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.75),
        0 4px 14px rgba(176, 146, 94, 0.1);
}

#rvbt-bm-qm-root .qm-rig-card[data-collapsed="true"] .qm-rig-summary { display: flex; }
#rvbt-bm-qm-root .qm-rig-card[data-collapsed="true"] .qm-rig-card-head,
#rvbt-bm-qm-root .qm-rig-card[data-collapsed="true"] .qm-rig-types,
#rvbt-bm-qm-root .qm-rig-card[data-collapsed="true"] .qm-rig-length { display: none; }

#rvbt-bm-qm-root .qm-rig-summary-icon {
    flex-shrink: 0;
    width: 60px;
    height: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--gold-deep);
    opacity: 0.78;
}
#rvbt-bm-qm-root .qm-rig-summary-icon svg { width: 100%; height: 100%; }

#rvbt-bm-qm-root .qm-rig-summary-text {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
    line-height: 1.15;
}

#rvbt-bm-qm-root .qm-rig-summary-name {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 23px;
    font-weight: 500;
    color: var(--ink);
    line-height: 1.05;
    letter-spacing: 0.005em;
}

#rvbt-bm-qm-root .qm-rig-summary-meta {
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 10.5px;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--mute);
    font-weight: 500;
}

#rvbt-bm-qm-root .qm-rig-summary-edit,
#rvbt-bm-qm-root .qm-rig-summary-remove {
    flex-shrink: 0;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    border: 1px solid rgba(176, 146, 94, 0.22);
    background: rgba(255, 254, 252, 0.55);
    color: var(--ink-soft);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: color 0.18s ease, border-color 0.18s ease, background 0.18s ease, transform 0.18s ease, box-shadow 0.18s ease;
    padding: 0;
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
}
#rvbt-bm-qm-root .qm-rig-summary-edit svg { width: 14px; height: 14px; }
#rvbt-bm-qm-root .qm-rig-summary-edit:hover {
    color: var(--gold-deep);
    border-color: var(--gold);
    background: var(--gold-mist);
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(176, 146, 94, 0.2);
}
#rvbt-bm-qm-root .qm-rig-summary-remove {
    font-size: 22px;
    line-height: 1;
    font-weight: 300;
}
#rvbt-bm-qm-root .qm-rig-summary-remove:hover {
    color: #C57878;
    border-color: #C57878;
    background: #FFF1F1;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(197, 120, 120, 0.18);
}

@media (max-width: 720px) {
    #rvbt-bm-qm-root .qm-rig-types { grid-template-columns: repeat(2, 1fr); }
    #rvbt-bm-qm-root .qm-rig-card { padding: 18px 16px 22px; }
    #rvbt-bm-qm-root .qm-rig-summary-name { font-size: 19px; }
}
@media (max-width: 480px) {
    #rvbt-bm-qm-root .qm-rig-add { flex-direction: column; text-align: center; gap: 10px; padding: 18px; }
    #rvbt-bm-qm-root .qm-rig-summary { gap: 10px; }
    #rvbt-bm-qm-root .qm-rig-summary-icon { width: 44px; height: 26px; }
}

/* Smart size-mismatch warning under the slider */
#rvbt-bm-qm-root .qm-rig-warning {
    margin-top: 14px;
    padding: 10px 14px 10px 36px;
    border-radius: var(--r-md);
    font-family: 'Inter RVBT', 'Inter', system-ui, -apple-system, sans-serif;
    font-size: 13px;
    line-height: 1.45;
    color: var(--ink);
    background: linear-gradient(180deg, #FFF8E5, #FAEFCD);
    border: 1px solid var(--gold);
    box-shadow: 0 2px 8px rgba(176, 146, 94, 0.12);
    position: relative;
}
#rvbt-bm-qm-root .qm-rig-warning::before {
    content: "!";
    position: absolute;
    left: 10px;
    top: 10px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: var(--gold);
    color: var(--ivory);
    font-family: 'Inter RVBT', 'Inter', sans-serif;
    font-weight: 700;
    font-size: 11px;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
}
#rvbt-bm-qm-root .qm-rig-warning[data-tone="long"] {
    background: linear-gradient(180deg, #FFF1F1, #FFE4E4);
    border-color: #C57878;
}
#rvbt-bm-qm-root .qm-rig-warning[data-tone="long"]::before {
    background: #C57878;
}

/* ──────────────────────────────────────────────────────────────────
   Step 2 — Who's coming with you (Adults / Children / Pets)
   ────────────────────────────────────────────────────────────────── */

#rvbt-bm-qm-root .qm-people {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
    margin-top: 18px;
    margin-bottom: 18px;
}

#rvbt-bm-qm-root .qm-people-tile {
    background: linear-gradient(180deg, #ffffff14 0%, rgba(255, 255, 255, 0.6) 100%);
    border: 1px solid var(--line-soft);
    border-radius: var(--r-xl);
    padding: 26px 22px 22px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 14px;
    box-shadow: var(--shadow-md);
    transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
    position: relative;
    overflow: hidden;
}
#rvbt-bm-qm-root .qm-people-tile::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse 70% 55% at 50% -10%, rgba(255,250,235,0.5) 0%, transparent 70%);
    pointer-events: none;
}
#rvbt-bm-qm-root .qm-people-tile:hover {
    transform: translateY(-2px);
    border-color: rgba(176, 146, 94, 0.3);
    box-shadow: 0 6px 18px rgba(176, 146, 94, 0.14), 0 1px 3px rgba(80, 60, 30, 0.05);
}

#rvbt-bm-qm-root .qm-people-icon {
    width: 70px;
    height: 70px;
    color: var(--gold-deep);
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    z-index: 1;
}
#rvbt-bm-qm-root .qm-people-icon svg {
    width: 100%;
    height: 100%;
    opacity: 0.85;
}

#rvbt-bm-qm-root .qm-people-text {
    display: flex;
    flex-direction: column;
    gap: 3px;
    position: relative;
    z-index: 1;
}
#rvbt-bm-qm-root .qm-people-name {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 26px;
    color: var(--ink);
    line-height: 1.05;
    font-weight: 500;
}
#rvbt-bm-qm-root .qm-people-sub {
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 11px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--mute);
}

#rvbt-bm-qm-root .qm-people-counter {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-top: 4px;
    position: relative;
    z-index: 1;
}
#rvbt-bm-qm-root .qm-people-btn {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 1px solid var(--line-soft);
    background: rgba(255,255,255,0.85);
    color: var(--ink-soft);
    font-size: 22px;
    line-height: 1;
    font-weight: 300;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: color 0.18s ease, border-color 0.18s ease, background 0.18s ease, transform 0.18s ease, box-shadow 0.18s ease;
    padding: 0;
}
#rvbt-bm-qm-root .qm-people-btn:hover {
    color: var(--gold-deep);
    border-color: var(--gold);
    background: var(--gold-mist);
    transform: translateY(-1px);
    box-shadow: 0 3px 10px rgba(176, 146, 94, 0.18);
}
#rvbt-bm-qm-root .qm-people-btn:active {
    transform: translateY(0);
}
#rvbt-bm-qm-root .qm-people-val {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 38px;
    font-weight: 500;
    color: var(--ink);
    min-width: 36px;
    text-align: center;
    line-height: 1;
}

@media (max-width: 720px) {
    #rvbt-bm-qm-root .qm-people { grid-template-columns: 1fr; gap: 12px; }
    #rvbt-bm-qm-root .qm-people-tile { flex-direction: row; text-align: left; padding: 18px 20px; }
    #rvbt-bm-qm-root .qm-people-tile .qm-people-text { flex: 1; align-items: flex-start; }
    #rvbt-bm-qm-root .qm-people-icon { width: 50px; height: 50px; flex-shrink: 0; }
    #rvbt-bm-qm-root .qm-people-name { font-size: 22px; }
}

/* ──────────────────────────────────────────────────────────────────
   Step 2 — Per-person pricing notice
   ────────────────────────────────────────────────────────────────── */
#rvbt-bm-qm-root .qm-people-info {
    margin-top: 6px;
    padding: 16px 22px 18px;
    background: linear-gradient(180deg, rgba(255, 254, 251, 0.55) 0%, rgba(244, 238, 226, 0.5) 100%);
    border: 1px solid rgba(176, 146, 94, 0.16);
    border-radius: var(--r-lg);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.65);
    position: relative;
    overflow: hidden;
}
#rvbt-bm-qm-root .qm-people-info::before {
    content: "";
    position: absolute;
    left: 0; top: 16%; bottom: 16%;
    width: 2px;
    background: linear-gradient(180deg,
        transparent 0%,
        rgba(176, 146, 94, 0.55) 22%,
        rgba(176, 146, 94, 0.78) 50%,
        rgba(176, 146, 94, 0.55) 78%,
        transparent 100%);
}
#rvbt-bm-qm-root .qm-people-info-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 10px;
    padding-bottom: 8px;
    border-bottom: 1px solid rgba(176, 146, 94, 0.14);
}
#rvbt-bm-qm-root .qm-people-info-title {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 19px;
    color: var(--ink);
    font-weight: 500;
}
#rvbt-bm-qm-root .qm-people-info-eyebrow {
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 10px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--mute);
}
#rvbt-bm-qm-root .qm-people-info-rows {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}
#rvbt-bm-qm-root .qm-people-info-row {
    display: flex;
    flex-direction: column;
    gap: 3px;
    align-items: flex-start;
}
#rvbt-bm-qm-root .qm-people-info-label {
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 10.5px;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--mute);
    font-weight: 500;
}
#rvbt-bm-qm-root .qm-people-info-value {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 18px;
    color: var(--ink);
    line-height: 1.1;
}
#rvbt-bm-qm-root .qm-people-info-value[data-cost="paid"] {
    color: var(--gold-deep);
}

@media (max-width: 720px) {
    #rvbt-bm-qm-root .qm-people-info-rows { grid-template-columns: 1fr; gap: 8px; }
    #rvbt-bm-qm-root .qm-people-info-row { flex-direction: row; justify-content: space-between; align-items: center; }
}

/* ──────────────────────────────────────────────────────────────────
   Step 2 — Vehicles & parking-pass advisory
   ────────────────────────────────────────────────────────────────── */
#rvbt-bm-qm-root .qm-vehicles {
    margin-top: 14px;
    padding: 18px 22px;
    background: linear-gradient(180deg, rgba(255, 254, 251, 0.6) 0%, rgba(247, 241, 226, 0.55) 100%);
    border: 1px solid rgba(176, 146, 94, 0.18);
    border-radius: var(--r-lg);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
    position: relative;
    overflow: hidden;
}
#rvbt-bm-qm-root .qm-vehicles[hidden] { display: none; }
#rvbt-bm-qm-root .qm-vehicles-head {
    display: flex;
    align-items: center;
    gap: 16px;
}
#rvbt-bm-qm-root .qm-vehicles-icon {
    flex-shrink: 0;
    width: 64px;
    height: 36px;
    color: var(--gold-deep);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0.85;
}
#rvbt-bm-qm-root .qm-vehicles-icon svg { width: 100%; height: 100%; }
#rvbt-bm-qm-root .qm-vehicles-text {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
    line-height: 1.15;
}
#rvbt-bm-qm-root .qm-vehicles-name {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 22px;
    color: var(--ink);
    font-weight: 500;
}
#rvbt-bm-qm-root .qm-vehicles-sub {
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 11px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--mute);
}
#rvbt-bm-qm-root .qm-vehicles-counter {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
}
#rvbt-bm-qm-root .qm-vehicles-note {
    margin-top: 14px;
    padding-top: 12px;
    border-top: 1px solid rgba(176, 146, 94, 0.14);
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 12.5px;
    line-height: 1.5;
    color: var(--ink-soft);
}
#rvbt-bm-qm-root .qm-vehicles-note strong {
    color: var(--gold-deep);
    font-weight: 600;
}

@media (max-width: 720px) {
    #rvbt-bm-qm-root .qm-vehicles-head { flex-wrap: wrap; }
    #rvbt-bm-qm-root .qm-vehicles-counter { width: 100%; justify-content: flex-end; }
}

/* Standalone variant — when vehicles owns the whole step (Step 3) */
#rvbt-bm-qm-root .qm-vehicles--standalone {
    margin-top: 18px;
    padding: 26px 26px;
    box-shadow: var(--shadow-md);
}

/* Empty-state shown on Step 3 when no parking pass is configured */
#rvbt-bm-qm-root .qm-vehicles-empty {
    margin-top: 18px;
    padding: 22px 26px;
    background: linear-gradient(180deg, rgba(232, 244, 232, 0.4) 0%, rgba(218, 235, 218, 0.35) 100%);
    border: 1px solid rgba(126, 139, 122, 0.3);
    border-radius: var(--r-lg);
    display: flex;
    align-items: center;
    gap: 16px;
}
#rvbt-bm-qm-root .qm-vehicles-empty[hidden] { display: none; }
#rvbt-bm-qm-root .qm-vehicles-empty-mark {
    flex-shrink: 0;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: #7E8B7A;
    color: #fff;
    font-size: 20px;
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}
#rvbt-bm-qm-root .qm-vehicles-empty-title {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 22px;
    color: var(--ink);
    line-height: 1.1;
    font-weight: 500;
}
#rvbt-bm-qm-root .qm-vehicles-empty-sub {
    margin-top: 3px;
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 12px;
    color: var(--ink-soft);
    line-height: 1.4;
}

/* ────────────────────────────────────────────────────────────────────────────
   Step 1 date picker — slides in when Arrive/Depart/Nights is clicked.
   .qm-stage acts as the positioning context; .ymap-wrap exits up & out, the
   .qm-date-picker fades up into place. Z-index keeps the exiting ymap under
   the .qm-q heading (which has its own cream background to occlude).
   ──────────────────────────────────────────────────────────────────────────── */

/* Clickable affordance on the left date column */
#rvbt-bm-qm-root .qm-pickers--stack .qm-date,
#rvbt-bm-qm-root .qm-pickers--stack .qm-nights {
    cursor: pointer;
    transition: background .25s ease, border-color .25s ease, transform .2s ease;
}
#rvbt-bm-qm-root .qm-pickers--stack .qm-date:hover,
#rvbt-bm-qm-root .qm-pickers--stack .qm-nights:hover {
    transform: translateX(2px);
    border-color: rgba(176, 146, 94, 0.45);
}
#rvbt-bm-qm-root .qm-pickers--stack .qm-date.is-editing,
#rvbt-bm-qm-root .qm-pickers--stack .qm-nights.is-editing {
    border-color: var(--gold);
    box-shadow: 0 8px 22px -14px rgba(176, 146, 94, 0.45);
}

/* Make .qm-stage a stacking + positioning context */
#rvbt-bm-qm-root .qm-stage {
    position: relative;
    isolation: isolate;
}

/* ymap-wrap now spans the full single-column stage (date-picker removed). */
#rvbt-bm-qm-root .qm-stage > .ymap-wrap {
    grid-column: 1;
    grid-row: 1;
}

/* Default visible state for ymap-wrap (already styled elsewhere) */
#rvbt-bm-qm-root .qm-stage > .ymap-wrap {
    position: relative;
    z-index: 1;
    transform: translateY(0);
    opacity: 1;
    visibility: visible;
    transition-delay: 0s;
}

/* Picker overlays the EXACT same grid cell as .ymap-wrap (column 2, full
   row span on desktop). `grid-column: 2` already places it in the carousel
   column — its absolutely-positioned containing block is the GRID AREA,
   not the stage's padding-box, so we do NOT add a horizontal offset. */
#rvbt-bm-qm-root .qm-stage > .qm-date-picker {
    position: absolute;
    inset: 0;
    z-index: 2;
    transform: translateY(24px);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    display: grid;
    grid-template-rows: auto auto;
    gap: 10px;
    align-content: start;
}
/* Override `hidden` HTML attribute so picker stays in DOM (class drives state) */
#rvbt-bm-qm-root .qm-stage > .qm-date-picker[hidden] {
    display: grid;
}

/* Picker-mode toggle: ymap exits up & under heading; picker rises in */
#rvbt-bm-qm-root .qm-stage[data-bm-picker-mode="1"] > .ymap-wrap {
    transform: translateY(-120%);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition-delay: 0s, 0s, .55s;
}
#rvbt-bm-qm-root .qm-stage[data-bm-picker-mode="1"] > .qm-date-picker {
    transform: translateY(0);
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transition-delay: .2s, .2s, 0s;
}

/* ─── Date picker head — Arrive / Depart tabs + nights field + close ────── */
/* dp-head is kept in DOM for JS refs but visually hidden — the left date
   column already shows Arrive/Depart/Nights so a duplicate header here is
   redundant. The close button is rendered as a floating element instead. */
#rvbt-bm-qm-root .qm-date-picker .dp-head {
    display: none !important;
}
/* Floating close button — top-right corner of the picker overlay */
#rvbt-bm-qm-root .qm-date-picker .dp-close-float {
    position: absolute;
    top: 8px;
    right: 8px;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    border: 1px solid var(--line);
    background: var(--ivory);
    color: var(--mute);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background .15s ease, border-color .15s ease, color .15s ease;
    padding: 0;
    z-index: 4;
}
#rvbt-bm-qm-root .qm-date-picker .dp-close-float:hover {
    border-color: var(--ink);
    color: var(--ink);
    background: rgba(26, 20, 16, 0.04);
}
#rvbt-bm-qm-root .qm-date-picker .dp-tabs {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 14px;
}
#rvbt-bm-qm-root .qm-date-picker .dp-tab {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
    padding: 8px 14px;
    border-radius: 10px;
    border: 1px solid transparent;
    background: transparent;
    cursor: pointer;
    transition: background .2s ease, border-color .2s ease;
    text-align: left;
    min-width: 0;
}
#rvbt-bm-qm-root .qm-date-picker .dp-tab:not(.dp-tab--nights):hover {
    background: rgba(245, 242, 240, 0.6);
}
#rvbt-bm-qm-root .qm-date-picker .dp-tab.is-active {
    background: linear-gradient(229deg, #ffffff 0%, #f4eddb 100%);
    border-color: rgba(176, 146, 94, 0.45);
    box-shadow: 0 6px 18px -12px rgba(176, 146, 94, 0.45);
}
#rvbt-bm-qm-root .qm-date-picker .dp-tab-label {
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 9px;
    letter-spacing: 0.24em;
    text-transform: uppercase;
    font-weight: 600;
    color: var(--mute);
    line-height: 1;
}
#rvbt-bm-qm-root .qm-date-picker .dp-tab.is-active .dp-tab-label {
    color: #8b6d3a;
}
#rvbt-bm-qm-root .qm-date-picker .dp-tab-value {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 22px;
    color: var(--ink);
    line-height: 1.1;
    letter-spacing: -0.01em;
}
#rvbt-bm-qm-root .qm-date-picker .dp-tab.is-active .dp-tab-value {
    color: #8b6d3a;
}
#rvbt-bm-qm-root .qm-date-picker .dp-tab-arrow {
    color: var(--gold);
    font-family: 'Cormorant RVBT', Georgia, serif;
    font-size: 22px;
}
#rvbt-bm-qm-root .qm-date-picker .dp-tab--nights {
    margin-left: auto;
    cursor: default;
    border: 1px solid var(--line-soft);
    background: transparent;
    padding: 8px 12px;
}
#rvbt-bm-qm-root .qm-date-picker .dp-nights-input {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}
#rvbt-bm-qm-root .qm-date-picker .dp-step {
    width: 26px;
    height: 26px;
    border-radius: 50%;
    border: 1px solid var(--line);
    background: transparent;
    color: var(--ink-soft);
    font-size: 14px;
    line-height: 1;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background .15s ease, border-color .15s ease, color .15s ease;
    padding: 0;
}
#rvbt-bm-qm-root .qm-date-picker .dp-step:hover {
    background: rgba(176, 146, 94, 0.08);
    border-color: var(--gold);
    color: var(--gold);
}
#rvbt-bm-qm-root .qm-date-picker [data-bm-dp-nights-input] {
    width: 44px;
    text-align: center;
    border: 0;
    background: transparent;
    font-family: 'Cormorant RVBT', Georgia, serif;
    font-size: 22px;
    color: var(--ink);
    -moz-appearance: textfield;
    outline: none;
    padding: 0;
}
#rvbt-bm-qm-root .qm-date-picker [data-bm-dp-nights-input]::-webkit-outer-spin-button,
#rvbt-bm-qm-root .qm-date-picker [data-bm-dp-nights-input]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
#rvbt-bm-qm-root .qm-date-picker .dp-close {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    border: 1px solid var(--line);
    background: transparent;
    color: var(--mute);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background .15s ease, border-color .15s ease, color .15s ease;
    padding: 0;
}
#rvbt-bm-qm-root .qm-date-picker .dp-close:hover {
    border-color: var(--ink);
    color: var(--ink);
    background: rgba(26, 20, 16, 0.04);
}

/* ─── Calendar (two months side-by-side for easy cross-month range select) ── */
#rvbt-bm-qm-root .qm-date-picker .dp-calendar {
    position: relative;
    background: var(--paper);
    border: 1px solid var(--line-soft);
    border-radius: var(--r-md);
    box-shadow: var(--shadow-sm);
    padding: 22px 56px 18px;
}
/* Four-month strip — months flex-fill the calendar width so each owns a
   generous column (~240px wide). Vertical hairline dividers separate them
   with a confident-but-elegant rule that's clearly visible (not a phantom). */
#rvbt-bm-qm-root .qm-date-picker .dp-months {
    display: flex;
    align-items: stretch;
    gap: 0;
    width: 100%;
}
#rvbt-bm-qm-root .qm-date-picker .dp-cal-month {
    flex: 1 1 0;
    min-width: 0;
    padding: 0 22px;
    position: relative;
}
#rvbt-bm-qm-root .qm-date-picker .dp-cal-month:first-child { padding-left: 4px; }
#rvbt-bm-qm-root .qm-date-picker .dp-cal-month:last-child  { padding-right: 4px; }
/* Vertical divider between months — visible but soft. Sits centered in the
   inter-month gutter and fades at the very top/bottom for an editorial feel. */
#rvbt-bm-qm-root .qm-date-picker .dp-cal-month + .dp-cal-month::before {
    content: '';
    position: absolute;
    left: 0;
    top: 6px;
    bottom: 6px;
    width: 1px;
    background: linear-gradient(
        to bottom,
        transparent 0%,
        rgba(26, 20, 16, 0.18) 14%,
        rgba(26, 20, 16, 0.18) 86%,
        transparent 100%
    );
}
/* Nav buttons anchored at the month-title row baseline, inset from card edge */
#rvbt-bm-qm-root .qm-date-picker .dp-nav {
    position: absolute;
    top: 22px;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    border: 1px solid var(--line);
    background: var(--paper);
    color: var(--ink-soft);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background .15s ease, border-color .15s ease, color .15s ease, transform .15s ease;
    padding: 0;
    z-index: 2;
}
#rvbt-bm-qm-root .qm-date-picker .dp-nav--prev { left: 14px; }
#rvbt-bm-qm-root .qm-date-picker .dp-nav--next { right: 14px; }
#rvbt-bm-qm-root .qm-date-picker .dp-nav:active { transform: scale(0.94); }
#rvbt-bm-qm-root .qm-date-picker .dp-nav:hover {
    border-color: var(--gold);
    color: var(--gold);
    background: rgba(176, 146, 94, 0.06);
}
#rvbt-bm-qm-root .qm-date-picker .dp-month-title {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 18px;
    color: var(--ink);
    line-height: 1;
    letter-spacing: 0.01em;
    text-align: center;
    margin-bottom: 12px;
    font-weight: 500;
}
#rvbt-bm-qm-root .qm-date-picker .dp-dow {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 0;
    margin-bottom: 6px;
    padding-bottom: 6px;
    border-bottom: 1px solid rgba(26, 20, 16, 0.08);
}
#rvbt-bm-qm-root .qm-date-picker .dp-dow span {
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 9px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--mute);
    font-weight: 600;
    text-align: center;
    line-height: 1.4;
}
#rvbt-bm-qm-root .qm-date-picker .dp-grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 0;
}
#rvbt-bm-qm-root .qm-date-picker .dp-day {
    aspect-ratio: 1 / 1;
    border: 1px solid transparent;
    background: transparent;
    color: var(--ink);
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 12px;
    font-weight: 500;
    font-variant-numeric: tabular-nums;
    line-height: 1;
    border-radius: 8px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background .15s ease, color .15s ease, transform .12s ease, box-shadow .15s ease;
    padding: 0;
    min-width: 0;
}
#rvbt-bm-qm-root .qm-date-picker .dp-day:hover:not(:disabled):not(.is-other) {
    background: rgba(176, 146, 94, 0.14);
    color: #6e5527;
    border-color: rgba(176, 146, 94, 0.35);
}
#rvbt-bm-qm-root .qm-date-picker .dp-day.is-other {
    color: var(--mute-soft);
    opacity: 0.35;
    cursor: default;
}
#rvbt-bm-qm-root .qm-date-picker .dp-day.is-today {
    color: #8b6d3a;
    font-weight: 700;
}
#rvbt-bm-qm-root .qm-date-picker .dp-day.is-today::after {
    content: '';
    position: absolute;
    bottom: 3px;
    left: 50%;
    transform: translateX(-50%);
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: var(--gold);
}
#rvbt-bm-qm-root .qm-date-picker .dp-day {
    position: relative;
}
#rvbt-bm-qm-root .qm-date-picker .dp-day.is-range {
    background: rgba(176, 146, 94, 0.22);
    color: #6e5527;
    border-radius: 0;
    font-weight: 600;
}
#rvbt-bm-qm-root .qm-date-picker .dp-day.is-arrive,
#rvbt-bm-qm-root .qm-date-picker .dp-day.is-depart {
    background: var(--ink);
    color: var(--ivory);
    border-color: var(--ink);
    border-radius: 8px;
    box-shadow: 0 6px 18px -8px rgba(26, 20, 16, 0.55);
    font-weight: 600;
    z-index: 1;
}
#rvbt-bm-qm-root .qm-date-picker .dp-day.is-arrive { border-top-right-radius: 0; border-bottom-right-radius: 0; }
#rvbt-bm-qm-root .qm-date-picker .dp-day.is-depart { border-top-left-radius: 0; border-bottom-left-radius: 0; }
/* Same-day stay (Arrive == Depart): keep full rounding */
#rvbt-bm-qm-root .qm-date-picker .dp-day.is-arrive.is-depart {
    border-radius: var(--r-sm);
}
#rvbt-bm-qm-root .qm-date-picker .dp-day:disabled {
    cursor: not-allowed;
    opacity: 0.3;
}

/* ─── Quick-preset pills ───────────────────────────────────────────────── */
#rvbt-bm-qm-root .qm-date-picker .dp-quick {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 4px 4px 0;
    flex-wrap: wrap;
}
#rvbt-bm-qm-root .qm-date-picker .dp-quick-label {
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 9px;
    letter-spacing: 0.24em;
    text-transform: uppercase;
    color: var(--mute);
    font-weight: 600;
    margin-right: 4px;
}
#rvbt-bm-qm-root .qm-date-picker .dp-quick-pill {
    padding: 6px 12px;
    border-radius: 999px;
    border: 1px solid var(--line);
    background: transparent;
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 10px;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    font-weight: 600;
    color: var(--ink-soft);
    cursor: pointer;
    transition: all .15s ease;
    line-height: 1;
}
#rvbt-bm-qm-root .qm-date-picker .dp-quick-pill:hover {
    border-color: var(--gold);
    color: var(--gold);
    background: rgba(176, 146, 94, 0.06);
}

/* ────────────────────────────────────────────────────────────────────────────
   Seasonal backgrounds for mini month cards
   Dec / Jan / Feb → winter, Mar / Apr / May → spring,
   Jun / Jul / Aug → summer, Sep / Oct / Nov → fall.
   Each card uses a full-bleed background image + gradient overlay for legibility.
   ──────────────────────────────────────────────────────────────────────────── */

#rvbt-bm-qm-root .mini[data-season] {
    position: relative;
    overflow: hidden;
    background-size: cover;
    background-position: center;
    border: 1px solid transparent;
    box-shadow: 0 10px 24px -16px rgba(26, 20, 16, 0.35);
    /* Month name AT TOP, calendar grid below */
    flex-direction: column;
    justify-content: flex-start;
    max-height: 500px;
    min-height: 320px;
    /* 348 = 368 (gold border height) - 20 (10px gap on top + 10px gap on bottom).
       Card sits inside the gold border with 10px breathing room all around. */
    height: 348px;
    padding: 16px 14px 18px;
    gap: 14px;
}

/* Specificity (1,2,0) beats .mini:hover (1,1,1) so the photo persists on hover. */
#rvbt-bm-qm-root .mini[data-season="winter"] { background-image: url('../../assets/img/seasons/winter.jpg'); }
#rvbt-bm-qm-root .mini[data-season="spring"] { background-image: url('../../assets/img/seasons/spring.jpg'); }
#rvbt-bm-qm-root .mini[data-season="summer"] { background-image: url('../../assets/img/seasons/summer.jpg'); }
#rvbt-bm-qm-root .mini[data-season="fall"]   { background-image: url('../../assets/img/seasons/fall.jpg'); }

/* Cream/gold overlay matching the featured panel — soft radial at top with a
   translucent linear wash so the seasonal photo bleeds through warmly. */
#rvbt-bm-qm-root .mini[data-season]::before {
    content: "";
    position: absolute;
    inset: 1px;             /* leave the 1px border zone uncovered */
    z-index: 0;
    border-radius: inherit;
    /* Top 20% gets a stronger cream wash (image reads lighter); bottom gets a
       subtle ink tint (image reads darker); middle stays nearly clear. */
    background:
        radial-gradient(120% 120% at 50% 0%, rgb(255 250 235 / 25%) 0%, transparent 70%),
        linear-gradient(180deg,
            rgba(251, 248, 244, 0.52) 0%,
            rgba(244, 236, 217, 0.10) 22%,
            rgba(244, 236, 217, 0.05) 60%,
            rgba(26, 20, 16, 0.20) 100%);
    transition: background .3s ease;
}

/* Inner content sits above the overlay */
#rvbt-bm-qm-root .mini[data-season] > * {
    position: relative;
    z-index: 1;
}

/* Hover: brighten + lift more */
#rvbt-bm-qm-root .mini[data-season]:hover {
    border-color: var(--gold);
    transform: translateY(-3px);
    background-color: transparent;
    box-shadow: 0 18px 36px -18px rgba(26, 20, 16, 0.5);
}
/* Hover: light cream wash — image stays clearly visible, just gently
   washed for a dreamier look. Fonts darken below for legibility. */
#rvbt-bm-qm-root .mini[data-season]:hover::before {
    background:
        radial-gradient(120% 120% at 50% 0%, rgba(255, 250, 235, 0.45) 0%, rgba(255, 250, 235, 0.22) 70%),
        linear-gradient(180deg,
            rgba(251, 248, 244, 0.42) 0%,
            rgba(244, 236, 217, 0.28) 50%,
            rgba(244, 236, 217, 0.38) 100%);
}

/* Hover: darken the text/labels for legibility on the lighter overlay */
#rvbt-bm-qm-root .mini[data-season]:hover .nm        { color: #2d2316; text-shadow: 0 1px 2px rgba(255, 250, 235, 0.6); }
#rvbt-bm-qm-root .mini[data-season]:hover .occ-num   { color: #2d2316; text-shadow: none; }
#rvbt-bm-qm-root .mini[data-season]:hover .occ-num small { color: #654f2a; text-shadow: none; }
#rvbt-bm-qm-root .mini[data-season]:hover .occ-label,
#rvbt-bm-qm-root .mini[data-season]:hover .occ-tier  { color: #2d2316; }
#rvbt-bm-qm-root .mini[data-season]:hover .occ-foot-line { background: linear-gradient(90deg, rgba(45, 35, 22, 0.55), transparent); }

/* Month label — full name, larger Cormorant serif */
#rvbt-bm-qm-root .mini[data-season] .nm {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 24px;
    font-weight: 600;
    letter-spacing: 0.015em;
    text-transform: none;
    color: #654f2a;
    text-align: center;
    line-height: 1.05;
    text-shadow: 0 1px 2px rgba(255, 250, 235, 0.5);
    padding: 4px 2px 2px;
}

/* Calendar grid sits AT TOP of card (parent .mini is flex column-reverse).
   Lives directly on the cream/gold overlay — no frosted backdrop, like the
   featured panel. The heat-map cells provide their own contrast. */
#rvbt-bm-qm-root .mini[data-season] .mini-grid {
    padding: 4px 2px 0;
    background: transparent;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    border: 0;
    box-shadow: none;
    gap: 3px;
}

/* Empty leading/trailing cells stay invisible */
#rvbt-bm-qm-root .mini[data-season] .mini-grid .d {
    background: transparent;
    border-radius: 3px;
    transition: background .2s ease, transform .12s ease;
}

/* ─── Heat-map scale ────────────────────────────────────────────────────────
   Painted dynamically by wireQmHeatMap on Step 1 load. Cells with `.has` get
   a heat class h1..h5 — gradient ivory → gold → ink. */
#rvbt-bm-qm-root .mini[data-season] .mini-grid .d.has {
    /* fallback for cells that haven't been painted yet */
    background: rgba(251, 248, 244, 0.45);
}
#rvbt-bm-qm-root .mini[data-season] .mini-grid .d.h1 {
    background: rgba(251, 248, 244, 0.78);    /* ivory — lots of availability */
}
#rvbt-bm-qm-root .mini[data-season] .mini-grid .d.h2 {
    background: rgba(239, 230, 211, 0.85);    /* gold-mist — comfortable */
}
#rvbt-bm-qm-root .mini[data-season] .mini-grid .d.h3 {
    background: rgb(203 190 168 / 51%);
}
#rvbt-bm-qm-root .mini[data-season] .mini-grid .d.h4 {
    background: var(--gold);                  /* gold — high demand */
    box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.25);
}
#rvbt-bm-qm-root .mini[data-season] .mini-grid .d.h5 {
    background: #473c3682;
    box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.3);
}
#rvbt-bm-qm-root .mini[data-season] .mini-grid .d.booked {
    background: rgba(26, 20, 16, 0.65);        /* ink — booked solid */
    box-shadow: 0 0 0 1px rgba(176, 146, 94, 0.25);
}
/* Past dates appear muted */
#rvbt-bm-qm-root .mini[data-season] .mini-grid .d.past {
    background: rgba(251, 248, 244, 0.12);
}
#rvbt-bm-qm-root .mini[data-season]:hover .mini-grid .d.h1 { transform: scale(1.05); }
#rvbt-bm-qm-root .mini[data-season]:hover .mini-grid .d.h2 { transform: scale(1.05); }
#rvbt-bm-qm-root .mini[data-season]:hover .mini-grid .d.h3 { transform: scale(1.05); }
#rvbt-bm-qm-root .mini[data-season]:hover .mini-grid .d.h4 { transform: scale(1.05); }
#rvbt-bm-qm-root .mini[data-season]:hover .mini-grid .d.h5 { transform: scale(1.05); }

#rvbt-bm-qm-root .mini[data-season] .mini-grid .d.range {
    background: var(--gold);
    box-shadow: 0 0 0 1px rgba(176, 146, 94, 0.5);
}
#rvbt-bm-qm-root .mini[data-season] .mini-grid .d.endpoint {
    background: var(--ink);
    box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.45);
}

/* ────────────────────────────────────────────────────────────────────────────
   Month occupancy meter — replaces the per-day .mini-grid on seasonal cards.
   A single gradient progress bar showing overall booked-% for the whole month,
   styled in the warm cream/gold/ink palette to match the editorial page.
   .ymap-feature is untouched (still shows the full per-day calendar).
   ──────────────────────────────────────────────────────────────────────────── */

/* Hide the per-day heat-map grid on the mini cards — replaced by the meter. */
#rvbt-bm-qm-root .mini[data-season] .mini-grid {
    display: none;
}

#rvbt-bm-qm-root .mini[data-season] .month-occ {
    position: relative;
    z-index: 1;
    margin-top: auto;        /* push to the bottom of the card */
    padding: 14px 4px 4px;
    display: flex;
    flex-direction: column;
    gap: 14px;
}

/* Caption row above the bar — booked % + tier badge */
#rvbt-bm-qm-root .mini[data-season] .month-occ-meta {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 10px;
}

#rvbt-bm-qm-root .mini[data-season] .occ-num {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 38px;
    font-weight: 600;
    color: #ffffff;
    line-height: 1;
    letter-spacing: -0.02em;
    text-shadow: 0 1px 4px rgba(26, 20, 16, 0.55), 0 1px 2px rgba(26, 20, 16, 0.45);
}

#rvbt-bm-qm-root .mini[data-season] .occ-num small {
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 14px;
    font-weight: 600;
    margin-left: 3px;
    color: #ffffff;
    letter-spacing: 0.04em;
    text-shadow: 0 1px 3px rgba(26, 20, 16, 0.5);
}

/* Tier badge: WIDE OPEN / EASY / FILLING / BUSY / PEAK */
#rvbt-bm-qm-root .mini[data-season] .occ-tier {
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 9px;
    letter-spacing: 0.24em;
    text-transform: uppercase;
    font-weight: 700;
    padding: 6px 10px;
    border-radius: 999px;
    line-height: 1;
    border: 1px solid currentColor;
    white-space: nowrap;
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
}
/* Tier badges — all white text with subtle backgrounds that hint at tier intensity */
#rvbt-bm-qm-root .mini[data-season] .occ-tier {
    color: #ffffff;
    text-shadow: 0 1px 3px rgba(26, 20, 16, 0.5);
    border-color: rgba(255, 255, 255, 0.55);
}
#rvbt-bm-qm-root .mini[data-season] .occ-tier[data-tier="open"]    { background: rgba(79, 95, 75, 0.35); }
#rvbt-bm-qm-root .mini[data-season] .occ-tier[data-tier="easy"]    { background: rgba(126, 139, 122, 0.38); }
#rvbt-bm-qm-root .mini[data-season] .occ-tier[data-tier="filling"] { background: rgba(165, 138, 93, 0.40); }
#rvbt-bm-qm-root .mini[data-season] .occ-tier[data-tier="busy"]    { background: rgba(127, 100, 53, 0.45); }
#rvbt-bm-qm-root .mini[data-season] .occ-tier[data-tier="peak"]    {
    background: linear-gradient(135deg, rgba(176, 146, 94, 0.65) 0%, rgba(127, 100, 53, 0.75) 100%);
    border-color: rgba(255, 255, 255, 0.5);
}

/* Track + fill: gold gradient capsule with subtle tick marks at quarters */
#rvbt-bm-qm-root .mini[data-season] .month-occ-track {
    position: relative;
    height: 10px;
    border-radius: 999px;
    background: rgb(117 106 91 / 39%);
    border: 1px solid rgb(79 58 23 / 30%);
    box-shadow:
        inset 0 1px 2px rgba(26, 20, 16, 0.08),
        0 1px 0 rgba(255, 255, 255, 0.4);
    overflow: hidden;
}

/* Quartile ticks across the track (subtle) */
#rvbt-bm-qm-root .mini[data-season] .month-occ-track::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: linear-gradient(
        90deg,
        transparent calc(25% - 0.5px), rgba(176, 146, 94, 0.32) 25%, rgba(176, 146, 94, 0.32) calc(25% + 0.5px), transparent calc(25% + 0.5px),
        transparent calc(50% - 0.5px), rgba(176, 146, 94, 0.32) 50%, rgba(176, 146, 94, 0.32) calc(50% + 0.5px), transparent calc(50% + 0.5px),
        transparent calc(75% - 0.5px), rgba(176, 146, 94, 0.32) 75%, rgba(176, 146, 94, 0.32) calc(75% + 0.5px), transparent calc(75% + 0.5px)
    );
    pointer-events: none;
}

#rvbt-bm-qm-root .mini[data-season] .month-occ-fill {
    position: relative;
    height: 100%;
    width: 0;               /* animated to target % by JS */
    border-radius: 999px;
    background: linear-gradient(90deg,
        #d4bc8e 0%,
        #b0925e 55%,
        #7f6435 100%);
    box-shadow:
        0 0 10px rgba(176, 146, 94, 0.5),
        inset 0 1px 0 rgba(255, 250, 235, 0.45);
    transition: width 1.1s cubic-bezier(0.22, 0.61, 0.36, 1);
}

/* Bright leading-edge tick on the fill — like a measurement line */
#rvbt-bm-qm-root .mini[data-season] .month-occ-fill::after {
    content: "";
    position: absolute;
    right: -1px;
    top: -2px;
    bottom: -2px;
    width: 2px;
    border-radius: 1px;
    background: rgba(255, 250, 235, 0.95);
    box-shadow: 0 0 10px rgba(255, 250, 235, 0.8), 0 0 18px rgba(176, 146, 94, 0.5);
    opacity: 0;
    transition: opacity .4s ease 1s;
}
#rvbt-bm-qm-root .mini[data-season] .month-occ.is-painted .month-occ-fill::after {
    opacity: 1;
}

/* Foot caption — "Booked" label below the bar */
#rvbt-bm-qm-root .mini[data-season] .occ-foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding-top: 2px;
}

#rvbt-bm-qm-root .mini[data-season] .occ-foot .occ-label {
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 9px;
    letter-spacing: 0.26em;
    text-transform: uppercase;
    color: #ffffff;
    font-weight: 600;
    text-shadow: 0 1px 3px rgba(26, 20, 16, 0.5);
}
#rvbt-bm-qm-root .mini[data-season] .occ-foot .occ-foot-line {
    flex: 1;
    height: 1px;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.75), transparent);
}

/* Hover: slight glow lift on the bar */
#rvbt-bm-qm-root .mini[data-season]:hover .month-occ-fill {
    box-shadow:
        0 0 16px rgba(176, 146, 94, 0.7),
        inset 0 1px 0 rgba(255, 250, 235, 0.55);
}

/* Hovering a mini card hints it's clickable (will become featured) */
#rvbt-bm-qm-root .mini[data-season] {
    cursor: pointer;
}

/* ────────────────────────────────────────────────────────────────────────────
   Drag carousel cursor + closed-month indicator
   ──────────────────────────────────────────────────────────────────────────── */

#rvbt-bm-qm-root .ymap-strip {
    cursor: grab;
    user-select: none;
    -webkit-user-select: none;
}
#rvbt-bm-qm-root .ymap-strip:active {
    cursor: grabbing;
}

#rvbt-bm-qm-root .mini[data-season].is-closed {
    cursor: not-allowed;
    filter: grayscale(0.55) brightness(0.92);
}
#rvbt-bm-qm-root .mini[data-season].is-closed::before {
    background:
        linear-gradient(180deg, rgba(26, 20, 16, 0.42) 0%, rgba(26, 20, 16, 0.6) 100%),
        radial-gradient(120% 120% at 50% 0%, rgba(255, 250, 235, 0.10) 0%, transparent 70%) !important;
}
#rvbt-bm-qm-root .mini[data-season].is-closed:hover {
    transform: none !important;
    border-color: rgba(189, 38, 38, 0.55) !important;
}
#rvbt-bm-qm-root .mini[data-season] .closed-msg {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) rotate(-4deg);
    z-index: 3;
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 11px;
    letter-spacing: 0.3em;
    text-transform: uppercase;
    font-weight: 700;
    color: #fff2dd;
    background: linear-gradient(135deg, rgba(189, 38, 38, 0.85) 0%, rgba(120, 22, 22, 0.92) 100%);
    border: 1px solid rgba(255, 242, 221, 0.45);
    padding: 8px 14px;
    border-radius: 4px;
    box-shadow: 0 6px 18px -8px rgba(26, 20, 16, 0.6);
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.4);
    white-space: nowrap;
    pointer-events: none;
}

/* On hover of closed card, don't darken the fonts (keep them white over the dark wash) */
#rvbt-bm-qm-root .mini[data-season].is-closed:hover .nm,
#rvbt-bm-qm-root .mini[data-season].is-closed:hover .occ-num,
#rvbt-bm-qm-root .mini[data-season].is-closed:hover .occ-tier,
#rvbt-bm-qm-root .mini[data-season].is-closed:hover .occ-label {
    color: rgba(255, 242, 221, 0.85);
}

/* ────────────────────────────────────────────────────────────────────────────
   End-of-range cap card — appears after the last bookable month, signals
   that the user has reached the configured maximum future booking date.
   No photo background — pure editorial typography on a cream-paper card.
   ──────────────────────────────────────────────────────────────────────────── */

#rvbt-bm-qm-root .mini.mini--endcap {
    flex: 0 0 210px;
    height: 348px;
    min-height: 320px;
    max-height: 500px;
    padding: 22px 16px;
    border: 1px dashed rgba(176, 146, 94, 0.6);
    border-radius: var(--r-md);
    background:
        radial-gradient(80% 70% at 50% 0%, rgba(255, 250, 235, 0.95) 0%, rgba(244, 236, 217, 0.6) 100%),
        linear-gradient(180deg, var(--ivory) 0%, var(--cream-deep) 100%);
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, 0.5),
        0 10px 24px -16px rgba(176, 146, 94, 0.35);
    cursor: default;
    overflow: hidden;
    position: relative;
}

#rvbt-bm-qm-root .mini.mini--endcap::after {
    content: '';
    position: absolute;
    inset: 6px;
    border: 1px solid rgba(176, 146, 94, 0.18);
    border-radius: 6px;
    pointer-events: none;
}

#rvbt-bm-qm-root .mini.mini--endcap .endcap-inner {
    position: relative;
    z-index: 1;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    text-align: center;
    padding: 8px;
}

#rvbt-bm-qm-root .mini.mini--endcap svg {
    color: var(--gold);
    opacity: 0.7;
    margin-bottom: 2px;
}

#rvbt-bm-qm-root .mini.mini--endcap .endcap-eyebrow {
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 9px;
    letter-spacing: 0.28em;
    text-transform: uppercase;
    color: var(--mute);
    font-weight: 700;
    margin-top: 2px;
}

#rvbt-bm-qm-root .mini.mini--endcap .endcap-title {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-size: 22px;
    font-weight: 600;
    color: #654f2a;
    line-height: 1.1;
    letter-spacing: -0.005em;
    margin: 4px 0 2px;
}

#rvbt-bm-qm-root .mini.mini--endcap .endcap-date {
    font-family: 'Cormorant RVBT', 'Cormorant Garamond', Georgia, serif;
    font-style: italic;
    font-size: 16px;
    color: var(--gold);
    line-height: 1;
    margin-bottom: 4px;
}

#rvbt-bm-qm-root .mini.mini--endcap .endcap-note {
    font-family: 'Inter RVBT', 'Inter', system-ui, sans-serif;
    font-size: 10.5px;
    line-height: 1.5;
    color: var(--mute);
    max-width: 22ch;
    margin: 4px auto 0;
}

/* Decorative corner notches give it a "ticket stub" feel */
#rvbt-bm-qm-root .mini.mini--endcap::before {
    content: '';
    position: absolute;
    top: -6px;
    left: 50%;
    transform: translateX(-50%);
    width: 16px;
    height: 12px;
    border-radius: 0 0 16px 16px;
    background: var(--cream);
    border-bottom: 1px dashed rgba(176, 146, 94, 0.45);
    z-index: 2;
}

/* ============================================================================
 * Responsive — Step 1 (Dates) carousel + date picker stack
 *
 * On screens ≤ 900px, the .qm-stage switches from "date column | carousel"
 * grid to a single column with the date picker on TOP and the carousel BELOW
 * (matching the user's mobile spec). The .qm-date-picker overlay also has its
 * hard-coded `left:calc(240px + 32px)` reset so it spans the full row.
 * ========================================================================= */
@media (max-width: 900px) {
    /* Single-column stage: picker row 1, carousel row 2 */
    #rvbt-bm-qm-root .qm-stage {
        grid-template-columns: 1fr;
        grid-template-rows: auto auto;
        gap: 18px;
        margin: 24px 4px 20px;
    }
    /* Date picker column always row 1, full width, horizontal compact layout */
    #rvbt-bm-qm-root .qm-pickers.qm-pickers--stack {
        grid-column: 1 !important;
        grid-row: 1 !important;
        flex-direction: row !important;
        align-items: stretch !important;
        gap: 8px;
        padding: 0;
        border-right: 0;
        border-bottom: 1px solid var(--line-soft);
        padding-bottom: 14px;
    }
    /* Override the late-defined desktop rules that force ymap-wrap + picker into
       grid-column 2 */
    #rvbt-bm-qm-root .qm-stage > .ymap-wrap {
        grid-column: 1 !important;
        grid-row: 2 !important;
    }
    #rvbt-bm-qm-root .qm-stage > .qm-date-picker {
        grid-column: 1 !important;
        grid-row: 2 !important;
        left: 0 !important; /* reset the hardcoded 240+32 inset for desktop */
        right: 0 !important;
    }
    /* Make each date card flex-equally in the row */
    #rvbt-bm-qm-root .qm-pickers--stack .qm-date,
    #rvbt-bm-qm-root .qm-pickers--stack .qm-nights {
        flex: 1 1 0;
        min-width: 0;
        padding: 8px 10px;
    }
    /* Smaller, mobile-compatible date typography */
    #rvbt-bm-qm-root .qm-pickers--stack .qm-date .dn {
        font-size: 24px;
    }
    #rvbt-bm-qm-root .qm-pickers--stack .qm-date .dl {
        font-size: 8px;
    }
    #rvbt-bm-qm-root .qm-pickers--stack .qm-date .dm {
        font-size: 9px;
        max-width: 100%;
    }
    #rvbt-bm-qm-root .qm-pickers--stack .qm-date-row {
        gap: 6px;
    }
    /* Nights column more compact */
    #rvbt-bm-qm-root .qm-pickers--stack .qm-nights {
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 2px;
        padding: 8px 6px;
    }
    #rvbt-bm-qm-root .qm-pickers--stack .qm-nights .nn { font-size: 22px; line-height: 1; }
    #rvbt-bm-qm-root .qm-pickers--stack .qm-nights .nl { font-size: 8px; }
}

@media (max-width: 900px) {
    /* Hide the "Featuring this month" subtitle on mobile — title alone is enough */
    #rvbt-bm-qm-root .ymap-head .ttl small { display: none; }
    /* Remove ymap-wrap horizontal padding so feature (position:absolute left:0)
       aligns with the viewport's content area */
    #rvbt-bm-qm-root .ymap-wrap { padding: 0 !important; }
    /* Date picker on mobile stacks under the title — single month visible. */
    #rvbt-bm-qm-root .qm-date-picker .dp-calendar {
        padding: 16px 14px 14px;
    }
    /* Hide months 2-4 on tight viewports — user navigates via prev/next */
    #rvbt-bm-qm-root .qm-date-picker .dp-cal-month--n2,
    #rvbt-bm-qm-root .qm-date-picker .dp-cal-month--n3,
    #rvbt-bm-qm-root .qm-date-picker .dp-cal-month--n4 { display: none; }
    /* Single month flexes to full width; no per-side padding or divider */
    #rvbt-bm-qm-root .qm-date-picker .dp-cal-month {
        padding: 0 8px;
    }
    #rvbt-bm-qm-root .qm-date-picker .dp-cal-month + .dp-cal-month::before {
        display: none;
    }
    /* Modal frame already provides a close button — hide picker's float-X to
       avoid overlap with the calendar's top-right (DOW "Sa" header / next arrow) */
    #rvbt-bm-qm-root .qm-date-picker .dp-close-float { display: none; }
    /* Nav arrows: small inset so they don't crowd month title */
    #rvbt-bm-qm-root .qm-date-picker .dp-nav {
        width: 28px;
        height: 28px;
        top: 14px;
    }
    #rvbt-bm-qm-root .qm-date-picker .dp-nav--prev { left: 8px; }
    #rvbt-bm-qm-root .qm-date-picker .dp-nav--next { right: 8px; }
}

/* Tablet / narrow desktop — 2 months across (auto via flex:1 distribution) */
@media (max-width: 1200px) and (min-width: 901px) {
    #rvbt-bm-qm-root .qm-date-picker .dp-cal-month--n3,
    #rvbt-bm-qm-root .qm-date-picker .dp-cal-month--n4 { display: none; }
}

@media (max-width: 640px) {
    #rvbt-bm-qm-root .qm-date-picker .dp-month-title { font-size: 16px; }
    #rvbt-bm-qm-root .qm-date-picker .dp-day { font-size: 10px; }
    #rvbt-bm-qm-root .qm-date-picker .dp-quick-pill { font-size: 9px; padding: 5px 10px; }
    #rvbt-bm-qm-root .qm-date-picker .dp-quick-label { font-size: 8px; }
}

@media (max-width: 640px) {
    /* Tighter mobile sizing */
    #rvbt-bm-qm-root .qm-q {
        font-size: 28px !important;
        line-height: 1.1;
    }
    #rvbt-bm-qm-root .qm-chips { gap: 6px; }
    #rvbt-bm-qm-root .qm-chip { font-size: 9px; padding: 4px 8px; }
    /* Featured frame + carousel: shrink */
    #rvbt-bm-qm-root .ymap-feature {
        width: 218px;
        height: 318px;
        top: 50px;
    }
    #rvbt-bm-qm-root .ymap-viewport {
        height: 318px;
        padding-left: 10px;
    }
    #rvbt-bm-qm-root .mini {
        flex: 0 0 178px;
        height: 298px;
        min-height: 0 !important;
    }
    #rvbt-bm-qm-root .mini.is-featured {
        flex: 0 0 198px;
    }
    #rvbt-bm-qm-root .mini[data-season] {
        height: 298px;
        min-height: 0 !important;
    }
    #rvbt-bm-qm-root .mini.mini--endcap {
        flex: 0 0 178px;
        height: 298px;
        min-height: 0 !important;
    }
    /* Headline area padding — bottom padding is increased so the scrollable
       content can scroll PAST the fixed .qm-foot button bar at the bottom */
    #rvbt-bm-qm-root .qm-frame { padding: 60px 14px 140px 14px; }
    #rvbt-bm-qm-root .qm-frame--scroll { padding: 60px 14px 140px 14px; }
    #rvbt-bm-qm-root .ymap-head .ttl { font-size: 16px; }
    #rvbt-bm-qm-root .ymap-head { margin-bottom: 10px; }
    /* Even smaller date picker tappable area on tight screens */
    #rvbt-bm-qm-root .qm-pickers--stack .qm-date .dn { font-size: 20px; }
}

@media (max-width: 380px) {
    /* Extra tight — ultra-narrow phones */
    #rvbt-bm-qm-root .qm-q { font-size: 24px !important; }
    #rvbt-bm-qm-root .ymap-feature {
        width: 198px;
        height: 288px;
    }
    #rvbt-bm-qm-root .ymap-viewport { height: 288px; }
    #rvbt-bm-qm-root .mini {
        flex: 0 0 158px;
        height: 268px;
        min-height: 0 !important;
    }
    #rvbt-bm-qm-root .mini.is-featured {
        flex: 0 0 178px;
    }
    #rvbt-bm-qm-root .mini[data-season] {
        height: 268px;
        min-height: 0 !important;
    }
    #rvbt-bm-qm-root .mini.mini--endcap {
        flex: 0 0 158px;
        height: 268px;
        min-height: 0 !important;
    }
}