@charset "UTF-8";
:root{
  --bg:#050505;--bg2:#0b0b0b;--panel:#101010;--paper:#f2f1ec;--ink:#f7f7f2;--muted:#aaa9a3;
  --line:rgba(255,255,255,.14);--line2:rgba(0,0,0,.14);--radius:28px;--pad:clamp(24px,3vw,52px);
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font-family:Arial,"Helvetica Neue",sans-serif;overflow-x:hidden}body.menu-open{overflow:hidden}
a{color:inherit;text-decoration:none}img,video{display:block;max-width:100%}button,input,textarea,select{font:inherit}::selection{background:#fff;color:#000}
.noise{position:fixed;inset:0;z-index:999;pointer-events:none;opacity:.028;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.9'/%3E%3C/svg%3E")}.progress{position:fixed;left:0;top:0;width:0;height:2px;background:#fff;z-index:1200}.page-transition{position:fixed;inset:0;z-index:1500;background:var(--paper);transform:translateY(100%);pointer-events:none;transition:.55s cubic-bezier(.77,0,.18,1)}.page-transition.go{transform:none}
.wrap{width:min(1440px,calc(100% - var(--pad)*2));margin:auto}.eyebrow{display:flex;gap:13px;align-items:center;font-size:10px;font-weight:900;letter-spacing:.18em;text-transform:uppercase;color:#c7c7c2}.eyebrow:before{content:"";width:44px;height:1px;background:currentColor}.reveal{opacity:0;transform:translateY(32px);transition:opacity .85s cubic-bezier(.2,.75,.2,1),transform .85s cubic-bezier(.2,.75,.2,1)}.reveal.in{opacity:1;transform:none}.mask{overflow:hidden}.mask>span{display:block;transform:translateY(110%);transition:transform 1s cubic-bezier(.16,1,.3,1)}.loaded .mask>span{transform:none}.section{padding:120px 0;border-bottom:1px solid var(--line)}.display{font-size:clamp(64px,7vw,132px);line-height:.82;letter-spacing:-.075em;text-transform:uppercase;margin:24px 0 0;font-weight:950}.display .soft{color:#9b9b96;font-weight:650}.section-title{font-size:clamp(48px,5.5vw,90px);line-height:.92;letter-spacing:-.065em;margin:12px 0 0}.lead{font-size:clamp(20px,2.1vw,34px);line-height:1.35;letter-spacing:-.035em;color:#c3c3be}.copy{font-size:16px;line-height:1.72;color:#aaa9a4}.btn{display:inline-flex;align-items:center;gap:16px;padding:15px 21px;border-radius:999px;border:1px solid rgba(255,255,255,.28);font-size:10px;font-weight:900;letter-spacing:.13em;text-transform:uppercase;transition:.28s}.btn:hover{transform:translateY(-3px);border-color:#fff}.btn.light{background:#fff;color:#0a0a0a;border-color:#fff}.btn b{font-size:16px;font-weight:500}.link-arrow{display:inline-flex;gap:13px;align-items:center;font-size:10px;letter-spacing:.14em;font-weight:900;text-transform:uppercase}.link-arrow span{transition:.25s}.link-arrow:hover span{transform:translate(4px,-4px)}
/* header */
.header{height:84px;padding:0 var(--pad);position:fixed;inset:0 0 auto;z-index:1100;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;background:linear-gradient(180deg,rgba(0,0,0,.86),transparent);border-bottom:1px solid transparent;transition:.32s}.header.scrolled{height:70px;background:rgba(5,5,5,.9);backdrop-filter:blur(18px);border-color:var(--line)}.logo{width:140px;height:50px;display:flex;align-items:center}.logo img{width:100%;height:100%;object-fit:contain;object-position:left center}.nav{display:flex;gap:26px;align-items:center}.nav a{font-size:10px;font-weight:900;letter-spacing:.14em;text-transform:uppercase;color:#dddcd6;position:relative}.nav a:after{content:"";position:absolute;height:1px;left:0;right:100%;bottom:-7px;background:#fff;transition:.25s}.nav a:hover:after,.nav a.active:after{right:0}.head-cta{justify-self:end;display:flex;gap:10px;align-items:center;font-size:10px;font-weight:900;letter-spacing:.13em;text-transform:uppercase}.head-cta i{width:8px;height:8px;background:#fff;border-radius:50%;box-shadow:0 0 0 5px rgba(255,255,255,.1)}.menu-btn{display:none;border:0;background:none;color:#fff;width:44px;height:44px;padding:0}.menu-btn span{display:block;width:25px;height:1px;background:#fff;margin:7px auto}.menu-panel{display:none}
/* generic hero */
.hero{min-height:100vh;position:relative;overflow:hidden;border-bottom:1px solid var(--line);display:flex;align-items:flex-end}.hero-media{position:absolute;inset:0}.hero-media:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.88) 0%,rgba(0,0,0,.54) 53%,rgba(0,0,0,.2) 100%),linear-gradient(0deg,rgba(0,0,0,.76),transparent 55%)}.hero-media img,.hero-media video{width:100%;height:100%;object-fit:cover}.hero-content{position:relative;z-index:2;width:100%;padding:148px var(--pad) 52px}.hero-kicker{margin-bottom:28px}.hero h1{max-width:1100px;font-size:clamp(46px,5.1vw,96px);line-height:.84;letter-spacing:-.065em;text-transform:uppercase;margin:0;font-weight:950}.hero h1 .soft{color:#b0b0ab;font-weight:650}.hero-bottom{display:grid;grid-template-columns:minmax(320px,520px) 1fr auto;gap:44px;align-items:end;margin-top:54px}.hero-bottom p{margin:0;color:#cbc9c3;font-size:17px;line-height:1.58}.metrics-inline{display:flex;gap:35px}.metrics-inline>div{border-left:1px solid var(--line);padding-left:15px}.metrics-inline strong{font-size:27px;letter-spacing:-.05em}.metrics-inline span{display:block;margin-top:5px;font-size:9px;letter-spacing:.13em;text-transform:uppercase;color:#a3a39e}.hero-actions{display:flex;gap:10px;flex-wrap:wrap}.ticker{height:72px;border-bottom:1px solid var(--line);overflow:hidden;display:flex;align-items:center;background:#090909}.ticker-track{width:max-content;display:flex;align-items:center;gap:39px;animation:ticker 26s linear infinite}.ticker-track span{font-size:11px;font-weight:900;letter-spacing:.12em;white-space:nowrap}.ticker-track i{width:5px;height:5px;background:#6f6f6a;border-radius:50%}@keyframes ticker{to{transform:translateX(-50%)}}
/* home intro */
.intro-grid{display:grid;grid-template-columns:250px 1fr;gap:70px}.intro-grid .lead{max-width:1120px;margin:0}.home-numbers{display:grid;grid-template-columns:repeat(4,1fr);margin-top:76px;border-top:1px solid var(--line);border-left:1px solid var(--line)}.home-number{padding:30px;min-height:170px;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}.home-number strong{font-size:clamp(45px,4vw,72px);letter-spacing:-.07em}.home-number span{display:block;margin-top:34px;color:#888882;font-size:10px;font-weight:900;letter-spacing:.14em;text-transform:uppercase}
/* services previews */
.section-head{display:flex;align-items:end;justify-content:space-between;gap:50px;margin-bottom:48px}.section-head .copy{max-width:480px;margin:0}.service-preview-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}.service-preview{position:relative;min-height:500px;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:#0b0b0b}.service-preview img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .75s cubic-bezier(.2,.75,.2,1);filter:brightness(1.08) saturate(.98)}.service-preview:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.56),rgba(0,0,0,.02) 62%)}.service-preview:hover img{transform:scale(1.045)}.service-preview .meta{position:absolute;z-index:2;left:28px;right:28px;bottom:26px;display:grid;grid-template-columns:45px 1fr auto;gap:14px;align-items:end}.service-preview small{font-size:10px;letter-spacing:.15em;color:#aaa}.service-preview h3{font-size:clamp(30px,3vw,50px);letter-spacing:-.06em;line-height:.92;text-transform:uppercase;margin:0}.service-preview b{font-size:22px;font-weight:400}
/* work grid */
.work-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:18px}.work-card{position:relative;border-radius:var(--radius);overflow:hidden;min-height:540px;background:#111}.work-card.wide{grid-column:span 8}.work-card.narrow{grid-column:span 4}.work-card.half{grid-column:span 6}.work-card img{width:100%;height:100%;object-fit:cover;transition:transform .8s cubic-bezier(.2,.75,.2,1);filter:saturate(.87)}.work-card:hover img{transform:scale(1.045)}.work-card:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.7),transparent 55%)}.work-card .work-meta{position:absolute;z-index:2;left:24px;right:24px;bottom:22px;display:flex;justify-content:space-between;align-items:flex-end}.work-card h3{margin:0;font-size:28px;letter-spacing:-.04em}.work-card span{font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:#c9c9c4}
/* process */
.paper{background:var(--paper);color:#111}.paper .eyebrow,.paper .copy{color:#555}.process-grid{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line2);border-left:1px solid var(--line2);margin-top:60px}.process-step{padding:28px;min-height:330px;border-right:1px solid var(--line2);border-bottom:1px solid var(--line2);display:flex;flex-direction:column}.process-step small{font-size:10px;letter-spacing:.14em;font-weight:900}.process-step h3{font-size:36px;letter-spacing:-.055em;margin:auto 0 14px}.process-step p{color:#666;line-height:1.6;margin:0}
/* contact */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px}.contact-title{font-size:clamp(64px,7vw,120px);line-height:.82;letter-spacing:-.075em;text-transform:uppercase;margin:18px 0 34px}.contact-direct{display:grid;gap:13px;margin-top:40px}.contact-direct a{font-size:22px;letter-spacing:-.03em}.form{display:grid;gap:14px}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}.field{border:1px solid var(--line);border-radius:15px;padding:17px 18px;background:#0b0b0b;color:#fff;outline:none;width:100%;transition:.2s}.field:focus{border-color:#fff}.field::placeholder{color:#73736f}.form textarea{min-height:160px;resize:vertical}.check{display:flex;gap:10px;color:#92928e;font-size:12px;line-height:1.5}.check input{margin-top:3px}.form-status{font-size:12px;min-height:18px;color:#c7c7c2}
/* footer */
.footer{padding:55px var(--pad) 42px;display:grid;grid-template-columns:1.3fr .8fr .8fr 1fr;gap:44px;border-top:1px solid var(--line);font-size:12px;line-height:1.8;color:#8d8d88}.footer strong{display:block;color:#fff;font-size:10px;letter-spacing:.15em;text-transform:uppercase;margin-bottom:9px}.footer a:hover{color:#fff}.footer .end{text-align:right}
/* about */
.split-story{display:grid;grid-template-columns:minmax(330px,430px) 1fr;gap:70px;align-items:start}.portrait-card{position:sticky;top:105px;border-radius:var(--radius);overflow:hidden;background:#111}.portrait-card img{width:100%;aspect-ratio:4/5;object-fit:cover}.portrait-card figcaption{display:flex;justify-content:space-between;padding:17px 19px;border-top:1px solid var(--line);font-size:11px}.portrait-card span{color:#85857f}.story-copy p{font-size:clamp(20px,2vw,30px);line-height:1.45;letter-spacing:-.03em;color:#c4c4bf;margin:0 0 28px}.story-copy p:first-child{color:#fff}.metric-grid{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);border-left:1px solid var(--line);margin-top:65px}.metric-box{padding:27px;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}.metric-box strong{font-size:50px;letter-spacing:-.06em}.metric-box span{display:block;margin-top:20px;color:#888;font-size:9px;letter-spacing:.14em;text-transform:uppercase}.team-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.team-card{border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:#0b0b0b}.team-card img{width:100%;aspect-ratio:4/5;object-fit:cover;filter:grayscale(1);transition:.55s}.team-card:hover img{filter:grayscale(0)}.team-meta{padding:20px}.team-meta small{font-size:9px;letter-spacing:.15em;color:#888}.team-meta h3{font-size:28px;letter-spacing:-.045em;margin:24px 0 5px}.team-meta p{color:#999;margin:0;font-size:13px}.quote-block{padding:130px var(--pad);background:var(--paper);color:#111}.quote-block blockquote{max-width:1250px;margin:0 auto;font-size:clamp(48px,6vw,104px);line-height:.92;letter-spacing:-.065em;font-weight:800}.quote-block cite{display:block;margin-top:35px;font-size:11px;letter-spacing:.13em;text-transform:uppercase;font-style:normal;color:#666}.principle-grid{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);border-left:1px solid var(--line)}.principle{padding:28px;min-height:290px;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}.principle small{font-size:9px;letter-spacing:.14em;color:#888}.principle h3{margin:88px 0 15px;font-size:34px;letter-spacing:-.05em}.principle p{color:#9a9a95;line-height:1.65;margin:0}
/* service page */
.service-index{display:grid;grid-template-columns:repeat(3,1fr);border-left:1px solid var(--line);border-top:1px solid var(--line)}.service-index a{padding:24px;min-height:150px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;flex-direction:column;justify-content:space-between;transition:.3s}.service-index a:hover{background:var(--paper);color:#111}.service-index small{font-size:9px;letter-spacing:.15em}.service-index strong{font-size:28px;letter-spacing:-.045em}.service-detail{display:grid;grid-template-columns:1fr 1fr;min-height:760px;border-bottom:1px solid var(--line)}.service-detail:nth-child(even) .service-media{order:2}.service-media{position:relative;overflow:hidden}.service-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.service-detail-copy{padding:90px var(--pad);display:flex;flex-direction:column;justify-content:center}.service-detail-copy small{font-size:9px;letter-spacing:.15em;color:#8f8f8a;text-transform:uppercase}.service-detail-copy h2{font-size:clamp(50px,5vw,86px);line-height:.92;letter-spacing:-.065em;margin:25px 0}.service-detail-copy .tagline{font-size:25px;line-height:1.25;letter-spacing:-.035em;color:#fff;margin:0 0 24px}.service-detail-copy>p{color:#aaa;line-height:1.68;max-width:620px}.service-list{list-style:none;padding:0;margin:28px 0 0;border-top:1px solid var(--line)}.service-list li{padding:13px 0;border-bottom:1px solid var(--line);font-size:13px;color:#d0d0cb}.process-media-grid{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center}.process-media-grid img{border-radius:var(--radius);width:100%;aspect-ratio:4/5;object-fit:cover}.process-media-grid .lead{margin:24px 0 30px}
/* references */
.logo-wall{display:grid;grid-template-columns:repeat(5,1fr);border-left:1px solid var(--line);border-top:1px solid var(--line)}.client-logo{height:170px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);display:grid;place-items:center;padding:28px;background:#090909;transition:.3s}.client-logo:hover{background:var(--paper)}.client-logo img{max-width:78%;max-height:82px;object-fit:contain;filter:grayscale(1) brightness(3);transition:.3s}.client-logo:hover img{filter:grayscale(0)}.gallery{columns:3;column-gap:18px}.gallery-item{break-inside:avoid;margin:0 0 18px;border-radius:20px;overflow:hidden;position:relative;cursor:zoom-in;background:#111}.gallery-item img{width:100%;height:auto;transition:.55s;filter:saturate(.86)}.gallery-item:hover img{transform:scale(1.025);filter:saturate(1)}.gallery-item:after{content:"ANSEHEN";position:absolute;right:15px;bottom:15px;background:#fff;color:#111;padding:9px 12px;border-radius:999px;font-size:8px;font-weight:900;letter-spacing:.13em;opacity:0;transform:translateY(6px);transition:.25s}.gallery-item:hover:after{opacity:1;transform:none}.lightbox{position:fixed;inset:0;z-index:1400;background:rgba(0,0,0,.94);display:none;place-items:center;padding:34px}.lightbox.open{display:grid}.lightbox img{max-width:94vw;max-height:90vh;object-fit:contain}.lightbox button{position:absolute;right:26px;top:24px;border:1px solid rgba(255,255,255,.35);background:#0b0b0b;color:#fff;border-radius:999px;width:45px;height:45px;cursor:pointer}
/* jobs */
.benefit-grid{display:grid;grid-template-columns:repeat(4,1fr);border-left:1px solid var(--line);border-top:1px solid var(--line)}.benefit{padding:28px;min-height:290px;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}.benefit small{font-size:9px;letter-spacing:.14em;color:#888}.benefit h3{font-size:34px;letter-spacing:-.05em;margin:90px 0 14px}.benefit p{color:#969691;line-height:1.65;margin:0}.job-list{display:grid;gap:18px}.job-card{border:1px solid var(--line);border-radius:var(--radius);padding:36px;background:#0a0a0a}.job-card-head{display:grid;grid-template-columns:1fr auto;gap:30px;align-items:start}.job-card h3{font-size:clamp(40px,4.5vw,70px);line-height:.94;letter-spacing:-.06em;margin:0}.job-card h3 em{font-style:normal;color:#8f8f8a;font-weight:500}.job-card>p{max-width:800px;color:#aaa;line-height:1.65}.job-meta{display:grid;grid-template-columns:repeat(4,1fr);margin-top:32px;border-top:1px solid var(--line);border-left:1px solid var(--line)}.job-meta div{padding:17px;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}.job-meta dt{font-size:8px;letter-spacing:.14em;text-transform:uppercase;color:#777;margin-bottom:8px}.job-meta dd{margin:0;font-size:13px}.job-details{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:18px}.job-detail{border:1px solid var(--line);border-radius:var(--radius);padding:30px}.job-detail h4{font-size:30px;letter-spacing:-.045em;margin:0 0 20px}.job-detail p{color:#a4a49e;line-height:1.65}.job-detail ul{list-style:none;padding:0;margin:24px 0 0;border-top:1px solid var(--line)}.job-detail li{padding:11px 0;border-bottom:1px solid var(--line);color:#cfcfc9;font-size:13px}
/* legal */
.legal-hero{padding:170px var(--pad) 70px;border-bottom:1px solid var(--line)}.legal-hero h1{font-size:clamp(72px,8vw,150px);line-height:.82;letter-spacing:-.075em;text-transform:uppercase;margin:26px 0 0}.legal-main{padding:70px var(--pad) 130px}.legal-grid{display:grid;grid-template-columns:260px minmax(0,900px);gap:70px;justify-content:center}.legal-aside{position:sticky;top:110px;align-self:start;color:#8f8f8a;font-size:13px;line-height:1.7}.legal-aside strong{display:block;color:#fff;margin-bottom:9px}.legal-card h2{font-size:31px;letter-spacing:-.04em;margin:48px 0 14px}.legal-card h2:first-child{margin-top:0}.legal-card h3{font-size:22px;margin:38px 0 12px}.legal-card p,.legal-card li{color:#b1b1ac;line-height:1.75;font-size:14px}.legal-card a{text-decoration:underline;text-underline-offset:3px}.legal-card ul{padding-left:20px}
/* 404 */.notfound{min-height:100vh;display:grid;place-items:center;text-align:center;padding:80px var(--pad)}.notfound h1{font-size:24vw;letter-spacing:-.09em;line-height:.7;margin:0}.notfound p{color:#aaa;margin:45px 0 30px}
@media(max-width:1100px){.header{grid-template-columns:1fr auto}.nav,.head-cta{display:none}.menu-btn{display:block}.menu-panel{display:flex;position:fixed;inset:0;z-index:1050;background:#050505;padding:130px 28px 40px;flex-direction:column;transform:translateY(-100%);transition:.5s cubic-bezier(.77,0,.18,1)}.menu-open .menu-panel{transform:none}.menu-panel a{font-size:48px;font-weight:900;letter-spacing:-.05em;padding:10px 0;border-bottom:1px solid var(--line)}.hero-bottom{grid-template-columns:1fr;gap:25px}.metrics-inline{flex-wrap:wrap}.intro-grid,.contact-grid,.split-story,.process-media-grid{grid-template-columns:1fr}.portrait-card{position:relative;top:auto;max-width:520px}.service-detail{grid-template-columns:1fr;min-height:auto}.service-detail:nth-child(even) .service-media{order:0}.service-media{height:55vw;min-height:420px}.logo-wall{grid-template-columns:repeat(4,1fr)}.footer{grid-template-columns:1fr 1fr}.footer .end{text-align:left}.job-meta{grid-template-columns:1fr 1fr}}
@media(max-width:760px){:root{--pad:20px}.section{padding:82px 0}.header{height:70px}.logo{width:116px}.hero{min-height:860px}.hero-content{padding:120px var(--pad) 32px}.hero h1{font-size:9.6vw}.display{font-size:15vw}.section-title{font-size:13vw}.metrics-inline{gap:14px}.metrics-inline>div{width:calc(50% - 7px)}.hero-actions{width:100%}.hero-actions .btn{flex:1;justify-content:center}.home-numbers,.metric-grid,.process-grid,.principle-grid,.benefit-grid{grid-template-columns:1fr 1fr}.service-preview-grid{grid-template-columns:1fr}.service-preview{min-height:440px}.work-grid{display:block}.work-card{min-height:470px;margin-bottom:18px}.section-head{display:block}.section-head .copy{margin-top:25px}.team-grid{grid-template-columns:1fr 1fr}.service-index{grid-template-columns:1fr 1fr}.service-detail-copy{padding:60px var(--pad)}.logo-wall{grid-template-columns:repeat(2,1fr)}.gallery{columns:2}.job-card{padding:24px}.job-card-head{grid-template-columns:1fr}.job-meta{grid-template-columns:1fr 1fr}.job-details{grid-template-columns:1fr}.legal-grid{grid-template-columns:1fr}.legal-aside{position:relative;top:auto}.footer{grid-template-columns:1fr}.form-row{grid-template-columns:1fr}.quote-block{padding:90px var(--pad)}}
@media(max-width:520px){.team-grid,.home-numbers,.metric-grid,.process-grid,.principle-grid,.benefit-grid,.service-index,.job-meta{grid-template-columns:1fr}.gallery{columns:1}.client-logo{height:140px}.menu-panel a{font-size:39px}}

/* Startseite: Headbanner ohne Video */
.hero-no-media{background:radial-gradient(circle at 78% 25%,rgba(255,255,255,.055),transparent 32%),#050505;}

/* V4: gesamten Schrift-/Inhaltsblock im Startseiten-Headbanner deutlich weiter nach oben verschieben */
.hero-no-media .hero-content{
  transform: translateY(-165px);
}
@media(max-width:1100px){
  .hero-no-media .hero-content{transform:translateY(-120px);}
}
@media(max-width:760px){
  .hero-no-media .hero-content{transform:translateY(-70px);}
}


/* V5: Headbanner metrics/buttons removed */
.hero-bottom-simple{max-width:760px;}
.hero-bottom-simple p{margin-bottom:0 !important;}


/* V6: Headbanner cyber face + animated center line */
.hero-no-media{
  background:
    radial-gradient(circle at 76% 24%,rgba(255,255,255,.075),transparent 30%),
    radial-gradient(circle at 84% 36%,rgba(255,255,255,.03),transparent 24%),
    linear-gradient(90deg,rgba(0,0,0,0) 0%,rgba(0,0,0,.06) 100%),
    #050505;
}
.hero-no-media .hero-content{
  max-width:min(58%,960px);
  position:relative;
  z-index:3;
}
.hero-cyber-face{
  position:absolute;
  top:88px;
  right:0;
  bottom:0;
  width:min(43vw,760px);
  display:flex;
  align-items:flex-end;
  justify-content:flex-end;
  pointer-events:none;
  z-index:1;
}
.hero-cyber-face::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,rgba(5,5,5,1) 0%,rgba(5,5,5,.82) 10%,rgba(5,5,5,.18) 26%,rgba(5,5,5,0) 44%);
  z-index:2;
}
.hero-cyber-face img{
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:right bottom;
  opacity:.9;
  filter:drop-shadow(0 20px 50px rgba(255,255,255,.06)) contrast(1.04) brightness(.95);
}
.hero-center-line{
  position:absolute;
  top:120px;
  bottom:78px;
  left:56%;
  width:1px;
  background:linear-gradient(180deg,rgba(255,255,255,0),rgba(255,255,255,.12) 15%,rgba(255,255,255,.08) 85%,rgba(255,255,255,0));
  z-index:2;
  overflow:hidden;
}
.hero-center-line::after{
  content:"";
  position:absolute;
  left:-1px;
  width:3px;
  height:190px;
  top:0;
  border-radius:999px;
  background:linear-gradient(180deg,rgba(255,255,255,0),rgba(255,255,255,.92) 35%,rgba(255,255,255,.35) 70%,rgba(255,255,255,0));
  box-shadow:0 0 14px rgba(255,255,255,.22);
  animation:heroLineFloat 5.8s ease-in-out infinite;
}
@keyframes heroLineFloat{
  0%{transform:translateY(0);opacity:.45}
  50%{transform:translateY(calc(100vh - 430px));opacity:1}
  100%{transform:translateY(0);opacity:.45}
}
@media(max-width:1400px){
  .hero-no-media .hero-content{max-width:min(54%,860px)}
  .hero-center-line{left:55.5%}
  .hero-cyber-face{width:min(41vw,680px)}
}
@media(max-width:1100px){
  .hero-no-media .hero-content{max-width:100%}
  .hero-cyber-face{opacity:.22;width:min(62vw,540px);top:110px}
  .hero-center-line{left:auto;right:34px;opacity:.35}
}
@media(max-width:760px){
  .hero-cyber-face{display:none}
  .hero-center-line{display:none}
}


/* V7: Navigation rechts + Desktop-Burger, Projekt-starten entfernt */
.header{
  grid-template-columns:1fr auto auto;
  column-gap:18px;
}
.nav{
  justify-self:end;
  margin-left:auto;
}
.head-cta{display:none !important;}
.menu-btn{
  display:block;
  justify-self:end;
  position:relative;
  z-index:1200;
  cursor:pointer;
  border:1px solid rgba(255,255,255,.13);
  border-radius:999px;
  width:46px;
  height:46px;
  transition:border-color .25s ease,background .25s ease,transform .25s ease;
}
.menu-btn:hover{
  border-color:rgba(255,255,255,.45);
  background:rgba(255,255,255,.055);
}
.menu-btn span{
  width:20px;
  transition:transform .35s cubic-bezier(.77,0,.18,1),opacity .25s ease;
}
.menu-open .menu-btn span:first-child{transform:translateY(4px) rotate(45deg);}
.menu-open .menu-btn span:last-child{transform:translateY(-4px) rotate(-45deg);}
.menu-panel{
  display:flex;
  position:fixed;
  inset:0;
  z-index:1050;
  background:rgba(5,5,5,.97);
  backdrop-filter:blur(18px);
  padding:130px var(--pad) 54px;
  flex-direction:column;
  justify-content:center;
  align-items:flex-end;
  transform:translateY(-100%);
  opacity:0;
  visibility:hidden;
  transition:transform .55s cubic-bezier(.77,0,.18,1),opacity .35s ease,visibility .55s;
}
.menu-open .menu-panel{
  transform:none;
  opacity:1;
  visibility:visible;
}
.menu-panel a{
  width:min(760px,100%);
  text-align:right;
  font-size:clamp(42px,6vw,94px);
  line-height:.92;
  font-weight:900;
  letter-spacing:-.06em;
  text-transform:uppercase;
  padding:12px 0;
  border-bottom:1px solid var(--line);
  transition:padding-right .25s ease,color .25s ease;
}
.menu-panel a:hover{padding-right:18px;color:#bdbdb7;}
body.menu-open{overflow:hidden;}

@media(max-width:1100px){
  .header{grid-template-columns:1fr auto;column-gap:12px;}
  .nav{display:none;}
  .menu-btn{display:block;}
  .menu-panel{
    padding:120px 28px 40px;
    align-items:flex-start;
  }
  .menu-panel a{
    text-align:left;
    font-size:48px;
  }
}
@media(max-width:520px){
  .menu-panel a{font-size:39px;}
}


/* V8: WhatsApp Direktkontakt */
.contact-direct .whatsapp-button{display:inline-flex;align-items:center;gap:12px;width:max-content;margin-top:18px;padding:14px 18px;border:1px solid rgba(255,255,255,.28);border-radius:999px;color:#fff;background:rgba(255,255,255,.04);font-size:12px;font-weight:850;letter-spacing:.08em;text-transform:uppercase;transition:.25s ease}
.contact-direct .whatsapp-button:hover{background:#fff;color:#050505;border-color:#fff;transform:translateY(-2px)}
.whatsapp-icon{width:19px;height:19px;display:inline-flex;flex:0 0 19px}.whatsapp-icon svg{width:100%;height:100%;display:block}.contact-direct .whatsapp-button b{font-size:15px;font-weight:500;margin-left:4px}


/* V9/V11: Ticker / Laufschrift angepasst */
.ticker{
  height:76px;
  border-bottom:1px solid var(--line);
  overflow:hidden;
  display:flex;
  align-items:center;
  background:#000 !important;
}
.ticker-track{
  width:max-content;
  display:flex;
  align-items:center;
  gap:28px;
  animation:ticker 34s linear infinite;
}
.ticker-track span{
  font-family:Arial, Helvetica, sans-serif;
  font-size:23px;
  font-weight:800;
  letter-spacing:.03em;
  white-space:nowrap;
  color:#eaff00;
  text-transform:uppercase;
  text-shadow:0 0 8px rgba(234,255,0,.22),0 0 16px rgba(234,255,0,.10);
}
.ticker-track i{
  width:8px;
  height:8px;
  background:#eaff00;
  border-radius:50%;
  box-shadow:0 0 10px rgba(234,255,0,.24);
  flex:0 0 auto;
}
@media(max-width:760px){
  .ticker{height:66px;}
  .ticker-track{gap:22px;animation-duration:28s;}
  .ticker-track span{font-size:18px;}
  .ticker-track i{width:7px;height:7px;}
}


/* V10: Navigation als schwarzer Glass-Balken */
.header{
  background:rgba(5,5,5,.72) !important;
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
  border-bottom:1px solid rgba(255,255,255,.10) !important;
  box-shadow:0 10px 30px rgba(0,0,0,.18);
}
.header.scrolled{
  background:rgba(5,5,5,.82) !important;
  backdrop-filter:blur(22px);
  -webkit-backdrop-filter:blur(22px);
  border-bottom:1px solid rgba(255,255,255,.12) !important;
}




/* Original footer logo: preserve its natural proportions on every screen. */
.footer .footer-logo{
  display:block;
  width:120px;
  max-width:100%;
  margin-bottom:12px;
}
.footer .footer-logo img{
  display:block;
  width:100%;
  height:auto;
  object-fit:contain;
}


/* V28: Animation hinter dem Video entfernt */
.intro-grid{
  display:grid;
  grid-template-columns:minmax(400px,560px) minmax(0,1fr);
  gap:68px;
  align-items:center;
}
.intro-media{
  position:relative;
  justify-self:end;
  width:min(100%,450px);
  transform:translateX(72px);
  border-radius:24px;
  overflow:hidden;
  background:#0a0a0a;
  border:1.5px solid rgba(255,255,255,.82);
  box-shadow:0 0 0 1px rgba(255,255,255,.28), 0 18px 50px rgba(0,0,0,.24);
}
.intro-media::before,
.intro-media::after{
  content:none !important;
  display:none !important;
}
.intro-media video{
  position:relative;
  z-index:2;
  width:100%;
  height:100%;
  display:block;
  aspect-ratio:4/5;
  object-fit:cover;
  border-radius:24px;
  filter:contrast(1.02) saturate(.92);
}
.intro-grid .lead-agentur{
  max-width:860px;
  margin:0;
  padding-left:92px;
  font-size:clamp(15px,1.55vw,25px);
  line-height:1.56;
  color:#c9c9c4;
}
.intro-grid .lead-agentur strong{
  color:#fff;
}
@media(max-width:1320px){
  .intro-grid .lead-agentur{padding-left:68px;}
  .intro-media{transform:translateX(54px);}
}
@media(max-width:1100px){
  .intro-grid{
    grid-template-columns:1fr;
    gap:34px;
  }
  .intro-media{
    justify-self:start;
    transform:none;
    max-width:520px;
  }
  .intro-grid .lead-agentur{
    padding-left:0;
    max-width:100%;
  }
}
@media(max-width:760px){
  .intro-grid .lead-agentur{
    font-size:clamp(15px,5vw,22px);
    line-height:1.55;
  }
  .intro-media{
    width:100%;
  }
}


/* V32: Effekt entfernt, Video standardmäßig schwarz-weiß, Hover wieder farbig */
.intro-media{
  overflow:hidden;
}
.intro-media::before,
.intro-media::after{
  content:none !important;
  display:none !important;
  animation:none !important;
}
.intro-media video{
  filter:grayscale(1) contrast(1.03) brightness(.96);
  transition:filter .65s ease, transform .65s ease;
}
@media (hover:hover) and (pointer:fine){
  .intro-media:hover video{
    filter:grayscale(0) contrast(1.02) saturate(1) brightness(1);
  }
}


/* V33: Agentur-Text + Counter unter dem Text in 4 Blöcken */
.intro-grid{
  display:grid;
  grid-template-columns:minmax(400px,560px) minmax(0,1fr);
  gap:68px;
  align-items:center;
}
.intro-copy{
  display:flex;
  flex-direction:column;
  justify-content:center;
  transform:translateY(-18px);
}
.intro-grid .lead-agentur{
  max-width:860px;
  margin:0;
  padding-left:0;
  font-size:clamp(15px,1.55vw,25px);
  line-height:1.56;
  color:#c9c9c4;
}
.counter-grid{
  margin-top:34px;
  width:100%;
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:0;
  border-top:1px solid var(--line);
  border-left:1px solid var(--line);
}
.counter-grid .home-number{
  min-height:148px;
  padding:26px 24px 22px;
  border-right:1px solid var(--line);
  border-bottom:1px solid var(--line);
  background:rgba(255,255,255,.01);
}
.counter-grid .home-number strong{
  display:block;
  font-size:clamp(44px,3.7vw,68px);
  letter-spacing:-.075em;
  line-height:.92;
}
.counter-grid .home-number span{
  display:block;
  margin-top:28px;
  color:#8f8f8a;
  font-size:10px;
  font-weight:900;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.intro-link{margin-top:26px;}
@media(max-width:1320px){
  .intro-copy{transform:translateY(-10px);}
  .counter-grid .home-number{padding:24px 20px 20px;}
}
@media(max-width:1100px){
  .intro-grid{grid-template-columns:1fr;gap:34px;}
  .intro-copy{transform:none;}
  .counter-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media(max-width:520px){
  .counter-grid{grid-template-columns:1fr;}
}


/* V34: Counter als 2x2 Blöcke in Blau */
.counter-grid{
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:0;
  border-top:1px solid rgba(86,133,255,.28) !important;
  border-left:1px solid rgba(86,133,255,.28) !important;
}
.counter-grid .home-number{
  min-height:170px;
  padding:28px 24px 22px;
  border-right:1px solid rgba(86,133,255,.28) !important;
  border-bottom:1px solid rgba(86,133,255,.28) !important;
  background:linear-gradient(180deg,rgba(28,47,96,.46),rgba(12,20,42,.82));
}
.counter-grid .home-number strong{
  color:#7ea3ff;
  text-shadow:0 0 18px rgba(88,138,255,.18);
}
.counter-grid .home-number span{
  color:#9eb6ff;
}
@media(max-width:520px){
  .counter-grid{
    grid-template-columns:1fr !important;
  }
}


/* V35: Counter nur Konturen blau, kleiner, zentriert + Text oben angepasst */
.intro-grid{
  align-items:start;
}
.intro-copy{
  transform:translateY(-6px);
}
.intro-grid .lead-agentur{
  max-width:900px;
  font-size:clamp(14px,1.35vw,22px);
  line-height:1.6;
  color:#d3d3cf;
}
.counter-grid{
  margin-top:28px;
  border-top:1px solid rgba(86,133,255,.55) !important;
  border-left:1px solid rgba(86,133,255,.55) !important;
  background:transparent !important;
}
.counter-grid .home-number{
  min-height:148px;
  padding:22px 18px;
  border-right:1px solid rgba(86,133,255,.55) !important;
  border-bottom:1px solid rgba(86,133,255,.55) !important;
  background:transparent !important;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
}
.counter-grid .home-number strong{
  color:#78a0ff;
  text-shadow:none;
  font-size:clamp(38px,3vw,56px);
  line-height:1;
}
.counter-grid .home-number span{
  margin-top:18px;
  color:#78a0ff;
  font-size:10px;
  letter-spacing:.16em;
  text-align:center;
}
.intro-link{
  margin-top:22px;
}
@media(max-width:1320px){
  .intro-copy{transform:none;}
}
@media(max-width:1100px){
  .intro-grid{align-items:start;}
  .intro-grid .lead-agentur{max-width:100%;}
}


/* V36: Counter-Block kleiner und weiter weg vom Video */
.counter-grid{
  max-width:760px;
  width:calc(100% - 34px);
  margin-top:30px;
  margin-left:34px;
}
.counter-grid .home-number{
  min-height:128px;
  padding:18px 16px;
}
.counter-grid .home-number strong{
  font-size:clamp(34px,2.6vw,48px);
}
.counter-grid .home-number span{
  margin-top:14px;
  font-size:9px;
}
@media(max-width:1320px){
  .counter-grid{
    max-width:700px;
    width:calc(100% - 22px);
    margin-left:22px;
  }
}
@media(max-width:1100px){
  .counter-grid{
    max-width:100%;
    width:100%;
    margin-left:0;
  }
}


/* V37: Counter kleiner in Silber + Text weiter rechts in Absatzblöcken */
.intro-copy{
  transform:translateY(-2px);
  padding-left:36px;
}
.intro-grid .lead-agentur{
  max-width:760px;
  font-size:clamp(14px,1.25vw,20px);
  line-height:1.62;
  color:#d5d5d2;
}
.lead-agentur-blocks{
  display:flex;
  flex-direction:column;
  gap:14px;
}
.lead-agentur-blocks p{
  margin:0;
  padding:0;
}
.lead-agentur-blocks p strong{
  color:#ffffff;
}
.counter-grid{
  max-width:620px;
  width:calc(100% - 54px);
  margin-top:26px;
  margin-left:54px;
  border-top:1px solid rgba(198,198,198,.58) !important;
  border-left:1px solid rgba(198,198,198,.58) !important;
  background:transparent !important;
}
.counter-grid .home-number{
  min-height:112px;
  padding:16px 14px;
  border-right:1px solid rgba(198,198,198,.58) !important;
  border-bottom:1px solid rgba(198,198,198,.58) !important;
  background:transparent !important;
}
.counter-grid .home-number strong{
  color:#c7c7c7 !important;
  font-size:clamp(30px,2.25vw,42px);
  text-shadow:none !important;
}
.counter-grid .home-number span{
  margin-top:12px;
  color:#c7c7c7 !important;
  font-size:9px;
  letter-spacing:.15em;
}
.intro-link{
  margin-top:18px;
  padding-left:54px;
}
@media(max-width:1320px){
  .intro-copy{padding-left:22px;}
  .counter-grid{max-width:580px;width:calc(100% - 34px);margin-left:34px;}
  .intro-link{padding-left:34px;}
}
@media(max-width:1100px){
  .intro-copy{padding-left:0;}
  .counter-grid{max-width:100%;width:100%;margin-left:0;}
  .intro-link{padding-left:0;}
}


/* V38: Counter weiter nach unten + Agentur-Text 15% größer */
.intro-grid .lead-agentur{
  font-size:clamp(16px,1.44vw,23px);
}
.counter-grid{
  margin-top:48px;
}
@media(max-width:1320px){
  .intro-grid .lead-agentur{
    font-size:clamp(16px,1.4vw,22px);
  }
  .counter-grid{
    margin-top:44px;
  }
}
@media(max-width:1100px){
  .counter-grid{
    margin-top:36px;
  }
}


/* V39: Counter-Block noch tiefer */
.counter-grid{
  margin-top:58px !important;
}


/* V40: Text + Counter als eine saubere Linie / Einheit ausgerichtet */
.intro-copy{
  padding-left:56px !important;
  transform:translateY(-2px);
}
.intro-grid .lead-agentur{
  max-width:760px;
}
.counter-grid{
  max-width:620px;
  width:100%;
  margin-left:0 !important;
  margin-top:58px !important;
}
.intro-link{
  padding-left:0 !important;
}
@media(max-width:1320px){
  .intro-copy{
    padding-left:36px !important;
  }
  .counter-grid{
    max-width:580px;
    width:100%;
    margin-left:0 !important;
  }
}
@media(max-width:1100px){
  .intro-copy{
    padding-left:0 !important;
  }
  .counter-grid{
    max-width:100%;
  }
}


/* V41: Auf beiden Seiten gleichmäßiger Abstand im rechten Inhaltsblock */
.intro-copy{
  padding-left:56px !important;
  padding-right:56px !important;
  box-sizing:border-box;
}
.intro-grid .lead-agentur{
  max-width:none;
}
.counter-grid{
  max-width:none;
  width:100%;
}
@media(max-width:1320px){
  .intro-copy{
    padding-left:36px !important;
    padding-right:36px !important;
  }
}
@media(max-width:1100px){
  .intro-copy{
    padding-left:0 !important;
    padding-right:0 !important;
  }
}


/* V43: Markierungen übernommen – rechter Block tiefer/weiter links, mehr Abstand zum Video, Text 10% größer */
.intro-grid{
  gap:92px !important;
  align-items:start;
}
.intro-copy{
  padding-left:14px !important;
  padding-right:42px !important;
  transform:translateY(34px) !important;
  box-sizing:border-box;
}
.intro-grid .lead-agentur{
  max-width:none !important;
  font-size:clamp(18px,1.58vw,25px) !important;
  line-height:1.64 !important;
}
.lead-agentur-blocks{
  gap:16px !important;
}
.counter-grid{
  margin-top:74px !important;
}
@media(max-width:1320px){
  .intro-grid{
    gap:72px !important;
  }
  .intro-copy{
    padding-left:10px !important;
    padding-right:28px !important;
    transform:translateY(28px) !important;
  }
  .intro-grid .lead-agentur{
    font-size:clamp(17px,1.5vw,23px) !important;
  }
  .counter-grid{
    margin-top:66px !important;
  }
}
@media(max-width:1100px){
  .intro-grid{
    gap:34px !important;
  }
  .intro-copy{
    padding-left:0 !important;
    padding-right:0 !important;
    transform:none !important;
  }
  .intro-grid .lead-agentur{
    font-size:clamp(16px,5vw,22px) !important;
  }
  .counter-grid{
    margin-top:42px !important;
  }
}

/* V44: deutliche Korrektur nach Screenshot-Markierung */
@media(min-width:1321px){
  .intro-grid{
    grid-template-columns:430px minmax(0,1fr) !important;
    column-gap:135px !important;
    align-items:start !important;
  }
  .intro-media{
    width:430px !important;
    transform:translateX(8px) !important;
    justify-self:start !important;
  }
  .intro-copy{
    padding-left:0 !important;
    padding-right:0 !important;
    transform:translate(-55px,72px) !important;
    max-width:760px !important;
  }
  .intro-grid .lead-agentur{
    font-size:clamp(20px,1.72vw,27px) !important;
    line-height:1.58 !important;
    max-width:760px !important;
  }
  .lead-agentur-blocks{
    gap:18px !important;
  }
  .counter-grid{
    width:590px !important;
    max-width:590px !important;
    margin-top:92px !important;
    margin-left:0 !important;
  }
  .intro-link{
    margin-top:22px !important;
    padding-left:0 !important;
  }
}
@media(min-width:1101px) and (max-width:1320px){
  .intro-grid{
    grid-template-columns:410px minmax(0,1fr) !important;
    column-gap:105px !important;
    align-items:start !important;
  }
  .intro-media{
    width:410px !important;
    transform:none !important;
    justify-self:start !important;
  }
  .intro-copy{
    padding:0 !important;
    transform:translate(-30px,58px) !important;
  }
  .intro-grid .lead-agentur{
    font-size:clamp(18px,1.7vw,25px) !important;
    line-height:1.6 !important;
  }
  .counter-grid{
    max-width:560px !important;
    width:560px !important;
    margin-top:78px !important;
    margin-left:0 !important;
  }
}


/* V45: Video im Bereich 01 / Agentur deutlich tiefer */
.intro-media{
  transform:translateX(72px) translateY(58px) !important;
}
@media(max-width:1320px){
  .intro-media{
    transform:translateX(54px) translateY(44px) !important;
  }
}
@media(max-width:1100px){
  .intro-media{
    transform:none !important;
  }
}


/* V46: Nur das Video nach links bewegt */
.intro-media{
  transform:translateX(18px) translateY(58px) !important;
}
@media(max-width:1320px){
  .intro-media{
    transform:translateX(8px) translateY(44px) !important;
  }
}
@media(max-width:1100px){
  .intro-media{
    transform:none !important;
  }
}


/* V47: Text auf gleiche Höhe wie Video + cyanfarbene Schrift */
.intro-grid{
  align-items:start !important;
}
.intro-copy{
  transform:translateY(58px) !important;
}
.intro-grid .lead-agentur,
.intro-grid .lead-agentur p{
  color:#66e7ff !important;
}
.intro-grid .lead-agentur strong,
.lead-agentur-blocks p strong{
  color:#8ff1ff !important;
}
@media(max-width:1320px){
  .intro-copy{
    transform:translateY(44px) !important;
  }
}
@media(max-width:1100px){
  .intro-copy{
    transform:none !important;
  }
}


/* V48: Textfarbe wieder weiß */
.intro-grid .lead-agentur,
.intro-grid .lead-agentur p{
  color:#ffffff !important;
}
.intro-grid .lead-agentur strong,
.lead-agentur-blocks p strong{
  color:#ffffff !important;
}


/* V49: Bereich 02 / Was wir machen – 3x2 Grid, Bilder kleiner, Texte proportional angepasst */
.service-preview-grid{
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:16px !important;
}
.service-preview{
  min-height:300px !important;
  border-radius:22px;
}
.service-preview .meta{
  left:20px !important;
  right:20px !important;
  bottom:18px !important;
  grid-template-columns:34px 1fr auto !important;
  gap:10px !important;
  align-items:end;
}
.service-preview small{
  font-size:8px !important;
  letter-spacing:.14em;
}
.service-preview h3{
  font-size:clamp(20px,1.8vw,30px) !important;
  line-height:.96 !important;
}
.service-preview b{
  font-size:18px !important;
}
@media(max-width:1100px){
  .service-preview-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
  .service-preview{
    min-height:320px !important;
  }
}
@media(max-width:760px){
  .service-preview-grid{
    grid-template-columns:1fr !important;
  }
  .service-preview{
    min-height:420px !important;
  }
}


/* V58: Verlaufskonturen – Headbanner ausdrücklich ausgeschlossen */
.service-preview,
.work-card,
.portrait-card,
.team-card,
.service-media,
.client-logo,
.gallery-item{
  position:relative;
  isolation:isolate;
}

.service-preview::before,
.work-card::before,
.portrait-card::before,
.team-card::before,
.service-media::before,
.client-logo::before,
.gallery-item::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  padding:1.5px;
  background:linear-gradient(135deg,
    rgba(76,188,255,.78) 0%,
    rgba(255,255,255,.38) 34%,
    rgba(92,124,255,.44) 62%,
    rgba(125,235,255,.74) 100%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;
  mask-composite:exclude;
  pointer-events:none;
  z-index:3;
  opacity:.9;
  box-shadow:0 0 20px rgba(75,190,255,.06);
}

.client-logo::before{
  border-radius:0;
  opacity:.68;
}

.gallery-item::before{
  z-index:1;
}

/* Bilder ohne Wrapper: dezente passende Kontur */
.process-media-grid > img{
  border:1.5px solid rgba(105,205,255,.62);
  box-shadow:0 0 0 1px rgba(255,255,255,.08),0 0 20px rgba(74,185,255,.06);
}

/* Headbanner bleibt exakt unangetastet – keine Overrides für .hero, .hero-cyber-face oder deren Bild */

/* Startseite: Leistungsbilder zunächst Schwarz-Weiß, bei Interaktion in Farbe */
.service-preview img{
  filter:grayscale(1) brightness(1.08);
  transition:transform .75s cubic-bezier(.2,.75,.2,1),filter .55s ease;
}

.service-preview:focus-visible img{
  filter:grayscale(0) brightness(1.08) saturate(.98);
}

@media(hover:hover){
  .service-preview:hover img{
    filter:grayscale(0) brightness(1.08) saturate(.98);
  }
}

/* Startseite: aktuelle Angebotsmotive */
.offer-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;
  align-items:start;
}

.offer-card{
  margin:0;
  overflow:hidden;
  border:1.5px solid rgba(105,205,255,.62);
  border-radius:var(--radius);
  background:#0b0b0b;
  box-shadow:0 0 0 1px rgba(255,255,255,.08),0 0 20px rgba(74,185,255,.06);
  cursor:zoom-in;
}

.offer-card img{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:3/4;
  object-fit:cover;
  transition:transform .7s cubic-bezier(.2,.75,.2,1);
}

.offer-card:focus-visible{
  outline:2px solid #7de7ff;
  outline-offset:4px;
}

.offer-card:focus-visible img{
  transform:scale(1.045);
}

body.lightbox-open{
  overflow:hidden;
}

@media(hover:hover){
  .offer-card:hover img{
    transform:scale(1.045);
  }
}

@media(max-width:900px){
  .offer-grid{
    grid-template-columns:1fr;
    max-width:680px;
    margin-inline:auto;
  }
}

/* V64: Partner banner between process and contact. */
.partner-banner{background:#fff;color:#111;padding:42px 0 48px;}
.partner-banner h2{margin:0 0 30px;text-align:center;font-size:14px;line-height:1.5;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:#555;}
.partner-filter{position:absolute;width:0;height:0;overflow:hidden;}
.partner-logos{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));align-items:center;gap:32px;list-style:none;margin:0;padding:0;}
.partner-logo{display:flex;align-items:center;justify-content:center;min-width:0;height:64px;margin:0;padding:0;}
.partner-logo svg{display:block;width:100%;height:56px;overflow:hidden;}
@media(max-width:1050px){.partner-logos{display:flex;flex-wrap:wrap;justify-content:center;gap:28px 36px;}.partner-logo{flex:0 0 calc((100% - 108px)/4);max-width:180px;}}
@media(max-width:600px){.partner-banner{padding:32px 0;}.partner-banner h2{margin-bottom:24px;}.partner-logos{gap:24px 28px;}.partner-logo{flex-basis:calc((100% - 28px)/2);max-width:170px;}.partner-logo svg{height:48px;}}

#agentur{scroll-margin-top:100px;}

/* V66: Angebot anchor and dedicated products page. */
#angebot{scroll-margin-top:100px;}
.products-intro{padding-top:160px;padding-bottom:48px;}
.products-intro h1{font-size:clamp(48px,7vw,110px);line-height:1;letter-spacing:-.055em;margin:24px 0;}
.products-section{padding-bottom:100px;}
.product-detail{min-width:0;}
.product-detail h2{font-size:clamp(24px,2.3vw,34px);line-height:1.15;margin:28px 0 14px;}
.product-detail .copy{font-size:16px;line-height:1.65;margin:0 0 24px;}
.product-detail .btn{font-size:14px;}
@media(max-width:900px){.products-section .offer-grid{gap:56px;}.products-intro{padding-top:130px;}}

@media(max-width:1100px){.menu-panel{overflow-y:auto;}}

/* About page: hero layout without counters. */
.about-page .hero-bottom{grid-template-columns:minmax(0,1fr) auto;}
@media(max-width:1100px){.about-page .hero-bottom{grid-template-columns:1fr;}}

/* V69: About hero with separate text and image panels. */
.about-hero-split{display:grid;grid-template-columns:55.5% 44.5%;align-items:stretch;background:#050505;min-height:100svh;}
.about-hero-split .hero-content{grid-column:1;grid-row:1;display:flex;flex-direction:column;justify-content:center;padding:150px var(--pad) 100px;min-width:0;}
.about-hero-split h1{font-size:clamp(46px,5.1vw,96px);}
.about-hero-split .hero-bottom{display:flex;flex-direction:column;align-items:flex-start;gap:30px;margin-top:42px;max-width:520px;}
.about-hero-image{grid-column:2;grid-row:1;position:relative;min-width:0;overflow:hidden;margin-top:88px;}
.about-hero-image img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;}
.about-hero-split .hero-center-line{left:55.5%;right:auto;top:120px;bottom:78px;}
@media(max-width:1100px){
 .about-hero-split{grid-template-columns:1fr;min-height:auto;}
 .about-hero-split .hero-content{padding:145px var(--pad) 56px;}
 .about-hero-split h1{font-size:clamp(46px,8vw,88px);}
 .about-hero-image{grid-column:1;grid-row:2;height:clamp(280px,55vw,520px);margin-top:0;}
 .about-hero-split .hero-center-line{display:none;}
}
@media(max-width:760px){
 .about-hero-split .hero-content{padding-top:120px;}
 .about-hero-split h1{font-size:9.6vw;}
}

/* V70: Uploaded About artwork and moving divider highlight. */
.about-hero-split .hero-center-line{width:2px;z-index:4;opacity:1;background:linear-gradient(180deg,transparent,rgba(255,255,255,.26) 15%,rgba(255,255,255,.18) 85%,transparent);}
.about-hero-split .hero-center-line::after{left:0;width:2px;height:190px;top:0;animation:aboutDividerTravel 5.8s ease-in-out infinite;background:linear-gradient(180deg,transparent,rgba(255,255,255,.95) 40%,rgba(255,255,255,.4) 70%,transparent);box-shadow:0 0 14px rgba(255,255,255,.3);}
@keyframes aboutDividerTravel{0%,100%{top:0;transform:translateY(0);opacity:.5;}50%{top:100%;transform:translateY(-100%);opacity:1;}}
.about-hero-image img{object-position:center;}
@media(max-width:1100px){.about-hero-image{height:auto;aspect-ratio:1536/2752;}}
@media(prefers-reduced-motion:reduce){.about-hero-split .hero-center-line::after{animation:none;top:40%;}}

/* V71: Show the complete About banner artwork without cropping. */
.about-hero-image{background:#050505;}
.about-hero-image img{object-fit:contain;object-position:center;}

/* V72: Mobile banner proportions match the new artwork. */
@media(max-width:1100px){.about-hero-image{aspect-ratio:629/670;}}

/* V73: Gentle localized fish motion; the complete artwork stays visible. */
.about-fish-art{position:absolute;inset:0;display:block;width:100%;height:100%;}
@media(prefers-reduced-motion:reduce){.about-fish-art .fish-motion{display:none;}}

/* V74: Align the story portrait with the copy and reduce body text by 2pt. */
.about-page #story .portrait-card{position:relative;top:auto;margin-top:0;margin-bottom:0;align-self:start;}
.about-page #story .story-copy p{font-size:calc(clamp(20px,2vw,30px) - 2pt);}

/* V75: Story heading 20% smaller and orange. */
.about-page #story .section-title{font-size:clamp(38.4px,4.4vw,72px);color:#ff7900;}
@media(max-width:760px){.about-page #story .section-title{font-size:10.4vw;}}

/* V76: Moving gradient around the portrait and one further point smaller copy. */
@property --portrait-border-angle{syntax:'<angle>';initial-value:0deg;inherits:false;}
.about-page #story .portrait-card::before{
  padding:2px;
  background:conic-gradient(from var(--portrait-border-angle),#4cbcff,#7debff,#ffffff,#5c7cff,#4cbcff);
  animation:portrait-border-orbit 6s linear infinite;
  opacity:1;
}
@keyframes portrait-border-orbit{to{--portrait-border-angle:360deg;}}
.about-page #story .story-copy p{font-size:calc(clamp(20px,2vw,30px) - 3pt);}
@media(prefers-reduced-motion:reduce){.about-page #story .portrait-card::before{animation:none;}}

/* V77: Team portraits 25% smaller with animated neon contours. */
@property --team-border-angle{syntax:'<angle>';initial-value:0deg;inherits:false;}
.about-page .team-card{
  width:75%;min-width:0;justify-self:center;
  box-shadow:0 0 8px rgba(0,229,255,.28),0 0 22px rgba(115,65,255,.18);
}
.about-page .team-card::before{
  padding:2px;opacity:1;
  background:conic-gradient(from var(--team-border-angle),#00e5ff,#6170ff,#ed49ff,#b8ffff,#00e5ff);
  animation:team-border-orbit 6s linear infinite;
}
@keyframes team-border-orbit{to{--team-border-angle:360deg;}}
@media(max-width:480px){.about-page .team-grid{grid-template-columns:1fr;}}
@media(prefers-reduced-motion:reduce){.about-page .team-card::before{animation:none;}}

/* V78: Team statement below all members, right aligned and 30% larger. */
.about-page .team-closing-copy{font-size:20.8px;text-align:right;max-width:624px;margin:48px 0 0 auto;}

/* V80: Centered team statement, 25% smaller than V79, with moving gradient text. */
.about-page .team-closing-copy{
  font-size:27.3px;text-align:center;max-width:1100px;margin:56px auto 0;
  color:#7debff;overflow-wrap:break-word;
}
@supports ((background-clip:text) or (-webkit-background-clip:text)){
  .about-page .team-closing-copy{
    background-image:linear-gradient(110deg,#00e5ff 0%,#8890ff 25%,#ff73ed 50%,#8890ff 75%,#00e5ff 100%);
    background-size:200% 100%;
    -webkit-background-clip:text;background-clip:text;
    color:transparent;-webkit-text-fill-color:transparent;
    animation:team-copy-gradient 8s linear infinite;
  }
}
@keyframes team-copy-gradient{from{background-position:0% 50%;}to{background-position:200% 50%;}}
@media(prefers-reduced-motion:reduce){.about-page .team-closing-copy{animation:none;}}

/* V81: Awards image in the left column of the Experience section. */
.about-page .experience-grid{align-items:start;}
.about-page .experience-awards img{display:block;width:100%;max-width:500px;height:auto;object-fit:contain;}

/* V82: Dedicated visible awards layout with embedded artwork. */
.about-page .experience-grid{display:grid;grid-template-columns:minmax(250px,430px) minmax(0,1fr);gap:70px;align-items:start;margin-top:28px;}
.about-page .experience-awards{min-width:0;}
@media(max-width:760px){.about-page .experience-grid{grid-template-columns:1fr;gap:32px;}}

/* V83: Focused services proposal. */
@property --service-neon-angle{syntax:'<angle>';initial-value:0deg;inherits:false;}
.services-page .section-title,.services-page .service-detail-copy h2{color:#f5f5f0;}
.services-page .section-title{font-size:clamp(38px,4.4vw,72px);}
.services-page .service-tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;}
.services-page .service-tile{display:block;position:relative;isolation:isolate;overflow:hidden;border-radius:22px;background:#0d0d0f;box-shadow:0 0 16px #00dfff0d;transition:transform .3s,box-shadow .3s;}
.services-page .service-tile::before,.services-page .service-media::before{content:'';position:absolute;inset:0;z-index:3;pointer-events:none;border-radius:inherit;padding:1.5px;background:conic-gradient(from var(--service-neon-angle),#00deff,#696aff,#e75cff,#a0faff,#00deff);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:service-neon-orbit 8s linear infinite;opacity:.7;}
@keyframes service-neon-orbit{to{--service-neon-angle:360deg;}}
.services-page .service-tile-image{aspect-ratio:16/10;overflow:hidden;}
.services-page .service-tile-image img{width:100%;height:100%;object-fit:cover;transition:transform .5s;}
.services-page .service-tile-label{padding:25px;}
.services-page .service-tile-label small{font-size:10px;letter-spacing:.16em;color:#96969c;}
.services-page .service-tile-label h3{font-size:clamp(22px,2vw,30px);letter-spacing:-.035em;margin:14px 0;color:#f5f5f0;}
.services-page .service-tile-label p{color:#ddd;line-height:1.5;font-size:16px;min-height:48px;margin:0 0 24px;}
.services-page .service-tile-label span{color:#8beeff;font-size:11px;letter-spacing:.06em;}
.services-page .service-tile:hover{transform:translateY(-5px);box-shadow:0 0 22px #00dfff25;}
.services-page .service-tile:hover img{transform:scale(1.035);}
.services-page .service-tile:focus-visible{outline:2px solid #f5f5f0;outline-offset:5px;}
.services-page .service-detail{width:min(1440px,calc(100% - var(--pad)*2));margin:0 auto;padding:75px 0;gap:65px;min-height:0;align-items:center;scroll-margin-top:95px;}
.services-page .service-media{border-radius:24px;min-height:0;height:auto;aspect-ratio:4/3;overflow:hidden;}
.services-page .service-media img{width:100%;height:100%;object-fit:cover;}
.services-page .service-detail-copy{padding:0;}
.services-page .service-detail-copy h2{font-size:clamp(34px,3.7vw,60px);margin:20px 0;}
.services-page .service-detail-copy .tagline{font-size:24px;line-height:1.3;}
.services-page .service-detail-copy>p:not(.tagline){color:#ddd;font-size:16px;}
.services-page .service-list li{font-size:14px;}
.services-page .service-detail .btn:hover{border-color:#f5f5f0;color:#ffffff;}
@media(max-width:1100px){.services-page .service-tiles{grid-template-columns:repeat(2,minmax(0,1fr));}.services-page .service-detail{grid-template-columns:1fr;gap:32px;}.services-page .service-detail .service-media{order:0;}.services-page .service-media{max-height:550px;}}
@media(max-width:600px){.services-page .service-tiles{grid-template-columns:1fr;}.services-page .service-detail{padding:48px 0;}.services-page .service-tile-label p{min-height:0;}.services-page .service-detail-copy .tagline{font-size:21px;}}
@media(prefers-reduced-motion:reduce){.services-page .service-tile::before,.services-page .service-media::before{animation:none;}.services-page .service-tile,.services-page .service-tile img{transition:none;}}

/* V85: Services hero with text left and the existing video right. */
.services-page .services-hero-split{display:grid;grid-template-columns:1fr 1fr;align-items:stretch;min-height:100svh;background:#050505;}
.services-page .services-hero-split .hero-content{grid-column:1;grid-row:1;display:flex;flex-direction:column;justify-content:center;min-width:0;padding:150px var(--pad) 90px;}
.services-page .services-hero-split .hero-media{position:relative;inset:auto;grid-column:2;grid-row:1;min-width:0;margin-top:84px;border-left:1px solid rgba(255,255,255,.22);overflow:hidden;}
.services-page .services-hero-split .hero-media video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;}
.services-page .services-hero-split .hero-media::after{background:none;pointer-events:none;}
.services-page .services-hero-split h1{font-size:clamp(44px,4.8vw,86px);}
.services-page .services-hero-split .hero-bottom{display:flex;flex-direction:column;align-items:flex-start;gap:30px;margin-top:38px;max-width:480px;}
@media(max-width:900px){
.services-page .services-hero-split{grid-template-columns:1fr;min-height:auto;}
.services-page .services-hero-split .hero-content{padding:140px var(--pad) 55px;}
.services-page .services-hero-split h1{font-size:clamp(44px,8vw,76px);}
.services-page .services-hero-split .hero-media{grid-column:1;grid-row:2;margin-top:0;border-left:0;border-top:1px solid rgba(255,255,255,.22);height:clamp(300px,65vw,560px);}
}

/* V86: Video column 15% narrower; animated blue and pink divider. */
.services-page .services-hero-split{grid-template-columns:57.5% 42.5%;}
.services-page .services-hero-split .hero-media{border-left:0;}
.services-page .services-hero-split .hero-media::after{
  content:'';position:absolute;inset:0 auto 0 0;width:3px;z-index:4;
  background:linear-gradient(180deg,#00dfff 0%,#ff40d7 25%,#00dfff 50%,#ff40d7 75%,#00dfff 100%);
  background-size:100% 200%;
  box-shadow:0 0 9px #00dfff99,0 0 20px #ff40d766;
  animation:services-divider-flow 5s linear infinite;pointer-events:none;
}
@keyframes services-divider-flow{from{background-position:50% 0%;}to{background-position:50% 200%;}}
@media(max-width:900px){
  .services-page .services-hero-split{grid-template-columns:1fr;}
  .services-page .services-hero-split .hero-media{height:clamp(255px,55.25vw,476px);border-top:0;}
  .services-page .services-hero-split .hero-media::after{inset:0 0 auto;width:100%;height:3px;background-image:linear-gradient(90deg,#00dfff 0%,#ff40d7 25%,#00dfff 50%,#ff40d7 75%,#00dfff 100%);background-size:200% 100%;animation-name:services-divider-flow-horizontal;}
}
@keyframes services-divider-flow-horizontal{from{background-position:0% 50%;}to{background-position:200% 50%;}}
@media(prefers-reduced-motion:reduce){.services-page .services-hero-split .hero-media::after{animation:none;}}

/* V87: Staggered creative wall and a connected three-step process. */
.services-page .creative-wall{gap:30px;align-items:start;padding:6px 0 70px;}
.services-page .creative-wall .service-tile:nth-child(3n+2){margin-top:65px;}
.services-page .creative-wall .service-tile:nth-child(3n){margin-top:25px;}
.services-page .creative-wall .service-tile:nth-child(3n+1) .service-tile-image{aspect-ratio:4/3;}
.services-page .creative-wall .service-tile:nth-child(3n+2) .service-tile-image{aspect-ratio:1/1;}
.services-page .creative-wall .service-tile:nth-child(3n) .service-tile-image{aspect-ratio:5/4;}
.services-page .creative-wall .service-tile-image img{filter:grayscale(1);transition:filter .5s,transform .65s;}
.services-page .creative-wall .service-tile::before{opacity:.4;transition:opacity .35s;}
.services-page .creative-wall .service-tile:is(:hover,:focus-visible){box-shadow:0 0 12px #00dfff30,0 0 28px #ff40d720;}
.services-page .creative-wall .service-tile:is(:hover,:focus-visible)::before{opacity:1;}
.services-page .creative-wall .service-tile:is(:hover,:focus-visible) img{filter:grayscale(0);transform:scale(1.045);}
.services-page .creative-statement{font-size:clamp(38px,5.5vw,84px);font-weight:800;letter-spacing:-.055em;line-height:1.04;text-align:center;margin:35px auto 0;padding:45px 0 0;max-width:1100px;color:#f5f5f0;}
.services-page .creative-statement span{color:#88888f;}
.services-page .creative-steps{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:50px;padding:0;margin:65px 0 0;position:relative;isolation:isolate;}
.services-page .creative-steps::before{content:'';position:absolute;top:29px;left:30px;right:30px;height:2px;z-index:-1;background:linear-gradient(90deg,#00dfff,#ff40d7,#00dfff);background-size:200% 100%;box-shadow:0 0 12px #00dfff55;animation:services-divider-flow-horizontal 6s linear infinite;}
.services-page .step-number{display:grid;place-items:center;width:60px;height:60px;border-radius:50%;background:#09090c;border:1px solid #72dfff;box-shadow:0 0 16px #00dfff20;color:#a1f2ff;font-size:13px;letter-spacing:.1em;}
.services-page .creative-steps li:nth-child(2) .step-number{border-color:#dc7bdf;color:#ffb4ec;}
.services-page .creative-steps h3{font-size:clamp(28px,3vw,42px);letter-spacing:-.04em;margin:28px 0 16px;}
.services-page .creative-steps p{color:#b9b9c0;font-size:16px;line-height:1.7;max-width:340px;margin:0;}
.services-page .creative-process-cta{margin-top:75px;padding-top:38px;border-top:1px solid #ffffff20;display:flex;justify-content:space-between;align-items:center;gap:24px;}
.services-page .creative-process-cta p{font-size:clamp(26px,3vw,42px);letter-spacing:-.04em;margin:0;}
@media(max-width:1100px){.services-page .creative-wall .service-tile:nth-child(n){margin-top:0;}.services-page .creative-wall .service-tile:nth-child(even){margin-top:45px;}.services-page .creative-wall .service-tile:nth-child(n) .service-tile-image{aspect-ratio:4/3;}.services-page .creative-steps{gap:25px;}}
@media(max-width:600px){.services-page .creative-wall{padding-bottom:15px;}.services-page .creative-wall .service-tile:nth-child(n){margin-top:0;}.services-page .creative-statement{padding-top:20px;}.services-page .creative-steps{grid-template-columns:1fr;gap:36px;margin-top:40px;}.services-page .creative-steps::before{top:30px;bottom:30px;left:29px;right:auto;height:auto;width:2px;background-image:linear-gradient(180deg,#00dfff,#ff40d7,#00dfff);background-size:100% 200%;animation-name:services-divider-flow;}.services-page .creative-steps li{position:relative;padding-left:85px;min-height:100px;}.services-page .step-number{position:absolute;left:0;top:0;}.services-page .creative-steps h3{margin-top:0;}.services-page .creative-process-cta{align-items:flex-start;flex-direction:column;}}
@media(hover:none){.services-page .creative-wall .service-tile-image img{filter:none;}}
@media(prefers-reduced-motion:reduce){.services-page .creative-steps::before{animation:none;}.services-page .creative-wall .service-tile-image img{transition:none;}.services-page .creative-wall .service-tile:is(:hover,:focus-visible),.services-page .creative-wall .service-tile:is(:hover,:focus-visible) img{transform:none;}}

/* V88: Subtle creative artwork behind the left hero text. */
.services-page .services-hero-split .hero-content{isolation:isolate;overflow:hidden;background:#050505;}
.services-page .services-hero-split .hero-content::before{content:'';position:absolute;inset:-3%;z-index:-2;pointer-events:none;background:url('assets/services/backas.png') center center / cover no-repeat;opacity:.25;filter:none;}
.services-page .services-hero-split .hero-content::after{content:'';position:absolute;inset:-8%;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 20% 65%,rgba(0,210,255,.075),transparent 50%),radial-gradient(ellipse at 80% 30%,rgba(255,64,215,.055),transparent 46%),linear-gradient(90deg,rgba(5,5,5,.3),transparent 65%);animation:services-hero-glow 14s ease-in-out infinite alternate;}
@keyframes services-hero-glow{from{transform:translate(-1%,1%);opacity:.65;}to{transform:translate(2%,-2%);opacity:1;}}
@media(prefers-reduced-motion:reduce){.services-page .services-hero-split .hero-content::after{animation:none;}}

/* V93: Project-led references with a compact client grid. */
.references-page #arbeiten,.references-page #clients{scroll-margin-top:95px;}
.references-page .section-title{font-size:clamp(40px,4.6vw,76px);color:#f5f5f0;}
.references-page .reference-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:50px 30px;align-items:start;}
.references-page .reference-card{grid-column:span 5;margin:0;min-width:0;}
.references-page .reference-card:nth-child(4n+1),.references-page .reference-card:nth-child(4n+4){grid-column:span 7;}
.references-page .reference-image{display:block;position:relative;isolation:isolate;width:100%;padding:0;border:0;border-radius:18px;overflow:hidden;background:#0b0b0e;cursor:zoom-in;color:#fff;}
.references-page .reference-image img{display:block;width:100%;height:clamp(240px,32vw,480px);object-fit:contain;filter:none;transition:transform .5s;}
.references-page .reference-image::before{content:'';position:absolute;inset:0;z-index:2;pointer-events:none;padding:1.5px;border-radius:inherit;background:linear-gradient(135deg,#00deff,#ff40d7,#00deff);background-size:200% 200%;-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:opacity .3s;}
.references-page .reference-image:is(:hover,:focus-visible)::before{opacity:1;animation:reference-border-flow 5s linear infinite;}
@keyframes reference-border-flow{to{background-position:200% 200%;}}
.references-page .reference-image:focus-visible{outline:2px solid #87ecff;outline-offset:5px;}
.references-page .reference-image:hover img{transform:scale(1.015);}
.references-page .reference-open{position:absolute;right:17px;bottom:17px;padding:10px 14px;border:1px solid #ffffff40;border-radius:30px;background:#050505d9;font-size:11px;letter-spacing:.06em;opacity:0;transition:opacity .3s;}
.references-page .reference-image:is(:hover,:focus-visible) .reference-open{opacity:1;}
.references-page .reference-card figcaption{padding:22px 3px 0;}
.references-page .reference-card small{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:#9999a1;}
.references-page .reference-card h3{font-size:clamp(24px,2.3vw,36px);letter-spacing:-.035em;color:#f5f5f0;margin:10px 0;}
.references-page .reference-card p{font-size:15px;line-height:1.6;color:#aaaab1;margin:0;max-width:540px;}
.references-page .reference-archive{margin-top:60px;border-top:1px solid #ffffff25;}
.references-page .reference-archive summary{display:flex;align-items:center;gap:20px;padding:27px 0;cursor:pointer;list-style:none;font-size:18px;}
.references-page .reference-archive summary::-webkit-details-marker{display:none;}
.references-page .archive-count{font-size:12px;color:#9999a1;margin-left:auto;}
.references-page .archive-symbol{font-size:26px;color:#9eeeff;transition:transform .25s;}
.references-page .archive-open{display:none;}
.references-page .reference-archive[open] .archive-closed{display:none;}
.references-page .reference-archive[open] .archive-open{display:inline;}
.references-page .reference-archive[open] .archive-symbol{transform:rotate(45deg);}
.references-page .reference-grid-more{padding-top:25px;}
.references-page .logo-wall{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));border:0;gap:10px;}
.references-page .client-logo{height:105px;padding:18px;border:1px solid #ffffff12;border-radius:8px;background:#efefeb;}
.references-page .client-logo::before{display:none;}
.references-page .client-logo img{max-width:100%;max-height:65px;filter:grayscale(1);mix-blend-mode:multiply;}
.references-page .client-logo:hover{background:#fff;}
.references-page .client-logo:hover img{filter:none;}
@media(max-width:1100px){.references-page .logo-wall{grid-template-columns:repeat(5,minmax(0,1fr));}}
@media(max-width:760px){.references-page .reference-grid{grid-template-columns:1fr;gap:36px;}.references-page .reference-card:nth-child(n){grid-column:auto;}.references-page .reference-image img{height:auto;max-height:520px;}.references-page .logo-wall{grid-template-columns:repeat(3,minmax(0,1fr));}.references-page .client-logo{height:90px;padding:14px;}.references-page .reference-archive summary{font-size:16px;gap:10px;}.references-page .archive-count{font-size:11px;}}
@media(hover:none){.references-page .reference-open{opacity:1;}.references-page .client-logo img{filter:none;}}
@media(prefers-reduced-motion:reduce){.references-page .reference-image::before,.references-page .reference-image img,.references-page .reference-open{animation:none!important;transition:none;}.references-page .reference-image:hover img{transform:none;}}

/* V94: Equal text and image panels in the references hero. */
.references-page .references-hero-split{display:grid;grid-template-columns:50% 50%;align-items:stretch;min-height:100svh;background:#050505;}
.references-page .references-hero-split .hero-content{grid-column:1;grid-row:1;display:flex;flex-direction:column;justify-content:center;min-width:0;padding:150px var(--pad) 90px;}
.references-page .references-hero-split .hero-media{position:relative;inset:auto;grid-column:2;grid-row:1;min-width:0;margin-top:84px;overflow:hidden;border-left:1px solid rgba(255,255,255,.25);}
.references-page .references-hero-split .hero-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;}
.references-page .references-hero-split .hero-media::after{background:none;pointer-events:none;}
.references-page .references-hero-split h1{font-size:clamp(38px,4.5vw,80px);}
.references-page .references-hero-split .hero-bottom{display:flex;flex-direction:column;align-items:flex-start;gap:30px;margin-top:38px;max-width:480px;}
@media(max-width:900px){
.references-page .references-hero-split{grid-template-columns:1fr;min-height:auto;}
.references-page .references-hero-split .hero-content{padding:140px var(--pad) 55px;}
.references-page .references-hero-split h1{font-size:clamp(38px,7.5vw,70px);}
.references-page .references-hero-split .hero-media{grid-column:1;grid-row:2;margin-top:0;border-left:0;border-top:1px solid rgba(255,255,255,.25);height:clamp(300px,65vw,560px);}
}

/* V95: New right hero artwork and moving red-black center divider. */
.references-page .references-hero-split .hero-media{border-left:0;}
.references-page .references-hero-split .hero-media::after{content:'';position:absolute;inset:0 auto 0 0;width:3px;z-index:4;pointer-events:none;background:linear-gradient(180deg,#ff1738 0%,#050505 25%,#ff1738 50%,#050505 75%,#ff1738 100%);background-size:100% 200%;box-shadow:0 0 10px rgba(255,23,56,.3);animation:references-red-divider 5s linear infinite;}
@keyframes references-red-divider{from{background-position:50% 0%;}to{background-position:50% 200%;}}
@media(max-width:900px){
.references-page .references-hero-split .hero-media{border-top:0;}
.references-page .references-hero-split .hero-media::after{inset:0 0 auto;width:100%;height:3px;background-image:linear-gradient(90deg,#ff1738 0%,#050505 25%,#ff1738 50%,#050505 75%,#ff1738 100%);background-size:200% 100%;animation-name:references-red-divider-horizontal;}
}
@keyframes references-red-divider-horizontal{from{background-position:0% 50%;}to{background-position:200% 50%;}}
@media(prefers-reduced-motion:reduce){.references-page .references-hero-split .hero-media::after{animation:none;}}

/* V96: Editorial project collage, with restrained red interactions. */
.references-page .collage-title-dot{color:#fa2140;}
.references-page .project-collage{padding-top:20px;}
.references-page .collage-scene{position:relative;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));align-items:start;gap:28px;isolation:isolate;padding:70px 0 120px;--collage-drift:0px;}
.references-page .collage-word{position:absolute;left:0;right:0;top:0;z-index:-1;font-size:clamp(62px,12.4vw,185px);font-weight:950;letter-spacing:-.07em;line-height:.9;color:#29292d;white-space:nowrap;pointer-events:none;}
.references-page .collage-word span{color:#fa2140;}
.references-page .collage-scene .collage-piece{position:relative;grid-column:1 / span 6;grid-row:1;margin:30px 0 0;transform:translateY(var(--collage-drift));min-width:0;}
.references-page .collage-scene .collage-piece-2{grid-column:8 / span 5;margin-top:190px;transform:translateY(calc(var(--collage-drift) * -1));}
.references-page .collage-scene-2 .collage-piece-1{grid-column:1 / span 8;margin-top:170px;}
.references-page .collage-scene-2 .collage-piece-2{grid-column:9 / span 4;margin-top:30px;}
.references-page .collage-scene-2 .collage-word{text-align:right;}
.references-page .collage-scene-3 .collage-piece-1{grid-column:2 / span 4;}
.references-page .collage-scene-3 .collage-piece-2{grid-column:7 / span 6;margin-top:155px;}
.references-page .project-collage .reference-image{border:0;border-radius:0;background:transparent;overflow:hidden;}
.references-page .project-collage .reference-image img{width:100%;height:auto;max-height:660px;object-fit:contain;transition:filter .4s;}
.references-page .project-collage .reference-image:hover img{transform:none;filter:brightness(.85);}
.references-page .project-collage .reference-image::before{display:none;}
.references-page .project-collage .reference-image:focus-visible{outline-color:#ff3452;}
.references-page .project-collage .reference-open{background:#f32242;border:0;color:white;right:15px;bottom:15px;font-size:12px;}
.references-page .project-collage figcaption{position:relative;padding:18px 0 0;border-top:1px solid #ffffff22;margin-top:12px;transition:opacity .25s,transform .25s;}
.references-page .project-collage figcaption::before{content:'';position:absolute;left:0;top:-1px;width:32px;height:2px;background:#fa2140;}
.references-page .project-collage figcaption small{color:#aaaab1;}
.references-page .project-collage figcaption h3{font-size:clamp(23px,2.6vw,38px);}
.references-page .project-collage figcaption p{font-size:14px;}
@media(hover:hover) and (min-width:901px){
.references-page .project-collage figcaption{opacity:0;transform:translateY(6px);}
.references-page .collage-piece:hover figcaption,.references-page .collage-piece:focus-within figcaption{opacity:1;transform:none;}
}
.references-page .reference-grid-more .reference-image{border-radius:0;}
.references-page .reference-grid-more .reference-image::before{background:#fa2140;animation:none;}
.references-page .reference-grid-more .reference-open{background:#e8213b;border-color:#e8213b;}
.references-page .archive-symbol{color:#fa2140;}
@media(max-width:900px){
.references-page .collage-scene{padding:55px 0 65px;gap:22px;}
.references-page .collage-word{font-size:clamp(50px,12vw,108px);}
.references-page .collage-scene .collage-piece-1{grid-column:1 / span 7;margin-top:20px;transform:none;}
.references-page .collage-scene .collage-piece-2{grid-column:8 / span 5;margin-top:120px;transform:none;}
.references-page .project-collage figcaption{opacity:1;transform:none;}
.references-page .project-collage .reference-open{opacity:1;}
}
@media(max-width:600px){
.references-page .collage-scene{display:grid;grid-template-columns:1fr;gap:34px;padding:52px 0 55px;}
.references-page .collage-scene .collage-piece:nth-child(n){grid-column:1;grid-row:auto;margin:15px 0 0;transform:none;}
.references-page .collage-scene .collage-piece-2{width:88%;justify-self:end;}
.references-page .collage-word{font-size:12vw;}
.references-page .project-collage .reference-image img{max-height:540px;}
}
@media(prefers-reduced-motion:reduce){.references-page .collage-scene .collage-piece{transform:none!important;}.references-page .project-collage figcaption,.references-page .project-collage .reference-image img{transition:none;}}

/* Compact partner strip with eight equally spaced logos. */
.partner-banner { padding: 20px 0 22px; }
.partner-banner h2 { margin-bottom: 14px; }
.partner-logos { grid-template-columns: repeat(8,minmax(0,1fr)); gap: 26px; }
.partner-logo { height: 40px; }
.partner-logo svg,.partner-logo img { display: block; width: 90%; height: 38px; object-fit: contain; }
@media(max-width:1050px) {
 .partner-logos { gap: 18px 28px; }
 .partner-logo { flex: 0 0 calc((100% - 84px)/4); max-width: 155px; }
}
@media(max-width:600px) {
 .partner-banner { padding: 18px 0; }
 .partner-banner h2 { margin-bottom: 12px; }
 .partner-logos { gap: 16px 24px; }
 .partner-logo { flex-basis: calc((100% - 24px)/2); max-width: 140px; height: 34px; }
 .partner-logo svg,.partner-logo img { height: 32px; }
}