.header {
  background-color: #dde9f7;
  padding: 32px 24px;
  text-align: center;
}

.header h1 {
  font-size: 1.6rem;
  text-transform: uppercase;
  font-family: "Roboto Medium";
}

.container {
  padding: 32px 24px;
}

.container > *:not(:last-child) {
  margin-bottom: 24px;
}

.switch-bloc {
  text-align: center;
}

.actions {
  display: flex;
  justify-content: center;
  gap: 8px;
}

.faq {
  display: none;
  margin-top: 40px;
}

.faq.active {
  display: block;
}

.faq > *:not(:last-child) {
  margin-bottom: 24px;
}

.faq > *:last-child {
  margin-top: 40px;
}

.question {
  width: 100%;
  cursor: pointer;
  border: none;
  background-color: #F6FAFD;
  padding: 16px;
  font-family: "Roboto Medium";
  font-size: 16px;
  text-align: left;
  outline: none;
  transition: 0.4s;
}

.question:after {
  content: '\002B';
  float: right;
  font-family: initial;
  margin-left: 16px;
}

.question.active:after {
  content: '\2212';
}

.question.active, .question:hover {
  background-color: #dde9f7; 
}

.answer {
  display: none;
  overflow: hidden;
  background-color: white;
  padding: 0 16px;
}

.answer.block {
  margin: 1em 0;
}

.answer ul {
  margin: 8px 0;
  list-style: initial;
}

.inline-href {
  font-family: "Roboto Medium";
  color: #00498D;
}

.inline-href:hover {
  color: #053868;
}

@media (max-width: 600px) {
  .actions {
    flex-direction: column;
    gap: 16px;
  }

  .actions * {
    line-height: 40px;
  }
}

/* ---------- */
/* COMPONENTS */
/* ---------- */

button.secondary.hospitality, a.button.secondary.hospitality {
  border-color: #00498D;
  background-color: transparent;
  color: #0F2439;
}

button.secondary.hospitality:hover, a.button.secondary.hospitality:hover {
  background-color: #00498d0e;
}