:root{--paper:#f5f2eb;--paper2:#e9e5db;--ink:#17201d;--muted:#58615b;--green:#86ab44;--green2:#739638;--line:rgba(23,32,29,.18);--serif:Georgia,"Times New Roman",serif;--sans:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;--max:1220px;--gutter:clamp(1.1rem,5vw,4.8rem)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:6rem}body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.65 var(--sans);-webkit-font-smoothing:antialiased}img{max-width:100%;height:auto}a{color:inherit;text-underline-offset:.24em}a:focus-visible,button:focus-visible{outline:3px solid #819d86;outline-offset:4px}.skip{position:absolute;left:-9999px;top:1rem;background:white;padding:1rem;z-index:100}.skip:focus{left:1rem}.wrap{width:min(var(--max),calc(100% - 2*var(--gutter)));margin-inline:auto}.header{position:relative;z-index:5;border-bottom:1px solid var(--line);background:var(--paper)}.header-inner{min-height:78px;display:flex;align-items:center;justify-content:space-between;gap:1.5rem}.brand{display:flex;flex-direction:column;text-decoration:none;font-weight:650;font-size:.98rem;letter-spacing:.19em;line-height:1.15}.brand small{font-size:.62rem;letter-spacing:.36em;margin-top:.4rem;font-weight:500}.nav{display:flex;align-items:center;gap:clamp(.8rem,2.5vw,2.2rem)}.nav a{text-decoration:none;font-size:.87rem}.nav-cta,.button{display:inline-flex;align-items:center;justify-content:center;gap:.8rem;background:var(--green);border:1px solid var(--green);color:#fff;padding:.82rem 1.15rem;text-decoration:none;font-size:.88rem}.nav-cta:hover,.button:hover{background:var(--green2);color:white}.button-light{background:#fff;border-color:#fff;color:#17201d}.button-light:hover{background:#e8eedf;border-color:#e8eedf;color:#17201d}.menu-toggle{display:none;border:1px solid var(--line);background:transparent;padding:.6rem .8rem;color:var(--ink);font:inherit}.eyebrow{text-transform:uppercase;letter-spacing:.25em;font-size:.68rem;font-weight:650;color:var(--muted);margin:0 0 1.2rem}.serif,h1,h2,h3{font-family:var(--serif);font-weight:400;letter-spacing:-.045em;line-height:1.02}h1{font-size:clamp(3.15rem,7.1vw,6.7rem);margin:0 0 1.35rem;max-width:850px}h2{font-size:clamp(2.35rem,5vw,4.6rem);margin:0 0 1.2rem}h3{font-size:clamp(1.45rem,2.2vw,2rem);margin:0 0 .7rem}.lead{font-size:clamp(1.08rem,1.7vw,1.28rem);max-width:640px;color:#3e4742}.hero{position:relative;isolation:isolate;overflow:hidden;min-height:600px;display:flex;align-items:center;background:#e8e4da url('/assets/img/webdesign-workspace.jpg') center right/cover no-repeat}.hero:after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,var(--paper) 0%,rgba(245,242,235,.96) 31%,rgba(245,242,235,.75) 48%,rgba(245,242,235,.1) 80%)}.hero-inner{padding-block:clamp(4rem,9vw,7.5rem)}.hero-copy{max-width:550px;margin:0 0 2rem;color:#414943}.actions{display:flex;align-items:center;gap:1.7rem;flex-wrap:wrap}.text-link{display:inline-flex;align-items:center;gap:.65rem;text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:.25rem}.hero-tag{position:absolute;right:var(--gutter);bottom:1.4rem;color:#fff;text-shadow:0 1px 8px #243329;font-size:.64rem;letter-spacing:.18em;text-transform:uppercase;max-width:180px}.section{padding-block:clamp(3.7rem,7vw,6.5rem)}.section-top{display:grid;grid-template-columns:1fr .8fr;gap:3rem;align-items:end;margin-bottom:2.4rem}.section-top>p{max-width:530px;color:var(--muted);margin:0 0 .3rem}.services{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--line)}.service{padding:1.45rem 1.2rem 1rem 0;margin-right:1.2rem;border-right:1px solid var(--line);display:flex;flex-direction:column;align-items:flex-start}.service:last-child{border-right:0;margin-right:0}.num{font-size:.73rem;letter-spacing:.12em;color:var(--muted);margin-bottom:1rem}.service p,.muted{color:var(--muted);font-size:.94rem}.service .text-link{margin-top:auto}.feature{background:var(--green);color:var(--paper)}.feature .eyebrow,.feature .muted{color:#d3dbd2}.feature-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(2rem,6vw,6rem);align-items:center}.feature-panel{min-height:330px;border:1px solid rgba(245,242,235,.25);padding:clamp(1.5rem,4vw,3rem);display:flex;flex-direction:column;justify-content:space-between;background:linear-gradient(145deg,rgba(134,171,68,.32),rgba(255,255,255,.08));box-shadow:inset 0 0 0 1px rgba(245,242,235,.12)}.feature-panel strong{font:clamp(2.2rem,4.4vw,4rem)/1 var(--serif);font-weight:400;letter-spacing:-.04em}.chips{display:flex;flex-wrap:wrap;gap:.7rem 1.2rem;border-top:1px solid rgba(245,242,235,.24);padding-top:1rem;font-size:.8rem;color:#d3dbd2}.about-grid{display:grid;grid-template-columns:.75fr 1.25fr;gap:clamp(2rem,7vw,7rem);align-items:center}.monogram{min-height:290px;background:var(--paper2);display:grid;place-items:center;color:var(--green);font:clamp(8rem,20vw,15rem)/.8 var(--serif);letter-spacing:-.13em}.about-copy p{max-width:680px;color:var(--muted)}.process-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1.3rem}.process-card{border-top:1px solid var(--line);padding-top:1rem}.process-card p{font-size:.92rem;color:var(--muted)}.faq-list{max-width:900px;border-top:1px solid var(--line)}details{border-bottom:1px solid var(--line);padding:1.1rem 0}summary{font:1.45rem/1.2 var(--serif);cursor:pointer}details p{max-width:780px;color:var(--muted)}.contact{background:var(--green);color:var(--paper)}.contact .eyebrow,.contact p{color:#d3dbd2}.contact-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:3rem;align-items:end}.contact-info{font-size:.95rem}.contact-info a{color:var(--paper)}.footer{background:#10231c;color:#d3dbd2;padding:1.3rem 0;font-size:.8rem}.footer-inner{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap}.footer-links{display:flex;gap:1rem;flex-wrap:wrap}.footer a{color:inherit}.page-hero{padding-block:clamp(4rem,9vw,7rem);border-bottom:1px solid var(--line)}.content{max-width:820px}.content h2{margin-top:2.5rem}.content p,.content li{max-width:780px}.content li{margin:.4rem 0}.notice{border-left:3px solid var(--green);padding:1rem 1.3rem;background:var(--paper2)}@media(max-width:900px){.header-inner{flex-wrap:wrap;padding-block:.8rem}.menu-toggle{display:inline-block;margin-left:auto}.nav{display:none;order:3;width:100%;align-items:flex-start;flex-direction:column;padding:.5rem 0 1rem;gap:1rem}.nav.open{display:flex}.nav-cta{display:none}.hero{min-height:570px}.hero:after{background:linear-gradient(90deg,var(--paper) 0%,rgba(245,242,235,.93) 38%,rgba(245,242,235,.55) 70%,rgba(245,242,235,.1) 100%)}.section-top,.feature-grid,.about-grid,.contact-grid{grid-template-columns:1fr}.services{grid-template-columns:repeat(2,minmax(0,1fr))}.service:nth-child(2){border-right:0;margin-right:0}.service:nth-child(3),.service:nth-child(4){border-top:1px solid var(--line)}.service:nth-child(4){border-right:0;margin-right:0}.process-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.monogram{min-height:220px}}@media(max-width:560px){.hero{min-height:610px;align-items:flex-start}.hero:after{background:linear-gradient(180deg,rgba(245,242,235,.97) 0%,rgba(245,242,235,.9) 48%,rgba(245,242,235,.3) 80%,rgba(20,43,34,.1) 100%)}.hero-inner{padding-top:4rem}.hero-tag{bottom:1rem}.actions{gap:1.1rem}.services,.process-grid{grid-template-columns:1fr}.service,.service:nth-child(n){border-right:0;border-top:1px solid var(--line);margin:0;padding:1.3rem 0}.service:first-child{border-top:0}.footer-inner{align-items:flex-start;flex-direction:column}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}}

/* Markenlogo und Markenfarbe */
.brand-logo{display:flex;flex-direction:row;align-items:center;letter-spacing:normal;max-width:360px;}
.brand-logo img{display:block;width:min(100%,330px);height:auto;}
.nav-cta,.button{color:#fff;}
.nav-cta:hover,.button:hover{background:#739638;}
@media(max-width:600px){.brand-logo{max-width:245px}.header-inner{gap:.7rem}.nav-cta{display:none}}

/* Webdesign-Motiv: ruhiger Workspace statt abstrakter Illustration */
@media(max-width:700px){.hero{background-position:58% center;min-height:560px}.hero:after{background:linear-gradient(90deg,rgba(245,242,235,.97) 0%,rgba(245,242,235,.88) 65%,rgba(245,242,235,.55) 100%)}}

/* Responsive Typografie und Porträt */
h1{font-size:clamp(2.45rem,6.2vw,6.7rem);line-height:1.02;overflow-wrap:break-word}
h2{font-size:clamp(2rem,4.5vw,4.6rem);line-height:1.06}
h3{font-size:clamp(1.35rem,2vw,2rem);line-height:1.12}
.hero-inner{width:min(var(--max),calc(100% - 2*var(--gutter)))}
.about-photo{min-width:0;overflow:hidden;background:var(--paper2);border-radius:2px;aspect-ratio:4/5}
.about-photo img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 38%}
.feature-panel{background:linear-gradient(135deg,#29451f 0%,#1a3025 65%,#172820 100%);border-color:rgba(245,242,235,.42);box-shadow:0 18px 48px rgba(15,35,28,.18)}
.feature-panel strong{font-size:clamp(2rem,4vw,4rem);line-height:1.05}
@media(max-width:900px){h1{font-size:clamp(2.5rem,7vw,4.6rem)}h2{font-size:clamp(2.1rem,5.5vw,3.5rem)}}
@media(max-width:560px){h1{font-size:clamp(2.25rem,10vw,3.5rem);letter-spacing:-.04em}h2{font-size:clamp(1.9rem,8vw,2.8rem)}h3{font-size:1.45rem}.about-photo{aspect-ratio:4/3;max-height:420px}.feature-panel{min-height:260px;padding:1.4rem}.feature-panel strong{font-size:clamp(2rem,8vw,3rem)}.contact-grid{gap:1.5rem}}