﻿.botanical-background {
    position: absolute;
    inset: 0;
    z-index: 0;
    overflow: hidden;
    pointer-events: none;
    background: linear-gradient( 145deg, var(--ivory-50) 0%, var(--ivory-200) 52%, var(--sage-100) 100% );
}

.botanical-background__photo {
    position: absolute;
    inset: -1rem;
    opacity: var(--hero-background-opacity, 0%);
    filter: grayscale(0.18) saturate(0.72) contrast(0.92);
    background-image: var(--hero-background-image, none);
    background-position: center;
    background-size: cover;
    transform: scale(1.025);
}

.botanical-background__paper {
    position: absolute;
    inset: 0;
    opacity: 0.24;
    mix-blend-mode: multiply;
    background-image: repeating-radial-gradient( circle at 0 0, rgba(63, 72, 49, 0.04) 0, rgba(63, 72, 49, 0.04) 1px, transparent 1px, transparent 4px );
    background-size: 7px 7px;
}

.botanical-background__glow {
    position: absolute;
    border-radius: 50%;
    filter: blur(18px);
    opacity: 0.75;
}

.botanical-background__glow--primary {
    width: min(90vw, 56rem);
    aspect-ratio: 1;
    top: -22rem;
    left: 50%;
    transform: translateX(-50%);
    background: radial-gradient( circle, rgba(255, 255, 255, 0.95) 0%, rgba(255, 255, 255, 0.42) 42%, transparent 72% );
}

.botanical-background__glow--secondary {
    width: 34rem;
    height: 34rem;
    right: -17rem;
    bottom: -14rem;
    opacity: 0.32;
    background: radial-gradient( circle, rgba(170, 182, 154, 0.6), transparent 70% );
}

.botanical-background__light-beam {
    position: absolute;
    width: 28rem;
    height: 130%;
    top: -18%;
    left: 54%;
    opacity: 0.18;
    transform: rotate(18deg);
    filter: blur(8px);
    background: linear-gradient( 90deg, transparent, rgba(255, 255, 255, 0.92), transparent );
}

.botanical-leaf {
    position: absolute;
    width: clamp(8rem, 21vw, 17rem);
    overflow: visible;
    opacity: 0.2;
    filter: drop-shadow( 0 1rem 1.5rem rgba(63, 72, 49, 0.08) );
}

.botanical-leaf--top-left {
    top: -3rem;
    left: -3rem;
    transform: rotate(-14deg);
    transform-origin: top left;
}

.botanical-leaf--bottom-right {
    right: -3rem;
    bottom: -5rem;
    transform: rotate(162deg);
    transform-origin: bottom right;
}

.botanical-leaf__stem {
    fill: none;
    stroke: var(--olive-600);
    stroke-width: 3;
    stroke-linecap: round;
}

.botanical-leaf__shape {
    fill: var(--olive-500);
}

.botanical-leaf__shape--opposite {
    fill: var(--olive-400);
}

.botanical-particle {
    position: absolute;
    width: 0.35rem;
    height: 0.35rem;
    border-radius: 50%;
    opacity: 0.32;
    background: var(--gold-500);
    box-shadow: 0 0 0.8rem rgba(200, 162, 71, 0.42);
}

.botanical-particle--one {
    top: 21%;
    left: 18%;
}

.botanical-particle--two {
    top: 34%;
    right: 16%;
}

.botanical-particle--three {
    bottom: 22%;
    left: 13%;
}

.botanical-particle--four {
    right: 24%;
    bottom: 16%;
}

@media (min-width: 48rem) {
    .botanical-leaf {
        opacity: 0.25;
    }

    .botanical-leaf--top-left {
        top: -1rem;
        left: 1rem;
    }

    .botanical-leaf--bottom-right {
        right: 1rem;
        bottom: -3rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .botanical-background *,
    .botanical-background *::before,
    .botanical-background *::after {
        animation: none !important;
        transition: none !important;
    }
}
