:root{--accent:#f58216}body{background:#faf9f6}.hero{position:relative;overflow:hidden}.hero:before{content:"";position:absolute;right:-160px;top:80px;width:610px;height:610px;background:#f58216;border-radius:50%;z-index:-1}.new-hero{gap:45px;min-height:650px}.hero-project{transform:rotate(-3deg);box-shadow:0 30px 70px #31291f30;border:7px solid #fff}.hero-project img{aspect-ratio:1.28}.new-hero h1{font-size:clamp(46px,5vw,78px)}.new-hero h1 em{color:#df6b00}.landing-summary{padding-bottom:65px}.landing-summary .web-benefits{gap:55px}.landing-summary h2{border-top:4px solid #f58216;padding-top:22px}.home-service{padding-top:95px;padding-bottom:95px;gap:60px}.home-service-image{transform:rotate(2deg);box-shadow:0 20px 40px #0002;border:0}.home-service-image img{aspect-ratio:1.15}.home-service-image>span{background:#fff;padding:20px}.home-service#werbetechnik{position:relative;background:#292b2b;color:#fff;box-shadow:0 0 0 100vmax #292b2b;clip-path:inset(0 -100vmax)}.home-service#werbetechnik .home-service-copy>p:not(.eyebrow){color:#d7d7d2}.home-service#werbetechnik .home-service-image{transform:rotate(-2deg)}.home-service#werbetechnik h2{font-size:clamp(38px,4.5vw,64px)}.home-service#werbetechnik .text-link{color:#fff}.final-cta{position:relative;background:#f58216;box-shadow:0 0 0 100vmax #f58216;clip-path:inset(0 -100vmax);color:#252727;padding-top:95px;padding-bottom:95px;margin-top:40px}.final-cta .eyebrow{color:#343434}.final-cta h2{font-size:clamp(40px,5vw,72px);letter-spacing:-.04em;max-width:950px}.final-cta .button{background:#282b2b;color:white;border-color:#282b2b;padding:20px 28px}.reference-heading{padding:55px 35px 15px;background:#292b2b;color:white;margin-top:50px}.reference-heading h2{font-size:clamp(32px,4vw,52px);font-weight:500;letter-spacing:-.035em;margin:15px 0}.reference-heading .eyebrow{color:#f58216}.website-references{grid-template-columns:repeat(2,minmax(0,1fr));gap:45px 35px;background:#292b2b;color:#fff;padding:25px 35px 55px}.website-caption h3{font-size:25px;min-height:0}.website-caption>span,.website-references article>p{color:#d0d1cb}.website-references .text-link{color:#fff}.website-preview{border:none;box-shadow:0 8px 24px #0003}.website-preview img{aspect-ratio:16/10}.page-werbetechnik .tech-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:45px 35px;background:#292b2b;color:white;padding:35px}.page-werbetechnik .tech-grid .reference-description,.page-werbetechnik .project-caption span{color:#d0d1cb}.page-werbetechnik .project-caption h3{font-size:25px}.page-corporate-design .logo-examples{background:#292b2b;padding:35px;gap:25px;grid-template-columns:repeat(2,minmax(0,1fr))}.page-corporate-design .logo-examples img{height:260px}.page-corporate-design .logo-examples figcaption{color:#fff}.detail-grid article{padding-left:25px;border-left:3px solid #f58216}.complement{background:#eee6db}.contact-heading{border-left:7px solid #f58216;padding-left:28px}.contact-grid{background:#f0ece4;padding:35px;border-radius:4px}footer{padding-top:65px!important}.reference-heading+.website-references{scroll-margin-top:110px}@media(max-width:700px){.new-hero{min-height:0}.hero:before{width:350px;height:350px;top:450px;right:-100px}.hero-project{margin:10px 6px}.home-service{padding-top:55px;padding-bottom:55px}.website-references,.page-werbetechnik .tech-grid{grid-template-columns:1fr;padding:20px;gap:35px}.reference-heading{padding:35px 20px 0}.page-corporate-design .logo-examples{padding:20px;gap:15px}.page-corporate-design .logo-examples img{height:150px}.contact-grid{padding:20px}.final-cta{padding-top:60px;padding-bottom:60px}.home-service-image{transform:none!important}}

.hero-project img{aspect-ratio:1.5;object-position:top left}.home-service#werbetechnik .eyebrow{color:#f58216}.home-service#werbetechnik .home-service-image img{aspect-ratio:4/3;object-fit:contain;background:#292b2b}
.website-preview span,.tech-grid .project-art>span{color:#292b2b!important;background:#faf9f6f2!important}.website-preview img{aspect-ratio:16/9;object-position:top left}.reference-heading{scroll-margin-top:120px}
/* Anthrazit-Variante des Einstiegs auf der Startseite */
.page-index .hero{background:#292b2b;color:#faf9f6;box-shadow:0 0 0 100vmax #292b2b;clip-path:inset(0 -100vmax);isolation:isolate;overflow:visible;padding-top:45px;padding-bottom:55px}
.page-index .hero:before{z-index:-1;right:0;top:100px;width:540px;height:540px;background:#f58216}
.page-index .hero .eyebrow{color:#d7d7d2}
.page-index .hero .lead{color:#d7d7d2}
.page-index .hero h1 em{color:#f58216}
.page-index .hero .text-link{color:#faf9f6}
.page-index .hero .hero-project{color:#444;background:#eeeae3}
.page-index .hero .hero-actions .button{background:#f58216;color:#252727}
@media(max-width:700px){.page-index .hero{padding-top:30px;padding-bottom:40px}.page-index .hero:before{width:300px;height:300px;top:500px;right:0}}
/* Creme-Einstieg mit Original-Logo-X; dunkler Grafikbereich. */
.page-index .hero{background:#faf9f6;color:#444;box-shadow:0 0 0 100vmax #faf9f6}
.page-index .hero .eyebrow{color:#68665f}.page-index .hero .lead{color:#68665f}.page-index .hero .text-link{color:#444}
.page-index .hero:before{background:transparent url('/maex-2026/site-v2/maex-x.svg') center/contain no-repeat;border-radius:0;width:560px;height:640px;right:-35px;top:60px;mix-blend-mode:multiply}
.home-service#logo-grafik{position:relative;background:#292b2b;color:#faf9f6;box-shadow:0 0 0 100vmax #292b2b;clip-path:inset(0 -100vmax);border-top:0}
.home-service#logo-grafik .home-service-copy>p:not(.eyebrow){color:#d7d7d2}.home-service#logo-grafik .eyebrow{color:#f58216}.home-service#logo-grafik .text-link{color:#faf9f6}
.home-service#werbetechnik{background:#faf9f6;color:#444;box-shadow:0 0 0 100vmax #faf9f6;border-top:0}
.home-service#werbetechnik .home-service-copy>p:not(.eyebrow){color:#68665f}.home-service#werbetechnik .text-link{color:#444}.home-service#werbetechnik .home-service-image img{background:#faf9f6}
@media(max-width:700px){.page-index .hero:before{width:330px;height:400px;top:420px;right:-10px}}
.page-index .hero:before{right:18px;width:500px;height:640px}@media(max-width:700px){.page-index .hero:before{right:10px;width:300px;height:400px}}
/* Helleres, warmes Anthrazit und sichtbareres Markenzeichen. */
:root{--anthrazit:#454846}
.home-service#logo-grafik{background:var(--anthrazit);box-shadow:0 0 0 100vmax var(--anthrazit)}
.reference-heading,.website-references,.page-werbetechnik .tech-grid,.page-corporate-design .logo-examples{background:var(--anthrazit)}
.final-cta .button{background:var(--anthrazit);border-color:var(--anthrazit)}
.page-index .hero:before{width:520px;height:650px;right:-5px;top:25px}
.page-index .hero-project{width:86%;justify-self:end;margin-top:95px;transform:rotate(-3deg);position:relative;right:-10px}
@media(min-width:851px){.page-index .new-hero{grid-template-columns:1.05fr 1fr;gap:35px}.page-index .hero:before{right:70px}}
@media(max-width:850px){.page-index .hero:before{top:430px;right:45px;width:440px;height:530px}.page-index .hero-project{margin-top:65px;width:86%;right:0}}
@media(max-width:700px){.page-index .hero:before{top:460px;right:25px;width:290px;height:370px}.page-index .hero-project{margin-top:65px;width:87%}}

nav a[aria-current="page"]{color:inherit;border-bottom:2px solid #f58216;padding:10px 0}nav .nav-contact:not([aria-current="page"]){border-bottom-color:transparent}