/* Quicksand lokal eingebunden – keine Verbindung zu Google Fonts */
@font-face{font-family:"Quicksand";src:url("fonts/Quicksand-Light.woff2") format("woff2");font-style:normal;font-weight:300;font-display:swap}
@font-face{font-family:"Quicksand";src:url("fonts/Quicksand-Regular.woff2") format("woff2");font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:"Quicksand";src:url("fonts/Quicksand-Medium.woff2") format("woff2");font-style:normal;font-weight:500;font-display:swap}
:root{--coral:#ff5d62;--coral-dark:#e94f55;--grey:#efefed;--mid:#969696;--ink:#272727;--white:#fff;--max:1280px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Arial,Helvetica,sans-serif;color:var(--ink);background:#fff;line-height:1.55}img{width:100%;display:block}a{color:inherit;text-decoration:none}.site-header{height:88px;max-width:var(--max);margin:auto;padding:12px 28px;display:flex;align-items:center;justify-content:space-between;position:relative;z-index:20}.brand img{width:116px;height:64px;object-fit:contain}.site-header nav{display:flex;gap:30px;font-size:14px;text-transform:uppercase;letter-spacing:.08em}.site-header nav a:hover{color:var(--coral)}.menu{display:none;border:0;background:none;font:inherit}.hero{min-height:calc(100vh - 88px);display:grid;grid-template-columns:42% 58%;max-width:var(--max);margin:auto;padding:24px 28px 72px;align-items:center}.hero-copy{padding-right:8vw}.eyebrow{text-transform:uppercase;letter-spacing:.16em;font-size:12px;font-weight:700;color:var(--coral);margin:0 0 20px}.hero h1,.section h2{font-size:clamp(42px,5.4vw,82px);line-height:.98;letter-spacing:-.045em;font-weight:400;margin:0 0 28px}.hero h1 span,.section h2 span{color:var(--coral)}.hero-copy>p:not(.eyebrow){max-width:550px;font-size:18px;color:#626262}.hero-image{height:min(72vh,720px);overflow:hidden}.hero-image img{height:100%;object-fit:cover}.button{display:inline-block;background:var(--coral);color:#fff;padding:15px 24px;margin-top:18px;font-weight:700;font-size:14px;letter-spacing:.04em}.button:hover{background:var(--coral-dark)}.section{max-width:var(--max);margin:auto;padding:120px 28px}.about{display:grid;grid-template-columns:1fr 1fr;gap:8vw;align-items:center;background:linear-gradient(90deg,var(--grey) 0 35%,#fff 35%)}.about-image{height:650px}.about-image img{height:100%;object-fit:cover}.copy h2,.section-head h2,.contact h2{font-size:clamp(40px,4.5vw,68px)}.copy p{max-width:600px;color:#555}.signature{margin-top:32px;font-weight:700;color:var(--ink)!important}.service{background:var(--grey)}.section-head{max-width:820px;margin-bottom:60px}.section-head>p:last-child{color:#666}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:2px}.cards article{background:#fff;padding:42px 34px;min-height:300px}.cards span,.steps b{color:var(--coral);font-size:13px}.cards h3,.steps h3{font-size:24px;font-weight:400;margin:50px 0 14px}.cards p,.steps p{color:#666}.audience{margin-top:2px;background:var(--coral);color:#fff;padding:22px 34px}.audience strong{margin-right:25px}.gallery{display:grid;grid-template-columns:repeat(2,1fr);gap:28px}.gallery figure{margin:0}.gallery figure img{aspect-ratio:1.35/1;object-fit:cover}.gallery figure.wide img{aspect-ratio:1.8/1}.gallery figcaption{padding:12px 0 28px;font-size:13px;text-transform:uppercase;letter-spacing:.08em;color:#777}.process{background:#252525;color:#fff;max-width:none;padding-left:max(28px,calc((100vw - var(--max))/2 + 28px));padding-right:max(28px,calc((100vw - var(--max))/2 + 28px))}.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:35px}.steps h3{margin:24px 0 10px}.steps p{color:#bbb}.contact{display:grid;grid-template-columns:1.2fr .8fr;gap:9vw;align-items:center}.contact>div:first-child>p:not(.eyebrow){max-width:600px;color:#666;font-size:18px}.contact-card{background:var(--grey);padding:32px}.contact-portrait{margin:0 0 28px}.contact-card img{height:310px;object-fit:cover;object-position:center 30%}.contact-portrait figcaption{margin-top:10px;font-size:12px;text-transform:uppercase;letter-spacing:.12em;color:#777}.contact-card a:hover{color:var(--coral)}footer{max-width:var(--max);margin:auto;border-top:1px solid #ddd;padding:28px;display:flex;justify-content:space-between;color:#777;font-size:13px}.legal{max-width:850px;margin:auto;padding:80px 28px}.legal h1{font-size:48px;font-weight:400}.legal h2{margin-top:40px}.legal a{color:var(--coral)}
@media(max-width:850px){.site-header nav{display:none;position:absolute;top:80px;left:20px;right:20px;background:#fff;padding:25px;flex-direction:column;box-shadow:0 10px 35px #0002}.site-header nav.open{display:flex}.menu{display:block}.hero{grid-template-columns:1fr;padding-top:50px}.hero-copy{padding:0 0 45px}.hero-image{height:55vh}.about{grid-template-columns:1fr;background:var(--grey);gap:45px}.about-image{height:480px}.cards,.steps{grid-template-columns:1fr 1fr}.contact{grid-template-columns:1fr}.gallery{gap:14px}.section{padding-top:85px;padding-bottom:85px}}@media(max-width:560px){.hero h1{font-size:45px}.cards,.steps,.gallery{grid-template-columns:1fr}.about-image{height:400px}.section{padding-left:20px;padding-right:20px}.site-header{padding-left:20px;padding-right:20px}footer{flex-direction:column;gap:12px}.contact-card img{height:280px}}
.service-full{display:grid;grid-template-columns:.85fr 1.15fr;gap:6vw;align-items:start}.service-full ul{margin:0;padding-left:1.2em;font-size:17px}.service-full li{margin:0 0 15px}.concept-visual{background:#fff;padding:18px}.concept-visual img{aspect-ratio:1.35/1;object-fit:cover;object-position:center}.concept-visual small{display:block;margin-top:12px;color:#777;text-transform:uppercase;letter-spacing:.07em}.packages{padding-top:120px}.package-layout{display:grid;grid-template-columns:1.25fr .75fr;gap:4vw;align-items:stretch}.package-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:2px}.package-grid article{background:var(--grey);padding:36px;min-height:300px}.package-grid article:last-child{grid-column:1/-1;min-height:220px}.package-grid span{font-size:12px;color:var(--coral);text-transform:uppercase;letter-spacing:.12em;font-weight:700}.package-grid h3{font-size:26px;font-weight:400;margin:22px 0 16px}.package-grid p{color:#5f5f5f}.package-grid .price{font-weight:700;color:var(--ink);margin-top:24px}.package-grid .note{font-size:13px}.package-image img{height:100%;min-height:520px;object-fit:cover}.portfolio-board{margin-top:28px;background:var(--grey);padding:20px}.portfolio-board img{width:100%;max-height:760px;object-fit:contain}
@media(max-width:850px){.service-full,.package-layout{grid-template-columns:1fr}.package-image img{min-height:0;height:480px}.package-grid{grid-template-columns:1fr}.package-grid article:last-child{grid-column:auto}}
@media(max-width:560px){.package-image img{height:340px}.service-full ul{font-size:16px}}

/* Contact layout: portrait left, complete logo right */
.contact-intro .contact-portrait{margin:34px 0 26px;max-width:470px}.contact-intro .contact-portrait img{width:100%;height:auto;aspect-ratio:1.28/1;object-fit:cover;object-position:center 34%}.contact-intro .contact-portrait figcaption{margin-top:10px;font-size:12px;text-transform:uppercase;letter-spacing:.12em;color:#777}.contact-card .contact-logo{display:block;width:min(260px,80%);height:auto;max-height:none;object-fit:contain;margin:0 auto 34px}.contact-card>p{margin-left:auto;margin-right:auto;max-width:300px}.contact-card{padding-top:38px;padding-bottom:38px}
@media(max-width:850px){.contact-intro .contact-portrait{max-width:560px}.contact-card .contact-logo{width:min(240px,75%)}}
/* v6: contact logo uses a rasterized full-square source to avoid SVG rendering/caching issues */
.contact-card .contact-logo{display:block!important;width:min(280px,86%)!important;height:auto!important;max-height:none!important;aspect-ratio:auto!important;object-fit:contain!important;object-position:center!important;margin:0 auto 34px!important}

/* v8: Quicksand for large headlines */
.hero h1,.section h2,.copy h2,.section-head h2,.contact h2{font-family:"Quicksand",Arial,Helvetica,sans-serif;font-weight:300;letter-spacing:-.018em;line-height:1.02}

/* v10: Quicksand headlines, 2px smaller than v8 */
.hero h1,.section h2{font-size:clamp(40px,calc(5.4vw - 2px),80px)}
.copy h2,.section-head h2,.contact h2{font-size:clamp(38px,calc(4.5vw - 2px),66px)}
@media(max-width:560px){.hero h1{font-size:43px}}

/* 2026 refresh: softer typography, complete uncropped images and mobile visual opening */
:root{--ink:#62656a;--soft-heading:#6b6d71}
.hero h1,.section h2,.copy h2,.section-head h2,.contact h2{color:var(--soft-heading)}
.eyebrow,.package-grid span,.gallery figcaption{font-family:"Quicksand",Arial,sans-serif;font-weight:500;letter-spacing:.075em;text-transform:none}
.eyebrow{font-size:14px}
.hero h1{line-height:1.1;overflow-wrap:normal}
.hero h1 span{color:var(--coral)}
.hero-image{height:auto;overflow:visible}
.hero-image img{width:100%;height:auto;object-fit:contain}
.about-image{height:auto}
.about-image img{height:auto;object-fit:contain}
.concept-visual img{aspect-ratio:auto;object-fit:contain}
.package-image img{height:auto;min-height:0;object-fit:contain}
.gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 30px;align-items:start}
.gallery figure,.gallery figure.feature,.gallery figure.plan{min-width:0;margin:0}
.gallery figure img,.gallery figure.wide img{width:100%;height:auto;aspect-ratio:auto;object-fit:contain;display:block}
.gallery figure.feature{grid-column:span 2}
.gallery figure.feature img{max-height:750px;object-fit:contain}
.gallery figure.plan{background:#f4f4f4;padding:16px 16px 0}
.gallery figcaption{padding:10px 2px 22px;color:#777;font-size:13px}
.mobile-hero-collage{display:none}
footer{flex-wrap:wrap;gap:10px 24px}
footer .ai-note{order:3;flex-basis:100%;font-size:12px;color:#888;max-width:760px;margin:4px 0 0}
@media(max-width:850px){.hero{display:flex;flex-direction:column;align-items:stretch;padding-top:20px}.hero-copy{order:2;padding-top:24px}.hero-image{order:3}.mobile-hero-collage{display:block;order:1;margin:0 0 12px}.mobile-hero-collage img{width:100%;height:auto;object-fit:contain}.gallery{gap:18px}.package-image img{height:auto}}
@media(max-width:560px){.hero{padding-top:12px;padding-bottom:54px;min-height:0}.hero h1{font-size:clamp(33px,8.3vw,43px)}.hero-copy>p:not(.eyebrow){font-size:16px}.gallery{grid-template-columns:1fr}.gallery figure.feature{grid-column:auto}.gallery figure.plan{padding:10px 10px 0}.mobile-hero-collage{margin-left:-8px;margin-right:-8px}.section-head{margin-bottom:34px}.eyebrow{font-size:13px}}

/* Revision: mobile hero starts directly with headline; no collage. */
.mobile-hero-collage{display:none!important}
@media(max-width:850px){.hero-copy{order:1;padding-top:0}.hero-image{order:2}}

/* Moodboards unter dem Beispielbild im Paketbereich */
.package-image{min-width:0;align-self:start}
.package-moodboards{display:grid;gap:20px;margin-top:30px}
.package-moodboards-label{margin:0 0 -5px;font-family:"Quicksand",Arial,sans-serif;font-size:17px;font-weight:400;color:#777}
.package-moodboard{margin:0;min-width:0}
.package-moodboard a{display:block;background:#fff;border:1px solid #e4e4e4;padding:7px;transition:border-color .2s}
.package-moodboard a:hover,.package-moodboard a:focus-visible{border-color:var(--coral)}
.package-moodboard img{display:block;width:100%;height:auto;max-height:none;object-fit:contain}
.package-moodboard figcaption{font-size:12px;color:#777;padding:7px 1px 0;line-height:1.45}
@media(max-width:850px){.package-moodboards{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.package-moodboards-label{grid-column:1/-1}}
@media(max-width:560px){.package-moodboards{grid-template-columns:1fr;gap:22px}.package-moodboards-label{grid-column:auto}.package-moodboard a{padding:5px}}

/* Moodboards beginnen direkt in der rechten Paketspalte. */
.package-moodboards{margin-top:0}

/* Layout correction: moodboard heading aligned to right-hand package column */
.package-moodboards-label{width:100%;margin:0 0 4px;text-align:left;font-size:17px;font-weight:500}
/* Full-width final living-room visual; original image ratio preserved */
.gallery figure.portfolio-final-wide{grid-column:1 / -1}
.gallery figure.portfolio-final-wide img{width:100%;height:auto;max-height:none;object-fit:contain;aspect-ratio:auto}
/* Contact details aligned with the left edge of the logo above */
.contact-card .contact-logo{width:min(280px,86%)!important;max-width:100%;margin:0 auto 34px!important}
.contact-card>p{width:min(280px,86%);max-width:none;margin-left:auto;margin-right:auto;text-align:left;box-sizing:border-box}
@media(max-width:560px){.gallery figure.portfolio-final-wide{grid-column:1 / -1}}

/* 2026-10-23: precise contact alignment and balanced portfolio rows */
/* The raster logo includes a narrow white inner margin: align copy to the visible white panel edge. */
.contact-card>p{padding-left:12px!important}
/* Pair landscape images at a shared visual height, preserving every pixel. */
@media(min-width:561px){
  .gallery figure.portfolio-item:not(.feature):not(.plan):not(.portfolio-final-wide) img{
    width:100%;height:clamp(230px,26vw,345px);object-fit:contain;object-position:center center;
    aspect-ratio:auto;max-width:none;
  }
}
/* Full-width portfolio finale, matching the feature image above. */
.gallery figure.portfolio-final-wide{grid-column:1/-1!important;width:100%;max-width:none}
.gallery figure.portfolio-final-wide img{display:block;width:100%!important;max-width:none!important;height:auto!important;max-height:none!important;object-fit:contain!important}
@media(max-width:560px){.contact-card>p{padding-left:10px!important}}

/* Zertifizierung unterhalb der Kontaktdaten, innerhalb der grau-beigen Karte */
.contact-card .contact-certificate{width:min(340px,100%);margin:36px auto 0;padding:25px 0 6px;border-top:1px solid #d1d0cd}
.contact-card .contact-certificate img{display:block;width:100%;height:auto!important;max-height:none!important;object-fit:contain!important;aspect-ratio:auto!important}
@media(max-width:560px){.contact-card .contact-certificate{width:100%;margin-top:30px;padding-top:22px}}

/* Zertifikat exakt auf dieselbe Breite wie der weiße Logokasten setzen. */
.contact-card .contact-certificate{width:min(280px,86%);max-width:100%;box-sizing:border-box}
@media(max-width:560px){.contact-card .contact-certificate{width:min(280px,86%)}}

/* Styling expertise: quiet editorial link within About section */
.styling-expertise{border-left:2px solid var(--coral);padding:5px 0 7px 23px;margin-top:35px;max-width:600px}
.styling-expertise h3{font-family:"Quicksand",Arial,sans-serif;font-weight:500;color:var(--soft-heading,#666);font-size:clamp(20px,2vw,27px);line-height:1.25;margin:0 0 13px}
.styling-expertise p{font-size:15px;line-height:1.7;margin:0 0 15px;color:#626262}
.styling-expertise a{display:inline-block;color:var(--coral-dark);font-weight:600;font-size:14px;border-bottom:1px solid currentColor;padding-bottom:3px}
.styling-expertise a:hover,.styling-expertise a:focus-visible{color:var(--ink)}
@media(max-width:560px){.styling-expertise{padding-left:17px;margin-top:27px}}

/* Kompaktes Zertifikat: ein Viertel der bisherigen Logokasten-Breite. */
.contact-card .contact-certificate{width:min(70px,86%)!important;margin:32px auto 0!important;padding:18px 0 0!important;border-top:1px solid #d1d0cd}
.contact-card .contact-certificate img{width:100%!important;height:auto!important}
/* Zertifikat: 20 % groesser als zuvor, linksbuendig zu den Kontaktdaten. */
.contact-card .contact-certificate{width:min(280px,86%)!important;margin:32px auto 0!important;padding:18px 0 0!important;border-top:1px solid #d1d0cd}
.contact-card .contact-certificate img{width:84px!important;max-width:calc(100% - 12px)!important;height:auto!important;margin:0 0 0 12px!important;object-fit:contain!important}
@media(max-width:560px){.contact-card .contact-certificate img{margin-left:10px!important;max-width:calc(100% - 10px)!important}}