/*
 * Public production mirror overrides.
 *
 * Keep selectors page-scoped. The mirrored HTML/CSS is captured from the live
 * production site, so corrections here should avoid changing unrelated pages.
 */

body#page-27 .md-hero-banner-1__background {
    left: 50%;
    right: auto;
    width: 100vw;
    max-width: none;
    height: calc(100vw * 0.7875);
    min-height: 100%;
    top: 0;
    background-size: 100% auto;
    background-position: center top;
    transform: translateX(-50%);
}

body#page-27 .md-hero-banner-1 {
    overflow: visible;
}

body#page-27 .md-hero-banner-1 + .studio-custom-container {
    background: transparent !important;
}

@media (min-width: 992px) {
    body#page-27 .md-hero-banner-1__reviews-container {
        width: fit-content;
        max-width: calc(100vw - 260px);
        padding: 14px 18px;
        background: #fff;
        border: 1px solid rgba(17, 24, 39, 0.06);
        border-radius: 18px;
        box-shadow: 0 14px 35px rgba(17, 24, 39, 0.08);
    }

    body#page-27 .md-hero-banner-1__reviews-container,
    body#page-27 .md-hero-banner-1__reviews-container-card,
    body#page-27 .avatar-group {
        overflow: visible;
    }

    body#page-27 .avatar-group .avatar {
        position: relative;
        overflow: visible;
        cursor: default;
        border: 2px solid rgba(255, 255, 255, 0.86);
        transition:
            transform 160ms ease,
            border-color 160ms ease,
            box-shadow 160ms ease,
            background-color 160ms ease;
    }

    body#page-27 .avatar-group .avatar img {
        border-radius: inherit;
    }

    body#page-27 .avatar-group .avatar:hover {
        z-index: 30;
        transform: translateY(-5px) scale(1.06);
        background: #fff;
        border-color: #fff;
        box-shadow:
            0 16px 34px rgba(17, 24, 39, 0.16),
            0 0 0 1px rgba(17, 24, 39, 0.08);
    }

    body#page-27 .avatar-group .avatar::before,
    body#page-27 .avatar-group .avatar::after {
        position: absolute;
        left: -8px;
        z-index: 35;
        pointer-events: none;
        opacity: 0;
        transform: translateY(6px);
        transition:
            opacity 160ms ease,
            transform 160ms ease;
    }

    body#page-27 .avatar-group .avatar::before {
        bottom: -36px;
        padding: 7px 11px;
        color: #152433;
        font-size: 11px;
        font-weight: 600;
        line-height: 1;
        white-space: nowrap;
        background: #fff;
        border: 1px solid rgba(17, 24, 39, 0.08);
        border-radius: 12px;
        box-shadow: 0 10px 24px rgba(17, 24, 39, 0.12);
    }

    body#page-27 .avatar-group .avatar::after {
        bottom: 58px;
        width: 238px;
        padding: 10px 12px;
        color: #344155;
        font-size: 11px;
        font-weight: 500;
        line-height: 1.35;
        text-align: left;
        white-space: normal;
        background: #fff;
        border: 1px solid rgba(17, 24, 39, 0.08);
        border-radius: 14px 14px 14px 4px;
        box-shadow: 0 14px 32px rgba(17, 24, 39, 0.14);
    }

    body#page-27 .avatar-group .avatar:nth-child(1)::before {
        content: "InnaShop";
    }

    body#page-27 .avatar-group .avatar:nth-child(1)::after {
        content: "Platforma eCommerce optimizata pentru fluxuri rapide si experienta coerenta de cumparare.";
    }

    body#page-27 .avatar-group .avatar:nth-child(2)::before {
        content: "ROT Resort";
    }

    body#page-27 .avatar-group .avatar:nth-child(2)::after {
        content: "Prezenta digitala construita pentru claritate, incredere si conversii din trafic relevant.";
    }

    body#page-27 .avatar-group .avatar:nth-child(3)::before {
        content: "Ereonparts";
    }

    body#page-27 .avatar-group .avatar:nth-child(3)::after {
        content: "Prezenta comerciala structurata pentru catalog, incredere si cereri mai clare.";
    }

    body#page-27 .avatar-group .avatar:nth-child(4)::before {
        content: "Butasideromania";
    }

    body#page-27 .avatar-group .avatar:nth-child(4)::after {
        content: "Optimizare si claritate pentru servicii, produse si trafic organic relevant.";
    }

    body#page-27 .avatar-group .avatar:nth-child(5)::before {
        content: "Imobiliare Salaj";
    }

    body#page-27 .avatar-group .avatar:nth-child(5)::after {
        content: "Structura digitala orientata spre listari, cautare si conversii locale.";
    }

    body#page-27 .avatar-group .avatar:nth-child(6)::before {
        content: "Aragold";
    }

    body#page-27 .avatar-group .avatar:nth-child(6)::after {
        content: "Experienta vizuala coerenta pentru brand, produse si comunicare online.";
    }

    body#page-27 .avatar-group .avatar:nth-child(7)::before {
        content: "Expert Alpin";
    }

    body#page-27 .avatar-group .avatar:nth-child(7)::after {
        content: "Prezentare clara pentru servicii specializate si solicitari comerciale directe.";
    }

    body#page-27 .avatar-group .avatar:nth-child(8)::before {
        content: "Clienti verificati";
    }

    body#page-27 .avatar-group .avatar:nth-child(8)::after {
        content: "Feedback consolidat din proiecte livrate si colaborari active.";
    }

    body#page-27 .avatar-group .avatar:hover::before,
    body#page-27 .avatar-group .avatar:hover::after {
        opacity: 1;
        transform: translateY(0);
    }
}