/* ============================================================
   04 · BLOOMING LOVE — Floral
   Pudra pembe, adacayi yesili, krem, kurumus gul.
   ============================================================ */

.pem--bloom {
    --ink: #4d3a34;
    --bg: #fdfaf6;
    --soft: #f7ede6;
    --acc: #b5705f;
    --acc2: #9dae8b;
    --blush: #efc9c2;
    --line: rgba(157, 174, 139, .4);
    --serif: "Cormorant Garamond", Georgia, serif;
    --sans: "Jost", system-ui, sans-serif;
    --script: "Italianno", "Cormorant Garamond", cursive;
    --e: cubic-bezier(.22, .61, .36, 1);

    background:
        radial-gradient(70% 40% at 12% 4%, rgba(239, 201, 194, .42), transparent 62%),
        radial-gradient(60% 40% at 92% 30%, rgba(157, 174, 139, .26), transparent 60%),
        radial-gradient(70% 40% at 40% 100%, rgba(239, 201, 194, .3), transparent 64%),
        #fdfaf6;
    font-size: 17px;
}

/* ---------------------------------------------- açılış */

.b-open {
    position: fixed; inset: 0; z-index: 60;
    display: grid; place-items: center; align-content: center; gap: 24px;
    background: linear-gradient(170deg, #fdfaf6, #f7eae4 56%, #efe2dc);
    overflow: hidden;
    transition: opacity 1.1s var(--e), visibility 1.1s;
}
.pem--bloom.is-open .b-open { opacity: 0; visibility: hidden; }

.b-wash {
    position: absolute; inset: -16%;
    background:
        radial-gradient(28% 20% at 26% 32%, rgba(239, 201, 194, .8), transparent 70%),
        radial-gradient(26% 18% at 74% 62%, rgba(157, 174, 139, .54), transparent 70%),
        radial-gradient(22% 16% at 54% 86%, rgba(217, 184, 196, .6), transparent 70%);
    filter: blur(30px);
    animation: b-drift 22s ease-in-out infinite alternate;
}
@keyframes b-drift {
    from { transform: translate3d(-2%, 1%, 0) scale(1.02); }
    to { transform: translate3d(3%, -2%, 0) scale(1.1); }
}

.b-stage { position: relative; display: grid; place-items: center; }

.b-bud {
    background: none; border: 0; padding: 0; cursor: pointer;
    width: min(66vw, 280px); aspect-ratio: 1;
    display: grid; place-items: center;
}
.b-flower { width: 100%; height: 100%; overflow: visible; }

.b-petal {
    fill: var(--blush);
    stroke: rgba(181, 112, 95, .32);
    stroke-width: .8;
    transform-origin: 0 0;
    transform: rotate(calc(var(--i) * 45deg)) translateY(38px) scale(.08);
    transition: transform 1.25s var(--e);
    transition-delay: calc(var(--i) * .055s);
}
.b-petal--in {
    fill: #f8ddd6;
    transform: rotate(calc(var(--i) * 72deg + 22deg)) translateY(20px) scale(.08);
    transition-delay: calc(.3s + var(--i) * .05s);
}
.b-core {
    fill: #e3b56f;
    transform: scale(.35);
    transform-origin: 0 0;
    transition: transform 1s var(--e) .25s;
}
.b-seed {
    fill: #c08f3f;
    transform-origin: 0 0;
    transform: rotate(calc(var(--i) * 51deg)) scale(0);
    transition: transform .8s var(--e) calc(.6s + var(--i) * .04s);
}

.b-bud:hover .b-petal { transform: rotate(calc(var(--i) * 45deg)) translateY(38px) scale(.13); }

.pem--bloom.is-opening .b-petal {
    transform: rotate(calc(var(--i) * 45deg)) translateY(-4px) scale(1);
}
.pem--bloom.is-opening .b-petal--in {
    transform: rotate(calc(var(--i) * 72deg + 22deg)) translateY(-2px) scale(1);
}
.pem--bloom.is-opening .b-core { transform: scale(1); }
.pem--bloom.is-opening .b-seed { transform: rotate(calc(var(--i) * 51deg)) translateY(-7px) scale(1); }

.b-open-n {
    position: absolute;
    font-family: var(--script);
    font-size: clamp(2.4rem, 11vw, 4rem);
    color: var(--acc);
    opacity: 0; transform: scale(.82);
    transition: opacity .9s ease 1.5s, transform 1.1s var(--e) 1.5s;
    pointer-events: none;
    text-shadow: 0 2px 14px rgba(253, 250, 246, .9);
}
.b-open-n i { font-style: normal; color: var(--acc2); }
.pem--bloom.is-opening .b-open-n { opacity: 1; transform: scale(1); }

.b-hint {
    font-family: var(--sans);
    font-size: .56rem; letter-spacing: .32em; text-transform: uppercase;
    color: rgba(77, 58, 52, .5);
    animation: b-breathe 3.4s ease-in-out infinite;
}
@keyframes b-breathe { 0%, 100% { opacity: .4; } 50% { opacity: 1; } }
.pem--bloom.is-opening .b-hint { opacity: 0; transition: opacity .4s; }

/* ---------------------------------------------- savrulan yapraklar */

.b-petalfall { position: fixed; inset: 0; z-index: 2; pointer-events: none; overflow: hidden; }
.b-pf {
    position: absolute; top: -8vh;
    width: 14px; height: 9px;
    border-radius: 60% 40% 55% 45%;
    background: var(--blush);
    opacity: .66;
    animation: b-fall linear infinite;
}
.b-pf:nth-child(even) { background: #f3dcd4; width: 11px; height: 7px; }
.b-pf:nth-child(3n) { background: rgba(157, 174, 139, .66); }
@keyframes b-fall {
    0% { transform: translateY(-10vh) rotate(0deg); opacity: 0; }
    12% { opacity: .7; }
    100% { transform: translateY(112vh) translateX(var(--dx, 30px)) rotate(420deg); opacity: 0; }
}

/* ---------------------------------------------- ayırıcı */

.b-div { width: min(72vw, 260px); height: 36px; margin: 22px auto; overflow: visible; }
.b-dl {
    fill: none; stroke: var(--acc2); stroke-width: 1.2; stroke-linecap: round;
    stroke-dasharray: 200; stroke-dashoffset: 200;
}
.b-dc { fill: var(--acc); opacity: 0; }
.pem--bloom.is-open .b-dl { animation: b-draw 1.9s var(--e) forwards; }
.pem--bloom.is-open .b-dc { animation: b-pop .7s var(--e) 1.1s forwards; }
@keyframes b-draw { to { stroke-dashoffset: 0; } }
@keyframes b-pop { to { opacity: 1; } }

/* ---------------------------------------------- bölümler */

.b-doc { position: relative; z-index: 1; }
.b-s--cream {
    background: linear-gradient(180deg, transparent, rgba(247, 237, 230, .86) 14%, rgba(247, 237, 230, .86) 86%, transparent);
}

.b-hero { padding-top: clamp(60px, 12vw, 108px); }
.b-kick {
    font-family: var(--sans);
    font-size: .58rem; letter-spacing: .34em; text-transform: uppercase; color: var(--acc2);
}
.b-names {
    margin: 14px 0 0;
    font-family: var(--script);
    font-size: clamp(3.4rem, 19vw, 7.6rem);
    line-height: .95;
    color: var(--ink);
    font-weight: 400;
}
.b-names i { font-style: normal; color: var(--acc); display: block; font-size: .5em; line-height: .8; }
.b-date {
    font-family: var(--sans);
    font-size: .62rem; letter-spacing: .3em; text-transform: uppercase; opacity: .68;
}

.b-cover {
    position: relative;
    width: min(86vw, 560px);
    margin: clamp(40px, 7vw, 76px) auto 0;
    aspect-ratio: 4 / 5;
    border-radius: 50% 50% 48% 52% / 6% 6% 6% 6%;
    overflow: hidden;
}
.b-cover img {
    width: 100%; height: 100%; object-fit: cover;
    transform: translateY(calc(var(--p, 0) * -22px)) scale(1.08);
    transition: transform .25s linear;
}
.b-cover-leaf {
    position: absolute; inset: 10px;
    border: 1px solid rgba(253, 250, 246, .64);
    border-radius: inherit;
}

.b-h {
    font-family: var(--serif); font-weight: 300;
    font-size: clamp(1.8rem, 7vw, 3rem);
    margin-top: 10px;
}
.b-msg {
    max-width: 44ch; margin: 22px auto 0;
    font-family: var(--serif); font-style: italic;
    font-size: clamp(1.06rem, 3.6vw, 1.3rem); line-height: 1.9; opacity: .82;
}

.pem--bloom .pem-cd { margin-top: 26px; }
.pem--bloom .pem-cd-i b { font-family: var(--serif); color: var(--acc); }
.pem--bloom .pem-cd-i span { color: var(--acc2); }
.pem--bloom .pem-cd-done { font-family: var(--script); font-size: 2rem; color: var(--acc); }

.pem--bloom .pem-venue-n { font-family: var(--serif); font-weight: 300; }
.pem--bloom .pem-extra { border-color: var(--line); background: var(--line); }
.pem--bloom .pem-extra li { background: rgba(255, 255, 255, .8); }
.pem--bloom .pem-extra b { font-family: var(--script); font-size: 1.6rem; color: var(--acc); }

.pem--bloom .pem-story li::before { background: var(--acc2); box-shadow: 0 0 0 4px #fdfaf6; }
.pem--bloom .pem-story h3 { font-family: var(--serif); }
.pem--bloom .pem-story-d { color: var(--acc); }

.pem--bloom .pem-gal-i { border-radius: 46% 46% 44% 44% / 5% 5% 5% 5%; }
.pem--bloom .pem-gal-i:nth-child(even) { border-radius: 4px; }

.pem--bloom .pem-rsvp { max-width: 540px; margin-inline: auto; }
.pem--bloom .pem-inp { background: rgba(255, 255, 255, .72); border-radius: 3px; }
.pem--bloom .pem-btn { border-radius: 3px; }

/* ---------------------------------------------- kapanış */

.b-close { padding-block: clamp(70px, 12vw, 120px); }
.b-close-n {
    font-family: var(--script);
    font-size: clamp(2.6rem, 12vw, 4.4rem);
    color: var(--acc);
}
.b-close-n i { font-style: normal; color: var(--acc2); }
.b-close-t {
    max-width: 36ch; margin: 18px auto 0;
    font-family: var(--serif); font-style: italic; font-size: 1.14rem; line-height: 1.84; opacity: .8;
}
.b-tag { margin-top: 22px; font-family: var(--sans); font-size: .66rem; letter-spacing: .26em; color: var(--acc2); }
.b-sig {
    margin-top: 44px;
    font-family: var(--sans); font-size: .5rem; letter-spacing: .34em; text-transform: uppercase; opacity: .36;
}
