/* Shared card geometry and typography: card width, not page or viewport. */
.me-card {
    display: block;
    position: relative;
    container-type: inline-size;
    isolation: isolate;
    overflow: hidden;
    aspect-ratio: 4 / 5;
    text-decoration: none;
    color: #fff;
    border-radius: 4px 4px 0 0;
}
.me-card .me-card-image {
    display: block;
    width: 100%;
    height: 100%;
    aspect-ratio: 4 / 5;
    object-fit: cover;
    border-radius: inherit;
}
.me-card > .me-card-caption {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    padding: 0 3% 5% !important;
    display: flex;
    flex-flow: column nowrap;
    justify-content: flex-end;
    align-items: center;
    gap: 0;
    text-align: center;
    pointer-events: none;
    background: linear-gradient(180deg, rgba(31,41,62,0) 20%, rgba(31,41,62,.9) 65%, #1F293E 75.07%);
}
.me-card > .me-card-caption p {
    width: 100%;
    margin: 0;
    max-width: 100%;
    overflow-wrap: normal;
    text-wrap: balance;
    font-family: "Helvetica", sans-serif;
    text-transform: uppercase;
    text-shadow: 0 4px 8px #000;
}
.me-card > .me-card-caption .name-ponente {
    font-size: clamp(13px, 9.6cqw, 36px) !important;
    font-weight: 400;
    line-height: 1.06;
    letter-spacing: .025em;
    color: #FFBC2B;
}
.me-card > .me-card-caption .name-ponente strong { font-weight: 700; }
.me-card > .me-card-caption .city-ponente,
.me-card > .me-card-caption .city-ponente.city-medium,
.me-card > .me-card-caption .city-ponente.city-large {
    font-size: clamp(22px, 13.3cqw, 50px) !important;
    font-weight: 700;
    line-height: 1.02;
    letter-spacing: .025em;
    margin: .12em 0 .18em;
    color: #fff;
}
.me-card > .me-card-caption .date-ponente {
    font-size: clamp(11px, 7.6cqw, 28px) !important;
    font-weight: 300;
    line-height: 1.15;
    letter-spacing: .015em;
    color: #fff;
}
.me-card > .me-card-caption .date-ponente span { font: inherit; text-transform: none; }
.me-card > .me-card-caption .proximamente { font-size: clamp(11px, 7.6cqw, 28px) !important; }
.me-card > .me-card-caption .avisame { width: auto; font-size: clamp(10px, 6cqw, 20px) !important; margin: 0 0 .5em; }
/* Preserve the existing full-card seal assets and their transparent margins. */
.me-card > .box_entradas-desktop,
.me-card > .box_special-prices {
    width: 65% !important;
    height: auto !important;
    aspect-ratio: 4 / 5;
    position: absolute;
    inset: 0 0 auto auto;
    z-index: 1;
    pointer-events: none;
    /* Preserve the source graphic ratio, independently of the card height. */
    background-size: auto 100% !important;
    background-position: top right !important;
    background-repeat: no-repeat;
}
.me-card:focus-visible { outline: 3px solid #FFBC2B; outline-offset: -3px; }
.me-card-slide > .me-card { width: 100%; }
.me-card-slide > .botonapunta { display: block; text-align: center; }

/* Speaker portraits are a declared variant, not page-specific rules. */
.me-card:has(> .me-card-image[data-me-card-ratio="landscape"]) {
    aspect-ratio: 485 / 350;
    height: auto;
    min-height: 0;
}
.me-card > .me-card-image[data-me-card-ratio="landscape"] {
    aspect-ratio: 485 / 350;
    height: auto;
}

/* Reserve the final card geometry while the slider script is still loading. */
.slider-cities { position: relative; overflow: hidden; }
.slider-cities:not(.swiper-initialized) > .swiper-wrapper > .swiper-slide {
    width: calc(45.454545% - 5.454545px);
    margin-right: 10px;
}
@media (min-width: 990px) {
    .slider-cities:not(.swiper-initialized) > .swiper-wrapper > .swiper-slide {
        width: calc(22.222222% - 11.666667px);
        margin-right: 15px;
    }
}
/* Render the first hero as a static image until autoplay becomes available. */
#HomeSlider:not(.swiper-initialized) { opacity: 1; }
