/* Decorative vector backgrounds stay behind content and never intercept input. */
[data-section="hausbau"] {
  background-image: url("graphics/floor-plan.svg"),
    radial-gradient(ellipse at 100% 10%, #f2f4f2 0%, transparent 65%);
  background-repeat: no-repeat;
  background-position: right -75px top -70px, center;
  background-size: 460px auto, cover;
}

[data-section="ablauf"] {
  background-color: #edf2ec;
  background-image: url("graphics/house-elevation.svg"),
    linear-gradient(90deg, transparent 47px, #2d5a2705 48px),
    linear-gradient(transparent 47px, #2d5a2705 48px);
  background-repeat: no-repeat, repeat, repeat;
  background-position: right -30px top -30px, center, center;
  background-size: 620px auto, 48px 48px, 48px 48px;
}

[data-section="kontakt"] {
  background-color: #f2f4f2;
  background-image: url("graphics/floor-plan.svg"),
    radial-gradient(ellipse at 0% 100%, #dce7d9 0%, transparent 65%);
  background-repeat: no-repeat;
  background-position: left -140px bottom -130px, center;
  background-size: 700px auto, cover;
}

[data-section="kontakt"] form { background: #fff; }

@media (max-width: 800px) {
  [data-section="hausbau"] { background-size: 300px auto, cover; background-position: right -110px top -65px, center; }
  [data-section="ablauf"] { background-size: 420px auto, 48px 48px, 48px 48px; background-position: right -180px top -15px, center, center; }
  [data-section="kontakt"] { background-size: 470px auto, cover; background-position: left -190px top 60px, center; }
}

@media print {
  [data-section="hausbau"], [data-section="ablauf"], [data-section="kontakt"] { background-image: none; background-color: #fff; }
}
