@font-face {
  font-family:Barlow;
  font-style:normal;
  font-weight:400;
  font-display:swap;
  src:url("../fonts/barlow-normal-latin-400.7c9c80a6c32c.woff2") format("woff2")
}
@font-face {
  font-family:Barlow;
  font-style:normal;
  font-weight:700;
  font-display:swap;
  src:url("../fonts/barlow-normal-latin-700.65a47caa5183.woff2") format("woff2")
}
@font-face {
  font-family:Bitter;
  font-style:normal;
  font-weight:400;
  font-display:swap;
  src:url("../fonts/bitter-normal-latin-400.f945aab83e72.woff2") format("woff2")
}
:root {
  --blau:#202d83;
  --blau-dunkel:#192a84;
  --orange:#ef9417;
  --rot:#cf1f2c;
  --text:#757575;
  --grau:#f3f5f8;
  --linie:#d7dbe5;
  --weiss:#fff;
  --schatten:0 12px 30px rgba(17,29,78,.14);
  --radius:0;
  --sticky-header-offset:10rem
}
* {
  box-sizing:border-box
}
html {
  scroll-behavior:smooth;
  scroll-padding-top:var(--sticky-header-offset)
}
body {
  margin:0;
  color:var(--text);
  background:#fff;
  font:400 1.125rem/1.45 Barlow,Arial,sans-serif
}
body.dialog-offen {
  overflow:hidden
}
img {
  display:block;
  max-width:100%;
  height:auto
}
a {
  color:var(--blau);
  text-decoration:none
}
a:hover,a:active {
  color:var(--rot);
  text-decoration:none
}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,summary:focus-visible {
  outline:3px solid #ffbf47;
  outline-offset:3px
}
button,input,textarea {
  font:inherit
}
button {
  cursor:pointer
}
.sprunglink {
  position:absolute;
  z-index:999;
  top:.5rem;
  left:.5rem;
  padding:.7rem 1rem;
  background:#fff;
  color:#000;
  transform:translateY(-160%)
}
.sprunglink:focus {
  transform:none
}
.visually-hidden {
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  padding:0!important;
  margin:-1px!important;
  overflow:hidden!important;
  clip:rect(0,0,0,0)!important;
  white-space:nowrap!important;
  border:0!important
}
.container {
  width:min(1020px,calc(100% - 2rem));
  margin-inline:auto
}
.topbar {
  background:var(--blau-dunkel);
  color:#fff;
  font-size:.95rem
}
.topbar .container {
  min-height:2.1rem;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem
}
.topbar a {
  display:inline-flex;
  align-items:center;
  gap:.5rem;
  color:#fff
}
.topbar a:hover {
  color:#ffcf61
}
.kontakt-icon {
  width:1.15rem;
  height:1.15rem;
  filter:brightness(0) invert(1)
}
.site-header {
  position:sticky;
  z-index:50;
  top:0;
  background:#fff;
  transition:box-shadow .2s ease
}
.site-header[data-scrolled=true] {
  box-shadow:0 8px 24px rgba(17,29,78,.16)
}
#hauptinhalt {
  scroll-margin-top:var(--sticky-header-offset)
}
.header-row {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:2rem;
  min-height:10rem;
  transition:min-height .2s ease,padding .2s ease,gap .2s ease
}
.logo img {
  width:270px;
  height:100px;
  object-fit:contain;
  transition:width .2s ease,height .2s ease
}
.site-header[data-scrolled=true] .header-row {
  min-height:6.5rem
}
.site-header[data-scrolled=true] .logo img {
  width:215px;
  height:auto
}
.menu-toggle {
  display:none;
  border:2px solid transparent;
  border-radius:0;
  padding:.65rem 1rem;
  background:var(--blau);
  color:#fff;
  font:400 1.15rem/1.35 Bitter,Georgia,serif;
  align-items:center;
  justify-content:center
}
.nav-list,.submenu {
  list-style:none;
  margin:0;
  padding:0
}
.nav-list {
  display:flex;
  align-items:center;
  gap:1.65rem
}
.nav-list>li {
  position:relative
}
.nav-list a,.submenu-toggle {
  display:flex;
  align-items:center;
  border:0;
  background:transparent;
  padding:.8rem 0;
  color:var(--blau);
  font-size:1.125rem;
  font-weight:400;
  line-height:1.4
}
.nav-list a[aria-current=page], .nav-list>li[data-section-current=true]>a, .has-submenu[data-section-current=true]>.nav-parent>a, .nav-list a:hover, .submenu-toggle:hover {
  color:var(--orange)
}
.nav-parent {
  display:flex;
  align-items:center;
  gap:.45rem
}
.nav-parent>a {
  padding-right:0
}
.submenu-toggle {
  min-width:auto;
  padding-inline:0
}
.submenu-toggle img {
  width:.75rem;
  transition:transform .2s ease
}
.has-submenu[data-open=true] .submenu-toggle img {
  transform:rotate(180deg)
}
.submenu {
  position:absolute;
  display:none;
  left:0;
  top:100%;
  min-width:18rem;
  padding:.45rem;
  background:#fff;
  box-shadow:var(--schatten);
  border-top:3px solid var(--blau)
}
.submenu a {
  gap:.55rem;
  padding:.55rem .7rem;
  font-size:1rem;
  font-weight:400
}
.has-submenu:hover .submenu,.has-submenu:focus-within .submenu,.has-submenu[data-open=true] .submenu {
  display:block
}
.hero {
  min-height:37rem;
  display:grid;
  place-items:center;
  background-color:#202d83;
  background-position:center;
  background-size:cover;
  color:#fff;
  text-align:center
}
.hero>.container {
  padding-block:4rem
}
.hero-kicker,.hero-lead {
  margin:.5rem auto;
  font:400 clamp(1.25rem,2.3vw,2rem)/1.4 Barlow,Arial,sans-serif
}
.hero-logo {
  width:min(500px,80vw);
  margin:1rem auto
}
.hero--home {
  background-image:url("../images/site/sonne-vor-blauem-himmel-720w.d67f6deaeec2.webp")
}
.hero--markisen {
  background-image:url("../images/site/reflexa-benita-720w.02a35a7da7e3.webp")
}
.hero--rollaeden {
  background-image:url("../images/site/reflexa-combo-720w.4734476fed2c.webp")
}
.hero--jalousien {
  background-image:url("../images/site/sonne-zwischen-wolken-720w.bd2b06bcf975.webp")
}
.hero--insektenschutz {
  background-image:url("../images/site/insektenschutz-muecke-stoppschild-720w.bcdcbebf553b.webp")
}
.hero--fenster {
  background-image:url("../images/site/modernes-wohnhaus-mit-garagentor-720w.adff8f22beb8.webp")
}
.hero--dachfenster {
  background-image:url("../images/site/dachfenster-velux-720w.9c9c96712fab.webp")
}
.hero--reparatur {
  background-image:url("../images/site/service-schriftzug-mit-werkzeug-720w.d752c9c36674.webp")
}
.hero--sicherheit {
  background-image:url("../images/site/altes-torschloss-mit-vorhaengeschloss-720w.a68b182aa719.webp")
}
.hero--referenzen {
  background-image:url("../images/site/innenjalousien-im-wohnzimmer-720w.6b0d2a8ffb7f.webp")
}
.hero--kontakt {
  background-image:url("../images/site/kontakt-und-kommunikation-720w.160f3c775dd4.webp")
}
.hero--legal {
  background-image:url("../images/site/rechtliche-informationen-paragrafen-720w.deb454759140.webp")
}
@media(min-width:681px) {
  .hero--home {
    background-image:url("../images/site/sonne-vor-blauem-himmel-1280w.b6b984fadaae.webp")
  }
  .hero--markisen {
    background-image:url("../images/site/reflexa-benita.38bc3b98ddfc.webp")
  }
  .hero--rollaeden {
    background-image:url("../images/site/reflexa-combo-1280w.752256170961.webp")
  }
  .hero--jalousien {
    background-image:url("../images/site/sonne-zwischen-wolken-1280w.bfe340da623d.webp")
  }
  .hero--insektenschutz {
    background-image:url("../images/site/insektenschutz-muecke-stoppschild-1280w.9418abefe1cd.webp")
  }
  .hero--fenster {
    background-image:url("../images/site/modernes-wohnhaus-mit-garagentor-1280w.7d9c23abfef5.webp")
  }
  .hero--dachfenster {
    background-image:url("../images/site/dachfenster-velux.5758aae3bf1d.webp")
  }
  .hero--reparatur {
    background-image:url("../images/site/service-schriftzug-mit-werkzeug-1280w.efe591f4cc78.webp")
  }
  .hero--sicherheit {
    background-image:url("../images/site/altes-torschloss-mit-vorhaengeschloss-1280w.5c9df3334337.webp")
  }
  .hero--referenzen {
    background-image:url("../images/site/innenjalousien-im-wohnzimmer-1280w.aabdeb9475cf.webp")
  }
  .hero--kontakt {
    background-image:url("../images/site/kontakt-und-kommunikation-1280w.2c49b8883077.webp")
  }
  .hero--legal {
    background-image:url("../images/site/rechtliche-informationen-paragrafen-1280w.2b776d1c9fe1.webp")
  }
}
@media(min-width:1200px) {
  .hero--home {
    background-image:url("../images/site/sonne-vor-blauem-himmel.c5331ccd70de.webp")
  }
  .hero--rollaeden {
    background-image:url("../images/site/reflexa-combo.9f8b9052a331.webp")
  }
  .hero--jalousien {
    background-image:url("../images/site/sonne-zwischen-wolken.41a649c30728.webp")
  }
  .hero--insektenschutz {
    background-image:url("../images/site/insektenschutz-muecke-stoppschild.9b72295fc26f.webp")
  }
  .hero--fenster {
    background-image:url("../images/site/modernes-wohnhaus-mit-garagentor.ba5b7f59860d.webp")
  }
  .hero--reparatur {
    background-image:url("../images/site/service-schriftzug-mit-werkzeug.44fcf48d0d86.webp")
  }
  .hero--sicherheit {
    background-image:url("../images/site/altes-torschloss-mit-vorhaengeschloss.fb6257fb9ce7.webp")
  }
  .hero--referenzen {
    background-image:url("../images/site/innenjalousien-im-wohnzimmer.eba8a9e05f5a.webp")
  }
  .hero--kontakt {
    background-image:url("../images/site/kontakt-und-kommunikation.48612e05e5a9.webp")
  }
  .hero--legal {
    background-image:url("../images/site/rechtliche-informationen-paragrafen.33daade72115.webp")
  }
}
main section {
  padding-block:4.8rem
}
.page-heading {
  padding-block:4.8rem 3.8rem;
  text-align:center
}
.page-heading h1 {
  margin:0;
  color:#333;
  font-size:clamp(2rem,3.3vw,2.75rem);
  font-weight:400;
  line-height:1.25
}
.brand-divider {
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  gap:1.1rem;
  margin:2.5rem auto 0;
  max-width:1020px
}
.brand-divider span {
  height:1px;
  background:var(--blau)
}
.brand-divider img {
  width:100px;
  height:auto
}
.section-heading {
  text-align:center;
  margin-bottom:3.8rem
}
.section-heading h2 {
  margin:0;
  color:#333;
  font-size:clamp(1.8rem,3vw,2.25rem);
  font-weight:400;
  line-height:1.3
}
.section-heading p {
  max-width:960px;
  margin:1rem auto 0
}
.intro {
  text-align:center
}
.intro h2,.content h2,.kontaktbereich h2 {
  color:#333;
  font-size:clamp(1.65rem,3vw,1.875rem);
  font-weight:400;
  line-height:1.4
}
.content h3,.kontaktbereich h3 {
  color:#333;
  font-size:1.5rem;
  font-weight:400;
  line-height:1.4
}
.content p,.content ul {
  max-width:850px
}
.content.center p,.content.center ul {
  margin-inline:auto
}
.lead {
  font:400 1.22rem/1.6 Bitter,Georgia,serif
}
.button,.button:visited {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.55rem;
  border:2px solid var(--blau);
  border-radius:var(--radius);
  padding:.78rem 1.15rem;
  background:var(--blau);
  color:#fff;
  font:400 1rem/1.4 Bitter,Georgia,serif
}
.button:hover,.button:active {
  background:var(--rot);
  border-color:var(--rot);
  color:#fff
}
.button-secondary,.button-secondary:visited {
  background:#fff;
  color:var(--blau)
}
.button img {
  width:1.15rem;
  filter:brightness(0) invert(1)
}
.button-secondary img {
  filter:none
}
.cards,.image-grid,.kontakt-grid,.map-grid {
  display:grid;
  gap:1.5rem
}
.cards {
  grid-template-columns:repeat(3,minmax(0,1fr));
  margin-top:2rem
}
.card {
  background:#fff;
  border:1px solid var(--linie);
  border-radius:var(--radius);
  overflow:hidden;
  box-shadow:var(--schatten)
}
.card-body {
  padding:1.25rem
}
.card h3 {
  margin-top:0;
  color:var(--blau)
}
.card img {
  width:100%;
  aspect-ratio:16/9;
  object-fit:cover
}
.split {
  display:grid;
  grid-template-columns:1.1fr .9fr;
  align-items:center;
  gap:3rem
}
.split>img {
  border-radius:var(--radius);
  box-shadow:var(--schatten)
}
.feature-list {
  columns:2;
  column-gap:2rem;
  padding-left:1.2rem
}
.feature-list li {
  break-inside:avoid;
  margin-bottom:.5rem
}
.cta {
  position:relative;
  min-height:34rem;
  display:grid;
  place-items:center;
  background-position:center;
  background-size:cover;
  color:#fff;
  text-align:center
}
.cta {
  background-image:url("../images/site/blick-durch-jalousie-720w.d745a4ed5328.webp")
}
@media(min-width:681px) {
  .cta {
    background-image:url("../images/site/blick-durch-jalousie-1280w.e2475f5334ef.webp")
  }
}
@media(min-width:1200px) {
  .cta {
    background-image:url("../images/site/blick-durch-jalousie.a1ee38f3fe1f.webp")
  }
}
.cta::before {
  content:"";
  position:absolute;
  inset:0;
  background:rgba(20,29,93,.78)
}
.cta .container {
  position:relative
}
.cta .container {
  max-width:520px
}
.cta h2 {
  font-size:clamp(1.8rem,3vw,2rem);
  margin-top:0
}
.cta p {
  font-weight:700
}
.cta .button,.cta .button:visited {
  border-color:var(--orange);
  background:var(--orange);
  color:#333
}
.cta .button::before {
  content:"\25b6";
  display:grid;
  place-items:center;
  width:1.1rem;
  height:1.1rem;
  border-radius:.12rem;
  background:var(--blau);
  color:#fff;
  font:700 .65rem/1 Arial,sans-serif
}
.cta .button:hover {
  border-color:#fff;
  background:#fff;
  color:var(--blau)
}
.image-grid {
  grid-template-columns:repeat(3,minmax(0,1fr))
}
.image-grid figure {
  margin:0;
  background:#fff;
  border:1px solid var(--linie);
  border-radius:var(--radius);
  overflow:hidden;
  box-shadow:0 7px 18px rgba(17,29,78,.1)
}
.image-grid button {
  display:block;
  width:100%;
  padding:0;
  border:0;
  background:#fff
}
.image-grid img {
  width:100%;
  height:240px;
  object-fit:cover;
  transition:transform .25s ease
}
.image-grid button:hover img {
  transform:scale(1.025)
}
.image-grid figcaption {
  padding:.65rem .8rem;
  color:#444
}
dialog {
  width:min(1050px,calc(100% - 4rem));
  height:calc(100vh - 4rem);
  max-height:calc(100vh - 4rem);
  overflow:hidden;
  border:0;
  border-radius:var(--radius);
  padding:0;
  background:#0d1238;
  color:#fff;
  box-shadow:0 22px 80px #000
}
dialog::backdrop {
  background:rgba(0,0,0,.8)
}
.lightbox-inner {
  position:relative;
  width:100%;
  height:100%;
  display:grid;
  grid-template-columns:3rem minmax(0,1fr) 3rem;
  grid-template-rows:minmax(0,1fr) auto;
  align-items:center;
  gap:1.2rem;
  padding:4rem 1.35rem 1.2rem;
  overflow:hidden
}
.lightbox-inner>[data-lightbox-image] {
  grid-column:2;
  grid-row:1;
  max-width:100%;
  max-height:100%;
  width:auto;
  height:auto;
  margin:auto;
  object-fit:contain
}
.lightbox-inner p {
  grid-column:2;
  grid-row:2;
  min-height:1.5rem;
  text-align:center;
  margin:0
}
.lightbox-close {
  position:absolute;
  top:.6rem;
  right:.6rem;
  width:2.3rem;
  height:2.3rem;
  border:0;
  border-radius:50%;
  background:#fff
}
.lightbox-close img {
  width:1rem;
  margin:auto
}
.lightbox-nav {
  z-index:2;
  width:2.6rem;
  height:3.4rem;
  border:1px solid rgba(255,255,255,.65);
  background:rgba(255,255,255,.12);
  color:#fff;
  font:400 2.5rem/1 Barlow,Arial,sans-serif
}
.lightbox-nav:hover {
  background:#fff;
  color:var(--blau)
}
.lightbox-prev {
  grid-column:1;
  grid-row:1
}
.lightbox-next {
  grid-column:3;
  grid-row:1
}
.contact-details {
  padding-top:2rem
}
.kontakt-grid {
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:1.25rem
}
.kontakt-card {
  min-height:19rem;
  display:grid;
  place-content:center;
  padding:2rem;
  text-align:center;
  color:#fff;
  background:var(--blau)
}
.kontakt-card:nth-child(2),.kontakt-card:nth-child(3) {
  background:var(--orange)
}
.kontakt-card h2 {
  margin:0;
  color:#fff;
  font-size:1.9rem;
  font-weight:400
}
.kontakt-card h2::after {
  display:block;
  width:2rem;
  height:2px;
  margin:1.3rem auto;
  content:"";
  background:var(--orange)
}
.kontakt-card:nth-child(2) h2::after,.kontakt-card:nth-child(3) h2::after {
  background:var(--blau)
}
.kontakt-card p {
  margin:0;
  font-size:1.08rem;
  line-height:1.55
}
.kontakt-card a {
  color:#fff
}
.kontakt-card a:hover {
  color:#fff3cf
}
.map-grid {
  grid-template-columns:1fr 1fr
}
.map-card {
  background:#fff
}
.map-card h3 {
  margin:0 0 1.2rem;
  color:#333;
  font-size:1.6rem;
  font-weight:400
}
.map-frame {
  position:relative;
  aspect-ratio:16/9;
  overflow:hidden;
  background:#e8ebdf
}
.map-image {
  width:100%;
  height:100%;
  object-fit:cover;
  transform:scale(1.08)
}
.osm-overlay {
  position:absolute;
  z-index:3;
  right:.5rem;
  bottom:.5rem;
  padding:.25rem .45rem;
  background:rgba(255,255,255,.92);
  color:var(--blau);
  font-size:.78rem;
  line-height:1.25;
  box-shadow:0 1px 5px rgba(0,0,0,.2)
}
.osm-overlay:hover {
  color:var(--rot)
}
.map-address {
  margin:1rem 0 .8rem
}
.route-link {
  display:inline-flex;
  align-items:center;
  gap:.55rem;
  padding:.7rem 1rem;
  border:2px solid var(--blau);
  color:var(--blau);
  font-weight:700
}
.route-link:hover {
  border-color:var(--rot);
  color:var(--rot)
}
.route-link img {
  width:1.25rem;
  height:1.25rem
}
.form-section {
  padding-top:5.5rem
}
.form-wrap {
  max-width:960px;
  margin:auto;
  padding:0;
  background:#fff
}
.form-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1rem
}
.field {
  display:flex;
  flex-direction:column;
  gap:.35rem
}
.field.full {
  grid-column:1/-1
}
label {
  font-weight:700
}
input,textarea {
  width:100%;
  border:1px solid #d3ad79;
  border-radius:0;
  padding:.72rem;
  background:#f0f1f5;
  color:#111
}
textarea {
  min-height:12rem;
  resize:vertical
}
.privacy-notice {
  display:block;
  max-width:none!important;
  margin:1rem 0 0;
  padding:.9rem 1rem;
  border:1px solid #dce2eb;
  border-radius:.65rem;
  background:#f4f7fb;
  color:#526078;
  font-size:.75rem;
  white-space:nowrap
}
.privacy-notice a {
  text-decoration:none!important
}
.honeypot {
  position:absolute!important;
  left:-10000px!important;
  width:1px!important;
  height:1px!important;
  overflow:hidden!important
}
.form-status {
  min-height:1.6rem;
  margin:1rem 0;
  font-weight:700
}
.form-status[data-kind=error] {
  color:#a40000
}
.form-status[data-kind=success] {
  color:#126419
}
.legal {
  max-width:920px;
  margin:auto
}
.legal h2 {
  margin-top:2.5rem
}
.legal h3 {
  margin-top:2rem;
  color:var(--blau-dunkel)
}
.legal h4 {
  font-size:1.08rem;
  margin-bottom:.2rem
}
.legal p {
  white-space:pre-line;
  overflow-wrap:anywhere
}
.legal--datenschutz p {
  white-space:normal
}
.legal a {
  overflow-wrap:anywhere
}
.bildnachweise {
  font-size:.78rem;
  line-height:1.75;
  white-space:nowrap
}
.site-footer {
  background:var(--blau);
  color:#fff;
  padding-top:4.2rem
}
.footer-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:0;
  padding-bottom:4rem
}
.footer-column {
  min-width:0;
  padding:0 2.5rem
}
.footer-column:first-child {
  padding-left:0
}
.footer-column+ .footer-column {
  border-left:1px solid var(--orange)
}
.site-footer h2 {
  margin:0 0 2rem;
  font-size:1.65rem;
  font-weight:400
}
.site-footer p {
  line-height:1.5
}
.site-footer a {
  color:#fff
}
.site-footer a:hover {
  color:#ffcf61
}
.footer-contact {
  display:grid;
  gap:.2rem
}
.footer-contact a {
  display:flex;
  align-items:center;
  gap:.45rem
}
.footer-contact img {
  width:1.1rem;
  height:1.1rem;
  filter:brightness(0) invert(1)
}
.footer-navigation {
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:.6rem
}
.footer-navigation h2 {
  margin-bottom:1.4rem
}
.footer-credit {
  padding:1rem;
  text-align:center;
  border-top:2px solid var(--orange);
  font-size:.8rem
}
.footer-credit a {
  display:inline-block
}
.to-top {
  position:fixed;
  z-index:25;
  right:1.5rem;
  bottom:1.5rem;
  display:grid;
  place-items:center;
  width:3.25rem;
  height:3.25rem;
  border:2px solid #fff;
  border-radius:0;
  background:var(--blau);
  color:#fff;
  box-shadow:0 3px 12px rgba(0,0,0,.35);
  opacity:0;
  pointer-events:none;
  transform:translateY(.5rem);
  transition:opacity .2s ease,transform .2s ease,background-color .2s ease,color .2s ease
}
.to-top[data-visible=true] {
  opacity:1;
  pointer-events:auto;
  transform:translateY(0)
}
.to-top:hover,.to-top:focus-visible {
  background:var(--orange);
  color:var(--blau-dunkel);
  box-shadow:0 5px 16px rgba(0,0,0,.45);
  transform:translateY(-2px)
}
.to-top img {
  display:block;
  width:1.5rem;
  height:1.5rem;
  margin:auto
}
.error-page {
  text-align:center;
  padding-block:6rem
}
.no-js-note {
  padding:.8rem;
  background:#fff3cd;
  border:1px solid #d9bd65
}
.original-content {
  text-align:center
}
.original-content>.container>p,.original-content>.container>h4 {
  max-width:none
}
.original-content h2 {
  margin:0 0 2.1rem
}
.original-content h3 {
  margin:1.5rem 0 2rem
}
.original-content h4 {
  margin:2.4rem 0 .8rem;
  color:#333;
  font-size:1.1rem;
  font-weight:400
}
.original-content p {
  margin:0 auto 1rem
}
.original-content .align-left {
  text-align:left
}
.home-intro .container {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  align-items:center;
  gap:4rem
}
.home-copy {
  max-width:850px;
  text-align:left
}
.anniversary-badge {
  position:relative;
  isolation:isolate;
  display:flex;
  width:250px;
  height:250px;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  justify-self:center;
  overflow:hidden;
  border:8px solid #fff;
  border-radius:50%;
  outline:6px solid var(--blau);
  background:linear-gradient(145deg,var(--blau) 0 68%,var(--orange) 68% 100%);
  box-shadow:0 12px 30px rgba(17,29,78,.24);
  color:#fff;
  font-family:Barlow,Arial,sans-serif;
  text-align:center
}
.anniversary-badge::before {
  content:"";
  position:absolute;
  z-index:-1;
  inset:10px;
  border:2px solid rgba(255,255,255,.72);
  border-radius:50%
}
.anniversary-badge__brand {
  margin-bottom:.2rem;
  color:var(--orange);
  font-size:.85rem;
  font-weight:700;
  letter-spacing:.16em
}
.anniversary-badge strong {
  font-size:5.2rem;
  line-height:.78
}
.anniversary-badge__years {
  margin-top:.45rem;
  font-size:1.55rem;
  font-weight:700;
  letter-spacing:.13em
}
.anniversary-badge__message {
  margin-top:.8rem;
  padding:.18rem .65rem;
  border-radius:999px;
  background:#fff;
  color:var(--blau);
  font-size:.9rem;
  font-weight:700;
  letter-spacing:.08em
}
.home-intro .anniversary-badge {
  justify-self:center;
  margin:0
}
.original-list {
  max-width:820px!important;
  margin:1.7rem auto 2.8rem;
  padding:0;
  list-style:none;
  text-align:left
}
.original-list li {
  position:relative;
  margin:.65rem 0;
  padding-left:1.8rem;
  break-inside:avoid
}
.original-list li::before {
  content:"\25b6";
  position:absolute;
  left:0;
  top:.25rem;
  display:grid;
  place-items:center;
  width:1.05rem;
  height:1.05rem;
  border-radius:.1rem;
  background:var(--blau);
  color:#fff;
  font:700 .58rem/1 Arial,sans-serif
}
.original-columns {
  display:grid;
  grid-template-columns:1fr 1fr;
  align-items:center;
  gap:4rem;
  margin:2rem 0 3rem
}
.original-columns>div {
  text-align:center
}
.original-columns .original-list {
  margin-block:0
}
.source-figure {
  margin:2.5rem auto;
  text-align:center
}
.source-figure--wide {
  width:100%
}
.source-figure--medium {
  max-width:520px
}
.source-figure--natural {
  max-width:783px
}
.source-image-button {
  display:block;
  width:100%;
  padding:0;
  border:0;
  background:transparent
}
.source-image-button img {
  width:100%;
  height:auto
}
.source-image-button:hover img {
  opacity:.92
}
.source-figure figcaption {
  margin-top:.7rem;
  color:#555;
  font-size:.9rem
}
.original-gallery {
  display:grid;
  align-items:start;
  gap:1.4rem;
  margin:3rem 0
}
.original-gallery--2 {
  grid-template-columns:repeat(2,minmax(0,1fr))
}
.original-gallery--3 {
  grid-template-columns:repeat(3,minmax(0,1fr))
}
.original-gallery .source-figure {
  width:100%;
  margin:0
}
.original-gallery .source-image-button img,.original-gallery .source-figure>img {
  width:100%;
  aspect-ratio:1/1;
  object-fit:contain
}
.equal-image-gallery .source-image-button img,.equal-image-gallery .source-figure>img {
  aspect-ratio:4/3;
  object-fit:cover
}
.compact-gallery .source-image-button img,.compact-gallery .source-figure>img {
  aspect-ratio:auto;
  max-height:280px
}
.section-divider {
  margin-block:5.5rem
}
.window-columns {
  margin-top:3.6rem
}
.window-columns>div:first-child {
  text-align:center
}
.fenster-content blockquote {
  margin:2.4rem 0 3rem;
  padding:.8rem 1.2rem;
  border-left:5px solid var(--blau);
  background:var(--orange);
  color:#fff;
  text-align:left;
  font-weight:700
}
.fenster-content .align-left {
  margin-top:3rem
}
.fenster-content .centered-line {
  text-align:center
}
@media(max-width:980px) {
  :root {
    --sticky-header-offset:13rem
  }
  .site-header {
    --mobile-header-chrome:13rem
  }
  .header-row {
    min-height:0;
    flex-wrap:wrap;
    justify-content:center;
    gap:.7rem;
    padding-block:1rem
  }
  .logo {
    width:100%;
    display:flex;
    justify-content:center
  }
  .menu-toggle {
    display:flex;
    width:100%
  }
  .menu-toggle[aria-expanded=true] {
    border-color:var(--blau-dunkel);
    background:var(--orange);
    color:var(--blau-dunkel)
  }
  #hauptnavigation {
    width:100%
  }
  .site-nav {
    width:100%;
    display:none
  }
  .site-nav[data-open=true] {
    display:block;
    max-height:calc(100dvh - var(--mobile-header-chrome));
    overflow-x:hidden;
    overflow-y:auto;
    overscroll-behavior:contain
  }
  .site-header[data-scrolled=true] {
    --mobile-header-chrome:10.5rem
  }
  .site-header[data-scrolled=true] .header-row {
    min-height:0;
    gap:.5rem;
    padding-block:.65rem
  }
  .site-header[data-scrolled=true] .logo img {
    width:min(220px,72vw)
  }
  .site-header[data-scrolled=true] .menu-toggle {
    padding:.5rem 1rem
  }
  .nav-list {
    display:block;
    padding:0
  }
  .nav-list>li {
    border-bottom:1px solid #dedede
  }
  .nav-list a {
    width:100%;
    padding:.85rem 1rem;
    font-size:1.08rem
  }
  .nav-parent {
    display:grid;
    grid-template-columns:1fr auto
  }
  .nav-parent>a {
    padding-right:1rem
  }
  .submenu-toggle {
    width:3rem;
    height:3rem;
    align-self:center;
    justify-content:center;
    margin-block:10px;
    margin-right:.5rem;
    padding:0;
    border:2px solid var(--blau);
    border-radius:.4rem;
    background:#f4f7fb;
    transition:border-color .2s ease,background-color .2s ease,color .2s ease
  }
  .submenu-toggle:hover,.submenu-toggle[aria-expanded=true] {
    border-color:var(--orange);
    background:#fff3e3;
    color:var(--blau-dunkel)
  }
  .submenu-toggle img {
    width:1rem
  }
  .submenu {
    position:static;
    box-shadow:none;
    border:0;
    margin:0;
    padding:0 0 .4rem 1rem
  }
  .submenu a {
    font-size:.98rem
  }
  .has-submenu:hover .submenu,.has-submenu:focus-within .submenu {
    display:none
  }
  .has-submenu[data-open=true] .submenu {
    display:block
  }
  .cards {
    grid-template-columns:1fr 1fr
  }
  .kontakt-grid {
    grid-template-columns:1fr 1fr
  }
  .image-grid {
    grid-template-columns:1fr 1fr
  }
  .footer-grid {
    grid-template-columns:1fr 1fr
  }
  .footer-column {
    padding:0 2rem
  }
  .footer-column:first-child {
    padding-left:0
  }
  .footer-column:nth-child(3) {
    grid-column:1/-1;
    margin-top:2.5rem;
    padding:2.5rem 0 0;
    border-top:1px solid var(--orange);
    border-left:0
  }
}
@media(max-width:680px) {
  .to-top {
    right:1rem;
    bottom:1rem
  }
  .topbar .container {
    flex-direction:column;
    justify-content:center;
    gap:.25rem;
    padding-block:.55rem
  }
  .header-row {
    justify-content:center
  }
  .logo img {
    width:min(270px,86vw)
  }
  .hero {
    min-height:22.75rem
  }
  .hero>.container {
    padding-block:3rem
  }
  .hero-kicker,.hero-lead {
    font-size:1.25rem
  }
  .page-heading {
    padding-block:3.2rem 2.5rem
  }
  .brand-divider {
    gap:.65rem;
    margin-top:2rem
  }
  .brand-divider img {
    width:90px
  }
  main section {
    padding-block:3.4rem
  }
  .section-heading {
    margin-bottom:2.5rem
  }
  .cards,.split,.map-grid,.kontakt-grid,.image-grid,.form-grid,.footer-grid,.original-columns,.original-gallery,.home-intro .container {
    grid-template-columns:1fr
  }
  .kontakt-card {
    min-height:15rem
  }
  .kontakt-card:nth-child(3) {
    background:var(--blau)
  }
  .kontakt-card:nth-child(4) {
    background:var(--orange)
  }
  .kontakt-card:nth-child(3) h2::after {
    background:var(--orange)
  }
  .kontakt-card:nth-child(4) h2::after {
    background:var(--blau)
  }
  .map-grid {
    gap:3rem
  }
  .map-card h3 {
    font-size:1.4rem
  }
  .osm-overlay {
    font-size:.7rem
  }
  .form-wrap {
    padding:0
  }
  .footer-grid {
    padding-bottom:2rem
  }
  .footer-column,.footer-column:first-child {
    padding:0 0 2rem
  }
  .footer-column+ .footer-column,.footer-column:nth-child(3) {
    grid-column:auto;
    margin:0;
    padding:2rem 0;
    border-top:1px solid var(--orange);
    border-left:0
  }
  .feature-list {
    columns:1
  }
  .field.full {
    grid-column:auto
  }
  .image-grid img {
    height:220px
  }
  .original-columns {
    gap:2rem
  }
  .original-content {
    text-align:left
  }
  .original-content h2,.original-content h3 {
    text-align:center
  }
  .original-gallery {
    gap:2rem
  }
  .section-divider {
    margin-block:4rem
  }
  .cta {
    min-height:28rem
  }
  .privacy-notice {
    white-space:normal
  }
  .home-intro .anniversary-badge {
    margin-inline:auto
  }
}
@media(max-width:680px) {
  .lightbox-inner {
    grid-template-columns:1fr;
    grid-template-rows:minmax(0,1fr) auto;
    padding:4rem 1rem 1rem
  }
  .lightbox-inner>[data-lightbox-image] {
    grid-column:1;
    grid-row:1;
    max-width:100%;
    max-height:100%
  }
  .lightbox-inner p {
    grid-column:1;
    grid-row:2
  }
  .lightbox-nav {
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    width:2.4rem;
    height:3.2rem
  }
  .lightbox-prev {
    left:1rem
  }
  .lightbox-next {
    right:1rem
  }
  .bildnachweise {
    font-size:.78rem;
    white-space:normal
  }
}
@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto
  }
  *,*::before,*::after {
    transition-duration:.01ms!important;
    animation-duration:.01ms!important;
    animation-iteration-count:1!important
  }
}