@import url('https://fonts.googleapis.com/css2?family=Barlow Condensed&family=Fjalla+One&family=Fredoka&family=Fresca&family=Raleway:wght@400;600&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Raleway:wght@400;600&display=swap');

* {
    box-sizing: border-box;
    padding: 0;
    margin: 0;
    -webkit-box-sizing:border-box; /* Safari */

}

.inactive {
    opacity: 0;
    display: none !important;
}

/* HEADER */

.header {
    display: flex;
    height: 80px;
    width: 100%;
    min-height: 50px;
    padding-bottom: 0px;
    justify-content: space-around;
    align-self: stretch;
    align-items: center;
    position: relative;
    background-color: #FFF;
}

.header__nav {
    display: flex;
}

.header__nav__item {
    list-style: none;
    margin: 0px 10px;
}

.header__nav__item>a {
    text-decoration: none !important;
    font-family: 'Raleway';
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: 1px;
    font-weight: 400;
    color: #000;
}

.header__nav__item>a:hover {
    font-weight: bold;
}

.header__nav__item>input {
    text-decoration: none;
    font-family: 'Raleway';
    font-size: 11px;
    letter-spacing: 1px;
    background: rgba(178, 180, 178, 0.40);
    border: none;
    padding: 1px 25px 2px 10px;
    align-items: flex-start;
    align-self: stretch;
    border-bottom: 2px solid gray;
}

/* MAIN */

#background-video {
    width: 100%;
    height: 550px;
    object-fit: cover;
    position: absolute;
    left: 0;
    right: 0;
    top: 80px;
    bottom: 0;
    z-index: -1;
    filter: brightness(.65)
}

.main__hero {
    height: 550px;
}

.main__hero__text {
    width: 100%;
    padding-top: 100px;
    position: absolute;
}


.main__hero__text__p {
    color: #FFF;
    font-family: Raleway;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 20px;
    /* 142.857% */
    letter-spacing: 1px;
    text-transform: uppercase;
}

.main__hero__text__p-exp {
    margin: 10px 0;        /*Centra el parrafo  en el espacio*/
    margin-left: 200px;
    font-family: "Raleway",sans-serif;
    font-weight: 600;
    color: #ffffff;
    /*     background-color: #FFF;
 */
    display: inline-block;
    padding: 5px;
}

.main__hero__text__p-bar {
    color: #FFF;
    font-family: Fjalla One;
    font-size: 38px;
    font-style: normal;
    font-weight: 400;
    line-height: 50px;
    /* 131.579% */
    letter-spacing: 1px;
    text-transform: uppercase;
    margin: 10px 0;
    padding: 0px;
}

.main__hero__text__p-gray {
    background-color: #8c827a00;
    padding-left: 200px;
    margin-right: 40vw;
    transition: all .5s;
}

/* .main__hero__text__p-gray:hover {
    margin-right: 0px;
    padding-left: 200px;
} */

.main__hero__text__p-blue {
    background-color: #0095a9AA;
    background-color: #9cdbd9;
    color: #545859;
    /* margin-left: 100px; */
    padding-left: 200px;   /*Recorre el espaciado del texto hacia adentro antes era 100*/

    transition: all .5s;
}

/* .main__hero__text__p-blue:hover {
    margin-left: 0px;
    padding-left: 200px;
} */

.main__row {
    margin-top: 10px;
    display: flex;
    justify-content: space-evenly;
}

.main__row__item {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-items: center;
    height: 100px;
    justify-content: center;
}

.main__row__item>p {
    color: #97928a;
    text-align: center; 
    font-family: 'Barlow Condensed'; 
    text-rendering: optimizeLegibility;
    font-size: 11px;
    font-style: normal;
    font-weight: 500;
    line-height: 15.71px;
    /* 142.818% */
    letter-spacing: 1px;
    text-transform: uppercase;
    margin-bottom: 0px;
}

.main__row__item>b {
    color: #d7282f;
    color: #d7282f;
    text-align: center;
    font-family: Raleway;
    font-size: 32px;
    font-style: normal;
    font-weight: 700;
    line-height: 19.8px;
    /* 61.875% */
    letter-spacing: 1px;
    text-transform: uppercase;
    margin-bottom: 10px;
}

.main__spliter {
    display: flex;
    width: 100%;
    align-items: center;
    /* background-color: #F5F3F1; */
    background-color: #F5F3F1;
    padding: 10px 30px;
    margin-top: 10px;
}

.main__spliter__p {
    color: #333;
    font-family: Barlow Condensed;
    font-size: 15px;
    font-style: normal;
    font-weight: 500;
    line-height: 21.43px;
    /* 142.867% */
    letter-spacing: 1px;
    margin-bottom: 0px;
}

.main__featured_properties {
    display: flex;
    justify-content: space-evenly;
    align-items: center;
}

.main__property-card {
    display: flex;
    width: 60%;
    height: 410px;
    overflow-y: hidden;
    overflow-x: hidden;
    flex-wrap: wrap;
}

.property-card__container {
    width: 100%;
    height: 410px;
    display: grid;
    grid-template-columns: 6.5fr 3.5fr;
    margin-top: 40px;
}

.property__arrow {
    cursor: pointer;
    transition: all .2s;
}

.property__arrow:hover {
    transform: scale(1.3);
}

.main__property-card__text {
    position: relative;
    background-color: #F5F3F1;
}

.main__property-card__image {
    object-fit: fill;
    /*background-image: url('https://planigrupo.blob.core.windows.net/planigrupo/assets/images/propiedades-destacadas/location-hero-plaza-bella-mexiquense-full.jpg');*/
    background-image: url('https://grupomexicoblobstorage.blob.core.windows.net/websiteresources/assets/images/propiedades-destacadas/location-hero-plaza-bella-mexiquense-full.jpg');
    height: 410px;
    background-size: cover;
    transition: all .3s;
}

.main__property-card__image:hover {
    transform: scale(1.05);
}

.main__property-card__text>p {
    color: #FFF;
    font-family: Fjalla One;
    font-size: 28px;
    font-style: normal;
    font-weight: 400;
    line-height: 50px;
    /* 178.571% */
    letter-spacing: 1px;
    text-transform: uppercase;
    background-color: #0096A9;
    padding-left: 40px;
}

.main__property-card__text>div {
    display: flex;
    padding: 20px 40px;
}

.main__property-card__text__date {
    display: flex;
    width: 100%;
    justify-content: space-between;
}

.main__property-card__text__date>p {
    color: #000;
    font-family: Fredoka;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 25px;
    /* 178.571% */
    letter-spacing: 1px;
    text-transform: uppercase;
}

.main__property-card__text__desc {
    padding: 0px 40px !important;
}

.main__property-card__text__desc>p {
    color: #000;
    text-align: justify;
    font-family: Fresca;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 25px;
    /* 208.333% */
    letter-spacing: 1px;
    text-transform: uppercase;
}

.main__property-card__text__contact {
    display: inline !important;
    position: absolute;
    bottom: 0;
    right: 0;
}

.main__property-card__text__contact>p {
    color: #000;
    font-family: Fredoka;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 25px;
    /* 208.333% */
    letter-spacing: 1px;
    text-transform: uppercase;
}

.main__all-properties {
    width: 100%;
    display: flex;
    margin: 0px 0px 60px;
}

.main__all-properties>a {
    color: #FFF;
    color: #545859;
    font-family: Fjalla One;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 50px;
    /* 250% */
    letter-spacing: 1px;
    text-transform: uppercase;
    background-color: #0096A9;
    background-color: #9cdbd9;
    text-decoration: none;

    display: inline-block;
    margin: 0 auto;
    padding: 0px 60px;
}

.main__property-card__image--prop02 {
    background-image: url('https://grupomexicoblobstorage.blob.core.windows.net/websiteresources/assets/images/propiedades-destacadas/location-hero-plaza-bella-mexiquense-full.jpg');
    /*background-image: url('https://planigrupo.blob.core.windows.net/planigrupo/assets/images/propiedades-destacadas/location-hero-plaza-bella-mexiquense-full.jpg');*/
}

.main__property-card__image--prop03 {
    /*background-image: url('https://planigrupo.blob.core.windows.net/planigrupo/assets/images/propiedades-destacadas/cancun.jpg');*/
    background-image: url('https://grupomexicoblobstorage.blob.core.windows.net/websiteresources/assets/images/propiedades-destacadas/cancun.jpg');
}

.main__compromise>div:first-child {
    height: 60px;
    background-color: #F5F3F1;
}

.main__compromise__title {
    display: flex;
    flex-direction: column;
    width: 40vw;
    height: 60px;
    background-color: #d7282f;
    transition: all .5s;
    padding: 0px 40px;
    justify-content: center;
}

.main__compromise__title:hover {
    width: 100%;
}

.compromise__title__p1 {
    color: #FFF;
    font-family: Raleway;
    font-size: 12px;
    font-style: normal;
    font-weight: 300;
    line-height: 12px;
    /* 100% */
    letter-spacing: 1px;
    text-transform: uppercase;
    display: inline-block;
    margin: 0;
}

.compromise__title__p2 {
    color: #FFF;
    font-family: Raleway;
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: 19.8px;
    /* 110% */
    letter-spacing: 1px;
    text-transform: uppercase;

    display: inline-block;
    margin: 0;
}

.main__compromise__grid {
    display: grid;
    grid-template-columns: 1fr 11fr;
    grid-template-rows: 1fr 1fr 1fr 1fr;
    padding: 10px 0;
    row-gap: 10px;
}

.main__compromise__grid__item {
    height: 120px;
    background-color: #0096A9;
}

.main__compromise__grid__item__img {
    background-size: contain;
    background-repeat: no-repeat;
    background-position-x: calc(50%);
    filter: invert(32%) sepia(7%) saturate(247%) hue-rotate(145deg) brightness(100%) contrast(90%);
}

.main__compromise__grid__item__img--img1 {
    /*background-image: url('https://planigrupo.blob.core.windows.net/planigrupo/assets/png-icons/diversity.png');*/
    background-image: url('https://grupomexicoblobstorage.blob.core.windows.net/websiteresources/assets/png-icons/diversity.png');
}

.main__compromise__grid__item__img--img2 {
    /*background-image: url('https://planigrupo.blob.core.windows.net/planigrupo/assets/png-icons/family.png');*/
    background-image: url('https://grupomexicoblobstorage.blob.core.windows.net/websiteresources/assets/png-icons/family.png');
}

.main__compromise__grid__item__img--img3 {
    /*background-image: url('https://planigrupo.blob.core.windows.net/planigrupo/assets/png-icons/costumer.png');*/
    background-image: url('https://grupomexicoblobstorage.blob.core.windows.net/websiteresources/assets/png-icons/costumer.png');
}

.main__compromise__grid__item__img--img4 {
    /*background-image: url('https://planigrupo.blob.core.windows.net/planigrupo/assets/png-icons/social-responsibility.png');*/
    background-image: url('https://grupomexicoblobstorage.blob.core.windows.net/websiteresources/assets/png-icons/social-responsibility.png');
}

.main__compromise__grid__item__text {
    padding: 0px 30px;
}

.main__compromise__grid__item__text--secondary {
    background-color: #F5F3F1;
    padding-top: 5px;
}

.main__compromise__grid__item__text--primary {}

.main__compromise__grid__item__text>span {
    color: #d7282f;
    text-align: justify;
    font-family: Barlow Condensed;
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: 25px;
    /* 138.889% */
    letter-spacing: 1px;
    text-transform: uppercase;
}

.main__compromise__grid__item__text>p {
    color: #000;
    text-align: justify;
    font-family: Raleway;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 25px;
    /* 208.333% */
    letter-spacing: 1px;
    margin-top: 10px;
}

.main__tabs {
    margin-top: 60px;
}

.main__tabs>div>ul {
    display: flex;
    width: 100%;
    justify-content: space-around;
}

.tab__selector {
    color: #545859;
    font-family: Barlow Condensed;
    font-size: 28px;
    font-style: normal;
    font-weight: 500;
    line-height: 50px;
    /* 178.571% */
    letter-spacing: 1px;
    text-transform: uppercase;
    list-style-type: none;
    padding: 5px 10px;
    cursor: pointer;

    transition: all .3s;
}

.selected__tab {
    background-color: #F5F3F1;
    color: #0096A9;
}

.tabs__card {
    background-color: #F5F3F1;
    height: 520px;
    display: grid;
    grid-template-columns: 4.5fr 5.5fr;
    position: relative;
}

.tab__card__text {
    padding: 80px 40px;
}

.tab__card__text>span {
    color: #d7282f;
    color: #d7282f;
    text-align: justify;
    font-family: Barlow Condensed;
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: 25px;
    /* 138.889% */
    letter-spacing: 1px;

    position: relative;
}

.tab__card__text>p {
    color: #000;
    text-align: justify;
    font-family: Raleway;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    /* 208.333% */
    margin-top: 20px;
    padding-right: 20px;

}

.tab__card__img {
    background-position-y: -120px;
    background-size: inherit;
}

.div__card__img_tab{
    
}

.tab__card__img--tab1 {
    background-image: url('https://grupomexicoblobstorage.blob.core.windows.net/websiteresources/assets/0d7a354d-1a0b-4c3e-aef0-0001bf691111.jpeg');
    /*background-image: url('https://planigrupo.blob.core.windows.net/planigrupo/assets/0d7a354d-1a0b-4c3e-aef0-0001bf691111.jpeg');*/
    background-position-y: 0px;
    background-size: cover;
}

.tab__card__img--tab2 {
/*     background-position-y: -100px;*/    
/*background-image: url('https://planigrupo.blob.core.windows.net/planigrupo/assets/images/tabs/homepage-stacked-leasing2.jpg');*/
background-image: url('https://grupomexicoblobstorage.blob.core.windows.net/websiteresources/assets/images/tabs/homepage-stacked-leasing2.jpg');
}

.tab__card__img--tab3 {
    /*background-image: url('https://planigrupo.blob.core.windows.net/planigrupo/assets/images/tabs/bolsa_de_trabajo.jpeg');*/
    background-image: url('https://grupomexicoblobstorage.blob.core.windows.net/websiteresources/assets/images/tabs/bolsa_de_trabajo.jpeg');
/*     background-position-x: 100px !important;
 */}

.tab__card__img--tab4 {
    /*background-image: url('https://planigrupo.blob.core.windows.net/planigrupo/assets/images/tabs/impacto_social.jpeg');*/
    background-image: url('https://grupomexicoblobstorage.blob.core.windows.net/websiteresources/assets/images/tabs/impacto_social.jpeg');
}


.footer {
    height: 100px;
    background-color: #F5F3F1;
    display: flex;
    padding: 0 20px;
    justify-content: space-between;
    align-items: center;
}

.footer>div>span {
    color: #333;
    font-family: Barlow Condensed;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 14.29px;
    /* 102.071% */

    display: flex;
}
.footer>div>li {
    list-style: none;
}

.footer>div {
    display: flex;
    flex-wrap: wrap;
    align-content: space-between;
    height: 50px;
    align-items: center;
}

.footer>div>a {
    color: #545859;
    text-decoration: none;
    text-align: center;
    font-family: Raleway;
    font-size: 10px;
    font-style: normal;
    font-weight: 400;
    line-height: 14.29px;
    /* 142.9% */
    letter-spacing: 1px;
    text-transform: uppercase;
    /*display: inline;*/
    display:inline-block;
    height: 15px;
    
    flex-basis: 25%;
    max-width: 150px;

    transition: all .3s;
}

.footer i,
.footer svg {
    font-size: 14px;
    max-height: 18px;
}
 /*revisar al quitar */ 

/* 🔧 Solo para Safari: ajustes específicos */
@media not all and (min-resolution: .001dpcm) {
    @supports (-webkit-appearance: none) {
      .footer > div > a {
        font-size: 9px;
        line-height: 12px;
      }
  
      .footer i,
      .footer svg {
        font-size: 13px;
      }
  
      .main__hero__text__p-bar {
        font-family: 'Fjalla One', sans-serif;
        letter-spacing: 0.5px;
      }
    }
  }

.footer>div>a:hover {
    color: #0096A9;
}

.footer__img {
    height: 35px
}

.header__bars {
    display: none;
}

/** DESKTOP */
@media (max-width: 1472px) {}

@media (max-width: 1400px) {
    .main__hero__text__p-gray {
        padding-left: 200px;
        margin-right: 30vw;
        transition: all .5s;
    }

    .tab__card__img {
    }

    .tab__card__img--tab3 {
        background-size: cover;
        background-position-x: 0px !important;
        background-position-y: 0px;
    }

    .tab__card__img--tab4 {
        background-size: cover;
        background-position-x: 0px !important;
        background-position-y: 0px;
    }

    .main__compromise__grid__item__img {

        background-size: cover;
        background-position-x: 0px !important;
        background-position-y: 0px;
    }
}

@media (max-width: 1200px) {

    .header__nav__item--search {
        display: none;
    }

    .header {
        justify-content: space-between;
    }

    .header>a {
        padding-left: 20px;
    }


    .main__hero__text__p-gray {
        background-color: #8C827A;
        padding-left: 200px;
        margin-right: 10vw;
        transition: all .3s;
    }

    .tab__card__img {
/*         background-size: cover;
 */    }

    .tab__card__img--tab3 {
        background-position-y: 0px;
        background-size: cover;
    }

    .carousell__card__text {
        width: 50% !important;
    }

    .carousell__card__img {
        width: 50% !important;
    }

    .carousell__card__text__date {
        padding: 10px 20px !important;
    }

    .carousell__card__text__info {
        padding: 10px 20px !important;
    }

    .carousell__card__text__more {
        bottom: 10px !important;
        right: 10px !important;
    }

    .carousell__card__text__date__month {
        display: none;
    }

    .carousell__card__text__date__month--resp {
        display: block !important;
    }

    .carousell__card__text__info>p {
        line-height: 24px !important;
    }

    .carousell__card__text__more {
        right: 20px !important;
    }

    .tab__card__img {
/*         background-position-x: -180px !important;
 */    }
    .tab__card__img--tab3 {
        background-position-x: 0px !important;
        background-size: cover;
    }
}

@media (max-width: 1110px) {


    .main__compromise__grid__item__img {
        height: 100%;
    }
}

@media (max-width: 1000px) {
    
    .main__hero__text__p-gray {
        padding-left: 0px !important;
    }

    .footer {
        flex-direction: column;
        height: 200px;
        padding: 10px;
    }

    .footer>span {
        margin: 20px;
    }

    .qoute>div>p {
        font-size: 14px !important;
    }

    .main__hero__text__p-gray {
        background-color: #8C827A;
        padding-left: 200px;
        margin-right: 10vw;
        transition: all .3s;
    }


    .main__row {
        display: grid;
        grid-template-columns: 1fr 1fr;
        grid-template-rows: 1fr 1fr 1fr;
    }

    .header__nav {
        display: none;
    }

    .header__bars {
        display: flex;
        justify-content: center;
        padding: 10px !important;
        border-radius: 5px;
        margin-left: 10px;
    }

    .header__bars:hover {
        background-color: #97928A;
    }

    .main__property-card {
        height: 450px;
    }

    .property-card__container {
        height: 450px;
    }

    .carousell__container {
        height: 450px !important;
    }

    .carousell__card {
        flex-direction: column;
        height: 450px !important;
    }

    .carousell__card__text {
        width: 100% !important;
        height: 100px !important;
    }

    .carousell__card__text__title {
        width: 100%;
        padding-left: 20px !important;
    }

    .carousell__card__text__date {
        padding: 0px 20px !important;
    }

    .carousell__card__text__info {
        display: none;
    }

    .carousell__card__text__more {
        position: static !important;
        background-color: #F5F3F1;
        padding: 0px 20px !important;

    }

    .carousell__card__text__more>span {
        font-size: 10px !important;
        text-align: start !important;
        line-height: 20px !important;
    }

    .carousell__card__text__more>p {
        font-size: 10px !important;
        text-align: start !important;
        line-height: 20px !important;

    }

    .carousell__card__img {
        height: 350px !important;
        width: 100% !important;

    }

    .main__row>img {
        display: none;
    }

    .main__compromise__grid__item__img {
        background-size: cover;
        background-position-y: 0px;
        height: 100%;
    }

    .tab__card__img {
        background-position-x: -250px !important;
    }

}

@media (max-width: 750px) {

    .qoute>div>p {
        font-size: 16px !important;
        line-height: 30px !important;
    }

    .main__hero__text__p-gray {
        background-color: #8C827A;
        margin-right: 0vw;
        padding-left: 50px;
        transition: all .3s;
    }

    /* .main__hero__text__p-gray:hover {
        padding-left: 50px;
        margin-right: 0vw;
    } */

    .main__hero__text__p-blue {
        margin-left: 0;
        padding-left: 50px;
    }

    /* .main__hero__text__p-blue:hover {
        padding-left: 50px;
    } */

    .main__row {
        margin-top: 50px;
    }

    .main__row__item>b {
        line-height: 40px;
    }

    .main__tabs>div>ul {
        flex-direction: row;
    }


    .main__hero__text__p-exp {
        margin-left: 50px;
    }

    .main__property-card__text__desc {
        display: none !important;
    }

    .main__property-card__text__contact {
        display: none !important;
    }

    .property-card__container {
        flex-direction: column;
    }

    .main__property-card__text {
        width: 100%;
    }

    .tabs__card {
        height: 700px;
        grid-template-columns: 1fr;
        grid-template-rows: 2fr 4fr;
    }

    .tab__card__text {
        padding: 10px;
    }

    .tab__card__text>button {
        background-color: #0096A9;
        padding: 5px;
        border: none;

        position: absolute;
        left: 10px !important;
        bottom: 480px !important;
    }

    .tab__card__img--tab1 {
        background-position-x: -150px !important;
    }

    .main__hero__text__p-bar {
        font-size: 24px !important;
        padding-left: 10px !important;
        text-align: start;
    }

    .main__hero__text__p-gray {
        background-color: #00000000;
    }

    .main__hero__text__p-blue {
        color: #fff;
    }
}

@media (max-width: 730px) {

    .tab__card__img--tab1 {
        background-position-x: -150px !important;
    }
}

@media (max-width: 1000px) {

    .qoute>div {
        padding: 20px !important;
    }

    .qoute>div>p {
        padding-left: 20px !important;
    }

    .qoute>div>img {
        height: 30px;
    }


    .tabs__card {
        height: 600px;
        grid-template-columns: 1fr;
        grid-template-rows: 3fr 4fr;
    }

    .tab__card__text>button {
        position: absolute;
        left: 10px !important;
        bottom: 380px !important;
    }

    .main__compromise__title {
        padding-left: 30px;
    }

    .main__row {
        display: flex;
        flex-direction: column;
    }

    .tabs__card>div {
        flex-direction: column;
    }

    .main__hero__text__p-bar {
        font-size: 26px;
    }

    .main__hero__text__p-gray {
        background-color: #00000000;
    }

    .main__hero__text__p-blue {
        color: #545859;  /*color de letras banda azul en movil*/
    }

    .main__compromise__grid__item__img {
        display: none;
    }

    .main__compromise__grid {
        grid-template-columns: 1fr;
        grid-template-rows: repeat(4 1fr);
    }

    .carousell__container {
        width: 75% !important;
    }

    .carousell__card__text__date>span {
        font-size: 12px !important;
    }

    .header__bars {
        position: absolute;
        left: 0px;
    }

    .header__bars>img {

        height: 30px !important;
    }

    .header {
        position: static;
        justify-content: center;
    }

    .tab__card__img--tab1 {
        background-position-x: -300px !important;
    }

}

@media (max-width: 550px) {

    .main__tabs>div>ul {
        flex-wrap: wrap;
    }

    .main__tabs>div>ul>li {
        flex: 50% !important;
    }

}

@media (max-width: 470px) {


    .main__compromise__title {
        width: 50vw;
    }

    .main__compromise__title:hover {
        width: 100vw;
    }

    .carousell__card__text__title>span {
        font-size: 22px !important;
    }

    .tab__card__text>button {
        position: absolute;
        left: 40px;
        bottom: 415px !important;
    }

    .tabs__card {
        height: 700px;
    }
}

@media (max-width: 415px) {

    .tabs__card {
        height: 720px;
    }

    .tab__card__text>button {
        bottom: 420px !important;
    }
}

.carousell__container {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    overflow: hidden;
    width: 65%;
    height: 410px;
    margin-top: 40px;
}

.carousell__card {
    display: flex;
    width: 100%;
    height: 410px;
    background-color: #F5F3F1;
    margin: 0 100px;
}

.carousell__card--second {
    background-color: #97928A;
}

.carousell__card__text {
    width: 60%;
    height: 410px;
    background-color: #F5F3F1;
    position: relative;
}


.carousell__card__text__title {
    background-color: #0096A9;
    padding-left: 40px;
}

.carousell__card__text__title>span {
    color: #FFF;
    font-family: Fjalla One;
    font-size: 28px;
    font-style: normal;
    font-weight: 400;
    line-height: 50px;
    /* 178.571% */
    letter-spacing: 1px;
    text-transform: uppercase;
}

.carousell__card__text__date {
    display: flex;
    padding: 20px 40px;
    justify-content: space-between;
}

.carousell__card__text__date>span {
    color: #000;
    font-family: Fredoka;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 25px;
    /* 178.571% */
    letter-spacing: 1px;
    text-transform: uppercase;
}

.carousell__card__text__info {
    padding: 10px 40px;
}

.carousell__card__text__info>p {
    color: #000;
    text-align: justify;
    font-family: 'Raleway';
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 25px;
    /* 208.333% */
    letter-spacing: 1px;
}

.carousell__card__text__more {
    position: absolute;
    right: 30px;
    bottom: 20px;
    display: flex;
    flex-direction: column;
}

.carousell__card__text__more>p {
    color: #000;
    font-family: Fredoka;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 25px;
    /* 178.571% */
    letter-spacing: 1px;
    text-transform: lowercase;
    text-align: end;
}

.carousell__card__text__more>span {
    color: #000;
    font-family: Fredoka;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 25px;
    /* 208.333% */
    letter-spacing: 1px;
    text-transform: uppercase;
    text-align: end;
}

.carousell__card__img {
    width: 49%;
    height: 410px;
    background-image: url('https://grupomexicoblobstorage.blob.core.windows.net/websiteresources/assets/images/propiedades-destacadas/location-hero-plaza-bella-mexiquense-full.jpg');
    background-size: cover;
}

.carousell__card__img--p2 {
    width: 60%;
    height: 410px;
    background-image: url('https://grupomexicoblobstorage.blob.core.windows.net/websiteresources/assets/images/propiedades-destacadas/cancun.jpg');
    background-size: cover;
}

.carousell__card__img--p3 {
    width: 60%;
    height: 410px;
    background-image: url('https://grupomexicoblobstorage.blob.core.windows.net/websiteresources/assets/images/propiedades-destacadas/ciudadela.jpg');
    background-size: cover;
}

.carousell__card__img--p4 {
    width: 60%;
    height: 410px;
    background-image: url('https://grupomexicoblobstorage.blob.core.windows.net/websiteresources/assets/images/propiedades-destacadas/uvgs.jpg');
    background-size: cover;
}

.carousell__card__text__date__month--resp {
    display: none;
}

.tab__card__img--tab3 {
    background-size: cover;
    background-position-x: 0px;
    background-position-y: 0px;
}

.tab__card__img--tab4 {
    background-size: cover;
    background-position-x: 0px !important;
    background-position-y: 0px;
}

.tab__card__text>a {
    background-color: #0096A9;
    padding: 5px;
    border: none;

    position: absolute;
    left: 40px;
    bottom: 40px;

    color: #FFF;
    text-align: justify;
    font-family: Fresca;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 25px;
    /* 156.25% */
    letter-spacing: 1px;
    text-transform: uppercase;
}

.qoute {
    width: 100%;
    height: max-content;
    align-items: center;
    /* Aumentar margen inferior para separar de la sección de tabs */
    margin-bottom: 60px !important;
}

/* Ocultar las líneas hr en la sección qoute */
.qoute hr {
    display: none !important;
}

.qoute>div {
    display: flex;
    justify-content: center;
    padding: 20px 40px;
}

.qoute>div>p {
    padding: 0px 20px;
    font-family: 'Raleway';
    font-size: 14px;
    text-align: left;

    margin: 0px;
}

hr {
    background-color: #545859;
    height: 1px;
}


/* Stock Data (Databursatil) styles moved to shared/css/components/stock-data.css */

.main__tabs>div>ul>li {
    font-size: 20px;
}

.footer {
    background-color: #eae9e8;
}


@media (max-width: 1000px) {

    .main__row {
        margin-top: 0px;
    }
}

@media (max-width: 750px) {
    /* Estilos de datos bursátiles mobile removidos - sección oculta en mobile */
}

@media (max-width: 600px) {
    /* Estilos de datos bursátiles mobile removidos - sección oculta en mobile */
}

/*
MAIN TABS MARGIN
*/
.main__tabs {
    margin-top: 420px;
}

@media (max-width: 1800px) {
    .main__tabs {
        margin-top: 550px !important;
    }
}

@media (max-width: 1600px) {
    .main__tabs {
        margin-top: 530px;
    }
}

@media (max-width: 1400px) {
    .main__tabs {
        margin-top: 530px;
    }
}

/* Fix for carousel email visibility at desktop resolution */
.oportunidades__carousel__item__text__title__item {
    & .comercializacion {
        display: block;
        color: #0096A9;
        font-weight: 600;
    }
}

@media (max-width: 1210px) {
    .main__tabs {
        margin-top: 630px;
    }
}

@media (max-width: 1200px) {
    .main__tabs {
        margin-top: 630px;
    }
    .oportunidades__carousel__item__text__title__item {

        justify-items: center;

        & .comercializacion {
            display: block;
            color: #0096A9;
            font-weight: 600;
        }
        & .date {
            display: none;
        }
        & .area {
            display: none;
        }
        & .title {
            width: 100% !important ;
        }
    }
    .oportunidades__carousel__item__text__title__item--desc {
        & .contact {
            display: none;
        }
    }
}

@media (max-width: 1000px) {
    .main__tabs {
        margin-top: 630px;
    }
}

@media (max-width: 948px) {
    .main__tabs {
        margin-top: 720px;
    }
}

@media (max-width: 786px) {
    .main__tabs {
        margin-top: 550px !important;
    }
}
@media (max-width: 768px) {
    .main__tabs {
        margin-top: 620px !important;
    }
}

@media (max-width: 690px) {
    .main__tabs {
        margin-top: 925px;
    }
}

@media (max-width: 620px) {
    .main__tabs {
        margin-top: 720px !important;
    }
}

@media (max-width: 517px) {
    .main__tabs {
        margin-top: 820px;
    }
}

@media (max-width: 499px) {
    .main__tabs {
        margin-top: 820px !important;
    }
}
@media (max-width: 440px) {
    .main__tabs {
        margin-top: 850px !important;
    }
}
@media (max-width: 436px) {
    .main__tabs {
        margin-top: 930px !important;
    }
}
@media (max-width: 390px) {
    .main__tabs {
        margin-top: 1000px !important;
    }
}

@media (max-width: 1000px) {
    .main__tabs {
        margin-top: 930px;
    }

    .main__hero__text__p-bar {
        line-height: 35px;
        letter-spacing: 0px;
        text-align: start;

    }

    .main__hero__text__p-blue {
        padding-left: 20px !important;
        margin-left: 0px !important;
        margin-top: 0px;
        margin-bottom: 0px;
        text-align: center;
    }

    .main__hero__text__p-gray {
        margin-left: 10px !important;
        margin-right: 20px !important;
        margin-bottom: 0px;
        margin-top: 0px;
        text-align: center;
    }

    .main__hero {
        height: 300px;
    }

    .main__hero__text {
        padding-top: 40px;
    }

    #background-video {
        height: 350px;
    }

    .main__hero__text__p-exp {
        margin: 20px;
    }

    .main__plani__info {
        height: 300px !important;
    }
    .main__plani__info__text {
        height: 300px !important;
    }

}

.qoute>div>img {
    display: flex;
    filter: invert(37%) sepia(82%) saturate(1163%) hue-rotate(154deg) brightness(94%) contrast(101%);
    line-height: 30px;
    height: 30px !important;
}

.qoute>div {
    display: flex;
    align-items: center;
    padding: 20px;
    border: solid #0095a9 2px;
    border-radius: 25px;
    width: 80%;
    margin: 0 auto;
}


/* HOVER NAVBAR */

/* Dropdown Button */
.dropbtn {
    padding: 16px;
    font-size: 16px;
    border: none;
}

/* The container <div> - needed to position the dropdown content */
.dropdown {
    position: relative;
    display: inline-block;
}

/* Dropdown Content (Hidden by Default) */
.dropdown-content {
    display: none;
    position: absolute;
    background-color: #f1f1f1;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
    z-index: 1;
    margin-top: 10px;
}

/* Links inside the dropdown */
.dropdown-content a {
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;

    text-decoration: none !important;
    font-family: 'Raleway';
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: 1px;
    font-weight: 400;
    color: #000;
}

.dropdown-content a:hover {
    background-color: #ddd;
}

.dropdown:hover .dropdown-content {
    display: block;
}


/* LOADING ANIMATIONS  */

@media (min-width: 1000px) {

    .main__hero__text__p-exp {
        opacity: 0;
        transition: all 2s;
    }

    .main__hero__text__p-gray {
        transition: all 2s cubic-bezier(0.215, 0.610, 0.355, 1) !important;
        margin-left: -100vw;
        margin-right: 100vw;
    }

    .main__hero__text__p-blue {
        transition: all 2s cubic-bezier(0.215, 0.610, 0.355, 1) !important;
        margin-left: 100vw;
        margin-right: -100vw;
    }

    /* .main__hero__text__p-gray:hover {
        margin-right: 0px !important;
        padding-left: 200px !important;
    } */

    /* .main__hero__text__p-blue:hover {
        margin-left: 0px !important;
        padding-left: 200px !important;
    } */

    .restored--bar {
        transition: all .5s !important;
    }
    
}

/* Responsive Header */

.navbar__responsive {
    display: none;
}

#sidebar-container {
    display: none;
    position: absolute;
}

@media (max-width: 1000px) {

    #sidebar-container {
        display: flex;
        margin-left: -50vw;
        transition: all 300ms !important;
    }

    .header {
        position: fixed;
        z-index: 1001;
    }

    .navbar__responsive {
        width: 100%;
        position: fixed;
        top: 80px;
        height: 100%;
        z-index: -1;
        display: flex;
    }

    .navbar__responsive__list {
        width: 50%;
        height: 100%;
        display: flex;
        flex-direction: column;
        background-color: #FFF;
        z-index: 3;
    }

    .navbar__responsive__list--second {
        position: absolute;
        width: 40%;
        left: 10%;
        height: 100%;
        display: flex;
        flex-direction: column;
        background: #D5D9DB;
        z-index: 2;
        transition: all 300ms !important;
    }
    .navbar__responsive__list--second--comer {
        position: absolute;
        width: 40%;
        left: 10%;
        height: 100%;
        display: flex;
        flex-direction: column;
        background: #D5D9DB;
        z-index: 2;
        transition: all 300ms !important;
    }
    .navbar__responsive__list--second--asg {
        position: absolute;
        width: 40%;
        left: 10%;
        height: 100%;
        display: flex;
        flex-direction: column;
        background: #D5D9DB;
        z-index: 2;
        transition: all 300ms !important;
    }

    .header__nav__item {
        padding: 15px 15px;
        border-top: 1px solid #F5F3F1;
        border-bottom: 1px solid #F5F3F1;
        margin: 0px;
    }

    .navbar__responsive__list--second>div>.header__nav__item {
        padding: 15px 15px;
        border: none;
    }
    .navbar__responsive__list--second--comer>div>.header__nav__item {
        padding: 15px 15px;
        border: none;
    }
    .navbar__responsive__list--second--asg>div>.header__nav__item {
        padding: 15px 15px;
        border: none;
    }

    .navbar__responsive__search {
        width: 100%;
        height: 55px;
        padding: 5px 10px;
        border: 1px solid #555;
        display: block;
    }


}



.main__plani__info--inv {
    opacity: 0;
}

.main__plani__info {
    display: flex;
    height: 200px;
    margin-top: 40px;
}

.main__plani__info__img {
    /*background-image: url(https://grupomexicoblobstorage.blob.core.windows.net/websiteresources/assets/0d7a354d-1a0b-4c3e-aef0-0001bf691111.jpeg);*/
    background-image: url(https://grupomexicoblobstorage.blob.core.windows.net/websiteresources/assets/0d7a354d-1a0b-4c3e-aef0-0001bf691111.jpeg);
    filter: invert();
    background-size: cover;
    width: 30%;
}

/* .main__plani__info__text {
    background-color: #d7282f;
    width: 70%;
    padding: 40px;
    transition: all 1s;

} */

/* .main__plani__info__text {
    position: absolute;
    width: 70%;
    height: 200px;
    left: 30%;
    padding: 20px;
    transition: all .2s;
} */

.main__plani__info__text > span {

}

.main__plani__info__text > p {

}

@media (max-width: 450px) {

    .footer {
        padding-top: 100px !important;
        height: 300px;
    }
    .main__plani__info {
        flex-direction: column;
        height: 540px;
        margin-top: 40px;
        position: relative;
    }

    .main__plani__info__img {
        height: 70%;
        width: 100%;
    }

    .main__plani__info__text {
        height: 30%;
        width: 100%;
        padding: 20px;
        top: 70%;
        left: 0%;
        height: 200px !important;
    }

    .main__plani__info__text>span {
        font-size: 32px;
    }

    .main__plani__info__text>p {
        font-size: 12px;
        line-height: 24px;
        margin-top: 10px;
        text-align: justify;

    }

}

.e-indicator-bars {
    display: none !important;
}


/* Lupa Jeje */

.header__nav__item--search {
    position: relative;
}

.header__nav__item--search > img  {
    height: 10px;
    position: absolute;
    right: 5px;
    top: 6px;
    z-index: 3;
}

.navbar__responsive__search + img {
    height: 20px;
    position: absolute;
    right: 52%;
    top: 20px;
    z-index: 3;
}

.main__compromise__container {
    width: 950px;
    margin: 30px auto;
    display: flex;
    height: 400px;
}
.main__compromise__container__item {
    height: 400px;
    display: flex;

}
.main__compromise__container__item--sec {
    flex-direction: row-reverse;
    background-color: #F5F3F1;
}
.main__compromise__container__item__img {
    width: 15%;
}
.main__compromise__container__item__text {
    width: 85%;

    padding: 0px 15px;

    & span {
        color: #d7282f;
        text-align: justify;
        font-family: Barlow Condensed;
        font-size: 18px;
        font-style: normal;
        font-weight: 600;
        line-height: 25px; /* 138.889% */
        letter-spacing: 1px;
        text-transform: uppercase;    
    }
    & p {
        color: #000;
        text-align: justify;
        font-family: Barlow Condensed;
        font-size: 14px;
        font-style: normal;
        font-weight: 400;
        line-height: 25px; /* 178.571% */
        letter-spacing: 1px;
        text-transform: uppercase;    
    }

}

.main__compromise__container__item__img--1 {
    background-image: url('https://grupomexicoblobstorage.blob.core.windows.net/websiteresources/assets/images/compromiso/WhatsApp_Image_2023-10-26_at_15.34.05-removebg-preview.png');
    background-repeat: no-repeat ;
    background-size: contain;
    background-position-x: center;
    margin: 20px;
}
.main__compromise__container__item__img--2 {
    background-image: url('https://grupomexicoblobstorage.blob.core.windows.net/websiteresources/assets/images/compromiso/WhatsApp_Image_2023-10-26_at_15.34.05__1_-removebg-preview (1).png');
    background-repeat: no-repeat ;
    background-size: contain;
    background-position-x: center;
    margin: 20px;

}
.main__compromise__container__item__img--3 {
    background-image: url('https://grupomexicoblobstorage.blob.core.windows.net/websiteresources/assets/images/compromiso/WhatsApp_Image_2023-10-26_at_15.34.05__2_-removebg-preview.png');
    background-repeat: no-repeat ;
    background-size: contain;
    background-position-x: center;
    margin: 20px;

}
.main__compromise__container__item__img--4 {
    background-image: url('https://grupomexicoblobstorage.blob.core.windows.net/websiteresources/assets/images/compromiso/WhatsApp_Image_2023-10-26_at_15.34.05__3_-removebg-preview.png');
    background-repeat: no-repeat ;
    background-size: contain;
    background-position-x: center;
    margin: 20px;
}


@media (max-width: 2000px) {
    .main__tabs {
        margin-top: 600px;
    }
    
}

@media (max-width: 1100px) {
    /* .oportunidades__carousel__item__text__title {
      width: 100% !important;
    }
    .oportunidades__carousel__item__text__desc {
      width: 100% !important;
    } */
    
    .oportunidades__carousel__item {   
/*         width: 80% !important;
 */ }

    .main__hero__plani_info {
        display: none !important;
    }

    .main__compromise__container__item__text {
        width: 100%;
        height: max-content;
        padding: 10px 10px;
        & p {
            font-size: 12px;
        }
        & span {
            margin-bottom: 10px;
        }
    }

    .main__compromise__container {
        width: 100%;
    }
    .main__compromise__container__item {
        height: max-content;
    }
    .main__compromise__container__item__img {
        display: none;
    }

  }


  .main__hero__plani_info {
    display: flex;
    position: absolute;
    width: 500px;
    height: 550px;
    right: 0px;
    background-color: #F5F3F1;  

    & .main__hero__plani_info__container {
        background-color: #F5F3F1;
        height: 400px;

    }
}

.main__plani__info__text {
    display: flex;
    flex-direction: column;
    padding: 0px 80px;
    position: absolute;
    width: 500px;
    left: 0px;

    transition: all .5s;
}

.main__plani__info__text > span {
    box-sizing: border-box;
    padding: 0;
    margin: 0;
    color: #d7282f;
    color: #d7282f;
    text-align: justify;
    font-family: Barlow Condensed;
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    line-height: 25px;
    letter-spacing: 1px;
    /* text-transform: uppercase; */
    text-align: center;     
}
.main__plani__info__text > span > small {
    text-transform: uppercase;
    font-size: 18px;
}
.main__plani__info__text > p {
    box-sizing: border-box;
    padding: 0;
    margin: 0;
    color: #000;
    text-align: justify;
    font-family: Raleway;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    margin-top: 20px;
    text-align: center;     
}
.main__hero__plani_info__container {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.slider__info {
    cursor: pointer;
}


@media (max-width: 1000px) {


    /* .oportunidades__carousel__item__text__title__item {

        justify-items: center;

        & .comercializacion {
            display: none;
        }
        & .date {
            display: none;
        }
        & .area {
            display: none;
        }
        & .title {
            width: 100% !important ;
        }
    }
    .oportunidades__carousel__item__text__title__item--desc {
        & .contact {
            display: none;
        }
    } */

}
@media (max-width: 500px) {
   
    

    

    .main__tabs {
        margin-top: 800px !important;
    }


    

    .main__plani__info__text {
        padding: 0px 0px;
        left: 130px;
        width: 350px;

    }

    .main__hero__plani_info {
        display: flex !important;
        top: 280px;
        align-items: center;
        z-index: -3;
    }

    .main__row {
        margin-top: 90px;
    }

    .tab__card__text {

        & a {
            bottom: 420px;
            left: 20px;
        }
    }
    .tabs__card {
        height: 700px;
    }

    .footer {
        padding-top: 50px !important;
    }
}

@media (max-width: 1200px) {

    .main__hero__text__p-bar {
        text-align: start;
    }

    .oportunidades__carousel__item__text__desc {
        display: none !important;
    }


    .tab__card__text {
        height: 260px;
    }
}

.compromise {
    width: 100%;

    & .compromise__grid {
        width: 1200px;
        margin: 200px auto 0px;
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        column-gap: 40px;

        & .compromise__grid__item {
            display: flex;
            flex-direction: column;
            &  img {
                display: flex;
                margin: 20px auto 20px;
                width: 50px;
            }
            & span {
                color: #454545;
                font-family: Barlow Condensed;
                font-size: 18px;
                font-style: normal;
                font-weight: 500;
                line-height: 25px;
                letter-spacing: 1px;
                text-transform: uppercase;  
                display: inline-block;
                margin: 0px auto 20px;  
            }
            & p {
                color: #000;
                text-align: center;
                font-family: Raleway;
                font-size: 13px;
                font-style: normal;
                font-weight: 400;
                line-height: 20px;
                letter-spacing: 1px;
                padding: 0px;
            }
            .familias {
                line-height: 44px;
            }
        }
    }

}

.tabs__card {
    height: 250px;
    width: 950px;
    margin: 0 auto;
}


.tab__card__text {
    padding: 20px;

    & p {
        margin-top: 10px !important;
    }
    & span {
        font-size: 16px !important;
    }
}

.tab__card__text__a {
    background-color: #0000 !important;
    color: #0096A9 !important;
    border-bottom: 1px solid #0096A9 !important;
    text-decoration: none;
    left: 20px !important;
    bottom: 20px !important;

}

.main__tabs > div > ul {
    margin: 0 auto;
    width: 950px;
}


.compromise--responsive {
    display: none;
}

.main__tabs {
    margin-bottom: 40px;
    /* margin-top: 600px; MOVED TO DESKTOP MEDIA QUERY */
}

@media (max-width: 500px) {
    /* COMMENTED OUT - Causing footer overlap in mobile
     .compromise__grid {
        width: 100% !important;
        margin: 50px auto !important;
        padding: 0px 20px;
        grid-template-rows: repeat(4, 1fr) !important;
        grid-template-columns: 1fr !important;
    }

    .compromise__grid__item > span {
        margin: 10px 0 !important;
    }
    */

    .tabs__card {
        width: 100% !important;
        height: 500px !important;

        & .tab__card__text {
            height: 260px;
        }
        & .tab__card__text__a {
            bottom: 260px !important;
        }
    }

    .main__tabs > div > ul {
        width: 100%;
    }
    .main__tabs {
        margin-top: 1100px !important;
    }


    .main__hero__text {
        padding-top: 100px;
        height: 400px !important;
        display: flex;
        flex-direction: column;
        justify-content: space-around;
    }
}


.oportunidades__carousel__div {
    width: 950px;
    height: 450px;
    margin: 100px auto;
}


.oportunidades__carousel__item {
       background-size: cover;
       background-position-y: center;
       background-position-x: center;
       width: 100%;
       height: 100%;
       display: flex;
       flex-direction: column-reverse;
       box-shadow: 0px 0px 10px 2px rgba(0,0,0,0.5);
       -webkit-box-shadow: 0px 0px 10px 2px rgba(0,0,0,0.5);
       -moz-box-shadow: 0px 0px 10px 2px rgba(0,0,0,0.5);
    }

.oportunidades__carousel__item__text__title {
    height: 70px;
    width: 950px;
    background-color: #0096A999;
    justify-content: space-between;
}
.oportunidades__carousel__item__text__title__item--title {
    padding: 0px 20px;
    height: 40px;
}
.oportunidades__carousel__item__text__title__item--desc {padding: 0px 20px; 
    height: 30px;
    background-color: #727272dd;
}
.oportunidades__carousel__item__text__title__item {
    display: flex;
    flex-wrap: nowrap;
    width: 100%;
    padding: 0px 15px;
    justify-content: space-between;

    position: relative;

    & span {
        color: #FFF;
        font-family: Fjalla One;
        font-size: 20px;
        font-style: normal;
        font-weight: 400;
        letter-spacing: 1px;
        text-transform: uppercase;
        display: flex;
        justify-content: center;
        align-items: center;
        width: 19%;
    }
    & .title {
        width: 30%;
        justify-content: start;
    }
    & .comercializacion {
        width: 32%;

    }
    & p {
        color: #FFF;
        font-family: Barlow Condensed;
        font-size: 14px;
        font-style: normal;
        font-weight: 500;
        line-height: 30px;
        letter-spacing: 1px;
        /* text-transform: uppercase; */
        position: absolute;
    }
    & .contact {
        left: 295px;
    }
    & .date {
        left: 612px;
    }
    & .area {
        left: 800px;
    }
}


.oportunidades__carousel__item__text__title__item > .title {
    width: 30%;
    justify-content: start;
}


.oportunidades__carousel__item__text__desc {
    height: 140px;
    width: 950px;
    background-color: #FFF;
    display: flex;
    padding: 15px;
}

.oportunidades__carousel__item__text__desc__item {
    width: 50%;
    display: flex;
    justify-content: end;
    & p {
        color: #454545;
        text-align: justify;
        font-family: Raleway;
        font-size: 12px;
        font-style: normal;
        font-weight: 500;
        line-height: 20px;
        letter-spacing: 1px;
    }
    & div {
        width: 80px;
        height: 100%;
        background-size: contain;
        background-repeat: no-repeat;
        background-image: url('https://grupomexicoblobstorage.blob.core.windows.net/websiteresources/assets/images/comer/oportunidades/logos/cinemex.png');
        background-position-y: center;        
        margin-left: 20px;
    }
}

/* NOTA: Las reglas del carousel se han movido a los CSS específicos de cada página
   para evitar conflictos. No agregar reglas de carousel aquí. */

/* Commented out carousel styles - moved to page-specific CSS
.e-carousel.e-partial .e-carousel-slide-container {
    padding: 0 25%;
}

@media(max-width: 2000px) {
    .e-carousel.e-partial .e-carousel-slide-container {
        padding: 0 21%;
    }
}
@media(max-width: 1700px) {
    .e-carousel.e-partial .e-carousel-slide-container {
        padding: 0 17%;
    }
}
@media(max-width: 1500px) {
    .e-carousel.e-partial .e-carousel-slide-container {
        padding: 0 10%;
    }
}
@media(max-width: 1300px) {
    .e-carousel.e-partial .e-carousel-slide-container {
        padding: 0 9%;
    }
}
@media(max-width: 1200px) {
    .e-carousel.e-partial .e-carousel-slide-container {
        padding: 0 0%;
    }
}
*/

/* Tablet/Mobile responsive styles for oportunidades carousel */
@media (max-width: 1000px) {
    .oportunidades__carousel__item__text__title {
        width: 100% !important;
    }
    .oportunidades__carousel__item__text__desc {
        width: 100% !important;
    }

    /* COMMENTED OUT - Causing footer overlap in mobile
    .compromise__grid {
        width: 100% !important;
        margin: 50px auto !important;
        padding: 0px 20px;
        grid-template-rows: repeat(2, 1fr) !important;
        grid-template-columns: repeat(2, 1fr) !important;
    }
    */
}



.control-container {
    height: 550px;
}

.social__container {
    display: flex;
}
.social__container__icons {
    width: 100%;
    display: flex;
    align-items: center;
    margin-bottom: 10px;
}
.social__container__icons__icon {
    display: flex;
    background-color: #545859;
    margin-left: 8px;
    height: 20px;
    width: 20px;
    border-radius: 50%;
    cursor: pointer;
    text-decoration: none;
}
.social__container__icons__icon:first-child {
    margin-left: 0px;
}
.social__container__icons__icon__li {
    filter: invert(80%) sepia(60%) saturate(4%) hue-rotate(349deg) brightness(109%) contrast(87%);
    margin: 0 auto;
    font-size: 10px !important;
}
.svg__logo {
    height: 35px;
    filter: invert(33%) sepia(8%) saturate(191%) hue-rotate(145deg) brightness(97%) contrast(92%);
}

.e-previous > button {
    margin-top: 100px;
}
.e-next > button {
    margin-top: 100px;
}


.e-previous > button > span {
    position: relative;
    padding-top: 0px !important;
    top: -10px !important;
}

.e-next > button > span {
    position: relative;
    padding-top: 0px !important;
    top: -10px !important;
}

@media (max-width: 1200px) {

    .e-previous {
        position: relative;
    }
    .e-previous > button {
        position: absolute;
    }
    .e-next > button {
        margin-top: 200px;
    }
}

/*1450 px*/
@media (max-width: 1700px) {

    .main__hero__text__p-gray {
        padding-left: 50px !important;
    }
    .main__hero__text__p-blue {
        margin-left: 0px !important;
        padding-left: 50px !important;
        font-size: 26px;
    }

}



@media (max-width: 500px) {
    .tab__card__img--tab1 {
        background-size: cover !important;
        background-position-x: 0px !important;
    }

    .social__container {
        flex-direction: column;
    }

    /* COMMENTED OUT - Causing footer overlap in mobile
    .compromise__grid {
        width: 100% !important;
        margin: 50px auto !important;
        padding: 0px 20px;
        grid-template-rows: repeat(4, 1fr) !important;
        grid-template-columns: 1fr !important;
    }
    */
}


.detail {
    position: relative;
  
    & .detail__hero__info {
      position: absolute;
      top: 40px;
      left: 40px;
      height: 200px;
      width: 400px;
      display: flex;
      flex-direction: column;
  
      & .detail__hero__info--blue {
        background-color: #0096a9;
        height: 100px;
        width: 100%;
        display: flex;
  
        & img {
          height: 100px;
          padding: 10px;
          margin: 0 auto;
        }
      }
      & .detail__hero__info--light--gray {
        background-color: #f5f3f1;
        height: 50px;
        width: 100%;
        padding: 10px;
  
        & div {
          display: flex;
          justify-content: space-between;
  
          & b {
            color: #53575a;
            text-align: justify;
            font-family: Raleway;
            font-size: 14px;
            font-style: normal;
            font-weight: bolder;
            line-height: 30px; /* 142.857% */
            letter-spacing: 1px;
            text-transform: capitalize;
          }
          & p {
            color: #53575a;
            text-align: justify;
            font-family: Raleway;
            font-size: 14px;
            font-style: normal;
            font-weight: 500;
            line-height: 30px; /* 142.857% */
            letter-spacing: 1px;
            text-transform: capitalize;
          }
        }
      }
  
      & .detail__hero__info--gray {
        background-color: #dadad8;
        height: 50px;
        width: 100%;
        padding: 10px;
  
        & div {
          display: flex;
          justify-content: space-between;
  
          & b {
            color: #53575a;
            text-align: justify;
            font-family: Raleway;
            font-size: 12px;
            line-height: 18px;
            font-style: normal;
            font-weight: bolder;
            letter-spacing: 1px;
            text-transform: capitalize;
          }
          & p {
            color: #53575a;
            text-align: justify;
            font-family: Raleway;
            font-size: 12px;
            font-style: normal;
            font-weight: 500;
            letter-spacing: 1px;
            text-transform: capitalize;
          }
          & a {
            color: #53575a;
            text-align: justify;
            font-family: Raleway;
            font-size: 12px;
            font-style: normal;
            font-weight: 500;
            letter-spacing: 1px;
            text-transform: lowercase;
          }
        }
      }
    }
    & .detail__hero__close {
      background-color: #0096a9;
      position: absolute;
      top: 40px;
      right: 40px;
      width: 60px;
      height: 60px;
  
      font-weight: bolder;
      line-height: 60px;
      font-size: 30px;
      color: #fff;
      font-family: "Raleway";
      border-radius: 5px;
      text-align: center;
    }
    & .detail__hero__close:hover {
      cursor: pointer;
      transition: all 0.2s;
      transform: scale(1.1);
      background-color: #085964;
    }
  
    & .detail__hero__img {
      height: 300px;
      width: 100%;
      object-fit: cover;
      background-size: cover;
    }
  
    & .detail__about {
      padding: 40px 40px 0px;
      margin-bottom: 40px;
  
      & span {
        display: inline-block;
        margin-bottom: 20px;
        color: #d7282f;
        font-family: Raleway;
        font-size: 18px;
        font-style: normal;
        font-weight: 700;
        line-height: 19.8px; /* 110% */
        letter-spacing: 1px;
        text-transform: uppercase;
      }
      & p {
        color: #727272;
        text-align: justify;
        font-family: Raleway;
        font-size: 14px;
        font-style: normal;
        font-weight: 400;
        line-height: 20px; /* 142.857% */
        letter-spacing: 1px;
      }
    }
    & .detail__tenant__icons {
      margin: 0 auto 40px;
      width: 940px;
      display: grid;
      grid-template-columns: repeat(6, 1fr);
      column-gap: 20px;
      row-gap: 20px;
  
      & .detail__tenant__icons_item {
        justify-self: center;
        width: 140px;
        height: 100px;
        object-fit: contain;
        padding: 10px;
  
        box-shadow: -1px -1px 9px 0px rgba(0, 0, 0, 0.5);
        -webkit-box-shadow: -1px -1px 9px 0px rgba(0, 0, 0, 0.5);
        -moz-box-shadow: -1px -1px 9px 0px rgba(0, 0, 0, 0.5);
      }
    }
    & .detail__tab--selector {
      padding: 0px;
  
      & ul {
        background-color: #efefef;
        display: flex;
        width: 100%;
        justify-content: space-around;
        padding: 0px 40px;
        margin-bottom: 40px;
        margin: 0 auto;
  
        & .tab-selector--splitter {
          height: fit-content;
        }
  
        & .tab-selector--splitter:after {
          content: "";
          width: 10px;
          height: 20px;
          top: -10px;
          background: gray;
          position: absolute;
        }
  
        & li {
          color: #545859;
          font-family: Barlow Condensed;
          font-size: 18px;
          font-style: normal;
          font-weight: 500;
          line-height: 50px; /* 277.778% */
          letter-spacing: 1px;
          text-transform: uppercase;
          list-style: none;
          cursor: pointer;
        }
        & .selected {
          font-weight: bolder;
          color: #d7282f;
        }
      }
    }
  
    & .detail__tab--contents {
      & #detail__tab--content--1 {
        padding: 0 40px;
  
        & .map {
          width: 100%;
          margin-top: 40px;
          margin-bottom: 40px;
          border: 10px solid #f5f3f1;
          background-color: #0096a9;
        }
      }
  
      & #detail__tab--content--2 {
        padding: 40px 40px;
  
        & .indicators__list {
          & .indicators__list__header {
            height: 50px;
            background-color: #f5f3f1;
            padding-left: 20px;
  
            & span {
              color: #d7282f;
              font-family: Raleway;
              font-size: 18px;
              font-style: normal;
              font-weight: bolder;
              line-height: 50px; /* 110% */
              letter-spacing: 1px;
              text-transform: uppercase;
            }
          }
          & .indicators__list__item {
            background-color: #dadad8;
  
            display: grid;
            grid-template-columns: repeat(2, 1fr);
  
            justify-content: space-between;
            align-items: center;
            padding: 0 20px;
  
            & div {
              padding: 10px 10px;
              display: flex;
              flex-direction: column;
              height: 100%;
              & p {
                color: #53575a;
                text-align: justify;
                font-family: Raleway;
                font-size: 18px;
                font-style: normal;
                font-weight: 400;
                line-height: 20px; /* 111.111% */
                letter-spacing: 1px;
                text-transform: capitalize;
              }
              & small {
                display: inline-block;
                margin-bottom: 10px;
                color: #53575a;
                text-align: justify;
                font-family: Raleway;
                font-size: 14px;
                font-style: normal;
                font-weight: 700;
                line-height: 20px; /* 142.857% */
                letter-spacing: 1px;
                text-transform: capitalize;
              }
            }
          }
          & .indicators__list__item--second {
            background-color: #f5f3f1;
  
            display: grid;
            grid-template-columns: repeat(3, 1fr);
  
            justify-content: space-between;
            align-items: center;
            padding: 0 20px;
  
            & div {
              padding: 10px 10px;
              & p {
                color: #53575a;
                text-align: justify;
                font-family: Raleway;
                font-size: 18px;
                font-style: normal;
                font-weight: 400;
                line-height: 20px; /* 111.111% */
                letter-spacing: 1px;
                text-transform: capitalize;
              }
              & small {
                color: #53575a;
                text-align: justify;
                font-family: Raleway;
                font-size: 12px;
                font-style: normal;
                font-weight: 700;
                line-height: 20px; /* 142.857% */
                letter-spacing: 1px;
                text-transform: capitalize;
              }
            }
          }
        }
  
        & .indicators__list--second {
          padding-top: 50px !important;
          background-color: #f5f3f1;
        }
      }
  
      & #detail__tab--content--3 {
        display: flex;
  
        & iframe {
          margin: 50px auto;
        }
      }
    }
  }

  .map__footer {
    background-color: #f5f3f1;
    min-height: 100px;
    border-bottom: 1px solid #ababab;
    display: flex;
    justify-content: space-around;
    position: relative;
  }
  .map__footer__item {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    & span {
      color: #d7282f;
      text-align: center;
      font-family: Raleway;
      font-size: 32px;
      font-style: normal;
      font-weight: 700;
      line-height: 19.8px; /* 61.875% */
      letter-spacing: 1px;
      text-transform: uppercase;
    }
  
    & p {
      color: #97928a;
      text-align: center;
      font-family: Barlow Condensed;
      font-size: 11px;
      font-style: normal;
      font-weight: 500;
      line-height: 15.71px; /* 142.818% */
      letter-spacing: 1px;
      text-transform: uppercase;
    }
  }
  
  .map__footer__item:after {
    content: "";
    width: 1px;
    height: 60px;
    background: #ababab;
    position: absolute;
    right: -110px;
  }
  .map__footer__item--last:after {
    content: "";
    width: 0px;
    height: 0px;
  }


  .e-dlg-center-center {
    position: fixed !important;
  }

  #dialog_dialog-content {
    padding: 0px ;  
  }


.main__plani__info__selector {

    position: relative;
    color: #d7282f;
    color: #d7282f;
    font-size: 35px;
    margin: 0px;
    width: 500px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0px 20px;
}

.slider__info:hover {
    font-size: 40px;
}

.main__tabs {
    margin-top: 400px !important;
    margin-bottom: 40px !important;
}

@media(max-width: 1200px) {
    
    .main__tabs {
        margin-top: 550px !important;
        margin-bottom: 40px !important;
    }   
}




.languaje--selector {
    position: absolute;
    z-index: 10000;
    right: 9vw;
    top: 8px;

    list-style: none;
    color: #9b9999 ;
    font-family: 'Raleway';
    font-size: 10px;
    margin: 0 20px 5px auto;
    letter-spacing: 1px;

    & li > b > a {
        color: #9b9999 !important;  
        font-size: 13px;
        text-decoration: none;
    }
    & li  > a {
        text-decoration: none;
        color: #9b9999 !important;  
    }

}

@media(max-width: 1800px) {
    .languaje--selector {
        right: 8vw;
    }
}
@media(max-width: 1700px) {
    .languaje--selector {
        right: 7vw;
    }
}
@media(max-width: 1600px) {
    .languaje--selector {
        right: 6vw;
    }
}
@media(max-width: 1500px) {
    .languaje--selector {
        right: 5vw;
    }
}
@media(max-width: 1400px) {
    .languaje--selector {
        right: 4vw;
    }
}
@media(max-width: 1300px) {
    .languaje--selector {
        right: 2vw;
    }
}
@media(max-width: 1200px) {
    .languaje--selector {
        right: 0vw;
    }

    .main__plani__info__selector {
        display: none;
    }

    .main__tabs {
        margin-top: 600px !important;
    }

    .e-carousel-navigators {
        display: none !important;
    }
}
@media(max-width: 1000px) {

    .main__tabs {
        margin-top: 600px !important;
    }
}
@media(max-width: 600px) {

    .main__tabs {
        margin-top: 700px !important;
    }
}
@media(max-width: 500px) {

    .main__tabs {
        margin-top: 1000px !important;
    }
}

/* ============================================
   CAROUSEL BUTTON STYLES MOVED TO COMPONENT
   ============================================
   Los estilos de botones del carousel (.e-previous, .e-next)
   fueron movidos a: shared/css/components/properties-carousel.css
   
   Fecha: 2026-02-07
   Razón: Mejor organización - estilos del carrusel en su archivo
   ============================================ */

@keyframes gray__hero_anim {
    from {
    }
    to {
        margin: 0px;
        margin-right: 40vw;
        margin-bottom: 10px;   
    }
}
@keyframes blue__hero_anim  {
    from {
    }
    to
    {
    
        margin: 0px;   /*Espaciado entre lienas hacia abajo*/
       /* margin-left: 50px;     recorre la linea azul hacia Derecha  con todo y letras (antes estaba en 100)*/
        margin-bottom: 10px;   /*espaciado entre linea de arriba*/
    }
}


.main__hero__text__p-gray {
    animation-name: gray__hero_anim;
    animation-play-state: running;
    animation-fill-mode: forwards;
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1);
    animation-duration: 2s;
    margin-bottom: 10px;   

}
.main__hero__text__p-blue {
    animation-name: blue__hero_anim; 
    animation-play-state: running;
    animation-fill-mode: forwards;
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1);
    animation-duration: 2s;
    margin-bottom: 10px;
}

.alert {
    position: fixed;
    opacity: 1;
    z-index: 10001;
    display: flex;
    justify-content: center;
    align-items: center;

    height: 100%;
    width: 100vw;
    background-color: #55555566;

    transition: all .3s;
}
.alert-clicked {
    opacity: 0;
}

.alert > .alert_container {
    width: 90%;
    max-width: 900px;
    min-height: 300px;
    background-color: #F5F3F1;
    border-radius: 25px;
    -webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);
    box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);
    padding: 30px 60px;

    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.alert > .alert_container > h3 {

    font-family: Fjalla One;
    font-size: 36px;
    color: #727272;
    text-align: center;

    margin-bottom: 40px;
}

.alert > .alert_container > .alert-images_container {
    display: flex;
    justify-content: space-around;
    margin-bottom: 20px;
}
.alert > .alert_container > .alert-images_container > .plani-logo {
    max-width: 150px;
    margin-left: 50px;
    margin-right: 50px;
    height: 150px;
    flex: 1;
}
.alert > .alert_container > .alert-images_container > .gmi-logo {
    max-width: 250px;
    height: 150px;
    flex: 1;
}
.alert > .alert_container > .alert-images_container > i {
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 50px;
}
.alert > .alert_container > .alert-button_container {
    display: flex;
    justify-content: center;
}
.alert > .alert_container > .alert-button_container > button {
    background-color: #0095a9;
    height: 50px;
    width: 200px;
    font-family: Fjalla One;
    color: #FFF;
    font-size: 20px;

}

@media (max-width: 600px) {
    .alert-images_container {
        flex-direction: column;
        align-items: center;
    }
    .alert-images_container > img {
        margin: 20px;
    }
    
}

/*  estilos para safari */

/* Estilos globales */
body {
    font-family: 'Raleway', sans-serif;
    margin: 0;
    padding: 0;
}

/* Otros estilos... */

/* Ajustes específicos para Safari */
@supports (-webkit-appearance: none) {
    /* Estilos específicos para Safari */
    .e-carousel-navigators {
        top: 0px !important;
        padding: 0px 20px !important;
        -webkit-transform: translateZ(0); /* Para evitar problemas de renderizado */
    }

    .e-carousel .e-carousel-navigators .e-next .e-btn-icon,
    .e-carousel .e-carousel-navigators .e-previous .e-btn-icon {
        color: #d7282f;
        font-size: 25px;
        margin: 0px;
        -webkit-font-smoothing: antialiased; /* Mejora la calidad del texto en Safari */
    }
/*  agrega linea rojo extra (No)
    .e-carousel-indicators {
        background-color: #d7282f;
        -webkit-border-radius: 10px;
    }
*/
}

.e-carousel {
    will-change: transform, opacity;
}

/* fin seccion safari */