:root {
    --black: #090806;
    --black-soft: #15120d;
    --ivory: #fffaf0;
    --cream: #f8edda;
    --champagne: #f6d98b;
    --gold: #d4af37;
    --gold-deep: #8f6a19;
    --gold-soft: #f1dca3;
    --brown-gold: #5f4814;
    --muted: #8b7c62;

    --reveal-distance: 24px;
    --reveal-duration: 1100ms;
    --reveal-ease: cubic-bezier(0.19, 1, 0.22, 1);
}

html {
    scroll-behavior: smooth;
}

body {
    font-family: 'Montserrat', sans-serif;
    background: var(--black);
    color: var(--black);
    overflow-x: hidden;
}

body.invitation-locked {
    overflow: hidden;
}

.font-display {
    font-family: 'Cormorant Garamond', serif;
}

.font-luxury {
    font-family: 'Cinzel', serif;
}

.hide-scrollbar::-webkit-scrollbar {
    display: none;
}

.hide-scrollbar {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

/* Gold text */
.gold-text {
    background: linear-gradient(
        115deg,
        #8f6a19 0%,
        #d4af37 24%,
        #fff0b8 45%,
        #b8860b 68%,
        #f6d98b 100%
    );
    background-size: 190% auto;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: luxuryGoldShimmer 7.5s ease-in-out infinite alternate;
}

@keyframes luxuryGoldShimmer {
    0% {
        background-position: 0% center;
        filter: drop-shadow(0 0 0 rgba(212, 175, 55, 0));
    }

    50% {
        filter: drop-shadow(0 8px 20px rgba(212, 175, 55, 0.10));
    }

    100% {
        background-position: 100% center;
        filter: drop-shadow(0 10px 26px rgba(212, 175, 55, 0.14));
    }
}

/* Background */
.luxury-bg {
    background:
        radial-gradient(circle at top left, rgba(212, 175, 55, 0.18), transparent 32%),
        radial-gradient(circle at bottom right, rgba(246, 217, 139, 0.16), transparent 36%),
        linear-gradient(135deg, #fffaf0, #f6ead2 48%, #fff7e7);
}

.dark-luxury-bg {
    background:
        radial-gradient(circle at 20% 10%, rgba(212, 175, 55, 0.16), transparent 30%),
        radial-gradient(circle at 82% 76%, rgba(246, 217, 139, 0.12), transparent 32%),
        linear-gradient(135deg, #070604, #17130c 52%, #050403);
}

.pattern-overlay {
    position: absolute;
    inset: 0;
    pointer-events: none;
    background-image:
        linear-gradient(45deg, rgba(212, 175, 55, 0.08) 1px, transparent 1px),
        linear-gradient(-45deg, rgba(212, 175, 55, 0.05) 1px, transparent 1px);
    background-size: 48px 48px;
    mask-image: radial-gradient(circle at center, black, transparent 72%);
    opacity: 0.65;
    animation: luxuryPatternDrift 24s linear infinite;
}

@keyframes luxuryPatternDrift {
    from {
        background-position: 0 0, 0 0;
    }

    to {
        background-position: 48px 48px, -48px 48px;
    }
}

.luxury-label {
    font-family: 'Cinzel', serif;
    letter-spacing: 0.36em;
    text-transform: uppercase;
    font-size: 10px;
    font-weight: 600;
    color: var(--gold-deep);
}

.section-label {
    font-family: 'Cinzel', serif;
    letter-spacing: 0.36em;
    text-transform: uppercase;
    font-size: 10px;
    font-weight: 600;
}

.gold-rule {
    position: relative;
    height: 1px;
    width: 140px;
    background: linear-gradient(to right, transparent, var(--gold), transparent);
    overflow: hidden;
}

.gold-rule::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(to right, transparent, rgba(255, 240, 184, 0.85), transparent);
    transform: translateX(-100%);
    animation: goldRuleSweep 4.5s ease-in-out infinite;
}

@keyframes goldRuleSweep {
    0%, 35% {
        transform: translateX(-100%);
        opacity: 0;
    }

    50% {
        opacity: 1;
    }

    75%, 100% {
        transform: translateX(100%);
        opacity: 0;
    }
}

/* Wrapper pembuka undangan */
.invitation-content {
    opacity: 0;
    visibility: hidden;
    height: 0;
    overflow: hidden;
    transition: opacity 800ms ease;
}

.invitation-content.is-open {
    opacity: 1;
    visibility: visible;
    height: auto;
    overflow: visible;
}

#invitation-cover {
    transition:
        opacity 800ms ease,
        visibility 800ms ease,
        transform 800ms ease;
}

#invitation-cover.cover-hidden {
    opacity: 0;
    visibility: hidden;
    transform: scale(1.04);
    pointer-events: none;
}

.cover-card {
    animation: coverFadeUp 1100ms var(--reveal-ease) both;
}

@keyframes coverFadeUp {
    from {
        opacity: 0;
        transform: translateY(30px) scale(0.985);
        filter: blur(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
        filter: blur(0);
    }
}

/* Optional opener image */
.opener-bg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
    z-index: 0;
    pointer-events: none;
    user-select: none;
    opacity: 0.9;
    animation: openerLuxuryZoom 18s ease-in-out infinite alternate;
}

@keyframes openerLuxuryZoom {
    from {
        transform: scale(1);
    }

    to {
        transform: scale(1.04);
    }
}

/* Cover ornament */
.cover-corner {
    position: absolute;
    width: min(34vw, 320px);
    max-width: 360px;
    height: auto;
    pointer-events: none;
    user-select: none;
    z-index: 2;
    filter:
        drop-shadow(0 18px 38px rgba(0, 0, 0, 0.34))
        drop-shadow(0 0 18px rgba(212, 175, 55, 0.22))
        drop-shadow(0 0 32px rgba(246, 217, 139, 0.12));
}

.cover-corner-tl {
    top: -40px;
    left: -24px;
    transform: rotate(180deg);
    transform-origin: center;
    /* animation: luxurySwayTopLeft 10s ease-in-out infinite; */
}

.cover-corner-br {
    right: -24px;
    bottom: -28px;
    transform: rotate(0deg);
    transform-origin: center;
    /* animation: luxurySwayBottomRight 11s ease-in-out infinite; */
}

.bg-1 {
    background:
        /* linear-gradient(
            180deg,
            rgba(255, 248, 239, 0.18),
            rgba(250, 242, 232, 0.28)
        ), */
        url('/storage/assets/luxury-gold/bg-1.png');
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
}

/* Main sticky ornament */
.corner-art {
    position: fixed !important;
    width: min(30vw, 250px);
    height: auto;
    z-index: 80;
    pointer-events: none;
    user-select: none;
    display: block;
    filter:
        drop-shadow(0 18px 34px rgba(0, 0, 0, 0.30))
        drop-shadow(0 0 16px rgba(212, 175, 55, 0.20))
        drop-shadow(0 0 30px rgba(246, 217, 139, 0.10));
}

.corner-art-tl {
    top: 0px;
    left: 0px;
    transform: rotate(180deg);
    transform-origin: center;
    /* animation: luxurySwayTopLeft 10s ease-in-out infinite; */
}

.corner-art-br {
    right: 0px;
    bottom: 0px;
    transform: rotate(0deg);
    transform-origin: center;
    /* animation: luxurySwayBottomRight 11s ease-in-out infinite; */
}

@keyframes luxurySwayTopLeft {
    0%, 100% {
        transform: rotate(180deg) translateY(0) scale(1);
        opacity: 0.92;
    }

    50% {
        transform: rotate(182deg) translateY(-8px) scale(1.018);
        opacity: 1;
    }
}

@keyframes luxurySwayBottomRight {
    0%, 100% {
        transform: rotate(0deg) translateY(0) scale(1);
        opacity: 0.92;
    }

    50% {
        transform: rotate(-2deg) translateY(8px) scale(1.018);
        opacity: 1;
    }
}

/* Hero */
.hero-frame {
    position: relative;
    min-height: 680px;
    border: 1px solid rgba(212, 175, 55, 0.42);
    background:
        linear-gradient(135deg, rgba(255, 250, 240, 0.92), rgba(248, 237, 218, 0.88)),
        radial-gradient(circle at top left, rgba(212, 175, 55, 0.14), transparent 35%),
        radial-gradient(circle at bottom right, rgba(246, 217, 139, 0.16), transparent 38%);
    background-size: cover;
    box-shadow: 0 32px 100px rgba(0, 0, 0, 0.28);
    overflow: hidden;
}

.hero-frame::before {
    content: "";
    position: absolute;
    inset: 20px;
    border: 1px solid rgba(212, 175, 55, 0.48);
    pointer-events: none;
    animation: luxuryBorderGlow 5.5s ease-in-out infinite;
}

.hero-frame::after {
    content: "";
    position: absolute;
    inset: 34px;
    border: 1px solid rgba(143, 106, 25, 0.18);
    pointer-events: none;
}

@keyframes luxuryBorderGlow {
    0%, 100% {
        box-shadow: 0 0 0 rgba(212, 175, 55, 0);
        border-color: rgba(212, 175, 55, 0.38);
    }

    50% {
        box-shadow: 0 0 32px rgba(212, 175, 55, 0.16);
        border-color: rgba(246, 217, 139, 0.58);
    }
}

.corner-line {
    position: absolute;
    width: 96px;
    height: 96px;
    z-index: 3;
    pointer-events: none;
}

.corner-line::before,
.corner-line::after {
    content: "";
    position: absolute;
    background: var(--gold);
    box-shadow: 0 0 14px rgba(212, 175, 55, 0.26);
}

.corner-line::before {
    width: 100%;
    height: 1px;
}

.corner-line::after {
    width: 1px;
    height: 100%;
}

.corner-line.tl {
    top: 24px;
    left: 24px;
}

.corner-line.tr {
    top: 24px;
    right: 24px;
    transform: rotate(90deg);
}

.corner-line.bl {
    bottom: 24px;
    left: 24px;
    transform: rotate(-90deg);
}

.corner-line.br {
    bottom: 24px;
    right: 24px;
    transform: rotate(180deg);
}

.monogram {
    width: 124px;
    height: 124px;
    border-radius: 50%;
    border: 1px solid rgba(212, 175, 55, 0.55);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    position: relative;
    background: rgba(255, 250, 240, 0.42);
    animation: monogramGlow 5s ease-in-out infinite;
}

.monogram::before {
    content: "";
    position: absolute;
    inset: 10px;
    border-radius: 50%;
    border: 1px solid rgba(143, 106, 25, 0.24);
}

.monogram span {
    font-family: 'Cinzel', serif;
    font-size: 42px;
    color: var(--gold-deep);
    letter-spacing: -0.08em;
    z-index: 2;
}

@keyframes monogramGlow {
    0%, 100% {
        box-shadow: 0 16px 42px rgba(143, 106, 25, 0.10);
    }

    50% {
        box-shadow:
            0 18px 48px rgba(143, 106, 25, 0.16),
            0 0 34px rgba(212, 175, 55, 0.18);
    }
}

.date-panel {
    background: rgba(9, 8, 6, 0.92);
    color: var(--ivory);
    border: 1px solid rgba(212, 175, 55, 0.48);
    box-shadow: 0 24px 80px rgba(0, 0, 0, 0.28);
}

/* Couple */
.couple-card {
    position: relative;
    background: rgba(255, 250, 240, 0.72);
    border: 1px solid rgba(212, 175, 55, 0.32);
    box-shadow: 0 24px 70px rgba(95, 72, 20, 0.13);
    overflow: hidden;
}

.couple-card::before {
    content: "";
    position: absolute;
    inset: 14px;
    border: 1px solid rgba(212, 175, 55, 0.22);
    pointer-events: none;
}

.portrait-frame {
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(212, 175, 55, 0.58);
    background: var(--cream);
    box-shadow: inset 0 0 0 10px rgba(255, 250, 240, 0.78);
}

.portrait-frame::after {
    content: "";
    position: absolute;
    inset: 12px;
    border: 1px solid rgba(255, 250, 240, 0.75);
    pointer-events: none;
}

.portrait-frame img {
    transition:
        transform 1200ms var(--reveal-ease),
        filter 800ms ease;
}

.portrait-frame:hover img {
    transform: scale(1.035);
    filter: brightness(1.03);
}

.section-title {
    font-family: 'Cormorant Garamond', serif;
    font-size: clamp(3.5rem, 8vw, 6.5rem);
    font-weight: 600;
    line-height: 0.92;
    color: var(--black);
}

/* Event */
.event-ticket {
    position: relative;
    background: rgba(255, 250, 240, 0.06);
    border: 1px solid rgba(212, 175, 55, 0.38);
    min-height: 440px;
    overflow: hidden;
}

.event-ticket::before,
.event-ticket::after {
    content: "";
    position: absolute;
    top: 50%;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: #0b0906;
    border: 1px solid rgba(212, 175, 55, 0.24);
    transform: translateY(-50%);
}

.event-ticket::before {
    left: -20px;
}

.event-ticket::after {
    right: -20px;
}

.event-ticket-inner {
    position: relative;
    height: 100%;
    border: 1px solid rgba(246, 217, 139, 0.18);
}

.event-ticket-inner::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 96px;
    border-left: 1px dashed rgba(212, 175, 55, 0.28);
}

/* Maps */
.map-frame {
    position: relative;
    border: 1px solid rgba(212, 175, 55, 0.42);
    box-shadow: 0 26px 90px rgba(0, 0, 0, 0.18);
    background: var(--ivory);
}

.map-frame::before {
    content: "";
    position: absolute;
    inset: 12px;
    border: 1px solid rgba(212, 175, 55, 0.26);
    z-index: 2;
    pointer-events: none;
}

/* Story */
.timeline-luxury {
    position: relative;
}

.timeline-luxury::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 50%;
    width: 1px;
    background: linear-gradient(to bottom, transparent, var(--gold), transparent);
    transform-origin: top;
}

.timeline-luxury.reveal::before {
    transform: scaleY(0);
    transition: transform 1400ms var(--reveal-ease);
}

.timeline-luxury.reveal.is-visible::before {
    transform: scaleY(1);
}

.story-card {
    background: rgba(255, 250, 240, 0.78);
    border: 1px solid rgba(212, 175, 55, 0.30);
    box-shadow: 0 18px 55px rgba(95, 72, 20, 0.10);
}

/* Gallery */
.gallery-frame {
    border: 1px solid rgba(212, 175, 55, 0.42);
    background: rgba(255, 250, 240, 0.06);
    padding: 12px;
    clip-path: polygon(
        0 0,
        calc(100% - 26px) 0,
        100% 26px,
        100% 100%,
        26px 100%,
        0 calc(100% - 26px)
    );
    overflow: hidden;
}

.gallery-frame img {
    transition:
        transform 1200ms var(--reveal-ease),
        filter 800ms ease;
}

.gallery-frame:hover img {
    transform: scale(1.04);
    filter: brightness(1.06);
}

/* Gift */
.gift-card {
    position: relative;
    background:
        linear-gradient(145deg, rgba(9, 8, 6, 0.98), rgba(28, 23, 14, 0.96));
    border: 1px solid rgba(212, 175, 55, 0.42);
    box-shadow: 0 24px 75px rgba(0, 0, 0, 0.25);
    overflow: hidden;
}

.gift-card::before {
    content: "";
    position: absolute;
    width: 170px;
    height: 170px;
    right: -70px;
    top: -70px;
    border-radius: 50%;
    border: 1px solid rgba(212, 175, 55, 0.22);
    transition:
        transform 700ms ease,
        opacity 700ms ease;
}

.gift-card:hover::before {
    transform: scale(1.2);
    opacity: 0.9;
}

/* Buttons */
.luxury-button {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    background: linear-gradient(135deg, #8f6a19, #d4af37, #fff0b8, #b8860b);
    color: var(--black);
    border: 1px solid rgba(255, 255, 255, 0.5);
    box-shadow: 0 18px 48px rgba(143, 106, 25, 0.22);
    transition:
        transform 320ms ease,
        filter 320ms ease,
        box-shadow 320ms ease,
        border-color 320ms ease;
}

.luxury-button::before {
    content: "";
    position: absolute;
    inset: -1px;
    z-index: -1;
    background: linear-gradient(120deg, transparent 0%, rgba(255, 255, 255, 0.65) 45%, transparent 70%);
    transform: translateX(-120%);
    transition: transform 700ms ease;
}

.luxury-button:hover {
    transform: translateY(-3px);
    filter: brightness(1.06);
    box-shadow: 0 26px 60px rgba(143, 106, 25, 0.30);
}

.luxury-button:hover::before {
    transform: translateX(120%);
}

.luxury-button:active {
    transform: translateY(-1px) scale(0.985);
}

/* =========================================================
   Elegant Scroll Reveal Animation
========================================================= */

.reveal {
    opacity: 0;
    transform: translateY(var(--reveal-distance));
    filter: blur(0);
    transition:
        opacity var(--reveal-duration) var(--reveal-ease),
        transform var(--reveal-duration) var(--reveal-ease),
        filter var(--reveal-duration) var(--reveal-ease),
        box-shadow 360ms ease,
        border-color 360ms ease,
        background-color 360ms ease;
    transition-delay: var(--delay, 0ms);
    will-change: opacity, transform, filter;
}

.reveal.is-visible {
    opacity: 1;
    transform: none;
    filter: blur(0);
}

.reveal-up {
    transform: translateY(var(--reveal-distance));
}

.reveal-up.is-visible {
    transform: translateY(0);
    filter: blur(0);
}

.reveal-down {
    transform: translateY(-22px);
}

.reveal-down.is-visible {
    transform: translateY(0);
    filter: blur(0);
}

.reveal-left {
    transform: translateX(-28px);
    filter: blur(7px);
}

.reveal-right {
    transform: translateX(28px);
    filter: blur(7px);
}

.reveal-left.is-visible,
.reveal-right.is-visible {
    transform: translateX(0);
    filter: blur(0);
}

.reveal-scale {
    transform: scale(0.955);
    filter: blur(5px);
}

.reveal-scale.is-visible {
    transform: scale(1);
    filter: blur(0);
}

.reveal-blur {
    transform: translateY(22px) scale(0.985);
    filter: blur(10px);
}

.reveal-blur.is-visible {
    transform: translateY(0) scale(1);
    filter: blur(0);
}

/* Luxury reveal: lebih elegan untuk judul besar */
.reveal-luxury-title {
    opacity: 0;
    transform: translateY(18px);
    filter: blur(8px);
    letter-spacing: 0.08em;
    transition:
        opacity 1300ms var(--reveal-ease),
        transform 1300ms var(--reveal-ease),
        filter 1300ms var(--reveal-ease),
        letter-spacing 1300ms var(--reveal-ease);
}

.reveal-luxury-title.is-visible {
    opacity: 1;
    transform: translateY(0);
    filter: blur(0);
    letter-spacing: inherit;
}

/* Prevent blur stuck */
.reveal-blur:not(.is-visible),
.couple-card.reveal:not(.is-visible),
.event-ticket.reveal:not(.is-visible),
.story-card.reveal:not(.is-visible),
.gallery-frame.reveal:not(.is-visible),
.gift-card.reveal:not(.is-visible),
.map-frame.reveal:not(.is-visible),
.date-panel.reveal:not(.is-visible),
.hero-frame.reveal:not(.is-visible) {
    filter: blur(9px);
}

.reveal-blur.is-visible,
.couple-card.reveal.is-visible,
.event-ticket.reveal.is-visible,
.story-card.reveal.is-visible,
.gallery-frame.reveal.is-visible,
.gift-card.reveal.is-visible,
.map-frame.reveal.is-visible,
.date-panel.reveal.is-visible,
.hero-frame.reveal.is-visible {
    filter: blur(0);
}

/* Staggered animation */
.stagger > * {
    opacity: 0;
    transform: translateY(20px);
    filter: blur(7px);
    transition:
        opacity 950ms var(--reveal-ease),
        transform 950ms var(--reveal-ease),
        filter 950ms var(--reveal-ease),
        box-shadow 360ms ease,
        border-color 360ms ease;
    transition-delay: calc(var(--stagger-index, 0) * 130ms);
    will-change: opacity, transform, filter;
}

.stagger.is-visible > * {
    opacity: 1;
    transform: translateY(0);
    filter: blur(0);
}

/* Section-specific reveal */
.hero-section .reveal-up:not(.is-visible),
.hero-names .reveal-up:not(.is-visible) {
    transform: translateY(32px);
}

.quote-section .reveal-blur:not(.is-visible),
.verse-section .reveal-blur:not(.is-visible) {
    filter: blur(12px);
}

.event-ticket.reveal-blur:not(.is-visible),
.map-frame.reveal-blur:not(.is-visible),
.gift-card.reveal-blur:not(.is-visible),
.couple-card.reveal-blur:not(.is-visible) {
    transform: translateY(26px) scale(0.985);
}

.gallery-frame.reveal-scale:not(.is-visible),
.portrait-frame.reveal-scale:not(.is-visible) {
    transform: translateY(18px) scale(0.955);
    filter: blur(5px);
}

.gallery-frame.reveal-scale.is-visible,
.portrait-frame.reveal-scale.is-visible {
    transform: translateY(0) scale(1);
    filter: blur(0);
}

/* Elegant hover cards */
.couple-card,
.event-ticket,
.story-card,
.gallery-frame,
.gift-card,
.map-frame,
.date-panel,
.hero-frame {
    transition:
        transform 360ms ease,
        box-shadow 360ms ease,
        border-color 360ms ease,
        filter 360ms ease;
}

.couple-card:hover,
.event-ticket:hover,
.story-card:hover,
.gallery-frame:hover,
.gift-card:hover,
.map-frame:hover,
.date-panel:hover {
    transform: translateY(-5px);
    box-shadow: 0 30px 90px rgba(0, 0, 0, 0.22);
    border-color: rgba(246, 217, 139, 0.56);
}

.couple-card.reveal.is-visible:hover,
.event-ticket.reveal.is-visible:hover,
.story-card.reveal.is-visible:hover,
.gallery-frame.reveal.is-visible:hover,
.gift-card.reveal.is-visible:hover,
.map-frame.reveal.is-visible:hover,
.date-panel.reveal.is-visible:hover {
    transform: translateY(-5px);
    filter: blur(0);
}

.gallery-frame.reveal-scale.is-visible:hover,
.portrait-frame.reveal-scale.is-visible:hover {
    transform: translateY(-5px) scale(1.01);
    filter: blur(0);
}

/* Floating tambahan */
.float-ornament {
    animation: luxuryFloat 8s ease-in-out infinite;
}

.float-ornament-slow {
    animation: luxuryFloat 11s ease-in-out infinite;
}

.float-ornament-reverse {
    animation: luxuryFloatReverse 9s ease-in-out infinite;
}

@keyframes luxuryFloat {
    0%, 100% {
        transform: translateY(0);
        opacity: 0.92;
    }

    50% {
        transform: translateY(-9px);
        opacity: 1;
    }
}

@keyframes luxuryFloatReverse {
    0%, 100% {
        transform: translateY(0);
        opacity: 0.92;
    }

    50% {
        transform: translateY(9px);
        opacity: 1;
    }
}

/* Responsive */
@media (max-width: 1024px) {
    .cover-corner {
        width: 220px;
    }

    .cover-corner-tl {
        top: 0px;
        left: 0px;
    }

    .cover-corner-br {
        right: 0px;
        bottom: 0px;
    }

    .corner-art {
        width: 400px;
    }

    .corner-art-tl {
        top: 0px;
        left: 0px;
    }

    .corner-art-br {
        right: 0px;
        bottom: 0px;
    }
}

@media (max-width: 768px) {
    :root {
        --reveal-distance: 18px;
        --reveal-duration: 850ms;
    }

    .hero-frame {
        min-height: 620px;
    }

    .corner-line {
        width: 64px;
        height: 64px;
    }

    .timeline-luxury::before {
        left: 0;
    }

    .event-ticket-inner::before {
        display: none;
    }

    .cover-corner {
        width: 180px;
    }

    .cover-corner-tl {
        top: 0px;
        left: 0px;
    }

    .cover-corner-br {
        right: 0px;
        bottom: 0px;
    }

    .corner-art {
        width: 280px;
        z-index: 70;
    }

    .corner-art-tl {
        top: 0px;
        left: 0px;
    }

    .corner-art-br {
        right: 0px;
        bottom: 0px;
    }

    .opener-bg {
        animation-duration: 22s;
    }

    .reveal-scale {
        transform: scale(0.97);
        filter: blur(3px);
    }

    .reveal-scale.is-visible {
        transform: scale(1);
        filter: blur(0);
    }

    .reveal-blur {
        filter: blur(7px);
    }

    .reveal-blur.is-visible {
        filter: blur(0);
    }

    .stagger > * {
        transition-delay: calc(var(--stagger-index, 0) * 90ms);
    }

    .couple-card:hover,
    .event-ticket:hover,
    .story-card:hover,
    .gallery-frame:hover,
    .gift-card:hover,
    .map-frame:hover,
    .date-panel:hover,
    .couple-card.reveal.is-visible:hover,
    .event-ticket.reveal.is-visible:hover,
    .story-card.reveal.is-visible:hover,
    .gallery-frame.reveal.is-visible:hover,
    .gift-card.reveal.is-visible:hover,
    .map-frame.reveal.is-visible:hover,
    .date-panel.reveal.is-visible:hover,
    .luxury-button:hover {
        transform: none;
    }
}

@media (max-width: 480px) {
    .cover-corner {
        width: 190px;
    }

    .cover-corner-tl {
        top: 0px;
        left: 0px;
    }

    .cover-corner-br {
        right: 0px;
        bottom: 0px;
    }

    .corner-art {
        width: 200px;
        z-index: 70;
    }

    .corner-art-tl {
        top: 0px;
        left: 0px;
    }

    .corner-art-br {
        right: 0px;
        bottom: 0px;
    }

    .cover-card {
        padding-left: 1.4rem;
        padding-right: 1.4rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
    }

    .cover-card,
    .cover-corner,
    .corner-art,
    .opener-bg,
    .gold-text,
    .gold-rule::after,
    .pattern-overlay,
    .hero-frame::before,
    .monogram,
    .float-ornament,
    .float-ornament-slow,
    .float-ornament-reverse {
        animation: none !important;
    }

    #invitation-cover,
    .invitation-content,
    .reveal,
    .reveal-luxury-title,
    .stagger > *,
    .couple-card,
    .event-ticket,
    .story-card,
    .gallery-frame,
    .gift-card,
    .map-frame,
    .date-panel,
    .hero-frame,
    .luxury-button {
        opacity: 1 !important;
        transition: none !important;
        transform: none !important;
        filter: none !important;
    }
}