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

html{

}

body{
    font-family: "Inter", sans-serif;

    color:#111;
    background:#fff;
    line-height:1.6;
}

img{
    max-width:100%;
    display:block;
}

a{
    color:inherit;
    text-decoration:none;
}

.container{
    width:min(92%,120rem);
    margin:auto;
}

/*=========================
Hero
==========================*/

.hero{
    position:relative;
    min-height:100dvh;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
    background:url("../images/hero-bg.jpg") center/cover no-repeat;
    overflow:hidden;
}

.hero_overlay{
    position:absolute;
    inset:0;
   
}

.hero_content{
    position:relative;
    z-index:2;
   
    color:#fff;
    padding:4rem 2rem;
}

.event_badge{
    display:inline-block;
    
    color:#111;
    padding: 0.425rem 1rem;
  border-radius: 999px;
background: #F59E0B;
box-shadow: 0 10px 24px -8px rgba(0, 0, 0, 0.15);
    font-size:0.875rem;
    font-weight:800;
    margin-bottom:2rem;
}

.hero h1{
    font-size:4.5rem;
    line-height:1.1;
    font-weight:800;
    margin-bottom:2rem;
}

.hero_subtitle{
    font-size:1.125rem;
    opacity:.9;
    font-weight: 500;
    margin-bottom: 1.5rem;
    
}

.hero h4{
    font-size:1.25rem;
    font-weight:600;
    margin-bottom:4rem;
        color: #F59E0B;
}

.hosted_by span{
    display:block;
       font-size: 0.813rem;
    letter-spacing:.2rem;
    margin-bottom:1.5rem;
}

.hosted_by img{
    width:4rem;
    margin:auto;
    margin-bottom: 0.5rem;
}

.hosted_by p{
   font-weight: 500;
}

/*=========================
Coming Soon
==========================*/

.coming_soon{
    padding:6rem 0;
    text-align:center;
}

.coming_soon h2{
    font-size:4rem;
    font-weight:800;
    margin-bottom:2rem;
    text-shadow:0 .6rem 1.5rem rgba(0,0,0,.25);
     display: inline-block; /* Required for transform */
    transform-origin: center;
    animation: textRotateColor 0.5s ease-in-out infinite alternate;
}

.coming_soon p{
    max-width:45rem;
    font-weight: 500;
    margin:auto;
   font-size: 1.125rem;
}

.coming_soon p+p{
    margin-top:2rem;
}

/*=========================
Footer
==========================*/

.footer{
    background:#EFEFEF;
    padding:6rem 0;
}

.footer_wrapper{
    display:flex;
    justify-content:space-between;
    gap:6rem;
}

.footer_left,
.footer_right{
    flex:1;
}

.footer h3{
    font-size:1.25rem;
    margin-bottom:1rem;
}

.footer p{
        font-weight: 600;
    margin-bottom:.5rem;
}

.footer_right{
    text-align:right;
}

.footer a{
    color:#111;
    font-weight:600;
}

/*=========================
Copyright
==========================*/

.copyright{
    background:#112847;
   
    text-align:center;
       padding: 1rem 1rem;
    font-size:0.813rem;
    color: rgba(255, 255, 255, 0.70);

}


@keyframes textRotateColor {
    0% {
        color: #000;
        transform: rotate(-5deg);
    }

    /* 50% {
        color: #000;
        transform: rotate(5deg);
    } */

    100% {
        color: #e90004;
        transform: rotate(5deg);
    }
}

/*=========================
Responsive
==========================*/

@media (max-width:992px){


.hero h1{
    font-size:5rem;
}

.hero_subtitle{
    font-size:1.8rem;
}

.hero h4{
    font-size:2.2rem;
}

.coming_soon h2{
    font-size:4.8rem;
}

.footer_wrapper{
    flex-direction:column;
}

.footer_right{
    text-align:left;
}

}

@media (max-width:768px){
.hero {height: 100dvh;}
html{
    font-size:14px;
}


.hero h1{
    font-size:3.8rem;
}

.hero_subtitle{
    font-size:1.7rem;
}

.hero h4{
    font-size:2rem;
}

.hosted_by p{
        font-size: 1.4rem;
}
.hosted_by span {     font-size: 0.913rem;}

.coming_soon{
    padding:3rem 0;
}

.coming_soon h2{
    font-size:3.8rem;
}

.coming_soon p{
          font-size: 1.2rem;
}

.footer{
    padding:3rem 0;
}

.footer h3{
        font-size: 1.5rem;
}

.footer p{
   
  
}

}

@media (max-width:480px){



.hero h1{
    font-size:3rem;
    font-weight: 600;
}

.hero_subtitle{
    font-size:1.5rem;
}

.hero h4{
    font-size:1.7rem;
}

.event_badge{
    font-size:1.2rem;
}

.coming_soon h2{
    font-size:3rem;
}

}