/* =========================================================
   KEWALU.NOIR
   ENVELOPE CATCH + TRUE ALPHA ANIMATED WEBP V6
   ========================================================= */

#kewalu-envelope-drop[hidden],
#kewalu-envelope-modal[hidden],
#kewalu-envelope-winner-stage[hidden] {
    display:none !important;
}

/* ===================== FLIEGENDER UMSCHLAG ===================== */

#kewalu-envelope-drop {
    position:fixed;
    left:auto;
    right:5vw;
    top:auto;
    bottom:12vh;
    z-index:99970;
    width:min(215px,27vw);
    pointer-events:auto;
    transition:
        left .95s cubic-bezier(.22,.72,.25,1),
        top .95s cubic-bezier(.22,.72,.25,1),
        transform .55s ease;
    will-change:left,top,transform;
    animation:
        kewaluEnvelopeArrival
        1.25s
        cubic-bezier(.16,.8,.25,1)
        both;
}

#kewalu-envelope-button {
    display:block;
    width:100%;
    padding:0;
    margin:0;
    border:0;
    background:transparent;
    cursor:pointer;
    filter:drop-shadow(0 18px 30px rgba(0,0,0,.75));
}

#kewalu-envelope-button img {
    display:block;
    width:100%;
    height:auto;
    user-select:none;
    -webkit-user-drag:none;
    transition:transform .20s ease,filter .20s ease;
}

#kewalu-envelope-button:hover img,
#kewalu-envelope-button:focus-visible img {
    transform:scale(1.07);
    filter:drop-shadow(0 0 24px rgba(205,186,150,.46));
}

#kewalu-envelope-button:focus-visible {
    outline:2px solid #CDBA96;
    outline-offset:7px;
    border-radius:18px;
}

#kewalu-envelope-drop.kewalu-caught #kewalu-envelope-button img {
    transform:scale(1.11);
    filter:drop-shadow(0 0 32px rgba(205,186,150,.60));
}

@keyframes kewaluEnvelopeArrival {
    0% {
        opacity:0;
        transform:translate3d(80vw,-20vh,0) rotate(14deg) scale(.70);
    }
    70% {
        opacity:1;
        transform:translate3d(-18px,8px,0) rotate(-4deg) scale(1.04);
    }
    100% {
        opacity:1;
        transform:translate3d(0,0,0) rotate(0) scale(1);
    }
}

/* ===================== NORMALE MELDUNGEN ===================== */

#kewalu-envelope-modal {
    position:fixed;
    inset:0;
    z-index:99990;
    display:grid;
    place-items:center;
    padding:24px;
    background:rgba(5,4,3,.78);
    backdrop-filter:blur(10px);
    -webkit-backdrop-filter:blur(10px);
}

.kewalu-envelope-modal-card {
    width:min(520px,100%);
    padding:30px 28px;
    border:1px solid rgba(205,186,150,.40);
    border-radius:22px;
    background:linear-gradient(180deg,rgba(20,17,14,.99),rgba(8,7,6,.99));
    box-shadow:0 30px 80px rgba(0,0,0,.68);
    text-align:center;
}

.kewalu-envelope-modal-kicker {
    margin-bottom:12px;
    color:#CDBA96;
    font-size:11px;
    letter-spacing:.20em;
    text-transform:uppercase;
}

.kewalu-envelope-modal-card h2 {
    margin:0 0 14px;
    color:#f2eee8;
    font-family:Georgia,"Times New Roman",serif;
    font-size:clamp(27px,5vw,40px);
    font-weight:400;
}

#kewalu-envelope-message {
    margin:0 auto 22px;
    color:#d5cdc2;
    font-size:16px;
    line-height:1.65;
}

#kewalu-envelope-modal-close {
    padding:11px 18px;
    border:1px solid rgba(205,186,150,.48);
    border-radius:10px;
    background:#17130f;
    color:#CDBA96;
    font-weight:700;
    cursor:pointer;
}

/* ===================== GEWINNER-STAGE ===================== */

#kewalu-envelope-winner-stage {
    position:fixed;
    inset:0;
    z-index:100000;
    display:grid;
    place-items:center;
    overflow:hidden;
    padding:18px;
    background:
        radial-gradient(
            circle at center,
            rgba(205,186,150,.08),
            rgba(5,4,3,.86) 58%,
            rgba(3,3,3,.94) 100%
        );
    backdrop-filter:blur(10px);
    -webkit-backdrop-filter:blur(10px);
    opacity:0;
    transition:opacity .35s ease;
}

#kewalu-envelope-winner-stage.is-visible {
    opacity:1;
}

.kewalu-v6-scene {
    --start-x:0px;
    --start-y:0px;
    position:relative;
    width:min(650px,94vw);
    aspect-ratio:1 / 1;
    transform:translate(var(--start-x),var(--start-y)) scale(.34);
    opacity:.35;
    transition:
        transform .72s cubic-bezier(.16,.84,.28,1),
        opacity .42s ease;
}

#kewalu-envelope-winner-stage.is-centered .kewalu-v6-scene {
    transform:translate(0,0) scale(1);
    opacity:1;
}

/* Das ist die echte transparente Animation */
.kewalu-v6-animation {
    position:relative;
    z-index:2;
    display:block;
    width:100%;
    height:100%;
    object-fit:contain;
    background:transparent !important;
    filter:drop-shadow(0 28px 42px rgba(0,0,0,.62));
    pointer-events:none;
    user-select:none;
    -webkit-user-drag:none;
}

/*
 * Glückwunsch liegt ÜBER dem Umschlag,
 * nicht mehr dahinter. Kein zusätzlicher Kasten.
 */
.kewalu-v6-copy {
    position:absolute;
    z-index:5;
    left:13%;
    right:13%;
    top:28%;
    text-align:center;
    pointer-events:none;
    opacity:0;
    transform:translateY(22px) scale(.96);
    transition:
        opacity .55s ease,
        transform .70s cubic-bezier(.18,.82,.24,1);
    text-shadow:
        0 2px 5px rgba(0,0,0,.95),
        0 6px 18px rgba(0,0,0,.72);
}

#kewalu-envelope-winner-stage.show-copy .kewalu-v6-copy {
    opacity:1;
    transform:translateY(0) scale(1);
}

.kewalu-v6-kicker {
    margin-bottom:9px;
    color:#CDBA96;
    font-size:clamp(11px,2.4vw,14px);
    font-weight:700;
    letter-spacing:.19em;
    text-transform:uppercase;
}

.kewalu-v6-title {
    margin:0;
    color:#f4eee7;
    font-family:Georgia,"Times New Roman",serif;
    font-size:clamp(28px,5.4vw,46px);
    line-height:1.00;
    font-weight:400;
}

.kewalu-v6-rise {
    margin:12px 0 12px;
    color:#CDBA96;
    font-size:clamp(21px,4.2vw,32px);
    line-height:1.14;
    font-weight:800;
}

.kewalu-v6-thanks {
    margin:0 auto;
    max-width:430px;
    color:#eee6db;
    font-size:clamp(14px,2.8vw,18px);
    line-height:1.42;
    font-weight:500;
}

.kewalu-v6-thanks strong {
    color:#CDBA96;
}

#kewalu-v6-close {
    position:absolute;
    z-index:10;
    left:50%;
    bottom:1%;
    transform:translateX(-50%) translateY(14px);
    opacity:0;
    pointer-events:none;
    padding:11px 21px;
    border:1px solid rgba(205,186,150,.55);
    border-radius:999px;
    background:rgba(13,11,9,.96);
    color:#CDBA96;
    font-weight:700;
    cursor:pointer;
    transition:opacity .40s ease,transform .40s ease;
}

#kewalu-envelope-winner-stage.show-close #kewalu-v6-close {
    opacity:1;
    pointer-events:auto;
    transform:translateX(-50%) translateY(0);
}

@media (max-width:620px) {
    #kewalu-envelope-drop {
        width:145px;
    }

    .kewalu-v6-scene {
        width:min(470px,96vw);
    }

    .kewalu-v6-copy {
        left:10%;
        right:10%;
        top:27%;
    }

    .kewalu-v6-title {
        font-size:clamp(25px,7vw,36px);
    }

    .kewalu-v6-rise {
        font-size:clamp(19px,5.5vw,27px);
    }

    .kewalu-v6-thanks {
        font-size:clamp(13px,4vw,17px);
    }

    .kewalu-envelope-modal-card {
        padding:26px 20px;
    }
}

@media (prefers-reduced-motion:reduce) {
    #kewalu-envelope-drop,
    .kewalu-v6-scene,
    .kewalu-v6-copy {
        animation:none !important;
        transition:none !important;
    }
}



/* =========================================================
   KEWALU_ENVELOPE_SHARPNESS_V7
   Ziel:
   - Envelope schärfer wirken lassen
   - vorhandene Gewinn-Logik NICHT ändern
   - keine weiße Fläche zurückbringen
   ========================================================= */

.kewalu-v6-scene{
    width:min(520px,90vw) !important;
    aspect-ratio:1 / 1 !important;
}

.kewalu-v6-animation{
    width:100% !important;
    height:100% !important;
    object-fit:contain !important;
    background:transparent !important;
    image-rendering:auto !important;
    -webkit-transform:translateZ(0) !important;
    transform:translateZ(0) !important;
    backface-visibility:hidden !important;
    filter:
        drop-shadow(0 28px 42px rgba(0,0,0,.62))
        contrast(1.02)
        saturate(1.02) !important;
}

.kewalu-v6-copy{
    left:12% !important;
    right:12% !important;
    top:27% !important;
}

.kewalu-v6-kicker{
    font-size:clamp(11px,2.0vw,14px) !important;
}

.kewalu-v6-title{
    font-size:clamp(30px,4.6vw,48px) !important;
    line-height:0.98 !important;
}

.kewalu-v6-rise{
    font-size:clamp(22px,3.6vw,33px) !important;
}

.kewalu-v6-thanks{
    max-width:400px !important;
    font-size:clamp(14px,2.35vw,18px) !important;
    line-height:1.36 !important;
}

@media (max-width:620px){
    .kewalu-v6-scene{
        width:min(430px,94vw) !important;
    }

    .kewalu-v6-copy{
        left:10% !important;
        right:10% !important;
        top:26.5% !important;
    }

    .kewalu-v6-title{
        font-size:clamp(26px,7vw,38px) !important;
    }

    .kewalu-v6-rise{
        font-size:clamp(19px,5.2vw,27px) !important;
    }

    .kewalu-v6-thanks{
        font-size:clamp(13px,3.9vw,17px) !important;
    }
}