/* ============================================================
   01 · THE HERITAGE — Old Money
   Koyu orman yesili, bordo, antika altin, eskitilmis ivory.
   ============================================================ */

.pem--heritage {
    --ink: #f2eada;
    --bg: #132619;
    --soft: #1e3a2b;
    --acc: #b69a68;
    --acc2: #6e1d2b;
    --paper: #f2ead9;
    --paper-ink: #22301f;
    --line: rgba(182, 154, 104, .28);
    --serif: "EB Garamond", Georgia, serif;
    --sans: "EB Garamond", Georgia, serif;
    --caps: "Cinzel", Georgia, serif;
    --e: cubic-bezier(.22, .61, .36, 1);

    --grain: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)' opacity='.42'/%3E%3C/svg%3E");

    background:
        radial-gradient(130% 90% at 50% 0%, #1d3726 0%, transparent 58%),
        linear-gradient(175deg, #132619, #0c1b12);
    font-size: 17px;
}

.pem--heritage::before {
    content: ""; position: fixed; inset: 0; z-index: 0;
    background-image: var(--grain);
    opacity: .3; mix-blend-mode: overlay; pointer-events: none;
}

/* ---------------------------------------------- zarf */

.h-open {
    position: fixed; inset: 0; z-index: 60;
    display: grid; place-items: center; align-content: center; gap: 34px;
    background:
        radial-gradient(120% 80% at 50% 36%, #22402d 0%, #0b1810 62%, #060f09 100%);
    transition: opacity 1.1s var(--e), visibility 1.1s;
}
.pem--heritage.is-open .h-open { opacity: 0; visibility: hidden; }

.h-stage { perspective: 1500px; perspective-origin: 50% 40%; }

.h-env {
    position: relative;
    width: min(84vw, 420px);
    aspect-ratio: 1.46 / 1;
    transform-style: preserve-3d;
    transform: rotateX(8deg);
    animation: h-float 7s ease-in-out infinite alternate;
    filter: drop-shadow(0 34px 54px rgba(0, 0, 0, .62));
}
@keyframes h-float { from { transform: rotateX(8deg) translateY(-6px); } to { transform: rotateX(5deg) translateY(8px); } }

.h-env-body, .h-env-front {
    position: absolute; inset: 0;
    background: linear-gradient(160deg, #efe4cd, #d9c8a8 58%, #c8b492);
    background-image: var(--grain), linear-gradient(160deg, #efe4cd, #d9c8a8 58%, #c8b492);
    background-blend-mode: overlay, normal;
}
.h-env-front {
    z-index: 3;
    clip-path: polygon(0 100%, 0 14%, 50% 60%, 100% 14%, 100% 100%);
    box-shadow: inset 0 2px 0 rgba(255, 255, 255, .34);
}
.h-env-front::after {
    content: ""; position: absolute; inset: 0;
    background: linear-gradient(190deg, rgba(0, 0, 0, .14), transparent 42%);
}

.h-flap {
    position: absolute; inset: 0 0 auto; height: 62%;
    z-index: 5;
    transform-origin: top center;
    transform-style: preserve-3d;
    transition: transform 1.25s var(--e) .34s;
    clip-path: polygon(0 0, 100% 0, 50% 100%);
    background: linear-gradient(175deg, #e7dbc2, #cdbb9a);
    background-image: var(--grain), linear-gradient(175deg, #e7dbc2, #cdbb9a);
    background-blend-mode: overlay, normal;
}
.h-flap-in {
    position: absolute; inset: 0;
    background: linear-gradient(0deg, #3d2b1c, #6b4f31);
    opacity: 0; transition: opacity .5s;
    clip-path: polygon(0 0, 100% 0, 50% 100%);
}
.pem--heritage.is-opening .h-flap { transform: rotateX(176deg); }
.pem--heritage.is-opening .h-flap-in { opacity: .5; }

.h-letter {
    position: absolute; left: 5%; right: 5%; top: 7%;
    z-index: 2;
    aspect-ratio: 1.3 / 1;
    display: grid; place-content: center; gap: 10px;
    padding: 18px;
    text-align: center;
    color: var(--paper-ink);
    background: linear-gradient(170deg, #fdf8ec, #f2e8d3);
    box-shadow: 0 10px 26px rgba(0, 0, 0, .2);
    transition: transform 1.35s var(--e) .95s;
}
.pem--heritage.is-opening .h-letter { transform: translateY(-62%) scale(1.04); }

.h-mono {
    font-family: var(--caps); font-size: 1.5rem; letter-spacing: .14em;
}
.h-mono i { font-style: normal; color: var(--acc2); margin: 0 .12em; }
.h-letter-t { font-family: var(--serif); font-style: italic; font-size: .96rem; opacity: .82; }
.h-letter-d {
    font-family: var(--caps); font-size: .6rem; letter-spacing: .3em; text-transform: uppercase;
    color: var(--acc2);
}

.h-seal {
    position: absolute; left: 50%; top: 52%;
    z-index: 8;
    width: 92px; height: 92px;
    transform: translate(-50%, -50%);
    border: 0; padding: 0; cursor: pointer;
    border-radius: 50%;
    background:
        radial-gradient(circle at 36% 30%, #a8303f, #7d1526 56%, #5c0f1c);
    box-shadow: 0 8px 18px rgba(0, 0, 0, .5), inset 0 -3px 8px rgba(0, 0, 0, .42), inset 0 3px 6px rgba(255, 255, 255, .22);
    transition: transform .8s var(--e), opacity .7s;
}
.h-seal::before {
    content: ""; position: absolute; inset: 7px;
    border: 1px solid rgba(255, 220, 200, .34);
    border-radius: 50%;
}
.h-seal-f {
    display: grid; place-items: center; height: 100%;
    font-family: var(--caps); font-size: 1.44rem; letter-spacing: .06em;
    color: #f6dcc9;
    text-shadow: 0 1px 0 rgba(0, 0, 0, .45);
}
.h-seal:hover { transform: translate(-50%, -50%) scale(1.06); }

.h-seal-crack {
    position: absolute; inset: 0;
    background: linear-gradient(104deg, transparent 47%, #3b0a12 48%, #3b0a12 52%, transparent 53%);
    opacity: 0; transform: scale(.4);
    transition: opacity .25s, transform .4s var(--e);
    border-radius: 50%;
}
.pem--heritage.is-opening .h-seal-crack { opacity: 1; transform: scale(1); }
.pem--heritage.is-opening .h-seal {
    animation: h-crack .5s var(--e) forwards;
}
@keyframes h-crack {
    0% { transform: translate(-50%, -50%) scale(1); }
    26% { transform: translate(-50%, -50%) scale(1.14) rotate(-5deg); }
    100% { transform: translate(-50%, -52%) scale(.74) rotate(10deg); opacity: 0; }
}

.h-hint {
    font-family: var(--caps);
    font-size: .6rem; letter-spacing: .36em; text-transform: uppercase;
    color: rgba(242, 234, 218, .6);
}
.h-hint span { animation: h-breathe 3.4s ease-in-out infinite; display: inline-block; }
@keyframes h-breathe { 0%, 100% { opacity: .45; } 50% { opacity: 1; } }
.pem--heritage.is-opening .h-hint { opacity: 0; transition: opacity .4s; }

/* ---------------------------------------------- sayfa */

.h-doc { position: relative; z-index: 1; }

.h-s--paper {
    background: var(--paper);
    background-image: var(--grain), linear-gradient(170deg, #f6eedd, #ece1c9);
    background-blend-mode: overlay, normal;
    color: var(--paper-ink);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .5), inset 0 -1px 0 rgba(0, 0, 0, .12);
}
.h-s--paper { --line: rgba(34, 48, 31, .18); }

/* kitap sayfasi cevirme gecisi */
.pem--heritage .pem-rv.h-turn {
    transform: perspective(1500px) rotateY(-26deg) translateX(-18px);
    transform-origin: left center;
}
.pem--heritage .pem-rv.h-turn.in {
    transform: none;
    transition: transform 1.5s var(--e), opacity 1.1s ease;
}

/* ---------------------------------------------- kahraman */

.h-hero { padding-top: clamp(52px, 10vw, 96px); }

.h-crest {
    display: flex; align-items: center; justify-content: center; gap: 18px;
    width: min(90vw, 620px); margin: 0 auto clamp(26px, 5vw, 44px);
}
.h-crest-l { flex: 1; height: 1px; background: linear-gradient(90deg, transparent, var(--acc)); }
.h-crest-l:last-child { background: linear-gradient(90deg, var(--acc), transparent); }

.h-mono-lg {
    font-family: var(--caps);
    font-size: clamp(1.8rem, 6vw, 2.6rem);
    letter-spacing: .1em;
    color: var(--acc);
}
.h-mono-lg i { font-style: normal; color: var(--acc2); filter: brightness(1.6); margin: 0 .1em; }

.h-kick {
    font-family: var(--caps);
    font-size: .6rem; letter-spacing: .34em; text-transform: uppercase;
    color: var(--acc);
}
.h-names {
    margin: 22px 0 0;
    font-size: clamp(2.3rem, 11vw, 4.6rem);
    line-height: 1.02;
    letter-spacing: -.012em;
}
.h-names em {
    display: block;
    font-family: var(--serif); font-style: italic;
    font-size: .36em; color: var(--acc);
    margin: .18em 0;
}
.h-date {
    margin-top: 24px;
    font-family: var(--caps);
    font-size: .64rem; letter-spacing: .3em; text-transform: uppercase;
    opacity: .82;
}

.h-portrait {
    position: relative;
    width: min(86vw, 520px);
    margin: clamp(40px, 7vw, 70px) auto 0;
    aspect-ratio: 3 / 4;
    overflow: hidden;
}
.h-portrait img {
    width: 100%; height: 100%; object-fit: cover;
    transform: translateY(calc(var(--p, 0) * -22px)) scale(1.07);
    transition: transform .2s linear;
    filter: saturate(.86) contrast(1.04);
}
.h-portrait-f {
    position: absolute; inset: 14px;
    border: 1px solid rgba(242, 234, 218, .4);
    box-shadow: 0 0 0 1px rgba(0, 0, 0, .2);
}

/* ---------------------------------------------- bölüm başlıkları */

.h-eyebrow {
    font-family: var(--caps);
    font-size: .58rem; letter-spacing: .36em; text-transform: uppercase;
    color: var(--acc);
}
.h-title {
    margin-top: 14px;
    font-family: var(--caps);
    font-size: clamp(1.6rem, 6vw, 2.5rem);
    letter-spacing: .02em;
}
.h-orn { display: block; margin: 18px 0; color: var(--acc); font-size: 1rem; }

.h-msg {
    max-width: 46ch; margin: 10px auto 0;
    font-size: 1.08rem; font-style: italic; line-height: 1.86; opacity: .88;
}
.h-fam {
    margin-top: 30px;
    font-family: var(--caps); font-size: .62rem; letter-spacing: .28em; text-transform: uppercase;
    opacity: .7;
}

.pem--heritage .pem-cd-i b { font-family: var(--caps); }
.pem--heritage .pem-cd-i { border-inline-end: 1px solid var(--line); }
.pem--heritage .pem-cd-i:last-child { border: 0; }
.h-cd-s .pem-cd { margin-top: 10px; }

.pem--heritage .pem-venue-n { font-family: var(--caps); letter-spacing: .03em; }
.pem--heritage .pem-extra li { background: rgba(242, 234, 218, .06); }
.pem--heritage .pem-extra b { font-family: var(--caps); font-size: 1rem; letter-spacing: .1em; }

.pem--heritage .pem-story-d { font-family: var(--caps); }
.pem--heritage .pem-story h3 { font-family: var(--caps); font-size: clamp(1.1rem, 4vw, 1.4rem); letter-spacing: .03em; }

.pem--heritage .pem-gal-i { aspect-ratio: 3 / 4; box-shadow: 0 0 0 1px rgba(34, 48, 31, .14); }
.pem--heritage .pem-gal-i img { filter: saturate(.84) sepia(.08); }

.h-rsvp-s .pem-rsvp { max-width: 560px; margin-inline: auto; }
.pem--heritage .pem-inp { background: rgba(242, 234, 218, .08); }
.pem--heritage .pem-inp:focus { background: rgba(242, 234, 218, .14); }
.pem--heritage .pem-btn { font-family: var(--caps); }

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

.h-close {
    padding-block: clamp(70px, 12vw, 120px);
    background: radial-gradient(100% 80% at 50% 100%, #1d3726, transparent 70%);
}
.h-close-t {
    max-width: 38ch; margin: 26px auto 0;
    font-style: italic; font-size: 1.14rem; line-height: 1.8; opacity: .86;
}
.h-tag {
    margin-top: 24px;
    font-family: var(--caps); font-size: .68rem; letter-spacing: .26em;
    color: var(--acc);
}
.h-sig {
    margin-top: 46px;
    font-family: var(--caps); font-size: .52rem; letter-spacing: .34em; text-transform: uppercase;
    opacity: .4;
}
