/*

Id: pg-ln-06
Nombre: Ln06
Fecha: 14/01/22
Sistema: Site Mater
*/
.section--landing{
position:relative
}
.landing .title {
    --font-size: calc(var(--min-size) * 1px + (var(--max-size) - var(--min-size)) * (100vw - var(--container-min) * 1px) / (var(--container-max) - var(--container-min)));
    font-size: clamp(var(--min-size) * 1px, var(--font-size), var(--max-size) * 1px);
}
.landing__img:before {
    content: '';
    width: 40%;
    position: absolute;
    top:  calc((var(--header-height) + var(--padding-v)) * -1);
    background: #dab6ac;
    z-index: -1;
}

.landing__img:before {
    height: calc(100% + var(--header-height));
}
.header--fixed + main .landing__img:before {
    top:  calc((var(--header-height) + var(--padding-v)) * -1);
}
.landing__button {
    padding: 0.60em 1em;
    margin:0.15em;
}

.landing__title {
    --max-size: 45;
    --min-size: 26;
}
.landing__subtitle {
    color: var(--secondary);
    --max-size: 24;
    --min-size: 22;
    letter-spacing:-0.5px;
    font-family: var(--font1);
    font-weight: var(--bold1);
}
.landing__contact-title {
    --max-size: 24;
    --min-size: 18;
}

.landing__buttons {
    display: flex;
    list-style: none;
    text-transform: uppercase;
    flex-wrap: wrap;
}
.section:not(.section--landing) .landing__buttons, .sectionImage .landing__buttons {
    justify-content: center;
}
.landing__buttons li {
    margin: 0.15rem;
}

.landing__buttons .button {
    width: 100%;
    text-align:center;
    margin:0;
    display:inline-flex;
    align-items:center;
    justify-content:center;
}




/***************************
RESPONSIVE
**************************/
/* Estilos <= 600px */
@media screen and (max-width: 600px) {
    .landing__buttons li {
        display:flex;
        flex:auto;
    }

    .landing__buttons .button--whatsapp i,
    .landing__buttons .button--outlined i {
        margin: 0;
    }

    .landing__buttons .button--whatsapp, .landing__buttons .button--outlined {
        
        padding: 0;
        font-size: 1.5rem;
        display: flex;
        justify-content: center;
        align-items: center;
    }


    .landing__buttons .button--whatsapp span, .landing__buttons .button--outlined span {
        display: none;
    }
}
/* Estilos >= 600px */
@media screen and (min-width: 601px) {
    .landing__buttons li {
        display: flex;
        
    }
    .landing__buttons .button--whatsapp i {
        margin: 0;
    }

    .landing__buttons .button--whatsapp {
        width:48px;
        height:48px;
        padding: 0;
        font-size: 1.5rem;
        display: flex;
        justify-content: center;
        align-items: center;
    }


    .landing__buttons .button--whatsapp span {
        display: none;
    }

}

/* Estilos <= 820px */
@media screen and (max-width: 820px) {
    main > .section.section--landing {
        padding:0;
    }
    .landing__img:before {
        right: calc(var(--padding-h) * -1);
    }
    .landing {
        display: flex;
        flex-direction: column;
        min-height: min(calc(var(--app-height) - var(--header-height)), 812px);
        padding:0 var(--padding-h) 1rem;
    }
    .header--fixed + main .landing{
        min-height: var(--app-height);
        padding-top:var(--header-height);
    }
    .landing__inner {
        display:flex;
        flex-direction:column-reverse;
        flex:1;
    }
    .landing__head{
            margin:0 0 1rem;
            padding:0 0 1rem;
            border-bottom:1px solid #ccc;
    }
    .landing__img {
        position:relative;
        flex: 1;
        min-height:260px;
        display: flex;
        flex-direction: column;
        justify-content: flex-end;
        margin:0 0 1.25rem;
    }
    .landing__img picture{
        position: absolute;
        left:0;
        top:0;
        z-index:-1;
    }

}

/* Estilos >= 821px */
@media screen and (min-width: 821px) {
    .header--fixed + main .section--landing{
        padding-top:calc(var(--header-height) + 1rem);
    }
    main > .section.section--landing {
        padding-top:1rem;
        padding-bottom:0;
        display:flex;
        flex-direction:column;
        justify-content:center;
    }
    .landing__img:before {
        right:0;
    }

    .landing__inner {
        display:flex;
        align-items:center;
    }
    .landing__info{
        width:50%;
        padding:2rem 0;
    }
    .landing__img{
        width:50%;
        padding-left:var(--padding-inner);
    }
    .landing__head{
            margin:0 0 1.5rem;
            padding:0 0 1.5rem;
            border-bottom:1px solid #ccc;
    }

}

/* Estilos >= 1024px */
@media screen and (min-width: 1024px) {
}

/* Estilos >= 1200px */
@media screen and (min-width: 1200px) {

}