/*          HOME */
.home__clip{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 550px;
    clip-path: polygon(0 0, 100% 0%, 100% 90%, 0% 100%);
    background: linear-gradient(90deg, rgba(2,62,138,1) 0%, rgba(0,150,196,1) 100%);
    z-index: -1;
}
.home__content{
    text-align: center;
}
.home__animation{
    position: relative;
    width: 270px;
    height: 390px;
    margin: 0 auto;
}
.home__animation img{
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    animation: floating 3s infinite ease;
}
@keyframes floating{
    0% {top: 0;}
    50% {top: -5%;}
    100% {top: 0;}
}
.home__content .btn{
    margin: 0 auto;
}
.home__content h1,
.home__content p,
.home__animation{
    margin-bottom: 1em;
}
.home__specs__content{
    text-align: center;
    width: 100%;
    margin-top: 40px;
    border-bottom: 1px solid;
    border-color: var(--blanco);
    padding-bottom: 20px;
}
.home__specs__content:nth-of-type(5){
    border-bottom: none;
}
.home__specs__content img{
    height: 70px;
    margin-bottom: 0px;
}


/*          PROMO */
.promo{
    text-align: center;
    background-image: url(../img/celphone5.jpg);
    background-position: right;
    background-size: cover;
    position: relative;
}
.promo__bkg{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,.5);
    z-index: 0;
}
.promo h1,
.promo p,
.promo ul{
    position: relative;
    z-index: 99;
}


/*          WORKFLOW */
.workflow{
    text-align: center;
}
.workflow__content{
    margin-top: 50px;
}
.workflow__content:nth-of-type(3){
    margin-bottom: 80px;
}
.workflow__content img{
    height: 70px;
    margin-bottom: 10px;
}
#workflow > div:nth-child(7) > div:nth-child(2) > img{
    width: 100px;
}


/*          FAREWELL */
.farewell{
    
    text-align: center;
    clip-path: polygon(0 0, 100% 0%, 100% 95%, 0% 100%);
    background: linear-gradient(0deg, rgba(255,230,110,.7) 0%, rgba(255,230,110,0) 100%);
}
.farewell__img{
    width: 100%;
    height: 300px;
    border-radius: 30px;
    background-image: url(../img/celphone6.jpg);
    background-position: center;
    background-size: cover;
    margin-bottom: 20px;
}
.farewell__content a{
    margin: 0 auto;
}





@media screen and (min-width: 1024px){
section{
    padding: 60px 50px;
}
/*          MENU */
header img:nth-child(1){
    margin-left: 50px;
}
header img:nth-child(2){
    display: none;
}
header .menu{
    position: relative;
    top: 0;
    width: auto;
    display: inline-flex;
    padding: 0 20px;
    background-color: transparent;
}
header .menu .btn{
    width: auto;
    padding: 10px 20px;
    border-radius: 0;
    background-color: transparent;
    color: var(--verde);
    border: none;
    border-right: 1px solid;
    border-color: var(--blanco);
    transform: all .3s ease;
}
header .menu li:nth-child(4) .btn{
    border-right: none;
}
header .menu .btn:hover{
    background-color: var(--trans);
    box-shadow: none;
}



/*          HOME */
.home__clip{
    height: 400px;
}
.home__content{
    display: flex;
    align-items: center;
    width: 100%;
}
.home__content h1{
    width: 400px;
}
.home__animation img{
    width: 240px;
}
.home__content__info{
    width: 450px;
}
.home__container{
    display: flex;
    width: 100%;
    margin-top: -30px;
}
.home__specs__content{
    padding: 20px;
    border-bottom: none;
    border-right: 1px solid;
    border-color: var(--blanco);
}
.home__specs__content:nth-child(4){
    border-right: none;
}

.home__specs__container{
    width: 100%;
}
@keyframes floating{
    0% {top: 0;}
    50% {top: 7%;}
    100% {top: 0;}
}


/*          PROMO */
.promo{
    text-align: left;
    padding: 100px;
}


/*          WORKFLOW */
.workflow > h1,
.workflow > h2,
.workflow > p{
    text-align: left;
}
.workflow__container{
    display: flex;
    justify-content: center;
}
.workflow__content{
    width: 265px;
    padding: 0 10px;
}
#workflow > div:nth-child(7) > div:nth-child(1),
#workflow > div:nth-child(7) > div:nth-child(2){
    width: 320px;
}


/*          FAREWELL */
.farewell{
    display: flex;
    align-items: center;
}
.farewell__img{
    width: 478px;
    height: 500px;
}
.farewell__content{
    padding: 0 50px;
}

}