@import "https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;0,600;0,700;1,400&family=Great+Vibes&family=Montserrat:wght@300;400;500;600&display=swap";:root {
    --color-wine-dark: #400008;
    --color-wine-mid: #8c081a;
    --color-wine-light: #d2042d;
    --color-wine-accent: #e61937;
    --color-gold-light: #f9e5c8;
    --color-gold-mid: #d4af37;
    --color-gold-dark: #b8860b;
    --color-gold-antique: #8b6508;
    --color-ivory: linen;
    --color-paper: #fdfbf7;
    --font-primary: "Cormorant Garamond", serif;
    --font-secondary: "Montserrat", sans-serif;
    --font-cursive: "Great Vibes", cursive;
    --z-bg: 0;
    --z-particles: 10;
    --z-content: 20;
    --z-overlay: 100
}

*,:before,:after {
    box-sizing: border-box;
    margin: 0;
    padding: 0
}

html,body {
    background-color: #0c0c0c;
    width: 100%;
    max-width: 100%;
    color: var(--color-gold-light);
    font-family: var(--font-primary);
    overscroll-behavior-x: none;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    overflow-x: clip
}

#root {
    flex-direction: column;
    width: 100%;
    max-width: 100%;
    display: flex;
    position: relative;
    overflow-x: clip
}

.heading-primary {
    font-family: var(--font-primary);
    text-transform: uppercase;
    letter-spacing: .05em;
    font-size: clamp(2.5rem,10vw,5rem);
    font-weight: 400;
    line-height: 1.1
}

.text-label {
    font-family: var(--font-secondary);
    text-transform: uppercase;
    letter-spacing: .25em;
    font-size: clamp(.7rem,2vw,.9rem);
    font-weight: 400
}

.section-padding {
    padding-top: clamp(80px,15vh,150px);
    padding-bottom: clamp(80px,15vh,150px);
    flex-direction: column;
    align-items: center;
    width: 100%;
    padding-inline:clamp(20px,5vw,80px);display: flex;
    position: relative
}

.absolute-fill {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0
}

.flex-center {
    justify-content: center;
    align-items: center;
    display: flex
}

.paper-texture {
    background-color: var(--color-paper);
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)' opacity='0.05'/%3E%3C/svg%3E")
}

.no-select {
    -webkit-user-select: none;
    user-select: none
}

@keyframes calendarHeartbeat {
    0% {
        opacity: .85;
        filter: drop-shadow(0 0 2px #d4af3766);
        transform: scale(1)
    }

    50% {
        opacity: 1;
        filter: drop-shadow(0 0 8px #d4af37cc);
        transform: scale(1.15)
    }

    to {
        opacity: .85;
        filter: drop-shadow(0 0 2px #d4af3766);
        transform: scale(1)
    }
}

.breathing-heart {
    animation: 2.5s ease-in-out infinite calendarHeartbeat
}

@keyframes musicPulse {
    0% {
        transform: scale(1);
        box-shadow: 0 0 10px #d4af3766,inset 0 0 10px #d4af3733
    }

    50% {
        transform: scale(1.05);
        box-shadow: 0 0 25px #d4af37b3,inset 0 0 15px #d4af3766
    }

    to {
        transform: scale(1);
        box-shadow: 0 0 10px #d4af3766,inset 0 0 10px #d4af3733
    }
}

.floating-music.playing {
    animation: 3s ease-in-out infinite musicPulse
}

._scratch-section_ghkm7_1 {
    min-height: 100vh
}

._wrapper_ghkm7_5 {
    box-sizing: border-box;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 100%;
    padding: 150px 0;
    display: flex;
    margin-top: 0!important
}

._card_ghkm7_16 {
    aspect-ratio: 4/3;
    background: var(--color-white);
    box-sizing: border-box;
    border: 1px solid #c9a14a40;
    border-radius: 28px;
    width: 100%;
    max-width: 520px;
    transition: transform .6s cubic-bezier(.16,1,.3,1),box-shadow .8s cubic-bezier(.16,1,.3,1),border-color .8s;
    position: relative;
    overflow: hidden;
    box-shadow: 0 10px 45px #0000000d,0 24px 70px #c9a14a26,inset 0 0 35px #c9a14a0d;
    padding-top: 0!important
}

._card_ghkm7_16:not(._revealed_ghkm7_37):hover {
    transform: translateY(-4px)scale(1.005);
    box-shadow: 0 15px 55px #0000000f,0 32px 85px #c9a14a38,inset 0 0 45px #c9a14a14
}

._borderSvg_ghkm7_46 {
    z-index: 10;
    pointer-events: none;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0
}

._staticBorder_ghkm7_56 {
    stroke: #c9a14a59;
    stroke-width: 1.5px;
    fill: none;
    transition: stroke .8s
}

._glowingBorder_ghkm7_63 {
    stroke: url(index-DXrO20sz.css#glowGrad);
    stroke-width: 3.5px;
    fill: none;
    stroke-linecap: round;
    stroke-dasharray: 180 520;
    stroke-dashoffset: 700px;
    filter: drop-shadow(0 0 4px #ffd70099);
    animation: 4.5s linear infinite _travelLight_ghkm7_1
}

@keyframes _travelLight_ghkm7_1 {
    0% {
        stroke-dashoffset: 700px
    }

    to {
        stroke-dashoffset: 0
    }
}

._hiddenContent_ghkm7_84 {
    text-align: center;
    z-index: 1;
    opacity: 0;
    pointer-events: none;
    background: linear-gradient(135deg,#fdfaf6 0%,#f7efe3 50%,#f3e5d0 100%);
    border-radius: 28px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 35px;
    display: flex;
    position: absolute;
    inset: 0;
    box-shadow: inset 0 0 30px #c9a14a24
}

._royalCrown_ghkm7_102 {
    color: var(--color-gold);
    text-shadow: 0 0 10px #c9a14a4d;
    margin-bottom: 8px;
    font-size: 24px
}

._vintageFlower_ghkm7_109 {
    color: var(--color-gold);
    opacity: .85;
    margin-top: 10px;
    font-size: 20px
}

._label_ghkm7_116 {
    font-family: var(--font-cursive);
    color: var(--color-wine-dark);
    letter-spacing: 1px;
    text-transform: none;
    opacity: .95;
    margin-bottom: -5px;
    font-size: clamp(2.5rem,8vw,4rem);
    font-weight: 400
}

._date_ghkm7_127 {
    font-family: var(--font-primary);
    background: linear-gradient(90deg,#b8860b,#d4af37,#b8860b);
    -webkit-text-fill-color: transparent;
    letter-spacing: 2px;
    text-shadow: 0 2px 15px #d4af3733;
    white-space: nowrap;
    -webkit-background-clip: text;
    background-clip: text;
    margin-bottom: 12px;
    font-size: clamp(1.8rem,5.5vw,3rem);
    font-weight: 600;
    line-height: 1.2
}

._sub_ghkm7_142 {
    font-family: var(--font-primary);
    color: var(--color-gold-dark);
    letter-spacing: 2px;
    text-transform: uppercase;
    font-size: clamp(14px,2.2vw,20px);
    font-style: italic;
    font-weight: 500
}

._canvas_ghkm7_153 {
    z-index: 3;
    cursor: grab;
    border-radius: 28px;
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    top: 0;
    left: 0
}

._canvas_ghkm7_153:active {
    cursor: grabbing
}

._particlesCanvas_ghkm7_170 {
    z-index: 4;
    pointer-events: none;
    border-radius: 28px;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0
}

@media (width<=768px) {
    ._wrapper_ghkm7_5 {
        margin-top: 0!important;
        padding-top: 0!important
    }

    ._card_ghkm7_16 {
        border-radius: 24px;
        max-width: 440px
    }

    ._hiddenContent_ghkm7_84,._canvas_ghkm7_153,._particlesCanvas_ghkm7_170 {
        border-radius: 24px
    }

    ._staticBorder_ghkm7_56,._glowingBorder_ghkm7_63 {
        rx: 16px;
        ry: 16px
    }

    ._label_ghkm7_116 {
        letter-spacing: 3.5px;
        margin-bottom: 8px
    }

    ._date_ghkm7_127 {
        margin-bottom: 8px
    }
}

@media (width<=480px) {
    ._wrapper_ghkm7_5 {
        padding: 3px
    }

    ._card_ghkm7_16 {
        border-radius: 20px;
        max-width: 100%
    }

    ._hiddenContent_ghkm7_84,._canvas_ghkm7_153,._particlesCanvas_ghkm7_170 {
        border-radius: 20px
    }

    ._staticBorder_ghkm7_56,._glowingBorder_ghkm7_63 {
        rx: 14px;
        ry: 14px;
        x: 4px;
        y: 4px;
        width: calc(100% - 8px);
        height: calc(100% - 8px)
    }

    ._hiddenContent_ghkm7_84 {
        padding: 20px
    }
}

._scrollInstruction_ghkm7_238 {
    opacity: 0;
    flex-direction: column;
    align-items: center;
    margin-top: 3rem;
    animation: 1.5s 1.5s forwards _revealInstruction_ghkm7_1;
    display: flex;
    transform: translateY(-10px)
}

@keyframes _revealInstruction_ghkm7_1 {
    to {
        opacity: 1;
        transform: translateY(0)
    }
}

._scrollInstructionSub_ghkm7_255 {
    color: var(--color-gold-dark);
    font-family: var(--font-primary);
    letter-spacing: 4px;
    text-transform: uppercase;
    text-align: center;
    max-width: 90%;
    margin-bottom: 20px;
    font-size: clamp(.9rem,3.5vw,1.2rem);
    font-style: normal;
    line-height: 1.5;
    animation: 2s infinite alternate _pulseText_ghkm7_1
}

@keyframes _pulseText_ghkm7_1 {
    0% {
        opacity: .7;
        text-shadow: 0 0 5px #d4af3733
    }

    to {
        opacity: 1;
        text-shadow: 0 0 15px #d4af3799
    }
}

._scrollInstructionArrow_ghkm7_274 {
    color: var(--color-gold-mid);
    font-size: 1.5rem;
    font-weight: 300;
    animation: 2.5s ease-in-out infinite _elegantBounce_ghkm7_1
}

@keyframes _elegantBounce_ghkm7_1 {
    0%,to {
        opacity: .6;
        transform: translateY(0)
    }

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