@charset "UTF-8";
/*
 * Estrel Tower — Event Card Grid (Meetings & Events)
 * Figma 467:7329 ("Weitere Zimmer / Mögliche Eventformate")
 * 4 cards 553×425, dark navy bg #14172D r=4, image top + 2 tags below, title, 2 CTAs
 */

.estrel-event-card-grid {
    container-type: inline-size;
    --u: calc(min(100vw, 1920px) / 1920);
    --evt-navy: #14172D;
    --evt-cream: #FEF5EC;
    --evt-pink: #FED3CD;
    padding: calc(80 * var(--u)) calc(91 * var(--u));
    width: 100%;
}

.estrel-event-card-grid__heading {
    text-align: center;
    margin-bottom: calc(40 * var(--u));
    font-family: var(--font-soehne);
    font-weight: 400;
    font-size: calc(24 * var(--u));
    line-height: calc(32 * var(--u));
    color: var(--evt-navy);
}

.estrel-event-card-grid__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: calc(12 * var(--u));
    max-width: calc(2261 * var(--u));
    margin-inline: auto;
}

.estrel-event-card-grid__item {
    min-width: 0;
}

.estrel-event-card-grid__card {
    position: relative;
    background: var(--evt-navy);
    color: var(--evt-cream);
    border-radius: calc(4 * var(--u));
    overflow: hidden;
    aspect-ratio: 553 / 425;
    padding: calc(4 * var(--u)) calc(8 * var(--u)) calc(20 * var(--u));
    display: flex;
    flex-direction: column;
}

.estrel-event-card-grid__media {
    width: 100%;
    aspect-ratio: 544 / 286;
    border-radius: calc(2 * var(--u));
    overflow: hidden;
    background: #D9D9D9;
    margin-bottom: calc(7 * var(--u));
}
.estrel-event-card-grid__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.estrel-event-card-grid__title {
    margin: 0 0 calc(8 * var(--u));
    font-family: var(--font-soehne);
    font-weight: 400;
    font-size: calc(19 * var(--u));
    line-height: calc(38 * var(--u));
    color: var(--evt-cream);
}

.estrel-event-card-grid__tags {
    list-style: none;
    margin: 0 0 calc(16 * var(--u));
    padding: 0;
    display: flex;
    gap: calc(38 * var(--u));
}

.estrel-event-card-grid__tag {
    display: inline-flex;
    align-items: center;
    gap: calc(6 * var(--u));
    color: var(--evt-cream);
    font-family: var(--font-soehne);
    font-weight: 300;
    font-size: calc(12 * var(--u));
    line-height: calc(14.4 * var(--u));
}
.estrel-event-card-grid__tag-icon {
    flex-shrink: 0;
    width: calc(22 * var(--u));
    height: calc(22 * var(--u));
}
.estrel-event-card-grid__tag:last-child .estrel-event-card-grid__tag-icon {
    width: calc(16 * var(--u));
    height: calc(16 * var(--u));
}

.estrel-event-card-grid__ctas {
    margin-top: auto;
    display: flex;
    gap: calc(13 * var(--u));
    align-items: center;
}

.estrel-event-card-grid__cta-primary,
.estrel-event-card-grid__cta-secondary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: calc(25 * var(--u));
    padding: 0 calc(18 * var(--u));
    border-radius: calc(41.5 * var(--u));
    font-family: var(--font-alpina);
    font-style: italic;
    font-weight: 250;
    font-size: calc(16 * var(--u));
    line-height: calc(22 * var(--u));
    letter-spacing: calc(1.76 * var(--u));
    text-decoration: none;
    white-space: nowrap;
    border: 0;
    transition: background 0.2s ease, color 0.2s ease;
}
.estrel-event-card-grid__cta-primary {
    background: var(--evt-pink);
    color: var(--evt-navy);
    min-width: calc(177 * var(--u));
}
.estrel-event-card-grid__cta-primary:hover {
    background: var(--evt-cream);
}
.estrel-event-card-grid__cta-secondary {
    background: transparent;
    color: var(--evt-pink);
    border: calc(1 * var(--u)) solid var(--evt-pink);
    min-width: calc(190 * var(--u));
}
.estrel-event-card-grid__cta-secondary:hover {
    background: var(--evt-pink);
    color: var(--evt-navy);
}

/* Tablet */
@media (max-width: 1024px) {
    .estrel-event-card-grid {
        --u: calc(100cqi / 1024);
        padding: calc(48 * var(--u)) calc(36 * var(--u));
    }
    .estrel-event-card-grid__list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: calc(20 * var(--u));
    }
    .estrel-event-card-grid__title { font-size: calc(20 * var(--u)); line-height: 1.3; margin-bottom: calc(12 * var(--u)); }
    .estrel-event-card-grid__tag { font-size: calc(13 * var(--u)); }
    .estrel-event-card-grid__cta-primary,
    .estrel-event-card-grid__cta-secondary {
        font-size: calc(14 * var(--u));
        height: calc(36 * var(--u));
        min-width: 0;
        flex-shrink: 1;
    }
}

/* Mobile */
@media (max-width: 768px) {
    .estrel-event-card-grid {
        --u: calc(100cqi / 375);
        padding: calc(32 * var(--u)) calc(20 * var(--u));
    }
    .estrel-event-card-grid__list {
        grid-template-columns: minmax(0, 1fr);
        gap: calc(16 * var(--u));
    }
    .estrel-event-card-grid__card {
        aspect-ratio: auto;
        padding: calc(8 * var(--u)) calc(12 * var(--u)) calc(20 * var(--u));
    }
    .estrel-event-card-grid__heading {
        font-size: calc(18 * var(--u));
        line-height: calc(26 * var(--u));
        margin-bottom: calc(20 * var(--u));
    }
    .estrel-event-card-grid__title {
        font-size: calc(20 * var(--u));
        line-height: calc(28 * var(--u));
        margin-bottom: calc(8 * var(--u));
    }
    .estrel-event-card-grid__tags {
        gap: calc(20 * var(--u));
        margin-bottom: calc(20 * var(--u));
    }
    .estrel-event-card-grid__ctas {
        flex-direction: column;
        align-items: stretch;
        gap: calc(10 * var(--u));
    }
    .estrel-event-card-grid__cta-primary,
    .estrel-event-card-grid__cta-secondary {
        width: 100%;
        height: calc(40 * var(--u));
        font-size: calc(13 * var(--u));
    }
}