/* =========================================================
   WAVELAND — tickets.css
   ========================================================= */

.tickets-lead {
  margin-top: 3.75rem;
  text-align: center;
}
.tickets-lead + .wave { margin-top: 4rem; }

.tickets { padding: 0 5.625rem 3.3125rem 5.6875rem; }

.ticket { padding: 2.0625rem 0 3.125rem; }
.ticket:first-child { padding-top: 3.875rem; }
.ticket + .ticket { border-top: 1px solid rgba(255,255,255,.85); }
.ticket:last-child { padding-bottom: 0; }

.ticket__head {
  display: grid;
  grid-template-columns: 1fr auto 26.25rem;
  grid-template-areas:
    "name  .     btn"
    "sub   price btn";
  column-gap: 5.9375rem;
}
.ticket__name {
  grid-area: name;
  font-weight: 400;                /* billettype: Onest Regular */
  font-size: 1.875rem;
  line-height: 2.375rem;
  text-transform: uppercase;
}
.ticket__sub {
  grid-area: sub;
  align-self: center;
  max-width: 35rem;
  margin-top: 1.375rem;
  font-size: 1.5rem;
  line-height: 2rem;
}
.ticket__price {
  grid-area: price;
  align-self: center;
  margin-top: 1.375rem;
  font-size: 2.5rem;
  font-weight: 100;                /* priser: Onest Thin */
  line-height: 3rem;
}
.ticket__btn {
  grid-area: btn;
  font-weight: 700;                /* Buy ticket: Onest Bold */
  align-self: start;
  margin-top: 1.9375rem;
}

.ticket__details-title {
  margin-top: 3.375rem;
  font-size: 1.875rem;
  font-weight: 600;                /* Access details: Onest SemiBold */
  line-height: 2.375rem;
  text-transform: uppercase;
}
.ticket__details {
  margin-top: 1.1875rem;
  font-size: 1.5rem;
  line-height: 2rem;
}
.ticket__details--narrow { max-width: 38.125rem; }
.ticket__details--medium { max-width: 45.625rem; }
.ticket__details--wide   { max-width: 50.625rem; }

@media (max-width: 1200px) {
  .ticket__head { grid-template-columns: 1fr auto 20rem; column-gap: 3rem; }
}

@media (max-width: 900px) {
  .tickets-lead { margin-top: 1.25rem; padding: 0 1.5rem; }
  .tickets-lead + .wave { margin-top: 1.75rem; }
  .tickets { padding: 0 1.5rem 3rem; }
  .ticket { padding: 2rem 0 2.25rem; }
  .ticket:first-child { padding-top: 2.5rem; }
  .ticket__head {
    grid-template-columns: 1fr auto;
    grid-template-areas:
      "name price"
      "sub  sub"
      "btn  btn";
  }
  .ticket__name { font-size: 1.5rem; }
  .ticket__price { margin-top: 0; font-size: 1.875rem; }
  .ticket__sub { margin-top: 0.5rem; font-size: 1.125rem; }
  .ticket__btn { margin-top: 1.25rem; }
  .ticket__details-title { margin-top: 2rem; font-size: 1.375rem; }
  .ticket__details { margin-top: 0.625rem; font-size: 1.125rem; line-height: 1.6875rem; }
}