@import url("reset.css");
@import url("colours.css");
@import url("components/navigation.css");
@import url("components/header.css");
@import url("components/headers.css");
@import url("components/slider.css");
@import url("components/footer.css");
@import url("components/post.css");
@import url("components/video.css");
@import url("components/contact-form.css");
@import url("components/program-widget.css");
@import url("components/toc.css");
@import url("../fonts/phosphor-icons.css");
@import url("../fonts/montserrat/Montserrat.css");
@import url("../fonts/poppins/poppins.css");

/* Fonts */
body {
  font-family: 'Montserrat', sans-serif; /* Für den Fließtext */
  color: var(--text-color);
  font-size: 18px;
  line-height: 1.5em;
}

p {
  margin: 15px 0;
}

ol, ul {
  padding: 10px;
  margin: 10px;
}

/* Main */
.main {}

/* Grid Container */
.main__container {
  display: grid;
  grid-template-columns: 1fr 3fr 1fr;
  grid-template-areas:
    "header header header"
    "fullscreen fullscreen fullscreen"
    "nav content sidebar"
    "form form form"
    "footer footer footer";
  grid-gap: 0;
  min-height: 100vh;
}
article,
section,
main {
  grid-area: content;
  margin: 20px 0;
}

.wp-form-container {
  grid-area: form;
  display: grid;
  grid-template-columns: 1fr 3fr 1fr;
  gap: 0;

  color: var(--snow);
  background-color: var(--menu-background);
}

.wp-form-container .form {
  grid-column: 2;
}

.fullscreen {
  grid-area: fullscreen;
  background-size: cover;
  background-repeat: no-repeat; /* Verhindert, dass sich das Bild wiederholt */
  background-position: center;
  background-color: var(--menu-background);
  width: 100%;
  height: 75vh;
}
/* Seitenleiste */
.sidebar {
  grid-column: 1;
  grid-area: sidebar;
}

/* Inhalt */
.content {

}

@media (max-width: 768px) {
  .main__container {
    grid-template-columns: 1fr;
    grid-template-areas:
      "header"
      "fullscreen"
      "nav"
      "content"
      "form"
      "footer";
  }
  article,
  section,
  main {
    grid-area: nav;
    padding: 10px;
  }

  .wp-form-container {
    grid-template-columns: 1fr;
    padding: 10px;
  }
  .wp-form-container .form {
    grid-column: 1;
  }
  .nav__list {
    flex-direction: column;
  }
  .nav__link {
    padding: 0.5em;
  }
}