/* HEADER */
header { 
    position: relative;
    background: url(../img/lp/slider.png);
    background-position: top;
    background-repeat: no-repeat;
    background-size: cover;
    padding-top: 3rem;
    padding-bottom: 10rem;
    height: 700px;
}
header img.logo { max-width: 400px; }
header .header-content { text-align: center; margin-top: 6rem; }
header .header-content h2 { color: var(--color-font-light); font-family: "Montserrat Alternates", sans-serif; font-style: italic; font-weight: 800; font-size: 3rem; margin-bottom: 0; }
header .header-content h3 { color: var(--color-font-light); font-family: "Montserrat Alternates", sans-serif; font-weight: 600; margin-top: 6px; }
header .header-content .mouse-cursor { 
    max-width: 30px; 
    transform: translate(-50%, -50%); 
    animation: jump 1s infinite alternate; 
    position: absolute;
    top: 72%;
    left: 50%;
}
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 .svg_footer { bottom: -2.92rem !important; }
}
@media(max-width:991px) {
    header { padding-top: 2rem; padding-bottom: 6rem; height: 660px; }
    header .header-content { margin-top: 6rem; }
    header .header-content .mouse-cursor { top: 75%; }
    header .svg_footer { bottom: -3.6rem !important; }
}
@media(max-width:767px) {
    header { height: 600px; }
    header img.logo { max-width: 380px; }
    header .header-content h2 { font-size: 2.25rem; }
    header .header-content .mouse-cursor { top: 78%; }
    header .svg_footer { bottom: -4.2rem !important; }
}
@media(max-width:575px) {
    header { padding-top: 2rem; padding-bottom: 3rem; height: 500px; }
    header img.logo { max-width: 320px; }
    header .header-content { margin-top: 4.5rem; }
    header .header-content h2 { font-size: 1.65rem; }
    header .header-content .mouse-cursor { top: 80%; }
    header .svg_footer { bottom: -5rem !important; }
}
@media(max-width:399px) {
    header img.logo { max-width: 280px; }
}



/* Promessa - Tenha a Piscina dos Sonhos */
#sobre { padding-top: 6rem; padding-bottom: 5rem; }
#sobre p { font-size: 1.35rem; font-weight: 500; }

@media(max-width:767px) {
    #sobre { padding-top: 5rem; padding-bottom: 3rem; }
    #sobre img { margin-top: 1.5rem; }
}
@media(max-width:575px) {
    #sobre { padding-top: 4rem; padding-bottom: 2rem; }
    #sobre h2 br { display: none; }
    #sobre p { font-size: 1.25rem; }
}


/* Beneficios */
#beneficio { padding-top: 3rem; padding-bottom: 3rem; }
#beneficio h2 { font-size: 2.2rem; }
#beneficio article { text-align: center; padding: 1rem; transition: .3s; margin-bottom: 1rem; }
#beneficio article:hover { transition: .3s; transform: scale(1.04); }
#beneficio article img { padding-bottom: 1.25rem; max-width: 140px; }
#beneficio article h3 { font-weight: 700; font-size: 1.5rem; margin-bottom: 1rem; }
#beneficio article p { font-size: 1.25rem; }

@media(max-width:767px) {
    #beneficio { padding-top: 1rem; }  
}
@media(max-width:575px) {
    #beneficio h2 { font-size: 1.8rem; }
    #beneficio article img { max-width: 130px; }
    #beneficio article p { font-size: 1.15rem; }
}


/* Fotos */
#fotos { padding-top: 8rem; padding-bottom: 12rem; }
#fotos .foto-container { position: relative; }
#fotos .column-left { padding-right: 0rem; padding-left: 4rem; }
#fotos .column-left div.col-12:nth-child(1) { margin-bottom: 1rem; }

#fotos .photo-01,
#fotos .photo-02,
#fotos .photo-03 { transition: .3s; }

#fotos .photo-01:hover,
#fotos .photo-02:hover,
#fotos .photo-03:hover { transition: .3s; transform: scale(1.03); }

#fotos .photo-desc-01 { position: absolute; left: -8rem; top: -8rem; }
#fotos .photo-desc-02 { position: absolute; left: -11rem; bottom: -9rem; }
#fotos .photo-desc-03 { position: absolute; right: -5rem; top: -9rem; }

@media(max-width:1399px) {
    #fotos .column-left { padding-left: 3.5rem; }
    #fotos .photo-desc-01 { left: -9rem; top: -6.5rem; }
    #fotos .photo-desc-02 { bottom: -10rem; }
    #fotos .photo-desc-03 { right: -6rem; }
}
@media(max-width:1199px) {
    #fotos .column-left { padding-left: 4.5rem; }
    #fotos .photo-desc-01 { left: -7.5rem; top: -6rem; max-width: 93%; }
    #fotos .photo-desc-02 { left: -8rem; bottom: -6rem; max-width: 70%; }
    #fotos .photo-desc-03 { right: -3.5rem; top: -7.5rem; max-width: 36%; }
}
@media(max-width:991px) {
    #fotos .column-left { padding-left: 3.5rem; }
    #fotos .photo-desc-01 { left: -5rem; top: -5rem; max-width: 100%; }
    #fotos .photo-desc-02 { left: -6.8rem; bottom: -5rem; max-width: 80%; }
    #fotos .photo-desc-03 { right: -3.5rem; top: -6.5rem; max-width: 40%; }
}
@media(max-width:767px) {
    #fotos { padding-top: 0rem; padding-bottom: 5rem; }
    #fotos .foto-container { text-align: center; }
    #fotos .column-left { padding-left: 0rem; }
    #fotos .photo-desc-01,
    #fotos .photo-desc-02,
    #fotos .photo-desc-03 { display: none; }

    #fotos .column-left div.col-12:nth-child(1) { margin-bottom: 0rem; }
    #fotos .photo-01,
    #fotos .photo-02 { margin-bottom: 1.5rem; }

    #fotos .photo-01,
    #fotos .photo-02,
    #fotos .photo-03 { border-radius: 6rem; }
}
@media(max-width:575px) {
    #fotos .photo-01,
    #fotos .photo-02,
    #fotos .photo-03 { border-radius: 4rem; }
}
@media(max-width:449px) {
    #fotos .photo-01,
    #fotos .photo-02,
    #fotos .photo-03 { border-radius: 1rem; }
}



/* Call To Action - WhatsApp */
#calltoaction {
    position: relative;
    background: url(../img/lp/bg-whatsapp.png);
    background-position: top;
    background-repeat: no-repeat;
    background-size: cover;
    padding-top: 16rem;
    padding-bottom: 17rem;
}
#calltoaction * { color: var(--color-font-light); }
#calltoaction h2 { margin-bottom: 2rem; }
#calltoaction h3 { font-size: 1.8rem; font-weight: 600; margin-bottom: 2.5rem; }
#calltoaction .button-primary { 
    background: var(--btn-whatsapp);
    align-items: center;
    display: inline-flex;
    padding: 12px 3rem;
    border-radius: 1rem;
    font-size: 1.4rem;
    font-weight: 500;
}
#calltoaction .button-primary:hover { background: var(--btn-whatsapp-hover); }
#calltoaction .button-primary i { font-size: 2.5rem; margin-right: 8px; }
#calltoaction .svg_footer { bottom: -1.65rem; }

@media(max-width:1399px) {
    #calltoaction .svg_footer { bottom: -2.2rem; }
}
@media(max-width:1199px) {
    #calltoaction { padding-top: 14rem; padding-bottom: 14rem; }
    #calltoaction .svg_footer { bottom: -3rem; }
}
@media(max-width:991px) {
    #calltoaction { padding-top: 12rem; padding-bottom: 12rem; }
    #calltoaction h3 { font-size: 1.4rem; }
    #calltoaction .svg_footer { bottom: -3.6rem; }
}
@media(max-width:767px) {
    #calltoaction { padding-top: 10rem; padding-bottom: 10rem; }
    #calltoaction h2 { font-size: 2.6rem; }
    #calltoaction h3 br { display: none; }
    #calltoaction .svg_footer { bottom: -4.2rem; }
}
@media(max-width:575px) {
    #calltoaction h2 { font-size: 2.3rem; }
    #calltoaction h2 br { display: none; }
    #calltoaction h3 { font-size: 1.25rem; }
    #calltoaction .svg_footer { bottom: -4.6rem; }
}
@media(max-width:449px) {
    #calltoaction { padding-top: 7rem; padding-bottom: 7rem; }
    #calltoaction .button-primary { padding: 12px 2rem; font-size: 1.2rem; }
    #calltoaction .svg_footer { bottom: -5rem; }
}



/* Depoimentos */
#depoimentos { padding-top: 7rem; padding-bottom: 7rem; }
#depoimentos h2 { font-size: 2.2rem; margin-bottom: 3rem; }
#depoimentos .depoimento-box { 
    border-radius: 15rem;
    padding: 1.2rem 3rem;
    -webkit-box-shadow: -6px 8px 5px -3px rgba(0, 0, 0, 0.15);
    -moz-box-shadow: -6px 8px 5px -3px rgba(0, 0, 0, 0.15);
    box-shadow: -6px 8px 5px -3px rgba(0, 0, 0, 0.15);
}
#depoimentos .depoimento-content {
    display: flex;
    border-radius: 2rem;
    padding: 1.25rem 2rem;
    -webkit-box-shadow: -3px 4px 9px 2px rgba(0, 0, 0, 0.15);
    -moz-box-shadow: -3px 4px 9px 2px rgba(0, 0, 0, 0.15);
    box-shadow: -3px 4px 9px 2px rgba(0, 0, 0, 0.15);
}
#depoimentos .depoimento-content .foto { margin-right: 12px; }
#depoimentos .depoimento-content .foto img { width: 75px; min-width: 50px; max-width: 50px; }
#depoimentos .depoimento-content .texto { min-height: 150px; }
#depoimentos .depoimento-content .texto h3 { font-size: 1.05rem; font-weight: bold; margin-bottom: 0px; }
#depoimentos .depoimento-content .texto p { margin-bottom: 0; }
#depoimentos .depoimento-content .texto span.star {
    background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 23.44 19'><polygon fill='%23fbbc04' points='10,15.27 16.18,19 14.54,11.97 20,7.24 12.81,6.63 10,0 7.19,6.63 0,7.24 5.46,11.97 3.82,19'/></svg>");
    background-repeat: repeat-x;
    display: block;
    background-size: 17px 17px;
    height: 20px;
    width: calc(calc(15px + 2px)* 5 + calc(15px / 3)* 0);
    margin: 10px 0;
}
@media(max-width:575px) {
    #depoimentos { padding-top: 4rem; padding-bottom: 4rem; }
    #depoimentos h2 { font-size: 2rem; margin-bottom: 2.5rem; }
    #depoimentos .depoimento-content .texto { min-height: auto; }
}






/** 
 * -----------------------------------------
 * LP 2 - TROCA DE VINIL
 * -----------------------------------------
 */ 

.lp-troca-vinil header .header-content .btn-whatsapp-conversion { 
    background-color: var(--btn-whatsapp) !important;
    transform: translate(-50%, -50%); 
    animation: jump 1s infinite alternate; 
    position: absolute;
    top: 63%;
    left: 50%;
    border: 1px solid #ebf6fc;
    padding: 16px 3rem !important;
    font-size: 1.3rem;
    font-weight: bold;
    border-radius: 5rem !important;
}
.lp-troca-vinil header .header-content .btn-whatsapp-conversion i { 
    font-size: 1.4rem;
    margin-right: 6px;
    color: var(--color-font-light) !important;
}
.lp-troca-vinil header .header-content .btn-whatsapp-conversion:hover { 
    background-color: var(--btn-whatsapp-hover) !important; 
    color: var(--color-font-light) !important; 
} 

@media(max-width:991px) {
    .lp-troca-vinil header .header-content .btn-whatsapp-conversion { min-width: 375px; padding: 16px 2rem !important; }
}
@media(max-width:767px) {
    .lp-troca-vinil header .header-content .btn-whatsapp-conversion { top: 77%; }
}
@media(max-width:399px) {
    .lp-troca-vinil header .header-content .btn-whatsapp-conversion { padding: 16px 1rem !important; font-size: 1.1rem; min-width: 94% !important; top: 83%; }
}



.lp-troca-vinil #beneficio h2 { font-size: 2.2rem; margin-bottom: 1rem !important; }
.lp-troca-vinil #beneficio .beneficio-subtitle { font-size: 1.45rem; margin-bottom: 2.5rem !important; }
.lp-troca-vinil #beneficio article .img-container { position: relative; width: 100%; max-width: 140px; margin: 0 auto 16px; }
.lp-troca-vinil #beneficio article .img-container img { max-width: initial; height: 130px; z-index: 2; position: relative; }
.lp-troca-vinil #beneficio article .img-container::after { content: ""; position: absolute; bottom: 6px; right: 12px; width: 60px; height: 60px; background-color: rgb(25 215 218 / 60%); border-radius: 1.75rem 1.75rem 15px 1.75rem; }

.lp-troca-vinil #beneficio .button-primary { 
    background-color: var(--btn-whatsapp) !important;
    align-items: center; 
    display: inline-flex; 
    padding: 16px 3rem !important;
    border-radius: 5rem !important;
    font-size: 1.3rem; 
    border: 1px solid #ebf6fc;
    font-weight: bold;
}
.lp-troca-vinil #beneficio .button-primary i { 
    font-size: 1.4rem;
    margin-right: 6px;
    color: var(--color-font-light) !important;
}
.lp-troca-vinil #beneficio .button-primary:hover { 
    background-color: var(--btn-whatsapp-hover) !important; 
    color: var(--color-font-light) !important; 
}


.lp-troca-vinil #fotos { padding-top: 2rem; padding-bottom: 5rem; }
.lp-troca-vinil #fotos h2 { font-size: 1.8rem; margin-bottom: 1rem !important; }
.lp-troca-vinil #fotos .beneficio-subtitle { font-size: 1.45rem; margin-bottom: 2.5rem !important; }
.lp-troca-vinil #fotos .foto-container { position: relative; margin: 2.5rem 10px 0 10px; }
.lp-troca-vinil #fotos .foto-container span { 
    position: absolute;
    top: -16px;
    left: -16px;
    width: 60px;
    height: 60px;
    background-color: #15d6d9;
    color: #FFF;
    border-radius: 50%;
    z-index: 1;
    font-size: 1.75rem;
    font-weight: bold;
    display: inline-flex;
    justify-content: center;
    align-items: center;
}
.lp-troca-vinil #fotos img { border-radius: 3rem; margin-bottom: 1.5rem; }
.lp-troca-vinil #fotos > 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; }

.lp-troca-vinil #fotos .owl-nav { 
    display: flex; 
    justify-content: center; 
    align-items: center; 
    margin-top: 1rem; 
}
.lp-troca-vinil #fotos .owl-prev i, 
.lp-troca-vinil #fotos .owl-next i { font-size: 2.8rem; margin: 0 8px; color: var(--color-primary); }


@media(max-width:991px) {
    .lp-troca-vinil header .header-content h2 { font-size: 2.4rem; }
    .lp-troca-vinil header .header-content h3 { font-size: 1.3rem; }

    .lp-troca-vinil #beneficio .beneficio-subtitle { font-size: 1.25rem; margin-bottom: 2.5rem !important; }
} 

@media(max-width:575px) {
    .lp-troca-vinil header .header-content h2 { font-size: 1.85rem; margin-bottom: 12px; }
    .lp-troca-vinil header .header-content h3 { font-size: 1.15rem; }
    .lp-troca-vinil header .header-content .mouse-cursor { top: 85%; }

    .lp-troca-vinil #beneficio h2 { font-size: 1.75rem; margin-bottom: 1.5rem !important; }
    .lp-troca-vinil #beneficio .beneficio-subtitle { font-size: 1.2rem; margin-bottom: 2.5rem !important; }
} 


.lp-troca-vinil .depoimentos-videos .owl-carousel .item { padding: 5px; cursor: pointer; }
.lp-troca-vinil .depoimentos-videos .video-thumb { border-radius: 8px; object-fit: cover; height: 200px; }

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

.lp-troca-vinil .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%;
}
.lp-troca-vinil .depoimentos-videos .item.position-relative { cursor: pointer; }
.lp-troca-vinil .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; }
.lp-troca-vinil .depoimentos-videos .owl-nav { 
    display: flex; 
    justify-content: center; 
    align-items: center; 
    margin-top: 1rem; 
}
.lp-troca-vinil .depoimentos-videos .owl-prev i, 
.lp-troca-vinil .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) {
    .lp-troca-vinil .depoimentos-videos .subtitle br { display: none; }
}
@media(max-width:767px) {
    .lp-troca-vinil .depoimentos-videos  h2 { font-size: 1.8rem; }
    .lp-troca-vinil .depoimentos-videos .subtitle { font-size: 1.4rem; margin-bottom: 2rem !important; }
    .lp-troca-vinil .depoimentos-videos img { border-radius: 1.5rem; }
}
@media(max-width:399px) {
    .lp-troca-vinil .depoimentos-videos  h2 { font-size: 1.6rem; }
    .lp-troca-vinil .depoimentos-videos .subtitle { font-size: 1.2rem; }
    .lp-troca-vinil .depoimentos-videos .depoimento-nome { left: 4%; padding: 15px 10px; font-size: 1.1rem; width: 92%; }
}

.lp-troca-vinil #calltoaction .button-primary { 
    background-color: var(--btn-whatsapp) !important;
    align-items: center; 
    display: inline-flex; 
    padding: 16px 3rem !important;
    border-radius: 5rem !important;
    font-size: 1.3rem; 
    border: 1px solid #ebf6fc;
    font-weight: bold;
}
.lp-troca-vinil #calltoaction .button-primary i { 
    font-size: 1.4rem;
    margin-right: 6px;
    color: var(--color-font-light) !important;
}
.lp-troca-vinil #calltoaction .button-primary:hover { 
    background-color: var(--btn-whatsapp-hover) !important; 
    color: var(--color-font-light) !important; 
}