/* Contact-specific rules moved from styles.css to keep kontakt isolated. */
.page-container .top-container .right-side .svg-fa {
  color: #15365A;
}

#legalChecks {
  margin-top: 15px;
}

#legalChecks .checkbox-line {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 14px;
  line-height: 1.6;
}

#legalChecks .checkbox-line input[type="checkbox"] {
  flex: 0 0 auto;
  margin: 3px 0 0 0;
}

#legalChecks .checkbox-line:last-child {
  margin-bottom: 0;
}

.page-container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 40px;
}

/* Fondo general */
body {
  margin: 0;
  padding: 0;
  font-family: Arial, sans-serif;
  background: #f0f0f0; /* fondo gris de toda la página y sección del formulario */
}

/* SECCIÓN DE COLUMNAS */
.top-section {
  background: white; /* fondo blanco para las columnas */
  padding: 40px 0;
}

.top-container {
  display: flex;
  justify-content: space-between;
  gap: 40px;
  margin: 40px auto 20px auto;
}


.left-side {
  flex: 1;
}

.right-side {
  flex: 1;
  font-size: 16px;
  line-height: 1.8;
  text-align: right;
}

/* SECCIÓN FORMULARIO */
.form-section {
  background: #f0f0f0; /* fondo gris uniforme */
  padding: 40px 20px;
}

.form-container {
  margin: 0 auto 50px auto;
}


form {
  padding: 25px 0; /* eliminamos el fondo y bordes */
  width: 100%;
}

/* FILAS DE CAMPOS (2 por línea) */
.form-row {
  display: flex;
  gap: 20px;
  margin-bottom: 15px;
}

.form-row .field {
  flex: 1;
  display: flex;
  flex-direction: column;
  /* iOS/Android (móviles reales): permite que el contenido del input no fuerce overflow */
  min-width: 0;
}

.page-container .top-container i {
  color: #15365A;
}

.top-container i {
  font-size: 20px; /* Ajusta el tamaño a tu gusto */
  color: #05c7f2;       /* color azul que querías */
    font-size: 22px;       /* tamaño, ajustable */
    text-shadow: 0 0 1px #05c7f2, 0 0 1px #05c7f2; /* refuerza el grosor */
}



/* Inputs, select y textarea */
form input,
form select,
form textarea {
  width: 100%;
  padding: 10px;
  border: 1px solid #ccc;
  border-radius: 6px;
  font-size: 15px;
  box-sizing: border-box;
}

/* 3 Felder unter Lade-/Entladeadresse (in einer Zeile) */
.sub-row {
  display: flex;
  gap: 10px;
  margin-top: 8px;
}

.sub-row select {
  flex: 1;
  min-width: 0;
}

/* Placeholder gris */
input::placeholder,
textarea::placeholder {
  color: #888;
}

form textarea {
  height: 120px;
  resize: vertical;
}

/* Botón */
form button {
  margin-top: 20px;
  width: 100%;
  padding: 12px;
  border: none;
  background: #15365A;
  color: white;
  font-size: 16px;
  border-radius: 6px;
  cursor: pointer;
  transition: background 0.2s;
}

form button:hover {
  background: #05c7f2;
}

/* PREVIEW DE ARCHIVOS */
.preview-item {
  position: relative;
  width: 100px;
  height: 100px;
  overflow: hidden;
  border-radius: 8px;
  border: 1px solid #ddd;
  display: flex;
  align-items: center;
  justify-content: center;
}

.preview-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.delete-btn {
  position: absolute;
  top: 2px;
  right: 2px;
  background: rgba(255,255,255,0.8);
  border: none;
  border-radius: 50%;
  width: 22px;
  height: 22px;
  cursor: pointer;
  font-weight: bold;
  color: #d33;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  line-height: 1;
}



input[type="file"]#archivo {
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  overflow: hidden;
  opacity: 0;
  pointer-events: auto;
}

/* -------- Upload dropzone (ähnlich Screenshot) -------- */
.upload-section {
  margin-top: 10px;
}

.upload-header {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
  color: #555;
}

.upload-label {
  font-weight: 600;
}

.upload-dropzone {
  border: 2px dashed #cbd5e1;
  border-radius: 8px;
  background: #f8fafc;
  padding: 22px 16px;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  user-select: none;
}

.upload-dropzone:focus {
  outline: none;
  box-shadow: 0 0 0 3px rgba(5, 199, 242, 0.25);
  border-color: #05c7f2;
}

.upload-dropzone.is-dragover {
  border-color: #05c7f2;
  background: #eefbff;
}

.upload-icon svg {
  width: 44px;
  height: 44px;
  color: #94a3b8;
}

.upload-browse {
  appearance: none;
  background: transparent !important; /* evita que herede estilos globales de form button */
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
  width: auto !important;
  border-radius: 0 !important;
  font-size: 22px;
  font-weight: 700;
  color: #0f172a;
  cursor: pointer;
}

.upload-browse:hover {
  color: #15365A;
}

.upload-subtitle {
  font-size: 16px;
  color: #64748b;
}

.upload-counter {
  margin-top: 8px;
  font-size: 14px;
  color: #555;
}

.upload-preview {
  margin-top: 15px;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

/* Botón que dispara el selector */
.file-btn {
  display: inline-block;      /* ← evita que se estire al 100% */
  padding: 8px 16px;
  border-radius: 6px;
  border: none;
  background: #15365A;         /* verde */
  color: white;
  cursor: pointer;
  font-size: 15px;
  font-weight: 500;
  width: auto;                 /* ← importante */
}

.file-btn:hover {
  background: #05c7f2;         /* verde más oscuro */
}

/* RESPONSIVE */
@media (max-width: 768px) {
  .top-container {
    flex-direction: column;
    text-align: left;
  }

  .form-row {
    flex-direction: column;
  }

  .sub-row {
    flex-direction: column;
  }

  .right-side {
    text-align: left;
  }
}

form input[type="text"],
form input[type="email"],
form input[type="tel"],
form textarea {
  border-radius: 6px; /* o el valor que quieras */
}

/*Animacion del boton enviar*/
button.sending {
  background: #888 !important;
  cursor: not-allowed;
  opacity: 0.8;
}

.spinner {
  border: 3px solid #fff;
  border-top: 3px solid transparent;
  border-radius: 50%;
  width: 16px;
  height: 16px;
  animation: spin 0.8s linear infinite;
  display: inline-block;
  vertical-align: middle;
  margin-right: 8px;
}

@keyframes spin {
  to { transform: rotate(360deg); }
}

/*Check box*/
#legalChecks {
    font-size: 14px;
}

.checkbox-line {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 8px;
}

.checkbox-line input[type="checkbox"] {
    width: 18px;
    height: 18px;
}

#legalChecks a {
    text-decoration: underline;
}

#legalChecks a {
    text-decoration: underline;
    color: #15365A; /* o el color que ya uses en tu web */
}

#legalChecks {
    font-size: 12.5px;
}
/*--------------------------Lottie Animation-----------------------*/
#overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255,255,255,0.8);
    display: none;
    justify-content: center;
    align-items: center;
    z-index: 9999;
}
#animContainer {
    width: 300px;
    height: 300px;
}


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

.column {
  flex: 1;
}

.sub-row {
  display: flex;
  gap: 10px;
  margin-top: 8px;
}

/* Todos los selects del sub-row con el mismo tamaño */
.sub-row select {
  flex: 1;
  min-width: 0; /* evita que en pantallas pequeñas se rompa la línea */
}

form input,
form select {
  width: 100%;
  padding: 10px;
  border: 1px solid #ccc;
  border-radius: 6px;
  box-sizing: border-box;
  font-size: 15px;
  background-color: #fff;
}

/* Móvil: mantenerlos en una línea, mismo tamaño */
@media (max-width: 768px) {
  .sub-row {
    flex-direction: row;
    flex-wrap: nowrap;
  }

  .sub-row select {
    flex: 1;
    min-width: 0;
  }
}

/* Estilo underline SOLO para los selects de Lade-/Entladeadresse */
.sub-row select {
  border: none;
  border-bottom: 2px solid #ccc;
  border-radius: 0;
  background: transparent;
  padding: 8px 4px;
}

/* Al enfocar */
.sub-row select:focus {
  outline: none;
  border-bottom-color: #15365A; /* o tu color principal */
}

/* Evitar estilos raros del navegador */
.sub-row select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

.file-label {
  margin-right: 10px;
  color: #555;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

/* Contenedor del tooltip */
.info-tooltip {
  position: relative;
  display: inline-flex;
  align-items: center;
  cursor: pointer;
}

/* SVG icon */
.info-icon {
  width: 14px;
  height: 14px;
  fill: #666;
}

.info-tooltip:hover .info-icon {
  fill: #15365A;
}

/* Tooltip box */
.tooltip-box {
  position: absolute;
  bottom: 130%;
  left: 50%;
  transform: translateX(-50%);
  width: 230px;
  background: #333;
  color: #fff;
  font-size: 13px;
  padding: 8px 10px;
  border-radius: 6px;
  line-height: 1.4;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.2s ease;
  z-index: 50;
}

/* Flecha */
.tooltip-box::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  border-width: 6px;
  border-style: solid;
  border-color: #333 transparent transparent transparent;
}

/* Mostrar tooltip */
.info-tooltip:hover .tooltip-box {
  opacity: 1;
  visibility: visible;
}

.info-tooltip {
  position: relative;
  display: inline-flex;
  align-items: center;
  cursor: pointer;
}

.info-icon {
  width: 14px;
  height: 14px;
  fill: #666;
  display: block;
}

.tooltip-box {
  position: absolute;
  bottom: 130%;
  left: 50%;
  transform: translateX(-50%);
  width: 230px;
  background: #333;
  color: #fff;
  font-size: 13px;
  padding: 8px 10px;
  border-radius: 6px;
  line-height: 1.4;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  z-index: 50;
}

.info-tooltip:hover .tooltip-box {
  opacity: 1;
  visibility: visible;
}

/* Asegura que el botón no quede detrás de nada */
.file-btn {
  position: relative;
  z-index: 1;
  display: inline-block;
}

.info-tooltip {
  position: relative;
  display: inline-flex;
  align-items: center;
  margin-left: 6px;
  cursor: pointer;
}

.info-icon {
  width: 22px;       /* más grande */
  height: 22px;
  fill: #1f2937;     /* más oscuro → más peso visual */
  display: block;
}

/* Hover sutil */
.info-tooltip:hover .info-icon {
  fill: #15365A;
}

.message-label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.info-tooltip {
  display: inline-flex;
  align-items: center;
}

.info-icon {
  vertical-align: middle;
}

/* Input con icono integrado */
.input-icon{
  background-repeat: no-repeat;
  background-position: 10px center;
  background-size: 18px;
  padding-left: 38px;
}

.input-icon::placeholder{
  color:#888;
}

/* Usuario (Vorname / Nachname) */
.icon-user{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'><path fill='%23888' d='M320 312C386.3 312 440 258.3 440 192C440 125.7 386.3 72 320 72C253.7 72 200 125.7 200 192C200 258.3 253.7 312 320 312zM290.3 368C191.8 368 112 447.8 112 546.3C112 562.7 125.3 576 141.7 576L498.3 576C514.7 576 528 562.7 528 546.3C528 447.8 448.2 368 349.7 368L290.3 368z'/></svg>");
}
.icon-user:focus{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'><path fill='%2305c7f2' d='M320 312C386.3 312 440 258.3 440 192C440 125.7 386.3 72 320 72C253.7 72 200 125.7 200 192C200 258.3 253.7 312 320 312zM290.3 368C191.8 368 112 447.8 112 546.3C112 562.7 125.3 576 141.7 576L498.3 576C514.7 576 528 562.7 528 546.3C528 447.8 448.2 368 349.7 368L290.3 368z'/></svg>");
}

/* Email */
.icon-email{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'><path fill='%23888' d='M112 128C85.5 128 64 149.5 64 176C64 191.1 71.1 205.3 83.2 214.4L291.2 370.4C308.3 383.2 331.7 383.2 348.8 370.4L556.8 214.4C568.9 205.3 576 191.1 576 176C576 149.5 554.5 128 528 128L112 128zM64 260L64 448C64 483.3 92.7 512 128 512L512 512C547.3 512 576 483.3 576 448L576 260L377.6 408.8C343.5 434.4 296.5 434.4 262.4 408.8L64 260z'/></svg>");
}
.icon-email:focus{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'><path fill='%2305c7f2' d='M112 128C85.5 128 64 149.5 64 176C64 191.1 71.1 205.3 83.2 214.4L291.2 370.4C308.3 383.2 331.7 383.2 348.8 370.4L556.8 214.4C568.9 205.3 576 191.1 576 176C576 149.5 554.5 128 528 128L112 128zM64 260L64 448C64 483.3 92.7 512 128 512L512 512C547.3 512 576 483.3 576 448L576 260L377.6 408.8C343.5 434.4 296.5 434.4 262.4 408.8L64 260z'/></svg>");
}

/* Teléfono */
.icon-phone{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'><path fill='%23888' d='M224.2 89C216.3 70.1 195.7 60.1 176.1 65.4L170.6 66.9C106 84.5 50.8 147.1 66.9 223.3C104 398.3 241.7 536 416.7 573.1C493 589.3 555.5 534 573.1 469.4L574.6 463.9C580 444.2 569.9 423.6 551.1 415.8L453.8 375.3C437.3 368.4 418.2 373.2 406.8 387.1L368.2 434.3C297.9 399.4 241.3 341 208.8 269.3L253 233.3C266.9 222 271.6 202.9 264.8 186.3L224.2 89z'/></svg>");
}
.icon-phone:focus{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'><path fill='%2305c7f2' d='M224.2 89C216.3 70.1 195.7 60.1 176.1 65.4L170.6 66.9C106 84.5 50.8 147.1 66.9 223.3C104 398.3 241.7 536 416.7 573.1C493 589.3 555.5 534 573.1 469.4L574.6 463.9C580 444.2 569.9 423.6 551.1 415.8L453.8 375.3C437.3 368.4 418.2 373.2 406.8 387.1L368.2 434.3C297.9 399.4 241.3 341 208.8 269.3L253 233.3C266.9 222 271.6 202.9 264.8 186.3L224.2 89z'/></svg>");
}

/* Ladeadresse */
.icon-address-load{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'><path fill='%23888' d='M320 48C337.7 48 352 62.3 352 80L352 98.3C450.1 112.3 527.7 189.9 541.7 288L560 288C577.7 288 592 302.3 592 320C592 337.7 577.7 352 560 352L541.7 352C527.7 450.1 450.1 527.7 352 541.7L352 560C352 577.7 337.7 592 320 592C302.3 592 288 577.7 288 560L288 541.7C189.9 527.7 112.3 450.1 98.3 352L80 352C62.3 352 48 337.7 48 320C48 302.3 62.3 288 80 288L98.3 288C112.3 189.9 189.9 112.3 288 98.3L288 80C288 62.3 302.3 48 320 48zM160 320C160 408.4 231.6 480 320 480C408.4 480 480 408.4 480 320C480 231.6 408.4 160 320 160C231.6 160 160 231.6 160 320zM320 224C373 224 416 267 416 320C416 373 373 416 320 416C267 416 224 373 224 320C224 267 267 224 320 224z'/></svg>");
}

.icon-address-load:focus{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'><path fill='%2305c7f2' d='M320 48C337.7 48 352 62.3 352 80L352 98.3C450.1 112.3 527.7 189.9 541.7 288L560 288C577.7 288 592 302.3 592 320C592 337.7 577.7 352 560 352L541.7 352C527.7 450.1 450.1 527.7 352 541.7L352 560C352 577.7 337.7 592 320 592C302.3 592 288 577.7 288 560L288 541.7C189.9 527.7 112.3 450.1 98.3 352L80 352C62.3 352 48 337.7 48 320C48 302.3 62.3 288 80 288L98.3 288C112.3 189.9 189.9 112.3 288 98.3L288 80C288 62.3 302.3 48 320 48zM160 320C160 408.4 231.6 480 320 480C408.4 480 480 408.4 480 320C480 231.6 408.4 160 320 160C231.6 160 160 231.6 160 320zM320 224C373 224 416 267 416 320C416 373 373 416 320 416C267 416 224 373 224 320C224 267 267 224 320 224z'/></svg>");
}

/* Entladeadresse */
.icon-address-unload{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'><path fill='%23888' d='M128 252.6C128 148.4 214 64 320 64C426 64 512 148.4 512 252.6C512 371.9 391.8 514.9 341.6 569.4C329.8 582.2 310.1 582.2 298.3 569.4C248.1 514.9 127.9 371.9 127.9 252.6zM320 320C355.3 320 384 291.3 384 256C384 220.7 355.3 192 320 192C284.7 192 256 220.7 256 256C256 291.3 284.7 320 320 320z'/></svg>");
}

.icon-address-unload:focus{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'><path fill='%2305c7f2' d='M128 252.6C128 148.4 214 64 320 64C426 64 512 148.4 512 252.6C512 371.9 391.8 514.9 341.6 569.4C329.8 582.2 310.1 582.2 298.3 569.4C248.1 514.9 127.9 371.9 127.9 252.6zM320 320C355.3 320 384 291.3 384 256C384 220.7 355.3 192 320 192C284.7 192 256 220.7 256 256C256 291.3 284.7 320 320 320z'/></svg>");
}

/* Umzugskartons */
.icon-boxes{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'><path fill='%23888' d='M64 64C46.3 64 32 78.3 32 96C32 113.7 46.3 128 64 128L136.9 128L229 404.2C206.5 421.8 192 449.2 192 480C192 533 235 576 288 576C340.4 576 383.1 534 384 481.7L586.1 414.3C602.9 408.7 611.9 390.6 606.3 373.8C600.7 357 582.6 348 565.8 353.6L363.8 421C346.6 398.9 319.9 384.5 289.8 384L197.7 107.8C188.9 81.6 164.5 64 136.9 64L64 64zM240 480C240 453.5 261.5 432 288 432C314.5 432 336 453.5 336 480C336 506.5 314.5 528 288 528C261.5 528 240 506.5 240 480zM312.5 153.3C287.3 161.5 273.5 188.6 281.7 213.8L321.3 335.5C329.5 360.7 356.6 374.5 381.8 366.3L503.5 326.7C528.7 318.5 542.5 291.4 534.3 266.2L494.8 144.5C486.6 119.3 459.5 105.5 434.3 113.7L312.5 153.3z'/></svg>");
}

.icon-boxes:focus{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'><path fill='%2305c7f2' d='M64 64C46.3 64 32 78.3 32 96C32 113.7 46.3 128 64 128L136.9 128L229 404.2C206.5 421.8 192 449.2 192 480C192 533 235 576 288 576C340.4 576 383.1 534 384 481.7L586.1 414.3C602.9 408.7 611.9 390.6 606.3 373.8C600.7 357 582.6 348 565.8 353.6L363.8 421C346.6 398.9 319.9 384.5 289.8 384L197.7 107.8C188.9 81.6 164.5 64 136.9 64L64 64zM240 480C240 453.5 261.5 432 288 432C314.5 432 336 453.5 336 480C336 506.5 314.5 528 288 528C261.5 528 240 506.5 240 480zM312.5 153.3C287.3 161.5 273.5 188.6 281.7 213.8L321.3 335.5C329.5 360.7 356.6 374.5 381.8 366.3L503.5 326.7C528.7 318.5 542.5 291.4 534.3 266.2L494.8 144.5C486.6 119.3 459.5 105.5 434.3 113.7L312.5 153.3z'/></svg>");
}

/* Umzugsdatum (Fecha) */
.icon-date{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'><path fill='%23888' d='M224 64C241.7 64 256 78.3 256 96L256 128L384 128L384 96C384 78.3 398.3 64 416 64C433.7 64 448 78.3 448 96L448 128L480 128C515.3 128 544 156.7 544 192L544 480C544 515.3 515.3 544 480 544L160 544C124.7 544 96 515.3 96 480L96 192C96 156.7 124.7 128 160 128L192 128L192 96C192 78.3 206.3 64 224 64zM160 304L160 336C160 344.8 167.2 352 176 352L208 352C216.8 352 224 344.8 224 336L224 304C224 295.2 216.8 288 208 288L176 288C167.2 288 160 295.2 160 304zM288 304L288 336C288 344.8 295.2 352 304 352L336 352C344.8 352 352 344.8 352 336L352 304C352 295.2 344.8 288 336 288L304 288C295.2 288 288 295.2 288 304zM432 288C423.2 288 416 295.2 416 304L416 336C416 344.8 423.2 352 432 352L464 352C472.8 352 480 344.8 480 336L480 304C480 295.2 472.8 288 464 288L432 288zM160 432L160 464C160 472.8 167.2 480 176 480L208 480C216.8 480 224 472.8 224 464L224 432C224 423.2 216.8 416 208 416L176 416C167.2 416 160 423.2 160 432zM304 416C295.2 416 288 423.2 288 432L288 464C288 472.8 295.2 480 304 480L336 480C344.8 480 352 472.8 352 464L352 432C352 423.2 344.8 416 336 416L304 416zM416 432L416 464C416 472.8 423.2 480 432 480L464 480C472.8 480 480 472.8 480 464L480 432C480 423.2 472.8 416 464 416L432 416z'/></svg>");
}

.icon-date:focus{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'><path fill='%2305c7f2' d='M224 64C241.7 64 256 78.3 256 96L256 128L384 128L384 96C384 78.3 398.3 64 416 64C433.7 64 448 78.3 448 96L448 128L480 128C515.3 128 544 156.7 544 192L544 480C544 515.3 515.3 544 480 544L160 544C124.7 544 96 515.3 96 480L96 192C96 156.7 124.7 128 160 128L192 128L192 96C192 78.3 206.3 64 224 64zM160 304L160 336C160 344.8 167.2 352 176 352L208 352C216.8 352 224 344.8 224 336L224 304C224 295.2 216.8 288 208 288L176 288C167.2 288 160 295.2 160 304zM288 304L288 336C288 344.8 295.2 352 304 352L336 352C344.8 352 352 344.8 352 336L352 304C352 295.2 344.8 288 336 288L304 288C295.2 288 288 295.2 288 304zM432 288C423.2 288 416 295.2 416 304L416 336C416 344.8 423.2 352 432 352L464 352C472.8 352 480 344.8 480 336L480 304C480 295.2 472.8 288 464 288L432 288zM160 432L160 464C160 472.8 167.2 480 176 480L208 480C216.8 480 224 472.8 224 464L224 432C224 423.2 216.8 416 208 416L176 416C167.2 416 160 423.2 160 432zM304 416C295.2 416 288 423.2 288 432L288 464C288 472.8 295.2 480 304 480L336 480C344.8 480 352 472.8 352 464L352 432C352 423.2 344.8 416 336 416L304 416zM416 432L416 464C416 472.8 423.2 480 432 480L464 480C472.8 480 480 472.8 480 464L480 432C480 423.2 472.8 416 464 416L432 416z'/></svg>");
}

/* Ocultar icono nativo del input date (solo visual) */
input[type="date"]::-webkit-calendar-picker-indicator {
  opacity: 0;
}

/* Fix overflow input[type=date] en móviles reales (Safari/Chrome)
   DevTools no siempre lo reproduce */
input[type="date"]{
  display: block;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

/* Safari iOS: evita que el valor interno empuje el ancho */
input[type="date"]::-webkit-date-and-time-value{
  width: 100%;
  text-align: left;
}

/* Mantiene el layout estable cuando el input tiene icono/padding */
input[type="date"]::-webkit-datetime-edit{
  padding: 0;
}

/* Evitar estilos extra del navegador */
input[type="date"]::-webkit-inner-spin-button,
input[type="date"]::-webkit-clear-button {
  display: none;
}

.btn-submit{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;                 /* espacio entre icono y texto */

  background-color: #15365A;
  color: #fff;
  border: none;
  border-radius: 10px;
  padding: 12px 24px;

  font-size: 16px;
  font-weight: 600;
  cursor: pointer;
}

.btn-submit::before{
  content: "";
  width: 18px;
  height: 18px;
  display: inline-block;
  margin-right: 6px;
  vertical-align: middle;

  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;

  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'><path fill='%23ffffff' d='M322.5 351.7L523.4 150.9L391 520.3L322.5 351.7zM489.4 117L288.6 317.8L120 249.3L489.4 117zM70.1 280.8L275.9 364.4L359.5 570.2C364.8 583.3 377.6 591.9 391.8 591.9C406.5 591.9 419.6 582.7 424.6 568.8L602.6 72C606.1 62.2 603.6 51.4 596.3 44C589 36.6 578.1 34.2 568.3 37.7L71.4 215.7C57.5 220.7 48.3 233.8 48.3 248.5C48.3 262.7 56.9 275.5 70 280.8z'/></svg>");
}

.btn-submit:hover{
  background-color: #0f2b44;
}

.file-btn{
  width: 44px;
  height: 34px;
  border-radius: 50%;
  border: none;
  cursor: pointer;

  background-color: #15365A;
  display: inline-flex;
  align-items: center;
  justify-content: center;

  background-repeat: no-repeat;
  background-position: center;
  background-size: 20px;

  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640"><path fill="%23ffffff" d="M128 64C92.7 64 64 92.7 64 128L64 512C64 547.3 92.7 576 128 576L308 576C285.3 544.5 272 505.8 272 464C272 363.4 349.4 280.8 448 272.7L448 234.6C448 217.6 441.3 201.3 429.3 189.3L322.7 82.7C310.7 70.7 294.5 64 277.5 64L128 64zM389.5 240L296 240C282.7 240 272 229.3 272 216L272 122.5L389.5 240zM464 608C543.5 608 608 543.5 608 464C608 384.5 543.5 320 464 320C384.5 320 320 384.5 320 464C320 543.5 384.5 608 464 608zM480 400L480 448L528 448C536.8 448 544 455.2 544 464C544 472.8 536.8 480 528 480L480 480L480 528C480 536.8 472.8 544 464 544C455.2 544 448 536.8 448 528L448 480L400 480C391.2 480 384 472.8 384 464C384 455.2 391.2 448 400 448L448 448L448 400C448 391.2 455.2 384 464 384C472.8 384 480 391.2 480 400z"/></svg>');
}

.file-btn:hover{
  background-color: #05c7f2;
}

.file-btn:focus{
  outline: none;
  box-shadow: 0 0 0 3px rgba(5,199,242,.4);
}

/* =========================================================
   KONTAKTFORMULAR - MODERNISIERUNG OHNE FUNKTIONSÄNDERUNG
   ========================================================= */

:root{
  --form-white:#ffffff;
  --form-blue-50:#f5faff;
  --form-blue-100:#ebf5ff;
  --form-blue-150:#dff0ff;
  --form-primary:#15365A;
  --form-primary-2:#1c4b79;
  --form-accent:#05c7f2;
  --form-text:#22384d;
  --form-muted:#60758d;
  --form-border:rgba(21,54,90,.10);
  --form-shadow:0 20px 55px rgba(21,54,90,.08);
  --form-shadow-soft:0 14px 34px rgba(21,54,90,.06);
}

body{
  background:
    radial-gradient(circle at top left, rgba(5,199,242,.08) 0%, rgba(5,199,242,0) 28%),
    linear-gradient(180deg, #f7fbff 0%, #eef6ff 100%) !important;
  color:var(--form-text);
}

.page-container{
  max-width:1240px;
  padding:0 24px;
}

.page-container:first-of-type{
  margin-top:48px;
}

.top-container{
  position:relative;
  align-items:stretch;
  gap:28px;
  margin:0 auto 24px;
}

.left-side,
.right-side{
  background:rgba(255,255,255,.95);
  border:1px solid var(--form-border);
  border-radius:28px;
  box-shadow:var(--form-shadow-soft);
}

.left-side{
  padding:42px 40px;
  background:
    radial-gradient(circle at top left, rgba(5,199,242,.09) 0%, rgba(5,199,242,0) 30%),
    linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
}

.left-side h2{
  margin:0 0 14px;
  font-size:44px;
  line-height:1.12;
  color:var(--form-primary);
}

.left-side p{
  max-width:560px;
  margin:0;
  font-size:17px;
  line-height:1.8;
  color:var(--form-muted);
}

.right-side{
  padding:34px 34px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  text-align:left;
  background:linear-gradient(180deg, #ffffff 0%, #f4f9ff 100%);
}

.right-side p{
  margin:0;
  padding:14px 0;
  display:flex;
  align-items:center;
  gap:12px;
  color:var(--form-text);
  border-bottom:1px solid rgba(21,54,90,.08);
}

.right-side p:last-child{
  border-bottom:none;
}

.right-side a{
  color:var(--form-primary);
}

.right-side a:hover{
  color:var(--form-accent);
}

.page-container .top-container i,
.top-container i{
  width:20px;
  min-width:20px;
  margin-top:0;
  color:var(--form-accent) !important;
  text-shadow:none;
  font-size:18px !important;
  line-height:1;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

.form-container{
  margin:0 auto 64px;
  background:rgba(255,255,255,.97);
  border:1px solid var(--form-border);
  border-radius:30px;
  box-shadow:var(--form-shadow);
  overflow:hidden;
}

.form-container form{
  width:100%;
  padding:42px 38px 38px;
}

.form-container form::before{
  content:"Ihre Anfrage";
  display:inline-block;
  margin-bottom:18px;
  padding:8px 14px;
  border-radius:999px;
  background:var(--form-blue-100);
  color:var(--form-primary);
  font-size:12px;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.form-row{
  gap:18px;
  margin-bottom:18px;
}

.form-row .field{
  gap:8px;
}

form input:not([type="checkbox"]):not([type="radio"]),
form select,
form textarea{
  width:100%;
  min-height:56px;
  padding:14px 16px;
  border:1px solid rgba(21,54,90,.12);
  border-radius:16px;
  font-size:15px;
  line-height:1.4;
  color:var(--form-text);
  background:#fff;
  box-shadow:none;
  transition:border-color .22s ease, box-shadow .22s ease, background-color .22s ease;
}

form textarea{
  min-height:150px;
  padding-top:16px;
  resize:vertical;
}

form input:focus,
form select:focus,
form textarea:focus{
  outline:none;
  border-color:rgba(5,199,242,.65);
  box-shadow:0 0 0 4px rgba(5,199,242,.14);
  background:#fff;
}

input::placeholder,
textarea::placeholder{
  color:#8699ae;
}

.input-icon{
  background-position:14px center;
  background-size:18px;
  padding-left:42px !important;
}

.sub-row{
  gap:10px;
  margin-top:10px;
}

.sub-row select{
  min-height:46px;
  padding:10px 12px;
  border:1px solid rgba(21,54,90,.10);
  border-radius:14px;
  background:#f9fcff;
}

.sub-row select:focus{
  border-color:rgba(5,199,242,.65);
  box-shadow:0 0 0 4px rgba(5,199,242,.12);
}

.message-label,
.upload-label{
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin-bottom:8px;
  color:var(--form-primary);
  font-size:14px;
  font-weight:700;
}

.info-icon{
  width:18px;
  height:18px;
  fill:#6a819a;
}

.info-tooltip:hover .info-icon{
  fill:var(--form-accent);
}

.tooltip-box{
  width:250px;
  padding:10px 12px;
  border-radius:12px;
  background:#16334f;
  box-shadow:0 12px 24px rgba(21,54,90,.16);
}

.tooltip-box::after{
  border-color:#16334f transparent transparent transparent;
}

.upload-section{
  margin-top:10px;
  padding:22px;
  border:1px solid rgba(21,54,90,.08);
  border-radius:22px;
  background:linear-gradient(180deg, #fbfdff 0%, #f3f9ff 100%);
}

.upload-header{
  margin-bottom:14px;
}

.upload-dropzone{
  border:2px dashed rgba(21,54,90,.16);
  border-radius:22px;
  background:#ffffff;
  padding:28px 18px;
  gap:10px;
  transition:border-color .22s ease, background-color .22s ease, box-shadow .22s ease, transform .22s ease;
}

.upload-dropzone:hover{
  transform:translateY(-1px);
  box-shadow:0 12px 28px rgba(21,54,90,.06);
}

.upload-dropzone:focus,
.upload-dropzone.is-dragover{
  border-color:var(--form-accent);
  background:#f3fcff;
  box-shadow:0 0 0 4px rgba(5,199,242,.12);
}

.upload-icon svg{
  width:46px;
  height:46px;
  color:#89a4bd;
}

.upload-title{
  font-size:18px;
  font-weight:700;
  color:var(--form-primary);
}

.upload-browse{
  font-size:19px;
  font-weight:700;
  color:var(--form-accent);
}

.upload-browse:hover{
  color:#1ccff4;
}

.upload-subtitle,
.upload-counter{
  color:var(--form-muted);
}

.upload-preview{
  margin-top:16px;
  gap:12px;
}

.preview-item{
  width:108px;
  height:108px;
  border-radius:16px;
  border:1px solid rgba(21,54,90,.10);
  background:#fff;
  box-shadow:0 8px 18px rgba(21,54,90,.05);
}

.delete-btn{
  top:6px;
  right:6px;
  width:24px;
  height:24px;
  background:rgba(255,255,255,.94);
  box-shadow:0 4px 10px rgba(0,0,0,.08);
}

#legalChecks{
  margin-top:18px !important;
  padding:18px 20px;
  border:1px solid rgba(21,54,90,.08);
  border-radius:18px;
  background:#fafcff;
  font-size:13px;
}

.checkbox-line{
  align-items:flex-start;
  gap:10px;
  margin-bottom:10px;
  line-height:1.6;
  color:var(--form-muted);
}

.checkbox-line:last-child{
  margin-bottom:0;
}

.checkbox-line input[type="checkbox"]{
  width:18px;
  height:18px;
  min-width:18px;
  margin-top:2px;
  accent-color:var(--form-accent);
}

#legalChecks a{
  color:var(--form-primary);
  text-decoration:underline;
}

#legalChecks a:hover{
  color:var(--form-accent);
}

.btn-submit,
form button.btn-submit{
  width:100%;
  max-width:320px;
  margin:22px auto 0;
  min-height:56px;
  border:none;
  border-radius:999px;
  padding:14px 28px;
  background:linear-gradient(135deg, var(--form-primary) 0%, var(--form-primary-2) 100%);
  color:#fff;
  box-shadow:0 14px 30px rgba(21,54,90,.18);
  transition:transform .22s ease, box-shadow .22s ease, filter .22s ease;
}

.btn-submit:hover,
form button.btn-submit:hover{
  background:linear-gradient(135deg, #05c7f2 0%, #45d8f7 100%);
  color:#fff;
  box-shadow:0 18px 36px rgba(5,199,242,.24);
  transform:translateY(-2px);
}

button.sending{
  background:#7a8fa4 !important;
  box-shadow:none !important;
}

#overlay{
  background:rgba(255,255,255,.88);
  backdrop-filter:blur(4px);
}

@media (max-width: 991px){
  .page-container:first-of-type{
    margin-top:30px;
  }

  .top-container{
    flex-direction:column;
    gap:20px;
  }

  .left-side,
  .right-side{
    padding:30px 26px;
  }

  .left-side h2{
    font-size:36px;
  }

  .form-container form{
    padding:34px 26px 30px;
  }
}

@media (max-width: 768px){
  .page-container{
    padding:0 14px;
  }

  .left-side,
  .right-side,
  .form-container{
    border-radius:22px;
  }

  .left-side{
    padding:28px 22px;
  }

  .left-side h2{
    font-size:30px;
    line-height:1.16;
  }

  .left-side p,
  .right-side p{
    font-size:15px;
    line-height:1.7;
  }

  .form-container{
    margin-bottom:46px;
  }

  .form-container form{
    padding:28px 18px 24px;
  }

  .form-row{
    flex-direction:column;
    gap:14px;
    margin-bottom:14px;
  }

  .sub-row{
    flex-direction:column !important;
  }

  form input,
  form select,
  form textarea{
    min-height:52px;
    border-radius:14px;
  }

  .upload-section{
    padding:18px 16px;
    border-radius:18px;
  }

  .upload-dropzone{
    border-radius:18px;
    padding:22px 14px;
  }

  .preview-item{
    width:92px;
    height:92px;
  }

  .btn-submit,
  form button.btn-submit{
    max-width:none;
  }
}

/* corregir checkboxes legales */
#legalChecks .checkbox-line{
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 14px;
  line-height: 1.55;
  cursor: pointer;
}

#legalChecks .checkbox-line:last-child{
  margin-bottom: 0;
}

#legalChecks .checkbox-line input[type="checkbox"]{
  width: 18px !important;
  min-width: 18px !important;
  max-width: 18px !important;
  height: 18px !important;
  min-height: 18px !important;
  padding: 0 !important;
  margin: 3px 0 0 0 !important;
  border-radius: 4px !important;
  flex: 0 0 18px !important;
  box-shadow: none !important;
  display: inline-block !important;
  vertical-align: top !important;
}

#legalChecks .checkbox-line a{
  text-decoration: underline;
}

#legalChecks .checkbox-text{
  display: block;
}

/* =========================================================
   FIX DEFINITIVO ICONOS EN INPUTS
   ========================================================= */

form input.input-icon,
form input.input-icon:focus,
form input.input-icon:hover{
  background-repeat: no-repeat !important;
  background-position: 14px center !important;
  background-size: 18px !important;
  padding-left: 42px !important;
  background-color: #ffffff !important;
}

/* iconos por tipo */
form input.icon-user,
form input.icon-user:focus,
form input.icon-user:hover{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'><path fill='%23888' d='M320 312C386.3 312 440 258.3 440 192C440 125.7 386.3 72 320 72C253.7 72 200 125.7 200 192C200 258.3 253.7 312 320 312zM290.3 368C191.8 368 112 447.8 112 546.3C112 562.7 125.3 576 141.7 576L498.3 576C514.7 576 528 562.7 528 546.3C528 447.8 448.2 368 349.7 368L290.3 368z'/></svg>") !important;
}

form input.icon-user:focus{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'><path fill='%2305c7f2' d='M320 312C386.3 312 440 258.3 440 192C440 125.7 386.3 72 320 72C253.7 72 200 125.7 200 192C200 258.3 253.7 312 320 312zM290.3 368C191.8 368 112 447.8 112 546.3C112 562.7 125.3 576 141.7 576L498.3 576C514.7 576 528 562.7 528 546.3C528 447.8 448.2 368 349.7 368L290.3 368z'/></svg>") !important;
}

form input.icon-email,
form input.icon-email:focus,
form input.icon-email:hover{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'><path fill='%23888' d='M112 128C85.5 128 64 149.5 64 176C64 191.1 71.1 205.3 83.2 214.4L291.2 370.4C308.3 383.2 331.7 383.2 348.8 370.4L556.8 214.4C568.9 205.3 576 191.1 576 176C576 149.5 554.5 128 528 128L112 128zM64 260L64 448C64 483.3 92.7 512 128 512L512 512C547.3 512 576 483.3 576 448L576 260L377.6 408.8C343.5 434.4 296.5 434.4 262.4 408.8L64 260z'/></svg>") !important;
}

form input.icon-email:focus{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'><path fill='%2305c7f2' d='M112 128C85.5 128 64 149.5 64 176C64 191.1 71.1 205.3 83.2 214.4L291.2 370.4C308.3 383.2 331.7 383.2 348.8 370.4L556.8 214.4C568.9 205.3 576 191.1 576 176C576 149.5 554.5 128 528 128L112 128zM64 260L64 448C64 483.3 92.7 512 128 512L512 512C547.3 512 576 483.3 576 448L576 260L377.6 408.8C343.5 434.4 296.5 434.4 262.4 408.8L64 260z'/></svg>") !important;
}

form input.icon-phone,
form input.icon-phone:focus,
form input.icon-phone:hover{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'><path fill='%23888' d='M224.2 89C216.3 70.1 195.7 60.1 176.1 65.4L170.6 66.9C106 84.5 50.8 147.1 66.9 223.3C104 398.3 241.7 536 416.7 573.1C493 589.3 555.5 534 573.1 469.4L574.6 463.9C580 444.2 569.9 423.6 551.1 415.8L453.8 375.3C437.3 368.4 418.2 373.2 406.8 387.1L368.2 434.3C297.9 399.4 241.3 341 208.8 269.3L253 233.3C266.9 222 271.6 202.9 264.8 186.3L224.2 89z'/></svg>") !important;
}

form input.icon-phone:focus{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'><path fill='%2305c7f2' d='M224.2 89C216.3 70.1 195.7 60.1 176.1 65.4L170.6 66.9C106 84.5 50.8 147.1 66.9 223.3C104 398.3 241.7 536 416.7 573.1C493 589.3 555.5 534 573.1 469.4L574.6 463.9C580 444.2 569.9 423.6 551.1 415.8L453.8 375.3C437.3 368.4 418.2 373.2 406.8 387.1L368.2 434.3C297.9 399.4 241.3 341 208.8 269.3L253 233.3C266.9 222 271.6 202.9 264.8 186.3L224.2 89z'/></svg>") !important;
}

form input.icon-address-load,
form input.icon-address-load:focus,
form input.icon-address-load:hover{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'><path fill='%23888' d='M320 48C337.7 48 352 62.3 352 80L352 98.3C450.1 112.3 527.7 189.9 541.7 288L560 288C577.7 288 592 302.3 592 320C592 337.7 577.7 352 560 352L541.7 352C527.7 450.1 450.1 527.7 352 541.7L352 560C352 577.7 337.7 592 320 592C302.3 592 288 577.7 288 560L288 541.7C189.9 527.7 112.3 450.1 98.3 352L80 352C62.3 352 48 337.7 48 320C48 302.3 62.3 288 80 288L98.3 288C112.3 189.9 189.9 112.3 288 98.3L288 80C288 62.3 302.3 48 320 48zM160 320C160 408.4 231.6 480 320 480C408.4 480 480 408.4 480 320C480 231.6 408.4 160 320 160C231.6 160 160 231.6 160 320zM320 224C373 224 416 267 416 320C416 373 373 416 320 416C267 416 224 373 224 320C224 267 267 224 320 224z'/></svg>") !important;
}

form input.icon-address-load:focus{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'><path fill='%2305c7f2' d='M320 48C337.7 48 352 62.3 352 80L352 98.3C450.1 112.3 527.7 189.9 541.7 288L560 288C577.7 288 592 302.3 592 320C592 337.7 577.7 352 560 352L541.7 352C527.7 450.1 450.1 527.7 352 541.7L352 560C352 577.7 337.7 592 320 592C302.3 592 288 577.7 288 560L288 541.7C189.9 527.7 112.3 450.1 98.3 352L80 352C62.3 352 48 337.7 48 320C48 302.3 62.3 288 80 288L98.3 288C112.3 189.9 189.9 112.3 288 98.3L288 80C288 62.3 302.3 48 320 48zM160 320C160 408.4 231.6 480 320 480C408.4 480 480 408.4 480 320C480 231.6 408.4 160 320 160C231.6 160 160 231.6 160 320zM320 224C373 224 416 267 416 320C416 373 373 416 320 416C267 416 224 373 224 320C224 267 267 224 320 224z'/></svg>") !important;
}

form input.icon-address-unload,
form input.icon-address-unload:focus,
form input.icon-address-unload:hover{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'><path fill='%23888' d='M128 252.6C128 148.4 214 64 320 64C426 64 512 148.4 512 252.6C512 371.9 391.8 514.9 341.6 569.4C329.8 582.2 310.1 582.2 298.3 569.4C248.1 514.9 127.9 371.9 127.9 252.6zM320 320C355.3 320 384 291.3 384 256C384 220.7 355.3 192 320 192C284.7 192 256 220.7 256 256C256 291.3 284.7 320 320 320z'/></svg>") !important;
}

form input.icon-address-unload:focus{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'><path fill='%2305c7f2' d='M128 252.6C128 148.4 214 64 320 64C426 64 512 148.4 512 252.6C512 371.9 391.8 514.9 341.6 569.4C329.8 582.2 310.1 582.2 298.3 569.4C248.1 514.9 127.9 371.9 127.9 252.6zM320 320C355.3 320 384 291.3 384 256C384 220.7 355.3 192 320 192C284.7 192 256 220.7 256 256C256 291.3 284.7 320 320 320z'/></svg>") !important;
}

form input.icon-boxes,
form input.icon-boxes:focus,
form input.icon-boxes:hover{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'><path fill='%23888' d='M64 64C46.3 64 32 78.3 32 96C32 113.7 46.3 128 64 128L136.9 128L229 404.2C206.5 421.8 192 449.2 192 480C192 533 235 576 288 576C340.4 576 383.1 534 384 481.7L586.1 414.3C602.9 408.7 611.9 390.6 606.3 373.8C600.7 357 582.6 348 565.8 353.6L363.8 421C346.6 398.9 319.9 384.5 289.8 384L197.7 107.8C188.9 81.6 164.5 64 136.9 64L64 64zM240 480C240 453.5 261.5 432 288 432C314.5 432 336 453.5 336 480C336 506.5 314.5 528 288 528C261.5 528 240 506.5 240 480zM312.5 153.3C287.3 161.5 273.5 188.6 281.7 213.8L321.3 335.5C329.5 360.7 356.6 374.5 381.8 366.3L503.5 326.7C528.7 318.5 542.5 291.4 534.3 266.2L494.8 144.5C486.6 119.3 459.5 105.5 434.3 113.7L312.5 153.3z'/></svg>") !important;
}

form input.icon-boxes:focus{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'><path fill='%2305c7f2' d='M64 64C46.3 64 32 78.3 32 96C32 113.7 46.3 128 64 128L136.9 128L229 404.2C206.5 421.8 192 449.2 192 480C192 533 235 576 288 576C340.4 576 383.1 534 384 481.7L586.1 414.3C602.9 408.7 611.9 390.6 606.3 373.8C600.7 357 582.6 348 565.8 353.6L363.8 421C346.6 398.9 319.9 384.5 289.8 384L197.7 107.8C188.9 81.6 164.5 64 136.9 64L64 64zM240 480C240 453.5 261.5 432 288 432C314.5 432 336 453.5 336 480C336 506.5 314.5 528 288 528C261.5 528 240 506.5 240 480zM312.5 153.3C287.3 161.5 273.5 188.6 281.7 213.8L321.3 335.5C329.5 360.7 356.6 374.5 381.8 366.3L503.5 326.7C528.7 318.5 542.5 291.4 534.3 266.2L494.8 144.5C486.6 119.3 459.5 105.5 434.3 113.7L312.5 153.3z'/></svg>") !important;
}

form input.icon-date,
form input.icon-date:focus,
form input.icon-date:hover{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'><path fill='%23888' d='M224 64C241.7 64 256 78.3 256 96L256 128L384 128L384 96C384 78.3 398.3 64 416 64C433.7 64 448 78.3 448 96L448 128L480 128C515.3 128 544 156.7 544 192L544 480C544 515.3 515.3 544 480 544L160 544C124.7 544 96 515.3 96 480L96 192C96 156.7 124.7 128 160 128L192 128L192 96C192 78.3 206.3 64 224 64zM160 304L160 336C160 344.8 167.2 352 176 352L208 352C216.8 352 224 344.8 224 336L224 304C224 295.2 216.8 288 208 288L176 288C167.2 288 160 295.2 160 304zM288 304L288 336C288 344.8 295.2 352 304 352L336 352C344.8 352 352 344.8 352 336L352 304C352 295.2 344.8 288 336 288L304 288C295.2 288 288 295.2 288 304zM432 288C423.2 288 416 295.2 416 304L416 336C416 344.8 423.2 352 432 352L464 352C472.8 352 480 344.8 480 336L480 304C480 295.2 472.8 288 464 288L432 288zM160 432L160 464C160 472.8 167.2 480 176 480L208 480C216.8 480 224 472.8 224 464L224 432C224 423.2 216.8 416 208 416L176 416C167.2 416 160 423.2 160 432zM304 416C295.2 416 288 423.2 288 432L288 464C288 472.8 295.2 480 304 480L336 480C344.8 480 352 472.8 352 464L352 432C352 423.2 344.8 416 336 416L304 416zM416 432L416 464C416 472.8 423.2 480 432 480L464 480C472.8 480 480 472.8 480 464L480 432C480 423.2 472.8 416 464 416L432 416z'/></svg>") !important;
}

form input.icon-date:focus{
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'><path fill='%2305c7f2' d='M224 64C241.7 64 256 78.3 256 96L256 128L384 128L384 96C384 78.3 398.3 64 416 64C433.7 64 448 78.3 448 96L448 128L480 128C515.3 128 544 156.7 544 192L544 480C544 515.3 515.3 544 480 544L160 544C124.7 544 96 515.3 96 480L96 192C96 156.7 124.7 128 160 128L192 128L192 96C192 78.3 206.3 64 224 64zM160 304L160 336C160 344.8 167.2 352 176 352L208 352C216.8 352 224 344.8 224 336L224 304C224 295.2 216.8 288 208 288L176 288C167.2 288 160 295.2 160 304zM288 304L288 336C288 344.8 295.2 352 304 352L336 352C344.8 352 352 344.8 352 336L352 304C352 295.2 344.8 288 336 288L304 288C295.2 288 288 295.2 288 304zM432 288C423.2 288 416 295.2 416 304L416 336C416 344.8 423.2 352 432 352L464 352C472.8 352 480 344.8 480 336L480 304C480 295.2 472.8 288 464 288L432 288zM160 432L160 464C160 472.8 167.2 480 176 480L208 480C216.8 480 224 472.8 224 464L224 432C224 423.2 216.8 416 208 416L176 416C167.2 416 160 423.2 160 432zM304 416C295.2 416 288 423.2 288 432L288 464C288 472.8 295.2 480 304 480L336 480C344.8 480 352 472.8 352 464L352 432C352 423.2 344.8 416 336 416L304 416zM416 432L416 464C416 472.8 423.2 480 432 480L464 480C472.8 480 480 472.8 480 464L480 432C480 423.2 472.8 416 464 416L432 416z'/></svg>") !important;
}

/* =========================================================
   Kontakt-Conversion-Block
   ========================================================= */

.contact-kicker{
  display:inline-block;
  margin-bottom:12px;
  padding:7px 12px;
  border-radius:999px;
  background:rgba(5,199,242,.10);
  color:var(--form-primary);
  font-size:12px;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.left-side h1,
.left-side h2{
  margin:0 0 14px;
  font-size:44px;
  line-height:1.12;
  color:var(--form-primary);
}

.contact-info-title{
  margin:0 0 10px;
  color:var(--form-primary);
  font-size:18px;
  font-weight:700;
}

.page-container--compact{
  margin-top:18px;
  margin-bottom:28px;
}

.contact-request-steps{
  padding:28px 30px;
  border:1px solid var(--form-border);
  border-radius:28px;
  background:rgba(255,255,255,.95);
  box-shadow:var(--form-shadow-soft);
}

.contact-request-steps__intro{
  margin-bottom:18px;
}

.contact-request-steps__intro h2{
  margin:0 0 8px;
  color:var(--form-primary);
  font-size:28px;
  line-height:1.2;
}

.contact-request-steps__intro p{
  margin:0;
  color:var(--form-muted);
  font-size:15px;
  line-height:1.7;
}

.contact-request-steps__grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:14px;
}

.contact-request-step{
  display:flex;
  align-items:flex-start;
  gap:12px;
  padding:16px 18px;
  border:1px solid rgba(21,54,90,.08);
  border-radius:18px;
  background:linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
}

.contact-request-step__number{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 30px;
  width:30px;
  height:30px;
  border-radius:50%;
  background:rgba(5,199,242,.12);
  color:var(--form-primary);
  font-size:14px;
  font-weight:700;
}

.contact-request-step p{
  margin:2px 0 0;
  color:var(--form-text);
  font-size:14px;
  line-height:1.65;
}

.form-support-copy{
  margin:0 0 20px;
  padding:14px 16px;
  border:1px solid rgba(21,54,90,.08);
  border-radius:18px;
  background:linear-gradient(180deg, #fbfdff 0%, #f4f9ff 100%);
}

.form-support-copy p{
  margin:0;
  color:var(--form-muted);
  font-size:14px;
  line-height:1.7;
}

.upload-header{
  flex-wrap:wrap;
}

.upload-meta{
  font-size:13px;
  color:var(--form-muted);
}

.upload-message{
  min-height:20px;
  margin-top:8px;
  font-size:13px;
  line-height:1.5;
  color:#b45309;
}

.upload-message.is-error{
  color:#b91c1c;
}

.upload-message.is-success{
  color:#166534;
}

@media (max-width: 991px){
  .left-side h1,
  .left-side h2{
    font-size:36px;
  }

  .contact-request-steps{
    padding:24px 24px;
  }
}

@media (max-width: 768px){
  .contact-kicker{
    margin-bottom:10px;
  }

  .left-side h1,
  .left-side h2{
    font-size:30px;
    line-height:1.16;
  }

  .page-container--compact{
    margin-top:14px;
    margin-bottom:22px;
  }

  .contact-request-steps{
    padding:22px 18px;
    border-radius:22px;
  }

  .contact-request-steps__intro h2{
    font-size:24px;
  }

  .contact-request-steps__grid{
    grid-template-columns:1fr;
    gap:12px;
  }

  .contact-request-step{
    padding:14px 15px;
    border-radius:16px;
  }
}

/* =========================================================
   Final responsive layout for Etage / Aufzug / Parken
   ========================================================= */

form .sub-row{
  display:grid !important;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:10px;
  align-items:start;
}

form .sub-row select{
  width:100%;
  min-width:0;
}

@media (max-width: 768px){
  form .sub-row{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }

  form .sub-row select:last-child{
    grid-column:1 / -1;
  }
}

@media (max-width: 480px){
  form .sub-row{
    grid-template-columns:1fr;
  }

  form .sub-row select:last-child{
    grid-column:auto;
  }
}