/* HEADER */
header { 
    position: relative;
    background: url(../img/slider-02.png);
    background-position: top;
    background-repeat: no-repeat;
    background-size: cover;
    padding-top: 3rem;
    padding-bottom: 10rem;
    height: 800px;
}

header .navbar { background: #ffffffe0; padding: 1.5rem 4rem; border-radius: 10rem; }
header .navbar img { max-width: 330px; }
header .navbar a:not(.logo) { transition: .2s; color: var(--color-font-dark); font-weight: 600; margin: 0 10px 0 10px; padding-bottom: 6px; font-size: 1.15rem; border-bottom: 5px solid transparent; }
header .navbar a:hover:not(.logo) { transition: .2s; border-color: #1194cd; }
header .navbar .mobile { display: none; }

header .header-content { text-align: center; margin-top: 12rem; }
header .header-content * { color: var(--color-font-light); }
header .header-content h2 { font-family: "Montserrat Alternates", sans-serif; font-style: italic; font-weight: 800; font-size: 3.3rem; margin-bottom: 0; }
header .header-content p { font-size: 1.35rem; font-weight: 600; }
header .header-content .mouse-cursor { 
    max-width: 30px; 
    transform: translate(-50%, -50%); 
    animation: jump 1s infinite alternate; 
    position: absolute;
    top: 72%;
    left: 50%;
}
header .header-content .btn-whatsapp-conversion { 
    background-color: var(--btn-whatsapp) !important;
    transform: translate(-50%, -50%); 
    animation: jump 1s infinite alternate; 
    position: absolute;
    top: 67%;
    left: 50%;
    border: 1px solid #ebf6fc;
    padding: 16px 3rem !important;
    font-size: 1.3rem;
    font-weight: bold;
    border-radius: 5rem !important;
}
header .header-content .btn-whatsapp-conversion i { 
    font-size: 1.4rem;
    margin-right: 6px;
}
header .header-content .btn-whatsapp-conversion:hover { 
    background-color: var(--btn-whatsapp-hover) !important; 
    color: var(--color-font-light) !important; 
}

header .svg_footer { bottom: -27px !important; }

@keyframes jump {
    0% { transform: translate(-50%, -50%) translateY(0); }
    50% { transform: translate(-50%, -50%) translateY(-10px); }
    100% { transform: translate(-50%, -50%) translateY(0); }
}


@media(max-width:1399px) {
    header .svg_footer { bottom: -2.3rem !important; }
}
@media(max-width:1199px) {
    header { height: 770px; }
    header .navbar img { max-width: 280px; }
    header .navbar { padding: 1.2rem 3rem; }
    header .navbar a:not(.logo) { font-size: 1rem; margin: 0 9px 0 9px; }
    header .svg_footer { bottom: -2.9rem !important; }
}
@media(max-width:991px) {
    header { padding-top: 2rem; padding-bottom: 6rem; height: 700px; }
    header .navbar { justify-content: center; }
    header .navbar img { max-width: 300px; margin-bottom: 2rem; }
    header .navbar a:not(.logo) { font-size: 1.05rem; }
    header .header-content { margin-top: 7rem; }
    header .header-content h2 { font-size: 3rem; }
    header .header-content p { font-size: 1.25rem; }
    header .svg_footer { bottom: -3.6rem !important; }
    header .header-content .btn-whatsapp-conversion { padding: 16px 2rem !important; }
}
@media(max-width:767px) {
    header { height: 600px; }
    header .navbar .mobile { display: block; background: var(--color-secondary); line-height: initial; }
    header .navbar .mobile i { color: var(--color-font-light); font-size: 1.35rem; }
    header .navbar .mobile:hover { background: var(--color-secondary-hover); }
    header .navbar { justify-content: space-between; padding: 1.5rem; border-radius: 2rem; background: #ffffffa6; }
    header .navbar img { max-width: 260px; margin-bottom: 0rem; }
    header .navbar nav { 
        display: none;
        position: absolute;
        width: 94%;
        padding: 1rem 2rem;
        background: var(--color-secondary);
        border-radius: 1.25rem;
        margin-top: 52%;
        left: 3%;
        transition: .3s ease-in-out;
        transform: translateY(-100%);
    }
    header .navbar nav.show { display: block; transform: translateY(0); }
    header .navbar a:not(.logo) { display: block; color: var(--color-font-light); font-size: 1rem; margin: 0; border: 0; padding: 2px 0; }
    header .navbar a:not(.logo):hover { color: var(--color-primary) !important; }
    header .header-content { margin-top: 8rem; }
    header .header-content h2 { font-size: 2.35rem; }
    header .header-content p { font-size: 1.15rem; }
    header .header-content .mouse-cursor { top: 78%; }
    header .svg_footer { bottom: -4.2rem !important; }
    header .header-content .btn-whatsapp-conversion { top: 75%; min-width: 375px; }
}
@media(max-width:575px) {
    header { padding-top: 0rem; padding-bottom: 3rem; height: 500px; }
    header .navbar { padding: 1rem; border-radius: 0; }
    header .navbar nav { margin-top: 18rem; }
    header .header-content { margin-top: 7rem; }
    header .header-content h2 { font-size: 1.75rem; }
    header .header-content p { font-size: 1rem; }
    header .header-content .mouse-cursor { top: 80%; }
    header .svg_footer { bottom: -5rem !important; }
}
@media(max-width:449px) {
    header .navbar img { max-width: 200px; }
}
@media(max-width:399px) {
    header .header-content .btn-whatsapp-conversion {
        top: 75%;
        min-width: 90%;
        font-size: 1rem;
        padding: 15px 1rem !important;
    }
}


/* SOBRE */
#sobre { padding-top: 5rem; padding-bottom: 5rem; }
#sobre p { font-size: 1.25rem; font-weight: 500; }
#sobre .video { margin-bottom: 3rem; }
#sobre .video h3 { font-style: italic; font-weight: 800; font-size: 2.4rem; margin-bottom: 1.5rem; }
#sobre .video iframe { width: 70%; margin: 0 15%; border-radius: 3rem; }
#sobre .social h3 { font-style: italic; font-weight: 700; font-size: 1.8rem; margin-bottom: 1.5rem; }
#sobre .social img { max-height: 55px; margin: 0px 12px; transition: .3s; }
#sobre .social img:hover { transition: .3s; transform: scale(1.2); }

.sobre h2 { margin-bottom: 2rem; }
.sobre video { width: 90%; margin: 0 6%; border: 16px solid #387db9; border-radius: 2rem; }
.sobre h3 { font-size: 1.6rem; }

@media(max-width:991px) {
    #sobre { padding-bottom: 3rem; }
    #sobre .conheca img { width: 70%; margin: 0 15% 2rem; }
    #sobre .video iframe { width: 80%; margin: 0 10%; border-radius: 2rem; }
}
@media(max-width:767px) {
    #sobre .video h3 { font-size: 2.2rem; }
    #sobre .video iframe { width: 90%; margin: 0 5%; }
    #sobre .social h3 { font-size: 1.5rem; }
}
@media(max-width:575px) {
    #sobre .conheca img { width: 90%; margin: 0 5% 2rem; }
    #sobre p { font-size: 1.15rem; }
    #sobre .video h3 { font-size: 1.9rem; }
    #sobre .social h3 { font-size: 1.25rem; }
    #sobre .social img { max-height: 48px; }
}



/* SOBRE */
.sobre-video { padding-top: 0rem; padding-bottom: 5rem; position: relative; }
.sobre-video p { font-size: 1.25rem; font-weight: 500; }
.sobre-video .social h3 { font-style: italic; font-weight: 700; font-size: 1.8rem; margin-bottom: 1.5rem; }
.sobre-video .social img { max-height: 55px; margin: 0px 12px; transition: .3s; }
.sobre-video .social img:hover { transition: .3s; transform: scale(1.2); }

.sobre-video h2 { margin-bottom: 2rem; }
.sobre-video h3 { font-size: 1.4rem; }
.sobre-video video { width: 90%; margin: 0 6%; border: 16px solid #387db9; border-radius: 2rem; }

.sobre-video .btn-whatsapp-conversion { 
    background-color: var(--btn-whatsapp) !important;
    transform: translate(-50%, -50%); 
    animation: jump 2s infinite alternate; 
    position: absolute;
    bottom: 0%;
    left: 50%;
    border: 1px solid #ebf6fc;
    padding: 16px 3rem !important;
    font-size: 1.3rem;
    font-weight: bold;
    border-radius: 5rem !important;
    min-width: 410px !important;
}
.sobre-video .btn-whatsapp-conversion i { 
    font-size: 1.4rem;
    margin-right: 6px;
    color: var(--color-font-light) !important;
}
.sobre-video .btn-whatsapp-conversion:hover { 
    background-color: var(--btn-whatsapp-hover) !important; 
    color: var(--color-font-light) !important; 
}

@media(max-width:1199px) {
    .sobre-video video { width: 100%; margin: 0; border: 14px solid #387db9; border-radius: 2rem; }
}
@media(max-width:991px) {
    .sobre-video video { margin-top: 2rem; }
}
@media(max-width:449px) {
    .sobre-video .btn-whatsapp-conversion { 
        padding: 15px 1rem !important;
        font-size: 1.1rem;
        min-width: 95% !important;
    }
}


/* SERVICOS */
#servicos {
    position: relative;
    background: url(../img/bg-servicos.png);
    background-position: top;
    background-repeat: no-repeat;
    background-size: cover;
    padding-top: 15rem;
    padding-bottom: 15rem;
}
#servicos * { color: var(--color-font-light); }
#servicos h2 { margin-bottom: 1.2rem; }
#servicos p { font-size: 1.45rem; font-weight: 500; margin-bottom: 3rem; }

#servicos article { text-align: center; padding: 1.3rem 1rem; min-height: 465px; display: flex; justify-content: space-between; align-items: center; flex-direction: column; }
#servicos article h3 { font-size: 1.5rem; font-weight: 600; margin-bottom: 1.3rem; margin-top: 1rem; }
#servicos article .button-primary { padding: 6px 35px !important; }

#servicos .svg_header { top: -1px; }
#servicos .svg_footer { bottom: -1.7rem; }

@media(max-width:1399px) {
    #servicos article { min-height: 415px; }
    #servicos article h3 { font-size: 1.4rem; }
    #servicos .svg_footer { bottom: -2.25rem; }
}
@media(max-width:1199px) {
    #servicos { padding-top: 12rem; padding-bottom: 12rem; }
    #servicos p { font-size: 1.15rem; margin-bottom: 2.5rem;}
    #servicos article { padding: 1rem .6rem; min-height: 365px; }
    #servicos article h3 { font-size: 1.25rem; }
    #servicos article h3 br { display: none; }
    #servicos .svg_footer { bottom: -2.9rem; }
}
@media(max-width:991px) {
    #servicos article { padding: 1rem 2rem; min-height: 465px; margin-bottom: 1rem; }
    #servicos article h3 { font-size: 1.6rem; }
    #servicos article h3 br { display: initial; }
    #servicos .svg_footer { bottom: -3.65rem; }
}
@media(max-width:767px) {
    #servicos { padding-top: 9rem; padding-bottom: 9rem; }
    #servicos article { padding: 1rem; min-height: 380px; }
    #servicos article h3 { font-size: 1.25rem; }
    #servicos article h3 br { display: none; }
    #servicos .svg_footer { bottom: -4.2rem; }
}
@media(max-width:575px) {
    #servicos { padding-top: 5rem; padding-bottom: 6rem; }
    #servicos p { font-size: 1rem; }
    #servicos article { min-height: auto; margin-bottom: 1.2rem; }
    #servicos article img { width: 50%; } 
    #servicos article h3 { font-size: 1.6rem; }
    #servicos .svg_footer { bottom: -4.6rem; }
}
@media(max-width:449px) {
    #servicos article img { width: 75%; } 
    #servicos article h3 { font-size: 1.4rem; }
    #servicos .svg_footer { bottom: -5rem; }
}



/* CATALOGO */
#catalogo { padding-top: 5rem; padding-bottom: 1rem; }
#catalogo h2 { margin-bottom: 1.2rem; }
#catalogo p { font-size: 1.45rem; font-weight: 500; margin-bottom: 3rem; }

#catalogo .catalogo-container { display: flex; flex-wrap: wrap; }
#catalogo .catalogo-container .catalogo-image { transition: .3s; position: relative; width: 32%; margin-right: 2%; margin-bottom: 1.6rem; }
#catalogo .catalogo-container .catalogo-w28 { width: 28%; }
#catalogo .catalogo-container .catalogo-w34 { width: 34%; }
#catalogo .catalogo-container .catalogo-image:nth-child(3n) { margin-right: 0; }
#catalogo .catalogo-container .catalogo-image span { 
    color: var(--color-font-light);
    background: var(--color-primary);
    font-size: 2.3rem;
    font-weight: bold;
    width: 60px;
    height: 60px;
    display: inline-flex;
    border-radius: 50%;
    justify-content: center;
    align-items: center;
    position: absolute;
    top: -1rem;
    left: -1rem;
}
#catalogo .catalogo-container .catalogo-image .cover { width: 100%; height: 235px; }
#catalogo .catalogo-container .catalogo-image .cover img { width: 100%; height: 100%; object-fit: cover; border-radius: 1.4rem; }
#catalogo .catalogo-container .catalogo-image:hover { transition: .3s; transform: scale(1.04); }
#catalogo .catalogo-container .catalogo-image:hover span { background: var(--color-primary-hover); }

@media(max-width:1199px) {
    #catalogo .catalogo-container .catalogo-image .cover { height: 180px; }
    #catalogo .catalogo-container .catalogo-image span {
        font-size: 1.8rem;
        width: 50px;
        height: 50px;
        top: -.6rem;
        left: -.6rem;
    }
}
@media(max-width:991px) {
    #catalogo .catalogo-container .catalogo-image .cover { height: 140px; }
    #catalogo .catalogo-container .catalogo-image span { font-size: 1.4rem; width: 40px; height: 40px; }
}
@media(max-width:767px) {
    #catalogo p { font-size: 1.25rem; margin-bottom: 2rem; }

    #catalogo .catalogo-container .catalogo-image, 
    #catalogo .catalogo-container .catalogo-w28,
    #catalogo .catalogo-container .catalogo-w34  { width: 48%; margin-right: 2%; }

    #catalogo .catalogo-container .catalogo-image:nth-child(3n) { margin-right: 2%; }
    #catalogo .catalogo-container .catalogo-image:nth-child(2n) { margin-right: 0%; }
}
@media(max-width:575px) {
    #catalogo .catalogo-container .catalogo-image .cover { height: 130px; }
}
@media(max-width:449px) {
    #catalogo .catalogo-container { padding-left: 1rem; padding-right: 1rem; }
    #catalogo .catalogo-container .catalogo-image, 
    #catalogo .catalogo-container .catalogo-w28,
    #catalogo .catalogo-container .catalogo-w34  { width: 100%; margin-right: 0%; }
    #catalogo .catalogo-container .catalogo-image:nth-child(3n) { margin-right: 0%; }
    #catalogo .catalogo-container .catalogo-image .cover { height: 200px; }
}



/* BLOG */
#blog { padding-top: 4rem; padding-bottom: 5rem; }
#blog article { transition: .4s; border: 3px solid #bbcad2; text-align: center; padding: 1.5rem; border-radius: 2rem; }
#blog article img { border-radius: 1rem; }
#blog article h3 { font-weight: bold; font-size: 1.5rem; line-height: 28px; margin-top: 1rem; margin-bottom: 1.2rem; }
#blog article:hover { transition: .4s; transform: scale(1.04); }

#blog .button-primary:hover, #blog .button-secondary:hover { color: var(--color-font-light); }

@media(max-width:991px) {
    #blog article { padding: 1.5rem 1rem; border-radius: 1.5rem; margin-bottom: 1rem; } 
    #blog article h3 { font-weight: 600; font-size: 1.25rem; line-height: 24px; }
}
@media(max-width:575px) {
    #blog { padding-top: 3rem; padding-bottom: 4rem; }
    #blog article { margin-left: 3rem; margin-right: 3rem; } 
}
@media(max-width:449px) {
    #blog article { margin-left: 2rem; margin-right: 1rem; } 
}



/* -------------------------------------------------------- 
 * DEPOIMENTOS EM VIDEOS - FAMOSOS
 * ------------------------------------------------------*/
.depoimentos-videos { padding-top: 5rem; padding-bottom: 2rem; }
.depoimentos-videos .owl-carousel .item { padding: 5px; cursor: pointer; }
.depoimentos-videos .video-thumb { border-radius: 8px; object-fit: cover; height: 200px; }

.depoimentos-videos  h2 { font-size: 2.2rem; margin-bottom: 1rem !important; }
.depoimentos-videos .subtitle { font-size: 1.75rem; margin-bottom: 2.5rem !important; }
.depoimentos-videos img { border-radius: 2rem; margin-bottom: 1.5rem; }

.depoimentos-videos .depoimento-nome {
    position: absolute;
    bottom: 12px;
    left: 5%;
    right: 0;
    z-index: 2;
    background: rgb(21 214 217);
    color: #fff;
    padding: 15px 15px;
    border-radius: 15px;
    font-size: 1.25rem;
    font-weight: 600;
    text-align: center;
    pointer-events: none;
    width: 90%;
}
.depoimentos-videos .item.position-relative { cursor: pointer; }
.depoimentos-videos > div > div.row.d-flex.justify-content-center.align-items-center.fotos-carousel.owl-carousel.owl-theme.owl-loaded.owl-drag > div.owl-nav { margin-top: 1rem; text-align: center; }
.depoimentos-videos .owl-nav { 
    display: flex; 
    justify-content: center; 
    align-items: center; 
    margin-top: 1rem; 
}
.depoimentos-videos .owl-prev i, 
.depoimentos-videos .owl-next i { font-size: 2.8rem; margin: 0 8px; color: var(--color-primary); }

.lp-troca-vinil #videoModal .modal-body { background: #FFF; }
.lp-troca-vinil #videoModal video { 
    max-width: 100vw;
    max-height: 90vh;
    width: auto;
    height: auto;
    margin-top: 1rem;
    margin-bottom: 1rem;
    background: #FFFF !important; 
}


@media(max-width:991px) {
    .depoimentos-videos .subtitle br { display: none; }
}
@media(max-width:767px) {
    .depoimentos-videos  h2 { font-size: 1.8rem; }
    .depoimentos-videos .subtitle { font-size: 1.4rem; margin-bottom: 2rem !important; }
    .depoimentos-videos img { border-radius: 1.5rem; }
}
@media(max-width:399px) {
    .depoimentos-videos  h2 { font-size: 1.6rem; }
    .depoimentos-videos .subtitle { font-size: 1.2rem; }
    .depoimentos-videos .depoimento-nome { left: 4%; padding: 15px 10px; font-size: 1.1rem; width: 92%; }
}





/* -------------------------------------------------------- 
 * PAGINAS INTERNAS 
 * ------------------------------------------------------*/


 /* PAGINAS (Servicos, Catalogo, Blog Post) */
#pagina { padding-top: 5rem; padding-bottom: 5rem; }
#pagina .pagina-container-image { text-align: center; margin-bottom: 4rem; }
#pagina .pagina-container-image img { border-radius: 1.5rem; }
#pagina .pagina-container-text p,
#pagina .pagina-container-text ul li,
#pagina .pagina-container-text a { font-size: 1.25rem; font-weight: 500; }
#pagina .video { margin-bottom: 3rem; margin-top: 4rem; }
#pagina .video iframe { width: 70%; margin: 0 15%; border-radius: 3rem; }


@media(max-width:991px) {
    #pagina .pagina-container-image img { width: 80%; margin: 0 10% 2rem; }
    #pagina .video iframe { width: 80%; margin: 0 10%; border-radius: 2rem; }
}
@media(max-width:767px) {
    #pagina .pagina-container-image img { width: 100%; margin: 0; }
    #pagina .video iframe { width: 100%; margin: 0; }
}
@media(max-width:575px) {
    #pagina { padding-top: 4rem; padding-bottom: 3rem; }
    #pagina .pagina-container-text p { font-size: 1.15rem; }
    #pagina .video iframe { height: auto !important; min-height: 400px !important; }
}


/* BLOG */
#pageblog { padding-top: 5rem; padding-bottom: 5rem; }
#pageblog article { transition: .4s; border: 3px solid #bbcad2; text-align: center; padding: 1.5rem; border-radius: 2rem; margin-bottom: 1.5rem; }
#pageblog article img { border-radius: 1rem; }
#pageblog article h3 { font-weight: bold; font-size: 1.5rem; line-height: 28px; margin-top: 1rem; margin-bottom: 1.2rem; }
#pageblog article:hover { transition: .4s; transform: scale(1.04); }

#pageblog .button-primary:hover { color: var(--color-font-light); }

@media(max-width:991px) {
    #pageblog article { padding: 1.5rem 1rem; border-radius: 1.5rem; margin-bottom: 1rem; } 
    #pageblog article h3 { font-weight: 600; font-size: 1.25rem; line-height: 24px; }
}
@media(max-width:575px) {
    #pageblog { padding-top: 3rem; padding-bottom: 4rem; }
    #pageblog article { margin-left: 3rem; margin-right: 3rem; } 
}
@media(max-width:449px) {
    #pageblog article { margin-left: 2rem; margin-right: 1rem; } 
}