/*----------------------
Main Menu
------------------------*/
.top {
  position: absolute;
  top: 0;
  left: 0;
}

@media (max-width: 1500px) {
  body header .headermenu.top {
    height: 80px;
  }
}
body header .headermenu.top .headermenu__logo {
  opacity: 1;
}

@media (max-width: 950px) {
  .headermenu:not(.top) .headermenu__brandmark {
    opacity: 0;
  }
}
.single .headermenu.top:hover {
  background: rgba(255, 255, 255, 0.9);
  backdrop-filter: blur(22px);
  box-shadow: 0 0 40px rgba(0, 0, 0, 0.1);
}

body .headermenu:hover .hamburger {
  top: -40px;
  transition: all 300ms ease-in-out;
}
body .headermenu:hover .menu-headermenu-container {
  margin: 0;
  transition: all 400ms ease-out 400ms;
}
body .headermenu:hover .headermenu__logo {
  opacity: 1;
}
body .headermenu:hover .headermenu__logo--wordmark {
  opacity: 0;
}

.headermenu {
  position: fixed;
  top: 0;
  z-index: 100;
  width: 100%;
  height: 80px;
  padding: 24px 20px 24px 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  transition: 300ms ease-out;
}
@media (max-width: 550px) {
  .headermenu {
    background: none;
    backdrop-filter: none;
    box-shadow: none;
  }
}
.headermenu__brandmark {
  width: 50px;
  height: 50px;
  display: block;
  transition: 600ms ease-out;
  color: var(--white);
}
.headermenu__brandmark:hover {
  color: var(--primary);
}
.headermenu .menu-headermenu-container {
  width: 100%;
  transition: all 400ms ease-out 400ms;
  z-index: 40;
}
.headermenu .menu-headermenu-container ul {
  position: relative;
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  width: 100%;
}
.headermenu .menu-headermenu-container ul li {
  display: inline;
}
.headermenu .menu-headermenu-container ul li a {
  transition: 400ms ease-out;
}
.headermenu .menu-headermenu-container ul li a:hover {
  color: var(--primary);
}

button[type=submit] {
  background-color: var(--white);
  border: 2px solid var(--white);
  border-radius: 25px;
  padding: 0 var(--gutter) 3px var(--gutter);
  color: var(--primary);
  cursor: pointer;
  height: 50px;
  z-index: 5;
  font-weight: 600;
}
button[type=submit]:hover {
  background-color: var(--primary);
  color: var(--positive);
  border: 2px solid var(--positive);
}

/*--------------------------------------------------------------
Allgemeine Einstellungen
--------------------------------------------------------------*/
* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

.clearfix {
  clear: both;
}

body * {
  -webkit-font-smoothing: subpixel-antialiased;
  text-rendering: optimizeLegibility;
}

body, html {
  overscroll-behavior: none;
  scroll-behavior: smooth;
}

.main {
  overflow: hidden;
}

a {
  cursor: pointer;
}

.content {
  min-height: 100vh;
  margin-top: 100px;
}

.is-layout-flex {
  flex-wrap: nowrap;
}

.is-vertical {
  flex-direction: column;
}

/*----------------------
Farbsystem
------------------------*/
:root {
  --white: #FFFFFF;
  --dark_white: #f2f2f2;
  --light_grey: #d6d1d1;
  --grey: #959595;
  --dark_grey: #444444;
  --darker_grey: #222121;
  --light_black: #1A1919;
  --black: #0c0c0c;
  --primary: #FFA34A;
  --primary_light: #ffebd5;
  --negative: #911e46;
  --positive: #a9eeb7;
  --positive_text: #047874;
}

/*----------------------
Schrifteinbindung
------------------------*/
@font-face {
  font-family: "Headline";
  src: url("../fonts/GT-Flexa.ttf") format("truetype");
}
@font-face {
  font-family: "Copy";
  src: url("../fonts/Inter.ttf") format("truetype");
}
@font-face {
  font-family: "CopyItalic";
  src: url("../fonts/Inter-Italic.ttf") format("truetype");
}
/*----------------------
Schriftsatz
------------------------*/
:root {
  --copy: 19px;
  --copy-height: 150%;
  --h1: 99px;
  --h1-height: 90px;
  --h2: 70px;
  --h2-height: 72px;
  --small: 17px;
  --small-height: 27px;
  --button: calc(var(--copy) - 1px);
  --button-height: 100%;
  --wide: 5px;
  --medium: 1.5px;
  --narrow: -0.9px;
}
@media (max-width: 1500px) {
  :root {
    --small: 15px;
    --small-height: 24px;
    --copy: 20px;
    --copy-height: 34px;
    --h1: 75px;
    --h1-height: 68px;
    --h2: 50px;
    --h2-height: 52px;
  }
}
@media (max-width: 1200px) {
  :root {
    --h1: 55px;
    --h1-height: 50px;
  }
}
@media (max-width: 950px) {
  :root {
    --h1: 45px;
    --h1-height: 45px;
    --h2: 35px;
    --h2-height: 37px;
    --copy: 16px;
    --copy-height: 27px;
    --small: 14px;
    --small-height: 22px;
    --button: 16px;
    --button-height: 20px;
    --h1: 40px;
    --h1-height: 40px;
    --h2: 27px;
    --h2-height: 29px;
  }
}
@media (max-width: 550px) {
  :root {
    --h1: 30px;
    --h1-height: 31px;
  }
}

p, .wp-block-heading, .has-text-align-center {
  width: 100%;
}

.has-small-font-size {
  font-size: var(--small) !important;
  line-height: var(--small-height) !important;
}

body, p {
  color: var(--black);
  font-family: "Copy", sans-serif;
  font-size: var(--copy);
  line-height: var(--copy-height);
  letter-spacing: 0.5px;
  font-weight: normal;
  margin: 0;
  padding: 0;
  transition: 400ms ease-in-out;
}

b {
  font-family: "Extended", sans-serif;
  letter-spacing: 0.3px;
}

h1, h2, h3, h4, h5, h6 {
  text-wrap: balance;
}

p {
  text-wrap: pretty;
}

h1 {
  font-family: "Headline", serif;
  font-size: var(--h1);
  line-height: var(--h1-height);
  letter-spacing: 1.1px;
  transition: 400ms ease-in-out;
  font-weight: normal;
}

h2 {
  font-family: "Headline", serif;
  font-size: var(--h2);
  line-height: var(--h2-height);
  letter-spacing: 1.5px;
  transition: 400ms ease-in-out;
  font-weight: normal;
}

h3 {
  font-family: "Extended", sans-serif;
  font-size: var(--copy);
  line-height: calc(var(--copy-height) - 5px);
  letter-spacing: 0.8px;
  text-transform: uppercase;
  word-spacing: -0.7px;
  transition: 400ms ease-in-out;
  font-weight: normal;
}
@media (max-width: 550px) {
  h3 {
    font-size: calc(var(--copy) - 3px);
  }
}

a {
  color: inherit;
  text-decoration: none;
  transition: 400ms ease-in-out;
}

button, .button, .button span, .btn {
  font-family: "Light", sans-serif;
  font-size: var(--button);
  line-height: var(--button-height);
  letter-spacing: 3px;
  text-transform: uppercase;
  word-spacing: -1px;
  transition: 400ms ease-in-out;
}

.headermenu a {
  font-size: var(--button);
  transition: 400ms ease-in-out;
}

footer a {
  font-size: var(--small);
  font-family: "Light", sans-serif;
  transition: 400ms ease-in-out;
}

ul {
  list-style: none;
  margin: 0;
  padding: 0;
  transition: 400ms ease-in-out;
}

.content ul li {
  position: relative;
  padding-left: 30px; /* bullet spacing */
  transition: 400ms ease-in-out;
  margin-bottom: 30px;
  font-family: "Light", sans-serif;
  color: var(--dark_grey);
}
@media (max-width: 550px) {
  .content ul li {
    margin: var(--padding);
  }
}
.content ul li::before {
  content: "";
  position: absolute;
  left: 0;
  width: 22px;
  height: 22px;
  background-image: url(../img/bullet_light.svg);
  background-size: contain;
  background-repeat: no-repeat;
  top: 7px;
}
@media (max-width: 1500px) {
  .content ul li::before {
    top: 6px;
  }
}
@media (max-width: 1140px) {
  .content ul li::before {
    top: 3px;
  }
}

/*----------------------------------------
Footer Layout
-----------------------------------------*/
.pagefooter {
  padding: var(--padding-small) var(--gutter);
  background-color: var(--black);
  color: var(--white);
}
.pagefooter__menu {
  width: 100%;
}
.pagefooter__menu ul {
  width: 100%;
  display: flex;
  gap: var(--gutter);
  justify-content: flex-end;
}

fieldset {
  padding: 0;
  border: none;
}

.frm_forms {
  position: relative;
}

.frm_form_field {
  position: relative;
  margin: 10px 0;
}
.frm_form_field label {
  position: absolute;
}

input:-webkit-autofill {
  background-color: white !important;
}

label {
  top: 0;
  z-index: 3;
  font-size: calc(var(--small) - 1px);
  font-family: Light, sans-serif;
  color: var(--grey);
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active, input:-webkit-autofill:visited {
  background-color: var(--positive) !important;
  color: var(--white);
  border: 1px solid var(--black);
}

input {
  height: 50px;
  border-radius: 25px;
  padding: 0 var(--half-gutter) 3px var(--half-gutter);
  width: 100%;
  margin-bottom: 20px;
  cursor: text;
  border: 1px solid var(--white);
  font-size: var(--copy);
  letter-spacing: 1.2px;
  color: var(--black);
  z-index: 3;
  background-color: rgba(1, 0, 14, 0.5);
  -webkit-backdrop-filter: blur(22px);
  backdrop-filter: blur(22px);
  box-shadow: 0 0 40px rgba(0, 0, 0, 0.1);
}
input:focus, input:active, input :focus-visible, input :focus-within {
  outline: none;
  color: var(--white);
  background-color: var(--black);
  -webkit-backdrop-filter: blur(22px);
  backdrop-filter: blur(22px);
  box-shadow: 0 0 40px rgba(0, 0, 0, 0.1);
}
input:focus::-webkit-input-placeholder, input:active::-webkit-input-placeholder, input :focus-visible::-webkit-input-placeholder, input :focus-within::-webkit-input-placeholder {
  color: var(--white);
}
input:focus::-moz-placeholder, input:active::-moz-placeholder, input :focus-visible::-moz-placeholder, input :focus-within::-moz-placeholder {
  color: var(--white);
}
input:focus:-ms-input-placeholder, input:active:-ms-input-placeholder, input :focus-visible:-ms-input-placeholder, input :focus-within:-ms-input-placeholder {
  color: var(--white);
}
input:focus::-ms-input-placeholder, input:active::-ms-input-placeholder, input :focus-visible::-ms-input-placeholder, input :focus-within::-ms-input-placeholder {
  color: var(--white);
}
input:focus::placeholder, input:active::placeholder, input :focus-visible::placeholder, input :focus-within::placeholder {
  color: var(--white);
}
input[aria-invalid=true] {
  border: 2px solid var(--primary);
}
input::-webkit-input-placeholder {
  color: var(--light_grey);
}
input::-moz-placeholder {
  color: var(--light_grey);
}
input:-ms-input-placeholder {
  color: var(--light_grey);
}
input::-ms-input-placeholder {
  color: var(--light_grey);
}
input::placeholder {
  color: var(--light_grey);
}
input:visited {
  color: var(--black);
  border: 2px solid var(--black);
}

textarea {
  padding: 39px 15px 15px 15px;
  cursor: pointer;
  font-size: var(--small);
  line-height: var(--small-height);
  letter-spacing: 0.5px;
  font-family: "Light", sans-serif;
  color: var(--black);
  background-color: var(--white);
  -webkit-backdrop-filter: blur(22px);
  backdrop-filter: blur(22px);
  box-shadow: 0 0 40px rgba(0, 0, 0, 0.1);
  border: none;
}
textarea:focus, textarea:active, textarea :focus-visible {
  outline: none;
  color: var(--black);
  -webkit-backdrop-filter: blur(22px);
  backdrop-filter: blur(22px);
  box-shadow: 0 0 40px rgba(0, 0, 0, 0.1);
}
textarea:focus::-webkit-input-placeholder, textarea:active::-webkit-input-placeholder, textarea :focus-visible::-webkit-input-placeholder {
  color: var(--light_grey);
}
textarea:focus::-moz-placeholder, textarea:active::-moz-placeholder, textarea :focus-visible::-moz-placeholder {
  color: var(--light_grey);
}
textarea:focus:-ms-input-placeholder, textarea:active:-ms-input-placeholder, textarea :focus-visible:-ms-input-placeholder {
  color: var(--light_grey);
}
textarea:focus::-ms-input-placeholder, textarea:active::-ms-input-placeholder, textarea :focus-visible::-ms-input-placeholder {
  color: var(--light_grey);
}
textarea:focus::placeholder, textarea:active::placeholder, textarea :focus-visible::placeholder {
  color: var(--light_grey);
}
textarea::-webkit-input-placeholder {
  color: var(--light_grey);
}
textarea::-moz-placeholder {
  color: var(--light_grey);
}
textarea:-ms-input-placeholder {
  color: var(--light_grey);
}
textarea::-ms-input-placeholder {
  color: var(--light_grey);
}
textarea::placeholder {
  color: var(--light_grey);
}
textarea:visited {
  color: var(--black);
}

textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
textarea:-webkit-autofill:active, input:-webkit-autofill:visited {
  background-color: var(--positive) !important;
  color: var(--black);
  border: none;
}

.frm_message h2, .frm_error_style[role=status] p {
  min-height: 350px;
  display: flex;
  align-items: center;
  font-size: calc(var(--h2) - 20px);
  line-height: calc(var(--h2-height) - 10px);
  color: var(--positive_text);
  font-family: "Headline", serif;
  text-align: left;
}
@media (max-width: 1500px) {
  .frm_message h2, .frm_error_style[role=status] p {
    font-size: var(--h2);
    line-height: var(--h2-height);
  }
}

.frm_error_style[role=alert] {
  position: absolute;
  bottom: -25px;
  right: 0;
  font-size: var(--small);
  color: var(--negative);
}
@media (max-width: 850px) {
  .frm_error_style[role=alert] {
    right: initial;
    display: flex;
    width: 100%;
    justify-content: center;
    bottom: 60px;
  }
}

.frm_error {
  position: relative;
  bottom: 0;
  font-size: var(--small);
  color: var(--negative);
  font-family: "Light", sans-serif;
}

/*--------------------------------
Headline
--------------------------------*/
.errorpage {
  min-height: 100vh;
  margin-bottom: 100px;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  padding: 0 25px;
}
.errorpage h1 {
  margin: 0 0 40px 0;
}

/*--------------------------------
Text & Button
--------------------------------*/
:root {
  --gutter: 40px;
  --double-gutter: calc(var(--gutter) * 2);
  --half-gutter: calc(var(--gutter) / 2);
  --padding-small: 12px;
  --block-spacing: 145px;
  --half-block-spacing: calc(var(--block-spacing) / 2);
  --border-radius-large: 23px;
  --border-radius-small: 10px;
}
@media (max-width: 1500px) {
  :root {
    --gutter: 30px;
  }
}
@media (max-width: 1200px) {
  :root {
    --gutter: 20px;
  }
}
@media (max-width: 950px) {
  :root {
    --gutter: 18px;
  }
}

/*# sourceMappingURL=main.css.map */