/* FUENTE PERSONALIZADA */
@font-face {
  font-family: 'BrandingBold';
  src: url('fonts/BrandingBold.ttf') format('truetype');
}

/* RESET Y BODY */
* {
  margin:0;
  padding:0;
  box-sizing:border-box;
  font-family:'BrandingBold', sans-serif;
}
body {
  background:#000;
  color:#fff;
  transition:0.3s;
}

/* HEADER */
header {
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:10px 20px;
  background:#fa0149;
  position:fixed;
  top:0;
  width:100%;
  z-index:100;
}
header .logo img {
  height:50px;
  width:auto;
  transition:0.3s;
}
header .logo img:hover {
  transform:scale(1.05);
}
.menu-hamburger {
  cursor:pointer;
}
.menu-hamburger img {
  width:35px;
  height:35px;
  transition:0.3s;
}
.menu-hamburger img:hover {
  transform:scale(1.1);
}

/* MENÚ LATERAL */
#sideMenu {
  position:fixed;
  top:60px;
  right:-250px;
  width:250px;
  height:100%;
  background:#fa0149;
  transition:0.4s;
  padding-top:10px;
  z-index:99;
}
#sideMenu ul {
  list-style:none;
}
#sideMenu ul li {
  margin:15px 0;
  padding-left:20px;
}
#sideMenu ul li a {
  color:#fff;
  text-decoration:none;
  font-size:18px;
  transition:0.3s;
}
#sideMenu ul li a:hover {
  text-decoration:underline;
}

/* SECCIÓN DIVISIONES Y COPAS */
.tournaments {
  width:80%;
  max-width:1200px;
  margin:100px auto 50px auto;
  display:flex;
  flex-direction:column;
  gap:30px;
}
.tickets-container {
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
  gap:90px;
}
.ticket {
  background:#111;
  border:2px solid #fa0149;
  border-radius:10px;
  overflow:hidden;
  cursor:pointer;
  transition:0.3s;
  position:relative;
}
.ticket img {
  width:100%;
  aspect-ratio:16/9;
  object-fit:cover;
  transition:0.3s;
}
.ticket:hover {
  transform:scale(1.02);
  box-shadow:0 0 15px #fa0149;
}

/* FOOTER */
footer {
  display:flex;
  justify-content:space-between;
  align-items:center;
  flex-wrap:wrap;
  padding:20px;
  background:#000;
  border-top:2px solid #fa0149;
}
footer .logo-footer img {
  height:40px;
  width:auto;
}
footer .socials a img {
  width:30px;
  height:30px;
  filter:brightness(1);
  transition:0.3s;
  margin-left:10px;
}
footer .socials a img:hover {
  filter:brightness(1.2) drop-shadow(0 0 5px #fa0149);
}
footer .copyright {
  color:#fff;
  font-size:14px;
  margin-top:10px;
}

/* RESPONSIVE */
@media(max-width:768px){
  header {
    flex-direction:row;
    justify-content:space-between;
  }
  .tickets-container {
    grid-template-columns:1fr;
  }
}