@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;600;700;800;900&display=swap');

:root{
  --yellow:#FFD200;
  --orange:#FF9F00;
  --orange-soft:#FFB21A;
  --dark:#222222;
  --red:#FF3B1F;
  --pink:#FF5C8A;
}

body{
  font-family:'Montserrat', sans-serif !important;
  background:linear-gradient(180deg, #FFD200 0%, #FFE14A 45%, #FFD200 100%);
  color:var(--dark);
  text-align:center;
  padding:0;
  font-size:18px;
  min-height:100vh;
  display:flex;
  flex-direction:column;
  align-items:center;
  margin:0;
}

h1, h2{
   font-family:'Bebas Neue', sans-serif;
}
h5{
     font-family:'Montserrat', sans-serif !important;
     font-weight:400;
}


h1{
  color:var(--dark);
  font-weight:900;
  margin:30px 0 20px;
  text-transform:uppercase;
  letter-spacing:-1px;
}

h2{
  color:var(--dark);
  font-weight:900;
  text-transform:uppercase;
}

a{
  text-decoration:none;
  color:var(--red);
}

img{
  max-width:520px;
  width:90%;
  margin:45px auto 25px;
}

h5{
  background:rgba(255, 159, 0, .58);
  border:0;
  border-radius:90px;
  padding:30px 36px;
  width:78%;
  max-width:950px;
  color:var(--dark);
  font-weight:800;
  line-height:1.45;
  box-shadow:0 18px 40px rgba(255, 145, 0, .22);
}

.pulsanti{
  position:relative;
  margin:45px auto 80px;
  padding:50px 60px 60px;
  max-width:1450px;
  width:86%;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap:70px 46px;
  background:linear-gradient(135deg, #ffd200 0%, #ffa000 100%);
  border-radius:140px 140px 140px 140px;
  box-shadow:inset 0 0 0 0 rgba(255,255,255,0);
  align-items: start;
}

.button,
.button-disabled{
  background:transparent !important;
  box-shadow:none !important;
  border:0 !important;
  padding:0 !important;
  min-width:0 !important;
  max-width:none !important;
  min-height:auto !important;
  margin:0 !important;
  color:#222 !important;
  text-transform:uppercase;
}

.button:hover{
  transform:none !important;
}

.button::before{
  display:none !important;
}

.artist-photo{
  width:230px;
  height:230px;
  object-fit:cover;
  border-radius:50%;
  display:block;
  margin:0 auto 24px;
}

.coming-soon.js-status-label{
  font-size:24px !important;
   font-family:'Bebas Neue', sans-serif !important;
  font-weight:900;
  color:#222;
  margin:0 0 4px;
  line-height:1;
}

.button span,
.button-disabled span{
  font-size:45px !important;
  font-weight:900;
  line-height:.95;
  color:#222;
  letter-spacing:-1px;
}
.avviso{
  font-size:1.3rem;
  color:var(--red);
  font-weight:900;
}

footer{
  min-height:160px;
  background:var(--dark);
  display:flex;
  justify-content:center;
  align-items:center;
  width:100%;
  gap:16px;
  color:white;
  flex-direction:column;
  margin-top:auto;
}

footer a{
  color:var(--yellow);
  font-size:16px;
  font-weight:800;
}

@media(max-width:990px){
  img{
    width:88%;
    margin-bottom:30px;
  }

  h5{
    width:88%;
    border-radius:42px;
    padding:24px 20px;
  }

  .pulsanti{
    width:68%;
    padding: 50px 40px 60px;
    border-radius:100px;
    display:flex;
    justify-content: center;
    flex-wrap: wrap;
    gap:24px;
  }

  .button{
    width:90%;
    min-width:auto;
    max-width:none;
    font-size:25px;
  }
}

@media(max-width:778px){
  h1{
    font-size:30px;
  }

  .button{
    width:94%;
    font-size:23px;
    border-radius:30px;
  }

  footer{
    padding-bottom:30px;
  }
}