/* Ensure main content area is not constrained */
.main-content {
  width: 100%;
  max-width: none;
  min-width: 0;
  padding: 1.2rem 1rem 2.5rem 1rem;
  margin: 110px auto 0 auto;
  overflow-x: hidden;
}

/* Override any potential width constraints */
.seo-consultation-container {
  width: 100%;
  max-width: 1200px;
  margin: 40px auto 60px auto;
  padding: 32px 28px 28px 28px;
  background: #23272f;
  border-radius: 12px;
  box-shadow: 0 2px 8px #0002;
}

/* Override base card styles for SEO consultation */
.seo-consultation-container.card {
  width: 100%;
  max-width: 1200px;
  margin: 40px auto 60px auto;
  padding: 32px 28px 28px 28px;
  background: #23272f;
  border-radius: 12px;
  box-shadow: 0 2px 8px #0002;
  border: 1px solid #404040;
}

@media (max-width: 1700px) {
  .seo-consultation-container {
    max-width: 95vw;
    padding: 32px 24px 24px 24px;
  }
  .seo-consultation-container.card {
    max-width: 95vw;
    padding: 32px 24px 24px 24px;
  }
}

@media (max-width: 1200px) {
  .seo-consultation-container {
    max-width: 95vw;
    padding: 28px 20px 20px 20px;
  }
  .seo-consultation-container.card {
    max-width: 95vw;
    padding: 28px 20px 20px 20px;
  }
}

@media (max-width: 768px) {
  .seo-consultation-container {
    max-width: 100vw;
    padding: 20px 16px;
    margin: 20px auto 40px auto;
  }
  .seo-consultation-container.card {
    max-width: 100vw;
    padding: 20px 16px;
    margin: 20px auto 40px auto;
  }
}

/* Einleitungstext */
.seo-consultation-intro {
  color: #b0b0b0;
  font-size: 1.13rem;
  margin-bottom: 18px;
}

/* Formular-Layout */
.seo-consultation-form {
  display: flex;
  flex-direction: column;
  gap: 20px;
  width: 100%;
}

@media (min-width: 700px) {
  .seo-consultation-form {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px 32px;
    width: 100%;
    align-items: start;
  }
  /* Firma | Telefon */
  .seo-consultation-form .form-group:nth-child(1) { 
    grid-column: 1; 
    grid-row: 1; 
    width: 100%;
    min-width: 0;
  }
  .seo-consultation-form .form-group:nth-child(4) { 
    grid-column: 2; 
    grid-row: 1; 
    width: 100%;
    min-width: 0;
  }
  /* Website | Betreff */
  .seo-consultation-form .form-group:nth-child(2) { 
    grid-column: 1; 
    grid-row: 2; 
    width: 100%;
    min-width: 0;
  }
  .seo-consultation-form .form-group:nth-child(5) { 
    grid-column: 2; 
    grid-row: 2; 
    width: 100%;
    min-width: 0;
  }
  /* E-Mail über beide Spalten */
  .seo-consultation-form .form-group:nth-child(3) { 
    grid-column: 1 / span 2; 
    grid-row: 3; 
    width: 100%;
    min-width: 0;
  }
  /* Nachricht über beide Spalten */
  .seo-consultation-form .form-group:nth-child(6) {
    grid-column: 1 / span 2;
    grid-row: 4;
    width: 100%;
    min-width: 0;
  }
  /* Submit-Button unter dem Formular */
  .seo-consultation-submit {
    grid-column: 1 / span 2;
    grid-row: 5;
    justify-self: center;
    margin-top: 12px;
    width: 100%;
    max-width: 300px;
  }
}

@media (max-width: 699px) {
  .seo-consultation-form {
    display: flex;
    flex-direction: column;
    gap: 20px;
    width: 100%;
  }
  
  .form-group {
    width: 100%;
    min-width: 0;
  }
  
  .input-field,
  .textarea-field {
    width: 100%;
    min-width: 0;
  }
}

.form-group {
  display: flex;
  flex-direction: column;
  gap: 8px;
  width: 100%;
  min-width: 0;
  flex: 1;
}

.form-group label {
  color: #f5f6fa;
  font-weight: 600;
  font-size: 1rem;
  width: 100%;
  display: block;
}

.input-field,
.textarea-field {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  padding: 10px 14px;
  border-radius: 8px;
  border: 1.5px solid #4285F4;
  background: #181b20;
  color: #f5f6fa;
  font-size: 0.9rem;
  min-height: 44px;
  box-sizing: border-box;
  transition: border-color 0.2s ease;
  margin-top: 4px;
  overflow: hidden;
  text-overflow: ellipsis;
  display: block;
  flex: 1;
}

.input-field:focus,
.textarea-field:focus {
  outline: none;
  border-color: #6be6c1;
  box-shadow: 0 0 0 2px rgba(107, 230, 193, 0.2);
}

.textarea-field {
  resize: vertical;
  min-height: 140px;
  max-height: 400px;
}

.required-asterisk {
  color: #DC3545;
  font-weight: bold;
}

.success-message {
  background: #28a74522;
  color: #28a745;
  border-radius: 8px;
  padding: 12px 18px;
  margin-bottom: 18px;
  font-size: 1.08rem;
}

.error-message {
  background: #DC354522;
  color: #DC3545;
  border-radius: 8px;
  padding: 12px 18px;
  margin-bottom: 18px;
  font-size: 1.08rem;
}

.error-header {
  font-weight: 700;
  margin-bottom: 8px;
}

.error-list {
  margin: 0;
  padding-left: 20px;
}

.seo-consultation-submit {
  font-size: 1.1rem;
  padding: 16px 32px;
  margin-top: 12px;
  align-self: center;
  width: 100%;
  max-width: 300px;
  font-weight: 700;
}

@media (max-width: 768px) {
  .input-field {
    padding: 14px 16px;
    font-size: 1rem;
  }
  
  .textarea-field {
    min-height: 120px;
  }
  
  .seo-consultation-submit {
    padding: 14px 24px;
    font-size: 1rem;
  }
}

@media (max-width: 480px) {
  .seo-consultation-container {
    padding: 16px 12px;
    margin: 16px auto 32px auto;
  }
  
  .input-field,
  .textarea-field {
    padding: 12px 14px;
    font-size: 1rem;
  }
  
  .seo-consultation-submit {
    padding: 12px 20px;
    font-size: 1rem;
  }
}

/* Entferne Sprachwahl-Styles */
.seo-consultation-lang-chooser { display: none !important; }