*{
margin:0;
padding:0;
box-sizing:border-box;
}

body{

font-family:'Montserrat',sans-serif;
background:white;
color:black;

max-width:430px;
margin:auto;

}

section{

padding:30px 20px;

}

.hero img{

width:100%;
display:block;

}

.story{

min-height:100vh;
display:flex;
align-items:center;

}

.story p{

font-size:28px;
font-weight:900;
text-align:center;
line-height:1.3;

}

.release{

min-height:100vh;
display:flex;
flex-direction:column;
justify-content:center;
align-items:center;

}

.release h1{

font-size:48px;
margin-bottom:40px;

}

#countdown{

display:grid;
grid-template-columns:repeat(2,1fr);
gap:20px;
width:100%;

}

#countdown div{

background:#f2f2f2;
padding:20px;
border-radius:18px;
text-align:center;

}

#countdown span{

font-size:38px;
font-weight:900;

}

#countdown p{

font-size:18px;

}

.trailer{

text-align:center;

}

.trailer h1{

font-size:34px;
margin-bottom:30px;

}

.video{

width:100%;
aspect-ratio:16/9;
border-radius:20px;
overflow:hidden;

}

.video iframe{

width:100%;
height:100%;
border:none;

}

.follow{

text-align:center;

}

.follow h2{

font-size:30px;
margin:40px 0;

}

.social{

display:flex;
justify-content:center;
gap:40px;
margin-bottom:50px;

}

.social a{

font-size:20px;
font-weight:800;
text-decoration:none;
color:black;

}

.button{

display:block;
text-decoration:none;
background:#999;
color:black;
padding:24px;
border-radius:50px;
font-size:22px;
font-weight:900;
border:3px solid #333;

}