:root{--red:#a71920;--red-bright:#c80d15;--black:#101214;--grey:#6f7478;--light:#f4f4f4;--line:#e4e5e6;--white:#fff;--max:1180px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Arial,Helvetica,sans-serif;color:var(--black);background:#fff;line-height:1.55}body.menu-open{overflow:hidden}img{display:block;max-width:100%}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}.container{width:min(var(--max),calc(100% - 40px));margin:auto}.skip-link{position:absolute;left:-9999px}.skip-link:focus{left:16px;top:16px;background:#fff;padding:10px;z-index:9999}
.site-header{position:sticky;top:0;z-index:1000;background:rgba(255,255,255,.97);border-bottom:1px solid rgba(0,0,0,.08);backdrop-filter:blur(12px)}.header-inner{height:82px;display:flex;align-items:center;justify-content:space-between}.brand{width:min(390px,44vw)}.brand img{width:100%}.desktop-nav{display:flex;align-items:center;gap:28px;font-weight:700;font-size:.94rem}.desktop-nav a:not(.phone-link){position:relative}.desktop-nav a:not(.phone-link):after{content:"";position:absolute;left:0;right:100%;bottom:-7px;height:2px;background:var(--red);transition:.25s}.desktop-nav a:hover:after{right:0}.phone-link{background:var(--black);color:#fff;padding:11px 15px}
.menu-button{display:none;border:0;background:#fff;padding:9px;cursor:pointer}.menu-button span{display:block;width:28px;height:3px;background:#111;margin:5px 0}
.mobile-menu{position:fixed;top:0;right:0;width:min(88vw,390px);height:100dvh;background:#fff;color:#111;z-index:2500;transform:translateX(100%);transition:transform .28s ease;padding:22px 24px 34px;display:flex;flex-direction:column;box-shadow:-16px 0 40px rgba(0,0,0,.18)}.mobile-menu.open{transform:none}.mobile-menu-head{display:flex;align-items:center;justify-content:space-between;padding-bottom:26px;border-bottom:1px solid var(--line);background:#fff}.menu-close{border:0;background:#fff;color:#111;font-size:2.4rem;line-height:1;cursor:pointer}.mobile-menu>a{display:block;padding:18px 2px;border-bottom:1px solid var(--line);font-weight:800;font-size:1.15rem;background:#fff;color:#111}.mobile-menu .mobile-call{margin-top:auto;border:0;background:var(--red);color:#fff;text-align:center;padding:15px}.menu-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.52);z-index:2400}
.hero{min-height:720px;position:relative;display:flex;align-items:center;color:#fff;background:url('../bilder/hero.webp') center/cover no-repeat}.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,6,7,.92) 0%,rgba(5,6,7,.74) 52%,rgba(5,6,7,.14) 100%)}.hero-inner{position:relative;padding:90px 0}.eyebrow{margin:0 0 13px;color:#ff676d;text-transform:uppercase;letter-spacing:.21em;font-weight:900;font-size:.77rem}.eyebrow.dark{color:var(--red)}.hero h1{font-size:clamp(3.2rem,7.3vw,6.5rem);line-height:.95;letter-spacing:-.05em;margin:0 0 26px}.hero h1 span{color:#ef343b}.hero-inner>p:not(.eyebrow){max-width:650px;font-size:1.18rem;color:#e4e5e6}.hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:34px}.button{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 24px;border:0;font-weight:800;cursor:pointer;transition:.2s}.button:hover{transform:translateY(-2px)}.button-red{background:var(--red-bright);color:#fff}.button-clear{border:1px solid rgba(255,255,255,.7);color:#fff;background:rgba(0,0,0,.12)}.button-white{background:#fff;color:#111}
.quick-strip{background:#111;color:#fff}.quick-grid{min-height:72px;display:grid;grid-template-columns:repeat(3,1fr);align-items:center;text-align:center;font-size:.9rem;font-weight:800}.quick-grid span+span{border-left:1px solid #3a3a3a}
.section{padding:105px 0}.projects-section{background:var(--light)}.section-title{display:grid;grid-template-columns:1.2fr .8fr;gap:70px;align-items:end;margin-bottom:48px}.section-title h2,.contact-section h2,.area-section h2{font-size:clamp(2.3rem,4.8vw,4.4rem);line-height:1.03;letter-spacing:-.04em;margin:0}.section-title>p{color:var(--grey);margin:0}
.services{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.services article{border:1px solid var(--line);background:#fff;min-height:210px;padding:28px;display:flex;flex-direction:column;justify-content:space-between}.services span{color:var(--red);font-weight:900}.services h3{font-size:1.28rem;margin:0}
.quote-section{background:var(--black);color:#fff;padding:95px 0}.quote-grid{display:grid;grid-template-columns:.3fr 1.7fr;gap:50px}.quote-grid blockquote{font-size:clamp(2.6rem,5vw,5rem);line-height:1.02;letter-spacing:-.05em;margin:0}
.projects-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.project-card{padding:0;border:0;background:#fff;text-align:left;cursor:pointer;overflow:hidden}.project-card img{width:100%;aspect-ratio:4/3;object-fit:cover;transition:.35s}.project-card span{display:block;padding:16px 18px 20px;font-weight:800}.project-card:hover img{transform:scale(1.03)}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}.steps article{background:#fff;padding:30px}.steps b{font-size:2.5rem;color:#d4d5d6}.steps h3{margin:42px 0 8px}.steps p{margin:0;color:var(--grey)}
.area-section{background:var(--red);color:#fff;padding:78px 0}.area-inner{display:flex;align-items:center;justify-content:space-between;gap:40px}.area-section h2{max-width:800px}
.contact-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:80px}.contact-list{display:grid;gap:18px;margin-top:34px}.contact-list a,.contact-list div{border-left:3px solid var(--red);padding-left:15px}.contact-list small,.contact-list strong{display:block}.contact-list small{color:var(--grey)}.contact-form{background:#f4f4f4;padding:34px;display:grid;gap:16px}.two-fields{display:grid;grid-template-columns:1fr 1fr;gap:16px}.contact-form label{display:grid;gap:7px;font-weight:800;font-size:.9rem}.contact-form input,.contact-form select,.contact-form textarea{width:100%;padding:13px;border:1px solid #cfd1d3;background:#fff;border-radius:0}.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus{outline:2px solid rgba(167,25,32,.22);border-color:var(--red)}.privacy-row{display:flex!important;grid-template-columns:auto 1fr!important;align-items:flex-start}.privacy-row input{width:auto;margin-top:5px}.privacy-row a{text-decoration:underline;color:var(--red)}.honeypot{position:absolute;left:-10000px}
.site-footer{background:#0b0c0e;color:#fff;padding:54px 0 24px}.footer-main{display:grid;grid-template-columns:1fr 1fr .7fr;gap:40px;align-items:start}.footer-main img{max-width:320px;filter:brightness(0) invert(1)}.footer-main div{display:grid;gap:5px}.footer-main span{color:#b7bbbe}.footer-bottom{border-top:1px solid #2f3235;margin-top:34px;padding-top:22px;display:flex;justify-content:space-between;color:#9ea3a6;font-size:.88rem}.footer-bottom span:last-child{display:flex;gap:20px}
.lightbox{position:fixed;inset:0;background:rgba(0,0,0,.94);z-index:3000;display:none;place-items:center;padding:34px}.lightbox.open{display:grid}.lightbox img{max-height:80vh;max-width:min(1200px,92vw)}.lightbox p{color:#fff;text-align:center;margin:10px 0 0}.lightbox-count{color:#aeb2b5;font-size:.85rem}.lightbox-close{position:absolute;right:24px;top:15px;border:0;background:none;color:#fff;font-size:3rem;cursor:pointer}
.legal{padding:75px 0;max-width:900px}.legal h1{font-size:3rem;line-height:1.05}.legal h2{margin-top:32px}.legal a{color:var(--red);text-decoration:underline}.legal-note{border-left:4px solid var(--red);background:#f4f4f4;padding:16px}.status-page{min-height:80vh;display:grid;place-items:center;text-align:center;padding:40px}.status-card{max-width:650px}.status-card img{max-width:420px;margin:0 auto 32px}
.reveal{opacity:0;transform:translateY(18px);transition:.55s ease}.reveal.visible{opacity:1;transform:none}
@media(max-width:980px){.desktop-nav{display:none}.menu-button{display:block}.brand{width:330px}.section-title,.quote-grid,.contact-grid{grid-template-columns:1fr}.services{grid-template-columns:repeat(2,1fr)}.projects-grid{grid-template-columns:repeat(2,1fr)}.steps{grid-template-columns:repeat(2,1fr)}.footer-main{grid-template-columns:1fr 1fr}.footer-main img{grid-column:1/-1}}
@media(max-width:650px){.container{width:min(100% - 26px,var(--max))}.header-inner{height:72px}.brand{width:245px}.hero{min-height:680px;background-position:62% center}.hero-inner{padding:72px 0}.hero h1{font-size:3.2rem}.quick-grid{grid-template-columns:1fr;text-align:left;padding:15px 0}.quick-grid span{padding:5px 0}.quick-grid span+span{border-left:0}.section{padding:74px 0}.section-title{gap:18px}.services,.projects-grid,.steps,.two-fields{grid-template-columns:1fr}.quote-section{padding:72px 0}.area-inner{flex-direction:column;align-items:flex-start}.contact-form{padding:22px}.footer-main,.footer-bottom{display:grid;grid-template-columns:1fr}.footer-bottom span:last-child{margin-top:7px}}


/* Version 1.1 – Premium-Feinschliff */
.site-header{transition:box-shadow .25s ease,background-color .25s ease}
.site-header.scrolled{box-shadow:0 10px 30px rgba(0,0,0,.08);background:#fff}
.header-inner{transition:height .25s ease}
.site-header.scrolled .header-inner{height:72px}
.brand img{transition:transform .25s ease}
.brand:hover img{transform:translateY(-1px)}

.hero{min-height:calc(100vh - 82px);max-height:900px}
.hero-inner{min-height:650px;display:flex;flex-direction:column;justify-content:center}
.hero-inner>p:not(.eyebrow){line-height:1.75}
.scroll-cue{position:absolute;left:0;bottom:28px;color:#fff;display:flex;align-items:center;gap:12px;font-size:.76rem;font-weight:800;text-transform:uppercase;letter-spacing:.14em;opacity:.82}
.scroll-cue i{display:block;width:34px;height:1px;background:#fff;position:relative}
.scroll-cue i:after{content:"";position:absolute;right:0;top:-3px;width:7px;height:7px;border-right:1px solid #fff;border-bottom:1px solid #fff;transform:rotate(45deg)}
.scroll-cue:hover{opacity:1}

.quick-strip{border-top:1px solid rgba(255,255,255,.08)}
.quick-grid span{letter-spacing:.02em}

.section-title{position:relative}
.section-title:after{content:"";position:absolute;left:0;bottom:-23px;width:46px;height:3px;background:var(--red)}
.services article{transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease;position:relative;overflow:hidden}
.services article:after{content:"";position:absolute;left:0;bottom:0;width:0;height:4px;background:var(--red);transition:width .25s ease}
.services article:hover{transform:translateY(-5px);border-color:#d7d8da;box-shadow:0 18px 40px rgba(0,0,0,.07)}
.services article:hover:after{width:100%}

.project-card{position:relative;box-shadow:0 0 0 1px rgba(0,0,0,.035);transition:transform .28s ease,box-shadow .28s ease}
.project-card:after{content:"Öffnen";position:absolute;right:16px;top:16px;background:rgba(255,255,255,.94);color:#111;padding:7px 10px;font-size:.72rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase;opacity:0;transform:translateY(-5px);transition:.25s}
.project-card:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(0,0,0,.1)}
.project-card:hover:after{opacity:1;transform:none}
.project-card span{min-height:62px;display:flex;align-items:center}

.steps article{transition:background-color .25s ease}
.steps article:hover{background:#fafafa}
.steps b{font-variant-numeric:tabular-nums}

.contact-section{position:relative}
.contact-form{box-shadow:0 24px 60px rgba(0,0,0,.07)}
.contact-form .button{justify-self:start}
.contact-list strong{font-size:1.05rem}

.footer-main a:hover,.footer-bottom a:hover{color:#fff}
.footer-main img{opacity:.96}

.mobile-contact-bar{display:none}

@media(max-width:980px){
  .site-header.scrolled .header-inner{height:72px}
  .mobile-menu{visibility:hidden}
  .mobile-menu.open{visibility:visible}
  .mobile-menu>a{min-height:60px;display:flex;align-items:center}
  .mobile-menu-head strong{font-size:1.1rem}
}

@media(max-width:650px){
  body{padding-bottom:58px}
  .hero{min-height:calc(100svh - 72px);max-height:none}
  .hero-inner{min-height:600px}
  .scroll-cue{bottom:18px}
  .section-title:after{bottom:-17px}
  .project-card:after{display:none}
  .project-card span{min-height:auto}
  .mobile-contact-bar{position:fixed;left:0;right:0;bottom:0;height:58px;display:grid;grid-template-columns:1fr 1fr;background:#fff;border-top:1px solid #ddd;z-index:1800}
  .mobile-contact-bar a{display:flex;align-items:center;justify-content:center;font-weight:900;font-size:.9rem}
  .mobile-contact-bar a:first-child{background:var(--red);color:#fff}
  .mobile-contact-bar a:last-child{color:#111}
  .lightbox{padding:18px 12px 76px}
}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  .reveal{opacity:1;transform:none}
}


/* Version 1.1.1 – Hero-Feinschliff */
.hero-inner{max-width:900px}
.hero-inner>.eyebrow{position:relative;padding-left:54px}
.hero-inner>.eyebrow:before{content:"";position:absolute;left:0;top:50%;width:38px;height:2px;background:var(--red-bright);transform:translateY(-50%)}
.hero h1{max-width:880px;text-wrap:balance}
.hero-inner>p:not(.eyebrow){max-width:620px;margin-bottom:0}
.hero-note{display:flex;flex-wrap:wrap;gap:10px 22px;margin-top:24px;color:#fff;font-size:.82rem;font-weight:700}
.hero-note span{display:flex;align-items:center;gap:9px}
.hero-note span:before{content:"";width:7px;height:7px;border-radius:50%;background:var(--red-bright);box-shadow:0 0 0 4px rgba(200,13,21,.18)}
.hero-actions{margin-top:28px}
.hero .button{min-width:174px}
.hero-shade{background:
linear-gradient(90deg,rgba(5,6,7,.94) 0%,rgba(5,6,7,.78) 47%,rgba(5,6,7,.24) 72%,rgba(5,6,7,.08) 100%),
linear-gradient(0deg,rgba(5,6,7,.20),rgba(5,6,7,.02) 45%)}
.scroll-cue{transition:opacity .2s ease,transform .2s ease}
.scroll-cue:hover{transform:translateY(3px)}

@media(max-width:650px){
  .hero-inner>.eyebrow{padding-left:42px}
  .hero-inner>.eyebrow:before{width:29px}
  .hero h1{font-size:clamp(2.85rem,14vw,3.55rem)}
  .hero-note{display:grid;gap:9px;margin-top:20px;font-size:.78rem}
  .hero-actions{display:grid;grid-template-columns:1fr;max-width:320px}
  .hero .button{width:100%}
}


/* Version 1.1.2 – Projektstruktur */
.project-showcase{display:grid;gap:86px}
.project-group{display:grid;grid-template-columns:minmax(220px,.42fr) minmax(0,1.58fr);gap:44px;align-items:start;padding-top:42px;border-top:1px solid #d9dbdd}
.project-group:first-child{padding-top:0;border-top:0}
.project-group-reverse{grid-template-columns:minmax(0,1.58fr) minmax(220px,.42fr)}
.project-group-reverse .project-copy{order:2}
.project-group-reverse .project-gallery{order:1}
.project-copy{position:sticky;top:110px;padding:4px 0}
.project-index{margin:0 0 15px;color:var(--red);font-size:.74rem;font-weight:900;letter-spacing:.18em;text-transform:uppercase}
.project-copy h3{font-size:clamp(1.9rem,3.1vw,3.2rem);line-height:1.04;letter-spacing:-.035em;margin:0 0 26px}
.project-copy ul{list-style:none;padding:0;margin:0;display:grid;gap:9px;color:var(--grey)}
.project-copy li{position:relative;padding-left:18px}
.project-copy li:before{content:"";position:absolute;left:0;top:.72em;width:8px;height:2px;background:var(--red)}
.project-gallery{display:grid;gap:14px}
.project-gallery-five{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:auto}
.project-gallery-five .project-card-main{grid-column:1/-1}
.project-gallery-three{grid-template-columns:repeat(2,minmax(0,1fr))}
.project-gallery-three .project-card-main{grid-row:span 2}
.project-gallery-three .project-card-main img{height:100%;min-height:100%;aspect-ratio:auto}
.project-group .project-card{box-shadow:none;border:1px solid rgba(0,0,0,.06)}
.project-group .project-card span{padding:13px 15px 16px;font-size:.92rem;min-height:54px}
.project-group .project-card-main span{font-size:1rem}
.project-group .project-card:hover{box-shadow:0 16px 34px rgba(0,0,0,.10)}
.project-group .project-card img{aspect-ratio:4/3}
.project-group .project-card-main img{aspect-ratio:16/9}
.project-group .project-card:after{content:"Ansehen"}

@media(max-width:980px){
  .project-showcase{gap:68px}
  .project-group,.project-group-reverse{grid-template-columns:1fr;gap:26px}
  .project-group-reverse .project-copy,.project-group-reverse .project-gallery{order:initial}
  .project-copy{position:static}
  .project-copy h3{margin-bottom:18px}
  .project-copy ul{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px 18px}
}

@media(max-width:650px){
  .project-showcase{gap:58px}
  .project-group{padding-top:34px}
  .project-copy ul{grid-template-columns:1fr}
  .project-gallery-five,.project-gallery-three{grid-template-columns:1fr}
  .project-gallery-five .project-card-main,.project-gallery-three .project-card-main{grid-column:auto;grid-row:auto}
  .project-gallery-three .project-card-main img{height:auto;aspect-ratio:4/3}
  .project-group .project-card-main img{aspect-ratio:4/3}
  .project-group .project-card span{min-height:auto}
}


/* Version 1.1.3 – ruhiger Projektbereich */
.project-index{display:none}
.projects-section .section-title{grid-template-columns:1fr}
.projects-section .section-title>p{display:none}
.project-group .project-card span{display:none}
.project-group .project-card{background:transparent;border:0;box-shadow:none;line-height:0}
.project-group .project-card img{display:block;width:100%;height:auto}
.project-group .project-card:hover{box-shadow:none;transform:translateY(-3px)}
.project-group .project-card:after{
  content:"";
  width:34px;
  height:34px;
  padding:0;
  border-radius:50%;
  background:rgba(255,255,255,.94);
  opacity:0;
  transform:translateY(-4px);
  box-shadow:0 8px 22px rgba(0,0,0,.14);
}
.project-group .project-card:before{
  content:"";
  position:absolute;
  right:27px;
  top:27px;
  width:10px;
  height:10px;
  z-index:2;
  border-right:2px solid #111;
  border-top:2px solid #111;
  opacity:0;
  transform:translate(-2px,2px);
  transition:.25s;
  pointer-events:none;
}
.project-group .project-card:hover:after,
.project-group .project-card:hover:before{
  opacity:1;
}
.project-copy{padding-top:0}
.project-copy h3{margin-top:0}
.project-showcase{gap:78px}
.project-group{gap:40px}
.project-gallery{gap:12px}

@media(max-width:980px){
  .projects-section .section-title{margin-bottom:40px}
  .project-showcase{gap:62px}
}

@media(max-width:650px){
  .project-showcase{gap:52px}
  .project-group{gap:22px;padding-top:30px}
  .project-gallery{gap:10px}
  .project-group .project-card:after,
  .project-group .project-card:before{display:none}
}


/* Version 1.1.4 – projektweise Mosaikdarstellung */
.projects-section .projects-title{
  grid-template-columns:1fr;
  margin-bottom:52px;
}
.projects-section .projects-title::after{
  bottom:-22px;
}
.project-showcase{
  display:grid;
  gap:76px;
}
.project-block{
  padding-top:34px;
  border-top:1px solid #d9dbdd;
}
.project-block:first-child{
  padding-top:0;
  border-top:0;
}
.project-heading{
  margin-bottom:20px;
}
.project-heading h3{
  margin:0 0 5px;
  font-size:clamp(1.55rem,2.5vw,2.3rem);
  line-height:1.1;
  letter-spacing:-.025em;
}
.project-heading p{
  margin:0;
  color:var(--grey);
  font-size:.98rem;
}
.project-mosaic{
  display:grid;
  gap:12px;
}
.project-mosaic .project-card{
  position:relative;
  overflow:hidden;
  border:0;
  background:transparent;
  box-shadow:none;
  line-height:0;
  min-height:0;
  padding:0;
}
.project-mosaic .project-card span{
  display:none!important;
}
.project-mosaic .project-card img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .35s ease,filter .35s ease;
}
.project-mosaic .project-card:hover{
  transform:none;
  box-shadow:none;
}
.project-mosaic .project-card:hover img{
  transform:scale(1.018);
  filter:brightness(.97);
}
.project-mosaic .project-card::before{
  content:"";
  position:absolute;
  right:16px;
  top:16px;
  width:34px;
  height:34px;
  border-radius:50%;
  background:rgba(255,255,255,.92);
  opacity:0;
  transform:translateY(-4px);
  transition:.22s ease;
  z-index:2;
  box-shadow:0 8px 20px rgba(0,0,0,.14);
}
.project-mosaic .project-card::after{
  content:"";
  position:absolute;
  right:27px;
  top:27px;
  width:10px;
  height:10px;
  border-top:2px solid #111;
  border-right:2px solid #111;
  opacity:0;
  transform:translate(-2px,2px);
  transition:.22s ease;
  z-index:3;
}
.project-mosaic .project-card:hover::before,
.project-mosaic .project-card:hover::after{
  opacity:1;
  transform:none;
}

/* Bad */
.project-mosaic-bath{
  grid-template-columns:1.25fr .42fr .42fr;
  grid-template-rows:210px 210px;
}
.project-mosaic-bath .project-card-hero{
  grid-column:1;
  grid-row:1 / span 2;
}
.project-mosaic-bath .project-card-wide{
  grid-column:2 / span 2;
  grid-row:1;
}

/* Fassade */
.project-mosaic-facade{
  grid-template-columns:.78fr 1.18fr;
  grid-template-rows:205px 165px;
}
.project-mosaic-facade .project-card-left{
  grid-column:1;
  grid-row:1;
}
.project-mosaic-facade .project-card-right-wide{
  grid-column:2;
  grid-row:1;
}
.project-mosaic-facade .project-card-left-small{
  grid-column:1;
  grid-row:2;
}
.project-mosaic-facade .project-card-right-small{
  grid-column:2;
  grid-row:2;
}

/* Innenausbau */
.project-mosaic-interior{
  grid-template-columns:1.2fr .8fr;
  grid-template-rows:190px 190px;
}
.project-mosaic-interior .project-card-interior-main{
  grid-column:1;
  grid-row:1 / span 2;
}

@media(max-width:980px){
  .project-showcase{gap:64px}
  .project-mosaic-bath{
    grid-template-columns:1fr 1fr;
    grid-template-rows:300px 190px 190px;
  }
  .project-mosaic-bath .project-card-hero{
    grid-column:1 / span 2;
    grid-row:1;
  }
  .project-mosaic-bath .project-card-wide{
    grid-column:1 / span 2;
    grid-row:2;
  }
  .project-mosaic-facade{
    grid-template-columns:1fr 1fr;
    grid-template-rows:240px 180px;
  }
  .project-mosaic-interior{
    grid-template-columns:1fr 1fr;
    grid-template-rows:260px 180px;
  }
  .project-mosaic-interior .project-card-interior-main{
    grid-column:1 / span 2;
    grid-row:1;
  }
}

@media(max-width:650px){
  .projects-section .projects-title{
    margin-bottom:40px;
  }
  .project-showcase{
    gap:54px;
  }
  .project-block{
    padding-top:28px;
  }
  .project-heading{
    margin-bottom:15px;
  }
  .project-heading h3{
    font-size:1.5rem;
  }
  .project-heading p{
    font-size:.9rem;
    line-height:1.5;
  }
  .project-mosaic-bath,
  .project-mosaic-facade,
  .project-mosaic-interior{
    grid-template-columns:1fr;
    grid-template-rows:none;
  }
  .project-mosaic-bath .project-card-hero,
  .project-mosaic-bath .project-card-wide,
  .project-mosaic-facade .project-card-left,
  .project-mosaic-facade .project-card-right-wide,
  .project-mosaic-facade .project-card-left-small,
  .project-mosaic-facade .project-card-right-small,
  .project-mosaic-interior .project-card-interior-main{
    grid-column:auto;
    grid-row:auto;
  }
  .project-mosaic .project-card{
    aspect-ratio:4/3;
  }
  .project-mosaic .project-card::before,
  .project-mosaic .project-card::after{
    display:none;
  }
}


/* Version 1.1.5 – echtes Mosaik mit unterschiedlich großen Bildern */
.projects-mosaic-v2 .project-mosaic{
  display:grid!important;
  gap:12px!important;
  align-items:stretch!important;
}

.projects-mosaic-v2 .project-mosaic .project-card{
  display:block!important;
  width:100%!important;
  height:100%!important;
  min-height:0!important;
  aspect-ratio:auto!important;
  overflow:hidden!important;
}

.projects-mosaic-v2 .project-mosaic .project-card img{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  aspect-ratio:auto!important;
}

/* Badmodernisierung: ein großes Bild links, drei kleinere rechts */
.projects-mosaic-v2 .project-mosaic-bath{
  grid-template-columns:1.45fr .72fr .72fr!important;
  grid-template-rows:220px 220px!important;
}
.projects-mosaic-v2 .project-mosaic-bath .project-card-hero{
  grid-column:1!important;
  grid-row:1 / span 2!important;
}
.projects-mosaic-v2 .project-mosaic-bath .project-card-wide{
  grid-column:2 / span 2!important;
  grid-row:1!important;
}
.projects-mosaic-v2 .project-mosaic-bath .project-card:nth-of-type(3){
  grid-column:2!important;
  grid-row:2!important;
}
.projects-mosaic-v2 .project-mosaic-bath .project-card:nth-of-type(4){
  grid-column:3!important;
  grid-row:2!important;
}

/* Fassadensanierung: unterschiedlich breite Felder */
.projects-mosaic-v2 .project-mosaic-facade{
  grid-template-columns:.9fr 1.35fr!important;
  grid-template-rows:230px 170px!important;
}
.projects-mosaic-v2 .project-mosaic-facade .project-card-left{
  grid-column:1!important;
  grid-row:1!important;
}
.projects-mosaic-v2 .project-mosaic-facade .project-card-right-wide{
  grid-column:2!important;
  grid-row:1!important;
}
.projects-mosaic-v2 .project-mosaic-facade .project-card-left-small{
  grid-column:1!important;
  grid-row:2!important;
}
.projects-mosaic-v2 .project-mosaic-facade .project-card-right-small{
  grid-column:2!important;
  grid-row:2!important;
}

/* Innenausbau: großes Hochformat links, zwei kleinere rechts */
.projects-mosaic-v2 .project-mosaic-interior{
  grid-template-columns:1.3fr .9fr!important;
  grid-template-rows:195px 195px!important;
}
.projects-mosaic-v2 .project-mosaic-interior .project-card-interior-main{
  grid-column:1!important;
  grid-row:1 / span 2!important;
}
.projects-mosaic-v2 .project-mosaic-interior .project-card:nth-of-type(2){
  grid-column:2!important;
  grid-row:1!important;
}
.projects-mosaic-v2 .project-mosaic-interior .project-card:nth-of-type(3){
  grid-column:2!important;
  grid-row:2!important;
}

@media(max-width:980px){
  .projects-mosaic-v2 .project-mosaic-bath,
  .projects-mosaic-v2 .project-mosaic-facade,
  .projects-mosaic-v2 .project-mosaic-interior{
    grid-template-columns:1fr 1fr!important;
    grid-template-rows:280px 180px!important;
  }

  .projects-mosaic-v2 .project-mosaic-bath .project-card-hero,
  .projects-mosaic-v2 .project-mosaic-bath .project-card-wide,
  .projects-mosaic-v2 .project-mosaic-facade .project-card-left,
  .projects-mosaic-v2 .project-mosaic-facade .project-card-right-wide,
  .projects-mosaic-v2 .project-mosaic-facade .project-card-left-small,
  .projects-mosaic-v2 .project-mosaic-facade .project-card-right-small,
  .projects-mosaic-v2 .project-mosaic-interior .project-card-interior-main,
  .projects-mosaic-v2 .project-mosaic-interior .project-card:nth-of-type(2),
  .projects-mosaic-v2 .project-mosaic-interior .project-card:nth-of-type(3){
    grid-column:auto!important;
    grid-row:auto!important;
  }

  .projects-mosaic-v2 .project-mosaic-bath .project-card-hero,
  .projects-mosaic-v2 .project-mosaic-interior .project-card-interior-main{
    grid-column:1 / span 2!important;
    grid-row:1!important;
  }
}

@media(max-width:650px){
  .projects-mosaic-v2 .project-mosaic-bath,
  .projects-mosaic-v2 .project-mosaic-facade,
  .projects-mosaic-v2 .project-mosaic-interior{
    grid-template-columns:1fr!important;
    grid-template-rows:none!important;
  }

  .projects-mosaic-v2 .project-mosaic .project-card{
    height:auto!important;
    aspect-ratio:4 / 3!important;
  }

  .projects-mosaic-v2 .project-mosaic .project-card img{
    height:100%!important;
  }

  .projects-mosaic-v2 .project-mosaic-bath .project-card-hero,
  .projects-mosaic-v2 .project-mosaic-interior .project-card-interior-main{
    grid-column:auto!important;
    grid-row:auto!important;
  }
}


/* Version 1.1.6 – Mosaik auf dem Smartphone für alle Projekte */
@media(max-width:650px){

  .projects-mosaic-v2 .project-mosaic{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:8px!important;
  }

  .projects-mosaic-v2 .project-mosaic .project-card{
    width:100%!important;
    height:150px!important;
    min-height:150px!important;
    aspect-ratio:auto!important;
    grid-column:auto!important;
    grid-row:auto!important;
  }

  .projects-mosaic-v2 .project-mosaic .project-card img{
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
  }

  /* Badmodernisierung:
     großes Bild, breites Bild, zwei kleine Bilder */
  .projects-mosaic-v2 .project-mosaic-bath .project-card-hero{
    grid-column:1 / span 2!important;
    height:245px!important;
  }

  .projects-mosaic-v2 .project-mosaic-bath .project-card-wide{
    grid-column:1 / span 2!important;
    height:175px!important;
  }

  /* Fassadensanierung:
     erstes Bild groß, zwei Details nebeneinander, Abschlussbild breit */
  .projects-mosaic-v2 .project-mosaic-facade .project-card-left{
    grid-column:1 / span 2!important;
    height:230px!important;
  }

  .projects-mosaic-v2 .project-mosaic-facade .project-card-right-wide{
    grid-column:1!important;
    height:155px!important;
  }

  .projects-mosaic-v2 .project-mosaic-facade .project-card-left-small{
    grid-column:2!important;
    height:155px!important;
  }

  .projects-mosaic-v2 .project-mosaic-facade .project-card-right-small{
    grid-column:1 / span 2!important;
    height:175px!important;
  }

  /* Innenausbau:
     Hauptbild groß, zwei weitere Bilder nebeneinander */
  .projects-mosaic-v2 .project-mosaic-interior .project-card-interior-main{
    grid-column:1 / span 2!important;
    height:230px!important;
  }

  .projects-mosaic-v2 .project-mosaic-interior .project-card:nth-of-type(2),
  .projects-mosaic-v2 .project-mosaic-interior .project-card:nth-of-type(3){
    grid-column:auto!important;
    height:155px!important;
  }
}

/* Version 1.2.0 – projektbezogene Premium-Lightbox */
body.lightbox-open{overflow:hidden}
.project-mosaic .project-card{cursor:zoom-in}
.project-mosaic .project-card img{
  transform:scale(1.001);
  will-change:transform;
}
.project-mosaic .project-card:hover img{
  transform:scale(1.045);
  filter:brightness(.88) saturate(1.03);
}
.project-mosaic .project-card:focus-visible{
  outline:3px solid var(--red);
  outline-offset:4px;
}
.project-mosaic .project-card::before{
  width:42px;
  height:42px;
  right:18px;
  top:18px;
  background:rgba(255,255,255,.96);
}
.project-mosaic .project-card::after{
  right:32px;
  top:32px;
  width:11px;
  height:11px;
}
.lightbox{
  display:flex;
  align-items:center;
  justify-content:center;
  padding:28px;
  background:rgba(5,6,7,.96);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .24s ease,visibility .24s ease;
}
.lightbox.open{
  display:flex;
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}
.lightbox-stage{
  position:relative;
  width:min(1320px,100%);
  height:min(88vh,900px);
  display:grid;
  grid-template-columns:72px minmax(0,1fr) 72px;
  align-items:center;
}
.lightbox-figure{
  position:relative;
  margin:0;
  min-width:0;
  height:100%;
  display:grid;
  grid-template-rows:minmax(0,1fr) auto;
  align-items:center;
}
.lightbox-figure img{
  width:100%;
  height:100%;
  max-width:none;
  max-height:none;
  object-fit:contain;
  opacity:1;
  transform:translateX(0) scale(1);
  transition:opacity .2s ease,transform .25s ease;
}
.lightbox-stage.is-loading .lightbox-figure img{opacity:.18}
.lightbox-stage.direction-next .lightbox-figure img{transform:translateX(-16px) scale(.99)}
.lightbox-stage.direction-prev .lightbox-figure img{transform:translateX(16px) scale(.99)}
.lightbox-figure figcaption{
  min-height:68px;
  padding:14px 8px 0;
  display:grid;
  grid-template-columns:1fr auto;
  gap:3px 24px;
  color:#fff;
}
.lightbox-project{
  font-size:1rem;
  letter-spacing:.01em;
}
.lightbox-caption{
  grid-column:1;
  color:#bfc3c6;
  font-size:.9rem;
}
.lightbox-count{
  grid-column:2;
  grid-row:1 / span 2;
  align-self:center;
  color:#aeb2b5;
  font-size:.86rem;
  white-space:nowrap;
}
.lightbox-close{
  position:fixed;
  right:24px;
  top:16px;
  width:52px;
  height:52px;
  display:grid;
  place-items:center;
  padding:0;
  border:1px solid rgba(255,255,255,.18);
  border-radius:50%;
  background:rgba(20,22,24,.58);
  color:#fff;
  font-size:2.15rem;
  line-height:1;
  cursor:pointer;
  transition:background .2s ease,transform .2s ease,border-color .2s ease;
  z-index:2;
}
.lightbox-close:hover{
  transform:rotate(4deg);
  background:rgba(167,25,32,.92);
  border-color:transparent;
}
.lightbox-nav{
  width:54px;
  height:72px;
  justify-self:center;
  border:1px solid rgba(255,255,255,.18);
  background:rgba(255,255,255,.06);
  color:#fff;
  font-size:3rem;
  line-height:1;
  cursor:pointer;
  transition:background .2s ease,transform .2s ease,border-color .2s ease;
}
.lightbox-nav:hover{
  background:var(--red);
  border-color:var(--red);
  transform:scale(1.04);
}
.lightbox-nav:focus-visible,.lightbox-close:focus-visible{
  outline:3px solid #fff;
  outline-offset:4px;
}
.lightbox-loader{
  position:absolute;
  left:50%;
  top:calc(50% - 34px);
  width:38px;
  height:38px;
  margin:-19px 0 0 -19px;
  border:3px solid rgba(255,255,255,.24);
  border-top-color:#fff;
  border-radius:50%;
  opacity:0;
  animation:lightbox-spin .75s linear infinite;
  transition:opacity .15s ease;
  pointer-events:none;
}
.lightbox-stage.is-loading .lightbox-loader{opacity:1}
@keyframes lightbox-spin{to{transform:rotate(360deg)}}

@media(max-width:760px){
  .lightbox{padding:64px 10px 76px}
  .lightbox-stage{
    width:100%;
    height:calc(100dvh - 140px);
    grid-template-columns:1fr;
  }
  .lightbox-figure{grid-column:1;grid-row:1}
  .lightbox-nav{
    position:absolute;
    top:50%;
    z-index:2;
    width:48px;
    height:62px;
    transform:translateY(-50%);
    background:rgba(10,11,12,.64);
  }
  .lightbox-nav:hover{transform:translateY(-50%)}
  .lightbox-prev{left:3px}
  .lightbox-next{right:3px}
  .lightbox-close{
    top:10px;
    right:10px;
    width:48px;
    height:48px;
  }
  .lightbox-figure figcaption{
    min-height:78px;
    padding:12px 6px 0;
    grid-template-columns:1fr auto;
  }
  .lightbox-project{font-size:.94rem}
  .lightbox-caption{font-size:.82rem}
  .lightbox-count{font-size:.8rem}
}

@media(max-width:420px){
  .lightbox{padding-left:6px;padding-right:6px}
  .lightbox-nav{width:44px;height:58px;font-size:2.65rem}
  .lightbox-figure figcaption{gap:3px 12px}
}

@media(prefers-reduced-motion:reduce){
  .lightbox,.lightbox-figure img,.lightbox-nav,.lightbox-close{transition:none!important}
  .lightbox-loader{animation:none}
}

/* Version 1.2.1 – ruhige Leistungskarten und einheitliche Lightbox */
.services article{
  transform:none!important;
  box-shadow:none!important;
  cursor:default;
}
.services article:after{
  display:none!important;
}
.services article:hover{
  transform:none!important;
  border-color:var(--line)!important;
  box-shadow:none!important;
}
.services article:hover:after{
  width:0!important;
}

/* Einheitlicher Anzeigebereich: Seitenverhältnis bleibt erhalten */
.lightbox-figure{
  width:100%;
  height:100%;
  min-height:0;
}
.lightbox-figure img{
  width:auto!important;
  height:auto!important;
  max-width:100%!important;
  max-height:calc(88vh - 92px)!important;
  object-fit:contain!important;
  justify-self:center;
  align-self:center;
}
.lightbox-figure figcaption{
  width:100%;
}

@media(max-width:760px){
  .lightbox-figure img{
    max-width:100%!important;
    max-height:calc(100dvh - 230px)!important;
  }
}

/* Version 1.3.0 – Vertrauensbereich */
.trust-section{
  padding:92px 0;
  background:#fff;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.trust-grid{
  display:grid;
  grid-template-columns:.78fr 1.22fr;
  gap:80px;
  align-items:start;
}
.trust-intro{
  position:sticky;
  top:112px;
}
.trust-intro h2{
  margin:0 0 22px;
  font-size:clamp(2.35rem,4.4vw,4.1rem);
  line-height:1.03;
  letter-spacing:-.045em;
  text-wrap:balance;
}
.trust-intro>p:last-child{
  margin:0;
  max-width:520px;
  color:var(--grey);
}
.trust-points{
  display:grid;
  border-top:1px solid var(--line);
}
.trust-points article{
  display:grid;
  grid-template-columns:58px 1fr;
  gap:22px;
  padding:27px 0;
  border-bottom:1px solid var(--line);
}
.trust-points article>span{
  color:var(--red);
  font-size:.76rem;
  font-weight:900;
  letter-spacing:.16em;
}
.trust-points h3{
  margin:0 0 7px;
  font-size:1.22rem;
  line-height:1.2;
}
.trust-points p{
  margin:0;
  color:var(--grey);
  max-width:620px;
}
.trust-points article,
.trust-points article:hover{
  transform:none;
  box-shadow:none;
  cursor:default;
}

@media(max-width:980px){
  .trust-section{padding:78px 0}
  .trust-grid{
    grid-template-columns:1fr;
    gap:42px;
  }
  .trust-intro{position:static}
}

@media(max-width:650px){
  .trust-section{padding:66px 0}
  .trust-grid{gap:32px}
  .trust-intro h2{
    font-size:clamp(2.25rem,11vw,3.1rem);
  }
  .trust-points article{
    grid-template-columns:42px 1fr;
    gap:14px;
    padding:22px 0;
  }
  .trust-points h3{font-size:1.08rem}
  .trust-points p{font-size:.94rem}
}

/* Version 1.4.0 – Leistungen spiegelverkehrt zur Zusammenarbeit */
.services-section{
  padding:92px 0;
  background:#fff;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.services-layout{
  display:grid;
  grid-template-columns:1.22fr .78fr;
  gap:80px;
  align-items:start;
}
.services-intro{
  position:sticky;
  top:112px;
  order:2;
}
.services-intro h2{
  margin:0 0 22px;
  font-size:clamp(2.35rem,4.4vw,4.1rem);
  line-height:1.03;
  letter-spacing:-.045em;
  text-wrap:balance;
}
.services-intro>p:last-child{
  margin:0;
  max-width:520px;
  color:var(--grey);
}
.services-list{
  display:grid;
  border-top:1px solid var(--line);
}
.services-list article{
  display:grid;
  grid-template-columns:58px 1fr;
  gap:22px;
  padding:27px 0;
  border-bottom:1px solid var(--line);
  background:transparent;
  min-height:0;
  transform:none!important;
  box-shadow:none!important;
  cursor:default;
}
.services-list article::after{
  display:none!important;
}
.services-list article:hover{
  transform:none!important;
  box-shadow:none!important;
  border-color:var(--line)!important;
  background:transparent!important;
}
.services-list article>span{
  color:var(--red);
  font-size:.76rem;
  font-weight:900;
  letter-spacing:.16em;
}
.services-list h3{
  margin:0 0 7px;
  font-size:1.22rem;
  line-height:1.2;
}
.services-list p{
  margin:0;
  color:var(--grey);
  max-width:650px;
}

@media(max-width:980px){
  .services-section{padding:78px 0}
  .services-layout{
    grid-template-columns:1fr;
    gap:42px;
  }
  .services-intro{
    position:static;
    order:0;
  }
  .services-list{order:1}
}

@media(max-width:650px){
  .services-section{padding:66px 0}
  .services-layout{gap:32px}
  .services-intro h2{
    font-size:clamp(2.25rem,11vw,3.1rem);
  }
  .services-list article{
    grid-template-columns:42px 1fr;
    gap:14px;
    padding:22px 0;
  }
  .services-list h3{font-size:1.08rem}
  .services-list p{font-size:.94rem}
}

/* Version 1.5.0 – Kontaktbereich Feinschliff */
.contact-section{
  background:#fff;
}
.contact-grid{
  grid-template-columns:.82fr 1.18fr;
  gap:86px;
  align-items:start;
}
.contact-intro{
  position:sticky;
  top:112px;
}
.contact-intro h2{
  margin-bottom:22px;
}
.contact-lead{
  max-width:540px;
  margin:0;
  color:var(--grey);
  font-size:1.02rem;
}
.contact-list{
  margin-top:38px;
  gap:12px;
}
.contact-list a{
  position:relative;
  display:grid;
  gap:2px;
  padding:18px 48px 18px 18px;
  border:1px solid var(--line);
  border-left:3px solid var(--red);
  background:#fff;
  transition:border-color .2s ease,background-color .2s ease;
}
.contact-list a::after{
  content:"↗";
  position:absolute;
  right:18px;
  top:50%;
  transform:translateY(-50%);
  color:var(--red);
  font-size:1.25rem;
}
.contact-list a:hover{
  border-color:#cfd1d3;
  background:#fafafa;
}
.contact-list small{
  color:var(--red);
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
  font-size:.68rem;
}
.contact-list strong{
  font-size:1.12rem;
}
.contact-list span{
  color:var(--grey);
  font-size:.86rem;
}

.contact-form{
  position:relative;
  padding:38px;
  gap:18px;
  border:1px solid var(--line);
  border-top:4px solid var(--red);
  background:#f7f7f7;
  box-shadow:0 24px 60px rgba(0,0,0,.065);
}
.contact-form-head{
  display:flex;
  justify-content:space-between;
  gap:28px;
  align-items:flex-start;
  margin-bottom:4px;
  padding-bottom:22px;
  border-bottom:1px solid #dfe1e2;
}
.contact-form-head .eyebrow{
  margin-bottom:7px;
}
.contact-form-head h3{
  margin:0;
  font-size:1.55rem;
  line-height:1.15;
}
.contact-form-head>p{
  margin:4px 0 0;
  color:var(--grey);
  white-space:nowrap;
  font-size:.78rem;
}
.contact-form-head>p span,
.contact-form label>span b{
  color:var(--red);
}
.contact-form label{
  gap:8px;
}
.contact-form label>span{
  font-weight:800;
  font-size:.88rem;
}
.contact-form label>span b{
  font-weight:900;
}
.contact-form input,
.contact-form select,
.contact-form textarea{
  min-height:50px;
  padding:13px 14px;
  border:1px solid #c8cbcd;
  background:#fff;
  transition:border-color .18s ease,box-shadow .18s ease,background-color .18s ease;
}
.contact-form textarea{
  min-height:150px;
  resize:vertical;
}
.contact-form input::placeholder,
.contact-form textarea::placeholder{
  color:#92979b;
}
.contact-form input:hover,
.contact-form select:hover,
.contact-form textarea:hover{
  border-color:#aeb2b5;
}
.contact-form input:focus,
.contact-form select:focus,
.contact-form textarea:focus{
  outline:none;
  border-color:var(--red);
  box-shadow:0 0 0 3px rgba(167,25,32,.12);
}
.privacy-row{
  margin-top:2px;
  font-size:.88rem!important;
  line-height:1.45;
}
.privacy-row input{
  min-height:0;
  width:18px;
  height:18px;
  accent-color:var(--red);
}
.contact-submit{
  display:flex;
  gap:20px;
  align-items:center;
  margin-top:3px;
}
.contact-submit .button{
  flex:0 0 auto;
}
.contact-submit p{
  margin:0;
  max-width:330px;
  color:var(--grey);
  font-size:.78rem;
  line-height:1.45;
}

@media(max-width:980px){
  .contact-grid{
    grid-template-columns:1fr;
    gap:46px;
  }
  .contact-intro{
    position:static;
  }
  .contact-list{
    grid-template-columns:1fr 1fr;
  }
}

@media(max-width:650px){
  .contact-grid{gap:36px}
  .contact-list{
    grid-template-columns:1fr;
    margin-top:28px;
  }
  .contact-form{
    padding:24px 20px;
  }
  .contact-form-head{
    display:grid;
    gap:7px;
    padding-bottom:18px;
  }
  .contact-form-head>p{
    margin:0;
  }
  .contact-submit{
    display:grid;
    gap:12px;
  }
  .contact-submit .button{
    width:100%;
  }
  .contact-submit p{
    max-width:none;
  }
}

@media(prefers-reduced-motion:reduce){
  .contact-list a,
  .contact-form input,
  .contact-form select,
  .contact-form textarea{
    transition:none!important;
  }
}

/* Version 1.6.0 – Galerie- und Lightbox-Feinschliff */
.lightbox-stage{
  grid-template-rows:minmax(0,1fr);
}
.lightbox-figure{
  overflow:hidden;
}
.lightbox-figure img{
  display:block;
  margin:auto;
  user-select:none;
  -webkit-user-drag:none;
}
.lightbox-figure figcaption{
  min-height:74px;
  align-content:start;
  border-top:1px solid rgba(255,255,255,.10);
}
.lightbox-project,
.lightbox-caption,
.lightbox-count{
  min-width:0;
}
.lightbox-caption{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.lightbox-nav[hidden]{
  display:none!important;
}
.lightbox.single-image .lightbox-stage{
  grid-template-columns:minmax(0,1fr);
}
.lightbox.single-image .lightbox-figure{
  grid-column:1;
}
.lightbox.single-image .lightbox-count{
  display:none;
}
.lightbox-stage{
  touch-action:pan-y;
}
.lightbox.open .lightbox-stage{
  animation:lightbox-stage-in .22s ease both;
}
@keyframes lightbox-stage-in{
  from{opacity:0;transform:scale(.985)}
  to{opacity:1;transform:scale(1)}
}

.project-mosaic .project-card{
  isolation:isolate;
}
.project-mosaic .project-card::before,
.project-mosaic .project-card::after{
  pointer-events:none;
}
.project-mosaic .project-card:focus-visible img{
  filter:brightness(.9);
  transform:scale(1.03);
}

@media(max-width:760px){
  .lightbox-stage{
    height:calc(100dvh - 132px);
  }
  .lightbox-figure{
    grid-template-rows:minmax(0,1fr) 76px;
  }
  .lightbox-figure img{
    max-height:100%!important;
  }
  .lightbox-figure figcaption{
    min-height:76px;
  }
  .lightbox-caption{
    white-space:normal;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
  }
}

@media(prefers-reduced-motion:reduce){
  .lightbox.open .lightbox-stage{
    animation:none!important;
  }
}

/* Version 1.7.0 – Mobile- und Tablet-Feinschliff */
:root{
  --header-offset:82px;
}
section[id]{
  scroll-margin-top:calc(var(--header-offset) + 18px);
}
.desktop-nav a.active:not(.phone-link)::after{
  right:0;
}
.desktop-nav a.active:not(.phone-link){
  color:var(--red);
}
.mobile-menu>a.active{
  color:var(--red);
  border-left:3px solid var(--red);
  padding-left:14px;
}

/* Etwas sauberere Zwischenstufe für Tablets */
@media(max-width:1180px) and (min-width:981px){
  .container{
    width:min(var(--max),calc(100% - 56px));
  }
  .desktop-nav{
    gap:20px;
    font-size:.9rem;
  }
  .brand{
    width:min(340px,40vw);
  }
  .services-layout,
  .trust-grid,
  .contact-grid{
    gap:58px;
  }
}

/* Tablet quer und kleinere Laptops */
@media(max-width:980px){
  :root{
    --header-offset:72px;
  }
  .container{
    width:min(var(--max),calc(100% - 34px));
  }
  .header-inner{
    height:72px;
  }
  .brand{
    width:min(300px,68vw);
  }
  .menu-button{
    min-width:46px;
    min-height:46px;
    display:grid;
    align-content:center;
    justify-content:center;
  }
  .menu-button span{
    width:27px;
  }
  .mobile-menu{
    padding-top:max(22px,env(safe-area-inset-top));
    padding-bottom:max(34px,env(safe-area-inset-bottom));
  }
  .services-layout,
  .trust-grid,
  .contact-grid{
    gap:38px;
  }
  .project-heading{
    margin-bottom:17px;
  }
  .project-heading h3{
    max-width:28ch;
  }
}

/* Smartphone */
@media(max-width:650px){
  :root{
    --header-offset:72px;
  }
  body{
    padding-bottom:calc(58px + env(safe-area-inset-bottom));
  }
  .container{
    width:min(var(--max),calc(100% - 24px));
  }
  .site-header{
    padding-top:env(safe-area-inset-top);
  }
  .header-inner{
    height:68px;
  }
  .brand{
    width:min(238px,72vw);
  }
  .menu-button{
    min-width:44px;
    min-height:44px;
    margin-right:-6px;
  }

  .hero{
    min-height:calc(100svh - 68px - env(safe-area-inset-top));
  }
  .hero-inner{
    min-height:0;
    padding:56px 0 84px;
  }
  .hero h1{
    line-height:.98;
  }
  .hero-inner>p:not(.eyebrow){
    font-size:1.02rem;
    line-height:1.62;
  }
  .hero-actions{
    max-width:none;
  }
  .hero-actions .button{
    min-height:54px;
  }
  .scroll-cue{
    bottom:18px;
  }

  .quick-grid{
    gap:2px;
  }
  .quick-grid span{
    min-height:38px;
    display:flex;
    align-items:center;
  }

  .services-section,
  .trust-section{
    padding:60px 0;
  }
  .services-intro h2,
  .trust-intro h2,
  .contact-section h2{
    line-height:1.02;
  }
  .services-list article,
  .trust-points article{
    grid-template-columns:38px 1fr;
    gap:12px;
    padding:20px 0;
  }

  .quote-grid blockquote{
    font-size:clamp(2.35rem,12vw,3.3rem);
  }

  .projects-section{
    padding-top:66px;
    padding-bottom:66px;
  }
  .project-heading h3{
    font-size:1.42rem;
  }
  .project-heading p{
    font-size:.88rem;
  }
  .projects-mosaic-v2 .project-mosaic{
    gap:7px!important;
  }

  .steps article{
    padding:24px 22px;
  }
  .steps h3{
    margin:24px 0 7px;
  }

  .area-section{
    padding:58px 0;
  }
  .area-section .button{
    width:100%;
  }

  .contact-section{
    padding-top:66px;
    padding-bottom:72px;
  }
  .contact-lead{
    font-size:.97rem;
  }
  .contact-list a{
    min-height:92px;
    padding:17px 46px 17px 16px;
  }
  .contact-form{
    margin-left:-2px;
    margin-right:-2px;
  }
  .contact-form input,
  .contact-form select,
  .contact-form textarea{
    font-size:16px; /* verhindert automatisches iOS-Zoomen */
  }

  .footer-main{
    gap:26px;
  }
  .footer-main img{
    max-width:280px;
  }
  .footer-bottom span:last-child{
    gap:16px;
    flex-wrap:wrap;
  }

  .mobile-contact-bar{
    height:calc(58px + env(safe-area-inset-bottom));
    padding-bottom:env(safe-area-inset-bottom);
  }
  .mobile-contact-bar a{
    min-height:58px;
  }

  .lightbox{
    padding-top:max(64px,calc(48px + env(safe-area-inset-top)));
    padding-bottom:max(76px,calc(62px + env(safe-area-inset-bottom)));
  }
  .lightbox-close{
    top:max(10px,env(safe-area-inset-top));
  }
}

/* Sehr kleine Geräte */
@media(max-width:380px){
  .container{
    width:min(var(--max),calc(100% - 20px));
  }
  .brand{
    width:215px;
  }
  .hero h1{
    font-size:2.7rem;
  }
  .hero-note{
    font-size:.74rem;
  }
  .services-intro h2,
  .trust-intro h2,
  .contact-section h2{
    font-size:2.18rem;
  }
  .contact-form{
    padding:22px 16px;
  }
  .lightbox-nav{
    width:40px;
  }
}

/* Geräte mit Maus behalten Hover, Touchgeräte nicht */
@media(hover:none){
  .button:hover,
  .project-card:hover,
  .contact-list a:hover{
    transform:none!important;
  }
  .project-mosaic .project-card:hover img{
    transform:scale(1.001);
    filter:none;
  }
}

/* Version 1.8.0 – SEO- und Performance-Feinschliff */
.projects-section,
#ablauf,
.area-section,
.contact-section,
.site-footer{
  content-visibility:auto;
  contain-intrinsic-size:900px;
}
.project-mosaic .project-card img{
  backface-visibility:hidden;
}
.hero{
  background-color:#202225;
}
@media(max-width:650px){
  .projects-section,
  #ablauf,
  .area-section,
  .contact-section,
  .site-footer{
    contain-intrinsic-size:1100px;
  }
}

/* Version 1.9.0 – Barrierefreiheit und Mikrodetails */
.sr-only{
  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;
}

.skip-link{
  position:fixed;
  left:16px;
  top:16px;
  z-index:5000;
  padding:12px 16px;
  background:#fff;
  color:#111;
  border:2px solid var(--red);
  box-shadow:0 10px 30px rgba(0,0,0,.18);
  transform:translateY(-160%);
  transition:transform .18s ease;
}
.skip-link:focus{
  left:16px;
  top:16px;
  transform:none;
}

:focus-visible{
  outline:3px solid var(--red);
  outline-offset:3px;
}
a:focus:not(:focus-visible),
button:focus:not(:focus-visible),
input:focus:not(:focus-visible),
select:focus:not(:focus-visible),
textarea:focus:not(:focus-visible){
  outline:none;
}

.button:focus-visible{
  box-shadow:0 0 0 4px rgba(167,25,32,.18);
}
.phone-link:focus-visible,
.mobile-contact-bar a:focus-visible{
  outline-color:#fff;
  outline-offset:-4px;
}
.mobile-menu>a:focus-visible{
  background:#f5f5f5;
  outline-offset:-2px;
}
.contact-list a:focus-visible{
  border-color:var(--red);
  box-shadow:0 0 0 3px rgba(167,25,32,.12);
}

[aria-current="location"]{
  text-decoration-thickness:2px;
  text-underline-offset:5px;
}

@media(max-width:650px){
  .skip-link{
    left:10px;
    right:10px;
    top:max(10px,env(safe-area-inset-top));
    text-align:center;
  }
  .skip-link:focus{
    left:10px;
    right:10px;
    top:max(10px,env(safe-area-inset-top));
  }
}

@media(prefers-contrast:more){
  :root{
    --grey:#4f5458;
    --line:#c9cbcd;
  }
  .button-clear{
    border-width:2px;
  }
  .project-heading p,
  .contact-lead,
  .services-list p,
  .trust-points p{
    color:#4f5458;
  }
}

@media(prefers-reduced-motion:reduce){
  .skip-link{
    transition:none!important;
  }
}

/* Version 2.0.0 – finaler Qualitätsdurchgang */
.area-inner-single{
  display:block;
}
.area-inner-single>div{
  max-width:900px;
}
.area-inner-single h2{
  margin-bottom:0;
}

/* Feine Vereinheitlichung von Überschriften und Abschnittsabständen */
.services-intro h2,
.trust-intro h2,
.contact-intro h2,
.area-section h2,
.section-title h2{
  text-wrap:balance;
}
.services-section,
.trust-section,
.projects-section,
.contact-section{
  overflow:clip;
}

/* Buttons einheitlich und ohne unnötige Bewegung auf Touchgeräten */
.button{
  border-radius:0;
}
@media(hover:hover){
  .button:hover{
    transform:translateY(-2px);
  }
}

/* Letzte mobile Korrekturen */
@media(max-width:650px){
  .area-inner-single{
    display:block;
  }
  .area-inner-single h2{
    max-width:15ch;
  }
}