:root {
  --size-display: 60px;
  --size-h1: 58px;
  --size-h2: 46px;
  --size-h3: 30px;
  --section-space: 88px;
  --section-space-tight: 56px;
  --container: 1320px;
  --container-gutter: 48px;
  --card-padding: 28px;
  --header-h: 80px;
}

.page-hero-grid.is-text-only {
  grid-template-columns: minmax(0, 860px);
  justify-content: start;
}

.page-hero-grid.is-text-only .h1,
.page-hero-grid.is-text-only .lead {
  max-width: 100%;
}

.services-dropdown a {
  grid-template-columns: minmax(0, 1fr);
}

.services-dropdown a span {
  display: none;
}

.service-grid {
  grid-auto-rows: auto;
}

.service-card,
.service-card--wide {
  min-height: 270px;
  height: auto;
}

.service-card > a,
.service-card a {
  display: flex;
  min-height: 100%;
  padding: var(--card-padding);
}

.service-card .h3 {
  margin-top: 24px;
}

.service-card p {
  margin-top: 14px;
}

.service-card .card-footer {
  margin-top: auto;
  padding-top: 18px;
}

body[data-page="projects"] .page-hero {
  min-height: 0;
}

.portfolio-viewer[data-gallery-group="projects"] {
  width: min(1180px, calc(100vw - 40px));
  height: min(860px, calc(100svh - 40px));
}

.portfolio-viewer[data-gallery-group="projects"] .viewer-layout {
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: minmax(0, 1fr) auto;
}

.portfolio-viewer[data-gallery-group="projects"] .viewer-stage {
  min-height: 0;
}

.portfolio-viewer[data-gallery-group="projects"] .viewer-image-wrap img {
  max-width: calc(100% - 88px);
  max-height: calc(100% - 36px);
}

.portfolio-viewer[data-gallery-group="projects"] .viewer-detail {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 430px);
  align-items: center;
  gap: 22px;
  max-height: none;
  padding: 14px 20px;
  border-top: 1px solid var(--line);
  border-left: 0;
  overflow: hidden;
}

.portfolio-viewer[data-gallery-group="projects"] .viewer-description {
  max-width: 72ch;
  font-size: .94rem;
  line-height: 1.5;
}

.portfolio-viewer[data-gallery-group="projects"] .viewer-thumbs {
  display: flex;
  gap: 7px;
  width: 100%;
  margin: 0;
  overflow-x: auto;
  scrollbar-width: thin;
}

.portfolio-viewer[data-gallery-group="projects"] .viewer-thumb {
  flex: 0 0 80px;
  width: 80px;
  height: 58px;
  aspect-ratio: auto;
}

.credential-carousel {
  width: min(920px, 100%);
  margin-inline: auto;
}

.credential-carousel-stage {
  position: relative;
  min-height: clamp(430px, 58vw, 650px);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: var(--surface);
  overflow: hidden;
}

.credential-slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .28s var(--ease), visibility .28s var(--ease);
}

.credential-slide.is-active {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.credential-slide-open {
  width: 100%;
  height: 100%;
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  text-align: left;
  cursor: pointer;
}

.credential-slide-media {
  min-height: 0;
  display: grid;
  place-items: center;
  padding: clamp(20px, 4vw, 44px);
  background: var(--surface-2);
  overflow: hidden;
}

.credential-slide-media img {
  width: 100%;
  height: 100%;
  max-height: 500px;
  object-fit: contain;
  filter: drop-shadow(0 14px 26px rgba(15, 28, 50, .12));
}

.credential-slide-caption {
  display: grid;
  gap: 5px;
  padding: 18px 22px;
  border-top: 1px solid var(--line);
}

.credential-slide-caption span {
  color: var(--accent-soft);
  font-size: .72rem;
  font-weight: 850;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.credential-slide-caption strong {
  color: var(--text-strong);
  font-size: 1rem;
}

.credential-carousel-controls {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  margin-top: 18px;
}

.credential-carousel-controls > button {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  padding: 0;
  border: 1px solid var(--line-strong);
  border-radius: 50%;
  background: var(--surface);
  color: var(--text-strong);
  cursor: pointer;
}

.credential-carousel-dots {
  display: flex;
  align-items: center;
  gap: 8px;
}

.credential-carousel-dots button {
  width: 9px;
  height: 9px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: var(--line-strong);
  cursor: pointer;
}

.credential-carousel-dots button[aria-current="true"] {
  background: var(--accent);
  transform: scale(1.25);
}

.credential-carousel-counter {
  margin-top: 10px;
  color: var(--muted);
  font-size: .8rem;
  font-weight: 800;
  text-align: center;
}

.credential-extra {
  max-width: 920px;
  margin: 20px auto 0;
  color: var(--muted-strong);
  text-align: center;
}

.credential-viewer {
  width: min(1120px, calc(100vw - 40px));
  height: min(900px, calc(100svh - 40px));
}

.credential-viewer .viewer-layout {
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: minmax(0, 1fr) auto;
}

.credential-viewer .viewer-stage {
  min-height: 0;
}

.credential-viewer .viewer-image-wrap img {
  max-width: calc(100% - 90px);
  max-height: calc(100% - 36px);
  object-fit: contain;
}

.credential-viewer .viewer-detail {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(250px, 390px);
  align-items: center;
  gap: 20px;
  padding: 14px 20px;
  border-top: 1px solid var(--line);
  border-left: 0;
  overflow: hidden;
}

.credential-viewer .viewer-description {
  display: block;
  font-size: .92rem;
  line-height: 1.5;
}

.credential-viewer .viewer-thumbs {
  display: flex;
  gap: 7px;
  width: 100%;
  margin: 0;
  overflow-x: auto;
}

.credential-viewer .viewer-thumb {
  flex: 0 0 68px;
  width: 68px;
  height: 52px;
  aspect-ratio: auto;
}

.association-logo img[src$="vbi.png"] {
  max-width: 82%;
  max-height: 124px;
}

.contact-visual {
  min-height: 340px;
  padding: clamp(18px, 3vw, 34px);
}

.contact-visual img {
  width: 100%;
  height: 100%;
  max-height: 410px;
  object-fit: contain;
}

@media (max-width: 980px) {
  :root {
    --size-display: clamp(48px, 8vw, 60px);
    --size-h1: clamp(44px, 7vw, 56px);
    --size-h2: clamp(34px, 5.5vw, 44px);
    --size-h3: clamp(25px, 4vw, 30px);
    --section-space: 76px;
    --section-space-tight: 50px;
    --container-gutter: 36px;
    --card-padding: 24px;
  }

  .page-hero {
    padding-block: 72px;
  }

  .page-hero-grid.is-text-only {
    grid-template-columns: minmax(0, 1fr);
  }

  .portfolio-viewer[data-gallery-group="projects"] .viewer-detail,
  .credential-viewer .viewer-detail {
    grid-template-columns: minmax(0, 1fr);
    gap: 10px;
  }

  .portfolio-viewer[data-gallery-group="projects"] .viewer-thumbs,
  .credential-viewer .viewer-thumbs {
    width: 100%;
  }
}

@media (max-width: 680px) {
  :root {
    --size-display: clamp(42px, 12vw, 54px);
    --size-h1: clamp(38px, 10.5vw, 50px);
    --size-h2: clamp(30px, 8.5vw, 40px);
    --size-h3: clamp(23px, 6vw, 29px);
    --section-space: 62px;
    --section-space-tight: 42px;
    --container-gutter: 28px;
    --card-padding: 20px;
    --header-h: 72px;
  }

  .page-hero {
    padding-block: 54px 62px;
  }

  .page-hero .breadcrumb {
    margin-bottom: 22px;
  }

  .service-card,
  .service-card--wide {
    min-height: 0;
  }

  .service-card > a,
  .service-card a {
    min-height: 0;
    padding: 20px;
  }

  .service-card .h3 {
    margin-top: 12px;
  }

  .service-card p {
    margin-top: 10px;
    font-size: .95rem;
    line-height: 1.5;
  }

  .service-card .card-footer {
    min-height: 0;
    margin-top: 18px;
    padding-top: 14px;
    font-size: .88rem;
  }

  .portfolio-viewer[data-gallery-group="projects"],
  .credential-viewer {
    width: 100%;
    height: 100svh;
  }

  .portfolio-viewer[data-gallery-group="projects"] .viewer-layout,
  .credential-viewer .viewer-layout {
    grid-template-rows: minmax(0, 1fr) auto;
  }

  .portfolio-viewer[data-gallery-group="projects"] .viewer-image-wrap img,
  .credential-viewer .viewer-image-wrap img {
    max-width: calc(100% - 52px);
    max-height: calc(100% - 28px);
  }

  .portfolio-viewer[data-gallery-group="projects"] .viewer-detail,
  .credential-viewer .viewer-detail {
    max-height: 32svh;
    padding: 12px 14px 16px;
    overflow-y: auto;
  }

  .portfolio-viewer[data-gallery-group="projects"] .viewer-thumb {
    flex-basis: 64px;
    width: 64px;
    height: 48px;
  }

  .credential-viewer .viewer-thumb {
    flex-basis: 58px;
    width: 58px;
    height: 44px;
  }

  .credential-carousel-stage {
    min-height: 440px;
  }

  .credential-slide-media {
    padding: 18px;
  }

  .credential-slide-caption {
    padding: 14px 16px;
  }

  .contact-visual {
    min-height: 260px;
  }
}

@media (min-width: 1800px) {
  :root {
    --size-display: 64px;
    --size-h1: 60px;
    --size-h2: 48px;
    --size-h3: 31px;
    --size-body: 16px;
    --section-space: 92px;
    --section-space-tight: 58px;
    --container: 1480px;
    --container-gutter: 64px;
    --card-padding: 30px;
    --header-h: 82px;
  }

  .container,
  .site-header .container {
    width: min(calc(100% - var(--container-gutter)), var(--container));
    max-width: var(--container);
  }

  .brand img {
    max-width: 230px;
    max-height: 58px;
  }

  .hero {
    min-height: min(820px, calc(100svh - var(--header-h)));
  }

  .service-card,
  .service-card--wide {
    min-height: 280px;
  }
}
@media (min-width: 981px) {
  .service-grid > .service-card:nth-child(n+4):nth-child(-n+7) {
    grid-column: span 3;
  }
}

@media (min-width: 681px) and (max-width: 980px) {
  .service-grid > .service-card,
  .service-grid > .service-card:nth-child(n+4):nth-child(-n+7) {
    grid-column: span 6;
  }

  .service-grid > .service-card:nth-child(7) {
    grid-column: 4 / span 6;
  }
}

@media (max-width: 680px) {
  .service-grid > .service-card,
  .service-grid > .service-card:nth-child(n+4):nth-child(-n+7),
  .service-grid > .service-card:nth-child(7) {
    grid-column: 1 / -1;
  }
}
:root{--size-display:56px;--size-h1:54px;--size-h2:42px;--size-h3:28px;--section-space:80px;--section-space-tight:52px;--container-gutter:42px;--card-padding:26px}
.quality-preview-panel{position:relative;display:grid;grid-template-columns:minmax(0,1.35fr) minmax(260px,.65fr);align-items:end;gap:clamp(34px,7vw,110px);padding:clamp(36px,5vw,68px);border:1px solid var(--line);border-radius:var(--radius-lg);background:linear-gradient(135deg,color-mix(in srgb,var(--accent-soft) 6%,transparent),transparent 46%),var(--bg-elevated);overflow:hidden}.quality-preview-panel:before{content:"";position:absolute;top:0;left:clamp(36px,5vw,68px);width:72px;height:3px;background:var(--accent-soft)}.quality-preview-copy .h2{max-width:15ch}.quality-preview-copy .lead{max-width:66ch;margin-bottom:0}.quality-preview-action{display:grid;justify-items:start;gap:18px;padding-left:clamp(0px,2vw,28px)}.quality-preview-action>span{color:var(--muted);font-size:.78rem;font-weight:760;letter-spacing:.08em;text-transform:uppercase}.quality-preview-action .btn{min-width:190px;justify-content:center;background:var(--accent);border-color:var(--accent);color:#fff}.quality-preview-action .btn:hover{background:var(--accent-strong);border-color:var(--accent-strong)}
.credential-section-head{margin-bottom:clamp(28px,4vw,46px)}.credential-section-head .h2{margin:0}.owner-contact-layout{grid-template-columns:minmax(260px,.56fr) minmax(0,1.44fr);gap:clamp(38px,7vw,120px);align-items:center}.owner-contact-facts{width:100%;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.owner-contact-facts .fact{min-width:0;padding:22px 20px}.owner-contact-facts .fact strong{overflow-wrap:anywhere;font-size:clamp(.9rem,1vw,1.02rem)}
.project-privacy-note{max-width:72ch;margin:26px 0 0;padding-top:18px;border-top:1px solid var(--line);color:var(--muted);font-size:.82rem;line-height:1.55}
.portfolio-viewer[data-gallery-group="projects"]{width:min(1240px,calc(100vw - 36px));height:min(860px,calc(100svh - 36px))}.portfolio-viewer[data-gallery-group="projects"] .viewer-layout{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) auto;height:100%}.portfolio-viewer[data-gallery-group="projects"] .viewer-stage{min-height:0;background:var(--surface-2)}.portfolio-viewer[data-gallery-group="projects"] .viewer-image-wrap{padding:18px 70px 42px}.portfolio-viewer[data-gallery-group="projects"] .viewer-image-wrap img{width:auto;height:auto;max-width:100%;max-height:100%;object-fit:contain}.portfolio-viewer[data-gallery-group="projects"] .viewer-detail{min-height:98px;display:grid;grid-template-columns:minmax(260px,.9fr) minmax(0,1.1fr);gap:24px;align-items:center;padding:14px 18px;border-top:1px solid var(--line);overflow:hidden}.portfolio-viewer[data-gallery-group="projects"] .viewer-description{margin:0;font-size:.88rem;line-height:1.45}.portfolio-viewer[data-gallery-group="projects"] .viewer-thumbs{display:flex;justify-content:flex-end;gap:7px;margin:0;overflow-x:auto;overscroll-behavior-inline:contain}.portfolio-viewer[data-gallery-group="projects"] .viewer-thumb{flex:0 0 74px;width:74px;height:50px;border-radius:8px;overflow:hidden}.portfolio-viewer[data-gallery-group="projects"] .viewer-thumb img{width:100%;height:100%;object-fit:cover}
@media(max-width:980px){:root{--size-display:clamp(46px,7.5vw,56px);--size-h1:clamp(42px,6.7vw,52px);--size-h2:clamp(32px,5vw,40px);--size-h3:clamp(24px,3.7vw,28px);--section-space:70px;--section-space-tight:46px;--container-gutter:32px}.quality-preview-panel{grid-template-columns:1fr;align-items:start}.quality-preview-action{padding-left:0}.owner-contact-layout{grid-template-columns:1fr;gap:28px}.owner-contact-facts{grid-template-columns:repeat(3,minmax(0,1fr))}.portfolio-viewer[data-gallery-group="projects"] .viewer-detail{grid-template-columns:1fr;gap:10px}.portfolio-viewer[data-gallery-group="projects"] .viewer-thumbs{justify-content:flex-start}}
@media(max-width:680px){:root{--size-display:clamp(38px,11vw,48px);--size-h1:clamp(36px,10vw,46px);--size-h2:clamp(28px,8vw,37px);--size-h3:clamp(22px,5.7vw,27px);--section-space:56px;--section-space-tight:38px;--container-gutter:22px;--card-padding:16px}.service-grid{gap:12px}.service-card>a,.service-card a{padding:16px 17px}.service-card .h3{margin-top:4px;font-size:clamp(1.28rem,6vw,1.55rem);line-height:1.08}.service-card p{margin-top:8px;font-size:.88rem;line-height:1.42}.service-card .card-footer{margin-top:13px;padding-top:10px;font-size:.78rem}.quality-preview-panel{padding:30px 22px}.quality-preview-panel:before{left:22px}.quality-preview-action .btn{width:100%;min-width:0}.owner-contact-facts{grid-template-columns:1fr;gap:8px}.owner-contact-facts .fact{padding:16px}.portfolio-viewer[data-gallery-group="projects"]{width:100%;height:100svh}.portfolio-viewer[data-gallery-group="projects"] .viewer-image-wrap{padding:10px 48px 34px}.portfolio-viewer[data-gallery-group="projects"] .viewer-detail{max-height:29svh;min-height:0;padding:10px 12px 14px;overflow-y:auto}.portfolio-viewer[data-gallery-group="projects"] .viewer-description{font-size:.82rem}.portfolio-viewer[data-gallery-group="projects"] .viewer-thumb{flex-basis:58px;width:58px;height:40px}.project-privacy-note{margin-top:20px;padding-top:14px;font-size:.76rem}}
@media(min-width:1800px){:root{--size-display:60px;--size-h1:58px;--size-h2:44px;--size-h3:29px;--section-space:84px;--section-space-tight:54px;--container-gutter:52px}}
.quality-preview-action{align-self:center;justify-items:start;gap:0}.quality-preview-action .btn{min-width:220px;min-height:52px}
body[data-page="services"] .service-grid{grid-auto-rows:auto;align-items:stretch}
body[data-page="services"] .service-card,body[data-page="services"] .service-card--wide{height:auto;min-height:270px}
body[data-page="services"] .service-card>a{height:100%;min-height:0}
body[data-page="services"] .service-card--photovoltaik{border-color:var(--line)}
.credential-viewer{width:min(1180px,calc(100vw - 28px));height:min(900px,calc(100svh - 28px))}
.credential-viewer .viewer-shell{height:100%;min-height:0}
.credential-viewer .viewer-layout{height:100%;min-height:0;display:grid!important;grid-template-columns:1fr!important;grid-template-rows:minmax(0,1fr) auto!important}
.credential-viewer .viewer-stage{min-width:0!important;min-height:0!important;padding:18px 76px 14px!important;overflow:hidden!important;background:#e9edf1}
.credential-viewer .viewer-image-wrap{width:100%!important;height:100%!important;min-width:0!important;min-height:0!important;display:flex!important;align-items:center!important;justify-content:center!important;padding:0!important;overflow:hidden!important}
.credential-viewer .viewer-image-wrap img{display:block!important;width:auto!important;height:auto!important;max-width:100%!important;max-height:100%!important;object-fit:contain!important;object-position:center!important;margin:auto!important;background:#fff;box-shadow:0 16px 48px rgba(18,30,50,.16)}
.credential-viewer .viewer-detail{min-height:82px;max-height:118px;display:grid!important;grid-template-columns:minmax(240px,.75fr) minmax(0,1.25fr)!important;gap:20px;align-items:center;padding:10px 18px!important;border-left:0!important;border-top:1px solid var(--line)!important;overflow:hidden!important;background:var(--surface)}
.credential-viewer .viewer-description{display:block!important;margin:0!important;color:var(--muted-strong);font-size:.82rem!important;line-height:1.4}
.credential-viewer .viewer-thumbs{width:100%;display:flex!important;justify-content:flex-end;gap:7px;margin:0!important;overflow-x:auto;align-content:initial!important;grid-template-columns:none!important}
.credential-viewer .viewer-thumb{flex:0 0 58px;width:58px;height:42px;aspect-ratio:auto;border-radius:7px}
.credential-viewer .viewer-thumb img{width:100%;height:100%;object-fit:contain;background:#fff}
.credential-viewer .viewer-image-wrap.is-zoomed{display:block!important;overflow:auto!important;text-align:center!important}
.credential-viewer .viewer-image-wrap.is-zoomed img{width:auto!important;height:auto!important;max-width:none!important;max-height:none!important;min-width:150%!important;margin:0 auto!important;object-fit:initial!important}
@media(min-width:981px){body[data-page="services"] .service-grid>.service-card:nth-child(-n+3){grid-column:span 4}body[data-page="services"] .service-grid>.service-card:nth-child(n+4){grid-column:span 3}}
@media(max-width:980px){.credential-viewer .viewer-stage{padding:12px 56px 10px!important}.credential-viewer .viewer-detail{max-height:132px;grid-template-columns:1fr!important;gap:8px}.credential-viewer .viewer-thumbs{justify-content:flex-start}.credential-viewer .viewer-description{font-size:.78rem!important}}
@media(max-width:680px){body[data-page="services"] .service-card,body[data-page="services"] .service-card--wide{min-height:210px}.credential-viewer{width:100%;height:100svh;border-radius:0}.credential-viewer .viewer-topbar{min-height:62px}.credential-viewer .viewer-stage{padding:8px 44px!important}.credential-viewer .viewer-detail{min-height:86px;max-height:118px;padding:8px 10px!important}.credential-viewer .viewer-description{display:none!important}.credential-viewer .viewer-thumb{flex-basis:48px;width:48px;height:36px}}

/* Project viewer zoom */
.portfolio-viewer[data-gallery-group="projects"] .viewer-image-wrap{scroll-behavior:smooth}
.portfolio-viewer[data-gallery-group="projects"] .viewer-image-wrap.is-zoomed{place-items:start;cursor:zoom-out}
.portfolio-viewer[data-gallery-group="projects"] .viewer-image-wrap.is-zoomed img{width:160%!important;max-width:none!important;max-height:none!important;height:auto!important;object-fit:contain}
@media(max-width:680px){.portfolio-viewer[data-gallery-group="projects"] .viewer-image-wrap.is-zoomed img{width:190%!important}}