:root{--ink:#112b20;--forest:#15382b;--green:#6caf4e;--cream:#f7f7f2;--paper:#fff;--line:#dfe5db;--muted:#66746b}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--cream);color:var(--ink);font:16px/1.6 'DM Sans',Arial,sans-serif}a{color:inherit;text-decoration:none}img{display:block;max-width:100%}.wrap{width:min(100% - 64px,1320px);margin:auto}.kicker{display:flex;align-items:center;gap:12px;color:#4d934a;font:800 10px Manrope,Arial;letter-spacing:.18em;text-transform:uppercase}.kicker:before{content:'';height:1px;width:27px;background:currentColor}.display{font:600 clamp(43px,6vw,78px)/.99 Manrope,Arial;letter-spacing:-.075em;margin:18px 0}.title{font:600 clamp(31px,3.5vw,52px)/1.08 Manrope,Arial;letter-spacing:-.06em;margin:14px 0}.intro{font-size:17px;line-height:1.75;color:#dce8df;max-width:570px}.ref-hero{min-height:510px;background:linear-gradient(100deg,#0a251aeb 0%,#123b2aa3 47%,#10261a30 100%),url('assets/bad-04.webp') center/cover;display:flex;align-items:end;color:white;padding:132px 0 68px;position:relative}.hero-content{position:relative;z-index:1}.hero-link{display:inline-flex;align-items:center;gap:22px;border:1px solid #c8dfbb;background:#9ed27d;color:#123524;padding:12px 16px;margin-top:24px;font:800 11px Manrope,Arial;letter-spacing:.05em}.hero-link span{font-size:17px;line-height:1}.hero-note{position:absolute;z-index:1;right:5vw;bottom:24px;color:#e8f1e9;font:700 10px Manrope,Arial;letter-spacing:.12em;text-transform:uppercase}.jump{border-bottom:1px solid var(--line);background:var(--paper);position:sticky;top:0;z-index:7}.jump .wrap{display:flex;gap:0;overflow:auto}.jump a{white-space:nowrap;padding:17px 20px 14px 0;margin-right:20px;border-bottom:2px solid transparent;color:#52675d;font:800 10px Manrope,Arial;letter-spacing:.1em;text-transform:uppercase}.jump a:hover{color:#276c3d;border-color:#6cad50}.project-section{padding:82px 0;border-bottom:1px solid var(--line);overflow:hidden}.project-section.alt{background:#edf1ea}.section-head{display:grid;grid-template-columns:.92fr 1.08fr auto;gap:5vw;align-items:end;margin-bottom:29px}.section-head p{max-width:530px;margin:0;color:var(--muted);font-size:14px}.rail-actions{display:flex;gap:7px;justify-content:flex-end}.rail-actions button{display:grid;place-items:center;width:38px;height:38px;border:1px solid #b7cbb7;border-radius:50%;background:transparent;color:#244c31;font:500 20px/1 Arial;cursor:pointer;transition:.2s}.rail-actions button:hover{background:#183d2e;border-color:#183d2e;color:#fff}.reference-rail{display:flex;gap:13px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-left:1px;padding:1px 2px 13px;scroll-behavior:smooth;scrollbar-width:thin;scrollbar-color:#9cb59b transparent}.reference-rail::-webkit-scrollbar{height:5px}.reference-rail::-webkit-scrollbar-thumb{background:#a8bda7;border-radius:8px}.reference-card{flex:0 0 min(525px,calc(100vw - 54px));height:438px;background:var(--paper);border:1px solid var(--line);scroll-snap-align:start;display:flex;flex-direction:column;overflow:hidden}.card-images{display:grid;grid-template-columns:1fr 1fr;gap:3px;height:325px;background:#e7ece6}.card-images img{width:100%;height:325px;object-fit:cover}.card-caption{flex:1;display:flex;align-items:end;justify-content:space-between;gap:10px;padding:13px 15px 14px;min-height:73px}.card-caption span{display:block;color:#5e9e4d;font:800 9px Manrope,Arial;letter-spacing:.13em;text-transform:uppercase;margin-bottom:2px}.card-caption h3{font:650 18px/1.12 Manrope,Arial;letter-spacing:-.04em;margin:0}.reference-card.triple .card-images{grid-template-columns:1.35fr .65fr}.reference-card.triple .card-images img:first-child{grid-row:span 2;height:325px}.reference-card.triple .card-images img:not(:first-child){height:161px}.reference-card.single .card-images{grid-template-columns:1fr}.reference-card.five{flex-basis:min(650px,calc(100vw - 54px))}.reference-card.five .card-images{grid-template-columns:repeat(5,1fr)}.reference-card.five .card-images img{height:325px}.reference-card.future{justify-content:space-between;padding:18px;background:transparent;border-style:dashed}.future-mark{display:grid;place-items:center;border:1px solid #adbfac;border-radius:50%;width:38px;height:38px;color:#538e48;font-size:21px}.reference-card.future .card-caption{padding:0;display:block;min-height:unset}.reference-card.future .card-caption h3{max-width:175px}.section-foot{margin-top:19px;padding-top:15px;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:20px;color:#6a7a70;font-size:12px}.section-foot strong{color:#315f3a;font:800 10px Manrope,Arial;letter-spacing:.1em;text-transform:uppercase}.cta{padding:100px 0;text-align:center}.cta p{color:var(--muted);max-width:530px;margin:0 auto 25px}.cta a{display:inline-flex;padding:15px 21px;background:#183d2e;color:#fff;font:800 11px Manrope,Arial;letter-spacing:.05em}@media(max-width:980px){.section-head{grid-template-columns:1fr auto;gap:16px}.section-head p{grid-column:1/-1}.project-section{padding:70px 0}.ref-hero{min-height:490px}}@media(max-width:600px){
  .wrap{width:min(100% - 36px,1320px)}
  .ref-hero{padding:128px 0 70px;min-height:475px}
  .display{font-size:47px}
  .hero-note{right:18px;bottom:20px;font-size:8px}
  .project-section{padding:60px 0}
  .section-head{grid-template-columns:1fr auto;margin-bottom:24px}
  .section-head p{font-size:13px}
  .rail-actions{display:none}
  .reference-rail{display:block;overflow:visible;scroll-snap-type:none;padding:1px 0 0}
  .reference-card,.reference-card.five{width:100%;height:auto;min-height:0;flex-basis:auto;margin:0 0 16px}
  .reference-card.future{min-height:178px}
  .card-images,.reference-card.triple .card-images,.reference-card.single .card-images,.reference-card.five .card-images{display:flex;gap:0;overflow-x:auto;overflow-y:hidden;height:clamp(380px,66vh,560px);scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:thin;scrollbar-color:#9cb59b transparent;background:#e7ece6}
  .card-images::-webkit-scrollbar{height:5px}
  .card-images::-webkit-scrollbar-thumb{background:#a8bda7;border-radius:8px}
  .card-images img,.reference-card.triple .card-images img,.reference-card.triple .card-images img:first-child,.reference-card.triple .card-images img:not(:first-child),.reference-card.five .card-images img{display:block;flex:0 0 100%;width:100%;height:100%;min-height:0;object-fit:cover;scroll-snap-align:start;grid-row:auto}
  .card-caption{min-height:76px;padding:12px 13px}
  .card-caption h3{font-size:16px}
  .image-count{display:inline-flex!important;align-items:center;justify-content:center;min-width:42px;margin:0!important;padding:5px 7px;color:#315f3a!important;border:1px solid #b7cbb7;border-radius:999px;font:800 9px/1 Manrope,Arial!important;letter-spacing:.08em!important;white-space:nowrap}
  .section-foot{display:block}
  .section-foot strong{display:block;margin-bottom:4px}
  .cta{padding:75px 0}
  .jump a{padding-right:15px;margin-right:14px}
}

/* Außenanlagen: gleiche Kartengröße wie Bad, Bilder vollständig sichtbar. */
.reference-card.aussen-card{flex-basis:min(525px,calc(100vw - 54px))}
.reference-card.aussen-card .card-images{background:#e8ebe4}
.reference-card.aussen-card .card-images img{display:block;min-width:0;object-fit:contain;object-position:center;width:100%;height:325px}

/* Terrassenreferenzen in natürlichem Bildformat. */
#rail-aussen{align-items:flex-start}.reference-card.aussen-card{height:auto}.reference-card.aussen-card .card-images{height:auto;align-items:start;background:transparent}.reference-card.aussen-card .card-images img{height:auto;object-fit:initial}.reference-card.aussen-card .card-caption{min-height:85px}