@media (max-width: 1300px) {
  header .container {
    padding-inline: var(--px);
  }
  header .cards {
    width: calc(100% + var(--px) * 2);
    left: calc(var(--px) * -1);
  }
  .section-2 .accordions {
    grid-template-columns: 1fr;
    gap: 26px;
  }
  .section-2 .accordions .accordion {
    border-radius: 30px;
  }
  .section-2 .accordions .accordion button {
    height: 93px;
    padding-left: 30px;
    padding-right: 12px;
    gap: 5px;
  }
  .section-2 .accordions .accordion button .image {
    max-width: 100px;
  }
  .section-2 .accordions .accordion:last-of-type button .image {
    height: 76px;
  }
  .section-2 .accordions .accordion button b {
    font-size: 22px;
  }
  .section-2 .accordions .accordion button .arrow {
    width: 22px;
  }
  .section-3 .slider-1,
  .section-6 .slider-1 {
    width: calc(100% + var(--px) * 2);
  }
  .section-3 .slider-1 .swiper,
  .section-6 .slider-1 .swiper {
    padding-inline: var(--px);
  }
  .section-3 .slider .buttons,
  .section-6 .slider .buttons {
    padding-left: var(--px);
  }
}

@media (max-width: 900px) {
  header .bg img {
    max-height: 700px;
  }
  .cta {
    font-size: 19px;
    padding: 16px 46px;
  }
  .slider .buttons {
    gap: 15px;
  }
  .slider .prev,
  .slider .next {
    width: 30px;
  }
  .score-desk {
    display: none;
  }
  .score-mobile {
    display: block !important;
  }
  header {
    height: auto;
  }
  nav .logo {
    height: 100%;
    width: auto;
  }
  header .content {
    display: flex;
    flex-direction: column;
    padding-top: 26px;
    gap: 16px;
  }
  header .content h1 {
    font-size: 35px;
  }
  header .content p {
    font-size: 22px;
  }
  header .score-mobile {
    margin-top: auto;
  }
  header .sponsors {
    margin-top: 36px;
    gap: 15px;
  }
  header .bg {
    position: relative;
    width: calc(100% + var(--px) * 2);
    left: calc(var(--px) * -1);
    margin-bottom: -170px;
  }
  header .bg img {
    width: 100%;
    height: auto;
    object-position: center right;
    transform: rotate(-15deg) translateX(5%);
  }
  .section-5 {
    padding-block: 66px;
  }
  header .cards {
    width: 100%;
    left: 0;
    flex-direction: column;
    border-radius: 30px;
    gap: 60px;
    margin-top: 66px;
  }
  /* header .sponsors .sponsor-logos {
    height: auto;
    grid-template-columns: repeat(2, auto);
    gap: 35px;
  }
  header .sponsors .sponsor-logos img:first-of-type {
    grid-column: span 2;
  } */
  header .content .cta-score-wrapper {
    margin-top: 20px;
  }
  .section-1 {
    padding-block: 66px;
    gap: 18px;
  }
  .section-1 h1 {
    font-size: 40px;
    text-align: center;
  }
  .section-1 .cards {
    grid-template-columns: 1fr;
    padding-inline: 20px;
  }
  .section-1 .cards .card b {
    font-size: 22px;
  }
  .section-1 .cards .card span {
    font-size: 60px;
  }
  .section-2 {
    padding-block: 42px;
  }
  .section-3 {
    padding-block: 66px;
  }
  .section-3 h1 {
    font-size: 40px;
    margin-bottom: 15px;
  }
  .section-3 h1 b {
    font-size: 22px;
  }
  .section-3 .slider-2 {
    margin-block: 0;
  }
  .section-3 .container {
    gap: 40px;
  }
  .section-4 {
    padding-block: 40px;
  }
  .section-4 .accordions .accordion > button {
    flex-direction: column;
    font-size: 45px;
  }
  .section-4 .accordions .accordion.active > button .arrow {
    display: none;
  }
  .section-5 .container > div {
    grid-template-columns: 1fr;
    padding: 18px;
  }
  .section-5 .container .text h1 {
    max-width: 400px;
    width: 100%;
    margin-inline: auto;
    text-align: center;
    font-size: 40px;
  }
  .section-5 .container .video {
    max-width: 375px;
    width: 100%;
    margin-inline: auto;
  }
  .section-6 {
    padding-block: 50px;
  }
  .section-6 h1 {
    font-size: 40px;
  }
  .section-6 .container {
    gap: 30px;
  }
  .section-7 .container ul li > button b {
    font-size: 22px;
  }
  .section-7 .container ul li .content p {
    font-size: 22px;
  }
  .section-7 .container ul li > button img {
    width: 22px;
  }
}

@media (max-width: 450px) {
  .sponsor-logos img {
    height: 40px;
  }
  header .content h1 {
    font-size: 21px;
  }
  header .content h1 b {
    font-size: 17px;
    display: block;
    font-weight: 700;
  }
  header .content p {
    font-size: 19px;
  }
  header .sponsors p {
    font-size: 16px;
  }
  .section-7 .container ul li > button b {
    font-size: 16px;
  }
  .section-7 .container ul li .content p {
    font-size: 16px;
  }
  .section-7 .container ul li > button img {
    width: 16px;
  }
  .section-7 .container ul li .content .cta {
    font-size: 13px;
    padding: 12px 26px;
  }
}