/* ==========================================================================
   WEDDING INVITATION - COMPLETE SECTIONS CSS
   适配：
   1. 新版 Story Chapter Layout
   2. 新版 Schedule Illustrated Layout
   3. 新版 Gallery Left/Right Slideshow
   4. RSVP / Blessings / Final 完整保留
   5. Romantic Scroll 但不做 full width
   ========================================================================== */

/* ==========================================================================
   1. BASE TYPOGRAPHY / SHARED SECTION UI
   ========================================================================== */

.story-content h3,
.detail-card h3,
.schedule-card h3,
.blessing-card h3,
.detail-note h3,
.chapter-panel h3,
.dream-gallery-info-card h3,
.schedule-step-card h3 {
    font-family: 'Noto Serif SC', serif;
    margin: 0.85rem 0 0.6rem;
    font-size: 1.28rem;
    color: #6d545f;
}

.story-content p,
.detail-card p,
.schedule-card p,
.blessing-card p,
.detail-note p,
.form-card p,
.chapter-panel p,
.schedule-step-card p {
    margin: 0;
    color: var(--text-soft);
    line-height: 1.85;
}

.section-heading {
    max-width: 760px;
    margin-bottom: 3rem;
    position: relative;
    z-index: 3;
}

.section-heading.center {
    margin-inline: auto;
    text-align: center;
}

.section-heading h2,
.final-inner h2 {
    font-family: 'Cormorant Garamond', 'Noto Serif SC', serif;
    font-weight: 600;
    font-size: clamp(2.5rem, 5.5vw, 4.2rem);
    line-height: 1;
    margin: 0 0 1rem;
    color: #644956;
}

.section-heading p,
.final-inner p {
    color: var(--text-soft);
    margin: 0;
}

/* ==========================================================================
   2. ROMANTIC SCROLL SYSTEM
   ========================================================================== */

html,
body {
    scroll-snap-type: none !important;
    overflow-x: hidden !important;
    height: auto !important;
    overscroll-behavior-y: auto !important;
}

.romantic-scroll {
    position: relative;
}

@media (min-width: 861px) {
    html.romantic-scroll-mode,
    body.romantic-scroll-mode {
        scroll-snap-type: y proximity !important;
    }

    .panel-section {
        position: relative;
        min-height: 92svh;
        display: flex;
        align-items: center;
        scroll-snap-align: start;
        scroll-snap-stop: always;
        isolation: isolate;
        padding: 50px 0;
        overflow: visible;
    }

    .panel-hero {
        min-height: 100svh;
    }

    .panel-section > .container,
    .panel-section .hero-container {
        position: relative;
        z-index: 3;
        width: min(var(--container), calc(100% - 2rem));
        margin: 0 auto;
        transition:
            transform 0.9s cubic-bezier(.2,.85,.22,1),
            opacity 0.9s cubic-bezier(.2,.85,.22,1),
            filter 0.9s cubic-bezier(.2,.85,.22,1);
    }

    .panel-section::before {
        content: "";
        position: absolute;
        left: 50%;
        top: 50%;
        width: min(1240px, calc(100% - 1.5rem));
        height: calc(100% - 28px);
        transform: translate(-50%, -50%);
        border-radius: 42px;
        background:
            linear-gradient(180deg, rgba(255,255,255,0.50), rgba(255,248,251,0.42));
        border: 1px solid rgba(232, 205, 212, 0.46);
        box-shadow:
            0 24px 70px rgba(193, 159, 173, 0.08),
            inset 0 1px 0 rgba(255,255,255,0.78);
        backdrop-filter: blur(8px);
        z-index: 1;
        pointer-events: none;
    }

    .panel-section::after {
        content: "";
        position: absolute;
        left: 50%;
        top: 50%;
        width: min(1180px, calc(100% - 3rem));
        height: calc(100% - 54px);
        transform: translate(-50%, -50%);
        border-radius: 34px;
        border: 1px solid rgba(239, 216, 222, 0.62);
        z-index: 2;
        pointer-events: none;
    }

    .panel-hero::before,
    .panel-hero::after {
        display: none;
    }

    .panel-section:not(.is-active) > .container,
    .panel-section:not(.is-active) .hero-container {
        transform: translateY(20px) scale(0.988);
        opacity: 0.78;
        filter: blur(6px);
    }

    .panel-section.is-active > .container,
    .panel-section.is-active .hero-container {
        transform: translateY(0) scale(1);
        opacity: 1;
        filter: blur(0);
    }

    .panel-section .section-heading,
    .panel-section .final-inner {
        transition:
            transform 0.85s cubic-bezier(.2,.85,.22,1),
            opacity 0.85s cubic-bezier(.2,.85,.22,1),
            filter 0.85s cubic-bezier(.2,.85,.22,1);
    }

    .panel-section:not(.is-active) .section-heading,
    .panel-section:not(.is-active) .final-inner {
        transform: translateY(14px);
        opacity: 0.72;
        filter: blur(5px);
    }

    .panel-section.is-active .section-heading,
    .panel-section.is-active .final-inner {
        transform: none;
        opacity: 1;
        filter: blur(0);
    }

    .panel-section .chapter-row,
    .panel-section .detail-card,
    .panel-section .detail-note,
    .panel-section .schedule-board,
    .panel-section .dream-gallery,
    .panel-section .form-card,
    .panel-section .blessing-card {
        transition:
            transform 0.95s cubic-bezier(.2,.85,.22,1),
            opacity 0.95s cubic-bezier(.2,.85,.22,1),
            filter 0.95s cubic-bezier(.2,.85,.22,1);
    }

    .panel-section:not(.is-active) .chapter-row,
    .panel-section:not(.is-active) .detail-card,
    .panel-section:not(.is-active) .detail-note,
    .panel-section:not(.is-active) .schedule-board,
    .panel-section:not(.is-active) .dream-gallery,
    .panel-section:not(.is-active) .form-card,
    .panel-section:not(.is-active) .blessing-card {
        transform: translateY(18px) scale(0.985);
        opacity: 0.74;
        filter: blur(5px);
    }

    .panel-section.is-active .chapter-row,
    .panel-section.is-active .detail-card,
    .panel-section.is-active .detail-note,
    .panel-section.is-active .schedule-board,
    .panel-section.is-active .dream-gallery,
    .panel-section.is-active .form-card,
    .panel-section.is-active .blessing-card {
        transform: none;
        opacity: 1;
        filter: blur(0);
    }
}

.free-flow-section {
    position: relative;
    scroll-snap-align: none;
    scroll-snap-stop: normal;
    z-index: 2;
}

@media (max-width: 860px) {
    .panel-section {
        height: auto !important;
        min-height: auto !important;
        padding: 80px 0 !important;
        scroll-snap-align: none !important;
        scroll-snap-stop: normal !important;
    }

    .panel-section::before,
    .panel-section::after {
        display: none !important;
    }

    .chapter-panel,
    .schedule-board,
    .schedule-step-card,
    .dream-gallery-info-card,
    .form-card,
    .detail-card {
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        background: rgba(255, 255, 255, 0.98) !important;
        box-shadow: 0 10px 30px rgba(0,0,0,0.08) !important;
    }
}

/* ==========================================================================
   3. STORY SECTION / CHAPTER JOURNEY
   ========================================================================== */

.story-section {
    position: relative;
    overflow: hidden;
    padding: 120px 0 130px;
    background:
        radial-gradient(circle at 18% 18%, rgba(255, 220, 228, 0.42), transparent 22%),
        radial-gradient(circle at 82% 16%, rgba(222, 216, 255, 0.36), transparent 24%),
        radial-gradient(circle at 50% 100%, rgba(255, 239, 210, 0.24), transparent 30%),
        linear-gradient(180deg, #fffdfa 0%, #fffaf7 48%, #fff7fb 100%);
}

.story-section::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(180deg, rgba(255,255,255,0.25), transparent 26%, transparent 74%, rgba(255,255,255,0.18));
    pointer-events: none;
    z-index: 0;
}

.story-heading-shell {
    position: relative;
    z-index: 3;
    max-width: 820px;
    margin-bottom: 4rem;
}

.chapter-journey {
    position: relative;
    display: grid;
    gap: 34px;
    z-index: 3;
}

.chapter-journey::before {
    content: "";
    position: absolute;
    top: 24px;
    bottom: 24px;
    left: 50%;
    width: 1px;
    transform: translateX(-50%);
    opacity: 0.6;
    background: linear-gradient(
        180deg,
        rgba(231, 194, 204, 0),
        rgba(220, 188, 198, 0.95),
        rgba(216, 206, 238, 0.95),
        rgba(231, 194, 204, 0)
    );
}

.chapter-row {
    position: relative;
    display: grid;
    grid-template-columns: minmax(300px, 360px) minmax(0, 1fr);
    gap: 36px;
    align-items: center;
    min-height: 340px;
}

.chapter-row::before {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    transform: translate(-50%, -50%);
    background: radial-gradient(circle, rgba(255,255,255,1) 0 24%, rgba(244, 207, 217, 0.95) 25%, rgba(217, 209, 236, 0.92) 70%, rgba(217, 209, 236, 0) 72%);
    box-shadow: 0 0 0 8px rgba(255, 249, 250, 0.85);
    z-index: 2;
}

.chapter-row.is-reverse {
    grid-template-columns: minmax(0, 1fr) minmax(300px, 360px);
}

.chapter-row.is-reverse .chapter-figure {
    order: 2;
}

.chapter-row.is-reverse .chapter-panel {
    order: 1;
}

.chapter-figure {
    position: relative;
    display: grid;
    place-items: center;
    min-height: 320px;
    z-index: 3;
}

.chapter-figure-glow {
    position: absolute;
    width: 280px;
    height: 280px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(255, 229, 236, 0.88), rgba(227, 219, 255, 0.45), transparent 72%);
    filter: blur(20px);
    animation: chapterGlow 4.8s ease-in-out infinite;
    z-index: 0;
}

.chapter-figure-ring {
    position: absolute;
    width: 320px;
    height: 320px;
    border-radius: 36px;
    border: 1px dashed rgba(229, 195, 205, 0.55);
    transform: rotate(-6deg);
    opacity: 0.75;
    z-index: 0;
}

.chapter-row.is-reverse .chapter-figure-ring {
    transform: rotate(6deg);
}

.chapter-figure-frame {
    position: relative;
    z-index: 2;
    width: 100%;
    max-width: 320px;
    padding: 14px;
    border-radius: 34px;
    background:
        linear-gradient(180deg, rgba(255,255,255,0.82), rgba(255,247,250,0.70));
    border: 1px solid rgba(228, 199, 207, 0.60);
    box-shadow:
        0 24px 48px rgba(190, 158, 171, 0.16),
        inset 0 1px 0 rgba(255,255,255,0.96);
    overflow: hidden;
    transform: rotate(-2deg);
}

.chapter-row.is-reverse .chapter-figure-frame {
    transform: rotate(2deg);
}

.chapter-figure-frame::before {
    content: "";
    position: absolute;
    inset: 10px;
    border-radius: 24px;
    border: 1px solid rgba(236, 212, 218, 0.78);
    pointer-events: none;
}

.chapter-figure-frame::after {
    content: "";
    position: absolute;
    top: -30px;
    right: -12px;
    width: 120px;
    height: 120px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(255, 223, 232, 0.40), transparent 72%);
    pointer-events: none;
}

.chapter-figure-media {
    position: relative;
    width: 100%;
    aspect-ratio: 4 / 3;
    border-radius: 24px;
    overflow: hidden;
    background:
        linear-gradient(180deg, rgba(255, 248, 251, 0.88), rgba(248, 239, 244, 0.80));
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,0.75),
        0 12px 24px rgba(194, 164, 176, 0.10);
}

.chapter-figure-media::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 2;
    background:
        linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.00) 45%, rgba(44, 30, 36, 0.08));
    pointer-events: none;
}

.chapter-figure-media img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    object-position: center;
    transform: scale(1.02);
    transition: transform 0.45s ease;
}

.chapter-row:hover .chapter-figure-media img {
    transform: scale(1.06);
}

.chapter-panel {
    position: relative;
    z-index: 3;
    border-radius: 34px;
    padding: 28px;
    background:
        linear-gradient(180deg, rgba(255,255,255,0.80), rgba(255,248,250,0.74));
    border: 1px solid rgba(227, 198, 206, 0.55);
    box-shadow:
        0 24px 60px rgba(186, 151, 165, 0.12),
        inset 0 1px 0 rgba(255,255,255,0.94);
    overflow: hidden;
}

.chapter-panel::before {
    content: "";
    position: absolute;
    inset: 10px;
    border-radius: 24px;
    border: 1px solid rgba(235, 211, 217, 0.72);
    pointer-events: none;
}

.chapter-panel::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 180px;
    height: 180px;
    background: radial-gradient(circle at top right, rgba(255, 223, 232, 0.55), transparent 70%);
    pointer-events: none;
}

.chapter-panel-top {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 18px;
}

.chapter-chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    padding: 7px 14px;
    border-radius: 999px;
    background: rgba(255,255,255,0.82);
    border: 1px solid rgba(229, 198, 204, 0.72);
    color: #9a7780;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.chapter-year {
    color: #c79baa;
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.8rem;
    font-weight: 700;
    line-height: 1;
}

.chapter-panel-body {
    position: relative;
    z-index: 2;
    padding-left: 56px;
}

.chapter-no {
    position: absolute;
    top: -8px;
    left: 0;
    font-family: 'Cormorant Garamond', serif;
    font-size: 3.1rem;
    line-height: 1;
    font-weight: 700;
    color: rgba(220, 186, 198, 0.34);
}

.chapter-panel h3 {
    margin: 0 0 12px;
    font-family: 'Noto Serif SC', serif;
    font-size: 1.7rem;
    color: #6d545f;
    line-height: 1.35;
}

.chapter-panel p {
    margin: 0;
    color: #7a6870;
    line-height: 1.95;
    font-size: 15.5px;
}

/* =========================================
   DETAILS SECTION - UPGRADED
========================================= */

.details-section {
    position: relative;
    overflow: hidden;
    background:
        radial-gradient(circle at 16% 16%, rgba(255, 223, 232, 0.34), transparent 22%),
        radial-gradient(circle at 84% 18%, rgba(223, 216, 255, 0.28), transparent 24%),
        radial-gradient(circle at 50% 88%, rgba(255, 239, 213, 0.24), transparent 28%),
        linear-gradient(180deg, #fffdfa 0%, #fffaf7 48%, #fff8fb 100%);
}

.details-section::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(180deg, rgba(255,255,255,0.18), transparent 26%, transparent 74%, rgba(255,255,255,0.14));
    pointer-events: none;
    z-index: 0;
}

.details-heading {
    position: relative;
    z-index: 3;
    max-width: 760px;
    margin-inline: auto;
    margin-bottom: 3rem;
}

.venue-showcase {
    position: relative;
    z-index: 3;
    display: grid;
    grid-template-columns: minmax(320px, 500px) minmax(320px, 1fr);
    gap: 24px;
    align-items: stretch;
    margin-bottom: 2rem;
}

.venue-media-card,
.venue-info-card {
    position: relative;
    overflow: hidden;
    border-radius: 34px;
    background:
        linear-gradient(180deg, rgba(255,255,255,0.84), rgba(255,248,251,0.72));
    border: 1px solid rgba(226, 198, 206, 0.56);
    box-shadow:
        0 24px 60px rgba(186, 151, 165, 0.12),
        inset 0 1px 0 rgba(255,255,255,0.94);
    backdrop-filter: blur(12px);
}

.venue-media-card::before,
.venue-info-card::before {
    content: "";
    position: absolute;
    inset: 10px;
    border-radius: 24px;
    border: 1px solid rgba(235, 211, 217, 0.72);
    pointer-events: none;
}

.venue-media-card {
    padding: 14px;
}

.venue-media-glow {
    position: absolute;
    inset: auto;
    width: 220px;
    height: 220px;
    right: -30px;
    top: -30px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(255, 223, 232, 0.42), transparent 72%);
    filter: blur(18px);
    z-index: 0;
}

.venue-media-frame {
    position: relative;
    z-index: 2;
    width: 100%;
    height: 100%;
    min-height: 420px;
    border-radius: 24px;
    overflow: hidden;
}

.venue-media-frame img {
    width: 100%;
    height: 100%;
    min-height: 420px;
    object-fit: cover;
    object-position: center;
    display: block;
}

.venue-media-frame::after {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(180deg, rgba(44, 30, 36, 0.04), rgba(44, 30, 36, 0.12)),
        linear-gradient(0deg, rgba(44, 30, 36, 0.32), rgba(44, 30, 36, 0.02) 42%, rgba(44, 30, 36, 0.10));
}

.venue-media-badge {
    position: absolute;
    left: 16px;
    bottom: 16px;
    z-index: 3;
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    padding: 7px 14px;
    border-radius: 999px;
    background: rgba(255,255,255,0.18);
    border: 1px solid rgba(255,255,255,0.28);
    backdrop-filter: blur(10px);
    color: #fff;
    font-size: 12px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.venue-info-card {
    padding: 28px 26px 24px;
}

.venue-kicker {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    padding: 7px 14px;
    border-radius: 999px;
    background: rgba(255,255,255,0.72);
    border: 1px solid rgba(229, 198, 204, 0.72);
    color: #9a7780;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    position: relative;
    z-index: 2;
}

.venue-info-card h3 {
    position: relative;
    z-index: 2;
    margin: 16px 0 10px;
    font-family: 'Noto Serif SC', serif;
    font-size: clamp(1.7rem, 3vw, 2.3rem);
    line-height: 1.25;
    color: #6d545f;
}

.venue-address {
    position: relative;
    z-index: 2;
    margin: 0;
    color: #7a6870;
    line-height: 1.9;
    font-size: 15px;
}

.venue-actions {
    position: relative;
    z-index: 2;
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 20px;
    margin-bottom: 20px;
}

.venue-map-wrap {
    position: relative;
    z-index: 2;
    border-radius: 22px;
    overflow: hidden;
    border: 1px solid rgba(232, 203, 210, 0.52);
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.9);
    background: rgba(255,255,255,0.72);
}

.venue-map-wrap iframe {
    width: 100%;
    height: 260px;
    border: 0;
    display: block;
}

.details-grid-upgraded {
    position: relative;
    z-index: 3;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.2rem;
}

.detail-card {
    position: relative;
    overflow: hidden;
    border-radius: 28px;
    padding: 1.5rem;
    min-height: 220px;
    background:
        linear-gradient(180deg, rgba(255,255,255,0.84), rgba(255,248,250,0.74));
    border: 1px solid rgba(255, 255, 255, 0.58);
    box-shadow:
        0 18px 42px rgba(186, 151, 165, 0.10),
        inset 0 1px 0 rgba(255,255,255,0.94);
    transition: transform 0.35s ease, box-shadow 0.35s ease;
}

.detail-card::before {
    content: "";
    position: absolute;
    inset: 10px;
    border-radius: 18px;
    border: 1px solid rgba(235, 211, 217, 0.66);
    pointer-events: none;
}

.detail-card:hover {
    transform: translateY(-6px);
    box-shadow:
        0 24px 52px rgba(186, 151, 165, 0.16),
        inset 0 1px 0 rgba(255,255,255,0.94);
}

.detail-icon {
    width: 54px;
    height: 54px;
    display: grid;
    place-items: center;
    border-radius: 18px;
    background: linear-gradient(135deg, rgba(244, 207, 217, 0.5), rgba(217, 209, 236, 0.55));
    font-size: 1.35rem;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.6);
    margin-bottom: 0.9rem;
}

.detail-card h3 {
    margin: 0 0 0.55rem;
    font-family: 'Noto Serif SC', serif;
    font-size: 1.22rem;
    color: #6d545f;
}

.detail-card p {
    margin: 0;
    color: #7a6870;
    line-height: 1.88;
    font-size: 14.5px;
}

/* decor */
.details-orb,
.details-floral {
    position: absolute;
    pointer-events: none;
    z-index: 1;
}

.details-orb {
    border-radius: 50%;
    filter: blur(24px);
}

.details-orb-1 {
    width: 320px;
    height: 320px;
    left: -90px;
    top: 80px;
    background: radial-gradient(circle, rgba(255, 220, 230, 0.50), transparent 72%);
}

.details-orb-2 {
    width: 280px;
    height: 280px;
    right: -80px;
    bottom: 70px;
    background: radial-gradient(circle, rgba(225, 216, 255, 0.42), transparent 72%);
}

.details-floral {
    width: 200px;
    height: 200px;
    opacity: 0.26;
}

.details-floral-left {
    top: 10px;
    left: -18px;
    background:
        radial-gradient(circle at 32% 28%, rgba(255, 211, 223, 0.88) 0 16px, transparent 17px),
        radial-gradient(circle at 54% 18%, rgba(236, 214, 255, 0.78) 0 13px, transparent 14px),
        radial-gradient(circle at 47% 43%, rgba(255, 241, 203, 0.72) 0 11px, transparent 12px),
        linear-gradient(130deg, transparent 44%, rgba(146, 181, 146, 0.55) 45%, transparent 47%);
}

.details-floral-right {
    right: -18px;
    bottom: 20px;
    background:
        radial-gradient(circle at 70% 30%, rgba(255, 218, 227, 0.88) 0 16px, transparent 17px),
        radial-gradient(circle at 52% 50%, rgba(220, 213, 255, 0.78) 0 13px, transparent 14px),
        radial-gradient(circle at 35% 68%, rgba(255, 241, 203, 0.72) 0 11px, transparent 12px),
        linear-gradient(220deg, transparent 44%, rgba(146, 181, 146, 0.55) 45%, transparent 47%);
}

/* responsive */
@media (max-width: 1080px) {
    .venue-showcase {
        grid-template-columns: 1fr;
    }

    .venue-media-frame,
    .venue-media-frame img {
        min-height: 340px;
    }

    .details-grid-upgraded {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 860px) {
    .details-section {
        padding-top: 88px;
        padding-bottom: 88px;
    }

    .details-heading {
        margin-bottom: 2rem;
    }

    .venue-info-card,
    .venue-media-card {
        border-radius: 24px;
    }

    .venue-info-card::before,
    .venue-media-card::before {
        inset: 8px;
        border-radius: 18px;
    }

    .venue-info-card {
        padding: 22px 18px 18px;
    }

    .venue-media-frame,
    .venue-media-frame img {
        min-height: 280px;
    }

    .venue-map-wrap iframe {
        height: 220px;
    }

    .details-grid-upgraded {
        grid-template-columns: 1fr;
    }

    .detail-card {
        min-height: auto;
    }
}

@media (max-width: 520px) {
    .venue-media-frame,
    .venue-media-frame img {
        min-height: 230px;
    }

    .venue-info-card h3 {
        font-size: 1.45rem;
    }

    .venue-address {
        font-size: 14px;
        line-height: 1.82;
    }

    .venue-map-wrap iframe {
        height: 200px;
    }

    .details-floral {
        width: 120px;
        height: 120px;
        opacity: 0.18;
    }

    .details-orb {
        width: 160px;
        height: 160px;
    }
}
/* ==========================================================================
   5. SCHEDULE SECTION - ILLUSTRATED ALT LAYOUT
   ========================================================================== */

.schedule-section {
    position: relative;
    overflow: hidden;
    background:
        radial-gradient(circle at 15% 16%, rgba(255, 223, 231, 0.34), transparent 22%),
        radial-gradient(circle at 85% 14%, rgba(225, 218, 255, 0.30), transparent 24%),
        radial-gradient(circle at 50% 88%, rgba(255, 240, 213, 0.26), transparent 26%),
        linear-gradient(180deg, #fffdfa 0%, #fffaf7 50%, #fff8fb 100%);
}

.schedule-section::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at center, rgba(255,255,255,0.56), transparent 55%);
    pointer-events: none;
    z-index: 0;
}

.schedule-board {
    position: relative;
    z-index: 3;
    padding: 42px 28px 20px;
    border-radius: 42px;
    background:
        linear-gradient(180deg, rgba(255,255,255,0.72), rgba(255,249,251,0.68));
    border: 1px solid rgba(232, 203, 210, 0.5);
    box-shadow:
        0 28px 70px rgba(192, 162, 176, 0.12),
        inset 0 1px 0 rgba(255,255,255,0.92);
    backdrop-filter: blur(8px);
}

.schedule-board::before {
    content: "";
    position: absolute;
    inset: 12px;
    border-radius: 30px;
    border: 1px solid rgba(238, 215, 221, 0.7);
    pointer-events: none;
}

.schedule-heading {
    position: relative;
    z-index: 3;
    max-width: 760px;
    margin-inline: auto;
    margin-bottom: 3.2rem;
    text-align: center;
}

.schedule-heading h2 {
    font-size: clamp(2.5rem, 5vw, 4rem);
    color: #e98598;
    text-shadow: 0 8px 18px rgba(233, 133, 152, 0.12);
}

.schedule-flow {
    position: relative;
    display: grid;
    gap: 28px;
    z-index: 3;
}

.schedule-step {
    position: relative;
    display: grid;
    grid-template-columns: 390px minmax(0, 1fr);
    align-items: center;
    gap: 26px;
}

.schedule-step.is-reverse {
    grid-template-columns: minmax(0, 1fr) 390px;
}

.schedule-step.is-reverse .schedule-step-art {
    order: 2;
}

.schedule-step.is-reverse .schedule-step-content {
    order: 1;
}

.schedule-step-art {
    position: relative;
    display: grid;
    place-items: center;
    min-height: 180px;
}

.schedule-art-glow {
    position: absolute;
    width: 160px;
    height: 160px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(255, 225, 234, 0.82), rgba(226, 218, 255, 0.42), transparent 72%);
    filter: blur(18px);
    animation: scheduleGlow 4.8s ease-in-out infinite;
}

.schedule-art-frame {
    position: relative;
    z-index: 2;
    width: 100%;
    max-width: 150px;
    display: grid;
    place-items: center;
}

.schedule-art-frame img {
    width: 100%;
    max-height: 180px;
    object-fit: contain;
    filter:
        drop-shadow(0 18px 26px rgba(166, 137, 150, 0.18))
        drop-shadow(0 6px 12px rgba(255,255,255,0.42));
    animation: scheduleFloat 5s ease-in-out infinite;
}

.schedule-step-content {
    position: relative;
}

.schedule-step-card {
    position: relative;
    text-align: center;
    padding: 24px 22px;
    border-radius: 30px;
    background:
        linear-gradient(180deg, rgba(255,255,255,0.82), rgba(255,247,250,0.72));
    border: 1px solid rgba(231, 201, 209, 0.56);
    box-shadow:
        0 20px 40px rgba(191, 157, 171, 0.10),
        inset 0 1px 0 rgba(255,255,255,0.94);
}

.schedule-step-card::before {
    content: "";
    position: absolute;
    inset: 10px;
    border-radius: 22px;
    border: 1px solid rgba(237, 214, 220, 0.74);
    pointer-events: none;
}

.schedule-step-card h3 {
    position: relative;
    z-index: 2;
    margin: 0;
    font-family: 'Noto Serif SC', serif;
    font-size: 1.95rem;
    line-height: 1.2;
    color: #111;
    font-weight: 800;
}

.schedule-step-time {
    position: relative;
    z-index: 2;
    margin-top: 8px;
    font-size: 2rem;
    line-height: 1;
    font-weight: 500;
    color: #111;
}

.schedule-step-card p {
    position: relative;
    z-index: 2;
    max-width: 340px;
    margin: 18px auto 0;
    font-size: 16px;
    line-height: 1.9;
    color: #2e2428;
}

.schedule-step:not(:last-child)::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: -34px;
    width: 120px;
    height: 70px;
    transform: translateX(-50%);
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='120' viewBox='0 0 220 120'%3E%3Cpath d='M110 8c-8 18-8 35 4 49 16 18 42 21 48 41 4 15-8 29-22 40' fill='none' stroke='%23eb8f9e' stroke-width='5' stroke-linecap='round'/%3E%3Cpath d='M140 136l-18-9 4 19' fill='none' stroke='%23eb8f9e' stroke-width='5' stroke-linecap='round' stroke-linejoin='round' transform='translate(0,-40)'/%3E%3Ccircle cx='110' cy='57' r='4' fill='%23eb8f9e'/%3E%3C/svg%3E") no-repeat center / contain;
    opacity: 0.82;
    pointer-events: none;
}

.schedule-step.is-reverse:not(:last-child)::after {
    transform: translateX(-50%) scaleX(-1);
}

.schedule-floral {
    position: absolute;
    pointer-events: none;
    z-index: 1;
    opacity: 0.5;
}

.schedule-floral-top-left,
.schedule-floral-top-right,
.schedule-floral-bottom-left,
.schedule-floral-bottom-right {
    width: 220px;
    height: 220px;
}

.schedule-floral-top-left {
    top: -12px;
    left: -8px;
    background:
        radial-gradient(circle at 34% 34%, rgba(255, 208, 220, 0.95) 0 30px, transparent 31px),
        radial-gradient(circle at 62% 26%, rgba(220, 214, 255, 0.92) 0 24px, transparent 25px),
        radial-gradient(circle at 68% 54%, rgba(205, 226, 184, 0.86) 0 16px, transparent 17px);
}

.schedule-floral-top-right {
    top: -12px;
    right: -8px;
    background:
        radial-gradient(circle at 66% 34%, rgba(255, 208, 220, 0.95) 0 30px, transparent 31px),
        radial-gradient(circle at 38% 26%, rgba(220, 214, 255, 0.92) 0 24px, transparent 25px),
        radial-gradient(circle at 32% 54%, rgba(205, 226, 184, 0.86) 0 16px, transparent 17px);
}

.schedule-floral-bottom-left {
    bottom: -12px;
    left: -8px;
    background:
        radial-gradient(circle at 28% 70%, rgba(255, 208, 220, 0.95) 0 30px, transparent 31px),
        radial-gradient(circle at 62% 76%, rgba(220, 214, 255, 0.92) 0 24px, transparent 25px),
        radial-gradient(circle at 52% 42%, rgba(205, 226, 184, 0.86) 0 16px, transparent 17px);
}

.schedule-floral-bottom-right {
    bottom: -12px;
    right: -8px;
    background:
        radial-gradient(circle at 72% 70%, rgba(255, 208, 220, 0.95) 0 30px, transparent 31px),
        radial-gradient(circle at 38% 76%, rgba(220, 214, 255, 0.92) 0 24px, transparent 25px),
        radial-gradient(circle at 48% 42%, rgba(205, 226, 184, 0.86) 0 16px, transparent 17px);
}

/* ==========================================================================
   6. GALLERY SECTION - LEFT / RIGHT DREAMY SLIDESHOW
   ========================================================================== */

.gallery-section {
    position: relative;
    overflow: hidden;
    background:
        radial-gradient(circle at 18% 15%, rgba(255, 220, 228, 0.34), transparent 22%),
        radial-gradient(circle at 82% 18%, rgba(223, 216, 255, 0.30), transparent 24%),
        radial-gradient(circle at 50% 88%, rgba(255, 239, 213, 0.26), transparent 26%),
        linear-gradient(180deg, #fffdfa 0%, #fffaf7 46%, #fff8fb 100%);
}

.gallery-section::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at center, rgba(255,255,255,0.52), transparent 58%);
    pointer-events: none;
    z-index: 0;
}

.gallery-heading {
    position: relative;
    z-index: 3;
    max-width: 780px;
    margin-inline: auto;
    margin-bottom: 3rem;
}

.dream-gallery {
    position: relative;
    z-index: 3;
}

.dream-gallery-shell {
    display: grid;
    grid-template-columns: minmax(320px, 470px) minmax(320px, 1fr);
    gap: 30px;
    align-items: start;
}

.dream-gallery-left {
    position: sticky;
    top: 110px;
}

.dream-gallery-stage {
    position: relative;
    width: 100%;
    aspect-ratio: 1 / 1.7;
    min-height: auto;
    border-radius: 38px;
    overflow: hidden;
    background:
        linear-gradient(180deg, rgba(255,255,255,0.74), rgba(255,247,250,0.62));
    border: 1px solid rgba(232, 203, 210, 0.52);
    box-shadow:
        0 28px 70px rgba(192, 162, 176, 0.14),
        inset 0 1px 0 rgba(255,255,255,0.95);
    backdrop-filter: blur(10px);
}

.dream-gallery-stage::before {
    content: "";
    position: absolute;
    inset: 12px;
    border-radius: 28px;
    border: 1px solid rgba(238, 215, 221, 0.72);
    pointer-events: none;
    z-index: 5;
}

.dream-slide {
    position: absolute;
    inset: 0;
    opacity: 0;
    visibility: hidden;
    transform: scale(1.04);
    transition:
        opacity 0.9s ease,
        transform 1.15s ease,
        visibility 0.9s ease;
}

.dream-slide.is-active {
    opacity: 1;
    visibility: visible;
    transform: scale(1);
    z-index: 2;
}

.dream-slide-media {
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at center, rgba(255,255,255,0.08), transparent 55%),
        linear-gradient(180deg, rgba(248, 236, 240, 0.35), rgba(235, 223, 232, 0.45));
}

.dream-slide-media::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 2;
    background:
        linear-gradient(180deg, rgba(36, 24, 29, 0.05), rgba(36, 24, 29, 0.14)),
        linear-gradient(0deg, rgba(48, 34, 40, 0.48), rgba(48, 34, 40, 0.02) 42%, rgba(48, 34, 40, 0.10));
}

.dream-slide-media img {
    position: absolute;
    inset: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.dream-slide-overlay {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 3;
    padding: 30px 26px 30px;
    color: #fff;
    text-align: left;
    background: linear-gradient(
        180deg,
        transparent,
        rgba(43, 30, 36, 0.10) 18%,
        rgba(43, 30, 36, 0.78)
    );
}

.dream-slide-kicker {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    padding: 7px 14px;
    border-radius: 999px;
    background: rgba(255,255,255,0.18);
    border: 1px solid rgba(255,255,255,0.24);
    font-size: 12px;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    backdrop-filter: blur(8px);
}

.dream-slide-overlay h3 {
    margin: 14px 0 8px;
    font-family: 'Cormorant Garamond', 'Noto Serif SC', serif;
    font-size: clamp(2.3rem, 4vw, 3.8rem);
    line-height: 1;
    font-weight: 700;
    letter-spacing: 0.03em;
}

.dream-slide-overlay p {
    margin: 0;
    max-width: 360px;
    font-size: 15px;
    line-height: 1.85;
    color: rgba(255,255,255,0.92);
}

.dream-gallery-arrow {
    position: absolute;
    top: 50%;
    z-index: 6;
    transform: translateY(-50%);
    width: 52px;
    height: 52px;
    border: 0;
    border-radius: 50%;
    display: grid;
    place-items: center;
    cursor: pointer;
    background: rgba(255,255,255,0.18);
    color: #fff;
    backdrop-filter: blur(10px);
    box-shadow: 0 14px 28px rgba(0,0,0,0.12);
    transition: transform 0.3s ease, background 0.3s ease, opacity 0.3s ease;
}

.dream-gallery-arrow:hover {
    transform: translateY(-50%) scale(1.06);
    background: rgba(255,255,255,0.28);
}

.dream-gallery-arrow span {
    font-size: 2rem;
    line-height: 1;
    transform: translateY(-1px);
}

.dream-gallery-arrow.prev {
    left: 16px;
}

.dream-gallery-arrow.next {
    right: 16px;
}

.dream-gallery-right {
    display: grid;
    gap: 20px;
}

.dream-gallery-info-card {
    position: relative;
    padding: 26px 24px;
    border-radius: 30px;
    background:
        linear-gradient(180deg, rgba(255,255,255,0.82), rgba(255,247,250,0.72));
    border: 1px solid rgba(232, 203, 210, 0.48);
    box-shadow:
        0 18px 40px rgba(191, 157, 171, 0.10),
        inset 0 1px 0 rgba(255,255,255,0.95);
    overflow: hidden;
}

.dream-gallery-info-card::before {
    content: "";
    position: absolute;
    inset: 10px;
    border-radius: 22px;
    border: 1px solid rgba(238, 215, 221, 0.72);
    pointer-events: none;
}

.dream-gallery-info-card::after {
    content: "";
    position: absolute;
    top: -30px;
    right: -20px;
    width: 160px;
    height: 160px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(255, 223, 232, 0.46), transparent 70%);
    pointer-events: none;
}

.gallery-mini-tag {
    position: relative;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    padding: 7px 14px;
    border-radius: 999px;
    background: rgba(255,255,255,0.72);
    border: 1px solid rgba(229, 198, 204, 0.72);
    color: #9a7780;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.dream-gallery-info-card h3 {
    position: relative;
    z-index: 2;
    margin: 14px 0 10px;
    font-family: 'Noto Serif SC', serif;
    font-size: 1.7rem;
    line-height: 1.3;
    color: #6d545f;
}

.dream-gallery-info-card p {
    position: relative;
    z-index: 2;
    margin: 0;
    max-width: 560px;
    color: #7a6870;
    line-height: 1.9;
}

.dream-gallery-dots {
    position: relative;
    z-index: 2;
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 18px;
}

.dream-gallery-dot {
    width: 12px;
    height: 12px;
    border: 0;
    border-radius: 50%;
    cursor: pointer;
    background: rgba(212, 175, 186, 0.38);
    transition: transform 0.3s ease, background 0.3s ease, box-shadow 0.3s ease;
}

.dream-gallery-dot.is-active {
    background: linear-gradient(135deg, #e8a9bb, #cfa9cf);
    transform: scale(1.18);
    box-shadow: 0 0 0 6px rgba(232, 169, 187, 0.12);
}

.dream-gallery-thumbs {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.dream-gallery-thumb {
    position: relative;
    display: grid;
    grid-template-columns: 88px minmax(0, 1fr);
    align-items: center;
    gap: 12px;
    border: 0;
    border-radius: 24px;
    padding: 10px;
    background:
        linear-gradient(180deg, rgba(255,255,255,0.78), rgba(255,247,250,0.68));
    border: 1px solid rgba(232, 203, 210, 0.42);
    box-shadow: 0 14px 28px rgba(191, 157, 171, 0.08);
    cursor: pointer;
    text-align: left;
    transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
    overflow: hidden;
}

.dream-gallery-thumb:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 34px rgba(191, 157, 171, 0.14);
}

.dream-gallery-thumb.is-active {
    border-color: rgba(222, 160, 180, 0.82);
    box-shadow: 0 20px 34px rgba(222, 160, 180, 0.16);
}

.dream-gallery-thumb-media {
    width: 88px;
    border-radius: 18px;
    overflow: hidden;
    flex-shrink: 0;
}

.dream-gallery-thumb img {
    width: 100%;
    aspect-ratio: 1 / 2;
    object-fit: cover;
    object-position: center;
    display: block;
}

.dream-gallery-thumb-copy {
    min-width: 0;
}

.dream-gallery-thumb-copy strong {
    display: block;
    margin-bottom: 4px;
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.2rem;
    line-height: 1;
    color: #765862;
}

.dream-gallery-thumb-copy span {
    display: block;
    font-size: 12px;
    color: #846d75;
    line-height: 1.55;
}

.gallery-orb,
.gallery-floral {
    position: absolute;
    pointer-events: none;
    z-index: 1;
}

.gallery-orb {
    border-radius: 50%;
    filter: blur(24px);
}

.gallery-orb-1 {
    width: 340px;
    height: 340px;
    left: -100px;
    top: 90px;
    background: radial-gradient(circle, rgba(255, 220, 230, 0.54), transparent 70%);
}

.gallery-orb-2 {
    width: 300px;
    height: 300px;
    right: -90px;
    bottom: 60px;
    background: radial-gradient(circle, rgba(225, 216, 255, 0.48), transparent 70%);
}

.gallery-floral {
    width: 220px;
    height: 220px;
    opacity: 0.28;
}

.gallery-floral-left {
    top: 20px;
    left: -20px;
    background:
        radial-gradient(circle at 32% 28%, rgba(255, 211, 223, 0.88) 0 16px, transparent 17px),
        radial-gradient(circle at 54% 18%, rgba(236, 214, 255, 0.78) 0 13px, transparent 14px),
        radial-gradient(circle at 47% 43%, rgba(255, 241, 203, 0.72) 0 11px, transparent 12px),
        linear-gradient(130deg, transparent 44%, rgba(146, 181, 146, 0.55) 45%, transparent 47%);
}

.gallery-floral-right {
    right: -18px;
    bottom: 12px;
    background:
        radial-gradient(circle at 70% 30%, rgba(255, 218, 227, 0.88) 0 16px, transparent 17px),
        radial-gradient(circle at 52% 50%, rgba(220, 213, 255, 0.78) 0 13px, transparent 14px),
        radial-gradient(circle at 35% 68%, rgba(255, 241, 203, 0.72) 0 11px, transparent 12px),
        linear-gradient(220deg, transparent 44%, rgba(146, 181, 146, 0.55) 45%, transparent 47%);
}

/* ==========================================================================
   7. RSVP SECTION
   ========================================================================== */

.rsvp-grid {
    display: grid;
    grid-template-columns: 0.95fr 1.05fr;
    gap: 2rem;
    align-items: start;
}

.form-card {
    position: relative;
    overflow: hidden;
    border-radius: var(--radius-xl);
    padding: 1.6rem;
    background: linear-gradient(180deg, rgba(255,255,255,0.82), rgba(255,248,250,0.72));
    border: 1px solid rgba(255,255,255,0.58);
    box-shadow: var(--shadow);
    backdrop-filter: blur(18px);
    min-height: 445px;
}

.form-card::before {
    content: "";
    position: absolute;
    inset: 1px;
    border-radius: inherit;
    border: 1px solid rgba(255,255,255,0.35);
    pointer-events: none;
}

.dream-form {
    display: grid;
    gap: 1rem;
}

.form-row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.dream-form label {
    display: grid;
    gap: 0.55rem;
}

.dream-form span {
    font-size: 0.95rem;
    color: var(--text-soft);
}

.dream-form input,
.dream-form textarea,
.dream-form select {
    width: 100%;
    border: 1px solid rgba(194, 170, 176, 0.35);
    background: rgba(255, 255, 255, 0.7);
    color: var(--text);
    border-radius: 18px;
    padding: 0.95rem 1rem;
    outline: none;
    transition: border-color var(--transition), box-shadow var(--transition), transform var(--transition), background var(--transition);
}

.dream-form textarea {
    resize: vertical;
    min-height: 140px;
}

.dream-form input:focus,
.dream-form textarea:focus,
.dream-form select:focus {
    border-color: rgba(205, 173, 182, 0.75);
    box-shadow: 0 0 0 4px rgba(244, 207, 217, 0.18), 0 12px 24px rgba(211, 182, 190, 0.12);
    transform: translateY(-1px);
    background: rgba(255,255,255,0.88);
}

.submit-button {
    width: fit-content;
    border: 0;
    cursor: pointer;
}

.form-alert {
    margin-bottom: 1rem;
    padding: 0.95rem 1rem;
    border-radius: 18px;
    font-size: 0.95rem;
}

.form-alert.success {
    background: rgba(214, 229, 196, 0.55);
    color: #5a664b;
    border: 1px solid rgba(158, 180, 137, 0.35);
}

.form-alert.error {
    background: rgba(244, 207, 217, 0.5);
    color: #865a67;
    border: 1px solid rgba(211, 156, 172, 0.35);
}

.honeypot {
    position: absolute;
    left: -9999px;
    opacity: 0;
    pointer-events: none;
}

/* ==========================================================================
   8. BLESSINGS SECTION
   ========================================================================== */

.blessing-top {
    display: grid;
    grid-template-columns: 1fr 420px;
    gap: 2rem;
    align-items: start;
    margin-bottom: 2rem;
}

.blessing-form-card {
    align-self: stretch;
}

.blessing-list {
    column-count: 3;
    column-gap: 1rem;
}

.blessing-card {
    position: relative;
    overflow: hidden;
    display: inline-block;
    width: 100%;
    border-radius: 26px;
    padding: 1.25rem;
    margin: 0 0 1rem;
    break-inside: avoid;
    background: linear-gradient(180deg, rgba(255,255,255,0.82), rgba(255,248,250,0.72));
    border: 1px solid rgba(255,255,255,0.58);
    box-shadow: var(--shadow);
}

.blessing-card::before {
    content: "";
    position: absolute;
    inset: 1px;
    border-radius: inherit;
    border: 1px solid rgba(255,255,255,0.35);
    pointer-events: none;
}

.blessing-card.empty-state {
    column-span: all;
    text-align: center;
}

.blessing-header {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: center;
    margin-bottom: 0.8rem;
}

.blessing-header span {
    font-size: 0.82rem;
    color: var(--text-soft);
}

/* =========================================
   FINAL SECTION - ROMANTIC THANK YOU CARD
========================================= */

.final-section {
    position: relative;
    overflow: hidden;
    padding: 136px 0 124px;
    background:
        radial-gradient(circle at 18% 18%, rgba(255, 223, 232, 0.34), transparent 22%),
        radial-gradient(circle at 84% 20%, rgba(223, 216, 255, 0.28), transparent 24%),
        radial-gradient(circle at 50% 90%, rgba(255, 239, 213, 0.22), transparent 28%),
        linear-gradient(180deg, #fffdfa 0%, #fffaf7 48%, #fff8fb 100%);
}

.final-section::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(180deg, rgba(255,255,255,0.22), transparent 26%, transparent 74%, rgba(255,255,255,0.16));
    pointer-events: none;
    z-index: 0;
}

.final-container {
    position: relative;
    z-index: 3;
    display: grid;
    grid-template-columns: minmax(220px, 300px) minmax(0, 760px) minmax(220px, 300px);
    align-items: end;
    gap: 24px;
}

.final-card {
    position: relative;
    z-index: 3;
    text-align: center;
    padding: 58px 36px 40px;
    border-radius: 40px;
    background:
        linear-gradient(180deg, rgba(255,255,255,0.84), rgba(255,248,251,0.74));
    border: 1px solid rgba(226, 198, 206, 0.56);
    box-shadow:
        0 28px 70px rgba(188, 154, 169, 0.14),
        inset 0 1px 0 rgba(255,255,255,0.96);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    overflow: hidden;
}

.final-card::before {
    content: "";
    position: absolute;
    inset: 12px;
    border-radius: 28px;
    border: 1px solid rgba(236, 212, 218, 0.76);
    pointer-events: none;
}

.final-card::after {
    content: "";
    position: absolute;
    top: -36px;
    right: -16px;
    width: 180px;
    height: 180px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(255, 223, 232, 0.42), transparent 72%);
    pointer-events: none;
}

.final-card-top-ornament {
    position: absolute;
    top: 20px;
    left: 50%;
    transform: translateX(-50%);
    width: min(220px, 44%);
    height: 18px;
    pointer-events: none;
}

.final-card-top-ornament::before,
.final-card-top-ornament::after {
    content: "";
    position: absolute;
    top: 50%;
    width: 42%;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(221, 177, 191, 0.95));
}

.final-card-top-ornament::before {
    left: 0;
}

.final-card-top-ornament::after {
    right: 0;
    transform: scaleX(-1);
}

.final-card-top-ornament {
    background:
        radial-gradient(circle at center, rgba(233, 157, 177, 0.95) 0 4px, transparent 5px);
    background-repeat: no-repeat;
    background-position: center;
}

.final-inner {
    max-width: none;
    margin: 0;
}

.final-inner .mini-label {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 36px;
    padding: 8px 16px;
    border-radius: 999px;
    background: rgba(255,255,255,0.72);
    border: 1px solid rgba(229, 198, 204, 0.72);
    color: #9a7780;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    margin-bottom: 16px;
}

.final-inner h2 {
    font-family: 'Cormorant Garamond', 'Noto Serif SC', serif;
    font-size: clamp(2.9rem, 3vw, 5rem);
    line-height: 1.02;
    margin: 0 0 18px;
    color: #6b505b;
}

.final-copy {
    max-width: 580px;
    margin: 0 auto;
    font-size: 16px;
    line-height: 1.95;
    color: #7a6870;
}

.final-signature-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    margin: 1.35rem 0 0.55rem;
}

.final-signature-line {
    width: 72px;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(220, 177, 191, 0.95), transparent);
    flex-shrink: 0;
}

.final-signature {
    font-family: 'Cormorant Garamond', serif;
    font-size: clamp(1rem, 2.3vw, 2.3rem);
    line-height: 1;
    color: #6b4f5b;
    text-shadow: 0 6px 20px rgba(255,255,255,0.5);
}

.final-meta {
    margin: 0;
    color: #9b818a;
    font-size: 14px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.final-action-row {
    display: flex;
    justify-content: center;
    margin-top: 28px;
}

.final-action-row .dream-button {
    min-width: 176px;
}

/* characters */

.final-character {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: flex-end;
    min-height: 320px;
    z-index: 2;
    pointer-events: none;
}

.final-character-left {
    transform: translateX(-6%);
}

.final-character-right {
    transform: translateX(6%);
}

.final-character img {
    position: relative;
    z-index: 2;
    width: min(100%, 290px);
    max-height: 370px;
    object-fit: contain;
    filter:
        drop-shadow(0 22px 34px rgba(165, 133, 147, 0.20))
        drop-shadow(0 8px 16px rgba(255,255,255,0.34));
    animation: finalFloat 5.2s ease-in-out infinite;
}

.final-character-left img {
    animation-delay: 0s;
}

.final-character-right img {
    animation-delay: 1.2s;
}

.character-aura {
    position: absolute;
    bottom: 28px;
    width: 220px;
    height: 220px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(255, 228, 236, 0.78), rgba(225, 217, 255, 0.36), transparent 72%);
    filter: blur(18px);
    animation: auraPulseFinal 4.8s ease-in-out infinite;
    z-index: 0;
}

.character-ring {
    position: absolute;
    bottom: 48px;
    width: 250px;
    height: 250px;
    border-radius: 50%;
    border: 1px dashed rgba(229, 195, 205, 0.52);
    opacity: 0.82;
    animation: ringSpinFinal 18s linear infinite;
    z-index: 0;
}

/* background decor */

.final-glow {
    position: absolute;
    inset: 10% 12%;
    border-radius: 50px;
    background: radial-gradient(circle at center, rgba(255,255,255,0.76), transparent 72%);
    filter: blur(25px);
    z-index: 0;
    pointer-events: none;
}

.final-bg-decor {
    position: absolute;
    pointer-events: none;
    z-index: 1;
}

.final-orb-left,
.final-orb-right {
    border-radius: 50%;
    filter: blur(24px);
}

.final-orb-left {
    width: 340px;
    height: 340px;
    left: -100px;
    top: 90px;
    background: radial-gradient(circle, rgba(255, 220, 230, 0.48), transparent 72%);
}

.final-orb-right {
    width: 300px;
    height: 300px;
    right: -90px;
    bottom: 70px;
    background: radial-gradient(circle, rgba(225, 216, 255, 0.42), transparent 72%);
}

.final-floral-left,
.final-floral-right {
    width: 220px;
    height: 220px;
    opacity: 0.28;
}

.final-floral-left {
    left: -16px;
    bottom: 20px;
    background:
        radial-gradient(circle at 32% 28%, rgba(255, 211, 223, 0.88) 0 16px, transparent 17px),
        radial-gradient(circle at 54% 18%, rgba(236, 214, 255, 0.78) 0 13px, transparent 14px),
        radial-gradient(circle at 47% 43%, rgba(255, 241, 203, 0.72) 0 11px, transparent 12px),
        linear-gradient(130deg, transparent 44%, rgba(146, 181, 146, 0.55) 45%, transparent 47%);
}

.final-floral-right {
    right: -18px;
    top: 30px;
    background:
        radial-gradient(circle at 70% 30%, rgba(255, 218, 227, 0.88) 0 16px, transparent 17px),
        radial-gradient(circle at 52% 50%, rgba(220, 213, 255, 0.78) 0 13px, transparent 14px),
        radial-gradient(circle at 35% 68%, rgba(255, 241, 203, 0.72) 0 11px, transparent 12px),
        linear-gradient(220deg, transparent 44%, rgba(146, 181, 146, 0.55) 45%, transparent 47%);
}

/* petals */

.final-petals {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 2;
    overflow: hidden;
}

.final-petal {
    position: absolute;
    top: -60px;
    width: 16px;
    height: 24px;
    border-radius: 60% 40% 65% 35%;
    background: linear-gradient(180deg, #ffdce6 0%, #f4bdd0 100%);
    opacity: 0.62;
    box-shadow: 0 4px 10px rgba(220, 183, 193, 0.18);
    animation: finalPetalFall linear infinite;
}

.final-petal::after {
    content: "";
    position: absolute;
    inset: 2px 3px auto auto;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: rgba(255,255,255,0.35);
}

.final-petal-1 { left: 12%; animation-duration: 14s; animation-delay: 0s; }
.final-petal-2 { left: 26%; animation-duration: 17s; animation-delay: 2.2s; }
.final-petal-3 { left: 46%; animation-duration: 15s; animation-delay: 1.2s; }
.final-petal-4 { left: 63%; animation-duration: 18s; animation-delay: 3s; }
.final-petal-5 { left: 78%; animation-duration: 16s; animation-delay: 1.8s; }
.final-petal-6 { left: 90%; animation-duration: 19s; animation-delay: 2.8s; }

/* animation */

@keyframes finalFloat {
    0%, 100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-12px);
    }
}

@keyframes auraPulseFinal {
    0%, 100% {
        transform: scale(0.96);
        opacity: 0.56;
    }
    50% {
        transform: scale(1.05);
        opacity: 0.86;
    }
}

@keyframes ringSpinFinal {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

@keyframes finalPetalFall {
    0% {
        transform: translate3d(0, -40px, 0) rotate(0deg);
        opacity: 0;
    }
    10% {
        opacity: 0.65;
    }
    100% {
        transform: translate3d(36px, 108vh, 0) rotate(280deg);
        opacity: 0;
    }
}

/* =========================================
   TABLET
========================================= */

@media (max-width: 1080px) {
    .final-container {
        grid-template-columns: minmax(180px, 220px) minmax(0, 1fr) minmax(180px, 220px);
        gap: 18px;
    }

    .final-character img {
        width: min(100%, 220px);
        max-height: 300px;
    }

    .character-ring {
        width: 200px;
        height: 200px;
    }

    .character-aura {
        width: 180px;
        height: 180px;
    }
}

/* =========================================
   MOBILE IMPORTANT
========================================= */

@media (max-width: 860px) {
    .final-section {
        padding: 96px 0 88px;
    }

    .final-container {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 16px 12px;
        align-items: start;
    }

    .final-card {
        grid-column: 1 / -1;
        order: 1;
        padding: 38px 20px 26px;
        border-radius: 28px;
    }

    .final-card::before {
        inset: 8px;
        border-radius: 20px;
    }

    .final-inner h2 {
        font-size: clamp(2.2rem, 10vw, 3.6rem);
    }

    .final-copy {
        font-size: 14px;
        line-height: 1.85;
    }

    .final-signature-wrap {
        gap: 10px;
        margin-top: 1rem;
    }

    .final-signature-line {
        width: 40px;
    }

    .final-signature {
        font-size: clamp(2.6rem, 11vw, 4rem);
    }

    .final-meta {
        font-size: 12px;
        letter-spacing: 0.10em;
        line-height: 1.7;
    }

    .final-character {
        min-height: auto;
        justify-content: center;
    }

    .final-character-left {
        order: 2;
        transform: none;
    }

    .final-character-right {
        order: 3;
        transform: none;
    }

    .final-character img {
        width: min(100%, 180px);
        max-height: 220px;
    }

    .character-ring {
        width: 150px;
        height: 150px;
        bottom: 18px;
    }

    .character-aura {
        width: 130px;
        height: 130px;
        bottom: 8px;
    }

    .final-floral-left,
    .final-floral-right {
        width: 120px;
        height: 120px;
        opacity: 0.18;
    }

    .final-orb-left,
    .final-orb-right {
        width: 180px;
        height: 180px;
    }
}

@media (max-width: 520px) {
    .final-section {
        padding: 88px 0 82px;
    }

    .final-container {
        gap: 14px 8px;
    }

    .final-card {
        padding: 32px 16px 22px;
    }

    .final-inner .mini-label {
        min-height: 32px;
        padding: 6px 12px;
        font-size: 11px;
    }

    .final-inner h2 {
        font-size: clamp(2rem, 10vw, 3rem);
        margin-bottom: 14px;
    }

    .final-copy {
        font-size: 13px;
        line-height: 1.8;
    }

    .final-signature {
        margin-top: 0;
        margin-bottom: 0;
    }

    .final-action-row {
        margin-top: 20px;
    }

    .final-action-row .dream-button {
        width: 100%;
        max-width: 240px;
    }

    .final-character img {
        width: min(100%, 140px);
        max-height: 170px;
    }

    .character-ring {
        width: 120px;
        height: 120px;
        bottom: 12px;
    }

    .character-aura {
        width: 100px;
        height: 100px;
        bottom: 4px;
    }
}

/* =========================================
   TABLET
========================================= */

@media (max-width: 1080px) {
    .final-container {
        grid-template-columns: minmax(180px, 220px) minmax(0, 1fr) minmax(180px, 220px);
        gap: 18px;
    }

    .final-character img {
        width: min(100%, 220px);
        max-height: 300px;
    }

    .character-ring {
        width: 200px;
        height: 200px;
    }

    .character-aura {
        width: 180px;
        height: 180px;
    }
}

/* =========================================
   MOBILE IMPORTANT
========================================= */

@media (max-width: 860px) {
    .final-section {
        padding: 96px 0 88px;
    }

    .final-container {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 16px 12px;
        align-items: start;
    }

    .final-card {
        grid-column: 1 / -1;
        order: 1;
        padding: 38px 20px 26px;
        border-radius: 28px;
    }

    .final-card::before {
        inset: 8px;
        border-radius: 20px;
    }

    .final-inner h2 {
        font-size: clamp(2.2rem, 3vw, 3.6rem);
    }

    .final-copy {
        font-size: 14px;
        line-height: 1.85;
    }

    .final-signature {
        font-size: clamp(2.6rem, 4vw, 4rem);
    }

    .final-meta {
        font-size: 12px;
        letter-spacing: 0.10em;
        line-height: 1.7;
    }

    .final-character {
        min-height: auto;
        justify-content: center;
    }

    .final-character-left {
        order: 2;
        transform: none;
    }

    .final-character-right {
        order: 3;
        transform: none;
    }

    .final-character img {
        width: min(100%, 180px);
        max-height: 220px;
    }

    .character-ring {
        width: 150px;
        height: 150px;
        bottom: 18px;
    }

    .character-aura {
        width: 130px;
        height: 130px;
        bottom: 8px;
    }

    .final-floral-left,
    .final-floral-right {
        width: 120px;
        height: 120px;
        opacity: 0.18;
    }

    .final-orb-left,
    .final-orb-right {
        width: 180px;
        height: 180px;
    }
}

@media (max-width: 520px) {
    .final-section {
        padding: 88px 0 82px;
    }

    .final-container {
        gap: 14px 8px;
    }

    .final-card {
        padding: 32px 16px 22px;
    }

    .final-inner .mini-label {
        min-height: 32px;
        padding: 6px 12px;
        font-size: 11px;
    }

    .final-inner h2 {
        font-size: clamp(2rem, 10vw, 3rem);
        margin-bottom: 14px;
    }

    .final-copy {
        font-size: 13px;
        line-height: 1.8;
    }

    .final-signature {
        margin-top: 1rem;
        margin-bottom: 0.45rem;
    }

    .final-action-row {
        margin-top: 20px;
    }

    .final-action-row .dream-button {
        width: 100%;
        max-width: 240px;
    }

    .final-character img {
        width: min(100%, 140px);
        max-height: 170px;
    }

    .character-ring {
        width: 120px;
        height: 120px;
        bottom: 12px;
    }

    .character-aura {
        width: 100px;
        height: 100px;
        bottom: 4px;
    }
}

/* ==========================================================================
   10. SHARED DECOR / ANIMATION
   ========================================================================== */

.story-orb,
.story-flower,
.gallery-orb,
.gallery-floral {
    position: absolute;
    pointer-events: none;
    z-index: 1;
}

.story-orb,
.gallery-orb {
    border-radius: 50%;
    filter: blur(24px);
}

.story-orb-1,
.gallery-orb-1 {
    width: 340px;
    height: 340px;
    left: -100px;
    top: 90px;
    background: radial-gradient(circle, rgba(255, 220, 230, 0.54), transparent 70%);
}

.story-orb-2,
.gallery-orb-2 {
    width: 300px;
    height: 300px;
    right: -90px;
    bottom: 60px;
    background: radial-gradient(circle, rgba(225, 216, 255, 0.48), transparent 70%);
}

.story-flower,
.gallery-floral {
    width: 220px;
    height: 220px;
    opacity: 0.28;
}

.story-flower-left,
.gallery-floral-left {
    top: 20px;
    left: -20px;
    background:
        radial-gradient(circle at 32% 28%, rgba(255, 211, 223, 0.88) 0 16px, transparent 17px),
        radial-gradient(circle at 54% 18%, rgba(236, 214, 255, 0.78) 0 13px, transparent 14px),
        radial-gradient(circle at 47% 43%, rgba(255, 241, 203, 0.72) 0 11px, transparent 12px),
        linear-gradient(130deg, transparent 44%, rgba(146, 181, 146, 0.55) 45%, transparent 47%);
}

.story-flower-right,
.gallery-floral-right {
    right: -18px;
    bottom: 12px;
    background:
        radial-gradient(circle at 70% 30%, rgba(255, 218, 227, 0.88) 0 16px, transparent 17px),
        radial-gradient(circle at 52% 50%, rgba(220, 213, 255, 0.78) 0 13px, transparent 14px),
        radial-gradient(circle at 35% 68%, rgba(255, 241, 203, 0.72) 0 11px, transparent 12px),
        linear-gradient(220deg, transparent 44%, rgba(146, 181, 146, 0.55) 45%, transparent 47%);
}

@keyframes chapterFloat {
    0%, 100% { transform: translateY(0) rotate(-1deg); }
    50% { transform: translateY(-15px) rotate(1deg); }
}

@keyframes chapterGlow {
    0%, 100% {
        transform: scale(0.95);
        opacity: 0.6;
    }
    50% {
        transform: scale(1.05);
        opacity: 0.9;
    }
}

@keyframes scheduleFloat {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-10px); }
}

@keyframes scheduleGlow {
    0%, 100% {
        transform: scale(0.95);
        opacity: 0.56;
    }
    50% {
        transform: scale(1.06);
        opacity: 0.86;
    }
}

/* ==========================================================================
   11. RESPONSIVE
   ========================================================================== */

@media (max-width: 1080px) {
    .dream-gallery-shell,
    .blessing-top {
        grid-template-columns: 1fr;
    }

    .dream-gallery-left {
        position: static;
    }

    .dream-gallery-stage {
        width: min(100%, 420px);
        margin: 0 auto;
    }

    .blessing-list {
        column-count: 2;
    }
}

@media (max-width: 980px) {
    .chapter-journey::before {
        display: none;
    }

    .chapter-row,
    .chapter-row.is-reverse {
        grid-template-columns: 1fr;
        gap: 20px;
        min-height: auto;
    }

    .chapter-row::before {
        display: none;
    }

    .chapter-row.is-reverse .chapter-figure,
    .chapter-row.is-reverse .chapter-panel {
        order: initial;
    }

    .chapter-figure {
        min-height: auto;
    }

    .chapter-figure-ring {
        width: 280px;
        height: 280px;
    }

    .chapter-figure-glow {
        width: 240px;
        height: 240px;
    }

    .chapter-figure-frame {
        max-width: 280px;
        transform: none;
    }

    .chapter-row.is-reverse .chapter-figure-frame {
        transform: none;
    }

    .chapter-panel {
        padding: 24px 20px;
    }

    .details-grid,
    .detail-note {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .dream-gallery-thumbs {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 900px) {
    .schedule-board {
        padding: 28px 18px 16px;
        border-radius: 28px;
    }

    .schedule-board::before {
        inset: 8px;
        border-radius: 20px;
    }

    .schedule-heading {
        margin-bottom: 2.2rem;
    }

    .schedule-step,
    .schedule-step.is-reverse {
        grid-template-columns: 120px minmax(0, 1fr);
        gap: 14px;
    }

    .schedule-step.is-reverse .schedule-step-art {
        order: 2;
    }

    .schedule-step.is-reverse .schedule-step-content {
        order: 1;
    }

    .schedule-art-frame {
        max-width: 100px;
    }

    .schedule-art-frame img {
        max-height: 120px;
    }

    .schedule-step-card {
        padding: 18px 16px 20px;
        border-radius: 22px;
    }

    .schedule-step-card::before {
        inset: 8px;
        border-radius: 16px;
    }

    .schedule-step-card h3 {
        font-size: 1.7rem;
    }

    .schedule-step-time {
        font-size: 1.8rem;
    }

    .schedule-step-card p {
        font-size: 14px;
        line-height: 1.8;
        margin-top: 14px;
    }
}

@media (max-width: 860px) {
    .rsvp-grid,
    .blessing-top {
        grid-template-columns: 1fr;
    }

    .details-grid,
    .detail-note,
    .form-row {
        grid-template-columns: 1fr;
    }

    .dream-gallery-stage {
        position: static;
        width: min(100%, 380px);
        max-width: 100%;
        margin: 0 auto;
        border-radius: 28px;
    }

    .dream-gallery-stage::before {
        inset: 8px;
        border-radius: 20px;
    }

    .dream-gallery-right {
        gap: 16px;
    }

    .dream-gallery-info-card {
        border-radius: 24px;
        padding: 20px 18px;
    }

    .dream-gallery-info-card::before {
        inset: 8px;
        border-radius: 16px;
    }

    .dream-gallery-dots {
        justify-content: center;
    }

    .dream-gallery-thumbs {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .dream-gallery-thumb {
        grid-template-columns: 1fr;
        text-align: center;
    }

    .dream-gallery-thumb-media {
        width: min(100%, 110px);
        margin: 0 auto;
    }
}

@media (max-width: 640px) {
    .story-section,
    .schedule-section,
    .gallery-section {
        padding-top: 92px;
        padding-bottom: 92px;
    }

    .section-heading {
        margin-bottom: 2rem;
    }

    .chapter-journey {
        gap: 22px;
    }

    .chapter-figure-frame {
        max-width: 240px;
        border-radius: 26px;
        padding: 12px;
    }

    .chapter-figure-frame::before {
        inset: 8px;
        border-radius: 18px;
    }

    .chapter-figure-media {
        border-radius: 18px;
    }

    .chapter-figure-ring {
        width: 220px;
        height: 220px;
    }

    .chapter-figure-glow {
        width: 200px;
        height: 200px;
    }

    .chapter-panel {
        border-radius: 24px;
        padding: 20px 16px;
    }

    .chapter-panel::before {
        inset: 8px;
        border-radius: 18px;
    }

    .chapter-panel-top {
        flex-wrap: wrap;
        margin-bottom: 14px;
    }

    .chapter-panel-body {
        padding-left: 0;
    }

    .chapter-no {
        position: static;
        display: inline-block;
        margin-bottom: 8px;
        font-size: 2.2rem;
    }

    .chapter-panel h3 {
        font-size: 1.34rem;
        margin-bottom: 10px;
    }

    .chapter-panel p {
        font-size: 14px;
        line-height: 1.85;
    }

    .schedule-heading {
        margin-bottom: 1.8rem;
    }

    .schedule-heading h2 {
        font-size: clamp(2rem, 10vw, 3rem);
        margin-bottom: 10px;
    }

    .schedule-flow {
        gap: 22px;
    }

    .schedule-step,
    .schedule-step.is-reverse {
        grid-template-columns: 84px minmax(0, 1fr);
        gap: 12px;
        align-items: center;
    }

    .schedule-step.is-reverse {
        grid-template-columns: minmax(0, 1fr) 84px;
    }

    .schedule-step-art {
        min-height: auto;
    }

    .schedule-art-glow {
        width: 84px;
        height: 84px;
        filter: blur(14px);
    }

    .schedule-art-frame {
        max-width: 135px;
    }

    .schedule-art-frame img {
        max-height: 94px;
    }

    .schedule-step-card {
        padding: 18px 14px 18px;
        border-radius: 22px;
    }

    .schedule-step-card::before {
        inset: 8px;
        border-radius: 16px;
    }

    .schedule-step-card h3 {
        font-size: 1.2rem;
        line-height: 1.3;
    }

    .schedule-step-time {
        font-size: 1.1rem;
        margin-top: 6px;
    }

    .schedule-step-card p {
        margin-top: 10px;
        font-size: 13px;
        line-height: 1.75;
    }

    .schedule-step:not(:last-child)::after {
        width: 70px;
        height: 46px;
        bottom: -16px;
        opacity: 0.72;
    }

    .dream-gallery-stage {
        width: min(100%, 300px);
        aspect-ratio: 1 / 1.8;
    }

    .dream-slide-overlay {
        padding: 18px 16px 20px;
    }

    .dream-slide-overlay h3 {
        font-size: 2rem;
    }

    .dream-slide-overlay p {
        font-size: 14px;
        line-height: 1.75;
    }

    .dream-gallery-arrow {
        width: 42px;
        height: 42px;
    }

    .dream-gallery-arrow.prev {
        left: 12px;
    }

    .dream-gallery-arrow.next {
        right: 12px;
    }

    .dream-gallery-thumbs {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .dream-gallery-thumb {
        border-radius: 18px;
        padding: 8px;
    }

    .dream-gallery-thumb-media {
        width: 88px;
    }

    .blessing-list {
        column-count: 1;
    }

    .story-flower,
    .gallery-floral,
    .schedule-floral-top-left,
    .schedule-floral-top-right,
    .schedule-floral-bottom-left,
    .schedule-floral-bottom-right {
        width: 120px;
        height: 120px;
        opacity: 0.18;
    }
}

@media (max-width: 480px) {
    .form-row {
        grid-template-columns: 1fr;
    }
}

/* ======================================================
   BLESSING LIVE FLOATING WALL
====================================================== */

.blessing-screen-container {
    margin-top: 2.5rem;
}

.blessing-live-screen {
    position: relative;
    min-height: 430px;
    overflow: hidden;
    border-radius: 38px;
    border: 1px solid rgba(226, 198, 206, 0.64);
    background:
        radial-gradient(circle at 16% 18%, rgba(255, 221, 232, 0.42), transparent 30%),
        radial-gradient(circle at 84% 22%, rgba(238, 226, 255, 0.36), transparent 34%),
        linear-gradient(135deg, rgba(255,255,255,0.62), rgba(255,247,250,0.82));
    box-shadow:
        0 28px 80px rgba(143, 105, 119, 0.14),
        inset 0 1px 0 rgba(255,255,255,0.82);
}

.blessing-screen-glow {
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        linear-gradient(90deg, rgba(255,248,251,0.92), transparent 16%, transparent 84%, rgba(255,248,251,0.92)),
        linear-gradient(180deg, rgba(255,255,255,0.72), transparent 30%, transparent 70%, rgba(255,255,255,0.62));
    z-index: 3;
}

.blessing-screen-header {
    position: absolute;
    top: 24px;
    left: 28px;
    z-index: 5;
    padding: 12px 18px;
    border-radius: 999px;
    background: rgba(255,255,255,0.72);
    border: 1px solid rgba(226, 198, 206, 0.55);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    box-shadow: 0 12px 35px rgba(143, 105, 119, 0.12);
}

.blessing-screen-header p {
    margin: 0;
    color: #65454f;
    font-size: 0.82rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.blessing-screen-header span {
    display: block;
    margin-top: 2px;
    color: #9a7b84;
    font-size: 0.78rem;
}

.blessing-marquee-layer {
    position: absolute;
    inset: 0;
    z-index: 2;
}

.blessing-floating-card {
    position: absolute;
    left: 100%;
    width: min(360px, 72vw);
    padding: 17px 20px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, rgba(255,255,255,0.9), rgba(255,248,251,0.78));
    border: 1px solid rgba(226, 198, 206, 0.62);
    box-shadow:
        0 18px 45px rgba(132, 91, 108, 0.12),
        inset 0 1px 0 rgba(255,255,255,0.9);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    animation: blessingFloatAcross var(--float-duration, 26s) linear infinite;
    animation-delay: var(--float-delay, 0s);
    will-change: transform;
}

.blessing-floating-card:hover {
    animation-play-state: paused;
    transform: translateX(-60vw) scale(1.02);
}

.blessing-floating-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 7px;
}

.blessing-floating-top strong {
    color: #60404a;
    font-size: 1rem;
    letter-spacing: 0.04em;
}

.blessing-floating-top span {
    color: #be8294;
    font-size: 1rem;
}

.blessing-floating-card p {
    margin: 0;
    color: #755d66;
    font-size: 0.92rem;
    line-height: 1.7;
}

.blessing-lane-1 {
    top: 92px;
}

.blessing-lane-2 {
    top: 155px;
}

.blessing-lane-3 {
    top: 218px;
}

.blessing-lane-4 {
    top: 281px;
}

.blessing-lane-5 {
    top: 344px;
}

.blessing-empty-floating {
    position: absolute;
    inset: 0;
    z-index: 4;
    display: grid;
    place-items: center;
    text-align: center;
    padding: 2rem;
}

.blessing-empty-floating span {
    width: 70px;
    height: 70px;
    display: grid;
    place-items: center;
    margin: 0 auto 1rem;
    border-radius: 50%;
    color: #b77b8d;
    background:
        radial-gradient(circle, #ffffff 0 44%, #ffe2eb 45% 100%);
    border: 1px solid rgba(216, 176, 188, 0.55);
    box-shadow: 0 16px 35px rgba(188, 139, 156, 0.18);
    font-size: 1.6rem;
}

.blessing-empty-floating h3 {
    margin: 0;
    color: #60404a;
    font-size: 1.45rem;
}

.blessing-empty-floating p {
    margin: 0.65rem auto 0;
    max-width: 36ch;
    color: #806770;
    line-height: 1.7;
}

@keyframes blessingFloatAcross {
    from {
        transform: translateX(0);
    }

    to {
        transform: translateX(calc(-100vw - 520px));
    }
}

@media (max-width: 768px) {
    .blessing-live-screen {
        min-height: 500px;
        border-radius: 30px;
    }

    .blessing-screen-header {
        top: 18px;
        left: 18px;
        right: 18px;
        border-radius: 22px;
    }

    .blessing-floating-card {
        width: min(300px, 78vw);
        padding: 15px 17px;
    }

    .blessing-lane-1 {
        top: 110px;
    }

    .blessing-lane-2 {
        top: 180px;
    }

    .blessing-lane-3 {
        top: 250px;
    }

    .blessing-lane-4 {
        top: 320px;
    }

    .blessing-lane-5 {
        top: 390px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .blessing-floating-card {
        animation: none;
        position: relative;
        left: auto;
        top: auto;
        margin: 1rem;
    }

    .blessing-marquee-layer {
        position: relative;
        padding-top: 5rem;
    }
}

.blessing-inline-notice {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-bottom: 16px;
    padding: 13px 15px;
    border-radius: 18px;
    background: rgba(255, 248, 251, 0.82);
    border: 1px solid rgba(226, 198, 206, 0.64);
    color: #72555f;
}

.blessing-inline-notice span {
    width: 26px;
    height: 26px;
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    border-radius: 50%;
    color: #a96e81;
    background: #fff;
    font-weight: 700;
}

.blessing-inline-notice p {
    margin: 0;
    line-height: 1.6;
    font-size: 0.92rem;
}

.blessing-inline-notice.is-error {
    background: rgba(255, 245, 235, 0.86);
}