/**
 * Marco responsive intrínseco — Gestión de Marketing (admin + banner público).
 * Sin letterboxing negro: el contenedor adopta la proporción real del medio.
 */

.mkt-media-frame,
.mb-media-frame {
    position: relative;
    display: block;
    width: 100%;
    max-width: 100%;
    margin-inline: auto;
    border-radius: 12px;
    overflow: hidden;
    background: transparent;
    box-shadow: 0 8px 28px rgba(15, 23, 42, 0.08);
    border: 1px solid rgba(226, 232, 240, 0.95);
    line-height: 0;
    box-sizing: border-box;
}

.mkt-media-frame__inner,
.mb-media-frame__inner {
    display: block;
    width: 100%;
    line-height: 0;
}

.mkt-media-frame img,
.mkt-media-frame video,
.mb-media-frame img,
.mb-media-frame video,
.mb-media-frame .mb-media:not(iframe) {
    display: block;
    width: 100%;
    height: auto;
    max-width: 100%;
    max-height: min(75vh, 560px);
    vertical-align: top;
    background: transparent !important;
    border: none;
    object-fit: unset;
    object-position: center;
}

.mkt-media-frame--embed,
.mb-media-frame--embed {
    width: 100%;
    aspect-ratio: var(--mkt-aspect, 16 / 9);
    height: auto;
    max-width: min(92vw, 560px);
    background: transparent;
}

.mkt-media-frame--embed .mkt-media-frame__inner,
.mb-media-frame--embed .mb-media-frame__inner {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}
.mb-media-frame--embed iframe,
.mkt-media-frame iframe.mkt-embed-preview {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
    background: transparent !important;
    display: block;
}

.mmf-has-intrinsic {
    height: auto;
}

@media (max-width: 767px) {
    .mkt-media-frame img,
    .mkt-media-frame video,
    .mb-media-frame img,
    .mb-media-frame video,
    .mb-media-frame .mb-media:not(iframe) {
        max-height: min(68vh, 460px);
    }
}

@media (max-width: 479px) {
    .mkt-media-frame img,
    .mkt-media-frame video,
    .mb-media-frame img,
    .mb-media-frame video,
    .mb-media-frame .mb-media:not(iframe) {
        max-height: min(62vh, 360px);
    }

    .mkt-media-frame--embed,
    .mb-media-frame--embed {
        max-width: min(94vw, 100%);
    }
}

@media (min-width: 1024px) {
    .mkt-media-frame img,
    .mkt-media-frame video {
        max-height: min(72vh, 600px);
    }
}

/* Banner público: posición central (vídeo / zoom) */
.mb-marketing-banner.pos-center .mb-media-frame {
    max-width: min(94vw, 920px);
}

.mb-marketing-banner.pos-center .mb-media-frame img,
.mb-marketing-banner.pos-center .mb-media-frame video,
.mb-marketing-banner.pos-center .mb-media-frame .mb-media:not(iframe) {
    max-height: min(88vh, 860px);
}

.mb-marketing-banner.pos-center .mb-media-frame--embed {
    max-width: min(94vw, 920px);
    max-height: min(88vh, 860px);
}

@media (max-width: 767px) {
    .mb-marketing-banner.pos-center .mb-media-frame img,
    .mb-marketing-banner.pos-center .mb-media-frame video,
    .mb-marketing-banner.pos-center .mb-media-frame .mb-media:not(iframe),
    .mb-marketing-banner.pos-center .mb-media-frame--embed {
        max-height: min(82vh, 720px);
        max-width: min(96vw, 100%);
    }
}

/* Banner público: vídeo sin controles (Chrome, Firefox, Safari, Edge) */
.mb-marketing-banner video.mb-media {
    pointer-events: none;
    -webkit-user-select: none;
    user-select: none;
    -webkit-touch-callout: none;
    object-fit: contain;
    object-position: center center;
}

.mb-marketing-banner.mb-has-native-video .mb-media-frame {
    position: relative;
    overflow: visible;
    background: transparent;
}

.mb-marketing-banner .mb-media-frame .mb-freeze-frame {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center center;
    z-index: 2;
    pointer-events: none;
}

.mb-marketing-banner.mb-exiting video.mb-media.mb-video-hidden-exit {
    visibility: hidden !important;
    opacity: 0 !important;
}

.mb-marketing-banner video.mb-media::-webkit-media-controls,
.mb-marketing-banner video.mb-media::-webkit-media-controls-panel,
.mb-marketing-banner video.mb-media::-webkit-media-controls-start-playback-button,
.mb-marketing-banner video.mb-media::-webkit-media-controls-play-button,
.mb-marketing-banner video.mb-media::-webkit-media-controls-timeline,
.mb-marketing-banner video.mb-media::-webkit-media-controls-volume-slider,
.mb-marketing-banner video.mb-media::-webkit-media-controls-mute-button,
.mb-marketing-banner video.mb-media::-webkit-media-controls-fullscreen-button {
    display: none !important;
    opacity: 0 !important;
    pointer-events: none !important;
    -webkit-appearance: none;
}

.mb-marketing-banner .mb-media-frame.mb-video-chromeless {
    position: relative;
}

.mb-marketing-banner .mb-media-frame.mb-video-chromeless::after {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background: transparent;
}

.mb-marketing-banner iframe.mb-embed {
    border: 0;
    pointer-events: none;
}

/* Admin: vista previa */
#marketing-section #marketing-media-preview.mkt-preview-has-media {
    min-height: 0;
}

#marketing-section #marketing-media-preview .mkt-media-frame {
    max-width: min(100%, 560px);
}

#marketing-section .mkt-preview-placeholder {
    color: #64748b;
    font-size: 0.86rem;
    text-align: center;
    padding: 12px 8px;
    line-height: 1.45;
}