main {
  .p, .h2, .h3 {
    font-family: var(--font-alaska);
  }

  .cl-check-container {
    margin: 0;
    background-color: var(--color-light-grey);
    display: flex;
    justify-content: center;
    padding: 4rem 2rem var(--margin-large);
    padding-top: var(--padding-large);
  }

  .hockey-container {
    background-color: var(--color-white);
    width: 100%;
    max-width: 120rem;
    margin: 0 auto;
    padding: var(--padding-normal);
    box-shadow: var(--shadow-dark);
    border-radius: var(--radius-medium);
    overflow: hidden;
  }

  .hockey-container > .grid {
    padding: 0;
    margin-bottom: var(--margin-normal);
  }

  .hockey-container > .grid:last-child {
    margin-bottom: 0;
  }

  .section-image--hockey-en {
    background-image: url("../../images/info/hockey/hockey-en.c4c951d67283.png");
  }

  .section-image--hockey-de {
    background-image: url("../../images/info/hockey/hockey-de.98fdf9e8ab96.png");
  }

  .section-image--hockey-fr {
    background-image: url("../../images/info/hockey/hockey-fr.54df00327db2.png");
  }

  .section-image--hockey-en,
  .section-image--hockey-de,
  .section-image--hockey-fr {
    height: 550px;
    background-size: cover;
    background-position: top center;
    align-self: flex-start;
    border-radius: var(--radius-medium);
    width: 100%;
  }

  .section-padding {
    padding-top: 0;
    padding-bottom: var(--padding-normal);
  }

  .heading-secondary {
    background: linear-gradient(to right, var(--color-primary), var(--color-subheading));
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    display: inline-block;
    line-height: 40px;
    font-weight: var(--weight-bold);
    font-size: 35px;
  }

  .heading-tertiary {
    font-weight: var(--weight-light);
    font-size: 35px;
    line-height: 40px;
  }

  .section-success p, b {
    font-size: var(--font-heading--4);
  }

  .grid {
    column-gap: var(--gap-normal);
  }

  html {
    scroll-behavior: smooth;
  }

  .section-form {
    padding: 0;
  }

  .form-textbox {
    padding: var(--padding-form-textbox);
  }

  .form-text {
    color: var(--color-light-grey--3);
    font-weight: var(--weight-extralight);
    font-size: var(--font-blog-heading--3);
  }

  .form-text-default {
    color: var(--color-light-grey--3);
    font-weight: var(--weight-extralight);
    font-size: var(--font-text-default);
  }

  .hockey-form {
    column-gap: var(--gap-normal);
    row-gap: calc(var(--gap-normal) / 2);
  }

  .inline-list {
    display: flex;
    flex-wrap: wrap;
    gap: var(--gap-xsmall);
    list-style: none;
    padding: 0;
    margin: 0;
    color: var(--color-light-grey--3);
  }

  .inline-list li:not(:last-child)::after {
    content: "•";
    margin-left: var(--margin-small);
    color: var(--color-light-grey--3);
  }

  .icon-list {
    display: flex;
    flex-wrap: wrap;
    gap: var(--gap-xsmall);
    padding-left: 0;
    margin: 0;
  }

  .icon-list li {
    display: flex;
    align-items: center;
    gap: var(--gap-xsmall);
  }

  .icon {
    display: inline-block;
    flex-shrink: 0;
    background-image: url("../../icons/check.e2a91b157ec9.svg");
    background-size: contain;
    background-repeat: no-repeat;
  }

  .form-radio-group {
    display: grid !important;
    grid-template-columns: 1fr 1fr;
    column-gap: var(--gap-small);
    row-gap: var(--gap-normal);
    align-items: start;
  }

  fieldset.form-group,
  .cta-position {
    grid-column: 1 / -1;
  }

  .form-group {
    display: flex;
    flex-direction: column;
    grid-column: span 1;
    border: none;
  }

  .form-input {
    width: 100%;
    padding: var(--padding-small);
    border: var(--border-default);
    border-radius: var(--radius-small);
    height: 50px;
  }

  .form-button {
    grid-column: 1 / -1;
    width: 100%;
    display: flex;
    justify-content: center;
  }

  .hockey-form-submit {
    width: 100%;
  }

  .form-info {
    grid-column: 1 / -1;
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-items: center;
    font-size: var(--font-text-default);
    font-weight: var(--weight-extralight);
  }

  .hockey-prizes-section {
    display: flex;
    flex-direction: column;
    gap: var(--gap-small);
    border: var(--border-default);
    border-radius: var(--radius-default);
    padding: var(--padding-normal);
    margin-top: var(--margin-normal);
  }

  .section-success {
    width: 100%;
    background-color: var(--color-light-grey);
    border-radius: var(--radius-default);
    padding-top: var(--padding-normal);
    padding-bottom: var(--padding-normal);
  }

  .hockey-prizes {
    display: flex;
    flex-direction: column;
    gap: var(--gap-small);
    border: var(--border-default);
    border-radius: var(--radius-default);
    padding: var(--padding-normal);
    margin-top: var(--margin-normal);
    background-color: var(--color-light-grey);
  }

  .game-schedule-list {
    list-style: none;
    padding: 0;
    margin: var(--margin-small) 0;
    display: flex;
    flex-direction: column;
    gap: var(--gap-small);
  }

  .game-schedule-list li {
    display: flex;
    align-items: flex-start;
  / gap: var(--gap-xsmall);
    line-height: 1.4;
  }

  /* Container for each row */

  .game-schedule-list li {
    display: flex;
    align-items: flex-start; /* Keeps icon at the top if text wraps */
    gap: 1.2rem; /* Standardized gap instead of   */
    line-height: 1.4;
    margin-bottom: 0.8rem;
  }

  /* The checkmark icon */

  .game-schedule-list .icon {
    flex-shrink: 0;
    width: 20px;
    height: 20px;
    margin-top: 0.3rem;
    background-image: url("../../icons/green-check.cb5cdc34c3d7.svg");
    background-size: contain;
    background-repeat: no-repeat;
  }

  .game-schedule-list p {
    margin: 0;
    display: inline-block;
  }

  .game-schedule-list img {
    vertical-align: middle;
    margin: 0;
    position: relative;
  }

  img[alt="ticket"] {
    display: inline-block;
    vertical-align: middle;
    position: relative;
    top: -1px;
  }

  .success-text-title {
    font-size: var(--font-simulator-heading);
  }

  .text-strong {
    color: var(--color-text-complementary);
    font-size: var(--font-text-default);
  }

  .success-title-section {
    display: flex;
    flex-direction: column;
    align-items: center;
    border-bottom: var(--border-default);
    padding-bottom: var(--padding-normal);
  }

  .success-bottom-section {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-top: var(--padding-normal);
    gap: var(--gap-small);
  }

  .giveaway-title-emoji {
    display: inline-block;
    margin-left: 6px;
    transform-origin: center;
    text-shadow: 0 0 8px rgba(255, 185, 62, 0.5);
    animation: giveaway-title-confetti-pop 1.9s ease-in-out infinite;
  }

  @keyframes giveaway-title-confetti-pop {
    0% {
      transform: translateY(0) rotate(0deg) scale(1);
      text-shadow: 0 0 6px rgba(255, 185, 62, 0.45);
    }
    22% {
      transform: translateY(-4px) rotate(-14deg) scale(1.07);
      text-shadow: 0 0 10px rgba(255, 185, 62, 0.62);
    }
    44% {
      transform: translateY(2px) rotate(12deg) scale(0.98);
      text-shadow: 0 0 7px rgba(255, 185, 62, 0.5);
    }
    66% {
      transform: translateY(-3px) rotate(-10deg) scale(1.05);
      text-shadow: 0 0 9px rgba(255, 185, 62, 0.58);
    }
    100% {
      transform: translateY(0) rotate(0deg) scale(1);
      text-shadow: 0 0 6px rgba(255, 185, 62, 0.45);
    }
  }

  .subheading--section {
    color: var(--color-indicator);
    background-color: var(--color-indicator) 0.9;
    border: var(--border-hockey);
    border-radius: var(--radius-small);
    font-weight: var(--weight-bold);
    justify-self: flex-end;
  }

  .btn--full:disabled,
  .btn--full:disabled:hover {
    background-color: var(--color-light-grey--3);
    cursor: not-allowed;
  }

  @media only screen and (max-width: 70em) {
    .success-title-section p,
    .success-bottom-section p,
    .success-title-section h3,
    .success-title-section h4 {
      text-align: center;
      width: 100%;
      padding-left: var(--padding-xsmall);
      padding-right: var(--padding-xsmall);
    }

    .section-image--hockey-en,
    .section-image--hockey-de,
    .section-image--hockey-fr {
      display: block;
      width: 100%;
      height: 400px;
      background-image: url("../../images/info/hockey/mobile.b6b6c253b51a.jpg");
      background-size: cover;
      background-position: center center;
    }

    .form-radio-group {
      grid-template-columns: 1fr !important;
      gap: 1.5rem;
    }

    .grid--2-cols {
      grid-template-columns: 1fr;
    }

    .btn--full {
      width: 100%;
      text-align: center;
    }
  }

  @media only screen and (max-width: 29em) {
    .success-title-section p,
    .success-bottom-section p,
    .success-title-section h3,
    .success-title-section h4 {
      text-align: center;
      width: 100%;
      padding-left: var(--padding-xsmall);
      padding-right: var(--padding-xsmall);
    }

    .section-image--hockey-en,
    .section-image--hockey-de,
    .section-image--hockey-fr {
      display: block;
      width: 110% !important;
      margin-left: var(--margin-negative) !important;
      height: fit-content;
      min-height: 200px;
      background-image: url("../../images/info/hockey/mobile.b6b6c253b51a.jpg");
      background-size: cover;
      background-position: center center;
    }

    .form-textbox,
    .form-box {
      padding: 5%;
      width: 100%;
    }

    .form-input {
      width: 100%;
      height: 50px;
      font-size: 14px;
      display: block;
    }

    .heading-secondary {
      font-size: 2.2rem;
      line-height: 1.1;
      margin-top: 1.5rem;
    }

    .heading-tertiary {
      font-size: 1.8rem;
      line-height: 50px;
      margin-bottom: 0.5rem;
    }

    .heading-quaternary {
      font-size: 1.6rem;
      text-transform: uppercase;
    }

    .description {
      font-size: 1.5rem;
      line-height: 1.5;
    }

    label {
      font-size: 1.4rem;
      margin-bottom: 0.4rem;
    }

    .form-text {
      font-size: 1.4rem;
      margin-bottom: 1.5rem;
    }

    .game-schedule-list li {
      font-size: 1.3rem;
      gap: 0.8rem;
    }

    .titlebox img[alt="success"] {
      width: 24px;
      height: 24px;
    }

    .form-textbox h3 img[alt="ticket"] {
      width: 30px !important;
      height: auto;
      margin-left: 0.5rem;
      vertical-align: middle;
    }

    .inline-list {
      display: flex;
      flex-wrap: wrap;
      justify-content: flex-start;
      gap: 0.5rem 1rem;
      font-size: 1.3rem;
    }

    .inline-list li:not(:last-child)::after {
      content: "•";
      margin-left: 1rem;
      display: inline-block;
    }

    .cl-check-container {
      padding: 0 !important;
      background-color: var(--color-white);
    }

    .hockey-container {
      padding: 5%;
      box-shadow: none;
      max-width: 100%;
    }

    .hockey-prizes,
    .hockey-prizes-section,
    .form-textbox {
      padding: 5%;
    }

    .section-image--hockey-en,
    .section-image--hockey-de,
    .section-image--hockey-fr {
      width: calc(100% + 4rem);
      margin-left: -2rem;
      margin-top: -2rem;
      height: 250px;
      border-radius: 0;
      background-size: cover;
      background-position: center;
      order: -1;
    }

    .grid--2-cols {
      display: flex;
      flex-direction: column;
      grid-template-columns: 1fr;
      gap: var(--gap-normal);
    }

    .form-radio-group {
      grid-template-columns: 1fr !important;
      gap: 1.5rem;
    }

    .heading-secondary {
      font-size: 2.8rem;
      margin-top: 1rem;
    }

    .btn,
    .btn--full,
    .hockey-form-submit {
      width: 100% !important;
      display: block;
      text-align: center;
      padding: var(--padding-xsmall) 0;
      margin-left: 0;
      margin-right: 0;
    }
  }

  @media only screen and (max-width: 23.4375em) {
    .section-image--hockey {
      height: 45%;
      margin: var(--margin-normal) 0;
    }

    .inline-list {
      flex-direction: column;
      gap: 0.3rem;
    }

    .inline-list li:not(:last-child)::after {
      display: none;
    }

    .heading-secondary {
      font-size: var(--font-blog-heading--3);
      margin-top: var(--margin-small);
    }
  }

  @media only screen and (max-width: 20em) {
    .section-image--hockey {
      height: 50%;
    }

    .inline-list {
      flex-direction: column;
      gap: 0.3rem;
    }

    .inline-list li:not(:last-child)::after {
      display: none;
    }
  }
}