* {
  box-sizing:border-box
}
html {
  scroll-behavior:smooth
}
body {
  margin:0;
  font:17px/1.65 Arial,Helvetica,sans-serif;
  color:#666;
  background:white
}
a {
  color:#819200;
  text-underline-offset:3px
}
a:hover {
  color:#556300
}


.wrap {
  max-width:1150px;
  margin:auto;
  padding:0 26px
}


.top {
  padding:36px 0 28px
}


.top .wrap {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px
}


.logo {
  display:block;
  width:min(390px,65vw);
  height:auto
}


.nav {
  display:flex;
  gap:28px;
  flex-wrap:wrap
}


.nav a {
  text-decoration:none;
  color:#9bac00
}


.hero {
  height:clamp(180px,25vw,390px);
  background:#e9eaed url('kontakt.jpg') center center/cover no-repeat
}


.main {
  padding:46px 0 75px;
  min-height:350px
}
h1 {
  font-size:clamp(32px,4vw,46px);
  font-weight:500;
  color:#666;
  margin:0 0 28px
}
h2 {
  font-size:23px;
  font-weight:500;
  color:#555;
  margin:30px 0 14px;
  padding-bottom:12px;
  border-bottom:1px solid #bccf00
}
h3 {
  font-size:19px;
  color:#555;
  margin:25px 0 8px
}


.grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:30px 65px
}
p {
  margin:0 0 16px
}


.footer {
  border-top:1px solid #e5e5e5;
  background:#f8f8f8;
  padding:22px 0;
  font-size:14px
}


.footer .wrap {
  display:flex;
  justify-content:space-between;
  gap:16px;
  flex-wrap:wrap
}


.footer a {
  margin-left:16px
}


.legal {
  max-width:850px
}


.legal p {
  margin-bottom:13px
}


.note {
  border-left:3px solid #bccf00;
  padding:12px 18px;
  background:#f8f9f3;
  margin:25px 0
}


@media(max-width:650px) {
  .top .wrap {
  align-items:flex-start;
  flex-direction:column
}


.top {
  padding:20px 0
}


.nav {
  gap:20px
}


.grid {
  grid-template-columns:1fr;
  gap:5px
}


.main {
  padding:30px 0 50px
}


.hero {
  background-position:58% center
}

}

/* Kontaktbereich ohne zweite Betriebsstätte */
.contact-details {
  max-width: 620px;
}