/* --- Bootstrap reconciliation ---------------------------------------
           This site's own reset zeroes margins with `* { margin:0; padding:0 }`,
           which loses on specificity to Bootstrap Reboot's element selectors
           (`figure { margin: 0 0 1rem }`, `ul { padding-left: 2rem }`, and so
           on). Re-assert the zeroing at element specificity, after Bootstrap, so the existing pixel-tuned layout is unchanged by loading it.
           Deliberately does NOT touch list-style: the pages already render
           with browser-default markers and zero padding. */
        :where(.rvh-root) h1, :where(.rvh-root) h2, :where(.rvh-root) h3, :where(.rvh-root) h4, :where(.rvh-root) h5, :where(.rvh-root) h6, :where(.rvh-root) p, :where(.rvh-root) figure, :where(.rvh-root) blockquote, :where(.rvh-root) dl, :where(.rvh-root) dd, :where(.rvh-root) ol, :where(.rvh-root) ul, :where(.rvh-root) fieldset, :where(.rvh-root) legend, :where(.rvh-root) pre {
            margin: 0;
            padding: 0;
        }
        :where(.rvh-root) ol, :where(.rvh-root) ul { padding-left: 0; }
        :where(.rvh-root) label { display: inline; margin-bottom: 0; }
        :where(.rvh-root) img, :where(.rvh-root) svg, :where(.rvh-root) video, :where(.rvh-root) canvas { vertical-align: baseline; }
        :where(.rvh-root) button, :where(.rvh-root) input, :where(.rvh-root) select, :where(.rvh-root) textarea { font-family: inherit; font-size: inherit; line-height: inherit; }
        :where(.rvh-root) b, :where(.rvh-root) strong { font-weight: bolder; }
        /* Reboot paints the page background and body type; this site sets its
           own further down, but be explicit so load order can never matter. */
        .rvh-root { background-color: transparent; color: inherit; font-size: inherit; line-height: inherit; }
    

        :root {
            --brand-color: #6C151C; /* Rich velvet maroon */
            --text-dark: #3b332d;
            --gold: #B5955C;
            --gold-light: #E2CDA6;
            
            /* Realistic Paper Gradient Colors */
            --paper-center: #FDFCF8;
            --paper-mid: #F5EFE3;
            --paper-edge: #EAE0CD;
        }

        /* Scoped with :where() rather than a plain descendant combinator:
           :where() contributes no specificity, so this stays at 0,0,0 exactly
           as the bare `*` was and keeps losing to everything, including
           Bootstrap's component classes. Written as `.rvh-root *` it would
           weigh 0,1,0 and start beating rules it used to lose to. */
        :where(.rvh-root, .rvh-root *) {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }

        /* The moodboard used to live in an iframe and pinned overflow-y here
           so a resize-report gap could never trap a touch gesture inside the
           iframe's own scrollport. It is inlined now, and this rule lands on
           the wrapper the whole page shares - so the pinning is gone and the
           page scrolls normally. */

        /* ---- stacking containment -------------------------------------------
           This microsite is embedded inside the host storefront's page, whose
           fixed header sits at z-index 9. Our own sections go as high as 999,
           so without a stacking context of its own the microsite paints over
           that header -- "Explore the Traditions" landing on top of the nav.

           isolation:isolate makes .rvh-root a stacking context, so every
           z-index inside it is resolved relative to the wrapper rather than
           competing with the host page. The whole microsite then participates
           in the host's stacking at a single, low level.

           The exception is our own full-screen overlays: those have to cover
           the host chrome or they get clipped by it, so while one is open the
           wrapper lifts above everything. :has() keeps that in CSS rather than
           needing every open/close path to remember to toggle a class. ---- */
        .rvh-root {
            position: relative;
            z-index: 0;
            isolation: isolate;
        }
        /* EVERY full-screen dialog must be listed here. One that is missed does
           not fail loudly -- it simply renders underneath the host page's fixed
           header, which is how the moodboard's share modal slipped through. If a
           dialog is added, add it here too. Matching .rvh-is-open generically
           would be wrong: those classes are also used on non-dialog elements,
           and lifting the wrapper when no dialog is open would put the microsite
           over the host's chrome. */
        .rvh-root:has(.rvh-sd-share-overlay.rvh-is-open),
        .rvh-root:has(.rvh-mb-sd-share-overlay.rvh-is-open),
        .rvh-root:has(.rvh-mb-sd-share-overlay.rvh-mb-is-open),
        .rvh-root:has(.rvh-mb-mood-contact-modal.rvh-mb-is-open),
        .rvh-root:has(.rvh-mb-mood-share-modal.rvh-mb-is-open),
        .rvh-root:has(.rvh-mb-asset-modal.rvh-mb-is-open) {
            z-index: 2147483000;
        }
        .rvh-root {
            margin: 0;
            padding: 0;
            font-family: 'Playfair Display', serif;
            overflow-x: hidden;
            background: transparent;
        }

        /* --- UNIFIED SEAMLESS PAPER WRAPPER --- */
        .rvh-mb-main-wrapper {
            position: relative;
            width: 100%;
            min-height: 100vh;
            display: flex;
            flex-direction: column;
            align-items: center;
            background: transparent;
            overflow: hidden;
        }

        /* Use the parent page paper background without an extra section texture layer */
        .rvh-mb-main-wrapper::before {
            content: none;
            display: none;
        }

        /* --- HERO SECTION --- */
        .rvh-mb-hero-section {
            display: flex;
            width: 100%;
            max-width: 1400px;
            height: 90vh;
            min-height: 750px;
            position: relative;
            z-index: 2;
        }

        /* Elegant Golden Border Box */
        .rvh-mb-border-frame {
            position: absolute;
            top: 25px; left: 25px; right: 25px; bottom: 25px;
            border: 1px solid rgba(181, 149, 92, 0.4);
            pointer-events: none;
            z-index: 2;
        }
        
        .rvh-mb-border-frame::before, .rvh-mb-border-frame::after {
            content: '✿';
            position: absolute;
            color: rgba(181, 149, 92, 0.7);
            font-size: 14px;
            background: transparent;
            border-radius: 50%;
        }
        .rvh-mb-border-frame::before { top: -9px; left: -9px; }
        .rvh-mb-border-frame::after { bottom: -9px; right: -9px; }

        /* --- LEFT CONTENT: BRANDING --- */
        .rvh-mb-left-content {
            flex: 1;
            position: relative;
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            z-index: 50;
        }

        .rvh-mb-top-note {
            position: absolute;
            top: 8%;
            left: 8%;
            font-family: 'Caveat', cursive;
            font-size: 1.6rem;
            color: var(--text-dark);
            transform: rotate(-4deg);
            line-height: 1.2;
            opacity: 0.8;
        }

        .rvh-mb-branding {
            text-align: center;
            color: var(--brand-color);
            margin-top: -40px;
        }

        .rvh-mb-divider {
            width: 80px;
            height: 1px;
            background-color: var(--gold-light);
            margin: 30px auto;
            position: relative;
        }
        .rvh-mb-divider::after {
            content: '✧';
            position: absolute;
            top: -11px;
            left: 50%;
            transform: translateX(-50%);
            color: var(--gold);
            background: transparent;
            font-size: 16px;
        }

        /* --- RIGHT CONTENT: POLAROIDS & MEMO --- */
        .rvh-mb-right-content {
            flex: 1.2;
            position: relative;
            z-index: 5;
        }

        .rvh-mb-polaroid {
            background: #fff;
            padding: 12px 12px 16px 12px;
            box-shadow: 4px 10px 30px rgba(0,0,0,0.08), 0 0 1px rgba(0,0,0,0.05);
            position: absolute;
            transition: transform 0.6s cubic-bezier(0.2, 0.8, 0.2, 1);
        }

        .rvh-mb-polaroid img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            display: block;
        }

        .rvh-mb-tape {
            position: absolute;
            width: 80px;
            height: 25px;
            background: rgba(240, 235, 220, 0.85);
            box-shadow: 0 1px 3px rgba(0,0,0,0.1), inset 0 0 4px rgba(0,0,0,0.02);
            backdrop-filter: blur(2px);
            z-index: 20;
            border-left: 2px dotted rgba(0,0,0,0.1);
            border-right: 2px dotted rgba(0,0,0,0.1);
        }

        .rvh-mb-img-main { width: 340px; height: 500px; left: 8%; top: 8%; z-index: 6; transform: rotate(-2deg); }
        .rvh-mb-img-main:hover { transform: rotate(0deg) translateY(-8px) scale(1.02); box-shadow: 6px 15px 40px rgba(0,0,0,0.12); }
        .rvh-mb-tape-main { top: -12px; left: 50%; transform: translateX(-50%) rotate(-1deg); }

        .rvh-mb-img-tr { width: 270px; height: 260px; right: 8%; top: 4%; z-index: 5; transform: rotate(4deg); }
        .rvh-mb-img-tr:hover { transform: rotate(2deg) translateY(-8px) scale(1.02); }
        .rvh-mb-tape-tr { top: -10px; left: 15%; transform: rotate(3deg); }

        .rvh-mb-img-br { width: 260px; height: 280px; right: 12%; bottom: 10%; z-index: 4; transform: rotate(-3deg); }
        .rvh-mb-img-br:hover { transform: rotate(-1deg) translateY(-8px) scale(1.02); }

        .rvh-mb-memo-card {
            position: absolute;
            bottom: 8%;
            left: 15%;
            background: #FDFBF7;
            padding: 30px 20px;
            width: 200px;
            box-shadow: 3px 8px 20px rgba(0,0,0,0.06), inset 0 0 0 1px rgba(181, 149, 92, 0.2);
            z-index: 30; 
            transform: rotate(-3deg);
            font-family: 'Caveat', cursive;
            font-size: 1.5rem;
            color: var(--text-dark);
            text-align: center;
            line-height: 1.4;
            pointer-events: none;
        }

        /* --- BRIDES BOOK SECTION (FULL-VIEWPORT BOOK) --- */
        .rvh-mb-brides-book-section {
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            width: 100%;
            min-height: 100vh;
            padding: 40px 24px 60px;
            position: relative;
            z-index: 10;
        }

        .rvh-mb-section-tagline {
            font-family: 'Cinzel', serif;
            font-size: 2.2rem;
            font-weight: 400;
            color: var(--brand-color);
            letter-spacing: 3px;
            text-transform: uppercase;
            margin-bottom: 4px;
            z-index: 5;
            text-align: center;
        }

        /* Stage that holds the open book + the closed books beside it */
        .rvh-mb-book-stage {
            position: relative;
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 0;
            width: 100%;
            max-width: 1560px;
            height: 70vh;
            min-height: 520px;
            margin-top: 26px;
            perspective: 2600px;
            perspective-origin: 30% 50%;
        }

        /* ---------- THE OPEN BOOK ---------- */
        .rvh-mb-book-open {
            position: relative;
            flex: 0 0 auto;
            width: min(70%, 1080px);
            height: 100%;
            transform-style: preserve-3d;
            transform-origin: left center;
            border-radius: 3px 8px 8px 3px;
            background:
                radial-gradient(ellipse at 60% 35%, var(--paper-center) 0%, var(--paper-mid) 62%, var(--paper-edge) 100%);
            box-shadow:
                -6px 0 0 0 rgba(120, 96, 52, 0.10),
                -14px 0 26px -10px rgba(0,0,0,0.18),
                34px 40px 70px -20px rgba(0,0,0,0.28),
                inset 0 0 90px rgba(150, 120, 70, 0.10);
            transition: transform 0.9s cubic-bezier(0.22, 0.8, 0.2, 1), opacity 0.5s ease;
            overflow: hidden;
            z-index: 20;
        }

        /* thick page block on the right edge (real book depth) */
        .rvh-mb-book-open::after {
            content: '';
            position: absolute;
            top: 6px; bottom: 6px; right: -14px;
            width: 16px;
            border-radius: 0 4px 4px 0;
            background: repeating-linear-gradient(to right,
                #fdfbf5 0px, #fdfbf5 1px,
                #e6dcc6 1px, #e6dcc6 2px,
                #f7f2e6 2px, #f7f2e6 3px);
            box-shadow: 6px 8px 18px rgba(0,0,0,0.18);
            z-index: 1;
        }

        /* soft inner spine gradient on the left */
        .rvh-mb-book-spine-shadow {
            position: absolute;
            top: 0; bottom: 0; left: 0;
            width: 70px;
            background: linear-gradient(to right,
                rgba(90, 70, 37, 0.30) 0%,
                rgba(90, 70, 37, 0.12) 35%,
                rgba(90, 70, 37, 0.02) 75%,
                transparent 100%);
            pointer-events: none;
            z-index: 6;
        }

        /* engraved gold frame */
        .rvh-mb-book-frame {
            position: absolute;
            top: 22px; left: 30px; right: 26px; bottom: 22px;
            border: 1px solid rgba(181, 149, 92, 0.55);
            pointer-events: none;
            z-index: 7;
        }
        .rvh-mb-book-frame::before {
            content: '';
            position: absolute;
            top: 7px; left: 7px; right: 7px; bottom: 7px;
            border: 1px solid rgba(181, 149, 92, 0.22);
        }
        .rvh-mb-book-corner {
            position: absolute;
            width: 74px; height: 74px;
            border: 0 solid rgba(181, 149, 92, 0.85);
            pointer-events: none;
            z-index: 8;
        }
        .rvh-mb-book-corner::after {
            content: '❈';
            position: absolute;
            color: rgba(181, 149, 92, 0.9);
            font-size: 15px;
            line-height: 1;
        }
        .rvh-mb-bc-tl { top: 22px; left: 30px; border-top-width: 2px; border-left-width: 2px; }
        .rvh-mb-bc-tl::after { top: 6px; left: 8px; }
        .rvh-mb-bc-tr { top: 22px; right: 26px; border-top-width: 2px; border-right-width: 2px; }
        .rvh-mb-bc-tr::after { top: 6px; right: 8px; }
        .rvh-mb-bc-bl { bottom: 22px; left: 30px; border-bottom-width: 2px; border-left-width: 2px; }
        .rvh-mb-bc-bl::after { bottom: 6px; left: 8px; }
        .rvh-mb-bc-br { bottom: 22px; right: 26px; border-bottom-width: 2px; border-right-width: 2px; }
        .rvh-mb-bc-br::after { bottom: 6px; right: 8px; }

        /* faint damask motif behind everything */
        .rvh-mb-book-motif {
            position: absolute;
            inset: 0;
            opacity: 0.16;
            z-index: 1;
            pointer-events: none;
            background-image:
                radial-gradient(circle at 12% 22%, rgba(181,149,92,0.35) 0 2px, transparent 3px),
                radial-gradient(circle at 26% 68%, rgba(181,149,92,0.3) 0 2px, transparent 3px),
                radial-gradient(circle at 8% 82%, rgba(181,149,92,0.25) 0 2px, transparent 3px);
            background-size: 260px 260px;
        }

        /* left page: the storytelling side */
        .rvh-mb-page-left {
            position: absolute;
            top: 0; bottom: 0; left: 0;
            width: 52%;
            padding: 9% 5% 8% 8%;
            display: flex;
            flex-direction: column;
            justify-content: flex-start;
            z-index: 10;
        }

        .rvh-mb-book-title {
            font-family: 'Cinzel', serif;
            font-size: clamp(2.4rem, 4.2vw, 4.2rem);
            font-weight: 500;
            line-height: 1.05;
            letter-spacing: 6px;
            color: var(--brand-color);
        }
        .rvh-mb-book-divider {
            width: 190px;
            max-width: 70%;
            height: 1px;
            background: linear-gradient(to right, transparent, var(--gold), transparent);
            position: relative;
            margin: 22px 0 18px;
        }
        .rvh-mb-book-divider::after {
            content: '❖';
            position: absolute;
            top: -10px; left: 50%;
            transform: translateX(-50%);
            color: var(--gold);
            font-size: 13px;
            background: transparent;
        }
        .rvh-mb-book-subtitle {
            font-family: 'Playfair Display', serif;
            font-size: clamp(1rem, 1.25vw, 1.35rem);
            letter-spacing: 1.5px;
            color: var(--text-dark);
            opacity: 0.85;
        }

        /* right page: the bride photograph, bleeding into the paper */
        .rvh-mb-page-right {
            position: absolute;
            top: 0; right: 0; bottom: 0;
            width: 62%;
            z-index: 3;
            overflow: hidden;
        }
        .rvh-mb-page-right img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            object-position: 50% 22%;
            mask-image: linear-gradient(to left, rgba(0,0,0,1) 52%, rgba(0,0,0,0.55) 78%, rgba(0,0,0,0) 100%);
            -webkit-mask-image: linear-gradient(to left, rgba(0,0,0,1) 52%, rgba(0,0,0,0.55) 78%, rgba(0,0,0,0) 100%);
        }
        /* The cover is masked so its left edge fades into the page -- opaque from
           the right to 52%, fully transparent by 100%. Anything sitting in that
           left band reads as washed out, which is what was reported as the
           Rajasthani bride's face being "in the blurry section".

           rivaah-rajasthan.jpg is now the deck's Rajasthan (1).jpg, 1440x720 like
           the Metro and Marathi covers, and her face moved: it sits at source
           x 555 (39%), not 44% of the old 1600x822 frame. At the default 50%
           object-position the visible window is 548-892, putting her ahead of the
           left edge but still inside the fade; 29% moves the window to 321-664 and
           puts her ~68% across, past the mask's opaque threshold. Only ~24% of the
           image's width is ever visible in the portrait cover, so this only
           changes which slice that is. */
        .rvh-mb-page-right img[src*="rivaah-rajasthan"] { object-position: 29% 22%; }

        /* Same fade, same problem, for the two covers added from the deck. The
           visible window is only ~24% of each source's width (both are 1440x720
           landscape in a portrait cover), so object-position picks which slice
           shows. Metro's bride sits at source x 553 (38%) and Marathi's at x 666
           (46%); at the default 50% both land inside the left 48% of the box that
           the mask fades out. 29% and 39% move each face to ~68% across the
           window -- the same place the Rajasthani fix puts hers. */
        .rvh-mb-page-right img[src*="rivaah-metro"] { object-position: 29% 22%; }
        .rvh-mb-page-right img[src*="rivaah-marathi"] { object-position: 39% 22%; }


        /* pinned polaroids along the bottom of the left page */
        .rvh-mb-book-polaroids {
            position: absolute;
            bottom: 7%;
            left: 7%;
            display: flex;
            align-items: flex-end;
            z-index: 12;
        }
        .rvh-mb-pinned-photo {
            position: relative;
            background: #fff;
            padding: 8px 8px 10px 8px;
            box-shadow: 3px 9px 22px rgba(0,0,0,0.18);
            border: 1px solid rgba(0,0,0,0.05);
        }
        .rvh-mb-pinned-photo img {
            width: clamp(84px, 8.5vw, 132px);
            height: clamp(96px, 9.5vw, 148px);
            object-fit: cover;
            display: block;
        }
        .rvh-mb-pinned-text {
            position: absolute;
            left: 50%;
            bottom: -26px;
            transform: translateX(-50%) rotate(-2deg);
            padding: 5px 14px;
            background: linear-gradient(to bottom, #f6efdf, #eadfc4);
            box-shadow: 1px 3px 8px rgba(0,0,0,0.12);
            font-family: 'Great Vibes', cursive;
            font-size: clamp(1rem, 1.4vw, 1.5rem);
            color: var(--brand-color);
            white-space: nowrap;
        }
        .rvh-mb-gold-pin {
            position: absolute;
            top: -7px; left: 50%;
            transform: translateX(-50%);
            width: 15px; height: 15px;
            background: radial-gradient(circle at 32% 28%, #f4e3bf, #c9a765 55%, #6d5527);
            border-radius: 50%;
            box-shadow: 1px 3px 6px rgba(0,0,0,0.35);
            z-index: 4;
        }
        .rvh-mb-pp-1 { transform: rotate(-7deg); z-index: 1; margin-bottom: 6px; }
        .rvh-mb-pp-2 { transform: rotate(3deg); z-index: 3; margin-left: -22px; margin-bottom: 26px; }
        .rvh-mb-pp-3 { transform: rotate(-3deg); z-index: 2; margin-left: -18px; }

        /* page-turn animation on switch */
        .rvh-mb-book-open.rvh-mb-turning { transform: rotateY(-16deg) translateX(-1%) scale(0.985); }
        .rvh-mb-book-open.rvh-mb-turning .rvh-mb-page-left,
        .rvh-mb-book-open.rvh-mb-turning .rvh-mb-page-right { opacity: 0; transition: opacity 0.25s ease; }
        .rvh-mb-page-left, .rvh-mb-page-right, .rvh-mb-book-polaroids { transition: opacity 0.45s ease 0.12s; }
        .rvh-mb-book-open.rvh-mb-turning .rvh-mb-book-polaroids { opacity: 0; transition: opacity 0.2s ease; }

        /* turning sheet that sweeps across like a real page */
        .rvh-mb-turn-sheet {
            position: absolute;
            inset: 0;
            transform-origin: left center;
            transform: rotateY(0deg);
            background: linear-gradient(to right, #fdfbf5, #f1e9d7 70%, #e3d8bd);
            box-shadow: 18px 0 40px rgba(0,0,0,0.22);
            opacity: 0;
            pointer-events: none;
            z-index: 30;
        }
        .rvh-mb-book-open.rvh-mb-turning .rvh-mb-turn-sheet {
            animation: sweepPage 0.85s cubic-bezier(0.5, 0, 0.4, 1);
        }
        @keyframes sweepPage {
            0%   { opacity: 1; transform: rotateY(0deg); }
            99%  { opacity: 1; transform: rotateY(-172deg); }
            100% { opacity: 0; transform: rotateY(-172deg); }
        }

        /* ---------- THE CLOSED BOOKS BESIDE IT ---------- */
        .rvh-mb-book-shelf {
            position: relative;
            display: flex;
            align-items: center;
            height: 100%;
            z-index: 15;
            margin-left: 22px;
        }
        .rvh-mb-book-closed {
            position: relative;
            width: clamp(96px, 9vw, 150px);
            height: 84%;
            margin-left: -14px;
            border-radius: 3px 5px 5px 3px;
            background:
                radial-gradient(ellipse at 50% 25%, var(--paper-center) 0%, var(--paper-mid) 58%, var(--paper-edge) 100%);
            box-shadow:
                -8px 0 18px -6px rgba(0,0,0,0.20),
                14px 26px 40px -18px rgba(0,0,0,0.22),
                inset 0 0 40px rgba(150,120,70,0.10);
            cursor: pointer;
            overflow: hidden;
            transition: transform 0.6s cubic-bezier(0.22, 0.8, 0.2, 1), box-shadow 0.5s ease, filter 0.5s ease;
            display: flex;
            flex-direction: column;
            align-items: center;
            padding: 12% 8px 0;
            text-align: center;
        }
        .rvh-mb-book-closed:nth-child(1) { height: 92%; }
        .rvh-mb-book-closed:nth-child(2) { height: 86%; }
        .rvh-mb-book-closed:nth-child(3) { height: 80%; }
        .rvh-mb-book-closed::before {
            content: '';
            position: absolute;
            top: 10px; left: 8px; right: 8px; bottom: 10px;
            border: 1px solid rgba(181, 149, 92, 0.45);
            z-index: 3;
            pointer-events: none;
        }
        /* spine highlight */
        .rvh-mb-book-closed::after {
            content: '';
            position: absolute;
            top: 0; bottom: 0; left: 0;
            width: 16px;
            background: linear-gradient(to right, rgba(90,70,37,0.28), transparent);
            z-index: 4;
            pointer-events: none;
        }
        .rvh-mb-book-closed:hover {
            transform: translateY(-14px) translateX(6px);
            box-shadow: -10px 0 22px -6px rgba(0,0,0,0.24), 18px 32px 48px -18px rgba(0,0,0,0.28);
            filter: brightness(1.03);
        }
        .rvh-mb-closed-title {
            font-family: 'Cinzel', serif;
            font-size: clamp(0.75rem, 0.95vw, 1.05rem);
            letter-spacing: 1.6px;
            padding: 0 4px;
            color: var(--brand-color);
            line-height: 1.25;
            z-index: 5;
            margin-top: 8px;
        }
        .rvh-mb-closed-sub {
            font-family: 'Playfair Display', serif;
            font-style: italic;
            font-size: clamp(0.6rem, 0.72vw, 0.82rem);
            color: var(--text-dark);
            opacity: 0.75;
            margin-top: 10px;
            z-index: 5;
            line-height: 1.35;
        }
        .rvh-mb-closed-img {
            position: absolute;
            left: 0; right: 0; bottom: 0;
            height: 62%;
            z-index: 2;
        }
        .rvh-mb-closed-img img {
            width: 100%; height: 100%;
            object-fit: cover;
            object-position: 50% 20%;
            opacity: 0.9;
            mask-image: linear-gradient(to top, rgba(0,0,0,1) 55%, rgba(0,0,0,0) 100%);
            -webkit-mask-image: linear-gradient(to top, rgba(0,0,0,1) 55%, rgba(0,0,0,0) 100%);
        }

        /* ---------- CONTROLS ---------- */
        .rvh-mb-book-controls {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 22px;
            margin-top: 30px;
            z-index: 40;
        }
        .rvh-mb-slider-arrow {
            background: rgba(253, 252, 248, 0.85);
            border: 1px solid var(--gold);
            color: var(--gold);
            width: 46px;
            height: 46px;
            border-radius: 50%;
            display: flex;
            justify-content: center;
            align-items: center;
            cursor: pointer;
            font-size: 1.1rem;
            transition: all 0.3s ease;
            box-shadow: 0 4px 12px rgba(0,0,0,0.06);
        }
        .rvh-mb-slider-arrow:hover { background: var(--gold); color: #fff; box-shadow: 0 6px 16px rgba(181,149,92,0.4); }
        .rvh-mb-book-dots { display: flex; gap: 12px; align-items: center; }
        .rvh-mb-book-dot {
            width: 8px; height: 8px; border-radius: 50%;
            background: rgba(181,149,92,0.35);
            cursor: pointer;
            transition: all 0.35s ease;
        }
        .rvh-mb-book-dot.rvh-mb-active { background: var(--brand-color); transform: scale(1.5); }
        .rvh-mb-book-hint {
            font-family: 'Playfair Display', serif;
            font-style: italic;
            font-size: 0.9rem;
            color: var(--text-dark);
            opacity: 0.6;
            margin-top: 12px;
            text-align: center;
        }

        @media (max-width: 1024px) {
            .rvh-mb-brides-book-section { min-height: auto; padding: 60px 16px; }
            .rvh-mb-book-stage { height: auto; min-height: 0; flex-direction: column; }
            .rvh-mb-book-open { width: 100%; max-width: 640px; height: 62vh; min-height: 420px; }
            .rvh-mb-book-open::after { display: none; }
            .rvh-mb-page-left { width: 62%; padding: 8% 5%; }
            .rvh-mb-page-right { width: 70%; }
            .rvh-mb-book-polaroids { bottom: 5%; left: 5%; }
            .rvh-mb-pinned-photo img { width: 66px; height: 76px; }
            .rvh-mb-pinned-text { font-size: 0.9rem; bottom: -22px; }
            .rvh-mb-book-shelf { margin: 26px 0 0; height: 190px; }
            .rvh-mb-book-closed { width: 100px; height: 100% !important; }
        }
        /* --- DAINTY, DRIFTING ROSE PETALS --- */
        .rvh-mb-petal { position: absolute; border-radius: 50% 0 50% 50%; background: radial-gradient(circle at 30% 30%, #fdeef0, #eec0c4, #d4949a); box-shadow: 1px 3px 9px rgba(120, 70, 70, 0.18), inset -2px -2px 6px rgba(150, 90, 90, 0.12); z-index: 25; opacity: 0.8; pointer-events: none; will-change: transform; }

        /* Hero Petals */
        .rvh-mb-p1 { width: 26px; height: 26px; top: 12%; right: 42%; --base-transform: rotate(65deg) skew(10deg); transform: var(--base-transform); animation: driftA 9s ease-in-out infinite; }
        .rvh-mb-p2 { width: 20px; height: 20px; bottom: 20%; left: 35%; --base-transform: rotate(140deg) skew(15deg); transform: var(--base-transform); background: radial-gradient(circle at 30% 30%, #fdf2f3, #f0cccf, #d59ba0); animation: driftB 11s ease-in-out infinite; }
        .rvh-mb-p3 { width: 30px; height: 30px; top: 5%; right: 15%; --base-transform: rotate(-20deg); transform: var(--base-transform); opacity: 0.65; animation: driftC 10s ease-in-out infinite; }

        /* Second section (Book of Traditions) - a soft, constant petal shower */
        .rvh-mb-p7  { width: 30px; height: 30px; top: 10%;  left: 9%;   --base-transform: rotate(85deg) skew(12deg);  transform: var(--base-transform); animation: driftA 7s   ease-in-out infinite; z-index: 5; }
        .rvh-mb-p8  { width: 22px; height: 22px; bottom: 12%; right: 16%; --base-transform: rotate(-35deg) skew(8deg);  transform: var(--base-transform); animation: driftB 8.5s ease-in-out infinite; z-index: 5; }
        .rvh-mb-p9  { width: 17px; height: 17px; top: 38%;  right: 5%;   opacity: 0.55; --base-transform: rotate(120deg) skew(15deg); transform: var(--base-transform); animation: driftC 6.5s ease-in-out infinite; z-index: 5; }
        .rvh-mb-p10 { width: 25px; height: 25px; top: 4%;   right: 32%;  opacity: 0.7;  --base-transform: rotate(30deg) skew(10deg);  transform: var(--base-transform); animation: driftD 9s   ease-in-out infinite; z-index: 5; }
        .rvh-mb-p11 { width: 15px; height: 15px; top: 62%;  left: 5%;    opacity: 0.6;  --base-transform: rotate(-70deg) skew(12deg); transform: var(--base-transform); animation: driftB 7.5s ease-in-out infinite 1.2s; z-index: 5; }
        .rvh-mb-p12 { width: 19px; height: 19px; bottom: 26%; left: 46%; opacity: 0.5;  --base-transform: rotate(155deg) skew(8deg);  transform: var(--base-transform); animation: driftE 8s   ease-in-out infinite 0.6s; z-index: 5; }
        .rvh-mb-p13 { width: 13px; height: 13px; top: 22%;  left: 30%;   opacity: 0.5;  --base-transform: rotate(10deg) skew(14deg);  transform: var(--base-transform); animation: driftC 6s   ease-in-out infinite 2s; z-index: 5; }
        .rvh-mb-p14 { width: 27px; height: 27px; bottom: 4%; left: 24%;  opacity: 0.6;  --base-transform: rotate(-15deg) skew(10deg); transform: var(--base-transform); animation: driftD 10s  ease-in-out infinite 1.6s; z-index: 5; }

        /* Third section petals */
        .rvh-mb-p4 { width: 32px; height: 32px; top: -4%; right: 12%; --base-transform: rotate(45deg) skew(5deg); transform: var(--base-transform); animation: driftD 10s ease-in-out infinite; }
        .rvh-mb-p5 { width: 24px; height: 24px; bottom: 6%; left: 8%; --base-transform: rotate(-60deg) skew(15deg); transform: var(--base-transform); animation: driftE 11s ease-in-out infinite; }
        .rvh-mb-p6 { width: 18px; height: 18px; top: 30%; left: 20%; opacity: 0.55; --base-transform: rotate(15deg) skew(10deg); transform: var(--base-transform); animation: driftC 9s ease-in-out infinite 1s; }

        /* fuller, faster, but still feather-light drifting */
        @keyframes driftA {
            0%   { transform: var(--base-transform) translate(0, 0) rotate(0deg); }
            25%  { transform: var(--base-transform) translate(-34px, 46px) rotate(-70deg); }
            50%  { transform: var(--base-transform) translate(-70px, 96px) rotate(-150deg) scale(1.08); }
            75%  { transform: var(--base-transform) translate(-26px, 52px) rotate(-232deg); }
            100% { transform: var(--base-transform) translate(0, 0) rotate(-360deg); }
        }
        @keyframes driftB {
            0%   { transform: var(--base-transform) translate(0, 0) rotate(0deg); }
            30%  { transform: var(--base-transform) translate(48px, -40px) rotate(90deg); }
            60%  { transform: var(--base-transform) translate(96px, 28px) rotate(200deg) scale(1.12); }
            100% { transform: var(--base-transform) translate(0, 0) rotate(360deg); }
        }
        @keyframes driftC {
            0%   { transform: var(--base-transform) translate(0, 0) rotate(0deg); }
            50%  { transform: var(--base-transform) translate(44px, 82px) rotate(180deg) scale(0.92); }
            100% { transform: var(--base-transform) translate(0, 0) rotate(360deg); }
        }
        @keyframes driftD {
            0%   { transform: var(--base-transform) translate(0, 0) rotate(0deg); }
            35%  { transform: var(--base-transform) translate(-56px, 60px) rotate(-110deg) scale(1.06); }
            70%  { transform: var(--base-transform) translate(30px, 110px) rotate(-220deg) scale(0.95); }
            100% { transform: var(--base-transform) translate(0, 0) rotate(-360deg); }
        }
        @keyframes driftE {
            0%   { transform: var(--base-transform) translate(0, 0) rotate(0deg); }
            40%  { transform: var(--base-transform) translate(70px, 54px) rotate(130deg); }
            80%  { transform: var(--base-transform) translate(18px, 108px) rotate(280deg) scale(1.1); }
            100% { transform: var(--base-transform) translate(0, 0) rotate(360deg); }
        }

        /* Responsive Fixes */
        @media (max-width: 1024px) {
            .rvh-mb-hero-section { flex-direction: column; height: auto; padding-bottom: 2rem; }
            .rvh-mb-left-content { padding: 4rem 0 2rem 0; }
            .rvh-mb-right-content { height: 700px; margin-top: 2rem; }
            .rvh-mb-img-main { left: 0; width: 300px; height: 420px; }
            .rvh-mb-img-tr { width: 220px; height: 220px; right: 0; }
            .rvh-mb-img-br { width: 220px; height: 240px; right: 0; bottom: 25%; }
            .rvh-mb-memo-card { left: 15%; bottom: 5%; }
            .rvh-mb-section-tagline { font-size: 1.8rem; }

        }
        /* ============================================================
           SAVE YOUR DATE  —  paper tile, flipping keepsake card
           ============================================================ */
        :root {
            --blush: #F7DCE1;
            --blush-deep: #E9B9C3;
            --blush-soft: #FDF3F4;
            --ink-soft: rgba(59, 51, 45, 0.62);
        }

        .rvh-mb-savedate-section {
            position: relative;
            z-index: 2;
            width: 100%;
            max-width: 1400px;
            padding: 80px 22px 120px;
            display: flex;
            flex-direction: column;
            align-items: center;
        }

        .rvh-mb-std-eyebrow {
            font-family: 'Cinzel', serif;
            font-size: 0.8rem;
            letter-spacing: 6px;
            text-transform: uppercase;
            color: var(--gold);
            text-align: center;
        }

        /* ---------- THE PAPER TILE (same language as the Traditions book) ---------- */
        .rvh-mb-std-flip {
            position: relative;
            width: 100%;
            max-width: 1240px;
            margin-top: 34px;
            perspective: 2400px;
            perspective-origin: 50% 42%;
        }
        .rvh-mb-std-flip-inner {
            position: relative;
            width: 100%;
            transform-style: preserve-3d;
            will-change: transform;
            transform: rotateY(0deg) translateZ(0);
            transition: transform 1.15s cubic-bezier(0.45, 0.05, 0.15, 1);
            /* height is set directly (not transitioned) to whichever face is
               tallest, so the 3D flip never has to fight a layout reflow
               mid-animation \u2014 this is what was causing the stutter */
        }
        .rvh-mb-savedate-section.rvh-mb-is-sealed .rvh-mb-std-flip-inner { transform: rotateY(180deg); }

        .rvh-mb-std-face {
            position: absolute;
            top: 0; left: 0;
            width: 100%;
            backface-visibility: hidden;
            -webkit-backface-visibility: hidden;
            transform-style: preserve-3d;
            will-change: transform;
            transform: translateZ(0);
            border-radius: 8px;
            padding: 56px 58px 62px;
            background: radial-gradient(ellipse at 50% 14%, var(--paper-center) 0%, var(--paper-mid) 54%, var(--paper-edge) 100%);
            /* the tile now floats above the page paper */
            box-shadow:
                0 2px 4px rgba(120, 96, 52, 0.10),
                0 14px 28px -12px rgba(120, 96, 52, 0.24),
                0 48px 90px -38px rgba(112, 78, 62, 0.42),
                0 80px 120px -60px rgba(112, 78, 62, 0.30),
                inset 0 1px 0 rgba(255,255,255,0.9);
            overflow: hidden;
            transition: box-shadow 0.9s ease;
        }
        .rvh-mb-std-face.rvh-mb-back { transform: rotateY(180deg); }
        /* the hidden face must never steal a click mid-flip */
        .rvh-mb-std-face.rvh-mb-back { pointer-events: none; }
        .rvh-mb-savedate-section.rvh-mb-is-sealed .rvh-mb-std-face.rvh-mb-back { pointer-events: auto; }
        .rvh-mb-savedate-section.rvh-mb-is-sealed .rvh-mb-std-face.rvh-mb-front { pointer-events: none; }
        /* a soft cast shadow under the floating tile */
        .rvh-mb-std-flip::after {
            content: '';
            position: absolute;
            left: 6%; right: 6%; bottom: -34px;
            height: 46px;
            border-radius: 50%;
            background: radial-gradient(ellipse at 50% 50%, rgba(112, 78, 62, 0.20) 0%, rgba(112, 78, 62, 0.07) 48%, transparent 74%);
            filter: blur(10px);
            pointer-events: none;
            z-index: -1;
        }
        /* paper grain */
        .rvh-mb-std-face::before {
            content: '';
            position: absolute; inset: 0;
            background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 300 300' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='sd'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23sd)'/%3E%3C/svg%3E");
            opacity: 0.28; mix-blend-mode: multiply; pointer-events: none; z-index: 1;
        }
        .rvh-mb-std-face::after {
            content: '';
            position: absolute; inset: 0;
            background:
                radial-gradient(circle at 8% 92%, rgba(120,96,52,0.10), transparent 42%),
                radial-gradient(circle at 96% 6%, rgba(120,96,52,0.08), transparent 40%);
            pointer-events: none; z-index: 1;
        }
        /* engraved gold double frame + corner motifs, exactly like the book */
        .rvh-mb-std-frame {
            position: absolute; inset: 18px;
            border: 1px solid rgba(181, 149, 92, 0.5);
            border-radius: 3px;
            pointer-events: none; z-index: 3;
        }
        .rvh-mb-std-frame::after {
            content: '';
            position: absolute; inset: 7px;
            border: 1px solid rgba(181, 149, 92, 0.2);
            border-radius: 2px;
        }
        .rvh-mb-std-corner {
            position: absolute;
            width: 70px; height: 70px;
            border: 0 solid rgba(181, 149, 92, 0.85);
            pointer-events: none; z-index: 4;
        }
        .rvh-mb-std-corner::after {
            content: '\2748';
            position: absolute;
            color: rgba(181, 149, 92, 0.9);
            font-size: 14px; line-height: 1;
        }
        .rvh-mb-sc-tl { top: 18px; left: 18px; border-top-width: 2px; border-left-width: 2px; }
        .rvh-mb-sc-tl::after { top: 6px; left: 8px; }
        .rvh-mb-sc-tr { top: 18px; right: 18px; border-top-width: 2px; border-right-width: 2px; }
        .rvh-mb-sc-tr::after { top: 6px; right: 8px; }
        .rvh-mb-sc-bl { bottom: 18px; left: 18px; border-bottom-width: 2px; border-left-width: 2px; }
        .rvh-mb-sc-bl::after { bottom: 6px; left: 8px; }
        .rvh-mb-sc-br { bottom: 18px; right: 18px; border-bottom-width: 2px; border-right-width: 2px; }
        .rvh-mb-sc-br::after { bottom: 6px; right: 8px; }
        /* faint damask dots */
        .rvh-mb-std-motif {
            position: absolute; inset: 0;
            opacity: 0.16; z-index: 1; pointer-events: none;
            background-image:
                radial-gradient(circle at 12% 22%, rgba(181,149,92,0.35) 0 2px, transparent 3px),
                radial-gradient(circle at 26% 68%, rgba(181,149,92,0.3) 0 2px, transparent 3px),
                radial-gradient(circle at 8% 82%, rgba(181,149,92,0.25) 0 2px, transparent 3px);
            background-size: 260px 260px;
        }

        .rvh-mb-std-grid {
            position: relative;
            z-index: 6;
            display: grid;
            grid-template-columns: minmax(260px, 0.72fr) minmax(430px, 1fr);
            gap: 40px;
            align-items: center;
        }

        /* ---------- PHOTOBOOTH STRIPS ---------- */
        .rvh-mb-strip-theatre {
            position: relative;
            height: 620px;
            display: flex;
            align-items: center;
            justify-content: center;
        }
        .rvh-mb-photo-strip {
            position: absolute;
            top: 50%;
            width: 190px;
            padding: 13px 13px 32px;
            background: linear-gradient(180deg, #FFFDFB 0%, #FBF5EE 100%);
            box-shadow: 6px 16px 34px -12px rgba(110, 90, 60, 0.42);
            transition: transform 1.5s cubic-bezier(0.62, 0.01, 0.24, 1), box-shadow 1.2s ease, filter 1.2s ease;
            will-change: transform;
        }
        .rvh-mb-photo-strip::before,
        .rvh-mb-photo-strip::after {
            content: '';
            position: absolute;
            top: 0; bottom: 0;
            width: 9px;
            background-image: radial-gradient(circle at 50% 9px, var(--paper-mid) 5px, transparent 5.5px);
            background-size: 9px 18px;
            background-repeat: repeat-y;
        }
        .rvh-mb-photo-strip::before { left: -4px; }
        .rvh-mb-photo-strip::after { right: -4px; }
        .rvh-mb-photo-strip img.rvh-mb-strip-photo {
            display: block;
            width: 100%;
            height: 172px;
            object-fit: cover;
            filter: saturate(1.04) contrast(1.02) brightness(1.02);
            margin-bottom: 11px;
        }
        .rvh-mb-photo-strip img.rvh-mb-strip-photo:last-of-type { margin-bottom: 0; }
        .rvh-mb-strip-caption {
            position: absolute;
            left: 4px; right: 4px; bottom: 8px;
            white-space: nowrap; overflow: hidden; text-align: center;
            font-family: 'Caveat', cursive;
            font-size: 0.84rem;
            color: rgba(108, 21, 28, 0.72);
        }
        /* the real golden clip image */
        .rvh-mb-clip-img {
            position: absolute;
            top: -46px; left: 50%;
            transform: translateX(-50%);
            width: 86px;
            height: auto;
            z-index: 6;
            filter: drop-shadow(0 8px 12px rgba(90, 70, 40, 0.42));
            pointer-events: none;
        }
        .rvh-mb-photo-strip.rvh-mb-at-front { transform: translate(-58%, -50%) rotate(-3.2deg); z-index: 3; }
        .rvh-mb-photo-strip.rvh-mb-at-back {
            transform: translate(24%, -46%) rotate(3.6deg) scale(0.93);
            z-index: 2;
            box-shadow: 4px 12px 26px -14px rgba(110, 90, 60, 0.4);
        }
        .rvh-mb-photo-strip.rvh-mb-at-back .rvh-mb-clip-img { opacity: 0; transition: opacity 0.5s ease; }
        .rvh-mb-photo-strip.rvh-mb-at-front .rvh-mb-clip-img { opacity: 1; transition: opacity 0.6s ease 0.4s; }

        .rvh-mb-back-strips { height: 540px; align-self: center; }

        /* ---------- THE LETTER SIDE ---------- */
        .rvh-mb-std-letter { position: relative; }
        .rvh-mb-std-title {
            font-family: 'Cinzel', serif;
            font-size: clamp(1.7rem, 2.6vw, 2.35rem);
            font-weight: 400;
            letter-spacing: 5px;
            text-transform: uppercase;
            color: var(--brand-color);
            line-height: 1.2;
        }
        .rvh-mb-std-sub {
            font-family: 'Playfair Display', serif;
            font-style: italic;
            font-size: clamp(0.95rem, 1.2vw, 1.1rem);
            color: var(--text-dark);
            opacity: 0.8;
            margin-top: 12px;
            max-width: 380px;
            line-height: 1.6;
        }
        .rvh-mb-std-flourish { width: 210px; height: 24px; margin: 16px 0 30px; overflow: visible; }
        .rvh-mb-std-flourish path { fill: none; stroke: var(--gold); stroke-width: 1.1; opacity: 0.85; }

        /* primary step : the date */
        .rvh-mb-step-primary { max-width: 470px; }
        .rvh-mb-step-tag {
            display: flex; align-items: center; gap: 10px;
            font-family: 'Cinzel', serif;
            font-size: 0.62rem; letter-spacing: 3.4px; text-transform: uppercase;
            color: var(--brand-color);
            margin-bottom: 10px;
        }
        .rvh-mb-step-tag i {
            font-style: normal;
            width: 20px; height: 20px; border-radius: 50%;
            display: grid; place-items: center;
            font-size: 0.6rem;
            color: #FFFBEF;
            background: linear-gradient(140deg, var(--gold-light), var(--gold) 55%, #8d7748);
        }
        .rvh-mb-date-row { display: flex; align-items: flex-end; gap: 12px; }
        .rvh-mb-date-cell { display: flex; flex-direction: column; }
        .rvh-mb-date-cell.rvh-mb-yy { flex: 1.3 1 0; }
        .rvh-mb-date-cell.rvh-mb-dd, .rvh-mb-date-cell.rvh-mb-mm { flex: 1 1 0; }
        .rvh-mb-date-label {
            font-family: 'Cinzel', serif;
            font-size: 0.55rem; letter-spacing: 3px; text-transform: uppercase;
            color: rgba(108, 21, 28, 0.6);
            margin-bottom: 8px; text-align: center;
        }
        .rvh-mb-date-input {
            width: 100%; box-sizing: border-box;
            font-family: 'Cinzel', serif;
            font-size: clamp(1.5rem, 2.4vw, 2.1rem);
            letter-spacing: 2px;
            text-align: center;
            color: var(--brand-color);
            background: rgba(255, 255, 255, 0.72);
            border: 1px solid rgba(181, 149, 92, 0.45);
            border-radius: 5px;
            padding: 16px 8px 13px;
            outline: none;
            transition: background 0.4s ease, border-color 0.4s ease, box-shadow 0.4s ease;
        }
        .rvh-mb-date-input::placeholder { color: rgba(59,51,45,0.24); letter-spacing: 3px; }
        .rvh-mb-date-input:focus {
            background: #fff;
            border-color: var(--gold);
            box-shadow: 0 10px 22px -14px rgba(120, 96, 52, 0.7);
        }
        .rvh-mb-date-sep {
            font-family: 'Cinzel', serif;
            font-size: 1.4rem;
            color: rgba(181, 149, 92, 0.8);
            padding-bottom: 20px;
        }
        .rvh-mb-date-hint {
            font-family: 'Playfair Display', serif;
            font-style: italic; font-size: 0.82rem;
            color: var(--ink-soft);
            margin-top: 10px;
        }
        .rvh-mb-date-input.rvh-mb-missing { border-color: rgba(150, 40, 48, 0.85); background: rgba(255, 244, 244, 0.95); }

        /* secondary step : names, deliberately quieter */
        .rvh-mb-step-secondary {
            max-width: 470px;
            margin-top: 26px;
            padding-top: 20px;
            border-top: 1px dashed rgba(181, 149, 92, 0.42);
        }
        .rvh-mb-step-secondary .rvh-mb-step-note {
            font-family: 'Caveat', cursive;
            font-size: 1rem;
            color: var(--ink-soft);
            margin-bottom: 10px;
        }
        .rvh-mb-name-row { display: flex; gap: 14px; flex-wrap: wrap; }
        .rvh-mb-name-field { flex: 1 1 42%; min-width: 0; display: flex; flex-direction: column; }
        .rvh-mb-name-label {
            font-family: 'Cinzel', serif;
            font-size: 0.52rem; letter-spacing: 2.6px; text-transform: uppercase;
            color: rgba(59, 51, 45, 0.45);
            margin-bottom: 6px;
        }
        .rvh-mb-name-input {
            width: 100%; box-sizing: border-box;
            font-family: 'Playfair Display', serif;
            font-size: 0.78rem;
            color: var(--text-dark);
            background: transparent;
            border: none;
            border-bottom: 1px solid rgba(181, 149, 92, 0.4);
            padding: 7px 2px 6px;
            outline: none;
            transition: border-color 0.4s ease;
        }
        .rvh-mb-name-input::placeholder { color: rgba(59,51,45,0.26); font-style: italic; }
        .rvh-mb-name-input:focus { border-color: var(--gold); }

        .rvh-mb-btn-seal {
            margin-top: 26px;
            font-family: 'Cinzel', serif;
            font-size: 0.72rem; letter-spacing: 4px; text-transform: uppercase;
            color: #fffaf0;
            padding: 15px 34px;
            border: none; border-radius: 999px; cursor: pointer;
            position: relative;
            background: linear-gradient(135deg, #83202a 0%, var(--brand-color) 45%, #521015 100%);
            box-shadow: 0 14px 26px rgba(108,21,28,0.32), inset 0 1px 0 rgba(255,255,255,0.22);
            transition: transform 0.35s cubic-bezier(.2,.8,.2,1), box-shadow 0.35s ease;
        }
        .rvh-mb-btn-seal::after {
            content: '';
            position: absolute; inset: 4px;
            border: 1px solid rgba(226,205,166,0.5);
            border-radius: 999px;
            pointer-events: none;
        }
        .rvh-mb-btn-seal:hover { transform: translateY(-3px); box-shadow: 0 20px 34px rgba(108,21,28,0.38), inset 0 1px 0 rgba(255,255,255,0.28); }
        .rvh-mb-btn-seal.rvh-mb-ghost {
            background: transparent;
            color: var(--brand-color);
            border: 1px solid rgba(181, 149, 92, 0.75);
            box-shadow: none;
            padding: 13px 28px;
        }
        .rvh-mb-btn-seal.rvh-mb-ghost::after { content: none; }
        .rvh-mb-btn-seal.rvh-mb-ghost:hover { background: rgba(255,255,255,0.7); }

        /* ============ BACK FACE : THE SEALED KEEPSAKE ============ */
        .rvh-mb-back-inner {
            position: relative; z-index: 6;
            padding: 6px 0 4px;
            display: grid;
            grid-template-columns: minmax(0, 1fr) minmax(300px, 0.62fr);
            gap: 44px;
            align-items: center;
        }
        .rvh-mb-sealed-col { position: relative; text-align: center; }

        .rvh-mb-sealed-eyebrow {
            font-family: 'Cinzel', serif;
            font-size: 0.58rem; letter-spacing: 5px; text-transform: uppercase;
            color: var(--gold);
        }
        .rvh-mb-sealed-names {
            font-family: 'Great Vibes', cursive;
            font-size: clamp(2rem, 3.6vw, 3rem);
            line-height: 1.16;
            color: var(--brand-color);
            margin-top: 10px;
        }
        .rvh-mb-sealed-date {
            font-family: 'Cinzel', serif;
            font-size: clamp(0.72rem, 1.05vw, 0.86rem);
            letter-spacing: 6px; text-transform: uppercase;
            color: var(--ink-soft);
            margin-top: 14px;
        }
        .rvh-mb-sealed-rule {
            width: 150px; height: 1px; margin: 20px auto 0;
            background: linear-gradient(to right, transparent, var(--gold), transparent);
            position: relative;
        }
        .rvh-mb-sealed-rule::after {
            content: '\2748';
            position: absolute; top: -9px; left: 50%; transform: translateX(-50%);
            color: var(--gold); font-size: 11px;
            background: transparent;
        }

        /* gentle entrance for everything on the sealed face */
        .rvh-mb-reveal { opacity: 0; transform: translateY(14px); }
        .rvh-mb-savedate-section.rvh-mb-is-sealed .rvh-mb-reveal {
            animation: sealedRise 1.05s cubic-bezier(0.22, 1, 0.32, 1) forwards;
            animation-delay: calc(0.62s + var(--i, 0) * 0.09s);
        }
        @keyframes sealedRise {
            from { opacity: 0; transform: translateY(14px); }
            to { opacity: 1; transform: translateY(0); }
        }

        /* ---------- COUNTDOWN : soft pink gradient tiles ---------- */
        .rvh-mb-countdown {
            display: flex; justify-content: center; flex-wrap: wrap;
            gap: clamp(12px, 1.7vw, 20px);
            margin-top: 30px;
        }
        .rvh-mb-count-card {
            position: relative;
            width: clamp(96px, 11.4vw, 138px);
            padding: clamp(18px, 2.1vw, 26px) 10px clamp(15px, 1.7vw, 20px);
            border-radius: 16px;
            text-align: center;
            /* the outer blush rim, exactly like the reference tiles */
            background: linear-gradient(168deg, #FBE4EA 0%, #F7D9E2 100%);
            box-shadow:
                0 3px 6px rgba(150, 104, 116, 0.10),
                0 18px 30px -16px rgba(150, 104, 116, 0.34),
                0 34px 46px -30px rgba(112, 78, 62, 0.28);
        }
        .rvh-mb-count-card::before {
            content: '';
            position: absolute; inset: 6px;
            border-radius: 11px;
            background: linear-gradient(172deg, #FFF6F8 0%, #FDECF1 46%, #F9DDE5 100%);
            box-shadow: inset 0 1px 0 rgba(255,255,255,0.95), inset 0 -10px 18px -10px rgba(160, 110, 122, 0.20);
        }
        .rvh-mb-count-card::after {
            content: '';
            position: absolute; inset: 11px;
            border: 1px solid rgba(255, 255, 255, 0.75);
            border-radius: 8px; pointer-events: none;
        }
        .rvh-mb-count-inner { position: relative; z-index: 2; }
        .rvh-mb-count-num {
            font-family: 'Playfair Display', serif;
            font-weight: 400;
            font-size: clamp(2rem, 3.4vw, 3rem);
            line-height: 1;
            color: var(--brand-color);
            font-variant-numeric: tabular-nums;
        }
        .rvh-mb-count-rule { width: 22px; height: 1px; margin: 12px auto 9px; background: var(--gold); opacity: 0.75; }
        .rvh-mb-count-label {
            font-family: 'Cinzel', serif;
            font-size: 0.54rem; letter-spacing: 3.4px; text-transform: uppercase;
            color: rgba(59, 51, 45, 0.55);
        }

        .rvh-mb-stage-card {
            position: relative;
            margin: 40px auto 0;
            max-width: 720px;
            padding: 30px 34px 34px;
            text-align: center;
        }
        .rvh-mb-stage-card::before {
            content: '';
            position: absolute; left: 50%; top: 0;
            transform: translateX(-50%);
            width: 160px; height: 1px;
            background: linear-gradient(to right, transparent, var(--gold), transparent);
        }
        .rvh-mb-stage-chapter { font-family: 'Caveat', cursive; font-size: 1.1rem; color: rgba(108, 21, 28, 0.72); }
        .rvh-mb-stage-name {
            font-family: 'Cinzel', serif;
            font-size: clamp(1.1rem, 2vw, 1.55rem);
            letter-spacing: 6px; text-transform: uppercase;
            color: var(--brand-color);
            margin-top: 6px;
        }
        .rvh-mb-stage-line {
            width: 140px; height: 1px; margin: 16px auto;
            background: linear-gradient(to right, transparent, var(--gold), transparent);
            position: relative;
        }
        .rvh-mb-stage-line::after {
            content: '\2756';
            position: absolute; top: -10px; left: 50%; transform: translateX(-50%);
            color: var(--gold); font-size: 12px;
        }
        .rvh-mb-stage-message {
            font-family: 'Playfair Display', serif;
            font-style: italic;
            font-size: clamp(0.95rem, 1.2vw, 1.1rem);
            line-height: 1.75;
            color: var(--text-dark);
            opacity: 0.86;
            max-width: 560px; margin: 0 auto;
        }
        .rvh-mb-stage-actions {
            display: flex; flex-wrap: wrap; justify-content: center; align-items: center;
            gap: 14px; margin-top: 26px;
        }
        .rvh-mb-stage-cta {
            font-family: 'Cinzel', serif;
            font-size: 0.64rem; letter-spacing: 3.2px; text-transform: uppercase;
            padding: 14px 26px;
            border-radius: 999px; cursor: pointer;
            border: 1px solid rgba(181, 149, 92, 0.7);
            color: var(--brand-color);
            background: rgba(255,255,255,0.7);
            transition: transform 0.5s cubic-bezier(0.25,1,0.5,1), box-shadow 0.5s ease, background 0.5s ease;
        }
        .rvh-mb-stage-cta:hover { transform: translateY(-3px); box-shadow: 0 18px 30px -18px rgba(120,96,52,0.6); }
        .rvh-mb-stage-cta.rvh-mb-primary {
            background: linear-gradient(140deg, #7d1b23, var(--brand-color) 50%, #560f15);
            color: #FFF9F6; border-color: transparent;
            box-shadow: 0 18px 32px -18px rgba(108,21,28,0.6);
        }
        .rvh-mb-stage-cta.rvh-mb-share { display: inline-flex; align-items: center; gap: 8px; }
        .rvh-mb-stage-hint { font-family: 'Caveat', cursive; font-size: 1.02rem; color: var(--ink-soft); margin-top: 16px; }
        .rvh-mb-back-foot { margin-top: 26px; text-align: center; }

        @media (max-width: 1080px) {
            .rvh-mb-std-face { padding: 40px 22px 48px; }
            .rvh-mb-std-grid { grid-template-columns: 1fr; gap: 26px; }
            .rvh-mb-back-inner { grid-template-columns: 1fr; gap: 12px; }
            .rvh-mb-back-inner .rvh-mb-sealed-col { order: 1; }
            .rvh-mb-back-inner .rvh-mb-strip-theatre { order: 2; }
            .rvh-mb-strip-theatre { height: 540px; order: 2; }
            .rvh-mb-std-letter { order: 1; text-align: center; }
            .rvh-mb-std-sub, .rvh-mb-step-primary, .rvh-mb-step-secondary { margin-left: auto; margin-right: auto; }
            .rvh-mb-std-flourish { margin-left: auto; margin-right: auto; }
            .rvh-mb-step-tag { justify-content: center; }
            .rvh-mb-btn-seal { display: block; margin-left: auto; margin-right: auto; }
            .rvh-mb-photo-strip { width: 152px; }
            .rvh-mb-photo-strip img.rvh-mb-strip-photo { height: 138px; }
            .rvh-mb-clip-img { width: 70px; top: -38px; }
            .rvh-mb-photo-strip.rvh-mb-at-front { transform: translate(-52%, -50%) rotate(-3deg); }
            .rvh-mb-photo-strip.rvh-mb-at-back { transform: translate(18%, -46%) rotate(3.4deg) scale(0.93); }
        }
        @media (max-width: 560px) {
            .rvh-mb-savedate-section { padding: 56px 12px 90px; }
            .rvh-mb-strip-theatre { height: 460px; }
            .rvh-mb-photo-strip { width: 122px; padding: 9px 9px 26px; }
            .rvh-mb-photo-strip img.rvh-mb-strip-photo { height: 108px; margin-bottom: 8px; }
            .rvh-mb-strip-caption { font-size: 0.85rem; }
            .rvh-mb-clip-img { width: 58px; top: -30px; }
            .rvh-mb-count-card { width: 42%; }
            .rvh-mb-date-input { font-size: 1.25rem; padding: 13px 4px 11px; }
        }

        /* ---------- THE REAL ENVELOPE, HOLDING THE DATE CARD ---------- */
        .rvh-mb-env-stage {
            position: relative;
            width: 100%;
            max-width: 520px;
            margin: 6px 0 4px;
        }
        .rvh-mb-env-tilt {
            position: relative;
            transform: rotate(-2.2deg);
            transform-origin: 50% 60%;
            transition: transform 1.1s cubic-bezier(0.22, 1, 0.36, 1);
        }
        .rvh-mb-env-stage:hover .rvh-mb-env-tilt,
        .rvh-mb-env-stage:focus-within .rvh-mb-env-tilt { transform: rotate(-1deg) translateY(-6px); }
        /* the soft shadow the envelope casts on the paper below it */
        .rvh-mb-env-tilt::after {
            content: '';
            position: absolute;
            left: 8%; right: 8%; bottom: -3.5%;
            height: 9%;
            background: radial-gradient(50% 50% at 50% 50%, rgba(86, 66, 58, 0.34), rgba(86, 66, 58, 0) 72%);
            filter: blur(7px);
            z-index: -1;
            transition: opacity 1.1s ease, transform 1.1s cubic-bezier(0.22, 1, 0.36, 1);
        }
        .rvh-mb-env-stage:hover .rvh-mb-env-tilt::after { transform: scale(1.04) translateY(4px); opacity: 0.85; }
        .rvh-mb-env-img {
            display: block;
            width: 100%;
            height: auto;
            filter:
                drop-shadow(0 1px 1px rgba(74, 58, 52, 0.22))
                drop-shadow(0 8px 14px rgba(74, 58, 52, 0.20))
                drop-shadow(0 30px 46px rgba(74, 58, 52, 0.26));
        }
        /* the writable card inside the envelope */
        .rvh-mb-env-paper {
            position: absolute;
            left: 10.5%; right: 10.5%;
            top: 27%;
            display: flex;
            align-items: flex-end;
            justify-content: center;
            gap: clamp(5px, 0.9vw, 10px);
        }
        .rvh-mb-dtile { flex: 1 1 0; min-width: 0; text-align: center; }
        .rvh-mb-dtile.rvh-mb-yy { flex: 1.34 1 0; }
        .rvh-mb-dtile-label {
            display: block;
            font-family: 'Cinzel', serif;
            font-size: clamp(0.4rem, 0.62vw, 0.56rem);
            letter-spacing: 3px;
            text-transform: uppercase;
            color: rgba(150, 106, 74, 0.78);
            margin-bottom: clamp(4px, 0.7vw, 8px);
        }
        .rvh-mb-dtile-inner {
            position: relative;
            border-radius: clamp(8px, 1vw, 13px);
            background: linear-gradient(176deg, #FEFCF7 0%, #F8F2E7 100%);
            border: 1px solid rgba(181, 149, 92, 0.55);
            box-shadow:
                inset 0 1px 0 rgba(255, 255, 255, 0.9),
                inset 0 -8px 14px -10px rgba(150, 118, 78, 0.35),
                0 6px 12px -8px rgba(120, 94, 62, 0.4);
            transition: box-shadow 0.5s ease, transform 0.5s cubic-bezier(0.25, 1, 0.5, 1), border-color 0.5s ease;
        }
        .rvh-mb-dtile-input {
            position: relative;
            z-index: 2;
            display: block;
            width: 100%; box-sizing: border-box;
            border: none; background: transparent; outline: none;
            font-family: 'Playfair Display', serif;
            font-size: clamp(1.35rem, 2.5vw, 2.3rem);
            line-height: 1.1;
            letter-spacing: 1px;
            text-align: center;
            color: var(--brand-color);
            padding: clamp(10px, 1.5vw, 18px) 2px clamp(10px, 1.5vw, 18px);
            cursor: text;
        }
        .rvh-mb-dtile-input::placeholder { color: rgba(108, 21, 28, 0.22); }
        .rvh-mb-dtile-slash {
            font-family: 'Playfair Display', serif;
            font-size: clamp(0.9rem, 1.5vw, 1.35rem);
            color: rgba(181, 149, 92, 0.75);
            padding-bottom: clamp(12px, 1.7vw, 20px);
            user-select: none;
        }
        .rvh-mb-dtile:focus-within .rvh-mb-dtile-inner {
            transform: translateY(-2px);
            border-color: rgba(181, 149, 92, 0.95);
            box-shadow:
                inset 0 1px 0 rgba(255, 255, 255, 0.95),
                0 0 0 2px rgba(181, 149, 92, 0.18),
                0 12px 20px -10px rgba(120, 94, 62, 0.45);
        }
        .rvh-mb-dtile:has(.rvh-mb-dtile-input.rvh-mb-missing) .rvh-mb-dtile-inner {
            border-color: rgba(150, 40, 48, 0.7);
            box-shadow: 0 0 0 2px rgba(150, 40, 48, 0.14), 0 10px 18px -12px rgba(150, 40, 48, 0.4);
        }
        /* the little vow written on the card, under the tiles */
        .rvh-mb-env-quote {
            position: absolute;
            left: 24%; right: 24%;
            top: 54%;
            text-align: center;
            pointer-events: none;
        }
        .rvh-mb-env-quote .rvh-mb-eq-rule {
            display: block; width: 46px; height: 1px; margin: 0 auto 7px;
            background: linear-gradient(90deg, transparent, rgba(181,149,92,0.85), transparent);
        }
        .rvh-mb-env-quote p {
            font-family: 'Playfair Display', serif;
            font-style: italic;
            font-size: clamp(0.52rem, 0.95vw, 0.82rem);
            line-height: 1.62;
            color: rgba(90, 46, 44, 0.78);
            margin: 0;
        }
        .rvh-mb-env-quote .rvh-mb-eq-mark {
            display: block;
            font-family: 'Cinzel', serif;
            font-size: clamp(0.4rem, 0.6vw, 0.52rem);
            letter-spacing: 3px;
            color: rgba(181, 149, 92, 0.85);
            margin-top: 6px;
        }

        @media (max-width: 1080px) {
            .rvh-mb-env-stage { margin-left: auto; margin-right: auto; }
        }
        @media (max-width: 560px) {
            .rvh-mb-env-paper { left: 9%; right: 9%; top: 28%; gap: 4px; }
            .rvh-mb-dtile-label { letter-spacing: 2px; margin-bottom: 3px; }
            .rvh-mb-dtile-inner { border-radius: 8px; }
            .rvh-mb-dtile-input { padding: 8px 1px; }
            .rvh-mb-env-quote { left: 18%; right: 18%; top: 55%; }
            .rvh-mb-env-quote .rvh-mb-eq-rule { width: 32px; margin-bottom: 4px; }
        }
    
        /* ================= RIVAAH WEDDING MOODBOARD ================= */
        .rvh-mb-mood-section {
            position: relative;
            z-index: 2;
            width: 100%;
            padding: 58px 24px 72px;
            display: flex;
            flex-direction: column;
            align-items: center;
            background: transparent;
        }
        .rvh-mb-mood-eyebrow {
            font-family: 'Cinzel', serif;
            font-size: 0.72rem;
            letter-spacing: 0.42em;
            text-transform: uppercase;
            color: var(--gold);
            margin-bottom: 14px;
        }
        .rvh-mb-mood-heading {
            font-family: 'Cinzel', serif;
            font-weight: 500;
            font-size: clamp(1.6rem, 3vw, 2.6rem);
            line-height: 1.2;
            letter-spacing: 3px;
            text-transform: uppercase;
            color: var(--brand-color);
            text-align: center;
            margin: 0;
            text-shadow: 0 1px 0 rgba(255,255,255,0.7);
        }
        .rvh-mb-mood-sub {
            font-family: 'Playfair Display', serif;
            font-style: italic;
            font-size: clamp(0.95rem, 1.3vw, 1.1rem);
            line-height: 1.65;
            color: var(--text-dark);
            opacity: 0.72;
            text-align: center;
            max-width: 560px;
            margin: 10px auto 4px;
        }
        .rvh-mb-mood-rule {
            width: 110px; height: 1px; margin: 14px auto 4px;
            background: linear-gradient(90deg, transparent, var(--gold-light), var(--gold), var(--gold-light), transparent);
        }

        .rvh-mb-mood-workspace {
            width: 100%;
            max-width: 1540px;
            margin: 0 auto;
            position: relative;
        }

        /* ---- the open journal, floating with depth ---- */
        .rvh-mb-mood-stage {
            position: relative;
            width: 100%;
            max-width: 1360px;
            aspect-ratio: 1340 / 740;
            margin: 20px auto 0;
            perspective: 1600px;
            flex: 1 1 auto;
            min-width: 0;
            transition: transform 0.65s cubic-bezier(.2,.8,.2,1), filter 0.45s ease;
        }
        .rvh-mb-mood-stage.rvh-mb-is-builder {
            transform: translateX(-4%) scale(0.96);
            transform-origin: center center;
        }
        .rvh-mb-mood-stage::after {
            content: '';
            position: absolute;
            left: 25%;
            right: 25%;
            bottom: 7%;
            height: 78px;
            background: radial-gradient(ellipse at 50% 50%, rgba(60,44,30,0.20) 0%, rgba(60,44,30,0.08) 46%, rgba(60,44,30,0) 76%);
            filter: blur(13px);
            z-index: 0;
            pointer-events: none;
        }
        .rvh-mb-mood-book {
            position: absolute;
            z-index: 1;
            top: 13%;
            left: 50%;
            width: 58%;
            margin-left: -29%;
            transform: rotate(-3.2deg);
            transform-origin: center center;
            animation: moodFloat 9s ease-in-out infinite;
            pointer-events: none;
            opacity: 0.96;
        }
        .rvh-mb-mood-stage.rvh-mb-is-builder .rvh-mb-mood-book {
            transform: rotate(-3.2deg) scale(0.96);
        }
        @keyframes moodFloat {
            0%,100% { transform: rotate(-3.2deg) translateY(0); }
            50%     { transform: rotate(-2.7deg) translateY(-7px); }
        }
        .rvh-mb-mood-book > img.rvh-mb-mood-book-img {
            width: 100%; height: auto;
            display: block;
            filter:
                drop-shadow(0 26px 34px rgba(58,42,28,0.34))
                drop-shadow(0 60px 90px rgba(58,42,28,0.22))
                drop-shadow(0 2px 3px rgba(58,42,28,0.18));
        }

        /* ---- items scattered on the pages ---- */
        .rvh-mb-mood-items { position: absolute; inset: 0; }

        /* STATE 1: pieces rise from the journal, arc outward and settle */
        .rvh-mb-mood-stage.rvh-mb-mood-awaiting .rvh-mb-mood-photo,
        .rvh-mb-mood-stage.rvh-mb-mood-awaiting .rvh-mb-mood-memo,
        .rvh-mb-mood-stage.rvh-mb-mood-awaiting .rvh-mb-mood-label {
            opacity: 0;
            pointer-events: none;
        }
        .rvh-mb-mood-stage.rvh-mb-mood-entering .rvh-mb-mood-item { pointer-events: none; }
        .rvh-mb-mood-stage.rvh-mb-mood-settled .rvh-mb-mood-item { pointer-events: auto; }
        .rvh-mb-mood-photo { transform-style: preserve-3d; backface-visibility: hidden; }
        .rvh-mb-mood-photo img { backface-visibility: hidden; }

        .rvh-mb-mood-item {
            position: absolute;
            transition: transform 0.45s cubic-bezier(.2,.8,.2,1), box-shadow 0.45s ease;
            will-change: transform;
        }
        .rvh-mb-mood-item:hover { z-index: 30 !important; }

        .rvh-mb-mood-photo {
            background: #fffdf8;
            padding: 11px 11px 38px;
            border-radius: 2px;
            box-shadow: 0 10px 20px rgba(58,42,28,0.26), 0 2px 4px rgba(58,42,28,0.18);
        }
        .rvh-mb-mood-photo img {
            display: block; width: 100%; height: 100%;
            object-fit: cover;
            filter: saturate(0.96) contrast(1.02);
        }
        .rvh-mb-mood-photo .rvh-mb-cap {
            position: absolute; left: 0; right: 0; bottom: 9px;
            text-align: center;
            font-family: 'Caveat', cursive;
            font-size: 1.3rem;
            color: #6b5a49;
        }
        .rvh-mb-mood-photo:hover { transform: var(--t, rotate(0deg)) scale(1.045) translateY(-4px); box-shadow: 0 18px 32px rgba(58,42,28,0.32); }

        /* washi tape strip */
        .rvh-mb-tape {
            position: absolute; top: -15px; left: 50%;
            width: 92px; height: 28px;
            transform: translateX(-50%) rotate(-3deg);
            background: linear-gradient(180deg, rgba(226,205,166,0.85), rgba(200,175,132,0.75));
            box-shadow: 0 2px 4px rgba(58,42,28,0.18);
            opacity: 0.92;
        }
        .rvh-mb-tape::before, .rvh-mb-tape::after {
            content: ''; position: absolute; top: 0; bottom: 0; width: 6px;
            background: repeating-linear-gradient(90deg, rgba(255,255,255,0.5) 0 2px, transparent 2px 4px);
        }
        .rvh-mb-tape::before { left: 0; } .rvh-mb-tape::after { right: 0; }
        .rvh-mb-tape.rvh-mb-right { left: 78%; transform: translateX(-50%) rotate(6deg); }
        .rvh-mb-tape.rvh-mb-left  { left: 22%; transform: translateX(-50%) rotate(-8deg); }

        /* handwritten memo notes */
        .rvh-mb-mood-memo {
            background: linear-gradient(180deg, #fffefb 0%, #f7f1e5 100%);
            padding: 11px 13px 12px;
            font-family: 'Caveat', cursive;
            font-size: clamp(1.08rem, 1.34vw, 1.36rem);
            line-height: 1.25;
            color: #4a3c30;
            box-shadow: 0 8px 16px rgba(58,42,28,0.2), 0 1px 2px rgba(58,42,28,0.16);
            border-radius: 1px;
        }
        .rvh-mb-mood-memo::after { /* torn-ish bottom edge */
            content: ''; position: absolute; left: 0; right: 0; bottom: -4px; height: 5px;
            background: radial-gradient(circle at 4px -2px, #f7f1e5 4px, transparent 4px) repeat-x;
            background-size: 9px 8px;
        }
        .rvh-mb-mood-memo .rvh-mb-pin-note { display: block; font-family: 'Cinzel', serif; font-size: 0.56rem; letter-spacing: 0.24em; color: var(--gold); margin-bottom: 5px; text-transform: uppercase; }
        .rvh-mb-mood-memo:hover { transform: var(--t, rotate(0deg)) scale(1.05); }

        /* pressed serif label */
        .rvh-mb-mood-label {
            font-family: 'Playfair Display', serif;
            font-style: italic;
            font-size: clamp(1.04rem, 1.3vw, 1.26rem);
            color: #4a3c30;
            background: rgba(255,253,248,0.92);
            padding: 7px 14px;
            box-shadow: 0 6px 14px rgba(58,42,28,0.16);
        }

        /* paper clip + thread flourishes */
        .rvh-mb-clip {
            position: absolute; top: -18px; left: 50%;
            width: 16px; height: 40px;
            transform: translateX(-50%) rotate(9deg);
            border: 2.5px solid #c9b489;
            border-radius: 10px;
            border-bottom-color: transparent;
            box-shadow: 0 2px 3px rgba(58,42,28,0.2);
        }
        .rvh-mb-mood-ink {
            position: absolute;
            font-family: 'Great Vibes', cursive;
            color: rgba(108,21,28,0.5);
            font-size: clamp(1rem, 1.6vw, 1.5rem);
            pointer-events: none;
        }
        .rvh-mb-mood-dot { position: absolute; border-radius: 50%; background: radial-gradient(circle at 32% 30%, #fff, #e6d7b8 60%, #c7b189); box-shadow: 0 2px 4px rgba(58,42,28,0.25); }

        /* ---- CTA ---- */
        /* The collage items are absolutely placed and the lowest memos hang a
           little below the stage's aspect-ratio box, so a flat 14px left only
           18-21px of air before the CTA on tablet and desktop -- close enough
           that a note reads as touching the button. Scale the margin with the
           viewport: mobile already had ~54px and is unchanged, wider screens
           gain the ~20px they were short. */
        .rvh-mb-mood-cta-wrap { margin-top: clamp(14px, 4.5vw, 36px); text-align: center; position: relative; z-index: 6; }
        .rvh-mb-mood-cta {
            appearance: none; border: none; cursor: pointer;
            font-family: 'Cinzel', serif;
            font-size: 0.8rem;
            letter-spacing: 0.24em;
            text-transform: uppercase;
            color: #fffaf0;
            background: linear-gradient(135deg, #83202a 0%, var(--brand-color) 45%, #521015 100%);
            padding: 14px 34px;
            border-radius: 999px;
            box-shadow: 0 14px 26px rgba(108,21,28,0.32), inset 0 1px 0 rgba(255,255,255,0.22);
            transition: transform 0.35s cubic-bezier(.2,.8,.2,1), box-shadow 0.35s ease;
            position: relative;
        }
        .rvh-mb-mood-cta::after {
            content: ''; position: absolute; inset: 4px;
            border: 1px solid rgba(226,205,166,0.5);
            border-radius: 999px;
            pointer-events: none;
        }
        .rvh-mb-mood-cta:hover { transform: translateY(-3px); box-shadow: 0 20px 34px rgba(108,21,28,0.38), inset 0 1px 0 rgba(255,255,255,0.28); }
        .rvh-mb-mood-section.rvh-mb-builder-active:not(.rvh-mb-has-content) .rvh-mb-mood-cta {
            opacity: 0.76;
            box-shadow: 0 9px 18px rgba(108,21,28,0.20), inset 0 1px 0 rgba(255,255,255,0.18);
        }
        .rvh-mb-mood-section.rvh-mb-builder-active.rvh-mb-has-content .rvh-mb-mood-cta {
            opacity: 1;
            box-shadow: 0 17px 32px rgba(108,21,28,0.34), inset 0 1px 0 rgba(255,255,255,0.26);
        }
        .rvh-mb-mood-cta-hint { margin-top: 14px; font-family: 'Playfair Display', serif; font-style: italic; font-size: 0.92rem; line-height: 1.55; color: var(--text-dark); opacity: 0.6; }

        /* utility link, not a primary CTA -- only shown once the board is
           interactive, so users have an escape hatch after dragging things
           around (see initDragRearrange / #moodLayoutReset below) */
        .rvh-mb-mood-layout-reset {
            display: none;
            margin: 10px auto 0;
            border: 0;
            background: transparent;
            cursor: pointer;
            font-family: 'Playfair Display', serif;
            font-style: italic;
            font-size: 0.82rem;
            color: var(--brand-color);
            border-bottom: 1px solid rgba(108,21,28,.45);
            padding: 2px 1px;
        }
        .rvh-mb-mood-layout-reset:hover { color: #521015; border-color: #521015; }
        .rvh-mb-mood-section.rvh-mb-builder-active .rvh-mb-mood-layout-reset { display: inline-block; }

        /* drag to rearrange (builder mode only, mouse + touch) */
        /* pan-y, not none. touch-action:none hands every touch on these tiles to
           JavaScript, scroll gestures included -- measured at 390px, ten tiles
           covering 21% of the section became unscrollable the moment the builder
           opened, so a finger landing on one stopped the page dead and the next
           swipe overshot into the section below. pan-y leaves vertical scrolling
           to the browser and still gives the drag handler horizontal movement.
           The cost is that rearranging on a phone is horizontal-only; scrolling
           past the section matters more than that. */
        .rvh-mb-mood-stage.rvh-mb-is-builder .rvh-mb-mood-item { cursor: grab; touch-action: pan-y; }
        .rvh-mb-mood-item.rvh-mb-is-dragging { cursor: grabbing; transition: none; }

        /* ---- placements (desktop) ---- */
        .rvh-mb-mi-1 { width: 17.5%; top: 3%;  left: 6%;    --t: rotate(-5deg);   transform: rotate(-5deg);   z-index: 6; }
        .rvh-mb-mi-1 img { height: 198px; }
        .rvh-mb-mi-2 { width: 15.5%; top: 59%; left: 7%;    --t: rotate(4deg);    transform: rotate(4deg);    z-index: 8; }
        .rvh-mb-mi-2 img { height: 160px; }
        .rvh-mb-mi-3 { width: 15.5%; top: 31%; left: 20%; --t: rotate(3.5deg);  transform: rotate(3.5deg);  z-index: 7; }
        .rvh-mb-mi-3 img { height: 164px; }
        .rvh-mb-mi-4 { width: 16.5%; top: 4%;  left: 41%; --t: rotate(-3deg);   transform: rotate(-3deg);   z-index: 15; }
        .rvh-mb-mi-4 img { height: 176px; }
        .rvh-mb-mi-5 { width: 14.5%; top: 61%; left: 34%;   --t: rotate(5deg);    transform: rotate(5deg);    z-index: 16; }
        .rvh-mb-mi-5 img { height: 144px; }
        .rvh-mb-mi-6 { width: 17.5%; top: 39%; left: 76%;   --t: rotate(-4.5deg); transform: rotate(-4.5deg); z-index: 8; }
        .rvh-mb-mi-6 img { height: 190px; }
        .rvh-mb-mi-7 { width: 14.5%; top: 5%;  left: 81%;   --t: rotate(6deg);    transform: rotate(6deg);    z-index: 6; }
        .rvh-mb-mi-7 img { height: 150px; }

        .rvh-mb-mm-1 { width: 14.5%; top: 39%; left: 2%;  --t: rotate(-4deg);   transform: rotate(-4deg);   z-index: 12; }
        .rvh-mb-mm-2 { width: 14.5%; top: 80%; left: 22%;   --t: rotate(3deg);    transform: rotate(3deg);    z-index: 12; }
        .rvh-mb-mm-3 { width: 14.5%; top: 31%; left: 59.5%; --t: rotate(-2.5deg); transform: rotate(-2.5deg); z-index: 17; }
        .rvh-mb-mm-4 { width: 14.5%; top: 64%; left: 54%;   --t: rotate(5deg);    transform: rotate(5deg);    z-index: 17; }
        .rvh-mb-mm-5 { width: 14.5%; top: 72%; left: 73%;   --t: rotate(2deg);    transform: rotate(2deg);    z-index: 12; }
        .rvh-mb-ml-1 { top: 3%;  left: 61%; --t: rotate(-2deg);  transform: rotate(-2deg);  z-index: 18; }
        .rvh-mb-ml-2 { top: 82%; left: 42%; --t: rotate(2.5deg); transform: rotate(2.5deg); z-index: 18; }

        .rvh-mb-ink-1 { top: 15%; left: 29%; transform: rotate(-8deg); }
        .rvh-mb-ink-2 { top: 95%; left: 8%; transform: rotate(6deg); }
        .rvh-mb-dot-1 { width: 10px; height: 10px; top: 18%; left: 35%; }
        .rvh-mb-dot-2 { width: 8px; height: 8px; top: 70%; left: 19%; }
        .rvh-mb-dot-3 { width: 9px; height: 9px; top: 48%; left: 69%; }


        /* ---- builder state: empty slots + asset library ---- */
        .rvh-mb-mood-photo {
            cursor: default;
            overflow: visible;
        }
        .rvh-mb-mood-photo .rvh-mb-photo-placeholder {
            position: absolute;
            inset: 11px 11px 38px;
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 6px;
            flex-direction: column;
            background: linear-gradient(180deg, rgba(255,252,247,0.95), rgba(246,238,225,0.92));
            border: 1px dashed rgba(181,149,92,0.55);
            color: rgba(108,21,28,0.78);
            opacity: 0;
            transform: scale(0.96);
            transition: opacity 0.28s ease, transform 0.28s ease, border-color 0.28s ease, background 0.28s ease;
            pointer-events: none;
        }
        .rvh-mb-mood-photo .rvh-mb-photo-placeholder .rvh-mb-plus {
            font-family: 'Cinzel', serif;
            font-size: clamp(1.8rem, 3vw, 2.4rem);
            line-height: 1;
            color: var(--brand-color);
        }
        .rvh-mb-mood-photo .rvh-mb-photo-placeholder .rvh-mb-ph-text {
            font-family: 'Cinzel', serif;
            font-size: 0.54rem;
            letter-spacing: 0.22em;
            text-transform: uppercase;
            color: rgba(108,21,28,0.68);
            text-align: center;
            padding: 0 8px;
        }
        .rvh-mb-mood-photo.rvh-mb-is-empty img,
        .rvh-mb-mood-photo.rvh-mb-is-empty .rvh-mb-cap {
            opacity: 0;
            transform: scale(0.95);
            transition: opacity 0.24s ease, transform 0.24s ease;
        }
        .rvh-mb-mood-stage.rvh-mb-is-builder .rvh-mb-mood-photo .rvh-mb-photo-placeholder,
        .rvh-mb-mood-photo.rvh-mb-is-empty .rvh-mb-photo-placeholder {
            opacity: 1;
            transform: scale(1);
            pointer-events: auto;
        }
        .rvh-mb-mood-stage.rvh-mb-is-builder .rvh-mb-mood-photo {
            cursor: pointer;
            transform: var(--t, rotate(0deg)) scale(0.91);
        }
        .rvh-mb-mood-stage.rvh-mb-is-builder .rvh-mb-mood-photo:hover {
            transform: var(--t, rotate(0deg)) scale(0.935) translateY(-2px);
            box-shadow: 0 18px 34px rgba(58,42,28,0.28);
        }
        .rvh-mb-mood-stage.rvh-mb-is-builder .rvh-mb-mood-photo.rvh-mb-active-slot {
            transform: var(--t, rotate(0deg)) scale(0.945);
        }

        .rvh-mb-mood-stage.rvh-mb-is-builder .rvh-mb-mi-1 { left: 1%; }
        .rvh-mb-mood-stage.rvh-mb-is-builder .rvh-mb-mi-3 { left: 14%; }
        .rvh-mb-mood-stage.rvh-mb-is-builder .rvh-mb-mi-2 { left: 2%; }
        .rvh-mb-mood-stage.rvh-mb-is-builder .rvh-mb-mi-4 { left: 33%; }
        .rvh-mb-mood-stage.rvh-mb-is-builder .rvh-mb-mi-5 { left: 27%; }
        .rvh-mb-mood-stage.rvh-mb-is-builder .rvh-mb-mi-6 { left: 60%; }
        .rvh-mb-mood-stage.rvh-mb-is-builder .rvh-mb-mi-7 { left: 66%; }

        .rvh-mb-mood-stage.rvh-mb-is-builder .rvh-mb-mm-1 { left: -1%; }
        .rvh-mb-mood-stage.rvh-mb-is-builder .rvh-mb-mm-2 { left: 17%; }
        .rvh-mb-mood-stage.rvh-mb-is-builder .rvh-mb-mm-3 { left: 47%; }
        .rvh-mb-mood-stage.rvh-mb-is-builder .rvh-mb-mm-4 { left: 42%; }
        .rvh-mb-mood-stage.rvh-mb-is-builder .rvh-mb-mm-5 { left: 57%; }
        .rvh-mb-mood-stage.rvh-mb-is-builder .rvh-mb-ml-1 { left: 50%; }
        .rvh-mb-mood-stage.rvh-mb-is-builder .rvh-mb-ml-2 { left: 34%; }
        .rvh-mb-mood-stage.rvh-mb-is-builder .rvh-mb-mood-memo {
            cursor: text;
            transform: var(--t, rotate(0deg)) scale(0.95);
            opacity: 0.92;
        }
        .rvh-mb-mood-stage.rvh-mb-is-builder .rvh-mb-mood-label {
            transform: var(--t, rotate(0deg)) scale(0.9);
            opacity: 0.72;
        }
        .rvh-mb-mood-stage.rvh-mb-is-builder .rvh-mb-mood-ink,
        .rvh-mb-mood-stage.rvh-mb-is-builder .rvh-mb-mood-dot {
            opacity: 0.45;
        }

        .rvh-mb-mood-flight-clone {
            position: fixed;
            margin: 0;
            pointer-events: none;
            z-index: 250;
            transform-origin: top left;
            will-change: transform, opacity;
        }
        .rvh-mb-mood-stage.rvh-mb-is-builder .rvh-mb-mood-photo.rvh-mb-active-slot .rvh-mb-photo-placeholder,
        .rvh-mb-mood-stage.rvh-mb-is-builder .rvh-mb-mood-photo:focus-visible .rvh-mb-photo-placeholder {
            border-color: rgba(181,149,92,1);
            background: linear-gradient(180deg, rgba(255,252,247,1), rgba(251,242,228,1));
            box-shadow: inset 0 0 0 2px rgba(181,149,92,0.18), 0 0 0 3px rgba(181,149,92,0.18);
        }
        .rvh-mb-mood-photo.rvh-mb-filled .rvh-mb-photo-placeholder,
        .rvh-mb-mood-stage.rvh-mb-is-builder .rvh-mb-mood-photo.rvh-mb-filled .rvh-mb-photo-placeholder {
            opacity: 0 !important;
            transform: scale(0.96) !important;
            pointer-events: none !important;
        }
        .rvh-mb-mood-photo.rvh-mb-filled img,
        .rvh-mb-mood-stage.rvh-mb-is-builder .rvh-mb-mood-photo.rvh-mb-filled img {
            opacity: 1 !important;
            transform: none !important;
            visibility: visible !important;
        }
        .rvh-mb-mood-photo.rvh-mb-filled .rvh-mb-cap {
            opacity: 1 !important;
            transform: none !important;
        }

        .rvh-mb-mood-memo .rvh-mb-memo-body {
            display: block;
            min-height: 2.8em;
            outline: none;
            white-space: pre-line;
        }
        .rvh-mb-mood-stage.rvh-mb-is-builder .rvh-mb-mood-memo .rvh-mb-memo-body.rvh-mb-is-placeholder {
            color: rgba(74,60,48,0.58);
        }
        .rvh-mb-mood-stage.rvh-mb-is-builder .rvh-mb-mood-memo.rvh-mb-active-note {
            box-shadow: 0 10px 22px rgba(58,42,28,0.22), 0 0 0 2px rgba(181,149,92,0.2);
        }

        /* Mobile-only inline asset rail. display:none unconditionally here so it has
           zero footprint above the <=560px breakpoint, which is where it's switched on
           (see @media(max-width:560px) below) as a full replacement for the sidebar/
           modal picker on small screens. */
        .rvh-mb-asset-rail-wrap { display: none; }
        .rvh-mb-asset-rail-card {
            position: relative;
            margin: 0 12px;
            padding: 16px 16px 18px;
            background: linear-gradient(180deg, rgba(255,254,250,.96), rgba(247,240,228,.96));
            border: 1px solid rgba(181,149,92,.25);
            box-shadow: 0 18px 38px rgba(58,42,28,.13);
            border-radius: 18px;
            transform: rotate(-.35deg);
        }
        .rvh-mb-asset-rail-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
        .rvh-mb-asset-rail-title { font-family: 'Cinzel', serif; font-size: .9rem; letter-spacing: .17em; text-transform: uppercase; color: var(--brand-color); font-weight: 600; }
        .rvh-mb-asset-rail-sub { font-style: italic; font-size: .78rem; opacity: .58; margin-top: 3px; }
        .rvh-mb-asset-count { font-family: 'Cinzel', serif; font-size: .56rem; letter-spacing: .14em; text-transform: uppercase; color: rgba(108,21,28,.58); white-space: nowrap; }
        .rvh-mb-asset-rail {
            display: flex; gap: 12px; overflow-x: auto; overflow-y: hidden;
            scroll-snap-type: x proximity; padding: 3px 4px 12px;
            overscroll-behavior-inline: contain;
            scrollbar-width: thin; scrollbar-color: rgba(181,149,92,.42) transparent;
        }
        /* Arrows pinned to the extreme edges of the rail: on a phone the rail
           is the only horizontally scrolling thing in the builder, and nothing
           signalled that it moved. They sit over the rail's own edges rather
           than beside it, so they cost no width. */
        .rvh-mb-asset-rail-scroller { position: relative; }
        .rvh-mb-asset-rail-arrow {
            position: absolute; top: 50%; transform: translateY(-50%);
            z-index: 4; width: 30px; height: 30px; border-radius: 50%;
            border: 1px solid rgba(181,149,92,.55);
            background: rgba(255,253,248,.94); color: var(--brand-color);
            display: none; align-items: center; justify-content: center;
            font-size: .78rem; cursor: pointer; padding: 0;
            box-shadow: 0 3px 10px rgba(58,42,28,.18);
        }
        .rvh-mb-asset-rail-arrow.rvh-mb-prev { left: -4px; }
        .rvh-mb-asset-rail-arrow.rvh-mb-next { right: -4px; }
        .rvh-mb-asset-rail-arrow:disabled { opacity: .32; cursor: default; }
        @media (max-width: 900px) {
            .rvh-mb-asset-rail-arrow { display: flex; }
            .rvh-mb-asset-rail { padding-left: 20px; padding-right: 20px; }
        }
        .rvh-mb-asset-rail::-webkit-scrollbar { height: 5px; }
        .rvh-mb-asset-rail::-webkit-scrollbar-thumb { background: rgba(181,149,92,.4); border-radius: 999px; }
        .rvh-mb-asset-rail .rvh-mb-asset-thumb {
            flex: 0 0 128px; scroll-snap-align: start; border: 0; background: #fffdf8;
            padding: 7px 7px 26px; box-shadow: 0 7px 15px rgba(58,42,28,.16);
            position: relative; cursor: pointer; transform: rotate(var(--rot,0deg)); transition: .25s ease;
        }
        .rvh-mb-asset-rail .rvh-mb-asset-thumb img { display: block; width: 100%; height: 120px; object-fit: cover; }
        .rvh-mb-asset-rail .rvh-mb-asset-name { position: absolute; left: 5px; right: 5px; bottom: 6px; font-family: 'Caveat', cursive; font-size: 1rem; color: #6b5a49; text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
        .rvh-mb-asset-rail .rvh-mb-asset-added { position: absolute; top: 11px; right: 10px; width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; background: rgba(108,21,28,.92); color: #fff; font-size: .72rem; opacity: 0; transform: scale(.7); transition: .2s; }
        .rvh-mb-asset-rail .rvh-mb-asset-thumb.rvh-mb-is-added .rvh-mb-asset-added { opacity: 1; transform: scale(1); }
        .rvh-mb-asset-rail .rvh-mb-asset-thumb.rvh-mb-is-added { box-shadow: 0 0 0 2px rgba(181,149,92,.35), 0 7px 15px rgba(58,42,28,.14); }
        .rvh-mb-asset-rail-tail { flex: 0 0 28px; align-self: stretch; display: grid; place-items: center; color: var(--gold); font-family: 'Cinzel', serif; font-size: 1.1rem; }
        .rvh-mb-asset-library {
            position: absolute;
            right: 14px;
            top: 42px;
            width: 244px;
            padding: 14px 12px 12px;
            border-radius: 20px;
            background: linear-gradient(180deg, rgba(255,255,255,0.98), rgba(246,240,232,0.98));
            box-shadow: 0 26px 60px rgba(58,42,28,0.20), 0 8px 18px rgba(58,42,28,0.08);
            border: 1px solid rgba(181,149,92,0.20);
            opacity: 0;
            transform: translateX(28px) translateY(14px) scale(0.96);
            pointer-events: none;
            transition: opacity 0.42s ease, transform 0.58s cubic-bezier(.2,.8,.2,1);
            z-index: 40;
        }
        .rvh-mb-asset-library::before {
            content: '';
            position: absolute;
            left: 18px;
            right: 18px;
            top: 12px;
            height: 1px;
            background: linear-gradient(90deg, transparent, rgba(181,149,92,0.35), transparent);
            opacity: 0.7;
        }
        .rvh-mb-mood-section.rvh-mb-builder-active .rvh-mb-asset-library {
            opacity: 1;
            transform: translateX(0) translateY(0) scale(1);
            pointer-events: auto;
        }
        .rvh-mb-mood-section.rvh-mb-builder-active.rvh-mb-library-hidden .rvh-mb-asset-library {
            opacity: 0;
            transform: translateX(28px) translateY(14px) scale(0.96);
            pointer-events: none;
        }
        .rvh-mb-asset-library-head {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 10px;
            margin-bottom: 14px;
        }
        .rvh-mb-asset-library-title {
            font-family: 'Cinzel', serif;
            font-size: 0.92rem;
            letter-spacing: 0.08em;
            color: var(--brand-color);
            margin: 0;
        }
        .rvh-mb-asset-library-sub {
            font-family: 'Playfair Display', serif;
            font-style: italic;
            font-size: 0.76rem;
            color: var(--text-dark);
            opacity: 0.68;
            margin: -8px 0 12px;
        }
        .rvh-mb-asset-library-close {
            appearance: none;
            border: none;
            background: transparent;
            color: rgba(74,60,48,0.72);
            font-size: 1.5rem;
            line-height: 1;
            cursor: pointer;
            padding: 0;
        }
        .rvh-mb-asset-search {
            position: relative;
            margin-bottom: 14px;
        }
        .rvh-mb-asset-search input {
            width: 100%;
            box-sizing: border-box;
            border: none;
            border-radius: 12px;
            padding: 10px 12px 10px 34px;
            background: rgba(80,66,48,0.07);
            color: var(--text-dark);
            font-family: 'Playfair Display', serif;
            font-size: 0.98rem;
            outline: none;
        }
        .rvh-mb-asset-search::before {
            content: '⌕';
            position: absolute;
            left: 11px;
            top: 7px;
            font-size: 1.1rem;
            color: rgba(80,66,48,0.45);
        }
        .rvh-mb-asset-grid {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 7px;
            max-height: 610px;
            overflow: auto;
            padding-right: 4px;
        }
        .rvh-mb-asset-thumb {
            position: relative;
            appearance: none;
            border: none;
            padding: 0;
            border-radius: 10px;
            overflow: hidden;
            background: #ece4d7;
            box-shadow: 0 3px 10px rgba(58,42,28,0.12);
            cursor: pointer;
            aspect-ratio: 0.96 / 1;
            transition: transform 0.28s cubic-bezier(.2,.8,.2,1), box-shadow 0.28s ease;
        }
        .rvh-mb-asset-thumb:hover {
            transform: translateY(-3px);
            box-shadow: 0 10px 18px rgba(58,42,28,0.18);
        }
        .rvh-mb-asset-thumb img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            display: block;
        }
        .rvh-mb-asset-library.rvh-mb-is-animating .rvh-mb-asset-thumb {
            opacity: 0;
            transform: scale(0.86);
        }
        .rvh-mb-asset-thumb {
            transition: transform 0.28s cubic-bezier(.2,.8,.2,1), box-shadow 0.28s ease, opacity 0.28s ease;
        }
        .rvh-mb-asset-library.rvh-mb-ready .rvh-mb-asset-thumb {
            opacity: 1;
            transform: none;
        }
        .rvh-mb-asset-thumb .rvh-mb-asset-name {
            position: absolute;
            left: 0; right: 0; bottom: 0;
            padding: 5px 6px;
            font-family: 'Playfair Display', serif;
            font-size: 0.62rem;
            color: #fff;
            background: linear-gradient(180deg, transparent, rgba(32,24,18,0.62));
            text-align: left;
        }
        .rvh-mb-asset-thumb .rvh-mb-asset-added {
            position: absolute;
            top: 6px;
            right: 6px;
            display: inline-flex;
            align-items: center;
            gap: 3px;
            padding: 3px 6px 3px 5px;
            border-radius: 999px;
            background: rgba(255,253,248,0.94);
            border: 1px solid rgba(181,149,92,0.52);
            box-shadow: 0 3px 8px rgba(58,42,28,0.14);
            color: var(--brand-color);
            font-family: 'Cinzel', serif;
            font-size: 0.47rem;
            letter-spacing: 0.08em;
            text-transform: uppercase;
            opacity: 0;
            transform: translateY(-3px) scale(0.92);
            transition: opacity 0.24s ease, transform 0.24s ease;
            pointer-events: none;
            z-index: 3;
        }
        .rvh-mb-asset-thumb.rvh-mb-is-added .rvh-mb-asset-added {
            opacity: 1;
            transform: translateY(0) scale(1);
        }
        .rvh-mb-asset-thumb.rvh-mb-is-added {
            box-shadow: 0 0 0 1px rgba(181,149,92,0.42), 0 4px 12px rgba(58,42,28,0.13);
        }
        .rvh-mb-asset-thumb.rvh-mb-is-added img {
            filter: saturate(0.9) brightness(0.97);
        }
        .rvh-mb-asset-empty {
            font-family: 'Playfair Display', serif;
            font-style: italic;
            color: rgba(74,60,48,0.66);
            text-align: center;
            padding: 10px 6px 4px;
            display: none;
        }
        .rvh-mb-asset-library.rvh-mb-no-results .rvh-mb-asset-empty { display: block; }

        .rvh-mb-asset-modal {
            position: fixed;
            inset: 0;
            background: rgba(37,27,18,0.42);
            backdrop-filter: blur(4px);
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 24px;
            opacity: 0;
            pointer-events: none;
            transition: opacity 0.28s ease;
            z-index: 200;
        }
        .rvh-mb-asset-modal.rvh-mb-is-open {
            opacity: 1;
            pointer-events: auto;
        }
        .rvh-mb-asset-modal-card {
            width: min(920px, 100%);
            max-height: min(86vh, 860px);
            overflow: hidden;
            display: flex;
            flex-direction: column;
            border-radius: 22px;
            background: linear-gradient(180deg, rgba(255,255,255,0.98), rgba(246,240,232,0.98));
            box-shadow: 0 30px 90px rgba(37,27,18,0.28);
            border: 1px solid rgba(181,149,92,0.2);
        }
        .rvh-mb-asset-modal-body {
            padding: 0 20px 20px;
            overflow: auto;
        }
        .rvh-mb-asset-modal .rvh-mb-asset-library-head {
            padding: 20px 20px 8px;
            margin-bottom: 0;
        }
        .rvh-mb-asset-modal .rvh-mb-asset-library-sub {
            margin: -4px 20px 12px;
        }
        .rvh-mb-asset-modal .rvh-mb-asset-search {
            margin: 0 20px 14px;
        }
        .rvh-mb-asset-modal .rvh-mb-asset-grid {
            grid-template-columns: repeat(4, minmax(0, 1fr));
            max-height: none;
            overflow: visible;
        }

        /* ---- film reel strip ---- */
        .rvh-mb-mood-reel-wrap {
            display: none; /* hidden on request -- the filmstrip at bottom-left of the board */
            position: relative;
            width: 100%;
            max-width: 1360px;
            margin: -8px auto 0;
            justify-content: flex-start;
            pointer-events: none;
            z-index: 2;
        }
        .rvh-mb-mood-reel {
            position: relative;
            display: flex;
            gap: 6px;
            padding: 12px 14px;
            background: linear-gradient(180deg, #FFFDFB 0%, #FBF5EE 100%);
            transform: translateX(-16%) rotate(-8deg) scale(0.83);
            transform-origin: left center;
            box-shadow: 0 9px 18px rgba(58,42,28,0.22), 0 2px 5px rgba(58,42,28,0.16), 0 0 0 1px rgba(58,42,28,0.07);
            opacity: 0.76;
        }
        .rvh-mb-mood-reel::before, .rvh-mb-mood-reel::after {
            content: '';
            position: absolute; left: 0; right: 0; height: 12px;
            background-image: radial-gradient(rgba(58,42,28,0.18) 0 3.8px, transparent 4.4px);
            background-size: 18px 12px;
            background-repeat: repeat-x;
            background-position: 5px center;
            opacity: 0.85;
        }
        .rvh-mb-mood-reel::before { top: 3px; }
        .rvh-mb-mood-reel::after { bottom: 3px; }
        .rvh-mb-mood-reel .rvh-mb-frame { width: 92px; height: 68px; overflow: hidden; background: #fffdf8; }
        .rvh-mb-mood-reel .rvh-mb-frame img { width: 100%; height: 100%; object-fit: cover; display: block; filter: saturate(0.93) contrast(1.01); }

        /* ---- caption written straight onto the journal page, drifting with it ---- */
        .rvh-mb-mood-book-note {
            position: absolute;
            top: 40%;
            left: 41%;
            width: 22%;
            text-align: center;
            font-family: 'Caveat', cursive;
            font-size: 1.32rem;
            line-height: 1.26;
            color: rgba(58, 42, 28, 0.68);
            transform: rotate(-1.5deg);
            pointer-events: none;
            z-index: 5;
        }

        @media (max-width: 1200px) {
            .rvh-mb-asset-library {
                position: relative;
                right: auto;
                top: auto;
                width: min(720px, 100%);
                margin: 10px auto 0;
                max-height: 0;
                overflow: hidden;
                padding-top: 0;
                padding-bottom: 0;
                transform: translateY(12px);
            }
            .rvh-mb-mood-stage.rvh-mb-is-builder {
                transform: translateX(0) scale(0.92);
            }
            .rvh-mb-mood-section.rvh-mb-builder-active .rvh-mb-asset-library {
                max-height: 900px;
                padding: 18px 16px 16px;
            }
            .rvh-mb-asset-grid {
                max-height: 420px;
            }
        }
        @media (max-width: 900px) {
            .rvh-mb-mood-section { padding: 64px 14px 84px; }
            .rvh-mb-mood-item .rvh-mb-cap { font-size: 0.8rem; }
            .rvh-mb-mood-photo { padding: 5px 5px 20px; }
            .rvh-mb-mood-photo .rvh-mb-photo-placeholder { inset: 5px 5px 20px; }
            .rvh-mb-mi-1 img, .rvh-mb-mi-3 img, .rvh-mb-mi-4 img, .rvh-mb-mi-6 img { height: 116px; }
            .rvh-mb-mi-2 img, .rvh-mb-mi-5 img, .rvh-mb-mi-7 img { height: 96px; }
            .rvh-mb-mood-memo { padding: 9px 10px 10px; font-size: 0.86rem; }
            .rvh-mb-mood-label { font-size: 0.78rem; padding: 5px 10px; }
            .rvh-mb-tape { width: 52px; height: 17px; top: -9px; }
            .rvh-mb-mood-stage::after { bottom: 9%; height: 48px; }
            .rvh-mb-mood-book { width: 64%; margin-left: -32%; top: 16%; }
            .rvh-mb-mood-reel { gap: 6px; padding: 12px 14px; transform: translateX(-10%) rotate(-8deg) scale(0.78); }
            .rvh-mb-mood-reel .rvh-mb-frame { width: 84px; height: 62px; }
            .rvh-mb-mood-reel-wrap { margin-top: -2px; }
            .rvh-mb-mood-book-note { font-size: 1.18rem; }
            .rvh-mb-asset-modal .rvh-mb-asset-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
        }
        @media (max-width: 560px) {
            /* MOBILE: oversized physical journal, curated hierarchy - not the
               desktop layout shrunk down. Ported from the approved mobile
               reference design; desktop/tablet rules above are untouched. */
            .rvh-mb-mood-stage { height: clamp(600px, 160vw, 680px); aspect-ratio: auto; overflow: visible; max-width: none; }
            .rvh-mb-mood-book { width: 92vw; margin-left: -46vw; top: 19%; }
            .rvh-mb-mood-book-note { top: 42%; left: 39%; width: 24%; font-size: .9rem; opacity: .58; }
            .rvh-mb-mood-memo { font-size: 0.72rem; padding: 7px 8px 8px; }
            .rvh-mb-mood-photo { padding: 5px 5px 24px; box-shadow: 0 8px 16px rgba(58,42,28,.22), 0 2px 3px rgba(58,42,28,.14); }
            .rvh-mb-mood-photo .rvh-mb-cap { font-size: .88rem; bottom: 4px; }
            .rvh-mb-mood-photo .rvh-mb-photo-placeholder { inset: 5px 5px 24px; }
            .rvh-mb-photo-placeholder .rvh-mb-plus { font-size: 1.55rem; }
            .rvh-mb-photo-placeholder .rvh-mb-ph-text { font-size: .42rem; letter-spacing: .12em; }
            .rvh-mb-tape { width: 51px; height: 16px; top: -8px; }
            .rvh-mb-clip { height: 30px; width: 13px; top: -14px; border-width: 2px; }
            /* Calmer mobile scrapbook: same seven memories, but smaller cards.
               Each note stays tucked close against the one image it reads as
               "belonging to" (mm-1 hugs mi-3, mm-4 hugs mi-5) - the breathing
               room instead comes from spacing the images/clusters themselves
               further apart (mi-1 to mi-3, mi-4 to mi-6 to mi-7). Verified via
               actual rendered bounding boxes, not just eyeballed. */
            .rvh-mb-mi-1 { width: 30%; top: 5%; left: 5%; --t: rotate(-3deg); transform: rotate(-3deg); z-index: 8; }
            .rvh-mb-mi-1 img { height: 122px; }
            .rvh-mb-mi-4 { width: 30%; top: 8%; left: 58%; --t: rotate(-1.5deg); transform: rotate(-1.5deg); z-index: 15; }
            .rvh-mb-mi-4 img { height: 130px; }
            .rvh-mb-mi-3 { width: 25%; top: 44%; left: 9%; --t: rotate(2.5deg); transform: rotate(2.5deg); z-index: 12; }
            .rvh-mb-mi-3 img { height: 96px; }
            .rvh-mb-mi-6 { width: 23%; top: 47%; left: 67%; --t: rotate(-2.5deg); transform: rotate(-2.5deg); z-index: 11; }
            .rvh-mb-mi-6 img { height: 90px; }
            .rvh-mb-mi-5 { width: 22%; top: 49%; left: 37%; --t: rotate(3deg); transform: rotate(3deg); z-index: 16; }
            .rvh-mb-mi-5 img { height: 84px; }
            .rvh-mb-mi-2 { width: 18%; top: 75%; left: 6%; --t: rotate(1.5deg); transform: rotate(1.5deg); z-index: 10; }
            .rvh-mb-mi-2 img { height: 72px; }
            .rvh-mb-mi-7 { width: 18%; top: 78%; left: 73%; --t: rotate(3deg); transform: rotate(3deg); z-index: 9; }
            .rvh-mb-mi-7 img { height: 72px; }
            /* only selected captions remain legible */
            .rvh-mb-mi-2 .rvh-mb-cap, .rvh-mb-mi-5 .rvh-mb-cap, .rvh-mb-mi-7 .rvh-mb-cap { display: none; }
            .rvh-mb-mi-2, .rvh-mb-mi-5, .rvh-mb-mi-7 { padding-bottom: 5px; }
            .rvh-mb-mi-2 .rvh-mb-photo-placeholder, .rvh-mb-mi-5 .rvh-mb-photo-placeholder, .rvh-mb-mi-7 .rvh-mb-photo-placeholder { inset: 5px; }
            /* Keep only two notes + one quiet label. Smaller font (was .77rem) so the
               body text wraps to fewer lines, which also shrinks the card's own
               footprint - each note sits snug against its one paired image (see
               above) rather than centered in open space. */
            .rvh-mb-mm-1 { display: block; width: 25%; top: 30%; left: 4%; --t: rotate(-2deg); transform: rotate(-2deg); font-size: .63rem; z-index: 17; }
            .rvh-mb-mm-4 { display: block; width: 25%; top: 64%; left: 37%; --t: rotate(2deg); transform: rotate(2deg); font-size: .63rem; z-index: 18; }
            .rvh-mb-mm-2, .rvh-mb-mm-3, .rvh-mb-mm-5 { display: none; }
            .rvh-mb-ml-1 { display: block; top: 4%; left: 68%; max-width: 25%; font-size: .66rem; padding: 4px 8px; z-index: 20; white-space: nowrap; }
            .rvh-mb-ml-2 { display: none; }
            .rvh-mb-ink-1, .rvh-mb-ink-2, .rvh-mb-dot-1, .rvh-mb-dot-2, .rvh-mb-dot-3 { display: none; }
            .rvh-mb-pin-note { font-size: .36rem; letter-spacing: .13em; margin-bottom: 3px; }
            .rvh-mb-mood-reel { gap: 4px; padding: 9px 10px; transform: translateX(-8%) rotate(-7deg) scale(0.72); }
            .rvh-mb-mood-reel .rvh-mb-frame { width: 58px; height: 44px; }
            .rvh-mb-mood-reel-wrap { margin-top: 0; }
            .rvh-mb-mood-cta { padding: 14px 26px; font-size: 0.68rem; letter-spacing: 0.16em; }
            /* builder: same scrapbook slots, just calmer */
            .rvh-mb-mood-stage.rvh-mb-is-builder .rvh-mb-mood-book { opacity: .92; }
            .rvh-mb-mood-stage.rvh-mb-is-builder .rvh-mb-mood-photo { transform: var(--t) scale(.96); }
            .rvh-mb-mood-stage.rvh-mb-is-builder .rvh-mb-mi-1 { left: 7%; } .rvh-mb-mood-stage.rvh-mb-is-builder .rvh-mb-mi-4 { left: 58%; } .rvh-mb-mood-stage.rvh-mb-is-builder .rvh-mb-mi-3 { left: 12%; }
            .rvh-mb-mood-stage.rvh-mb-is-builder .rvh-mb-mi-6 { left: 67%; } .rvh-mb-mood-stage.rvh-mb-is-builder .rvh-mb-mi-5 { left: 38%; } .rvh-mb-mood-stage.rvh-mb-is-builder .rvh-mb-mi-2 { left: 8%; } .rvh-mb-mood-stage.rvh-mb-is-builder .rvh-mb-mi-7 { left: 73%; }
            .rvh-mb-mood-stage.rvh-mb-is-builder .rvh-mb-mood-memo { transform: var(--t) scale(.96); }
            /* mobile picker: sidebar/modal off, inline rail on */
            .rvh-mb-asset-library { display: none; }
            .rvh-mb-asset-rail-wrap {
                display: block; margin-top: -8px;
                opacity: 0; transform: translateY(18px); max-height: 0; overflow: hidden; pointer-events: none;
                transition: opacity .4s ease, transform .5s cubic-bezier(.2,.8,.2,1), max-height .5s ease;
            }
            .rvh-mb-mood-section.rvh-mb-builder-active .rvh-mb-asset-rail-wrap { opacity: 1; transform: none; max-height: 340px; pointer-events: auto; }
            .rvh-mb-asset-rail-card { margin: 0 14px; padding: 14px 12px 15px; border-radius: 15px; box-shadow: 0 13px 28px rgba(58,42,28,.14); transform: rotate(-.5deg); }
            .rvh-mb-asset-rail-head { align-items: flex-start; margin-bottom: 10px; padding: 0 2px; }
            .rvh-mb-asset-rail-title { font-size: .76rem; letter-spacing: .14em; }
            .rvh-mb-asset-rail-sub { font-size: .72rem; max-width: 210px; }
            .rvh-mb-asset-count { font-size: .48rem; padding-top: 2px; }
            .rvh-mb-asset-rail { gap: 10px; padding: 3px 2px 11px; }
            .rvh-mb-asset-rail .rvh-mb-asset-thumb { flex: 0 0 122px; padding: 6px 6px 25px; }
            .rvh-mb-asset-rail .rvh-mb-asset-thumb img { height: 126px; }
            .rvh-mb-asset-rail .rvh-mb-asset-name { font-size: .9rem; }
            .rvh-mb-asset-rail-tail { flex-basis: 18px; }
        }
        @media (max-width: 360px) {
            .rvh-mb-mood-stage { height: 540px; }
            .rvh-mb-mood-book { width: 90vw; margin-left: -45vw; }
            .rvh-mb-mood-heading { font-size: 1.42rem; }
            .rvh-mb-asset-rail .rvh-mb-asset-thumb { flex-basis: 112px; }
            .rvh-mb-asset-rail .rvh-mb-asset-thumb img { height: 116px; }
            .rvh-mb-mi-1 { left: 6%; width: 30%; } .rvh-mb-mi-4 { left: 59%; width: 31%; } .rvh-mb-mi-3 { left: 11%; width: 26%; }
            .rvh-mb-mi-6 { left: 68%; width: 25%; } .rvh-mb-mi-5 { left: 38%; width: 24%; } .rvh-mb-mi-2 { left: 7%; width: 19%; } .rvh-mb-mi-7 { left: 74%; width: 19%; }
            .rvh-mb-mm-1 { left: 5%; width: 26%; } .rvh-mb-mm-4 { left: 39%; width: 26%; }
            .rvh-mb-ml-1 { left: 68%; max-width: 24%; }
        }

    


        /* ---- contact capture before builder / share recovery ---- */
        .rvh-mb-mood-contact-modal { position:fixed; inset:0; z-index:330; display:flex; align-items:center; justify-content:center; padding:22px; background:rgba(45,32,23,.32); backdrop-filter:blur(5px); opacity:0; pointer-events:none; transition:opacity .26s ease; }
        .rvh-mb-mood-contact-modal.rvh-mb-is-open { opacity:1; pointer-events:auto; }

        /* The moodboard's dialogs are position:fixed with z-index 330, but they
           live inside .rvh-mb-mood-section, which is position:relative with
           z-index 2 and so opens a stacking context of its own. That confines
           330 to inside the section, and the section itself sits at 2 among
           siblings that reach 10 -- so Bridal Bliss and the Book of Traditions
           painted straight over an open dialog. Lifting the section while one of
           its dialogs is open is enough; :has() keeps it in CSS rather than
           making every open/close path remember a class. Same fault as the host
           header overlap: a fixed element trapped in a nested stacking context. */
        .rvh-mb-mood-section:has(.rvh-mb-is-open) { z-index: 900; }
        .rvh-mb-mood-contact-card { width:min(430px,94vw); border-radius:18px; padding:28px 28px 24px; background:linear-gradient(180deg,#fffefb 0%,#f7f0e4 100%); border:1px solid rgba(181,149,92,.28); box-shadow:0 30px 80px rgba(58,42,28,.28); transform:translateY(10px) scale(.985); transition:transform .32s cubic-bezier(.2,.8,.2,1); position:relative; }
        .rvh-mb-mood-contact-modal.rvh-mb-is-open .rvh-mb-mood-contact-card { transform:translateY(0) scale(1); }
        .rvh-mb-mood-contact-form { display:grid; gap:12px; margin-top:18px; }
        .rvh-mb-mood-contact-field { display:grid; gap:6px; text-align:left; }
        .rvh-mb-mood-contact-field span { font-family:'Cinzel',serif; font-size:.55rem; letter-spacing:.16em; text-transform:uppercase; color:rgba(59,51,45,.66); }
        .rvh-mb-mood-contact-field input { width:100%; box-sizing:border-box; border:1px solid rgba(181,149,92,.30); border-radius:12px; background:rgba(255,255,255,.75); padding:12px 13px; outline:0; font:400 .92rem/1.2 system-ui,sans-serif; color:#3b332d; }
        .rvh-mb-mood-contact-field input:focus { border-color:rgba(108,21,28,.5); box-shadow:0 0 0 3px rgba(108,21,28,.07); }
        .rvh-mb-mood-contact-field.rvh-mb-has-error input { border-color:rgba(178,40,40,.75); }
        .rvh-mb-mood-contact-error { min-height:17px; font:400 .76rem/1.3 system-ui,sans-serif; color:#8a2831; text-align:left; }
        .rvh-mb-mood-contact-submit { width:100%; margin-top:2px; }

        /* ---- save + share moodboard ---- */
        .rvh-mb-mood-share-modal {
            position: fixed;
            inset: 0;
            z-index: 320;
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 22px;
            background: rgba(45, 32, 23, 0.32);
            backdrop-filter: blur(5px);
            opacity: 0;
            pointer-events: none;
            transition: opacity .26s ease;
        }
        .rvh-mb-mood-share-modal.rvh-mb-is-open { opacity: 1; pointer-events: auto; }
        .rvh-mb-mood-share-card {
            width: min(430px, 94vw);
            border-radius: 18px;
            padding: 28px 28px 24px;
            background: linear-gradient(180deg, #fffefb 0%, #f7f0e4 100%);
            border: 1px solid rgba(181,149,92,.28);
            box-shadow: 0 30px 80px rgba(58,42,28,.28);
            transform: translateY(10px) scale(.985);
            transition: transform .32s cubic-bezier(.2,.8,.2,1);
            position: relative;
            text-align: center;
        }
        .rvh-mb-mood-share-modal.rvh-mb-is-open .rvh-mb-mood-share-card { transform: translateY(0) scale(1); }
        .rvh-mb-mood-share-close {
            position: absolute;
            right: 16px;
            top: 12px;
            appearance: none;
            border: 0;
            background: transparent;
            font-size: 1.4rem;
            color: rgba(59,51,45,.62);
            cursor: pointer;
        }
        .rvh-mb-mood-share-kicker {
            font-family: 'Cinzel', serif;
            font-size: .58rem;
            letter-spacing: .28em;
            text-transform: uppercase;
            color: var(--gold);
            margin-bottom: 10px;
        }
        .rvh-mb-mood-share-title {
            font-family: 'Playfair Display', serif;
            font-size: 1.55rem;
            color: var(--brand-color);
            margin: 0;
            font-weight: 500;
        }
        .rvh-mb-mood-share-copy {
            font-family: 'Playfair Display', serif;
            font-style: italic;
            font-size: .92rem;
            line-height: 1.55;
            color: rgba(59,51,45,.72);
            margin: 10px auto 18px;
            max-width: 330px;
        }
        .rvh-mb-mood-share-link {
            display: flex;
            align-items: center;
            gap: 8px;
            padding: 8px;
            border: 1px solid rgba(181,149,92,.28);
            border-radius: 12px;
            background: rgba(255,255,255,.62);
        }
        .rvh-mb-mood-share-link input {
            flex: 1;
            min-width: 0;
            border: 0;
            background: transparent;
            outline: 0;
            font-family: system-ui, sans-serif;
            font-size: .76rem;
            color: rgba(59,51,45,.65);
        }
        .rvh-mb-mood-share-copy-btn {
            flex: none;
            appearance: none;
            cursor: pointer;
            border-radius: 999px;
            padding: 7px 15px;
            font-family: 'Cinzel', serif;
            font-size: .56rem;
            letter-spacing: .12em;
            text-transform: uppercase;
            border: 1px solid rgba(181,149,92,.55);
            background: rgba(255,255,255,.85);
            color: var(--brand-color);
            transition: transform .25s cubic-bezier(.2,.8,.2,1), background .25s ease, border-color .25s ease;
        }
        .rvh-mb-mood-share-copy-btn:hover { transform: translateY(-1px); background: #fff; }
        .rvh-mb-mood-share-copy-btn.rvh-mb-is-copied {
            background: var(--brand-color);
            border-color: var(--brand-color);
            color: #fffaf0;
        }
        .rvh-mb-mood-share-actions {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 10px;
            margin-top: 14px;
        }
        .rvh-mb-mood-share-btn {
            appearance: none;
            border-radius: 999px;
            padding: 12px 14px;
            cursor: pointer;
            position: relative;
            font-family: 'Cinzel', serif;
            font-size: .62rem;
            letter-spacing: .14em;
            text-transform: uppercase;
            border: 1px solid rgba(181,149,92,.55);
            background: rgba(255,255,255,.7);
            color: var(--brand-color);
            transition: transform .35s cubic-bezier(.2,.8,.2,1), box-shadow .35s ease;
        }
        .rvh-mb-mood-share-btn:disabled { opacity: 0.38; cursor: not-allowed; transform: none !important; }
        .rvh-mb-mood-share-btn.rvh-mb-primary {
            background: linear-gradient(135deg, #83202a 0%, var(--brand-color) 45%, #521015 100%);
            color: #fffaf0;
            border: none;
            box-shadow: 0 14px 26px rgba(108,21,28,0.32), inset 0 1px 0 rgba(255,255,255,0.22);
        }
        .rvh-mb-mood-share-btn.rvh-mb-primary::after {
            content: '';
            position: absolute; inset: 3px;
            border: 1px solid rgba(226,205,166,0.5);
            border-radius: 999px;
            pointer-events: none;
        }
        .rvh-mb-mood-share-btn.rvh-mb-primary:hover {
            transform: translateY(-3px);
            box-shadow: 0 20px 34px rgba(108,21,28,0.38), inset 0 1px 0 rgba(255,255,255,0.28);
        }
        .rvh-mb-mood-share-btn.rvh-mb-channel { min-height:46px; }
        .rvh-mb-mood-share-secondary { display:flex; justify-content:center; margin-top:10px; }
        .rvh-mb-mood-share-secondary .rvh-mb-mood-share-btn { border:0; background:transparent; padding:8px 12px; text-decoration:underline; text-underline-offset:3px; }
        .rvh-mb-mood-share-note {
            margin-top: 12px;
            /* Matches .rvh-mb-mood-share-copy above ("Send your finished moodboard")
               rather than the Caveat handwriting it used to carry -- the two sit in
               the same dialog and read as one voice now. Size and colour stay as they
               were so the note remains subordinate to that line. */
            font-family: 'Playfair Display', serif;
            font-style: italic;
            color: rgba(59,51,45,.58);
            font-size: 1rem;
        }
        .rvh-mb-mood-saving-state { padding: 16px 4px 12px; text-align:center; }
        .rvh-mb-mood-saving-ring {
            width: 72px; height: 72px; margin: 2px auto 18px; border-radius:50%; position:relative;
            background: conic-gradient(var(--brand-color) 0deg, rgba(181,149,92,.16) 0deg);
        }
        .rvh-mb-mood-saving-ring::before {
            content:''; position:absolute; inset:6px; border-radius:50%; background:#fbf7ef;
        }
        .rvh-mb-mood-saving-ring::after {
            content:''; position:absolute; inset:0; border-radius:50%;
            border:1px solid rgba(181,149,92,.28);
        }
        .rvh-mb-mood-saving-count {
            position:absolute; inset:0; z-index:2; display:flex; align-items:center; justify-content:center;
            font-family:'Playfair Display',serif; font-size:1.35rem; color:var(--brand-color);
        }
        .rvh-mb-mood-saving-title { font-family:'Playfair Display',serif; font-size:1.28rem; font-weight:500; color:var(--brand-color); margin:0; }
        .rvh-mb-mood-saving-copy { font-family:'Playfair Display',serif; font-style:italic; font-size:.9rem; line-height:1.5; color:rgba(59,51,45,.64); margin:8px auto 0; max-width:310px; }
        .rvh-mb-mood-share-ready[hidden], .rvh-mb-mood-saving-state[hidden] { display:none !important; }
        .rvh-mb-mood-section.rvh-mb-shared-view .rvh-mb-asset-library,
        .rvh-mb-mood-section.rvh-mb-shared-view .rvh-mb-mood-cta-wrap,
        .rvh-mb-mood-section.rvh-mb-shared-view .rvh-mb-mood-reel-wrap,
        .rvh-mb-mood-section.rvh-mb-shared-view .rvh-mb-mood-book-note { display: none !important; }
        .rvh-mb-mood-section.rvh-mb-shared-view .rvh-mb-mood-stage {
            transform: none !important;
            max-width: 1120px;
            margin-top: 24px;
        }
        .rvh-mb-mood-section.rvh-mb-shared-view .rvh-mb-mood-photo.rvh-mb-is-empty,
        .rvh-mb-mood-section.rvh-mb-shared-view .rvh-mb-mood-memo.rvh-mb-is-shared-empty { display: none !important; }
        .rvh-mb-mood-section.rvh-mb-shared-view .rvh-mb-mood-photo { cursor: default !important; }
        .rvh-mb-mood-section.rvh-mb-shared-view .rvh-mb-mood-label { opacity: .62; }
        .rvh-mb-mood-section.rvh-mb-shared-view .rvh-mb-mood-ink,
        .rvh-mb-mood-section.rvh-mb-shared-view .rvh-mb-mood-dot { opacity: .34; }
        .rvh-mb-mood-shared-badge {
            display: none;
            margin-top: 14px;
            font-family: 'Cinzel', serif;
            font-size: .6rem;
            letter-spacing: .2em;
            text-transform: uppercase;
            color: var(--gold);
        }
        .rvh-mb-mood-shared-create {
            display: none;
            margin: 24px auto 0;
            appearance: none;
            border: 0;
            border-bottom: 1px solid rgba(108,21,28,.45);
            background: transparent;
            padding: 4px 2px 5px;
            color: var(--brand-color);
            font-family: 'Cinzel', serif;
            font-size: .62rem;
            letter-spacing: .16em;
            text-transform: uppercase;
            cursor: pointer;
        }
        .rvh-mb-mood-section.rvh-mb-shared-view .rvh-mb-mood-shared-badge,
        .rvh-mb-mood-section.rvh-mb-shared-view .rvh-mb-mood-shared-create { display: block; }

        /* ================= BRIDE CHECKLIST / BASKET ================= */
        .rvh-mb-bc-section {
            position: relative;
            width: 100%;
            z-index: 2;
            padding: 110px 20px 130px;
            background:
                radial-gradient(120% 80% at 50% 0%, #FDFBF6 0%, #F7F1E6 55%, #F2EADB 100%);
            overflow: hidden;
        }
        .rvh-mb-bc-section::before,
        .rvh-mb-bc-section::after {
            content: '';
            position: absolute;
            width: 320px; height: 320px;
            border-radius: 50%;
            background: radial-gradient(circle, rgba(181,149,92,0.16), transparent 70%);
            pointer-events: none;
        }
        .rvh-mb-bc-section::before { top: -90px; left: -110px; }
        .rvh-mb-bc-section::after { bottom: -120px; right: -100px; }

        .rvh-mb-bc-head { position: relative; text-align: center; z-index: 2; }
        .rvh-mb-bc-eyebrow {
            font-family: 'Cinzel', serif;
            font-size: 0.68rem;
            letter-spacing: 0.42em;
            text-transform: uppercase;
            color: var(--gold);
            margin-bottom: 16px;
        }
        .rvh-mb-bc-heading {
            font-family: 'Cinzel', serif;
            font-size: clamp(1.6rem, 3.4vw, 2.7rem);
            font-weight: 600;
            letter-spacing: 3px;
            text-transform: uppercase;
            color: var(--brand-color);
            line-height: 1.3;
        }
        .rvh-mb-bc-script {
            font-family: 'Great Vibes', cursive;
            font-size: clamp(1.5rem, 3vw, 2.2rem);
            color: #8d7748;
            margin-bottom: 4px;
        }
        .rvh-mb-bc-rule {
            width: 190px; height: 1px; margin: 22px auto 18px;
            background: linear-gradient(to right, transparent, var(--gold), transparent);
        }
        .rvh-mb-bc-sub {
            font-family: 'Playfair Display', serif;
            font-style: italic;
            font-size: 1.02rem;
            color: rgba(59,51,45,0.66);
            max-width: 620px;
            margin: 0 auto;
            line-height: 1.75;
        }

        /* ===== instructions ===== */
        .rvh-mb-bc-howto {
            position: relative;
            z-index: 3;
            max-width: 940px;
            margin: 40px auto 0;
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            align-items: center;
            background: rgba(255,253,248,0.72);
            border: 1px solid rgba(181,149,92,0.38);
            border-radius: 999px;
            padding: 16px 26px;
            box-shadow: 0 14px 34px rgba(84,62,36,0.10), inset 0 0 0 1px rgba(255,255,255,0.6);
            backdrop-filter: blur(4px);
        }
        .rvh-mb-bc-howto-step {
            display: flex;
            align-items: flex-start;
            gap: 11px;
            padding: 6px 22px;
            text-align: left;
        }
        .rvh-mb-bc-howto-step + .rvh-mb-bc-howto-step { border-left: 1px solid rgba(181,149,92,0.32); }
        .rvh-mb-bc-howto-num {
            width: 26px; height: 26px;
            flex: 0 0 auto;
            border-radius: 50%;
            border: 1px solid var(--gold);
            color: var(--brand-color);
            font-family: 'Cinzel', serif;
            font-size: 0.66rem;
            display: flex; align-items: center; justify-content: center;
            background: rgba(255,255,255,0.7);
        }
        .rvh-mb-bc-howto-text {
            font-family: 'Playfair Display', serif;
            font-size: 0.9rem;
            color: rgba(59,51,45,0.8);
            line-height: 1.5;
        }
        .rvh-mb-bc-howto-text b {
            font-family: 'Cinzel', serif;
            font-size: 0.72rem;
            letter-spacing: 0.16em;
            text-transform: uppercase;
            color: var(--brand-color);
            display: block;
            margin-bottom: 3px;
            font-weight: 600;
        }

        /* stage — spread across the full viewport */
        .rvh-mb-bc-stage {
            position: relative;
            width: 100%;
            max-width: 1560px;
            margin: 44px auto 0;
            min-height: 78vh;
            aspect-ratio: 1560 / 740;
            z-index: 2;
        }
        .rvh-mb-bc-stage::before {
            /* soft ground so the pieces feel placed, not stuck */
            content: '';
            position: absolute;
            left: 50%; bottom: 4%;
            width: 78%; height: 22%;
            transform: translateX(-50%);
            background: radial-gradient(ellipse at center, rgba(84,62,36,0.16) 0%, rgba(84,62,36,0.06) 46%, transparent 74%);
            filter: blur(20px);
            pointer-events: none;
        }
        .rvh-mb-bc-stage-script {
            position: absolute;
            left: 50%; top: 48%;
            max-width: 340px;
            white-space: normal;
            transform: translate(-50%, -50%);
            text-align: center;
            font-family: 'Great Vibes', cursive;
            font-size: clamp(1.7rem, 4vw, 3.3rem);
            color: rgba(141,119,72,0.34);
            line-height: 1.3;
            pointer-events: none;
            z-index: 1;
        }
        .rvh-mb-bc-stage-script small {
            display: block;
            font-family: 'Cinzel', serif;
            font-size: 0.62rem;
            letter-spacing: 0.4em;
            text-transform: uppercase;
            color: rgba(141,119,72,0.5);
            margin-top: 14px;
        }

        /* checklist items — big, tilted, scattered */
        .rvh-mb-bc-item {
            position: absolute;
            display: block;
            cursor: pointer;
            background: none; border: 0; padding: 0;
            z-index: 4;
            -webkit-tap-highlight-color: transparent;
        }
        .rvh-mb-bc-cut {
            position: relative;
            width: 100%;
            transform: rotate(var(--tilt, 0deg));
            transition: transform 0.55s cubic-bezier(.2,.8,.2,1);
        }
        .rvh-mb-bc-cut img {
            display: block;
            width: 100%;
            filter: drop-shadow(0 18px 26px rgba(76,56,32,0.28)) drop-shadow(0 42px 54px rgba(76,56,32,0.16));
            transition: filter 0.45s ease;
            animation: bcDrift var(--dur, 9s) ease-in-out infinite;
            animation-delay: var(--delay, 0s);
        }
        @keyframes bcDrift {
            0%, 100% { transform: translateY(0); }
            50% { transform: translateY(-9px); }
        }
        .rvh-mb-bc-item:hover { z-index: 8; }
        .rvh-mb-bc-item:hover .rvh-mb-bc-cut { transform: rotate(calc(var(--tilt, 0deg) * 0.3)) translateY(-10px) scale(1.05); }
        .rvh-mb-bc-item:hover .rvh-mb-bc-cut img { filter: drop-shadow(0 28px 36px rgba(76,56,32,0.34)) drop-shadow(0 54px 70px rgba(76,56,32,0.18)); }
        .rvh-mb-bc-item:focus-visible { outline: none; }
        .rvh-mb-bc-item:focus-visible .rvh-mb-bc-tag { border-color: var(--brand-color); }

        .rvh-mb-bc-tag {
            position: absolute;
            top: 40%;
            display: inline-flex;
            align-items: center;
            gap: 12px;
            padding: 12px 24px 12px 15px;
            border-radius: 999px;
            background: rgba(255,253,248,0.96);
            border: 1px solid rgba(181,149,92,0.5);
            box-shadow: 0 12px 26px rgba(84,62,36,0.14), inset 0 0 0 1px rgba(255,255,255,0.7);
            backdrop-filter: blur(3px);
            transition: all 0.4s ease;
            z-index: 7;
            transform: rotate(calc(var(--tilt, 0deg) * -0.25));
        }
        .rvh-mb-bc-item.rvh-mb-side-l .rvh-mb-bc-tag { right: 96%; }
        .rvh-mb-bc-item.rvh-mb-side-r .rvh-mb-bc-tag { left: 96%; }
        .rvh-mb-bc-hook {
            position: absolute;
            top: 50%;
            width: 54px;
            color: var(--gold);
            opacity: 0.8;
            pointer-events: none;
        }
        .rvh-mb-bc-item.rvh-mb-side-l .rvh-mb-bc-hook { right: 88%; margin-right: 4px; }
        .rvh-mb-bc-item.rvh-mb-side-r .rvh-mb-bc-hook { left: 88%; margin-left: 4px; transform: scaleX(-1); }
        .rvh-mb-bc-hook svg { width: 100%; height: auto; display: block; }

        .rvh-mb-bc-tick {
            position: relative;
            width: 24px; height: 24px;
            border-radius: 50%;
            border: 1.5px solid var(--gold);
            flex: 0 0 auto;
            transition: all 0.35s ease;
            box-shadow: 0 0 0 0 rgba(181,149,92,0.45);
            animation: bcInvite 2.6s ease-in-out infinite;
        }
        @keyframes bcInvite {
            0%, 100% { box-shadow: 0 0 0 0 rgba(181,149,92,0.42); }
            60% { box-shadow: 0 0 0 9px rgba(181,149,92,0); }
        }
        .rvh-mb-bc-tick::after {
            content: '';
            position: absolute;
            left: 7px; top: 4px;
            width: 7px; height: 13px;
            border-right: 2px solid #fff;
            border-bottom: 2px solid #fff;
            transform: rotate(45deg) scale(0);
            transition: transform 0.4s cubic-bezier(.2,1.6,.4,1);
        }
        .rvh-mb-bc-label {
            font-family: 'Cinzel', serif;
            font-size: 0.82rem;
            letter-spacing: 0.2em;
            text-transform: uppercase;
            color: var(--text-dark);
            white-space: nowrap;
        }
        .rvh-mb-bc-hint-tap {
            display: block;
            margin-top: 4px;
            font-family: 'Caveat', cursive;
            text-transform: none;
            letter-spacing: 0;
            font-size: 0.94rem;
            color: rgba(141,119,72,0.85);
        }
        .rvh-mb-bc-item.rvh-mb-is-checked .rvh-mb-bc-hint-tap { color: rgba(253,251,246,0.75); }
        .rvh-mb-bc-item.rvh-mb-is-checked .rvh-mb-bc-tag {
            background: linear-gradient(135deg, #83202a 0%, var(--brand-color) 55%, #521015 100%);
            border-color: rgba(226,205,166,0.65);
            box-shadow: 0 14px 28px rgba(108,21,28,0.30), inset 0 0 0 1px rgba(226,205,166,0.35);
        }
        .rvh-mb-bc-item.rvh-mb-is-checked .rvh-mb-bc-tick {
            background: var(--gold);
            border-color: var(--gold-light);
            animation: none;
        }
        .rvh-mb-bc-item.rvh-mb-is-checked .rvh-mb-bc-tick::after { transform: rotate(45deg) scale(1); }
        .rvh-mb-bc-item.rvh-mb-is-checked .rvh-mb-bc-label { color: #FDFBF6; }
        .rvh-mb-bc-item.rvh-mb-is-checked .rvh-mb-bc-cut img {
            filter: drop-shadow(0 20px 30px rgba(108,21,28,0.26)) saturate(1.08);
        }
        /* the cute tick animation */
        .rvh-mb-bc-item.rvh-mb-just-ticked .rvh-mb-bc-cut { animation: bcPop 0.75s cubic-bezier(.2,1.5,.35,1); }
        @keyframes bcPop {
            0% { transform: rotate(var(--tilt,0deg)) scale(1); }
            32% { transform: rotate(calc(var(--tilt,0deg) * 0.2)) scale(1.14) translateY(-14px); }
            62% { transform: rotate(var(--tilt,0deg)) scale(0.97) translateY(2px); }
            100% { transform: rotate(var(--tilt,0deg)) scale(1); }
        }
        .rvh-mb-bc-item.rvh-mb-just-ticked .rvh-mb-bc-tag { animation: bcTagPop 0.6s cubic-bezier(.2,1.5,.35,1); }
        @keyframes bcTagPop {
            0%, 100% { transform: rotate(calc(var(--tilt,0deg) * -0.25)) scale(1); }
            40% { transform: rotate(calc(var(--tilt,0deg) * -0.25)) scale(1.09); }
        }
        .rvh-mb-bc-spark {
            position: absolute;
            left: 50%; top: 42%;
            width: 12px; height: 12px;
            pointer-events: none;
            z-index: 9;
            font-family: 'Playfair Display', serif;
            font-size: 15px;
            color: var(--gold);
            animation: bcSpark 0.95s ease-out forwards;
        }
        @keyframes bcSpark {
            0% { opacity: 0; transform: translate(0,0) scale(0.3) rotate(0deg); }
            18% { opacity: 1; }
            100% { opacity: 0; transform: translate(var(--sx), var(--sy)) scale(1.1) rotate(var(--sr)); }
        }
        .rvh-mb-bc-ring {
            position: absolute;
            left: 50%; top: 45%;
            width: 40px; height: 40px;
            margin: -20px 0 0 -20px;
            border-radius: 50%;
            border: 1.5px solid rgba(181,149,92,0.7);
            pointer-events: none;
            z-index: 8;
            animation: bcRing 0.85s ease-out forwards;
        }
        @keyframes bcRing {
            0% { transform: scale(0.4); opacity: 0.9; }
            100% { transform: scale(3.4); opacity: 0; }
        }

        /* item placements — spread right across the stage */
        .rvh-mb-bc-i1 { left: 3%;    top: 6%;   width: 17%;  --tilt: -6deg;  --dur: 9s;   --delay: 0s; }
        .rvh-mb-bc-i2 { left: 30%;   top: 2%;   width: 18%;  --tilt: 5deg;   --dur: 10.5s; --delay: .7s; }
        .rvh-mb-bc-i3 { left: 62%;   top: 4%;   width: 23%;  --tilt: -4deg;  --dur: 9.6s; --delay: 1.3s; }
        .rvh-mb-bc-i4 { left: 8%;    top: 62%;  width: 20%;  --tilt: 7deg;   --dur: 11s;  --delay: .4s; }
        .rvh-mb-bc-i5 { left: 52%;   top: 64%;  width: 24%;  --tilt: -5deg;  --dur: 10s;  --delay: 1s; }

        /* central cta */
        .rvh-mb-bc-actions {
            position: relative;
            z-index: 3;
            text-align: center;
            margin-top: 34px;
        }
        .rvh-mb-bc-progress {
            font-family: 'Playfair Display', serif;
            font-style: italic;
            font-size: 0.95rem;
            color: rgba(59,51,45,0.6);
            margin-bottom: 18px;
        }
        .rvh-mb-bc-progress b { font-style: normal; color: var(--brand-color); }
        .rvh-mb-bc-cta {
            appearance: none; border: none; cursor: pointer;
            font-family: 'Cinzel', serif;
            font-size: 0.8rem;
            letter-spacing: 0.24em;
            text-transform: uppercase;
            color: #fffaf0;
            background: linear-gradient(135deg, #83202a 0%, var(--brand-color) 45%, #521015 100%);
            padding: 17px 40px;
            border-radius: 999px;
            box-shadow: 0 14px 26px rgba(108,21,28,0.32), inset 0 1px 0 rgba(255,255,255,0.22);
            transition: transform 0.35s cubic-bezier(.2,.8,.2,1), box-shadow 0.35s ease;
            position: relative;
        }
        .rvh-mb-bc-cta::after {
            content: ''; position: absolute; inset: 4px;
            border: 1px solid rgba(226,205,166,0.5);
            border-radius: 999px;
            pointer-events: none;
        }
        .rvh-mb-bc-cta:hover { transform: translateY(-3px); box-shadow: 0 20px 34px rgba(108,21,28,0.38), inset 0 1px 0 rgba(255,255,255,0.28); }
        .rvh-mb-bc-cta-hint {
            font-family: 'Caveat', cursive;
            font-size: 1.1rem;
            color: rgba(59,51,45,0.6);
            margin-top: 14px;
        }

        /* results */
        .rvh-mb-bc-results {
            position: relative;
            z-index: 3;
            max-width: 1180px;
            margin: 0 auto;
            padding-top: 0;
            max-height: 0;
            opacity: 0;
            overflow: hidden;
            transition: max-height 0.9s ease, opacity 0.7s ease, padding-top 0.6s ease;
        }
        .rvh-mb-bc-results.rvh-mb-is-open {
            max-height: 1400px;
            opacity: 1;
            padding-top: 70px;
        }
        .rvh-mb-bc-res-head { text-align: center; margin-bottom: 34px; }
        .rvh-mb-bc-res-title {
            font-family: 'Cinzel', serif;
            font-size: clamp(1.05rem, 2vw, 1.4rem);
            letter-spacing: 2.5px;
            text-transform: uppercase;
            color: var(--brand-color);
        }
        .rvh-mb-bc-res-sub {
            font-family: 'Playfair Display', serif;
            font-style: italic;
            font-size: 0.98rem;
            color: rgba(59,51,45,0.62);
            margin-top: 10px;
        }
        .rvh-mb-bc-stagewrap {
            position: relative;
            max-width: 1320px;
            margin: 0 auto;
            padding: 0 74px;
        }
        .rvh-mb-bc-viewport {
            position: relative;
            height: 560px;
            overflow: hidden;
            perspective: 1400px;
        }
        .rvh-mb-bc-card {
            position: absolute;
            left: 50%;
            top: 18px;
            width: 430px;
            max-width: 84%;
            padding: 46px 40px 40px;
            border-radius: 4px;
            text-align: center;
            background:
                radial-gradient(120% 100% at 50% 0%, #FFFDF8 0%, #FBF5E9 100%);
            border: 1px solid rgba(181,149,92,0.42);
            box-shadow: 0 26px 50px rgba(84,62,36,0.20), inset 0 0 0 6px rgba(255,255,255,0.6);
            transition: transform 0.75s cubic-bezier(.2,.8,.2,1), opacity 0.6s ease, filter 0.6s ease;
            will-change: transform;
        }
        .rvh-mb-bc-card::before {
            content: '';
            position: absolute; inset: 12px;
            border: 1px solid rgba(181,149,92,0.35);
            border-radius: 2px;
            pointer-events: none;
        }
        .rvh-mb-bc-card::after {
            content: '';
            position: absolute; left: 50%; top: 0;
            width: 66px; height: 22px;
            transform: translate(-50%, -52%) rotate(-2deg);
            background: linear-gradient(135deg, rgba(226,205,166,0.75), rgba(181,149,92,0.55));
            box-shadow: 0 4px 10px rgba(84,62,36,0.16);
        }
        .rvh-mb-bc-card.rvh-mb-is-side {
            filter: blur(3.6px) saturate(0.86);
            opacity: 0.5;
            box-shadow: 0 16px 30px rgba(84,62,36,0.12);
        }
        .rvh-mb-bc-card.rvh-mb-is-side-2 {
            filter: blur(6px) saturate(0.76);
            opacity: 0.26;
        }
        .rvh-mb-bc-card.rvh-mb-is-far { opacity: 0; pointer-events: none; }
        .rvh-mb-bc-card-kicker {
            font-family: 'Cinzel', serif;
            font-size: 0.6rem;
            letter-spacing: 0.36em;
            text-transform: uppercase;
            color: var(--gold);
            margin-bottom: 14px;
        }
        .rvh-mb-bc-card-name {
            font-family: 'Cinzel', serif;
            font-size: 1.18rem;
            letter-spacing: 2.4px;
            text-transform: uppercase;
            font-weight: 600;
            color: var(--brand-color);
            line-height: 1.4;
        }
        .rvh-mb-bc-card-rule {
            width: 96px; height: 1px; margin: 18px auto 22px;
            background: linear-gradient(to right, transparent, var(--gold), transparent);
        }
        .rvh-mb-bc-card-mark {
            font-family: 'Playfair Display', serif;
            font-size: 2.6rem;
            line-height: 0.6;
            color: rgba(181,149,92,0.55);
            display: block;
            margin-bottom: 10px;
        }
        .rvh-mb-bc-card-quote {
            font-family: 'Playfair Display', serif;
            font-style: italic;
            font-size: 1.06rem;
            line-height: 1.85;
            color: rgba(59,51,45,0.86);
        }
        .rvh-mb-bc-card-by {
            display: block;
            margin-top: 22px;
            font-family: 'Cinzel', serif;
            font-size: 0.68rem;
            letter-spacing: 0.22em;
            text-transform: uppercase;
            color: var(--brand-color);
        }
        .rvh-mb-bc-card-role {
            display: block;
            margin-top: 7px;
            font-family: 'Playfair Display', serif;
            font-style: italic;
            font-size: 0.82rem;
            color: rgba(59,51,45,0.55);
        }
        .rvh-mb-bc-nav button {
            position: absolute;
            top: 46%;
            transform: translateY(-50%);
            width: 46px; height: 46px;
            border-radius: 50%;
            background: rgba(255,253,248,0.94);
            border: 1px solid rgba(181,149,92,0.55);
            color: var(--brand-color);
            font-size: 1rem;
            cursor: pointer;
            box-shadow: 0 10px 20px rgba(84,62,36,0.14);
            transition: all 0.35s ease;
            z-index: 5;
        }
        .rvh-mb-bc-nav button:hover { background: var(--brand-color); color: #FDFBF6; border-color: var(--brand-color); }
        #bcPrev { left: 0; }
        #bcNext { right: 0; }
        .rvh-mb-bc-dots {
            display: flex; justify-content: center; gap: 10px;
            margin-top: 26px;
        }
        .rvh-mb-bc-dots span {
            width: 7px; height: 7px; border-radius: 50%;
            background: rgba(181,149,92,0.35);
            cursor: pointer;
            transition: all 0.35s ease;
        }
        .rvh-mb-bc-dots span.rvh-mb-is-on { background: var(--brand-color); transform: scale(1.35); }
        .rvh-mb-bc-expert { text-align: center; margin-top: 34px; }
        .rvh-mb-bc-expert-btn {
            appearance: none; border: none; cursor: pointer;
            position: relative;
            font-family: 'Cinzel', serif;
            font-size: 0.8rem;
            letter-spacing: 0.24em;
            text-transform: uppercase;
            color: #fffaf0;
            background: linear-gradient(135deg, #83202a 0%, var(--brand-color) 45%, #521015 100%);
            padding: 17px 40px;
            border-radius: 999px;
            box-shadow: 0 14px 26px rgba(108,21,28,0.32), inset 0 1px 0 rgba(255,255,255,0.22);
            transition: transform 0.35s cubic-bezier(.2,.8,.2,1), box-shadow 0.35s ease;
        }
        .rvh-mb-bc-expert-btn::after {
            content: ''; position: absolute; inset: 4px;
            border: 1px solid rgba(226,205,166,0.5);
            border-radius: 999px;
            pointer-events: none;
        }
        .rvh-mb-bc-expert-btn:hover { transform: translateY(-3px); box-shadow: 0 20px 34px rgba(108,21,28,0.38), inset 0 1px 0 rgba(255,255,255,0.28); }
        .rvh-mb-bc-expert-note {
            font-family: 'Playfair Display', serif;
            font-style: italic;
            font-size: 0.88rem;
            color: rgba(59,51,45,0.55);
            margin-top: 12px;
        }

        @media (max-width: 1024px) {
            .rvh-mb-bc-label { font-size: 0.66rem; letter-spacing: 0.12em; }
            .rvh-mb-bc-tag { padding: 9px 16px 9px 11px; gap: 9px; }
            .rvh-mb-bc-hint-tap { font-size: 0.8rem; }
            .rvh-mb-bc-hook { width: 38px; }
            .rvh-mb-bc-stagewrap { padding: 0 46px; }
            .rvh-mb-bc-howto { border-radius: 26px; padding: 14px 10px; }
            .rvh-mb-bc-howto-step { padding: 8px 16px; }
            .rvh-mb-bc-howto-text { font-size: 0.82rem; }
        }
        @media (max-width: 760px) {
            .rvh-mb-bc-section { padding: 80px 16px 100px; }
            .rvh-mb-bc-stage {
                aspect-ratio: auto;
                min-height: 0;
                display: grid;
                grid-template-columns: 1fr 1fr;
                gap: 30px 14px;
                margin-top: 34px;
            }
            .rvh-mb-bc-stage::before { display: none; }
            .rvh-mb-bc-stage-script { display: none; }
            .rvh-mb-bc-howto { grid-template-columns: 1fr; gap: 2px; border-radius: 24px; }
            .rvh-mb-bc-label { white-space: normal; font-size: 0.62rem; text-align: left; }
            .rvh-mb-bc-tag { padding: 8px 14px 8px 10px; }
            .rvh-mb-bc-howto-step + .rvh-mb-bc-howto-step { border-left: 0; border-top: 1px solid rgba(181,149,92,0.28); }
            .rvh-mb-bc-item {
                position: relative;
                left: auto; right: auto; top: auto; bottom: auto;
                width: 100%;
                display: flex;
                flex-direction: column;
                align-items: center;
                gap: 12px;
            }
            .rvh-mb-bc-item.rvh-mb-side-l .rvh-mb-bc-tag, .rvh-mb-bc-item.rvh-mb-side-r .rvh-mb-bc-tag, .rvh-mb-bc-i5 .rvh-mb-bc-tag, .rvh-mb-bc-tag {
                position: relative;
                top: auto; left: auto; right: auto;
                transform: none;
            }
            .rvh-mb-bc-hook { display: none; }
            .rvh-mb-bc-i1, .rvh-mb-bc-i2, .rvh-mb-bc-i3, .rvh-mb-bc-i4, .rvh-mb-bc-i5 { left: auto; top: auto; }
            .rvh-mb-bc-i5 { grid-column: 1 / -1; width: 58%; margin: 0 auto; }
            .rvh-mb-bc-viewport { height: 470px; perspective: none; }
            .rvh-mb-bc-stagewrap { padding: 0 8px; }
            .rvh-mb-bc-nav button { top: auto; bottom: -6px; width: 40px; height: 40px; }
            .rvh-mb-bc-card { padding: 34px 24px 30px; }
            .rvh-mb-bc-card-quote { font-size: 0.98rem; }
            .rvh-mb-bc-results.rvh-mb-is-open { max-height: 1600px; padding-top: 50px; }
        }

        /* ============================================================
           TALK TO AN EXPERT POPUP (ported from index.html's shared
           singleton so this "Talk To Our Expert" button behaves the
           same way here as it does everywhere else on the site).
           ============================================================ */
        .rvh-mb-sd-share-overlay {
            position: fixed; inset: 0;
            background: rgba(43,30,22,.45);
            backdrop-filter: blur(2px);
            display: flex; align-items: center; justify-content: center;
            padding: 24px;
            z-index: 999;
            opacity: 0; pointer-events: none;
            transition: opacity .3s ease;
        }
        .rvh-mb-sd-share-overlay.rvh-mb-is-open { opacity: 1; pointer-events: auto; }
        .rvh-mb-sd-share-card {
            position: relative;
            width: min(420px, 100%);
            background: linear-gradient(180deg, #FDFCF8 0%, #F5EFE3 100%);
            border: 1px solid rgba(181,149,92,.4);
            border-radius: 14px;
            padding: 34px 30px 28px;
            box-shadow: 0 40px 70px -20px rgba(43,30,22,.5);
            text-align: center;
            transform: translateY(14px) scale(.98);
            transition: transform .35s cubic-bezier(.2,.8,.2,1);
        }
        .rvh-mb-sd-share-overlay.rvh-mb-is-open .rvh-mb-sd-share-card { transform: translateY(0) scale(1); }
        .rvh-mb-sd-share-close {
            position: absolute; top: 14px; right: 14px;
            width: 30px; height: 30px;
            border-radius: 50%;
            border: 1px solid rgba(108,21,28,.25);
            background: rgba(255,255,255,.6);
            color: var(--brand-color);
            font-size: 1rem; line-height: 1;
            cursor: pointer;
        }
        .rvh-mb-sd-share-kicker {
            font-family: 'Cinzel', serif;
            font-size: .62rem;
            letter-spacing: .22em;
            text-transform: uppercase;
            color: var(--gold);
            margin-bottom: 8px;
        }
        .rvh-mb-sd-share-title {
            font-family: 'Playfair Display', serif;
            font-size: 1.35rem;
            color: var(--brand-color);
            margin: 0 0 8px;
        }
        .rvh-mb-sd-share-copy {
            font-family: 'Playfair Display', serif;
            font-style: italic;
            font-size: .92rem;
            color: rgba(59,51,45,.72);
            margin: 0 0 22px;
            line-height: 1.55;
        }
        .rvh-mb-sd-share-field { text-align: left; margin-bottom: 16px; }
        .rvh-mb-sd-share-field span {
            display: block;
            font-family: 'Cinzel', serif;
            font-size: .56rem;
            letter-spacing: .16em;
            text-transform: uppercase;
            color: rgba(59,51,45,.6);
            margin-bottom: 6px;
        }
        .rvh-mb-sd-share-field input {
            width: 100%;
            padding: 11px 14px;
            border-radius: 8px;
            border: 1px solid rgba(181,149,92,.45);
            background: rgba(255,255,255,.8);
            font-family: 'Playfair Display', serif;
            font-size: .88rem;
            color: var(--text-dark);
        }
        .rvh-mb-sd-share-field input:focus { outline: none; border-color: rgba(108,21,28,.55); }
        .rvh-mb-sd-share-field.rvh-mb-has-error input { border-color: rgba(178,40,40,.75); }
        .rvh-mb-sd-share-btn {
            appearance: none; border: none; cursor: pointer;
            position: relative;
            font-family: 'Cinzel', serif;
            font-size: .58rem;
            letter-spacing: .14em;
            text-transform: uppercase;
            color: #fffaf0;
            background: linear-gradient(135deg, #83202a 0%, var(--brand-color) 45%, #521015 100%);
            padding: 11px 16px;
            border-radius: 999px;
            box-shadow: 0 14px 26px rgba(108,21,28,0.32), inset 0 1px 0 rgba(255,255,255,0.22);
            transition: transform .35s cubic-bezier(.2,.8,.2,1), box-shadow .35s ease;
            white-space: nowrap;
        }
        .rvh-mb-sd-share-btn::after {
            content: '';
            position: absolute; inset: 3px;
            border: 1px solid rgba(226,205,166,0.5);
            border-radius: 999px;
            pointer-events: none;
        }
        .rvh-mb-sd-share-btn:hover { transform: translateY(-2px); box-shadow: 0 20px 34px rgba(108,21,28,0.38), inset 0 1px 0 rgba(255,255,255,0.28); }
        .rvh-mb-sd-share-btn:disabled { opacity: .5; cursor: not-allowed; transform: none !important; }
        .rvh-mb-sd-share-status {
            margin-top: 16px;
            min-height: 18px;
            font-family: 'Caveat', cursive;
            font-size: .95rem;
            color: var(--brand-color);
        }
        .rvh-mb-sd-share-status.rvh-mb-is-error { color: #a22; font-family: 'Playfair Display', serif; font-style: italic; font-size: .92rem; }
        .rvh-mb-sd-share-checkbox-row {
            display: flex; align-items: flex-start; gap: 9px;
            text-align: left;
            margin: 4px 0 20px;
            cursor: pointer;
        }
        .rvh-mb-sd-share-checkbox-row input[type="checkbox"] {
            appearance: none; -webkit-appearance: none;
            flex: none;
            width: 17px; height: 17px;
            margin-top: 1px;
            border-radius: 4px;
            border: 1px solid rgba(181,149,92,.6);
            background: rgba(255,255,255,.85);
            cursor: pointer;
            position: relative;
            transition: background .2s ease, border-color .2s ease;
        }
        .rvh-mb-sd-share-checkbox-row input[type="checkbox"]:checked {
            background: var(--brand-color);
            border-color: var(--brand-color);
        }
        .rvh-mb-sd-share-checkbox-row input[type="checkbox"]:checked::after {
            content: '';
            position: absolute; left: 5px; top: 1px;
            width: 5px; height: 9px;
            border: solid #fffaf0;
            border-width: 0 2px 2px 0;
            transform: rotate(45deg);
        }
        .rvh-mb-sd-share-checkbox-row span {
            font-family: 'Playfair Display', serif;
            font-size: .8rem;
            line-height: 1.4;
            color: rgba(59,51,45,.78);
        }
        .rvh-mb-sd-share-checkbox-row.rvh-mb-has-error input[type="checkbox"] { border-color: rgba(178,40,40,.75); }
        .rvh-mb-sd-share-btn-block { display: block; width: 100%; }
        @media (max-width: 480px) {
            .rvh-mb-sd-share-overlay { padding: 14px; }
            .rvh-mb-sd-share-card { padding: 30px 18px 24px; }
        }

    

        /* Isolation helper: this copy is used to show ONLY the moodboard section as "section 5" of the combined page.
           Nothing about the moodboard section's own design/CSS is changed; the other sections in this file are simply
           hidden (not removed) so their scripts keep initializing normally and nothing errors. */
        .rvh-mb-hero-section, .rvh-mb-brides-book-section, .rvh-mb-savedate-section, .rvh-mb-bc-section { display: none !important; }