/* =========================================
   Image Card Component – Matmoe Modern
   Premium
   ========================================= */

.mm-image-card {
    position: relative;
    display: block;
    width: 100%;
    margin: 0;
    border-radius: 28px;
    overflow: hidden;
    background: #ffffff;
    box-shadow:
        0 24px 60px rgba(15, 23, 42, 0.14),
        0 6px 18px rgba(15, 23, 42, 0.08);
    isolation: isolate;
}

.mm-image-card::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 2;
    pointer-events: none;
    background:
        linear-gradient(
            180deg,
            rgba(255,255,255,0.04) 0%,
            rgba(255,255,255,0) 42%,
            rgba(0,0,0,0.08) 100%
        );
}

.mm-image-card::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 3;
    pointer-events: none;
    border-radius: inherit;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,0.45);
}

.mm-image-card-img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: cover;
    transform: scale(1.001);
    transition: transform 0.45s ease, filter 0.45s ease;
}

@media (hover: hover) and (pointer: fine) {
    .mm-image-card:hover .mm-image-card-img {
        transform: scale(1.045);
        filter: saturate(1.04) contrast(1.02);
    }
}

/* =========================================
   Hero Variante
   ========================================= */

.mm-image-card.is-hero,
.moderation-hero-image,
.corporate-hero-image,
.wedding-hero-image {
    border-radius: 32px;
    box-shadow:
        0 30px 80px rgba(15, 23, 42, 0.18),
        0 10px 28px rgba(15, 23, 42, 0.10);
}

.mm-image-card.is-hero .mm-image-card-img,
.moderation-hero-image .mm-image-card-img,
.corporate-hero-image .mm-image-card-img,
.wedding-hero-image .mm-image-card-img {
    width: 100%;
    height: auto;
    max-height: 720px;
    object-fit: cover;
}

/* =========================================
   Landscape Variante
   ========================================= */

.mm-image-card.is-landscape .mm-image-card-img {
    aspect-ratio: 16 / 10;
    height: 100%;
}

/* =========================================
   Square Variante
   ========================================= */

.mm-image-card.is-square .mm-image-card-img {
    aspect-ratio: 1 / 1;
    height: 100%;
}

/* =========================================
   Soft Variante
   ========================================= */

.mm-image-card.is-soft {
    border-radius: 24px;
    box-shadow:
        0 18px 46px rgba(15, 23, 42, 0.10),
        0 4px 14px rgba(15, 23, 42, 0.06);
}

/* =========================================
   Mobile
   ========================================= */

@media (max-width: 900px) {
    .mm-image-card {
        border-radius: 24px;
    }

    .mm-image-card.is-hero,
    .moderation-hero-image,
    .corporate-hero-image,
    .wedding-hero-image {
        border-radius: 26px;
    }

    .mm-image-card.is-hero .mm-image-card-img,
    .moderation-hero-image .mm-image-card-img,
    .corporate-hero-image .mm-image-card-img,
    .wedding-hero-image .mm-image-card-img {
        min-height: 360px;
        aspect-ratio: 4 / 4.5;
    }
}

@media (max-width: 560px) {
    .mm-image-card {
        border-radius: 22px;
        box-shadow:
            0 18px 42px rgba(15, 23, 42, 0.12),
            0 4px 12px rgba(15, 23, 42, 0.07);
    }

    .mm-image-card.is-hero .mm-image-card-img,
    .moderation-hero-image .mm-image-card-img,
    .corporate-hero-image .mm-image-card-img,
    .wedding-hero-image .mm-image-card-img {
        min-height: 300px;
        aspect-ratio: 4 / 4.2;
    }
}