/* =========================================================
   BARBER AREIA — HERO SLIDER
   BOX COMPACTO + FOTO INTEIRA
========================================================= */

/*
   Mantém o tamanho antigo do principal.
   Não deixa o slider aumentar o Hero.
*/
#inicio .barber-hero-slider{
    position:relative !important;

    width:100% !important;
    max-width:465px !important;

    height:310px !important;
    min-height:0 !important;
    max-height:310px !important;

    aspect-ratio:auto !important;

    margin:0 !important;
    padding:0 !important;

    overflow:hidden !important;

    border:2px solid rgba(255,255,255,.92) !important;
    border-radius:23px !important;

    background:
        rgba(1,21,56,.55) !important;

    box-shadow:
        0 18px 45px rgba(0,0,0,.22) !important;
}


/*
   Área interna ocupa exatamente o box.
*/
#inicio .barber-hero-slider .barber-hero-slides{
    position:relative !important;

    width:100% !important;
    height:100% !important;

    min-height:0 !important;
    max-height:none !important;

    aspect-ratio:auto !important;

    margin:0 !important;
    padding:0 !important;

    overflow:hidden !important;

    border-radius:20px !important;
}


/*
   FOTOS INTEIRAS.

   contain = não corta nenhuma parte da imagem.
*/
#inicio .barber-hero-slider .barber-hero-slide{
    position:absolute !important;

    inset:0 !important;

    display:block !important;

    width:100% !important;
    height:100% !important;

    max-width:100% !important;
    max-height:100% !important;

    margin:0 !important;
    padding:0 !important;

    aspect-ratio:auto !important;

    object-fit:contain !important;
    object-position:center center !important;

    border:0 !important;
    border-radius:0 !important;

    box-shadow:none !important;

    transform:none !important;

    opacity:0 !important;
    visibility:hidden !important;

    background:transparent !important;

    transition:
        opacity 1s ease,
        visibility 1s ease !important;
}


#inicio .barber-hero-slider .barber-hero-slide.is-active{
    opacity:1 !important;
    visibility:visible !important;

    transform:none !important;

    z-index:2 !important;
}


/*
   Remove efeitos antigos que poderiam
   aumentar visualmente o container.
*/
#inicio .barber-hero-slider::before,
#inicio .barber-hero-slider::after,
#inicio .barber-hero-slides::before,
#inicio .barber-hero-slides::after{
    display:none !important;
    content:none !important;
}


/* indicadores */

#inicio .barber-hero-dots{
    bottom:10px !important;
}


/* =========================================================
   RESPONSIVO
========================================================= */

@media(max-width:850px){

    #inicio .barber-hero-slider{
        width:min(100%,465px) !important;

        height:auto !important;
        max-height:none !important;

        aspect-ratio:465 / 310 !important;

        margin-left:auto !important;
        margin-right:auto !important;
    }

}


@media(max-width:500px){

    #inicio .barber-hero-slider{
        width:100% !important;

        height:auto !important;

        aspect-ratio:465 / 310 !important;

        border-radius:18px !important;
    }

    #inicio .barber-hero-slider .barber-hero-slides{
        border-radius:16px !important;
    }

}