/*====================================================
RESPONSIVE.CSS
SISWON INVITACIONES PREMIUM
====================================================*/


/*====================================================
DESKTOP GRANDES
====================================================*/

@media (min-width:1600px){

.hero-content{

    max-width:850px;

}

.hero h1{

    font-size:6rem;

}

section{

    padding:120px 40px;

}

}



/*====================================================
LAPTOP
====================================================*/

@media (max-width:1200px){

.hero-content{

    max-width:700px;

}

.cards{

    grid-template-columns:repeat(2,1fr);

}

.gallery{

    padding-left:30px;
    padding-right:30px;

}

}



/*====================================================
TABLET
====================================================*/

@media (max-width:992px){

.hero{

    padding:30px;

}

.hero-content{

    padding:45px;

}

.hero h1{

    font-size:4rem;

}

.hero h2{

    font-size:1.8rem;

}

.countdown-grid{

    grid-template-columns:repeat(2,1fr);

}

.actions{

    flex-direction:column;

    align-items:center;

}

.action{

    width:100%;
    max-width:420px;

}

.video video{

    width:100%;

}

}



/*====================================================
CELULARES
====================================================*/

@media (max-width:768px){

section{

    padding:70px 20px;

}

.hero{

    min-height:100vh;

    padding:20px;

}

.hero-content{

    padding:35px 25px;

    border-radius:25px;

}

.hero h1{

    font-size:3.2rem;

}

.hero h2{

    font-size:1.5rem;

}

.subtitle{

    font-size:.8rem;

    letter-spacing:3px;

}

.hero-date{

    font-size:1rem;

}

.cap{

    width:90px;
    height:90px;

}

.cap i{

    font-size:42px;

}

.btn-primary{

    width:100%;

}

.btn-secondary{

    width:100%;

}

.countdown-grid{

    grid-template-columns:repeat(2,1fr);

    gap:18px;

}

.countdown-grid div{

    padding:25px;

}

.countdown-grid span{

    font-size:2.4rem;

}

.cards{

    grid-template-columns:1fr;

}

.cards article{

    padding:35px;

}

.cards h3{

    font-size:1.7rem;

}

section h2{

    font-size:2.3rem;

}

.message p{

    font-size:1rem;

    line-height:1.8;

}

.video video{

    border-radius:18px;

}

.action{

    min-width:100%;

}

footer h3{

    font-size:2rem;

}

}



/*====================================================
CELULARES PEQUEÑOS
====================================================*/

@media (max-width:480px){

.hero h1{

    font-size:2.6rem;

}

.hero h2{

    font-size:1.3rem;

}

.hero-content{

    padding:28px 20px;

}

.subtitle{

    letter-spacing:2px;

}

.countdown-grid{

    gap:14px;

}

.countdown-grid div{

    padding:18px;

}

.countdown-grid span{

    font-size:2rem;

}

.cards article{

    padding:28px;

}

.cards i{

    font-size:2.5rem;

}

section h2{

    font-size:2rem;

}

footer{

    padding:60px 20px;

}

}



/*====================================================
IPHONE SE Y EQUIPOS MUY PEQUEÑOS
====================================================*/

@media (max-width:360px){

.hero h1{

    font-size:2.2rem;

}

.hero h2{

    font-size:1.1rem;

}

.cap{

    width:75px;
    height:75px;

}

.cap i{

    font-size:35px;

}

.subtitle{

    font-size:.7rem;

}

.countdown-grid{

    grid-template-columns:1fr;

}

.countdown-grid span{

    font-size:2.2rem;

}

.cards{

    gap:18px;

}

.action{

    font-size:.95rem;

}

}