/* =========================================
   Block: Portrait-Bild mit Deko-Akzent (kss/lswn-portrait-bild)
   Entspricht .fn-story-img-wrap/.fn-story-img/.fn-story-deco aus feines.html.
   ========================================= */

.lswn-portrait-bild {
    position: relative;
    max-width: 480px;
    margin-inline: auto;
}

.lswn-portrait-bild__frame {
    position: relative;
    aspect-ratio: 4 / 5;
    border-radius: var(--lswn-radius-lg);
    overflow: hidden;
    box-shadow: 0 24px 48px -24px rgba(86, 36, 47, .24);
    background: linear-gradient(158deg, var(--lswn-rose-md) 0%, var(--lswn-rose-lt) 48%, var(--lswn-rose) 100%);
    display: flex;
    align-items: center;
    justify-content: center;
}

.lswn-portrait-bild__img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.lswn-portrait-bild__ph {
    opacity: .22;
}
.lswn-portrait-bild__ph circle,
.lswn-portrait-bild__ph path {
    fill: none;
    stroke: var(--lswn-wine);
    stroke-width: 1.2;
}

.lswn-portrait-bild__deco {
    position: absolute;
    bottom: -18px;
    right: -18px;
    width: 110px;
    height: 110px;
    border-radius: var(--lswn-radius-md);
    background: rgba(229, 170, 179, .45);
    z-index: -1;
}

@media (max-width: 640px) {
    .lswn-portrait-bild__frame {
        aspect-ratio: 16 / 9;
        border-radius: var(--lswn-radius-md);
    }
    .lswn-portrait-bild__deco { display: none; }
}
