/* Sakura Management — Ajustes responsive (solo < 992px; desktop intacto) */

/* Resto del sitio público: textura mármol al 50% de opacidad */
body:not(.sakura-home) {
    background-color: #f9f9f7;
    background-image:
        linear-gradient(rgba(249, 249, 247, 0.5), rgba(249, 249, 247, 0.5)),
        url('../img/textures/pale-gray-marble-texture.jpg');
    background-size: cover;
    background-attachment: fixed;
    background-position: center center;
    background-repeat: no-repeat;
}

/* ------------------------------------------------------------------ */
/* Global: overflow, fondo mármol en móvil                              */
/* ------------------------------------------------------------------ */
@media (max-width: 991.98px) {
    body:not(.sakura-home) {
        background-attachment: scroll;
    }
}

/* ------------------------------------------------------------------ */
/* Topbar / navbar                                                      */
/* ------------------------------------------------------------------ */
@media (max-width: 991.98px) {
    .navbar.sticky-top {
        top: 0 !important;
    }

    #slogo {
        margin-left: 0 !important;
        padding-left: clamp(12px, 3vw, 24px) !important;
        flex-shrink: 1;
        min-width: 0;
    }

    #slogo img {
        max-width: min(210px, 62vw) !important;
        height: auto !important;
        margin-left: 0 !important;
    }

    #navbtn {
        position: absolute !important;
        right: 8px !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
        margin-left: 0 !important;
        flex-shrink: 0;
    }

    /* Anula style_public.css: línea gris sobre el contenedor del botón menú */
    .navbar > .navbar-nav {
        border-top: none !important;
    }

    .navbar.navbar-light {
        flex-wrap: nowrap;
        align-items: center;
    }

    #navbarCollapse {
        position: fixed;
        top: var(--sakura-nav-h, 71px);
        left: 0;
        right: 0;
        background-color: #ffffff;
        z-index: 1031;
        width: 100%;
        box-sizing: border-box;
        max-height: calc(100vh - var(--sakura-nav-h, 71px));
        overflow-y: auto;
    }

    #navbarCollapse.show {
        box-shadow: 0 4px 8px rgba(0, 0, 0, 0.08);
    }

    #navbarCollapse .nav-link {
        min-height: 44px;
        display: flex;
        align-items: center;
        padding-top: 0.5rem;
        padding-bottom: 0.5rem;
    }

    #sakura-blog-nav {
        padding-left: clamp(0.75rem, 3vw, 1.5rem) !important;
        padding-right: clamp(0.75rem, 3vw, 1.5rem) !important;
    }

    #sakura-blog-nav #slogo img {
        max-width: min(280px, 85vw) !important;
        margin-left: 0 !important;
    }
}

/* ------------------------------------------------------------------ */
/* Home — hero carousel                                                 */
/* ------------------------------------------------------------------ */
@media (max-width: 991.98px) {
    #myheader .carousel-item {
        height: clamp(420px, 72vh, 600px) !important;
        min-height: 420px;
    }

    #vertical_logo {
        width: clamp(120px, 34vw, 220px) !important;
        height: auto !important;
        left: 8% !important;
        top: 14% !important;
    }
}

@media (max-width: 767.98px) {
    #maintext {
        display: none !important;
    }

    #mobiletext {
        display: block !important;
        position: absolute !important;
        width: 88% !important;
        max-width: 22rem;
        left: 50% !important;
        right: auto !important;
        transform: translateX(-50%) !important;
        top: auto !important;
        bottom: 10% !important;
        font-size: 13px !important;
        line-height: 1.55 !important;
    }
}

/* ------------------------------------------------------------------ */
/* Home — contacto                                                      */
/* ------------------------------------------------------------------ */
@media (max-width: 991.98px) {
    body.sakura-home #contacto {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        height: auto !important;
        min-height: 0 !important;
        padding: 2.5rem 1.25rem 3rem !important;
        margin-top: 0 !important;
    }

    body.sakura-home #contactimg {
        width: min(280px, 72vw) !important;
        height: auto !important;
        aspect-ratio: 1;
        object-fit: contain;
    }

    body.sakura-home #contactform {
        margin: 1.75rem 0 0 !important;
        transform: none !important;
        position: relative !important;
        left: auto !important;
        top: auto !important;
        width: 100% !important;
        max-width: 32rem !important;
        padding: 0 !important;
        box-sizing: border-box;
    }

    body.sakura-home #contactform input,
    body.sakura-home #contactform textarea {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box;
    }

    body.sakura-home #sendmessage {
        width: 100% !important;
        max-width: 14rem;
    }
}

/* ------------------------------------------------------------------ */
/* Listados de talento — grid responsive                                */
/* ------------------------------------------------------------------ */
@media (max-width: 991.98px) {
    .actors-grid {
        grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
        gap: 12px;
        padding: 0 16px 8px;
        box-sizing: border-box;
        --actors-thumb-width: 100%;
        --actors-thumb-height: auto;
    }

    .actors-card {
        width: 100%;
        height: auto;
        aspect-ratio: 280 / 373;
        margin-top: 0;
    }

    #fullscreen .actors-card .actors {
        width: 100%;
        height: 100%;
    }

    #fullscreen .actorimg {
        width: 100%;
        height: 100%;
        max-width: 100%;
        max-height: none;
        object-fit: cover;
    }

    #fullscreen {
        padding: 16px !important;
        box-sizing: border-box;
    }
}

@media (max-width: 575.98px) {
    .actors-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
        padding: 0 12px 8px;
    }

}

/* Tablet: restaurar grid (middlescreen comentado en HTML) */
@media (max-width: 991.98px) and (min-width: 431px) {
    #fullscreen {
        display: block !important;
    }

    #smallscreen {
        display: none !important;
    }

    #middlescreen {
        display: none !important;
    }

    #fullscreen .actors-grid .actors-card:nth-child(2),
    #fullscreen .actors-grid .actors-card:nth-child(4) {
        margin-top: 10px;
    }

    #fullscreen .actors-grid .actors-card:nth-child(5n+6),
    #fullscreen .actors-grid .actors-card:nth-child(5n+8),
    #fullscreen .actors-grid .actors-card:nth-child(5n+10) {
        margin-top: -10px;
    }
}

/* Móvil pequeño: layout single-column existente */
@media (max-width: 430px) {
    #fullscreen {
        display: none !important;
    }

    #smallscreen {
        display: block !important;
        padding: 16px 12px !important;
        box-sizing: border-box;
    }

    #middlescreen {
        display: none !important;
    }

    #fullscreen .actors-grid .actors-card:nth-child(2),
    #fullscreen .actors-grid .actors-card:nth-child(4),
    #fullscreen .actors-grid .actors-card:nth-child(5n+6),
    #fullscreen .actors-grid .actors-card:nth-child(5n+8),
    #fullscreen .actors-grid .actors-card:nth-child(5n+10) {
        margin-top: 0 !important;
    }

    #smallscreen .actors-card {
        margin-top: 0 !important;
        overflow: visible;
    }

    #smallscreen .actors-card .actors {
        overflow: hidden;
    }

    #smallscreen .actors-card.sakura-reveal,
    #smallscreen .actors-card.wow {
        opacity: 1 !important;
        visibility: visible !important;
        transform: none !important;
    }

    #smallscreen .actorimg {
        opacity: 1 !important;
        visibility: visible !important;
    }
}

/* Títulos de sección listados */
@media (max-width: 767.98px) {
    #actorstitle,
    #actresstitle,
    #creativestitle {
        transform: none !important;
        padding: 0 12px;
    }

    #actorstitle img,
    #actresstitle img,
    #creativestitle img {
        width: min(160px, 45vw) !important;
        height: auto !important;
    }

    #titulosContenedor h2 {
        font-size: clamp(1.35rem, 5vw, 2rem) !important;
        line-height: 1.2 !important;
        padding: 0 0.75rem;
    }

    #myactors p br {
        display: none;
    }

    #myactors > div[style*="margin: 3%"] p {
        font-size: 15px !important;
        line-height: 1.55 !important;
        padding: 0 1rem !important;
    }
}

/* ------------------------------------------------------------------ */
/* Perfiles de talento — anular reglas legacy de style_public           */
/* ------------------------------------------------------------------ */
@media (max-width: 991.98px) {
    body.talent-profile-page #infocard {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box;
        padding: 0 1rem;
    }

    body.talent-profile-page #iframe {
        transform: none !important;
        margin: 0 auto !important;
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        min-height: 200px;
    }

    body.talent-profile-page #iframe iframe {
        width: 100% !important;
        height: auto !important;
        aspect-ratio: 16 / 9;
    }

    body.talent-profile-page #viewport {
        width: 100% !important;
        max-width: 100% !important;
        margin-left: 0 !important;
        overflow: hidden;
    }

    body.talent-profile-page #pp01,
    body.talent-profile-page #pp02,
    body.talent-profile-page #pp03,
    body.talent-profile-page #pp04,
    body.talent-profile-page #pp05,
    body.talent-profile-page #pp06,
    body.talent-profile-page #pp07,
    body.talent-profile-page #pp08,
    body.talent-profile-page #pp09,
    body.talent-profile-page #pp10,
    body.talent-profile-page #pp01v,
    body.talent-profile-page #pp02v,
    body.talent-profile-page #pp03v,
    body.talent-profile-page #pp04v,
    body.talent-profile-page #pp05v,
    body.talent-profile-page #pp06v,
    body.talent-profile-page #pp07v,
    body.talent-profile-page #pp08v,
    body.talent-profile-page #pp09v,
    body.talent-profile-page #pp10v {
        width: min(320px, 82vw) !important;
        height: auto !important;
        aspect-ratio: 3 / 4;
        object-fit: cover;
        object-position: center top;
    }

    body.talent-profile-page #leftbtn,
    body.talent-profile-page #rightbtn {
        width: 40px !important;
    }

    body.talent-profile-page #actual_image {
        width: auto !important;
        height: auto !important;
        max-width: 90vw !important;
        max-height: 80vh !important;
        margin-top: 0 !important;
        object-fit: contain;
    }

    body.talent-profile-page #descbox,
    body.talent-profile-page .talent-profile__descbox {
        width: 100% !important;
        margin-left: 0 !important;
        margin-top: 0 !important;
        padding: 0 1rem;
        box-sizing: border-box;
    }

    body.talent-profile-page #desc,
    body.talent-profile-page .talent-profile__desc {
        font-size: 15px !important;
    }

    body.talent-profile-page #preview .preview-stage {
        width: 100%;
        max-width: 100vw;
        box-sizing: border-box;
    }

    body.talent-profile-page #preview .preview-image-wrap {
        position: relative !important;
        display: inline-block !important;
        line-height: 0;
        max-width: 90vw;
    }

    body.talent-profile-page #preview .preview-close {
        position: absolute !important;
        top: 10px !important;
        right: 10px !important;
        left: auto !important;
        bottom: auto !important;
        z-index: 1001 !important;
        width: 36px !important;
        height: 36px !important;
        padding: 6px !important;
        margin: 0 !important;
        border: none !important;
        border-radius: 50% !important;
        background: rgba(0, 0, 0, 0.55) !important;
        cursor: pointer;
        display: flex !important;
        align-items: center;
        justify-content: center;
    }

    body.talent-profile-page #preview .preview-close img {
        width: 18px !important;
        height: 18px !important;
        filter: brightness(0) invert(1);
    }

    body.talent-profile-page #preview .preview-nav {
        width: 40px !important;
        height: auto;
    }

    body.talent-profile-page #preview .preview-nav--prev,
    body.talent-profile-page #preview #leftbtnbg {
        left: 8px !important;
        right: auto !important;
    }

    body.talent-profile-page #preview .preview-nav--next,
    body.talent-profile-page #preview #rightbtnbg {
        right: 8px !important;
        left: auto !important;
    }
}

@media (max-width: 575.98px) {
    body.talent-profile-page #leftbtn {
        left: 4px !important;
    }

    body.talent-profile-page #rightbtn {
        right: 4px !important;
    }
}

/* ------------------------------------------------------------------ */
/* Videos / reels                                                       */
/* ------------------------------------------------------------------ */
@media (min-width: 992px) {
    #videoGrid .videoContainer {
        flex: 0 0 350px;
        max-width: 350px;
        box-sizing: border-box;
        padding: 10px;
    }
}

@media (max-width: 991.98px) {
    #videoGrid {
        display: grid !important;
        flex-wrap: unset !important;
        justify-content: unset !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 12px !important;
        padding: 0 16px 24px !important;
        box-sizing: border-box;
    }

    #videoGrid .videoContainer {
        flex: none !important;
        max-width: 100% !important;
        width: 100% !important;
        box-sizing: border-box;
        padding: 10px;
    }
}

@media (max-width: 575.98px) {
    #videoGrid {
        grid-template-columns: 1fr !important;
    }
}

@media (max-width: 767.98px) {
    #myModal .modal-dialog {
        max-width: 95vw;
        margin: 1rem auto;
    }

    #myModal .modal-body iframe,
    #myModal iframe {
        max-height: 50vh;
    }
}

/* ------------------------------------------------------------------ */
/* Footer y newsletter (todas las páginas públicas)                     */
/* ------------------------------------------------------------------ */
@media (max-width: 767.98px) {
    .newsletter-widget .form-inline {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 0.75rem;
        width: 100%;
    }

    .newsletter-widget .form-inline .form-control,
    #newsemail {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box;
    }

    #newsbtn {
        width: 100% !important;
        max-width: 100% !important;
        margin-top: 0 !important;
        box-sizing: border-box;
    }

    #footertxt {
        font-size: 12px !important;
        margin-left: 0 !important;
        padding: 0 1rem;
        display: block;
    }

    footer.footer .footer-text .img-fluid {
        width: min(200px, 55vw) !important;
    }
}

/* ------------------------------------------------------------------ */
/* Blog — refuerzos sobre responsive.css                                */
/* ------------------------------------------------------------------ */
@media (max-width: 767.98px) {
    body.sakura-blog .header-section .logo img,
    body.sakura-blog .sakura-blog-logo {
        max-width: min(280px, 85vw);
        height: auto;
    }
}

/* ------------------------------------------------------------------ */
/* Modales SweetAlert en móvil                                          */
/* ------------------------------------------------------------------ */
@media (max-width: 575.98px) {
    .swal2-popup {
        width: 94vw !important;
        max-width: 94vw !important;
        padding: 1rem !important;
    }

    .swal2-html-container iframe {
        max-height: 50vh;
    }
}

/* ------------------------------------------------------------------ */
/* Footer rosa — texto oscuro (listados y páginas sin home)             */
/* ------------------------------------------------------------------ */
footer.footer #footertxt,
footer.footer #footertxt a,
footer.footer #newstitle {
    color: #151515 !important;
}

footer.footer .social .fa,
footer.footer .social .fab {
    color: #151515 !important;
}

/* ------------------------------------------------------------------ */
/* Legacy overrides — anular style_public.css en móvil                  */
/* ------------------------------------------------------------------ */
@media (max-width: 480px) {
    #slogo {
        margin-left: 0 !important;
    }

    #contactform {
        transform: none !important;
        top: auto !important;
        left: auto !important;
    }

    #infocard {
        width: 100% !important;
        max-width: 100% !important;
    }

    #actual_image {
        height: auto !important;
        max-width: 90vw !important;
    }
}

@media (max-width: 375px) {
    body {
        overflow-x: hidden;
        width: 100%;
    }
}

/* Blog — imágenes en posts */
@media (max-width: 767.98px) {
    body.sakura-blog .blog-post-content img,
    body.sakura-blog .post-content img,
    body.sakura-blog article img {
        max-width: 100% !important;
        height: auto !important;
    }
}