/* Handwerk: kräftige Schrift, große Projektfotos und klare Flächen. */
:root{--ink:#101b1b;--muted:#52605e;--brand:#0ba8aa;--brand-dark:#087779;--pale:#f0f5f4}
.site-header{background:rgba(255,255,255,.97)}
.nav-contact{background:var(--ink);color:white;border-color:var(--ink)}
.nav-contact:hover{background:var(--brand-dark);border-color:var(--brand-dark)}
.hero.container{position:relative;isolation:isolate;display:block;width:100%;max-width:none;margin:0;min-height:700px;padding:0;background:var(--ink);color:white;overflow:hidden}
.hero-copy{position:relative;z-index:3;max-width:760px;width:63%;margin-left:max(52px,calc((100% - 1280px)/2));padding:91px 0 75px}
.hero .eyebrow{color:#80e4df;margin-bottom:27px;font-size:.8125rem;letter-spacing:.14em}
.hero .small-rule{width:40px;background:#80e4df}
.hero h1{font-size:clamp(4rem,6.7vw,6.4rem);font-weight:700;line-height:.98;letter-spacing:-.06em;margin-bottom:30px}
.hero h1 span{color:#6fdfd7}
.hero-description{color:#d4dfdc;max-width:440px;font-size:1.0625rem;line-height:1.8}
.hero-actions{gap:28px;margin-top:34px;flex-direction:row;align-items:center}
.hero .button-dark{background:#65d9d2;color:#091f1e;padding-inline:28px;min-height:56px}
.hero .button-dark:hover{background:#99eeea;color:#091f1e}
.hero .text-link{color:white;border-color:#69817b;font-weight:500}
.hero .text-link:hover{color:#80e4df;border-color:#80e4df}
.hero-note{border-color:#49635c;max-width:330px;margin-top:47px;padding-top:17px}
.hero-note p{color:#bdcec9;font-size:.8125rem;letter-spacing:.025em}
.note-number{color:#80e4df;font-size:1rem;font-weight:600}
.hero-photo{position:absolute;inset:0 0 0 auto;width:57%;height:100%;margin:0;background:var(--ink);z-index:1;overflow:hidden}
.hero-photo>img{width:100%;height:110%;object-position:48% 48%;transform:translateY(calc(-4% + var(--hero-shift,0px)));will-change:transform}
.hero-photo::after{inset:0;background:linear-gradient(90deg,#101b1b 0%,#101b1bc7 15%,#101b1b1a 65%),linear-gradient(0deg,#101b1b96 0%,transparent 42%);z-index:1}
.hero-photo figcaption{left:auto;right:max(35px,calc((100vw - 1280px)/2));bottom:38px;z-index:2;text-align:right}
.hero-photo figcaption span{color:#e2ebe8;font-size:.75rem;text-transform:uppercase;letter-spacing:.1em;margin-bottom:8px}
.hero-photo figcaption strong{font-size:1.125rem;letter-spacing:0;font-weight:500}
.photo-index{top:30px;right:35px;color:var(--ink);background:#ffffffdc;font-size:.75rem;z-index:2}
.discipline-band{background:var(--brand);border:0;color:#071c1c}
.discipline-inner{font-weight:600;text-transform:uppercase;letter-spacing:.045em;font-size:clamp(1rem,1.5vw,1.3rem);padding-block:23px}
.band-divider{color:#075558;font-weight:400}
.section-space{padding-block:112px}
.section-heading{align-items:end;grid-template-columns:1.2fr 1fr;gap:90px;margin-bottom:47px}
.section-heading .eyebrow{font-size:.8125rem;letter-spacing:.12em}
h2{font-size:clamp(2.5rem,4.1vw,4rem);font-weight:600;line-height:1.04;letter-spacing:-.045em}
.section-heading>p{font-size:1rem;line-height:1.8;max-width:400px;padding-bottom:3px}
.service-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:47px 34px}
.service-card .image-button{height:390px}
.service-card:nth-child(1) .image-button{height:450px}
.service-card:nth-child(2) .image-button{height:450px}
.service-card .image-button::after{content:"";position:absolute;inset:60% 0 0;background:linear-gradient(transparent,#0818188c);pointer-events:none}
.service-card .image-label{z-index:1;left:22px;bottom:23px;background:none;color:white;padding:0;font-size:1rem;letter-spacing:.025em;max-width:calc(100% - 80px)}
.image-enlarge{z-index:2;background:#63d8d0;color:#102b27;right:20px;bottom:20px;width:40px;height:40px;font-size:1.75rem}
.image-button:hover .image-enlarge{color:white;background:var(--brand-dark)}
.service-copy{display:grid;grid-template-columns:42px 1fr;column-gap:14px;padding-top:23px;border-bottom:1px solid #ced9d6;padding-bottom:24px;padding-right:0}
.service-number{grid-column:1;grid-row:1 / 3;font-size:1rem;font-weight:600;margin-top:4px;margin-bottom:0;color:var(--brand-dark)}
.service-copy h3{grid-column:2;line-height:1.2;font-size:clamp(1.3rem,2.1vw,1.8rem);font-weight:600;margin-bottom:11px;letter-spacing:-.025em}
.service-copy p{grid-column:2;font-size:1rem;line-height:1.7;max-width:420px}
.about{background:#101b1b;border-top:8px solid var(--brand)}
.about-grid{padding-block:100px;gap:90px;grid-template-columns:1fr 1fr;align-items:center}
.about-copy h2{font-size:clamp(2.5rem,4vw,3.9rem);margin-bottom:32px}
.about .eyebrow{color:#80e4df}
.about-photo{height:570px}
.about-photo img{object-position:50% 46%}
.about-photo figcaption{left:0;bottom:0;background:#0ba8aa;color:#071c1c;padding:13px 20px;font-weight:500;font-size:.875rem}
.about-copy>p:not(.eyebrow){color:#cedbd6;font-size:1rem;line-height:1.85}
.about-signature{left:4%;bottom:-26px;font-size:clamp(6rem,14vw,13rem);color:#254039;opacity:.7;letter-spacing:-.07em}
.about-signature span{color:#284f49}
.about-copy .button{position:relative;z-index:2;background:#65d9d2;margin-top:18px}
.work-grid{grid-template-columns:1.12fr 1fr;gap:34px}
.work-large .image-button{height:740px}
.work-small .image-button{height:306px}
.work-grid figcaption>span{text-transform:uppercase;letter-spacing:.08em;font-size:.75rem;margin-bottom:2px}
.work-grid figcaption>strong{font-size:1.0625rem;font-weight:500;line-height:1.4}
.work-grid figcaption{padding-top:17px}
.contact{background:#0ba8aa;border:0;color:#071c1c}
.contact-grid{padding-block:95px;grid-template-columns:1fr 1fr;gap:90px}
.contact .eyebrow{color:#064a4b}
.contact-intro h2{font-weight:600;font-size:clamp(3.2rem,6.3vw,6rem);line-height:1.02}
.contact-intro>p:last-child{color:#092b29;font-size:1rem;line-height:1.8;max-width:430px}
.contact-label{color:#092b29;font-weight:500}
.contact-email{font-weight:600;font-size:clamp(1.7rem,2.5vw,2.4rem);border-color:#086b6c;padding-bottom:7px}
.contact-email:hover{color:#061b1a}
.contact .button-dark:hover{background:#223f3a}
.contact address{color:#092b29}
.contact address strong{color:#071c1c;font-weight:600}
.site-footer{background:#101b1b;color:#fff}
.footer-brand{width:140px;padding:0;background:transparent;margin-left:0}
.footer-top{gap:35px;padding-block:43px}
.footer-top p{color:#b4c9c3;font-size:.9375rem}
.footer-top .text-link{color:white;border-color:#697b77}
.footer-bottom{border-color:#314943;color:#b4c9c3;padding-block:24px}
.hero-copy .eyebrow,.hero-copy h1,.hero-copy .hero-description,.hero-copy .hero-actions{animation:hero-arrive .8s both cubic-bezier(.2,.7,.2,1)}
.hero-copy h1{animation-delay:.08s}.hero-copy .hero-description{animation-delay:.16s}.hero-copy .hero-actions{animation-delay:.24s}
@keyframes hero-arrive{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:1150px){.hero-copy{margin-left:36px;padding-block:80px;max-width:670px}.hero.container{min-height:660px}.hero h1{font-size:clamp(3.9rem,7.1vw,5.4rem)}.hero-photo{width:60%}.hero-photo figcaption{right:35px;bottom:32px}.section-heading,.about-grid,.contact-grid{gap:55px}.service-card .image-button{height:365px}.service-card:nth-child(-n+2) .image-button{height:405px}.about-photo{height:500px}.work-large .image-button{height:650px}.work-small .image-button{height:262px}}
@media(max-width:900px){.hero-copy{margin-left:24px;width:75%;padding-top:73px;padding-bottom:70px}.hero.container{min-height:640px}.hero h1{font-size:clamp(4.1rem,8.3vw,4.8rem)}.hero-description{max-width:365px;font-size:1rem}.hero-photo{width:64%}.hero-photo::after{background:linear-gradient(90deg,#101b1b 0%,#101b1bcf 17%,#101b1b4d 100%),linear-gradient(0deg,#101b1b96,transparent 40%)}.hero-photo figcaption{right:25px;bottom:24px}.hero-photo figcaption strong{font-size:.9375rem}.hero-actions{gap:23px}.hero-note{margin-top:35px}.section-space{padding-block:80px}.section-heading,.about-grid,.contact-grid{gap:35px}.service-grid{gap:36px 24px}.service-card .image-button,.service-card:nth-child(-n+2) .image-button{height:350px}.service-copy{grid-template-columns:30px 1fr;gap:10px}.service-copy h3{font-size:1.4rem}.about-grid{padding-block:75px}.about-photo{height:475px}.work-grid{gap:27px}.work-large .image-button{height:590px}.work-small .image-button{height:232px}.contact-grid{padding-block:75px}}
@media(max-width:700px){.hero.container{min-height:0;display:flex;flex-direction:column;overflow:hidden}.hero-copy{width:calc(100% - 40px);max-width:none;margin:0 20px;padding:51px 0 34px}.hero h1{font-size:clamp(3.5rem,11.1vw,4.8rem);line-height:1.02;margin-bottom:25px;letter-spacing:-.055em}.hero .eyebrow{margin-bottom:22px;font-size:.75rem;letter-spacing:.12em}.hero-description{font-size:1rem;max-width:440px;line-height:1.8}.hero-actions{flex-direction:row;gap:22px;align-items:center;margin-top:26px}.hero .button-dark{min-height:52px;padding-inline:22px}.hero .text-link{font-size:.875rem}.hero-note{display:none}.hero-photo{position:relative;inset:auto;width:100%;height:330px;max-height:none;z-index:1}.hero-photo>img{height:100%;transform:none;object-position:50% 49%;will-change:auto}.hero-photo::after{background:linear-gradient(180deg,#101b1b 0%,#101b1b00 24%),linear-gradient(0deg,#101b1b8c,transparent 60%)}.hero-photo figcaption{bottom:23px;right:22px}.hero-photo figcaption span{font-size:.75rem}.hero-photo figcaption strong{font-size:1rem}.photo-index{display:none}.discipline-inner{font-size:.875rem;padding-block:22px;letter-spacing:.035em}.section-space{padding-block:65px}.section-heading{grid-template-columns:1fr;gap:20px;margin-bottom:30px}.section-heading .eyebrow{margin-bottom:16px;font-size:.75rem}h2{font-size:clamp(2.25rem,7vw,3rem)}.section-heading>p{font-size:1rem;max-width:none}.service-grid{gap:28px 20px}.service-card .image-button,.service-card:nth-child(-n+2) .image-button{height:265px}.service-copy{grid-template-columns:1fr;padding-top:17px;padding-bottom:20px;gap:0}.service-number{grid-column:1;grid-row:auto;font-size:.8125rem;margin-top:0;margin-bottom:7px}.service-copy h3,.service-copy p{grid-column:1}.service-copy h3{font-size:1.25rem;line-height:1.3;margin-bottom:9px}.service-copy p{font-size:1rem;line-height:1.65}.service-card .image-label{left:14px;bottom:17px;font-size:.875rem;max-width:calc(100% - 59px)}.image-enlarge{right:12px;bottom:12px;width:32px;height:32px;font-size:1.5rem}.about-grid{grid-template-columns:1fr;gap:35px;padding-block:60px}.about-copy h2{font-size:2.5rem;margin-bottom:25px}.about-photo{height:430px}.about-photo figcaption{font-size:.8125rem;padding:9px 15px}.about-signature{left:7%;font-size:5.3rem;bottom:-15px}.work-grid{grid-template-columns:1fr 1fr;gap:28px 20px}.work-large{grid-column:span 2}.work-large .image-button{height:470px}.work-small .image-button{height:270px}.work-grid figcaption>strong{font-size:1rem}.contact-grid{grid-template-columns:1fr;gap:34px;padding-block:60px}.contact-intro h2{font-size:3.5rem}.contact-details{border-color:#098080}.contact-email{font-size:1.875rem}.footer-top{gap:20px 22px;padding-block:30px}.footer-brand{width:110px}.footer-top p{font-size:.8125rem}.footer-bottom{font-size:.75rem}}
@media(max-width:430px){.hero-copy{padding-top:43px;padding-bottom:22px}.hero h1{font-size:clamp(2.9rem,11.5vw,3.5rem)}.hero-actions{flex-direction:column;align-items:flex-start;gap:20px}.hero-photo{height:300px}.discipline-inner{font-size:.875rem;letter-spacing:0;gap:6px}.service-grid{grid-template-columns:1fr;gap:32px}.service-card .image-button,.service-card:nth-child(-n+2) .image-button{height:355px}.service-copy{grid-template-columns:32px 1fr;column-gap:10px}.service-number{grid-column:1;grid-row:1 / 3;margin-top:3px}.service-copy h3,.service-copy p{grid-column:2}.service-copy h3{font-size:1.4rem}.service-card .image-label{font-size:.9375rem}.work-grid{grid-template-columns:1fr;gap:30px}.work-large{grid-column:auto}.work-large .image-button{height:425px}.work-small .image-button{height:290px}.about-copy h2{font-size:2.25rem}}
@media(prefers-reduced-motion:reduce){.hero-copy .eyebrow,.hero-copy h1,.hero-copy .hero-description,.hero-copy .hero-actions{animation:none}.hero-photo>img{transform:none;will-change:auto}}

/* Eigene Baustellenbilder: Hochformate bewahren und den Arbeitsstand erklären. */
.hero-photo>img{object-position:58% 48%}
.work-grid.project-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:30px}
.project-card{display:flex;flex-direction:column;min-width:0;margin:0}
.project-card .image-button{height:auto;aspect-ratio:3/4;flex-shrink:0}
.project-card .image-button img{object-position:50% 50%}
.project-grid figcaption{flex:1;gap:0;padding:22px 0 24px;border-bottom:1px solid #ced9d6}
.project-grid figcaption>span{color:var(--brand-dark);margin-bottom:12px;letter-spacing:.09em}
.project-grid h3{font-size:clamp(1.25rem,1.8vw,1.6rem);line-height:1.2;letter-spacing:-.025em;margin:0 0 13px}
.project-grid figcaption p{font-size:1rem;line-height:1.7;color:var(--muted);margin-bottom:22px}
.project-grid .text-link{margin-top:auto;font-size:.875rem;font-weight:500;display:inline-flex;align-items:center;gap:15px}
@media(max-width:900px){.work-grid.project-grid{gap:22px}.project-grid h3{font-size:1.25rem}.project-grid .text-link{gap:8px}}
@media(max-width:700px){.hero-photo>img{object-position:50% 62%}.work-grid.project-grid{grid-template-columns:1fr;gap:38px}.project-card .image-button{aspect-ratio:4/3}.project-grid figcaption{padding-top:19px}.project-grid h3{font-size:1.6rem}.project-grid .text-link{gap:15px}}
@media(max-width:430px){.project-card .image-button{aspect-ratio:1/1}}

/* Die Leistungsnamen bleiben auch auf kleinen Bildschirmen vollständig lesbar. */
.hero h1{font-size:clamp(3.3rem,5.7vw,5.6rem)}@media(max-width:700px){.hero h1{font-size:clamp(2.8rem,8.7vw,4.5rem)}}@media(max-width:430px){.hero h1{font-size:clamp(2.3rem,9.3vw,3.1rem)}}
