/* One Vision Media — Brand layer & high-impact motion */
:root{--ink:#22252b;--cream:#fafafa;--lime:#686f7d;--pink:#b9b2aa;--line:rgba(34,37,43,.13)}
body{background:#fafafa}.hero{background:radial-gradient(circle at 76% 40%,#fff 0,rgba(255,255,255,.95) 20%,transparent 46%),linear-gradient(135deg,#fafafa 0%,#eff1f3 100%)}
.hero>.phone-scene{z-index:0!important}.hero h1,.hero .eyebrow,.hero .hero-copy,.hero .hero-actions,.hero .hero-meta{position:relative;z-index:4!important}.hero>.marquee{z-index:5}
.brand{display:inline-flex;align-items:center;text-decoration:none}.brand img{width:52px;height:36px;object-fit:cover;object-position:center;border-radius:5px;mix-blend-mode:multiply}.footer-brand img{background:#fff}.nav{background:rgba(250,250,250,.52);backdrop-filter:blur(14px)}
.hero h1{font-size:clamp(58px,7.4vw,112px);line-height:.88}.hero h1 span{display:inline-block;animation:headlineIn .85s .1s both}.hero h1 em{color:#25282e;display:inline-block;animation:headlineIn .95s .23s both}.section h2 em{color:#3b3f48}.hero .eyebrow span{background:#315b9d}.orb-one{background:#d1d4d9;opacity:.5}.orb-two{background:#e3d9cf;opacity:.65}.marquee{background:#315b9d;color:#fff;padding:7px 0;font-size:10px;letter-spacing:.14em}.marquee div{animation-duration:32s}.marquee b{color:#dce9ff;padding:0 9px}.button{background:#315b9d;box-shadow:0 8px 20px rgba(49,91,157,.16)}.button:hover{background:#244679;box-shadow:0 12px 24px rgba(49,91,157,.25)}.services{background:#fbfbfb}.service-card.large{background:linear-gradient(145deg,#f0f1f2,#dadde0);color:#22252b}.service-card.dark{background:#e6e8ea;color:#22252b}.process{background:#f1f2f3;color:#22252b}.process .steps{border-color:#22252b33}.process .steps article{border-color:#22252b33}.process .steps p{color:#5d626b}.process .steps span{color:#4e5560}.review{background:#f1f2f3;border-color:#dde0e3}.review.accent{background:#e7e4df}.dark-review{background:#eaebed;color:#22252b}.contact{background:linear-gradient(125deg,#eee9e3,#e0e3e6)}.contact-glow{background:#fff;opacity:.8}.initials{background:#c4c7ca}.ad-chart svg{stroke:#fff}.record{color:#525963}footer{background:#f3f4f5;color:#22252b;border-top:1px solid #ddd}footer p,footer small{color:#626873}footer div a{color:#343940}
.meta-card{background:linear-gradient(145deg,#f2f5fc,#dbe5f7)!important}.meta-card .service-icon,.content-card .service-icon{border-color:#5276b7;color:#315b9d}.meta-card .number,.meta-card a{color:#315b9d}.content-card{border-top:3px solid #456cac}.social-card .record{color:#456cac}.social-card .record span{background:#456cac}.ad-chart .bar{background:#5b7fb9}.ad-chart svg{stroke:#315b9d}
.service-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.service-card.large.meta-card{grid-row:auto;min-height:430px}.meta-card .service-card h3{margin-top:0}.meta-card h3{margin-top:72px}.meta-card .ad-chart{height:105px;bottom:62px}
.real-phone{width:min(46vw,600px);height:auto;right:3vw;top:152px;animation:heroFloat 5.5s ease-in-out infinite;filter:drop-shadow(0 30px 35px rgba(20,37,71,.26));will-change:transform}.real-phone img{width:100%;height:auto;display:block;mix-blend-mode:normal}.hero-spark{position:absolute;color:#3565b8;font-size:32px;text-shadow:0 2px 12px white;animation:sparkle 2.7s ease-in-out infinite}.spark-a{top:22%;left:6%}.spark-b{right:8%;bottom:12%;font-size:22px;animation-delay:-1.1s}.real-phone.phone-scene{transform:translate3d(var(--mouse-x,0),var(--mouse-y,0),0)}
.scroll-reveal{opacity:0;transform:translateY(36px);transition:opacity .75s ease,transform .75s cubic-bezier(.22,1,.36,1)}.scroll-reveal.is-visible{opacity:1;transform:none}.service-card.scroll-reveal:nth-child(2){transition-delay:.1s}.service-card.scroll-reveal:nth-child(3){transition-delay:.2s}.steps article.scroll-reveal:nth-child(2){transition-delay:.1s}.steps article.scroll-reveal:nth-child(3){transition-delay:.2s}.steps article.scroll-reveal:nth-child(4){transition-delay:.3s}
@keyframes heroFloat{0%,100%{transform:translate3d(var(--mouse-x,0),var(--mouse-y,0),0) rotate(-1deg)}50%{transform:translate3d(var(--mouse-x,0),calc(var(--mouse-y,0) - 18px),0) rotate(1.5deg)}}@keyframes sparkle{0%,100%{opacity:.2;transform:scale(.65) rotate(0)}50%{opacity:1;transform:scale(1.15) rotate(45deg)}}@keyframes headlineIn{from{opacity:0;filter:blur(10px);transform:translateY(30px) scale(.96)}to{opacity:1;filter:blur(0);transform:none}}
.review-viewport{margin:65px -5.5vw 0;width:100vw;overflow:hidden}.review-track{display:flex;width:max-content;gap:14px;animation:reviewLoop 70s linear infinite}.review-track:hover{animation-play-state:paused}.review{width:370px;min-height:320px}@keyframes reviewLoop{to{transform:translateX(calc(-50% - 7px))}}
@media(max-width:800px){.real-phone{width:450px;right:-104px;top:390px;transform-origin:top right;animation:mobilePhoneFloat 7.5s ease-in-out infinite}.brand img{width:42px;height:31px}.hero{min-height:850px}.scroll-reveal{transform:translateY(22px)}.review-viewport{margin-left:-6vw}.review{width:300px;min-height:250px}.service-grid{grid-template-columns:1fr}.service-card.large.meta-card{min-height:500px}}@keyframes mobilePhoneFloat{0%,100%{transform:translate3d(0,0,0) scale(.72) rotate(-.35deg)}50%{transform:translate3d(0,-7px,0) scale(.72) rotate(.35deg)}}@media(prefers-reduced-motion:reduce){.real-phone{animation:none!important}}

footer small{grid-column:1/-1;text-align:left;margin-top:10px}
@media(max-width:800px){.hero-actions .text-link{display:none}footer div{order:3}footer small{grid-column:1/-1;order:4;text-align:left}}

.menu-toggle{display:none;border:0;background:transparent;width:38px;height:38px;padding:8px;cursor:pointer}.menu-toggle span{display:block;width:20px;height:2px;background:#22252b;margin:4px auto;transition:transform .2s,opacity .2s}.nav-open .menu-toggle span:nth-child(1){transform:translateY(6px) rotate(45deg)}.nav-open .menu-toggle span:nth-child(2){opacity:0}.nav-open .menu-toggle span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
@media(max-width:800px){.nav{gap:0}.nav .button-small{margin-left:auto;padding:10px 12px;font-size:10px}.menu-toggle{display:block;margin-left:8px}.nav nav{display:none;position:absolute;top:67px;left:6vw;right:6vw;padding:14px;background:rgba(250,250,250,.97);border:1px solid rgba(34,37,43,.14);border-radius:12px;box-shadow:0 16px 35px rgba(28,34,44,.14);flex-direction:column;gap:0}.nav.nav-open nav{display:flex}.nav nav a{padding:12px 8px}.hero-actions .button{padding:12px 15px;font-size:10px;gap:0}.hero-meta{flex-direction:column;align-items:flex-start;gap:12px;margin-top:35px}.service-card h3{margin-top:60px}.service-icon,.record{display:none!important}}

@media(max-width:800px){.nav{position:fixed!important;top:0;left:0;right:0;background:rgba(250,250,250,.88)!important;backdrop-filter:blur(16px);border-bottom:1px solid rgba(34,37,43,.08);box-shadow:0 5px 20px rgba(30,38,51,.07)}}

.about.is-animated .about-panel{animation:aboutPanelFloat 6s ease-in-out infinite}.about.is-animated .about-panel img{animation:aboutLogoPulse 3.4s ease-in-out infinite}.about.is-animated .about-points span{animation:aboutPointIn .65s cubic-bezier(.22,1,.36,1) both}.about.is-animated .about-points span:nth-child(2){animation-delay:.12s}.about.is-animated .about-points span:nth-child(3){animation-delay:.24s}@keyframes aboutPanelFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes aboutLogoPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.04)}}@keyframes aboutPointIn{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}

.service-card{position:relative}.service-corner-icon{position:absolute;top:24px;right:24px;width:38px;height:38px;display:grid;place-items:center;border:1px solid rgba(49,91,157,.22);border-radius:50%;color:#315b9d;background:rgba(255,255,255,.5);pointer-events:none}.service-corner-icon svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.service-card.dark .service-corner-icon{border-color:rgba(34,37,43,.17);color:#4d5662;background:rgba(255,255,255,.36)}@media(max-width:800px){.service-corner-icon{top:18px;right:18px;width:34px;height:34px}.service-corner-icon svg{width:16px;height:16px}}

@media(max-width:800px){.hero-meta{display:flex!important;flex-direction:column!important;align-items:flex-start!important;gap:7px!important}.hero-meta>div{display:grid!important;grid-template-columns:78px minmax(0,1fr)!important;column-gap:12px!important;align-items:start!important;min-width:0}.hero-meta b{grid-column:1;white-space:nowrap}.hero-meta small{grid-column:2;margin:0!important;line-height:1.25!important}}

@media(max-width:800px){.hero-meta>div>b{justify-self:start!important;margin-left:0!important;padding-left:0!important;transform:none!important}.hero-meta>div:nth-child(2)>b{justify-self:start!important;margin-left:0!important;padding-left:0!important;transform:none!important}}

@media(max-width:800px){.nav{transition:transform .32s cubic-bezier(.22,1,.36,1)!important}.nav.nav-scroll-hidden{transform:translateY(-115%)}.nav.nav-open{transform:translateY(0)!important}#stimmen .review-viewport{overflow-x:auto!important;overflow-y:hidden!important;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch;touch-action:pan-x}#stimmen .review-viewport::-webkit-scrollbar{display:none}#stimmen .review-track{animation:none!important;transform:none!important}#stimmen .review{scroll-snap-align:start}}

#stimmen .review-track{animation:reviewLoop 72s linear infinite!important}#stimmen .review-viewport:hover .review-track{animation-play-state:paused!important}.about{position:relative;overflow:hidden}.about-panel{position:relative;overflow:hidden}.about-panel:before{content:"";position:absolute;width:160px;height:160px;right:-64px;top:-66px;border:1px solid rgba(49,91,157,.24);border-radius:50%;pointer-events:none}.about.is-animated .about-copy h2{animation:aboutTitleIn .85s cubic-bezier(.22,1,.36,1) both}.about.is-animated .about-copy>p:not(.eyebrow){animation:aboutBodyIn .85s .12s cubic-bezier(.22,1,.36,1) both}.about.is-animated .about-copy .text-link{animation:aboutBodyIn .85s .24s cubic-bezier(.22,1,.36,1) both}.about.is-animated .about-panel{animation:aboutPanelMotion 5s ease-in-out infinite}.about.is-animated .about-panel:before{animation:aboutOrbit 11s linear infinite}.about.is-animated .about-panel>p{animation:aboutCopyFloat 4.2s ease-in-out infinite}.about.is-animated .about-points span{animation:aboutPointFloat 3.6s ease-in-out infinite}.about.is-animated .about-points span:nth-child(2){animation-delay:-1.2s}.about.is-animated .about-points span:nth-child(3){animation-delay:-2.4s}@keyframes aboutTitleIn{from{opacity:0;transform:translateY(34px);filter:blur(8px)}to{opacity:1;transform:none;filter:none}}@keyframes aboutBodyIn{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}@keyframes aboutPanelMotion{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-13px) rotate(.45deg)}}@keyframes aboutOrbit{to{transform:rotate(360deg)}}@keyframes aboutCopyFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}@keyframes aboutPointFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}@media(max-width:800px){#stimmen .review-viewport{overflow:hidden!important}#stimmen .review-track{animation:reviewLoop 62s linear infinite!important;transform:translateX(0)!important}.about.is-animated .about-panel{animation:aboutPanelMotion 5.6s ease-in-out infinite}}

.about-copy .text-link span{display:none!important}.about.is-animated .about-copy h2,.about.is-animated .about-copy>p:not(.eyebrow),.about.is-animated .about-copy .text-link,.about.is-animated .about-panel,.about.is-animated .about-panel:before,.about.is-animated .about-panel>p,.about.is-animated .about-panel img,.about.is-animated .about-points span{animation:none!important}
.about-panel:before{display:none!important}

/* Ruhiger Glas-Header: sichtbar beim Hochscrollen, zurückhaltend beim Runterscrollen */
.nav{position:fixed!important;top:12px;left:max(18px,3.5vw);right:max(18px,3.5vw);width:auto!important;height:72px;padding:0 20px!important;border:1px solid transparent;border-radius:18px!important;background:transparent!important;-webkit-backdrop-filter:blur(0) saturate(100%);backdrop-filter:blur(0) saturate(100%);box-shadow:none;transition:transform .34s cubic-bezier(.22,1,.36,1),background .28s ease,border-color .28s ease,box-shadow .28s ease,-webkit-backdrop-filter .28s ease,backdrop-filter .28s ease!important;z-index:80}.nav.nav-scrolled,.nav.nav-open{border-color:rgba(255,255,255,.7)!important;background:rgba(250,251,252,.72)!important;-webkit-backdrop-filter:blur(18px) saturate(145%);backdrop-filter:blur(18px) saturate(145%);box-shadow:0 12px 34px rgba(31,42,58,.1)}.nav.nav-scroll-hidden{transform:translateY(calc(-100% - 22px))!important}.nav.nav-open{transform:translateY(0)!important}.nav.nav-scrolled:hover{background:rgba(255,255,255,.82)!important;box-shadow:0 14px 38px rgba(31,42,58,.13)}

/* Moderne, helle Leistungskarten */
.services .service-grid{gap:18px}.services .service-card{min-height:380px;padding:30px;border:1px solid rgba(43,54,70,.11);border-radius:26px;background:linear-gradient(145deg,#fff 0%,#f4f6f8 100%);box-shadow:0 10px 28px rgba(31,43,60,.055);transition:transform .34s cubic-bezier(.22,1,.36,1),box-shadow .34s ease,border-color .34s ease;will-change:transform}.services .service-card.large.meta-card{min-height:430px;border-radius:28px;background:linear-gradient(145deg,#f5f7fb 0%,#e2e9f5 100%)!important}.services .service-card.dark{background:linear-gradient(145deg,#f1f3f5 0%,#e3e6e9 100%)}@media (hover:hover){.services .service-card:hover{transform:translateY(-7px) scale(1.008);border-color:rgba(49,91,157,.28);box-shadow:0 20px 44px rgba(31,43,60,.13)}}.services .service-card .service-corner-icon{border-color:rgba(49,91,157,.16);background:rgba(255,255,255,.7)}

@media(max-width:800px){.nav{top:8px;left:10px;right:10px;min-height:66px!important;height:66px;padding:0 16px!important;border-radius:17px!important;background:transparent!important}.nav.nav-scrolled,.nav.nav-open{background:rgba(250,251,252,.76)!important}.nav.nav-scroll-hidden{transform:translateY(calc(-100% - 18px))!important}.nav nav{top:calc(100% + 9px)!important;left:0!important;right:0!important;border-radius:16px!important}.services .service-grid{gap:14px}.services .service-card,.services .service-card.large.meta-card{min-height:340px;padding:25px;border-radius:22px}.services .service-card.large.meta-card{min-height:440px}.services .service-card:hover{transform:none;box-shadow:0 10px 28px rgba(31,43,60,.055)}}

/* Der Laufstreifen bleibt vollständig gefüllt; Bewertungen lassen sich auf Touch-Geräten frei wischen. */
.marquee div{min-width:max-content;animation-duration:48s!important}.marquee b{padding:0 12px}@media(max-width:800px){#stimmen .review-viewport{overflow-x:auto!important;overflow-y:hidden!important;scroll-snap-type:none!important;-webkit-overflow-scrolling:touch!important;touch-action:pan-x pan-y!important;overscroll-behavior-x:contain;cursor:grab}#stimmen .review-viewport:active{cursor:grabbing}#stimmen .review-track{animation:none!important;transform:none!important}#stimmen .review{scroll-snap-align:none!important}}

/* Mobil bewusst etwas schlanker: Der Laufstreifen bleibt lesbar, nimmt aber weniger Höhe ein. */
@media(max-width:800px){.marquee{padding:5px 0;font-size:9px}.marquee b{padding:0 10px}}

/* Offene Prozess-Timeline statt vier großer Karten. */
.process{background:linear-gradient(180deg,#f5f6f7 0%,#eef0f2 100%)}
.process .steps{position:relative;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;margin-top:68px;border:0!important}
.process .steps:before{content:"";position:absolute;left:13px;right:13px;top:21px;height:1px;background:linear-gradient(90deg,transparent 0%,rgba(49,91,157,.32) 8%,rgba(49,91,157,.32) 92%,transparent 100%)}
.process .steps article{position:relative;z-index:1;min-height:0!important;padding:0 26px 12px!important;border:0!important;background:transparent!important}
.process .steps article:first-child{padding-left:0!important}.process .steps article:last-child{padding-right:0!important}
.process .steps article span{display:grid;width:43px;height:43px;place-items:center;border:1px solid rgba(49,91,157,.24);border-radius:50%;background:#f7f8f9;color:#315b9d!important;font:600 11px 'DM Mono',monospace;box-shadow:0 8px 20px rgba(43,59,82,.08)}
.process .steps article:nth-child(3) span{border-color:#315b9d;background:#315b9d;color:#fff!important;box-shadow:0 10px 24px rgba(49,91,157,.22)}
.process .steps h3{margin:27px 0 9px;font-size:22px;letter-spacing:-1.2px}
.process .steps p{max-width:240px;margin:0;font-size:13px;line-height:1.62;color:#626a75!important}
@media(max-width:800px){.process{padding-top:82px;padding-bottom:80px}.process .steps{display:grid;grid-template-columns:1fr;gap:29px;margin-top:42px;padding-left:0}.process .steps:before{top:22px;bottom:22px;left:21px;right:auto;width:1px;height:auto;background:linear-gradient(180deg,transparent 0%,rgba(49,91,157,.3) 8%,rgba(49,91,157,.3) 92%,transparent 100%)}.process .steps article,.process .steps article:first-child,.process .steps article:last-child{display:grid;grid-template-columns:43px minmax(0,1fr);column-gap:18px;padding:0!important}.process .steps article span{grid-column:1;grid-row:1/3}.process .steps h3{grid-column:2;margin:1px 0 5px;font-size:20px}.process .steps p{grid-column:2;max-width:295px;font-size:13px}}

/* Mobile: GPU-animierter, nahtloser Bewertungs-Loop; horizontal direkt mit dem Finger bewegbar. */
@media(max-width:800px){#stimmen .review-viewport{overflow:hidden!important;touch-action:pan-y!important;overscroll-behavior-x:auto!important}#stimmen .review-track{animation:none!important;transform:translate3d(var(--review-offset,0px),0,0)!important;will-change:transform}.nav .menu-toggle{width:28px;height:28px;padding:5px;margin-left:6px}.nav .menu-toggle span{width:15px;height:1.25px;margin:3px auto}.nav-open .menu-toggle span:nth-child(1){transform:translateY(4px) rotate(45deg)}.nav-open .menu-toggle span:nth-child(3){transform:translateY(-4px) rotate(-45deg)}}
