@charset "UTF-8";

html, body {
  overflow-y: hidden; /* Verbietet vertikales Scrollen komplett */
}

.contact-page {
  min-height: 100vh;
  padding: 0;
  margin: 0;
  box-sizing: border-box;
}

.contact-content {
  display: flex;
  justify-content: space-between;
  padding: 80px 140px;
  gap: 60px;
}

.contact-form {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.form-row {
  display: flex;
  gap: 20px;
}

.form-group {
  display: flex;
  flex-direction: column;
  flex: 1;
}

label {
  font-size: 1rem;
  margin-bottom: 5px;
}

input, textarea {
  background: transparent;
  border: 1px solid #333;
  padding: 10px;
  color: #F0F0F0;
  font-family: 'Poppins', sans-serif;
  font-size: 1rem;
  resize: none;
}

button[type="submit"] {
  background-color: #B3B3B3;
  color: #181818;
  border: none;
  padding: 12px 50px;
  font-weight: 400;
  font-size: 1rem;
  width: fit-content;
  cursor: pointer;
  text-transform: uppercase;
}

.contact-text {
  flex: 0.5;
  font-size: 1rem;
  line-height: 1.6;
  color: #EAEAEA;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  margin: 0;
  margin-bottom: 5%;
}

.contact-headline {
  position: absolute;
  right: calc(20px + 120px);
  bottom: 0;
  z-index: 2;
}

.contact-top-mobile {
  display: none;
}

@media (max-width: 1024px) {

  html, body {
    height: auto;        /* Höhe automatisch an Inhalt anpassen */
    overflow-y: auto;    /* Vertikales Scrollen erlauben */
  }
 .contact-headline,
 .contact-text {
    display: none;
  }
	
  .contact-top-mobile {
    display: flex;
    justify-content: flex-start;
    align-items: flex-end;
	height: 88vh;
    color: #EAEAEA;
    font-family: 'Poppins', sans-serif;
  }

  .contact-top-mobile h1 {
	writing-mode: vertical-rl;
    transform: rotate(180deg);
    width: 30vw;
    display: flex;
    justify-content: flex-start;
    align-items: flex-end;
    color: #B3B3B3;
	font-size: 33vw;
	margin: 0;
  }

  .contact-top-mobile p {
    flex: 1;
	align-self: flex-end;
	margin-bottom: 20px;
	margin-right: 5vw;
	
  }
	
  .contact-content {
    flex-direction: column;
    padding: 60px 5vw 40px;
    gap: 40px;
  }

  .form-row {
    flex-direction: column;
    gap: 20px;
  }
	
 .contact-form button[type="submit"] {
    width: 100%;
    box-sizing: border-box;
  }
	
}

/* Erzwinge dein Styling gegen CF7 */

.wpcf7-form-control {
  all: unset !important;
  font-family: 'Poppins', sans-serif !important;
  font-size: 0.9rem !important;
  color: #F0F0F0 !important;
  background: transparent !important;
  border: 1px solid #333 !important;
  padding: 10px !important;
  box-sizing: border-box !important;
  width: 100% !important;
}

.wpcf7-form label {
  color: #F0F0F0 !important;
  font-size: 0.9rem !important;
  margin-bottom: 5px !important;
  display: inline-block !important;
}

.wpcf7-form p {
  margin: 0 !important;
  padding: 0 !important;
}

.wpcf7-submit {
  background-color: #B3B3B3 !important;
  color: #181818 !important;
  padding: 12px 50px !important;
  font-size: 0.9rem !important;
  text-transform: uppercase !important;
  border: none !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  width: fit-content !important;
}

.wpcf7-spinner {
  display: none !important;
}

.wpcf7-response-output {
  display: none !important;
}

.hidden-fields-container {
  display: none !important;
}

.wpcf7-response-output,
.screen-reader-response {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
  height: 0 !important;
}

input[type="submit"],
.wpcf7-submit {
  all: unset;
  background-color: #B3B3B3;
  color: #181818;
  padding: 12px 50px;
  font-weight: 600;
  font-size: 0.9rem;
  text-transform: uppercase;
  cursor: pointer;
  font-family: 'Poppins', sans-serif;
}

.contact-form label {
  margin-top: 20px;
  display: inline-block;
}
.contact-form .wpcf7-form-control-wrap {
  margin-top: 0; /* explizit kein extra Abstand */
}


.contact-form .wpcf7-form-control-wrap input[type="text"],
.contact-form .wpcf7-form-control-wrap input[type="email"],
.contact-form .wpcf7-form-control-wrap textarea {
  min-height: 50px !important;
  padding: 10px !important;
  line-height: 1.4 !important;
}

.contact-form .form-group input[type="submit"] {
  margin-top: 20px !important;
}

@media (max-width: 1024px) {
  .contact-form .wpcf7-form-control-wrap input[type="text"],
  .contact-form .wpcf7-form-control-wrap input[type="email"],
  .contact-form .wpcf7-form-control-wrap textarea {
    min-height: 50px !important;
  }
  .contact-form .wpcf7-form-control-wrap p {
    margin-bottom: 15px !important;
  }
	
.contact-form .wpcf7-submit {
  width: 100% !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  box-sizing: border-box !important;
  padding: 15px 20px !important;
  font-size: 0.9rem !important;
  margin-top: 20px !important;
  text-align: center !important;
}

.form-row .form-group label {
  margin-top: 0; /* kein zusätzlicher Abstand */
}

.contact-form label {
  margin-top: 20px;
  display: inline-block;
}

/* Abstand bei stacked Feldern steuern */
.contact-form > .form-group label {
  margin-top: 20px;
}
	
}

/* Layout Desktop */
@media (min-width: 1025px) {

.footer {
	position: fixed;
}
}