.bw-florals,
.bw-floral,
.bw-floral-accent,
.bw-wash {
    pointer-events: none;
    user-select: none;
}

.bw-florals {
    position: absolute;
    inset: 0;
    z-index: 0;
    width: auto;
    height: auto;
    margin: 0;
    padding: 0;
    overflow: hidden;
    pointer-events: none;
}

.bw-wash {
    position: absolute;
    border-radius: 50%;
    filter: blur(18px);
}

.bw-wash--tl {
    top: -12%;
    left: -14%;
    width: min(44vw, 420px);
    height: min(44vw, 420px);
    background:
        radial-gradient(ellipse 42% 55% at 32% 38%, color-mix(in srgb, var(--color-petal) 48%, transparent) 0%, transparent 68%),
        radial-gradient(ellipse 48% 40% at 58% 28%, color-mix(in srgb, var(--color-blush) 34%, transparent) 0%, transparent 64%),
        radial-gradient(ellipse 40% 48% at 40% 62%, color-mix(in srgb, var(--color-sage) 30%, transparent) 0%, transparent 66%);
}

.bw-wash--tr {
    top: -14%;
    right: -16%;
    width: min(40vw, 380px);
    height: min(40vw, 380px);
    background:
        radial-gradient(ellipse 46% 50% at 62% 36%, color-mix(in srgb, var(--color-sage) 34%, transparent) 0%, transparent 66%),
        radial-gradient(ellipse 40% 44% at 34% 28%, color-mix(in srgb, var(--color-petal) 38%, transparent) 0%, transparent 64%);
}

.bw-wash--bl {
    bottom: -18%;
    left: -12%;
    width: min(42vw, 400px);
    height: min(42vw, 400px);
    background:
        radial-gradient(ellipse 44% 52% at 38% 58%, color-mix(in srgb, var(--color-sage) 32%, transparent) 0%, transparent 68%),
        radial-gradient(ellipse 42% 38% at 58% 72%, color-mix(in srgb, var(--color-blush) 24%, transparent) 0%, transparent 66%);
}

.bw-wash--br {
    right: -14%;
    bottom: -16%;
    width: min(46vw, 430px);
    height: min(46vw, 430px);
    background:
        radial-gradient(ellipse 48% 50% at 60% 48%, color-mix(in srgb, var(--color-blush) 36%, transparent) 0%, transparent 66%),
        radial-gradient(ellipse 36% 46% at 32% 68%, color-mix(in srgb, var(--color-petal) 32%, transparent) 0%, transparent 64%);
}

.bw-florals:has(.bw-floral) .bw-wash {
    display: none;
}

.bw-floral {
    position: absolute;
    display: block;
    max-width: none;
    height: auto;
    background: none;
    object-fit: contain;
}

.bw-floral--top-left {
    top: 0;
    left: 0;
    width: clamp(10.5rem, 20vw, 16.75rem);
    aspect-ratio: 1522 / 1024;
    object-position: top left;
}

.bw-floral--top-right {
    top: 0;
    right: 0;
    width: clamp(10.5rem, 20vw, 16.75rem);
    aspect-ratio: 1522 / 1024;
    object-position: top right;
}

.bw-floral--side-left,
.bw-floral--side-right {
    display: none;
}

.bw-floral--bottom-left {
    bottom: 0;
    left: 0;
    width: clamp(11rem, 22vw, 17.5rem);
    aspect-ratio: 1522 / 1024;
    object-position: bottom left;
}

.bw-floral--bottom-right {
    right: 0;
    bottom: 0;
    width: clamp(11rem, 22vw, 17.5rem);
    aspect-ratio: 1522 / 1024;
    object-position: bottom right;
}

.bw-floral--corner {
    top: 0;
    left: 0;
    width: clamp(4.25rem, 8vw, 6.5rem);
    aspect-ratio: 1095 / 737;
    object-position: top left;
}

.bw-floral-accent {
    display: block;
    width: clamp(5.5rem, 22vw, 11.75rem);
    max-width: 100%;
    height: auto;
    margin: 0.4rem auto 0;
    background: none;
    object-fit: contain;
}

.bw-floral-accent--divider {
    aspect-ratio: 1370 / 440;
    object-position: center;
}

.bw-floral-accent--small {
    width: clamp(3.35rem, 12vw, 5rem);
    margin: 0.9rem auto 0;
    aspect-ratio: 761 / 593;
    object-position: center;
}

.bw-section__head:has(.bw-floral-accent) {
    margin-bottom: clamp(1.45rem, 3.8vw, 2.4rem);
}

.bw-section__head:has(.bw-floral-accent)::after {
    display: none;
}

.bw-countdown .bw-floral-accent {
    margin-top: 0.35rem;
}

.bw-details,
.bw-rsvp,
.bw-memories,
.bw-closing,
.bw-flow,
.bw-countdown {
    overflow-x: clip;
}

@media (min-width: 1280px) {
    .bw-floral--side-left,
    .bw-floral--side-right {
        display: block;
        top: 18%;
        width: clamp(4.5rem, 7.2vw, 6.5rem);
        aspect-ratio: 715 / 840;
    }

    .bw-floral--side-left {
        left: 0;
        object-position: top left;
    }

    .bw-floral--side-right {
        right: 0;
        object-position: top right;
    }

    .bw-details {
        padding-inline: max(var(--bw-space), 5.25rem);
    }
}

@media (min-width: 1440px) {
    .bw-florals--cover .bw-floral--top-left,
    .bw-florals--cover .bw-floral--top-right,
    .bw-florals--hero .bw-floral--top-left,
    .bw-florals--hero .bw-floral--top-right {
        width: 17.25rem;
    }
}

@media (max-width: 767px) {
    .bw-floral--top-left {
        width: clamp(5.5rem, 28vw, 7.15rem);
    }

    .bw-floral--top-right {
        width: clamp(5.1rem, 26vw, 6.6rem);
    }

    .bw-florals--cover .bw-floral--bottom-left,
    .bw-florals--cover .bw-floral--bottom-right,
    .bw-florals--hero .bw-floral--bottom-left,
    .bw-florals--hero .bw-floral--bottom-right {
        display: none;
    }

    .bw-florals--closing .bw-floral--bottom-left,
    .bw-florals--closing .bw-floral--bottom-right {
        width: clamp(5.25rem, 30vw, 7.25rem);
    }

    .bw-floral--corner {
        width: 4.1rem;
    }

    .bw-floral-accent--divider {
        width: clamp(5.25rem, 32vw, 8.5rem);
    }
}

@media (max-width: 429px) {
    .bw-floral--top-left {
        width: 6.35rem;
    }

    .bw-floral--top-right {
        width: 5.6rem;
    }

    .bw-florals--closing .bw-floral--bottom-right {
        display: none;
    }

    .bw-florals--closing .bw-floral--bottom-left {
        width: 5.4rem;
    }

    .bw-floral--corner {
        width: 3.6rem;
    }
}

@media (max-width: 359px) {
    .bw-floral--top-right {
        display: none;
    }

    .bw-floral--top-left {
        width: 5.15rem;
    }

    .bw-florals--closing .bw-floral--bottom-left {
        width: 4.6rem;
    }

    .bw-floral--corner {
        display: none;
    }
}
