/* W&S SanierungsService – eigenständiger responsiver Onepager
   Gestaltung: großzügig, editorial, klar; W&S-Blau statt Fremdmarken-Farben.
   Die Fotografien werden aktuell per URL von der W&S-Quelle und Unsplash geladen.
   Für die Produktion: gemäß README lokal speichern und Bildrechte prüfen. */
:root {
  --navy: #102c46;
  --navy-dark: #0a1d30;
  --navy-deep: #081726;
  --blue: #2366a0;
  --blue-bright: #4789c4;
  --blue-light: #dcecf7;
  --ice: #f2f6f9;
  --ice-deep: #e8f0f6;
  --white: #ffffff;
  --ink: #172939;
  --muted: #607181;
  --line: #e2e9ee;
  --line-dark: rgba(255,255,255,.2);
  --font: 'Avenir Next', Avenir, 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;
  --ease: cubic-bezier(.2,.7,.2,1);
  --container: 1320px;
}
*,*::before,*::after {box-sizing:border-box;}
html {scroll-behavior:smooth;scroll-padding-top:102px;}
body {margin:0;color:var(--ink);background:#fff;font:400 16px/1.7 var(--font);-webkit-font-smoothing:antialiased;}
img,svg {display:block;max-width:100%;}
a {color:inherit;text-decoration:none;}
button,input,textarea,select {font:inherit;}
button {cursor:pointer;}
button, input, textarea, select {outline-offset:3px;}
:focus-visible {outline:3px solid #7eb5dd;outline-offset:3px;}
::selection {background:#b2dbf6;color:var(--navy-dark);}
.svg-sprite {position:absolute;width:0;height:0;overflow:hidden;}
.icon {display:inline-block;vertical-align:middle;width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0;}
.container {width:min(calc(100% - 100px),var(--container));margin-inline:auto;}
.skip-link {position:fixed;z-index:999;top:-100px;left:24px;padding:12px 20px;background:#fff;color:#111;box-shadow:0 5px 30px #1114;}
.skip-link:focus {top:15px;}
.section {padding:136px 0;}
.eyebrow {display:flex;gap:13px;align-items:center;color:var(--blue);font-size:11px;font-weight:800;letter-spacing:.20em;line-height:1.4;text-transform:uppercase;}
.eyebrow-line {display:inline-block;height:2px;width:28px;background:currentColor;flex:none;}
.eyebrow-light {color:#a9d1ed;}
.section-heading {font-size:clamp(38px,4.3vw,64px);font-weight:650;letter-spacing:-.055em;line-height:1.115;margin:24px 0 32px;}
.heading-accent {color:var(--blue);}
.section-heading-row {display:flex;align-items:end;justify-content:space-between;gap:60px;margin-bottom:56px;}
.section-heading-row .section-heading {margin-bottom:0;}
.section-heading-row > p {color:var(--muted);max-width:407px;margin:0 0 8px;line-height:1.85;font-size:16px;}
.btn {display:inline-flex;align-items:center;justify-content:center;gap:26px;min-height:52px;padding:14px 25px;border:1px solid transparent;font-weight:750;font-size:12px;line-height:1.4;letter-spacing:.02em;transition:background .25s var(--ease), color .25s var(--ease), border-color .25s var(--ease), transform .25s var(--ease);}
.btn:hover {transform:translateY(-2px);}
.btn .icon {width:17px;height:17px;stroke-width:2;transition:transform .25s var(--ease);}
.btn:hover .icon,.text-link:hover .icon,.service-link:hover .icon {transform:translate(3px,-3px);}
.btn-primary {background:var(--blue);color:#fff;}
.btn-primary:hover {background:#16517f;}
.btn-white {background:#fff;color:var(--navy-dark);}
.btn-white:hover {background:#e9f3fa;}
.btn-outline-light {border-color:rgba(255,255,255,.46);color:#fff;background:transparent;}
.btn-outline-light:hover {border-color:#fff;background:rgba(255,255,255,.09);}
.btn-large {min-height:62px;padding:17px 28px;}
.text-link {display:inline-flex;align-items:center;gap:28px;padding:10px 0;border-bottom:1px solid #9bb9d1;color:var(--blue);font-size:13px;font-weight:800;transition:gap .2s ease;}
.text-link:hover {gap:36px;}
.text-link .icon {height:17px;width:17px;transition:transform .2s;}

/* Navigation */
.utility-bar {height:35px;background:var(--navy-dark);color:#b1c5d4;font-size:10px;font-weight:600;letter-spacing:.045em;}
.utility-inner {height:100%;display:flex;justify-content:space-between;align-items:center;}
.utility-inner .icon {width:13px;height:13px;margin-right:5px;stroke-width:2;}
.utility-location,.utility-links,.utility-links > span,.utility-links > a {display:flex;align-items:center;}
.utility-links {gap:30px;}
.utility-links a {color:#e4f2ff;transition:color .2s;}
.utility-links a:hover {color:#70b6e8;}
.site-header {height:95px;position:sticky;top:0;z-index:99;background:#fff;box-shadow:0 1px 0 rgba(19,50,75,.07);transition:height .25s, box-shadow .25s;}
.site-header.is-scrolled {height:81px;box-shadow:0 8px 30px rgba(16,44,70,.09);}
.nav-inner {height:100%;display:flex;align-items:center;gap:42px;justify-content:space-between;}
.brand {display:inline-flex;align-items:center;gap:15px;color:var(--navy);min-width:215px;}
.brand-mark {font-size:43px;font-weight:900;letter-spacing:-.115em;line-height:1;position:relative;white-space:nowrap;}
.brand-amp {color:var(--blue);font-weight:850;margin:0 3px 0 4px;}
.brand-square {position:absolute;width:7px;height:7px;background:var(--blue-bright);bottom:3px;right:-11px;}
.brand-label {font-size:10px;font-weight:800;letter-spacing:.11em;line-height:1.35;border-left:1px solid #ccdbe8;padding-left:15px;}
.brand-label span {display:block;letter-spacing:.10em;}
.site-nav {display:flex;align-items:center;gap:clamp(18px,2.35vw,37px);margin-left:auto;}
.site-nav > a {font-size:12px;font-weight:750;white-space:nowrap;color:#263b4c;transition:color .2s;}
.site-nav > a:hover,.site-nav > a:focus-visible {color:var(--blue);}
.btn-nav {background:var(--blue);color:#fff;font-size:11px;min-height:45px;padding:6px 7px 6px 18px;gap:20px;white-space:nowrap;}
.btn-nav:hover {background:var(--navy);}
.btn-icon {background:#ffffff25;display:grid;place-items:center;width:32px;height:32px;}
.mobile-contact,.nav-toggle {display:none !important;}

/* Hero */
.hero {position:relative;min-height:745px;color:#fff;isolation:isolate;overflow:hidden;background:#0b263e;}
.hero-photo {position:absolute;z-index:-3;inset:0 0 0 31%;background-image:url('assets/images/wohnraum.jpg');background-color:#56636b;background-size:cover;background-position:center 55%;transform:scale(1.015);}
.hero-overlay {z-index:-2;position:absolute;inset:0;background:linear-gradient(90deg,rgba(8,29,48,1) 0%,rgba(8,29,48,.98) 30%,rgba(8,29,48,.87) 42%,rgba(8,29,48,.56) 60%,rgba(8,29,48,.09) 100%),linear-gradient(0deg,rgba(5,19,34,.27),transparent 35%);}
.hero::after {content:"";position:absolute;z-index:-1;inset:0;opacity:.15;background:linear-gradient(90deg,transparent 49.89%,rgba(255,255,255,.24) 49.9%,transparent 50%);pointer-events:none;}
.hero-inner {position:relative;min-height:745px;display:flex;align-items:center;padding-top:45px;padding-bottom:60px;}
.hero-content {max-width:735px;position:relative;z-index:2;}
.hero h1 {font-size:clamp(56px,6.05vw,93px);letter-spacing:-.065em;line-height:1.045;font-weight:650;margin:31px 0 24px;}
.hero h1 span {color:#d9edf9;}
.hero-lead {font-size:16px;max-width:595px;line-height:1.9;color:#d2e2ef;margin:0 0 21px;}
.hero-points {list-style:none;margin:27px 0 35px;padding:0;display:grid;gap:10px;}
.hero-points li {display:flex;align-items:center;gap:11px;color:#f0f6fc;font-weight:550;font-size:13px;}
.hero-points .icon {width:18px;height:18px;color:#83c1ec;stroke-width:2.4;}
.hero-actions {display:flex;align-items:center;flex-wrap:wrap;gap:11px;}
.hero-side-note {position:absolute;right:0;bottom:47px;display:flex;align-items:center;gap:20px;font-size:10px;font-weight:800;letter-spacing:.19em;color:rgba(255,255,255,.88);writing-mode:vertical-rl;transform:rotate(180deg);}
.hero-side-note span:first-child {font-size:20px;letter-spacing:-.07em;color:#a9d1ed;}
.scroll-cue {position:absolute;bottom:34px;left:50%;transform:translateX(-50%);display:flex;gap:15px;align-items:center;color:rgba(255,255,255,.78);font-size:10px;font-weight:800;letter-spacing:.2em;}
.scroll-cue-line {height:1px;background:#9cc4dd;width:34px;}
.advantages-strip {position:relative;background:#fff;box-shadow:0 12px 45px rgba(13,38,60,.035);}
.advantages-inner {display:grid;grid-template-columns:repeat(4,1fr);padding:34px 0;}
.advantage-item {display:flex;align-items:center;gap:23px;min-height:48px;padding-inline:30px;border-right:1px solid var(--line);}
.advantage-item:first-child {padding-left:0;}
.advantage-item:last-child {border:none;padding-right:0;}
.advantage-index {color:var(--blue);font-size:12px;font-weight:900;align-self:flex-start;line-height:1.8;}
.advantage-item div {display:grid;gap:1px;}
.advantage-item strong {font-size:17px;line-height:1.3;font-weight:800;color:var(--navy-dark);}
.advantage-item div > span {font-size:12px;line-height:1.5;color:var(--muted);}

/* About */
.section-about {padding:145px 0 158px;overflow:hidden;}
.about-grid {display:grid;grid-template-columns:.93fr 1fr;gap:min(11vw,160px);align-items:center;}
.about-text {max-width:565px;}
.about-text .section-heading {margin-bottom:34px;}
.about-text p {color:#657687;line-height:1.92;margin:0 0 15px;}
.about-text .intro {font-size:19px;font-weight:680;color:var(--navy-dark);line-height:1.68;margin-bottom:25px;}
.about-text .text-link {margin-top:23px;}
.about-visual {position:relative;padding:0 0 60px 43px;}
.about-image {height:550px;position:relative;overflow:hidden;background:linear-gradient(135deg,#dfe8ef,#b7c9d2);}
.about-image::after {content:"";position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 0 1px #00000005;}
.about-image img {height:100%;width:100%;object-fit:cover;object-position:67% center;transition:transform .7s ease;}
.about-image:hover img {transform:scale(1.04);}
.about-stamp {position:absolute;bottom:-1px;left:-8px;background:var(--blue);color:#fff;padding:35px 40px 30px;width:265px;box-shadow:0 15px 50px rgba(12,61,99,.16);}
.stamp-small {color:#b8d5e7;font-size:9px;font-weight:800;letter-spacing:.17em;}
.about-stamp strong {font-size:23px;line-height:1.35;letter-spacing:-.03em;font-weight:750;display:block;margin:10px 0 19px;}
.stamp-line {height:1px;background:#ffffff66;width:100%;display:block;margin-bottom:10px;}
.about-stamp small {font-size:10px;color:#d4e8f5;letter-spacing:.03em;}
.about-decoration {position:absolute;top:-72px;right:-32px;z-index:-1;color:#eaf2f8;font-size:125px;font-weight:850;letter-spacing:-.12em;line-height:1;}
.about-decoration span {color:#d4e7f3;}

/* USP */
.section-why {background:var(--ice);padding-top:124px;padding-bottom:135px;}
.why-grid {display:grid;grid-template-columns:repeat(3,1fr);gap:15px;}
.why-card {position:relative;min-height:252px;background:#fff;padding:33px 34px 35px;border:1px solid #e6edf2;transition:transform .28s,box-shadow .28s,border-color .28s;}
.why-card:hover {transform:translateY(-4px);box-shadow:0 22px 60px rgba(17,57,91,.08);border-color:#cbddea;}
.why-icon {width:43px;height:43px;background:var(--blue-light);color:var(--blue);display:grid;place-items:center;margin-bottom:26px;}
.why-icon .icon {width:24px;height:24px;stroke-width:1.7;}
.why-number {position:absolute;top:31px;right:32px;color:#9eb5c7;font-size:10px;font-weight:850;letter-spacing:.1em;}
.why-card h3 {font-size:19px;line-height:1.3;letter-spacing:-.02em;margin:0 0 10px;color:var(--navy-dark);}
.why-card p {font-size:13px;color:#71818f;line-height:1.85;margin:0;max-width:330px;}

/* Services */
.section-services {padding-top:140px;padding-bottom:125px;}
.services-heading-row {margin-bottom:52px;}
.services-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:23px;}
.service-card {display:flex;flex-direction:column;border:1px solid var(--line);background:#fff;min-height:760px;transition:transform .3s,box-shadow .3s;overflow:hidden;}
.service-card:hover {transform:translateY(-6px);box-shadow:0 28px 80px rgba(8,31,50,.10);}
.service-photo {height:272px;flex:none;background-color:#a9bbc6;background-size:cover;background-position:center;position:relative;overflow:hidden;}
.service-photo:before {content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.15),transparent 50%);}
.service-photo-electro {background-image:url('assets/images/wohnraum.jpg');background-position:57% 30%;}
.service-photo-bath {background-image:url('assets/images/bad-sanierung.jpg');background-position:center 56%;}
.service-photo-complete {background-image:url('assets/images/ws-sanierung.jpg');background-position:80% center;}
.service-counter {position:absolute;top:23px;left:24px;background:#fff;color:var(--navy);font-weight:800;font-size:13px;padding:8px 14px;letter-spacing:.1em;}
.service-body {padding:37px 34px 30px;display:flex;flex-direction:column;flex:1;}
.service-icon {height:42px;width:42px;background:#ecf5fb;color:var(--blue);display:grid;place-items:center;margin-bottom:19px;}
.service-icon .icon {width:23px;height:23px;}
.service-body h3 {font-size:24px;letter-spacing:-.035em;line-height:1.24;font-weight:750;color:var(--navy-dark);margin:0 0 16px;}
.service-body > p {font-size:13px;line-height:1.85;color:#657787;margin:0 0 23px;}
.check-list {list-style:none;padding:20px 0 22px;margin:0 0 20px;border-top:1px solid var(--line);display:grid;gap:13px;}
.check-list li {font-size:12px;line-height:1.6;color:#42576a;position:relative;padding-left:23px;}
.check-list li:before {content:'✓';position:absolute;left:0;top:0;color:var(--blue);font-size:13px;font-weight:850;}
.service-link {display:flex;align-items:center;justify-content:space-between;gap:10px;padding:16px 0 0;border-top:1px solid var(--line);color:var(--blue);font-size:12px;font-weight:850;letter-spacing:.02em;margin-top:auto;}
.service-link .icon {width:18px;height:18px;transition:transform .25s;}

/* Trades band */
.trades-band {background:var(--navy);color:#fff;overflow:hidden;position:relative;}
.trades-band:after {content:"";position:absolute;right:-180px;bottom:-320px;height:650px;width:650px;border:1px solid rgba(255,255,255,.07);border-radius:50%;box-shadow:0 0 0 80px rgba(255,255,255,.018),0 0 0 160px rgba(255,255,255,.015);}
.trades-inner {min-height:410px;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:80px;padding:75px 0;position:relative;z-index:1;}
.trades-intro h2 {font-size:clamp(32px,3.7vw,50px);line-height:1.17;letter-spacing:-.05em;margin:21px 0 16px;font-weight:700;}
.trades-intro p {font-size:14px;line-height:1.85;color:#c4d6e3;max-width:480px;margin:0 0 23px;}
.trades-tags {display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.trades-tags span {border:1px solid rgba(255,255,255,.23);padding:21px 19px;font-size:14px;font-weight:600;color:#eaf4fa;background:rgba(255,255,255,.025);transition:background .2s;}
.trades-tags span:hover {background:rgba(255,255,255,.11);}

/* Steps */
.section-process {background:#f8fafb;padding-top:135px;padding-bottom:145px;}
.steps {display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid #d9e4ec;}
.step {padding:25px 32px 22px 0;position:relative;}
.step:not(:last-child):after {content:"";position:absolute;right:22px;top:30px;bottom:0;border-right:1px solid #d9e4ec;}
.step-top {display:flex;align-items:center;justify-content:space-between;color:var(--blue);margin-bottom:35px;padding-right:44px;}
.step-top span {font-size:66px;font-weight:750;letter-spacing:-.075em;line-height:1;}
.step-top .icon {width:22px;height:22px;stroke-width:1.5;}
.step h3 {font-size:20px;letter-spacing:-.03em;line-height:1.35;margin:0 24px 13px 0;max-width:220px;color:var(--navy-dark);}
.step p {color:#728292;line-height:1.85;font-size:13px;margin:0 30px 0 0;}

/* Testimonial/ref */
.section-reference {min-height:590px;display:grid;grid-template-columns:1fr 1fr;position:relative;color:#fff;background:var(--navy-dark);}
.reference-image {background-image:url('assets/images/wohnraum.jpg');background-position:50% center;background-size:cover;background-color:#8e9ea9;}
.reference-panel {background:var(--blue);display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding:80px clamp(45px,8.3vw,130px);}
.reference-panel h2 {font-size:clamp(38px,3.65vw,57px);font-weight:680;letter-spacing:-.05em;line-height:1.17;margin:23px 0 3px;}
.reference-panel h2 em {font-style:normal;color:#c4e5f8;}
.quote-mark {height:60px;color:#c0e2fa;font-size:94px;line-height:1.25;font-family:Georgia,serif;opacity:.75;}
.reference-panel blockquote {font-size:clamp(15px,1.2vw,19px);line-height:1.75;margin:20px 0 23px;max-width:590px;font-weight:550;}
.reference-source {font-size:11px;color:#d9eaf6;letter-spacing:.06em;margin:0 0 28px;}
.reference-picture-caption {position:absolute;left:20px;bottom:13px;color:#fff;font-size:10px;text-shadow:0 1px 5px #111b;}

/* Team */
.section-team {padding-top:146px;padding-bottom:152px;}
.team-grid {display:grid;grid-template-columns:1fr 1fr;gap:27px;max-width:1075px;margin:0 auto;}
.team-card {background:#f2f6f8;border:1px solid #e4ebef;overflow:hidden;}
.team-image {height:445px;background:#edf2f6;overflow:hidden;}
.team-image img {width:100%;height:100%;object-fit:cover;object-position:center 33%;filter:saturate(.83);transition:transform .65s ease,filter .4s;}
.team-card:hover img {transform:scale(1.035);filter:saturate(1);}
.team-card-bottom {display:flex;align-items:center;justify-content:space-between;padding:25px 30px 29px;gap:20px;}
.team-card-bottom span {font-size:10px;font-weight:800;color:var(--blue);letter-spacing:.16em;}
.team-card-bottom h3 {color:var(--navy-dark);font-size:25px;letter-spacing:-.035em;margin:7px 0 0;line-height:1.3;}
.team-card-bottom > a {width:46px;height:46px;display:grid;place-items:center;background:var(--blue);color:#fff;transition:background .2s,transform .2s;flex:none;}
.team-card-bottom > a:hover {background:var(--navy);transform:translateY(-2px);}
.team-card-bottom > a .icon {height:21px;width:21px;}

/* FAQ */
.section-faq {background:var(--ice);padding-top:130px;padding-bottom:137px;}
.faq-grid {display:grid;grid-template-columns:.8fr 1.2fr;gap:min(13vw,180px);align-items:start;}
.faq-intro p {color:#607383;max-width:360px;line-height:1.9;margin:15px 0 27px;}
.faq-items {border-top:1px solid #cbd9e4;}
.faq-items details {border-bottom:1px solid #cbd9e4;}
.faq-items summary {list-style:none;display:flex;align-items:center;justify-content:space-between;gap:16px;cursor:pointer;padding:23px 0;font-weight:800;font-size:15px;color:var(--navy-dark);}
.faq-items summary::-webkit-details-marker {display:none;}
.faq-items p {color:#5f7587;line-height:1.85;font-size:13px;margin:-4px 53px 25px 0;}
.faq-plus {width:33px;height:33px;display:grid;place-items:center;border:1px solid #c4d8e5;color:var(--blue);flex:none;transition:background .25s;}
.faq-plus .icon {width:16px;height:16px;stroke-width:1.7;transition:transform .25s;}
.faq-items details[open] .faq-plus {background:var(--blue);color:#fff;border-color:var(--blue);}
.faq-items details[open] .faq-plus .icon {transform:rotate(45deg);}

/* CTA */
.contact-cta {background:linear-gradient(115deg,#123d67,#1b5989);color:#fff;text-align:center;padding:98px 0 108px;position:relative;overflow:hidden;}
.cta-inner {position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;}
.contact-cta h2 {font-size:clamp(45px,5.6vw,78px);line-height:1.1;letter-spacing:-.065em;font-weight:670;margin:24px 0 15px;}
.contact-cta h2 em {color:#c0e1f7;font-style:normal;}
.contact-cta p {max-width:550px;color:#d2e6f5;font-size:15px;line-height:1.8;margin:0 0 30px;}
.cta-decor {position:absolute;right:3%;top:3%;font-size:clamp(200px,30vw,500px);font-weight:850;letter-spacing:-.15em;line-height:1;opacity:.035;white-space:nowrap;pointer-events:none;}

/* Contact */
.section-contact {padding-top:145px;padding-bottom:160px;}
.contact-grid {display:grid;grid-template-columns:.85fr 1.15fr;gap:min(9vw,128px);align-items:start;}
.contact-info .section-heading {font-size:clamp(35px,4vw,56px);}
.contact-intro {font-size:16px;line-height:1.9;color:#6b7d8c;max-width:430px;margin:0 0 42px;}
.contact-details {display:grid;gap:26px;}
.contact-detail {display:flex;align-items:flex-start;gap:19px;}
.contact-detail-icon {height:43px;width:43px;display:grid;place-items:center;background:#ebf4fa;color:var(--blue);flex:none;}
.contact-detail-icon .icon {height:19px;width:19px;}
.contact-detail > div {display:grid;gap:4px;}
.contact-detail > div > span {font-size:10px;letter-spacing:.16em;font-weight:800;color:#7a92a5;}
.contact-detail a,.contact-detail p {font-size:16px;line-height:1.55;color:var(--navy-dark);font-weight:700;margin:0;}
.contact-detail a:hover {color:var(--blue);}
.contact-form-wrap {background:#f4f8fa;border:1px solid #e3ebef;padding:44px 47px 42px;box-shadow:0 16px 65px rgba(13,50,81,.045);}
.form-top {display:flex;justify-content:space-between;gap:20px;align-items:center;font-size:10px;letter-spacing:.15em;font-weight:800;color:var(--blue);}
.form-top span:last-child {display:flex;align-items:center;gap:7px;font-size:14px;letter-spacing:-.03em;}
.form-top .icon {width:14px;height:14px;}
.contact-form-wrap h3 {margin:23px 0 3px;font-size:30px;line-height:1.2;font-weight:700;letter-spacing:-.04em;color:var(--navy-dark);}
.contact-form-wrap > p {font-size:13px;line-height:1.8;color:#708392;margin:0 0 29px;}
.contact-form-wrap form {display:flex;flex-direction:column;gap:17px;}
.form-row {display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.contact-form-wrap label {display:flex;flex-direction:column;gap:7px;color:#324b5d;font-size:12px;font-weight:800;}
.contact-form-wrap label > span {color:var(--blue);}
.contact-form-wrap label small {font-weight:500;color:#91a0ad;}
.contact-form-wrap input,.contact-form-wrap select,.contact-form-wrap textarea {display:block;appearance:none;border:1px solid #d7e2e9;border-radius:0;background:#fff;padding:12px 13px;min-height:46px;width:100%;color:var(--navy-dark);font-size:13px;font-weight:500;transition:border-color .2s,box-shadow .2s;}
.contact-form-wrap input:focus,.contact-form-wrap select:focus,.contact-form-wrap textarea:focus {border-color:var(--blue);box-shadow:0 0 0 2px #d8eaf5;outline:none;}
.contact-form-wrap input::placeholder,.contact-form-wrap textarea::placeholder {color:#a0adba;}
.contact-form-wrap select {background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%232366a0' stroke-width='2'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;padding-right:35px;}
.contact-form-wrap textarea {min-height:128px;resize:vertical;}
.form-privacy {color:#708493;font-weight:500;font-size:11px;line-height:1.75;}
.btn-submit {align-self:flex-start;min-width:220px;margin-top:2px;justify-content:space-between;}
.form-feedback {font-size:12px;font-weight:650;color:#27684a;min-height:0;line-height:1.5;margin:0;}
.form-feedback:empty {display:none;}
.form-alternative {font-size:11px;color:#708493;margin:0;}
.form-alternative a {text-decoration:underline;color:var(--blue);font-weight:700;}

/* Footer */
.site-footer {background:var(--navy-deep);color:#c0d2df;}
.footer-main {display:grid;grid-template-columns:1.45fr .6fr 1.1fr 1fr;gap:70px;padding:78px 0 90px;}
.brand-footer {color:#fff;}
.brand-footer .brand-amp {color:#86bde4;}
.brand-footer .brand-label {color:#d1e2ed;border-color:#657b8e;}
.footer-about p {font-size:12px;line-height:1.9;color:#9ab0c1;margin:23px 0 0;max-width:300px;}
.footer-col {display:flex;flex-direction:column;align-items:flex-start;gap:10px;}
.footer-col h3 {font-size:11px;font-weight:850;text-transform:uppercase;letter-spacing:.14em;color:#fff;margin:0 0 13px;}
.footer-col a,.footer-col span {font-size:12px;color:#a7bac9;line-height:1.65;}
.footer-col a:hover {color:#fff;}
.footer-talk p {font-size:12px;color:#a7bac9;margin:0 0 3px;}
.footer-talk .footer-big-link {display:flex;align-items:center;gap:15px;color:#fff;font-weight:700;font-size:22px;letter-spacing:-.035em;border-bottom:1px solid #487598;padding:0 0 12px;white-space:nowrap;}
.footer-talk .footer-big-link .icon {height:22px;width:22px;color:#85c4f1;}
.footer-bottom {display:flex;align-items:center;justify-content:space-between;gap:30px;border-top:1px solid #ffffff25;min-height:75px;color:#7e9ab0;font-size:11px;}
.footer-bottom > div {display:flex;gap:25px;}
.footer-bottom a:hover {color:#fff;}
.back-to-top {position:fixed;right:25px;bottom:25px;width:48px;height:48px;border:1px solid #ffffff40;background:var(--blue);display:grid;place-items:center;z-index:55;box-shadow:0 9px 30px #102c4655;opacity:0;visibility:hidden;transform:translateY(10px);transition:all .22s;}
.back-to-top.is-visible {opacity:1;visibility:visible;transform:translateY(0);}
.back-to-top:hover {background:var(--navy);}
.back-to-top .icon {transform:rotate(-90deg);color:#fff;}

/* Subpage legal notice draft */
.legal-hero {background:var(--navy);color:#fff;padding:105px 0 85px;}
.legal-hero h1 {font-size:clamp(45px,5vw,70px);letter-spacing:-.06em;line-height:1.15;margin:22px 0;}
.legal-content {max-width:800px;padding:90px 0 110px;}
.legal-content h2 {font-size:24px;color:var(--navy);margin-top:34px;letter-spacing:-.035em;}
.legal-content p,.legal-content li {color:#586b7a;line-height:1.9;}
.legal-note {padding:20px 24px;border-left:4px solid var(--blue);background:#eaf3fa;color:#20435e;font-size:14px;font-weight:700;line-height:1.7;}

/* Reveal: visibility by default; animations are progressive enhancement only. */
.js .reveal {opacity:0;transform:translateY(27px);transition:opacity .72s var(--ease),transform .72s var(--ease);}
.js .reveal.is-revealed {opacity:1;transform:none;}

@media(max-width:1220px){
 .container {width:min(calc(100% - 72px),var(--container));}
 .nav-inner {gap:24px;}
 .site-nav {gap:17px;}
 .brand {min-width:195px;}
 .brand-mark {font-size:38px;}
 .brand-label {font-size:9px;padding-left:12px;}
 .btn-nav {gap:8px;padding-left:13px;}
 .hero h1 {font-size:clamp(58px,6vw,76px);}
 .about-grid {gap:75px;}
 .footer-main {gap:36px;}
}
@media(max-width:980px){
 html {scroll-padding-top:75px;}
 .utility-bar {display:none;}
 .site-header {height:76px;}
 .site-header.is-scrolled {height:70px;}
 .container {width:min(calc(100% - 56px),var(--container));}
 .brand {min-width:unset;}
 .brand-mark {font-size:38px;}
 .brand-label {font-size:9px;}
 .btn-nav {margin-left:auto;}
 .nav-toggle {display:grid !important;place-items:center;width:44px;height:44px;background:#eff6fa;color:var(--navy);border:1px solid #d5e6f0;flex:none;}
 .nav-toggle .icon {width:22px;height:22px;}
 .nav-toggle .icon-close {display:none;}
 .nav-toggle[aria-expanded="true"] .icon-close {display:block;}
 .nav-toggle[aria-expanded="true"] .icon-menu {display:none;}
 .site-nav {display:none;position:absolute;top:100%;left:0;right:0;background:#fff;padding:12px 28px 25px;border-top:1px solid var(--line);box-shadow:0 24px 30px rgba(18,50,76,.1);flex-direction:column;align-items:stretch;gap:0;}
 .site-nav.is-open {display:flex;}
 .site-nav > a {padding:12px 0;border-bottom:1px solid var(--line);font-size:14px;}
 .site-nav > a.mobile-contact {display:flex !important;justify-content:space-between;background:var(--blue);color:#fff;margin-top:19px;padding:12px 16px;border:0;}
 .section {padding:92px 0;}
 .hero,.hero-inner {min-height:660px;}
 .hero-photo {left:18%;}
 .hero-overlay {background:linear-gradient(90deg,rgba(8,29,48,.98),rgba(8,29,48,.83) 55%,rgba(8,29,48,.45));}
 .hero h1 {font-size:clamp(49px,7.1vw,76px);}
 .hero-lead {max-width:540px;}
 .advantages-inner {grid-template-columns:repeat(2,1fr);padding:20px 0;gap:0;}
 .advantage-item {padding:20px 25px;border-right:0;border-bottom:1px solid var(--line);}
 .advantage-item:nth-child(odd) {padding-left:0;border-right:1px solid var(--line);}
 .advantage-item:nth-last-child(-n+2) {border-bottom:0;}
 .about-grid {grid-template-columns:1fr 1fr;gap:40px;}
 .about-image {height:455px;}
 .about-visual {padding-left:12px;}
 .about-stamp {width:210px;padding:24px;left:-15px;bottom:10px;}
 .about-stamp strong {font-size:20px;}
 .section-heading {font-size:clamp(39px,4.4vw,52px);}
 .section-heading-row {gap:25px;}
 .why-grid {grid-template-columns:repeat(2,1fr);}
 .services-grid {gap:14px;}
 .service-body {padding:24px 20px 25px;}
 .service-photo {height:220px;}
 .service-body h3 {font-size:21px;}
 .trades-inner {gap:50px;}
 .steps {grid-template-columns:repeat(2,1fr);}
 .step {padding-bottom:37px;}
 .step:nth-child(2):after {display:none;}
 .step:nth-child(1),.step:nth-child(2) {border-bottom:1px solid #d9e4ec;}
 .reference-panel {padding:65px 40px;}
 .team-image {height:360px;}
 .faq-grid {gap:60px;}
 .contact-grid {gap:50px;}
 .contact-form-wrap {padding:32px;}
 .footer-main {grid-template-columns:1.2fr 1fr 1fr;gap:36px;}
 .footer-talk {grid-column:1 / -1;flex-direction:row;align-items:center;gap:20px;border-top:1px solid #ffffff25;padding-top:20px;}
 .footer-talk h3,.footer-talk p {margin:0;}
 .footer-talk .footer-big-link {margin-left:auto;}
}
@media(max-width:720px){
 .container {width:calc(100% - 38px);}
 .site-header,.site-header.is-scrolled {height:69px;}
 .nav-inner {gap:12px;}
 .brand-mark {font-size:35px;}
 .brand-label {font-size:8px;padding-left:11px;}
 .btn-nav {display:none;}
 .nav-toggle {margin-left:auto;}
 .site-nav {padding:10px 19px 24px;}
 .section {padding:77px 0;}
 .eyebrow {font-size:10px;letter-spacing:.17em;}
 .section-heading {font-size:clamp(36px,9.2vw,48px);letter-spacing:-.055em;margin:19px 0 25px;}
 .section-heading-row {display:block;margin-bottom:38px;}
 .section-heading-row .section-heading {margin-bottom:19px;}
 .section-heading-row > p {font-size:14px;line-height:1.8;}
 .hero,.hero-inner {min-height:710px;}
 .hero-inner {align-items:center;padding:68px 0 85px;}
 .hero-photo {inset:0;background-position:59% center;}
 .hero-overlay {background:linear-gradient(90deg,rgba(8,29,48,.93),rgba(8,29,48,.78)),linear-gradient(0deg,#081d30a0,transparent 50%);}
 .hero h1 {font-size:clamp(47px,10.4vw,69px);margin:24px 0 22px;}
 .hero-lead {font-size:14px;line-height:1.85;}
 .hero-points {margin:22px 0 29px;gap:10px;}
 .hero-points li {font-size:12px;}
 .hero-actions {gap:10px;align-items:stretch;}
 .hero-actions .btn {width:100%;min-height:51px;justify-content:space-between;}
 .hero-side-note {display:none;}
 .scroll-cue {bottom:15px;font-size:8px;left:19px;transform:none;}
 .advantages-inner {grid-template-columns:1fr 1fr;padding:10px 0;}
 .advantage-item {padding:14px 10px !important;gap:10px;min-height:70px;align-items:flex-start;}
 .advantage-item:nth-child(even) {padding-left:16px !important;}
 .advantage-item strong {font-size:13px;}
 .advantage-item div > span {font-size:10px;}
 .advantage-index {font-size:10px;}
 .about-grid {grid-template-columns:1fr;gap:45px;}
 .about-text p {font-size:14px;}
 .about-text .intro {font-size:17px;}
 .about-visual {padding:0 0 40px 25px;}
 .about-image {height:min(112vw,465px);}
 .about-stamp {left:0;bottom:0;}
 .about-decoration {top:-35px;right:10px;font-size:65px;}
 .section-why {padding-top:80px;padding-bottom:85px;}
 .why-grid {grid-template-columns:1fr 1fr;gap:10px;}
 .why-card {min-height:235px;padding:22px 18px;}
 .why-icon {margin-bottom:24px;width:38px;height:38px;}
 .why-icon .icon {width:21px;height:21px;}
 .why-number {right:17px;top:22px;}
 .why-card h3 {font-size:16px;}
 .why-card p {font-size:12px;line-height:1.65;}
 .services-grid {grid-template-columns:1fr;gap:24px;}
 .service-card {min-height:unset;}
 .service-photo {height:260px;}
 .service-body {padding:29px 25px 25px;}
 .service-body h3 {font-size:24px;}
 .service-body > p {font-size:14px;}
 .check-list li {font-size:13px;}
 .trades-inner {grid-template-columns:1fr;gap:28px;padding:66px 0;}
 .trades-tags {gap:9px;}
 .trades-tags span {padding:15px 12px;font-size:12px;}
 .steps {grid-template-columns:1fr;}
 .step {padding:22px 0 29px;border-bottom:1px solid #d9e4ec;}
 .step::after {display:none !important;}
 .step:nth-last-child(1) {border-bottom:0;}
 .step-top {margin-bottom:20px;}
 .step-top span {font-size:51px;}
 .step h3 {font-size:19px;max-width:unset;}
 .step p {font-size:13px;max-width:490px;}
 .section-reference {grid-template-columns:1fr;}
 .reference-image {min-height:300px;}
 .reference-panel {padding:68px 25px 73px;}
 .reference-panel h2 {font-size:40px;}
 .reference-panel blockquote {font-size:16px;}
 .reference-picture-caption {top:270px;bottom:auto;}
 .team-grid {grid-template-columns:1fr;gap:25px;}
 .team-image {height:380px;}
 .section-team {padding-bottom:94px;}
 .faq-grid {grid-template-columns:1fr;gap:28px;}
 .faq-intro p {font-size:14px;}
 .faq-items summary {font-size:14px;line-height:1.4;}
 .contact-cta {padding:79px 0;}
 .contact-cta h2 {font-size:clamp(45px,9vw,64px);}
 .contact-cta p {font-size:13px;}
 .contact-grid {grid-template-columns:1fr;gap:52px;}
 .contact-intro {font-size:14px;margin-bottom:31px;}
 .contact-details {grid-template-columns:1fr 1fr;gap:20px 9px;}
 .contact-detail {gap:9px;}
 .contact-detail-icon {width:35px;height:35px;}
 .contact-detail-icon .icon {width:15px;height:15px;}
 .contact-detail a,.contact-detail p {font-size:12px;word-break:break-word;}
 .contact-detail > div > span {font-size:8px;line-height:1.4;}
 .contact-form-wrap {padding:28px 18px 30px;}
 .contact-form-wrap h3 {font-size:27px;}
 .footer-main {grid-template-columns:1fr 1fr;gap:42px 15px;padding:60px 0 55px;}
 .footer-about {grid-column:1/-1;}
 .footer-col h3 {margin-bottom:8px;}
 .footer-talk {display:block;grid-column:1/-1;}
 .footer-talk h3 {margin:0 0 12px;}
 .footer-talk p {margin:0 0 10px;}
 .footer-talk .footer-big-link {max-width:220px;}
 .footer-bottom {align-items:flex-start;flex-direction:column;gap:10px;padding:20px 0;min-height:unset;}
 .footer-bottom > div {gap:16px;flex-wrap:wrap;}
 .back-to-top {right:12px;bottom:12px;width:42px;height:42px;}
 .legal-hero {padding:75px 0 60px;}
 .legal-content {padding:60px 0 75px;}
}
@media(max-width:390px){
 .hero h1 {font-size:43px;}
 .hero-points li {font-size:11px;}
 .why-grid {grid-template-columns:1fr;}
 .why-card {min-height:unset;}
 .brand-label {font-size:7px;}
 .contact-details {grid-template-columns:1fr;gap:21px;}
 .contact-detail a,.contact-detail p {font-size:14px;}
 .form-row {grid-template-columns:1fr;gap:17px;}
}
@media(prefers-reduced-motion:reduce){
 *,*::before,*::after {scroll-behavior:auto !important;animation-duration:.01ms !important;transition-duration:.01ms !important;}
 .js .reveal {opacity:1;transform:none;}
}


/* Echtes W&S-Firmenlogo als lokale Original-SVG in assets/images/. */
.brand-logo {display:block;width:auto;max-width:238px;height:58px;max-height:100%;object-fit:contain;object-position:left center;flex:none;}
.brand-logo[hidden],.brand-fallback[hidden] {display:none !important;}
.brand-fallback {display:inline-flex;align-items:center;gap:15px;}
.brand-footer .brand-logo {height:50px;max-width:250px;background:#fff;border-radius:3px;padding:7px 12px;box-sizing:content-box;}
@media(max-width:980px) { .brand-logo {height:49px;max-width:207px;} }
@media(max-width:720px) { .brand-logo {height:45px;max-width:195px;} }
@media(max-width:390px) { .brand-logo {height:41px;max-width:170px;} }