@import"../theme/theme.min.css";
@import"../component-css/navbar.min.css";
@import"../component-css/main.min.css";
@import"../component-css/gayossoContigo.min.css";
@import"../component-css/footer.min.css";
@import"../component-css/modalContact.min.css";
@import"../component-css/formSticky.min.css";
@import"../seo/faqs.css";
@import"../component-css/phoneClient-mobile.min.css";
@import"../component-css/glider-arrows.min.css";

@import"../component-css/teEntendemos.css";
@import"../component-css/sitio.min.css";

/* modificaciones thema pets */
body {
    background: #9263FF;
    overflow-x: hidden;
}

.navbar__container {
    background-color: #3B256F;
}

.phoneNavbar-mobile {
    background-color: #3B256F;
}

main {
    background-image: url('../../img/banners/banner-pets-desk.png');
    display: flex;
    align-items: center;
}

main .info h1 {
    margin-top: 0;
}

main .logopets {
    height: 76px;
    width: 319px;
}

main .info {
    background-color: #9263FF;
    border-radius: 0px 262px 262px 0px;
    padding: 32px 32px 32px 0px;
    position: relative;
}

main .info::before {
    content: "";
    min-height: 100%;
    width: 100vw;
    background-color: #9263FF;
    position: absolute;
    top: 0px;
    right: 100%;
    z-index: 1;
    pointer-events: none;
}

main .info h2 {
    /* max-width: 696px; */
    width: 696px;
}

main .info .btn {
    width: 310px;
    font: normal normal 600 18px/18px MontserratB;
    margin-top: 30px;
}

@media (max-width:1200px) {
    main .info h2 {
        width: 550px;

    }
}

@media (max-width:990px) {
    main {
        background-position: 60% 100%;
    }

    main .info h2 {
        width: 400px;

    }
}

@media (max-width:767px) {
    main {
        background-image: url('../../img/banners/banner-pet-mobile.png');
    }

    main .info {
        height: auto;
        width: 95%;
    }

    main .info .logopets {
        height: 63px;
        width: 265px;
    }

    main .info h2 {
        text-align: left;
        font: normal normal 400 18px/25px MontserratM;
        margin-top: 16px;
        width: auto;
    }

    main .info .btn {
        display: none;
    }
}

@media (max-width:400px) {
    main .info .logopets {
        height: auto;
        width: 90%;
    }
}

.lineSeparator.white .round, .lineSeparator.white .line {
    background-color: #ffff;
}

.planesPet .titleSection, .planesPet .subtitleSection {
    color: #ffff;
}

.planesPet .titleSection {
    margin-top: 24px;
}

.planesPet .subtitleSection {
    margin-top: 20px;
}

.planesPet {
    margin-top: 25px;
}

@media (max-width:767px) {
    .planesPet .titleSection {
        font: normal normal bold 24px/39px Montserrat;
    }
}

/* cards */

.planPet {
    overflow: hidden;
    border-radius: 16px 16px 24px 24px;
    /* padding: ; */
}

.planPet .headerPlan {
    background: #3B256F;
    padding: 16px 8px 32px 8px;
    color: #FFFAFA;
    text-align: center;
}

.planPet .headerPlan .titlePlan {
    font: normal normal 600 24px/39px MontserratB;
    letter-spacing: 0px;
}

.container__line {
    margin-top: 40px;
    position: relative;
}

.container__line::before {
    content: '';
    height: 202px;
    width: 100vw;
    background-color: #EDE144;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: -1;
}

.planPet .headerPlan hr {
    border: none;
    border-bottom: 1px solid #fff;
    max-width: 220px;
    width: 90%;
    margin: 0px auto;
    margin-top: 11px;
    margin-bottom: 11px;
}

.planPet .headerPlan .description {
    font: normal normal 500 16px/22px MontserratM;
    letter-spacing: 0px;
}

.planPet .infoPlan {
    background-color: #ded0ff;
    border: 1px solid #707070;
    border-bottom: none;
    border-top: none;
    /* opacity: 0.3; */
}

.planPet .containerIncluye {
    display: flex;
    justify-content: center;
    margin-top: -15px;
    position: relative;
    margin-bottom: -13px;
}

.planPet .incluye {
    display: inline-block;
    width: 155px;
    border-radius: 24px;
    font: normal normal 400 16px/28px MontserratM;
    letter-spacing: 0px;
    text-align: center;
    color: #FFFAFA;
    background-color: #9263FF;
}

.planPet .infoPlan {
    padding-top: 25px;
    color: #3B256F;
    text-align: center;
    min-height: 264px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-bottom: 20px;
    padding-left: 10px;
    padding-right: 10px;
}

.planPet .infoPlan .bold {
    font: normal normal 400 16px/22px MontserratB;
}

.planPet .infoPlan .info {
    font: normal normal 400 16px/28px MontserratM;
    list-style: none;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-height: inherit;
}

.planPet .infoPlan .infoNoSpace {
    justify-content: flex-start;
    gap: 10px;
}

.planPet .precioSection {
    background-color: #FFFFFF;
    border: 1px solid #707070;
    border-radius: 0px 0px 24px 24px;
    border-top: none;
    padding: 10px 0px 16px 0px;
    color: #3B256F;
    text-align: center;
}

.planPet .precioSection .desde {
    font: normal normal 600 16px/39px MontserratB;
    letter-spacing: 0px;
}

.planPet .precioSection .precio {
    font: normal normal 600 40px/39px MontserratB;
    letter-spacing: 0px;
}

.planPet .precioSection .btn {
    font: normal normal 600 20px/20px MontserratB;
    letter-spacing: 0px;
    color: #3B256F;
    max-width: 222px;
    width: 90%;
    margin: 0px auto;
    margin-top: 16px;
}

.col .incluyePlan {
    font: normal normal 400 14px/20px MontserratB;
    letter-spacing: 0px;
    color: #FFFAFA;
    text-align: center;
    width: 90%;
    margin: 0px auto;
    margin-top: 16px;
}

.planesPet .terminosPet {
    font: normal normal 400 14px/18px Montserrat;
    letter-spacing: 0px;
    color: #FFFAFA;
    text-align: center;
    margin-top: 30px;
}

.container__planes {
    display: flex;
    align-items: center;
    overflow: auto;
    flex-direction: row;
}

.planPet .col {
    max-width: 284px;
}

.container__line::before {
    content: none;
}

.container__planes .planPet .headerPlan {
    background-color: #EDE145;
    color: #3B266F;
    padding: 24px 0px 10px 0px;
}

.container__planes .principalCard .headerPlan {
    position: relative;
    padding: 16px 8px 32px 8px;
    color: #ffff;
}

.container__planes .planPet>.description {
    font: normal normal 400 16px/22px MontserratM;
    letter-spacing: 0px;
    color: #3B266F;
    text-align: center;
    margin-top: 9px;
    margin-bottom: 25px;
}

.container__planes .principalCard::before {
    content: '';
    height: 421px;
    width: 421px;
    border-radius: 50%;
    background-color: #EDE144;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: -1;
}

.container__planes .principalCard .planPet {
    border: 2px solid #EDE145
}

.container__planes .principalCard .headerPlan {
    background-color: #7745ED;
}

.container__planes .principalCard .headerPlan .description:nth-of-type(2) {
    margin-top: 6px;
}

.container__planes .principalCard .headerPlan .description:nth-of-type(3) {
    margin-top: 15px;
}

.container__planes .principalCard .pagoLogo {
    height: 48px;
    margin-top: 16px;
}

.container__planes .planPet {
    background: #ffff;
}

.planPet .precioSection .precio span {
    font: normal normal 400 22px/28px MontserratB;
}

.container__planes .membresias {
    display: flex;
    flex-direction: column;
}


.container__planes .membresias .container__membresias {
    display: flex;
}

.container__planes .membresias .titleMembresia {
    /* width: 100%; */
    font: normal normal 600 18px/31px MontserratB;
    letter-spacing: 0px;
    color: #EDE145;
    text-align: center;
    margin-bottom: 15px;
}

.container__planes article, .container__planes .membresias {
    flex: 0 0 auto;
}

.container__planes article {
    width: 284px;
}

.planPet .infoPlan {
    border: none;
}

.planPet .precioSection {
    border: none;
}

.container__planes .principalCard {
    margin-left: 107px;
    margin-right: 107px;
}

@media (max-width:1200px) {
    .container__planes .principalCard {
        margin-left: 54px;
        margin-right: 54px;
    }

    .container__planes .principalCard::before {
        height: 350px;
        width:350px;
    }
}

@media (max-width:767px) {
    .container__planes{
        flex-direction: column;
    }

    .container__planes .membresias .container__membresias{
        flex-direction: column;
        align-items: center;
        gap: 30px;
    }
}

.principalCard .planPet .infoPlan {
    min-height: 203px;
}

/* chapter pets */

.petsChapter {
    margin-top: 30px;
    background-position: center;
    background-repeat: repeat;
    background-size: contain;
    background-image: url("../../img/banners/bgChapter.svg");
    padding: 27px 0px 50px 0px;
}

.petsChapter .titleSection {
    color: #ffff;
    margin-top: 20px;

}

.petsChapter .roundPets {
    width: 100%;
    margin-top: 60px;
}

.petsChapter .btn {
    font: normal normal 600 18px/18px MontserratB;
    width: 310px;
    margin: 0px auto;
    margin-top: 40px;
    max-width: 356px;
    width: 100%;
}

.container .btnSolo {
    display: none;
}

@media (max-width:767px) {
    .petsChapter .roundPets {
        display: block;
        margin: 0px auto;
        margin-top: 20px;
        max-width: 356px;
        width: 90%;
    }

    .petsChapter .titleSection {
        font: normal normal 600 28px/39px Montserratb;
    }

    .container .btnSolo {
        display: block;
        margin-bottom: 20px;
        margin: 0px auto;
        margin-top: 15px;
        max-width: 356px;
        width: 100%;
        font: normal normal 600 18px/18px MontserratB;
    }

}

/* sucursales */
.gayossoContigo .cardRoundInfo .info, .gayossoContigo .servicioExcelencia .info {
    color: #fff;
}

.gayossoContigo .servicioExcelencia {
    border-color: #ffff;
}

/* footer */
footer {
    background-color: #3B256F;
}

/* form sticky */

.formSticky .container {
    background-color: #3B256F;

}

.formSticky .btn {
    font: normal normal 600 16px/22px Montserratm;
}




.modalContact .container__modal {
    background: #9263FF;
}

@media (max-width:767px) {
    .formSticky .form__sticky {
        background-color: #9263FF;
        border: 1px solid #707070;
    }

}

.txt__yellow-bold{
    font-family: MontserratB;
    color: #EDE145;
}