@font-face{
  font-family:'Stack Sans Notch';
  src:url('assets/StackSansNotch-VariableFont_wght.ttf') format('truetype-variations'), url('assets/StackSansNotch-VariableFont_wght.ttf') format('truetype');
  font-weight:100 900;
  font-display:swap;
}
:root{
  --signalgelb:#FFA420;
  --midnight-navy:#0F2942;
  --neverything:#0F0F0F;
  --dark-surface:#26262A;
  --kimchi:#FF8400;
  --orchid-white:#FFFCF2;
  --purple-accent:#8B5CF6; /* Platzhalter - echter Hex fehlt im Brand Book */
  --mint-accent:#2DD8B0;   /* Platzhalter - genutzt von ReBounce + OTC */
  --font-display:'Stack Sans Notch', 'Barlow Condensed', sans-serif;
  --font-headline:'Satoshi', 'Manrope', sans-serif;
  --font-body:'Inter', sans-serif;
  --font-accent:'Stack Sans Notch', 'Barlow Condensed', sans-serif;
  --max-w:1240px;
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  font-family:var(--font-body);
  background:var(--orchid-white);
  color:var(--neverything);
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
  padding-top:88px;
  opacity:0;
  animation:kpPageFadeIn 0.6s ease-out 0.02s forwards;
}
@keyframes kpPageFadeIn{ to { opacity:1; } }
a{color:inherit; text-decoration:none;}
img,svg{display:block;}
.wrap{max-width:var(--max-w); margin:0 auto; padding:0 32px;}
section{padding:96px 0;}
h1,h2,h3,h4{font-family:var(--font-headline); font-weight:800; letter-spacing:-0.02em;}
.eyebrow{
  font-family:var(--font-accent);
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:0.08em;
  font-size:13px;
  color:var(--midnight-navy);
  display:inline-flex;
  align-items:center;
  gap:8px;
}
.eyebrow::before{display:none;}
.btn{
  display:inline-flex; align-items:center; gap:8px;
  padding:14px 28px; border-radius:15px;
  font-family:var(--font-accent); font-weight:700; font-size:15px;
  text-transform:uppercase; letter-spacing:0.03em;
  border:2px solid transparent; cursor:pointer;
  transition:transform .2s ease, background .2s ease, color .2s ease, border-color .2s ease;
}
.btn:hover{transform:translateY(-2px);}
.btn-primary{background:var(--signalgelb); color:var(--neverything);}
.btn-primary:hover{background:var(--midnight-navy); color:var(--orchid-white);}
.btn-ghost{background:transparent; border-color:var(--neverything); color:var(--neverything);}
.btn-ghost:hover{background:var(--midnight-navy); border-color:var(--midnight-navy); color:var(--orchid-white);}
.btn-ghost-light{background:transparent; border-color:var(--orchid-white); color:var(--orchid-white);}
.btn-ghost-light:hover{background:var(--midnight-navy); border-color:var(--midnight-navy); color:var(--orchid-white);}
.btn .sq{width:8px; height:8px; background:currentColor; display:inline-block; flex-shrink:0; transition:transform .25s ease;}
.btn:hover .sq{transform:rotate(45deg);}

body.jobs-page .btn .sq{
  width:10px; height:10px; background:none; position:relative; transform:none !important;
}
body.jobs-page .btn .sq::before{
  content:''; position:absolute; inset:0; background:currentColor;
  transition:opacity .2s ease, transform .2s ease;
}
body.jobs-page .btn .sq::after{
  content:''; position:absolute; left:1px; top:1px; width:9px; height:9px;
  border-top:2px solid currentColor; border-right:2px solid currentColor;
  transform:rotate(45deg) scale(0); opacity:0; transform-origin:center;
  transition:opacity .2s ease, transform .2s ease;
}
body.jobs-page .btn:hover .sq::after{opacity:1; transform:rotate(45deg) scale(1);}
body.jobs-page .btn .sq.job-hd-arrow{width:18px; height:8px; background:none;}
body.jobs-page .btn .sq.job-hd-arrow::before{
  content:''; position:absolute; left:5px; top:-1px; width:8px; height:8px; background:currentColor;
  transition:opacity .2s ease, transform .25s ease;
}
body.jobs-page .btn .sq.job-hd-arrow::after{content:none;}
body.jobs-page .btn:hover .sq.job-hd-arrow::before{opacity:0; transform:scale(0.3);}
body.jobs-page .btn .sq.job-hd-arrow .hd-arrow{
  position:absolute; inset:0; width:100%; height:100%; display:block; overflow:visible;
  opacity:0; transform:translateX(-4px) scale(0.7); transition:opacity .25s ease, transform .3s ease;
}
body.jobs-page .btn:hover .sq.job-hd-arrow .hd-arrow{opacity:1; transform:translateX(0) scale(1);}
.btn .sq.hd-arrow-btn{width:18px; height:8px; background:none; position:relative; transform:none !important;}
.btn .sq.hd-arrow-btn::before{content:''; position:absolute; left:5px; top:-1px; width:8px; height:8px; background:currentColor; transition:opacity .2s ease, transform .25s ease;}
.btn:hover .sq.hd-arrow-btn::before{opacity:0; transform:scale(0.3);}
.btn .sq.hd-arrow-btn .hd-arrow{position:absolute; inset:0; width:100%; height:100%; display:block; overflow:visible; opacity:0; transform:translateX(-4px) scale(0.7); transition:opacity .25s ease, transform .3s ease;}
.btn:hover .sq.hd-arrow-btn .hd-arrow{opacity:1; transform:translateX(0) scale(1);}
.btn-otc{background:var(--purple-accent); color:var(--orchid-white);}
.btn-otc:hover{background:var(--midnight-navy); color:var(--orchid-white);}
.btn-rebounce{background:var(--mint-accent); color:var(--neverything);}
.btn-rebounce:hover{background:var(--midnight-navy); color:var(--orchid-white);}

/* ---------- NAV ---------- */
header{
  position:fixed; top:18px; left:0; right:0; z-index:300;
  background:transparent;
  border-bottom:none;
  transition:box-shadow .25s ease, border-color .25s ease, background .25s ease;
}
/* Nur auf Produktseiten (prod-hero): Nav löst sich nach dem Hero vom Viewport und scrollt mit der Seite weg, statt weiter zu kleben */
header.detached{position:absolute;}
nav.wrap{
  display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:14px;
  padding:14px 32px; transition:padding .25s ease;
}
header.scrolled nav.wrap{padding:10px 32px;}
.logo{display:flex; align-items:center; flex-shrink:0; justify-self:start; grid-column:1; grid-row:1;}
.logo-img{height:36px; width:auto; display:block; transition:height .25s ease;}
header.scrolled .logo-img{height:30px;}
.logo-swap{position:relative; display:block;}
.logo-img-black, .logo-img-white{transition:opacity .25s ease, height .25s ease;}
.logo-img-white{position:absolute; left:0; top:0; opacity:0;}
header.nav-on-dark .logo-img-black{opacity:0;}
header.nav-on-dark .logo-img-white{opacity:1;}
.footer-logo-img{height:48px;}

/* Zentrale Gruppe: Pille + CTA - über Grid immer exakt mittig im Header, egal wie breit Logo/Utility sind */
.nav-center-group{display:flex; align-items:center; gap:16px; justify-self:center; grid-column:2; grid-row:1;}

/* Zentrale Pille: Home/Claim-Box + Nav-Links, wie bei digitalists in einer gemeinsamen Kapsel */
.nav-center-pill{
  display:flex; align-items:stretch; gap:0;
  background:rgba(255,252,242,0.55); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  border-radius:15px; padding:6px 6px 6px 20px;
}
.nav-info{
  display:flex; flex-direction:column; justify-content:center;
  padding-right:36px; margin-right:8px;
  line-height:1.3; white-space:nowrap;
}
.nav-info .tag{font-family:var(--font-headline); font-size:13px; font-weight:700; color:var(--neverything); display:flex; align-items:center; gap:6px;}
.nav-info .home-icon{width:14px; height:14px; flex-shrink:0;}
.nav-info .claim{
  font-family:'Courier New', monospace; font-size:10px; letter-spacing:0.03em;
  text-transform:uppercase; color:rgba(15,15,15,0.5);
}

.nav-links{display:flex; align-items:center; gap:4px;}
.nav-link-wrap{position:relative;}
.nav-link{
  display:flex; align-items:center; gap:5px; padding:9px 15px; border-radius:10px;
  font-family:var(--font-headline); font-weight:500; font-size:15px; letter-spacing:0;
  cursor:pointer; transition:background .15s ease; text-decoration:none; color:var(--neverything);
  white-space:nowrap;
}
.nav-link:hover, .nav-link.open{background:rgba(255,252,242,0.9);}
.nav-link .chev{font-size:11px; line-height:1; display:inline-flex; align-items:center; transform:translateY(-2px); transition:transform .2s ease;}
.nav-link.open .chev{transform:translateY(-2px) rotate(180deg);}
@media (max-width:1100px){ .nav-center-pill{display:none;} }

/* Dropdown-Container teilt sich die Grid-Spalte mit der Center-Gruppe, damit er keine eigene Spalte belegt (sonst rutscht nav-utility in eine neue Zeile) */
.mega-dropdown-container{position:static; grid-column:2; grid-row:1;}
.mega-dropdown{
  position:absolute; top:100%; left:50%; transform:translate(-50%, -8px);
  width:min(880px, calc(100vw - 64px));
  background:var(--orchid-white); border:1px solid rgba(15,15,15,0.08); border-radius:24px;
  box-shadow:0 30px 70px rgba(15,15,15,0.18); padding:32px 36px; z-index:400;
  opacity:0; visibility:hidden;
  transition:opacity .2s ease, transform .2s ease, visibility 0s linear .2s;
}
.mega-dropdown.open{opacity:1; visibility:visible; transform:translate(-50%, 0); transition:opacity .2s ease, transform .2s ease;}
.mega-rows{display:grid; grid-template-columns:1fr 1fr; gap:0 36px;}
.mega-rows-single{grid-template-columns:1fr;}
.mega-row{
  display:flex; align-items:center; gap:16px; padding:14px 10px; border-bottom:1px solid rgba(15,15,15,0.08);
  text-decoration:none; color:var(--neverything); border-radius:12px; transition:background .15s ease;
}
.mega-row:hover{background:rgba(255,164,32,0.12);}
.thumb, .thumb-lg{
  display:grid; grid-template-columns:repeat(8,1fr); grid-template-rows:repeat(8,1fr); gap:1px;
  box-sizing:border-box;
}
.thumb i, .thumb-lg i{background:transparent; border-radius:1px; display:block; width:100%; height:100%; font-style:normal;}
.mega-row .thumb{
  width:48px; height:48px; flex-shrink:0; padding:13px;
  border-radius:12px; background:rgba(15,15,15,0.045);
}
.mega-row .thumb i.on{background:var(--signalgelb);}
.mega-row.rebounce .thumb{background:rgba(45,216,176,0.12);}
.mega-row.rebounce .thumb i.on{background:var(--mint-accent);}
.mega-row.otc .thumb{background:rgba(139,92,246,0.12);}
.mega-row.otc .thumb i.on{background:var(--purple-accent);}
.mega-row.shoppingplus .thumb{background:rgba(139,92,246,0.12);}
.mega-row.shoppingplus .thumb i.on{background:var(--purple-accent);}
.mega-row.affiliate .thumb{background:rgba(139,92,246,0.12);}
.mega-row.affiliate .thumb i.on{background:var(--purple-accent);}
.mega-row .label{font-family:var(--font-body); font-size:16px; font-weight:500;}

.mega-bottom{display:grid; grid-template-columns:1fr 1.4fr; gap:24px; margin-top:26px; align-items:stretch;}
.mega-bottom-single{grid-template-columns:1fr;}
.mega-dropdown{max-height:calc(100vh - 120px); overflow-y:auto;}
.mega-badges-label{
  display:block; font-family:var(--font-accent); font-size:11px; font-weight:700;
  text-transform:uppercase; letter-spacing:0.05em; color:rgba(15,15,15,0.4); margin-bottom:14px;
}
.mega-badges{display:flex; flex-wrap:wrap; gap:8px; align-content:flex-start;}
.mega-badge{
  background:rgba(15,15,15,0.05); border-radius:999px; padding:7px 14px;
  font-size:12px; font-weight:600; color:rgba(15,15,15,0.7);
}
.mega-contact{
  background:var(--signalgelb); border-radius:16px; padding:20px 22px;
  display:flex; flex-direction:column; justify-content:space-between; gap:12px;
}
.mega-contact .phone{font-family:var(--font-headline); font-weight:800; font-size:18px; text-decoration:underline; text-underline-offset:4px;}
.mega-contact .quicklinks{display:flex; gap:16px; font-family:var(--font-accent); font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:0.03em;}
.mega-contact .quicklinks a{color:var(--neverything); text-decoration:none;}
.mega-contact .quicklinks a:hover{text-decoration:underline;}

.nav-cta{display:flex; gap:10px; align-items:center; flex-shrink:0;}
.nav-cta .btn{padding:11px 22px; font-size:13px; gap:10px; border-radius:15px; font-family:var(--font-headline); font-weight:700; transition:background .2s ease, color .2s ease, transform .2s ease;}
.nav-cta .btn .sq{width:8px; height:8px; background:currentColor; display:inline-block;}
.nav-cta .btn-primary:hover{background:var(--midnight-navy); color:var(--orchid-white);}
body.ueber-uns-page .nav-cta .btn-primary{background:transparent; color:var(--midnight-navy); border:2px solid var(--midnight-navy);}
body.ueber-uns-page .nav-cta .btn-primary:hover{background:var(--midnight-navy); color:var(--orchid-white);}

/* Slide-Icon im CTA-Button: im Ruhezustand links vom Text, wandert beim Hover auf die rechte Seite */
.btn-slide-icon{display:inline-flex; align-items:center;}
.btn-slide-icon-track{
  order:0; width:16px; height:16px; overflow:hidden; position:relative; display:inline-block; flex-shrink:0;
  transition:order 0s;
}
.btn-slide-icon-text{order:1;}
.btn-slide-icon:hover .btn-slide-icon-track{order:2;}
.btn-slide-icon-track img{
  position:absolute; top:0; left:0; width:16px; height:16px; object-fit:contain;
  transition:transform .35s ease, filter .2s ease;
}
.btn-slide-icon-track img:nth-child(1){transform:translateX(0);}
.btn-slide-icon-track img:nth-child(2){transform:translateX(-100%);}
.btn-slide-icon:hover .btn-slide-icon-track img:nth-child(1){transform:translateX(100%);}
.btn-slide-icon:hover .btn-slide-icon-track img:nth-child(2){transform:translateX(0);}
.nav-cta .btn-primary:hover .btn-slide-icon-track img{filter:brightness(0) invert(1);}
.nav-utility{display:flex; align-items:center; gap:8px; flex-shrink:0; justify-self:end; grid-column:3; grid-row:1;}
.nav-search-btn{
  width:38px; height:38px; border-radius:10px; border:none; background:transparent; cursor:pointer;
  display:flex; align-items:center; justify-content:center; font-size:16px; color:var(--neverything);
  transition:background .15s ease;
}
.nav-search-btn:hover{background:rgba(15,15,15,0.06);}
.menu-toggle{
  display:flex; align-items:center; gap:0;
  background:rgba(255,252,242,0.55); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  color:var(--neverything);
  border:1.5px solid var(--neverything); border-radius:10px; padding:8px 14px;
  font-family:var(--font-headline); font-weight:700; font-size:13px; letter-spacing:0.02em;
  cursor:pointer; transition:background .15s ease, color .15s ease;
}
.menu-toggle:hover{background:var(--neverything); color:var(--orchid-white);}
.menu-toggle .arrow-box{display:none;}

/* ---------- FULLSCREEN MENU OVERLAY (digitalists TL;TR-Stil, dunkles Raster) ---------- */
.menu-overlay{
  position:fixed; inset:0; z-index:500; background:#0a0a0a;
  display:flex; flex-direction:column; overflow:hidden;
  opacity:0; visibility:hidden;
  transition:opacity .3s ease, visibility 0s linear .3s;
  padding:64px 20px 16px;
}
.menu-overlay.open{opacity:1; visibility:visible; transition:opacity .3s ease;}
.menu-close{
  position:fixed; top:20px; left:50%; transform:translateX(-50%); z-index:520;
  width:44px; height:44px; border-radius:50%; background:var(--signalgelb); color:var(--neverything);
  border:none; font-size:16px; cursor:pointer; display:flex; align-items:center; justify-content:center;
  transition:transform .2s ease, background .15s ease, color .15s ease;
}
.menu-close:hover{transform:translateX(-50%) rotate(90deg); background:var(--midnight-navy); color:var(--orchid-white);}

.menu-grid{
  max-width:1520px; margin:0 auto; width:100%; height:100%;
  display:flex; gap:20px;
}
.menu-col{display:flex; flex-direction:column; gap:20px; min-width:0; height:100%;}
.menu-col-left{flex:1.05;}
.menu-col-mid{flex:1;}
.menu-col-right{flex:1.15;}
@media (max-width:960px){
  .menu-overlay{overflow-y:auto;}
  .menu-grid{flex-direction:column; height:auto;}
  .menu-col{height:auto;}
}
.menu-cell{
  background:#161616; border-radius:20px; padding:34px 36px; color:var(--orchid-white);
  display:flex; flex-direction:column; min-height:0;
}
.menu-cell-label{
  font-family:'Courier New', monospace; font-size:14px; font-weight:700;
  text-transform:uppercase; letter-spacing:0.05em; color:rgba(255,252,242,0.45); margin-bottom:12px; display:block;
}
.menu-cell-wer{flex:0 0 auto;}
.menu-cell-wer p{font-size:14px; font-weight:300; line-height:1.5; color:rgba(255,252,242,0.85);}
.menu-cell-leistungen{flex:1; overflow-y:auto;}
.menu-leistungen-cols{display:grid; grid-template-columns:1fr 1fr; gap:0; position:relative;}
.menu-leistungen-col{padding:0 20px; border-left:1px solid rgba(255,252,242,0.12);}
.menu-leistungen-col:first-child{padding-left:0; border-left:none;}
.menu-cat-tag{
  display:inline-block; background:var(--signalgelb); color:var(--neverything); font-size:13px; font-weight:700;
  text-transform:uppercase; letter-spacing:0.03em; padding:7px 14px; border-radius:0; margin-bottom:12px;
}
.menu-leistungen-col a{display:block; font-size:14px; font-weight:300; color:rgba(255,252,242,0.8); padding:3px 0; text-decoration:none; white-space:nowrap;}
.menu-leistungen-col a:hover{color:var(--orchid-white); text-decoration:underline;}
.menu-leistungen-col-bottom{
  margin-top:20px; padding-top:20px; padding-left:0; border-left:none; border-top:1px solid rgba(255,252,242,0.12);
}
.menu-leistungen-col-bottom-links{display:flex; flex-direction:column;}

.menu-cell-loesungen{flex:1.2;}
.menu-loesungen-list{display:flex; flex-direction:column; gap:0; margin-top:0;}
.menu-loesungen-list a{
  display:block; font-size:14px; font-weight:300; color:rgba(255,252,242,0.85); padding:4px 0;
  text-decoration:none; text-decoration-color:transparent; white-space:nowrap;
  transition:color .15s ease, text-decoration-color .15s ease;
}
.menu-loesungen-list a:hover{
  color:var(--signalgelb); text-decoration:underline; text-decoration-color:var(--signalgelb); text-underline-offset:3px;
}

.menu-cell-kunden{
  flex:1; overflow:hidden;
  display:flex; flex-direction:column;
}
.menu-kunden-rows{
  flex:1; display:flex; flex-direction:column; justify-content:center; gap:14px;
  margin:14px -36px -34px; overflow:hidden;
}
.menu-kunden-badges-wrap{overflow:hidden; display:flex; align-items:center; width:100%;}
.menu-kunden-badges{
  display:flex; gap:14px; flex-wrap:nowrap; width:max-content;
  animation:kundenMarquee 22s linear infinite;
}
.menu-kunden-badges.row-reverse{
  animation-name:kundenMarqueeReverse;
}
@keyframes kundenMarquee{ from{transform:translateX(0);} to{transform:translateX(-50%);} }
@keyframes kundenMarqueeReverse{ from{transform:translateX(-50%);} to{transform:translateX(0);} }
.menu-kunden-badge{
  background:rgba(255,252,242,0.08); border-radius:999px; padding:16px 32px;
  font-size:18px; font-weight:700; color:rgba(255,252,242,0.9); white-space:nowrap;
}

.menu-col-right{padding:0;}
.menu-cell-visuals{
  flex:1; padding:0; background:transparent; border-radius:0; overflow:visible;
  display:grid; grid-template-columns:1fr 1fr; grid-template-rows:1fr 1fr; gap:10px;
}
.visual-tile{
  display:flex; align-items:center; justify-content:center; position:relative; overflow:hidden;
  border-radius:16px;
}
.visual-tile .thumb-lg{
  width:36px; height:36px; display:grid; grid-template-columns:repeat(8,1fr); grid-template-rows:repeat(8,1fr); gap:1px; opacity:0.92;
}
.visual-tile .thumb-lg i{background:transparent; border-radius:1px; display:block; width:100%; height:100%; font-style:normal;}
.visual-tile .thumb-lg i.on{background:var(--neverything);}
.visual-tile-photo{
  background-size:cover; background-position:center; filter:grayscale(15%);
  transition:filter .25s ease, transform .25s ease;
}
.visual-tile-photo:hover{filter:grayscale(0%); transform:scale(1.03);}

.menu-cell-form{flex:1; background:var(--signalgelb); color:var(--neverything); overflow-y:auto;}
.menu-cell-form .menu-cell-label{color:rgba(15,15,15,0.5);}
.menu-form{display:flex; flex-direction:column; gap:14px; flex:1;}
.menu-form-row{display:flex; gap:16px;}
.menu-form input{
  background:transparent; border:none; border-bottom:1.5px solid rgba(15,15,15,0.35);
  padding:6px 2px; font-family:var(--font-body); font-size:14px; color:var(--neverything); flex:1; min-width:0;
}
.menu-form input::placeholder{color:rgba(15,15,15,0.5);}
.menu-form-check{display:flex; align-items:flex-start; gap:8px; font-size:12px; color:rgba(15,15,15,0.7); margin-top:4px;}
.menu-form-check input{flex:0 0 auto; width:auto; margin-top:2px;}
.menu-form-submit{
  margin-top:auto; align-self:flex-start; background:var(--neverything); color:var(--orchid-white);
  border:none; border-radius:10px; padding:12px 20px; font-family:var(--font-accent); font-weight:700;
  font-size:13px; letter-spacing:0.03em; cursor:pointer; display:flex; align-items:center; gap:10px;
}
.menu-form-submit .sq{width:8px; height:8px; background:currentColor; display:inline-block;}

/* ---------- HERO (Startseite) ---------- */
.hero{
  margin-top:-88px; padding:208px 0 0; position:relative; overflow:hidden;
  background:radial-gradient(circle at 80% 0%, rgba(255,164,32,0.18), transparent 55%), var(--orchid-white);
  min-height:100vh; box-sizing:border-box; display:flex; align-items:center;
}
.hero > .wrap{width:100%;}
.hero-inner{max-width:820px;}
.home-hero-rating-badge{display:inline-flex; align-items:center; gap:10px; background:#fff; border:1px solid rgba(15,15,15,0.08); border-radius:999px; padding:8px 16px 8px 8px; box-shadow:0 8px 24px rgba(15,15,15,0.06);}
.home-hero-rating-badge .stars{color:var(--signalgelb); font-size:13px; letter-spacing:1px;}
.home-hero-rating-badge .txt{font-size:12px; color:rgba(15,15,15,0.55); font-family:var(--font-accent);}
.home-hero-rating-badge .txt strong{color:var(--neverything); font-weight:700;}
.hero h1{font-size:clamp(40px,6vw,68px); line-height:1.05; margin:20px 0 24px;}
.hero p.subline{font-size:19px; color:var(--midnight-navy); max-width:560px; margin-bottom:36px; font-weight:400;}
.hero-cta-row{display:flex; gap:20px; align-items:center; flex-wrap:wrap;}
.rotate-word-wrap{display:inline-grid; vertical-align:top; overflow:hidden; height:1.2em;}
.rotate-word-wrap .rotate-word{
  grid-area:1/1; color:var(--signalgelb-dark, var(--midnight-navy)); font-weight:700;
  opacity:0; transform:translateY(0.5em); transition:opacity .4s ease, transform .4s ease;
}
.rotate-word-wrap .rotate-word.active{opacity:1; transform:translateY(0);}
.hero .hero-trustbar{
  position:absolute; left:0; right:0; bottom:0; background:transparent;
  border-top:1px solid rgba(15,15,15,0.08); padding:18px 0;
}
.hero-trustbar .wrap{display:flex; align-items:center; justify-content:center; gap:12px; flex-wrap:wrap; font-family:var(--font-accent); font-size:14px; font-weight:700; letter-spacing:0.02em; color:var(--midnight-navy);}
.hero-trustbar-dot{opacity:0.35;}

/* ---------- LEGAL (Impressum/Datenschutz/AGB) ---------- */
body.static-nav header{position:absolute;}
.legal-section{background:var(--orchid-white); padding:80px 0 100px;}
.legal-page{
  background:#fff; border-radius:28px; box-shadow:0 24px 60px rgba(15,15,15,0.06);
  box-sizing:border-box;
  margin-left:-48px; margin-right:-48px;
  padding:72px 48px;
}
.legal-page h1{font-size:clamp(34px,5vw,52px); margin:16px 0 16px;}
.legal-page .subline{font-size:18px; color:var(--midnight-navy); max-width:640px; font-weight:400; margin-bottom:0;}
.legal-body{max-width:none; margin-top:56px;}
.legal-body h2{font-size:clamp(20px,2.4vw,26px); margin:44px 0 14px;}
.legal-body h2:first-child{margin-top:0;}
.legal-body h3{font-size:16px; font-weight:700; margin:26px 0 10px; color:var(--midnight-navy);}
.legal-body p{font-size:15px; line-height:1.7; color:rgba(15,15,15,0.8); margin-bottom:14px;}
.legal-body ul{margin:0 0 14px 20px;}
.legal-body li{font-size:15px; line-height:1.7; color:rgba(15,15,15,0.8); margin-bottom:6px;}
.legal-body a{color:var(--midnight-navy); text-decoration:underline;}
.legal-body strong{font-weight:700;}
.legal-toc{display:flex; flex-direction:column; gap:6px; margin-bottom:8px;}
.legal-updated{font-size:13px; color:rgba(15,15,15,0.45); margin-top:40px;}
@media (max-width:900px){
  .legal-page{margin-left:0; margin-right:0; padding:72px 48px;}
}
@media (max-width:700px){
  .legal-section{padding:140px 0 60px;}
  .legal-page{padding:36px 24px; border-radius:20px;}
}

/* ---------- PAGE HERO (Unterseiten) ---------- */
.page-hero{padding:80px 0 64px; border-bottom:1px solid rgba(15,15,15,0.08);}
.page-hero h1{font-size:clamp(34px,5vw,52px); margin:16px 0 16px;}
.page-hero .subline{font-size:18px; color:var(--midnight-navy); max-width:640px; font-weight:400;}
.breadcrumb{
  display:inline-flex; align-items:center; gap:7px;
  font-family:var(--font-accent); font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:0.05em;
  color:rgba(15,15,15,0.5); background:rgba(15,15,15,0.045);
  padding:7px 13px 7px 11px; border-radius:6px 6px 3px 3px;
  margin-bottom:16px; position:relative;
}
.breadcrumb::before{
  content:''; width:11px; height:9px; flex-shrink:0; opacity:0.55; background-color:currentColor;
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 14'%3E%3Cpath d='M0 2C0 .9.9 0 2 0h3.5c.6 0 1.2.3 1.6.8L8 2h6c1.1 0 2 .9 2 2v8c0 1.1-.9 2-2 2H2c-1.1 0-2-.9-2-2V2z'/%3E%3C/svg%3E");
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 14'%3E%3Cpath d='M0 2C0 .9.9 0 2 0h3.5c.6 0 1.2.3 1.6.8L8 2h6c1.1 0 2 .9 2 2v8c0 1.1-.9 2-2 2H2c-1.1 0-2-.9-2-2V2z'/%3E%3C/svg%3E");
  -webkit-mask-repeat:no-repeat; mask-repeat:no-repeat; -webkit-mask-size:contain; mask-size:contain;
}

.push-headline{
  font-size:clamp(34px,5vw,52px); margin:16px 0 16px; line-height:1.05;
}
.push-trigger{cursor:default;}
.push-word{
  display:inline-block; color:var(--signalgelb); font-style:italic;
  font-family:var(--font-display); transform:translateX(0);
  transition:transform .5s cubic-bezier(.34,1.56,.64,1);
}
.push-trigger:hover ~ .push-word{transform:translateX(38px);}

.kontakt-hero{min-height:calc(100vh - 88px); display:flex; align-items:center; box-sizing:border-box; padding-top:0; padding-bottom:0;}
.kontakt-hero .wrap{width:100%;}
@media (max-width:700px){ .kontakt-hero{min-height:0; padding:120px 0 40px;} }

.kontakt-reasons-intro{font-size:15px; color:var(--midnight-navy); margin-top:32px; margin-bottom:0; font-weight:400;}
.kontakt-reasons{display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:16px;}
.kontakt-reason-card{
  display:block; position:relative; padding:24px; border:1px solid rgba(15,15,15,0.1); border-radius:16px;
  text-decoration:none; color:var(--neverything); transition:border-color .2s ease, transform .2s ease, box-shadow .2s ease;
}
.kontakt-reason-card:hover{border-color:var(--accent); transform:translateY(-3px); box-shadow:0 16px 32px rgba(15,15,15,0.08);}
.kontakt-reason-card .thumb{width:40px; height:40px; padding:9px; box-sizing:border-box; border-radius:11px; background:var(--accent); margin-bottom:16px; transition:transform .2s ease;}
.kontakt-reason-card:hover .thumb{transform:scale(1.08);}
.kontakt-reason-card .thumb i.on{background:#F6F5F0;}
.kontakt-reason-icon{
  width:40px; height:40px; padding:9px; box-sizing:border-box; border-radius:11px;
  background:var(--accent); color:#F6F5F0; margin-bottom:16px; transition:transform .2s ease;
}
.kontakt-reason-card:hover .kontakt-reason-icon{transform:scale(1.08);}
.kontakt-reason-icon svg{width:100%; height:100%; display:block;}
.kontakt-reason-card h4{font-size:16px; font-weight:700; margin:0 0 6px;}
.kontakt-reason-card p{font-size:13px; line-height:1.5; color:var(--midnight-navy); font-weight:400; padding-right:20px;}
.kontakt-reason-arrow{
  position:absolute; top:22px; right:22px; width:42px; height:18px; color:var(--accent);
  opacity:0; transform:translateX(-6px); transition:opacity .2s ease, transform .35s ease;
  clip-path:inset(0 100% 0 0); transition:opacity .2s ease, transform .35s ease, clip-path .4s ease;
}
.kontakt-reason-card:hover .kontakt-reason-arrow{
  opacity:1; clip-path:inset(0 0 0 0);
  animation:reasonArrowWiggle 0.9s ease-in-out .4s infinite;
}
.kontakt-reason-arrow .hd-arrow{width:100%; height:100%; display:block; overflow:visible;}
@keyframes reasonArrowWiggle{
  0%, 100%{transform:translateX(0);}
  50%{transform:translateX(4px);}
}
@media (max-width:800px){
  .kontakt-reasons{grid-template-columns:1fr;}
}

/* ---------- TRUST ---------- */
.trust{padding:48px 0; border-top:1px solid rgba(15,15,15,0.08); border-bottom:1px solid rgba(15,15,15,0.08);}
.trust .eyebrow{margin-bottom:24px; display:block;}
.trust-logos{display:flex; gap:56px; flex-wrap:wrap; align-items:center; opacity:0.7; font-family:var(--font-headline); font-weight:700; font-size:20px; letter-spacing:-0.01em;}

/* ---------- LEISTUNGEN GRID (Startseite) ---------- */
.leistungen-head{display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:48px; gap:24px; flex-wrap:wrap;}
.leistungen-head h2{font-size:clamp(28px,4vw,42px);}
.grid-6{display:grid; grid-template-columns:repeat(3,1fr); gap:20px;}
@media (max-width:900px){ .grid-6{grid-template-columns:repeat(2,1fr);} }
@media (max-width:600px){ .grid-6{grid-template-columns:1fr;} }
.service-card{
  background:var(--neverything); color:var(--orchid-white);
  border-radius:20px; padding:32px 28px; min-height:220px;
  display:flex; flex-direction:column; justify-content:space-between;
  position:relative; overflow:hidden; cursor:pointer;
  transition:transform .25s ease;
}
.service-card:hover{transform:translateY(-6px);}
.service-card .num{font-family:var(--font-display); font-size:15px; color:var(--signalgelb); font-weight:700;}
.service-card h3{font-size:22px; margin:12px 0 8px; font-weight:800;}
.service-card p{font-size:14px; color:rgba(255,252,242,0.65); font-weight:300;}
.service-card .arrow{
  align-self:flex-end; width:36px; height:36px; border-radius:50%;
  background:var(--signalgelb); color:var(--neverything);
  display:flex; align-items:center; justify-content:center; font-size:18px;
  transition:transform .2s ease;
}
.service-card:hover .arrow{transform:rotate(45deg);}

/* ---------- ZIELGRUPPEN (Boxen-Stil) ---------- */
.zielgruppen{background:var(--orchid-white); color:var(--neverything);}
.zielgruppen h2{color:var(--neverything); margin:16px 0 70px; font-size:clamp(26px,3vw,36px); line-height:1.15; max-width:none; white-space:nowrap;}

.hd-underline{position:relative; display:inline-block;}
.hd-underline-svg{
  position:absolute; left:-6%; bottom:-0.52em; width:112%; height:0.82em; overflow:visible; pointer-events:none;
  color:inherit; clip-path:inset(0 100% 0 0); transition:clip-path 0.8s cubic-bezier(.25,.7,.3,1) 0.35s;
}
.hd-underline.in-view .hd-underline-svg{clip-path:inset(0 0% 0 0);}
.hd-underline-lg .hd-underline-svg{left:-9%; bottom:-0.32em; width:118%; height:1em;}
.hd-underline-tight .hd-underline-svg{bottom:-0.3em; transition:clip-path 1.3s cubic-bezier(.22,.75,.2,1) 0.35s;}
@media (max-width:800px){ .zielgruppen h2{white-space:normal;} }

.zg-tabbed{display:flex; flex-direction:column;}

.zg-window-top{display:flex; align-items:flex-end; gap:24px; padding-left:40px;}

.zg-traffic{display:flex; gap:7px; padding-bottom:14px;}
.tl{width:11px; height:11px; border-radius:50%; display:block;}
.tl.red{background:#FF5F57;}
.tl.yellow{background:#FEBC2E;}
.tl.green{background:#28C840;}

.zg-tabs{display:flex; align-items:flex-end; gap:4px; flex:1; overflow-x:auto;}
.zg-tab{
  --tabc:rgba(15,15,15,0.045);
  display:flex; align-items:center; gap:7px; position:relative;
  padding:8px 14px 8px 12px; background:var(--tabc); border:none;
  cursor:pointer; text-align:left; color:rgba(15,15,15,0.5); font-family:var(--font-headline); font-weight:700; font-size:13px;
  border-radius:8px 8px 0 0; transition:background .2s ease, color .2s ease;
}
.zg-tab::before, .zg-tab::after{
  content:''; position:absolute; bottom:0; width:8px; height:8px; pointer-events:none;
}
.zg-tab::before{left:-8px; background:radial-gradient(circle at top left, transparent 8px, var(--tabc) 8.5px);}
.zg-tab::after{right:-8px; background:radial-gradient(circle at top right, transparent 8px, var(--tabc) 8.5px);}
.zg-tab:hover:not(.active){--tabc:rgba(15,15,15,0.09); color:var(--neverything);}
.zg-tab.active{--tabc:#F6F5F0; color:var(--midnight-navy);}
.zg-tab-dot{width:7px; height:7px; border-radius:50%; flex-shrink:0;}
.zg-tab-close{opacity:0.35; font-size:13px; line-height:1; margin-left:2px;}
.zg-tab.active .zg-tab-close{opacity:0.6;}
.zg-tab-add{
  width:26px; height:26px; margin-bottom:4px; margin-left:8px; flex-shrink:0; align-self:center;
  border-radius:50%; border:none; background:transparent; color:rgba(15,15,15,0.4);
  font-size:16px; display:flex; align-items:center; justify-content:center; cursor:pointer;
  transition:background .2s ease, color .2s ease, transform .2s ease;
}
.zg-tab-add:hover{background:var(--signalgelb); color:var(--neverything); transform:rotate(90deg);}
@media (max-width:700px){
  .zg-tab{padding:8px 12px; font-size:12px; white-space:nowrap;}
}

.zg-panels{position:relative;}
.zg-panel{
  display:none; flex-direction:column; align-items:stretch; gap:0;
  background:#F6F5F0; color:var(--neverything);
  padding:67px 32px 64px 107px; min-height:308px; height:100%; box-sizing:border-box; border-radius:20px;
}
.zg-panel.active{display:flex;}
.zg-panel-main{flex:1; min-width:0; width:100%;}
.zg-panel h4{color:var(--neverything); font-size:clamp(22px,2.64vw,29px); font-weight:800; margin-bottom:10px; line-height:1.2;}
.zg-panel p.zg-desc{font-size:15px; color:rgba(15,15,15,0.65); font-weight:300; margin-bottom:22px; max-width:none; padding-right:75px; box-sizing:border-box; line-height:1.5;}
@media (max-width:800px){ .zg-panel p.zg-desc{padding-right:0;} }
.zg-services{display:flex; flex-wrap:wrap; gap:8px; margin-bottom:18px; min-height:26px; align-content:flex-start;}
.zg-services span{
  background:var(--accent); color:#F6F5F0; border-radius:999px; padding:6px 12px;
  font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:0.03em;
}
.zg-checklist{list-style:none; margin:0; padding:0 75px 0 0; box-sizing:border-box; display:flex; flex-direction:row; gap:24px;}
@media (max-width:800px){ .zg-checklist{padding-right:0;} }
.zg-checklist li{display:flex; align-items:center; gap:12px; font-size:14px; color:rgba(15,15,15,0.75); flex:1;}
.zg-checklist li::before{
  content:''; flex-shrink:0; width:20px; height:20px; margin-top:1px; border-radius:50%;
  background-color:var(--accent);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.2 8.3l3.1 3.1 6.5-6.8' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:center; background-size:10px 10px;
}
.zg-checklist li.has-icon::before{content:none;}
.zg-check-icon{
  flex-shrink:0; width:24px; height:24px; color:var(--neverything);
  display:flex; align-items:center; justify-content:center;
}
.zg-check-icon svg{width:24px; height:24px; display:block;}
.zg-panel-actions{display:flex; flex-direction:row; justify-content:flex-start; align-items:center; gap:12px; margin-top:auto; padding-top:32px;}
.zg-panel-actions .btn{min-width:248px; justify-content:center;}
@media (max-width:520px){ .zg-panel-actions .btn{min-width:0;} }
.zg-panel-placeholder{font-size:14px; color:rgba(15,15,15,0.4); font-style:italic;}
@media (max-width:800px){
  .zg-panel{padding:32px;}
  .zg-checklist{flex-direction:column;}
  .zg-panel-actions{justify-content:flex-start; flex-wrap:wrap;}
}

/* ---------- BLACK STATEMENT (Ignite-Stil) ---------- */
.statement{
  background:var(--neverything); color:var(--orchid-white); text-align:center;
  padding:140px 0; position:relative; overflow:hidden;
}
.statement .wrap{position:relative; z-index:2;}
.statement p{
  font-family:var(--font-headline); font-weight:800; font-size:clamp(28px,5vw,52px); line-height:1.15;
  max-width:900px; margin:0 auto;
}
.statement p .fade{color:rgba(255,252,242,0.25);}
.statement-mark{
  position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
  width:120px; height:120px; z-index:1; opacity:0.9;
}
.statement-signal{background:var(--signalgelb); color:var(--orchid-white);}
.statement-signal p{font-family:var(--font-display);}
.statement-line-1{display:inline-block; font-size:clamp(34px,6vw,62px);}
.statement-line-2{
  display:inline-block; font-size:clamp(20px,3.2vw,34px); font-weight:600;
  white-space:nowrap; margin-top:14px; color:var(--orchid-white);
}
@media (max-width:700px){ .statement-line-2{white-space:normal;} }
.scroll-fill-word{color:var(--orchid-white); transition:color .15s ease; display:inline-block;}
.scroll-fill-word.filled{color:var(--midnight-navy);}
.scroll-fill-word.pulse{animation:scrollFillPulse .5s ease;}
@keyframes scrollFillPulse{
  0%{ transform:scale(1); }
  35%{ transform:scale(1.18); }
  100%{ transform:scale(1); }
}

/* ---------- BRAND SHOWCASE CARDS (REBOUNCE / OTC) ---------- */
.brand-showcase{padding:220px 0 320px; scroll-snap-type:y proximity;}
@media (max-width:700px){ .brand-showcase{padding:120px 0 180px;} }
.brand-showcase-grid{display:grid; grid-template-columns:1fr 1fr; gap:32px; align-items:stretch; scroll-snap-align:center; scroll-snap-stop:always;}
@media (max-width:900px){ .brand-showcase-grid{grid-template-columns:1fr;} }
.bs-cell{min-width:0;}

.bs-card{
  background:#fff; border:1px solid rgba(15,15,15,0.08); border-radius:20px; padding:56px 26px;
  display:flex; flex-direction:column; justify-content:center;
}
.bs-card h2{font-size:clamp(24px,3vw,32px); margin-bottom:16px;}
.bs-card p{font-size:16px; color:var(--midnight-navy); margin-bottom:28px; max-width:480px;}
.badge-rebounce{color:var(--mint-accent); font-weight:800;}
.badge-otc{color:var(--purple-accent); font-weight:800;}

/* Scroll-Reveal: Cards fliegen scroll-gekoppelt vom Bildschirmrand rein/raus, mit Rotation (angelehnt an six2eight USP-Reveal) */
.brand-showcase{overflow:hidden;}
.fly-in{
  opacity:0; will-change:transform, opacity;
}
.fly-in.fly-left{transform:translateX(-115vw) rotate(-22deg);}
.fly-in.fly-right{transform:translateX(115vw) rotate(22deg);}

/* ---------- CASES (Karten-Fächer, helloupdigital-Referenz) ---------- */
.case-fan{
  position:relative; display:flex; justify-content:center; align-items:center;
  padding:64px 0 40px; flex-wrap:wrap;
}
.case-fan-card{
  position:relative; width:252px; height:250px; border-radius:20px; padding:22px;
  margin-left:-42px; flex-shrink:0; display:flex; flex-direction:column;
  transform:rotate(var(--r,0deg)); transition:transform .3s ease, box-shadow .3s ease;
  box-shadow:0 18px 36px rgba(15,15,15,0.14); cursor:pointer;
}
.case-fan-card:first-child{margin-left:0;}
.case-fan-card:hover{transform:rotate(0deg) translateY(-18px) scale(1.1); z-index:20 !important; box-shadow:0 28px 56px rgba(15,15,15,0.28);}
.case-fan-black{background:var(--midnight-navy); color:var(--orchid-white);}
.case-fan-signal{background:var(--signalgelb); color:var(--neverything);}
.case-fan-white{background:var(--orchid-white); color:var(--neverything); border:1px solid rgba(15,15,15,0.12);}
.case-fan-tag{
  display:block; font-family:var(--font-accent); font-size:10px; font-weight:700;
  text-transform:uppercase; letter-spacing:0.06em; opacity:0.55; margin-bottom:14px;
}
.case-fan-num{font-family:var(--font-display); font-weight:800; font-size:38px; line-height:1;}
.case-fan-card h4{font-size:14px; font-weight:700; margin:10px 0 8px;}
.case-fan-desc{font-size:12px; line-height:1.5; opacity:0.75; font-weight:400;}
.case-fan-meta{font-size:11px; opacity:0.55; font-weight:400; margin-top:5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
@media (max-width:900px){
  .case-fan{padding:40px 16px;}
  .case-fan-card{width:200px; height:230px; margin-left:-32px; padding:16px;}
  .case-fan-num{font-size:28px;}
}

/* ---------- TEAM TEASER ---------- */
.team-teaser{display:flex; gap:40px; align-items:center; justify-content:center; flex-wrap:wrap;}
.team-avatars{display:flex;}
.team-avatars .av{
  width:64px; height:64px; border-radius:50%; background:var(--midnight-navy);
  border:3px solid var(--orchid-white); margin-left:-16px; overflow:hidden;
  display:flex; align-items:center; justify-content:center; color:var(--orchid-white); font-size:12px; font-weight:700;
}
.team-avatars .av img{width:100%; height:100%; object-fit:cover; border-radius:50%;}
.team-avatars .av:first-child{margin-left:0;}
.team-avatars .av{opacity:0; transform:translateY(14px) scale(0.8) rotate(-8deg); transition:opacity .5s ease, transform .5s cubic-bezier(.34,1.56,.64,1);}
.team-avatars.in-view .av{opacity:1; transform:translateY(0) scale(1) rotate(0deg);}
.team-avatars.in-view .av:nth-child(1){transition-delay:0s;}
.team-avatars.in-view .av:nth-child(2){transition-delay:.08s;}
.team-avatars.in-view .av:nth-child(3){transition-delay:.16s;}
.team-avatars.in-view .av:nth-child(4){transition-delay:.24s;}

/* ---------- KONTAKT (digitalists-Referenz) ---------- */
#kontakt.contact-section{padding:96px 0; background:var(--orchid-white);}
@media (max-width:700px){ #kontakt.contact-section{padding:64px 0;} }
.contact-wrap{
  max-width:var(--max-w); margin:0 auto; padding:0 32px;
  display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:start;
  box-sizing:border-box;
}
@media (max-width:900px){ .contact-wrap{grid-template-columns:1fr; gap:48px;} }

.contact-left{padding-top:8px;}
.contact-headline-row{display:flex; align-items:flex-start; gap:20px; margin-bottom:28px;}
.contact-headline{
  font-family:var(--font-display); font-weight:800; color:var(--neverything);
  font-size:clamp(36px,4.2vw,56px); line-height:1.05; margin:0;
}
.contact-badge{
  flex-shrink:0; width:132px; height:132px; margin-top:-10px;
  transform:rotate(-6deg);
}
.contact-badge svg{display:block; width:100%; height:100%;}
.contact-subbold{font-family:var(--font-headline); font-weight:700; font-size:19px; color:var(--neverything); margin:0 0 10px;}
.contact-subtext{font-family:var(--font-body); font-weight:300; font-size:15px; color:var(--midnight-navy); max-width:420px; margin:0 0 32px;}
.contact-left .btn{margin-bottom:36px;}
.contact-links{display:flex; flex-direction:column; gap:8px;}
.contact-links a{
  font-family:var(--font-body); font-size:15px; color:var(--neverything);
  text-decoration:underline; text-underline-offset:3px; width:fit-content;
}
.contact-links a:hover{color:var(--signalgelb);}
.contact-links-icon{gap:16px;}
.contact-links-icon a{display:flex; align-items:center; gap:14px; text-decoration:none; padding:6px 0;}
.contact-links-icon .icon-chip{
  width:44px; height:44px; flex-shrink:0; border-radius:12px; background:var(--signalgelb);
  display:flex; align-items:center; justify-content:center; transition:background .2s ease;
}
.contact-links-icon .icon-chip svg{width:22px; height:22px; color:var(--neverything);}
.contact-links-icon a span{font-size:17px; text-decoration:underline; text-underline-offset:3px;}
.contact-links-icon a:hover .icon-chip{background:var(--midnight-navy);}
.contact-links-icon a:hover .icon-chip svg{color:var(--orchid-white);}

.contact-form-card{background:var(--midnight-navy); color:var(--orchid-white); border-radius:24px; padding:48px 44px;}
@media (max-width:700px){ .contact-form-card{padding:32px 24px;} }
.contact-form-card h3{font-family:var(--font-headline); font-weight:700; font-size:clamp(22px,2.4vw,28px); margin:0 0 28px;}
.kontakt-form{display:flex; flex-direction:column; gap:24px;}
.form-row{display:grid; grid-template-columns:1fr 1fr; gap:24px;}
@media (max-width:500px){ .form-row{grid-template-columns:1fr;} }
.field{display:flex; flex-direction:column; gap:6px;}
.field label{font-family:var(--font-body); font-size:13px; color:rgba(255,252,242,0.55);}
.field input, .field textarea{
  background:transparent; border:none; border-bottom:1px solid rgba(255,252,242,0.25);
  padding:6px 0 10px; color:var(--orchid-white); font-family:var(--font-body); font-size:15px;
}
.field input:focus, .field textarea:focus{outline:none; border-bottom-color:var(--signalgelb);}
.field textarea{min-height:90px; resize:vertical;}
.consent{display:flex; align-items:flex-start; gap:10px; cursor:pointer;}
.consent input{margin-top:4px; accent-color:var(--signalgelb); flex-shrink:0;}
.consent span{font-family:var(--font-body); font-weight:300; font-size:13px; color:rgba(255,252,242,0.6); line-height:1.5;}
.consent a{color:var(--orchid-white); text-decoration:underline;}
.kontakt-form .btn{align-self:flex-start;}

/* ---------- TESTIMONIAL-STAPEL (Ignite-Referenz) ---------- */
.testi-scroll-section{position:relative; height:340vh;}
.testi-sticky{
  position:sticky; top:0; height:100vh; overflow:hidden;
  display:flex; align-items:center; justify-content:center;
  background:var(--orchid-white);
}
.testi-bg-text{
  position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
  font-family:'Stack Sans Notch', var(--font-display), sans-serif; font-weight:800; color:var(--neverything);
  font-size:clamp(48px,9vw,150px); letter-spacing:0.02em; white-space:nowrap;
  max-width:calc(100vw - 200px); width:calc(100vw - 200px); text-align:center;
  overflow:hidden; text-overflow:clip;
  z-index:0; pointer-events:none; user-select:none;
}
.testi-stack{position:relative; width:min(560px,86vw); height:360px;}
.testi-card{
  position:absolute; inset:0; z-index:1;
  background:var(--orchid-white); border:1px solid rgba(15,15,15,0.08);
  border-radius:20px; box-shadow:0 24px 50px rgba(15,15,15,0.14);
  padding:44px 40px; display:flex; flex-direction:column;
  will-change:transform, opacity;
}
.testi-mark.thumb{width:26px; height:26px; margin-bottom:20px;}
.testi-mark.thumb i.on{background:var(--signalgelb);}
.testi-quote{
  font-family:var(--font-headline); font-weight:700; color:var(--neverything);
  font-size:clamp(18px,2vw,23px); line-height:1.45; flex:1;
}
.testi-meta{margin-top:24px; display:flex; flex-direction:column; gap:4px;}
.testi-name{font-family:var(--font-body); font-weight:600; font-size:14px; color:var(--neverything);}
.testi-role{font-family:var(--font-body); font-weight:300; font-size:12px; color:var(--midnight-navy); opacity:0.6;}
.testi-skip{
  position:absolute; right:32px; bottom:28px; z-index:2;
  display:flex; align-items:center; gap:6px; background:none; border:none; cursor:pointer;
  font-family:var(--font-body); font-size:13px; color:var(--midnight-navy); opacity:0.6;
}
.testi-skip:hover{opacity:1;}
@media (max-width:700px){
  .testi-card{padding:32px 26px;}
  .testi-stack{height:400px;}
}

/* ---------- HANDSHAKE SCROLL-ANIMATION ---------- */
.hs-scroll-section{position:relative; height:220vh;}
.hs-sticky{
  position:sticky; top:0; height:100vh; overflow:hidden;
  display:flex; align-items:center; justify-content:center;
  background:var(--orchid-white);
}
.hs-headline{
  position:relative; z-index:2;
  font-family:var(--font-display); font-weight:800;
  font-size:clamp(40px,7vw,110px); line-height:1.02; text-align:center;
  color:var(--neverything);
  opacity:0; transform:scale(0.85); will-change:opacity, transform;
}
.hs-hands{
  position:absolute; inset:0; z-index:1; display:flex; align-items:center; justify-content:center;
  pointer-events:none; transform-origin:center center; will-change:transform, opacity;
}
.hs-hand{width:130px; height:130px; flex-shrink:0;}
.hs-hand .thumb-lg{width:100%; height:100%; opacity:0.95;}
.hs-hand .thumb-lg i.on{background:var(--signalgelb);}
.hs-hand-left{transform:translateX(-62vw);}
.hs-hand-right{transform:translateX(62vw);}
@media (max-width:700px){
  .hs-hand{width:70px; height:70px;}
}

form.proto-form{display:flex; flex-direction:column; gap:14px;}
form.proto-form input, form.proto-form textarea, form.proto-form select{
  background:rgba(255,252,242,0.08); border:1px solid rgba(255,252,242,0.2);
  border-radius:10px; padding:14px 16px; color:var(--orchid-white); font-family:var(--font-body); font-size:14px;
}
form.proto-form input::placeholder, form.proto-form textarea::placeholder{color:rgba(255,252,242,0.4);}
form.proto-form textarea{min-height:100px; resize:vertical;}

/* ---------- LEISTUNGSSEITEN-TEMPLATE ---------- */
.kernpunkte{display:grid; grid-template-columns:repeat(2,1fr); gap:16px 40px; margin:32px 0 8px;}
@media (max-width:700px){ .kernpunkte{grid-template-columns:1fr;} }
.kernpunkte li{list-style:none; display:flex; align-items:flex-start; gap:12px; font-size:15px; padding:10px 0; border-bottom:1px solid rgba(15,15,15,0.08);}
.kernpunkte li::before{content:''; width:8px; height:8px; border-radius:50%; background:var(--signalgelb); margin-top:7px; flex-shrink:0;}
.schritte{display:grid; grid-template-columns:repeat(4,1fr); gap:20px;}
@media (max-width:900px){ .schritte{grid-template-columns:repeat(2,1fr);} }
@media (max-width:600px){ .schritte{grid-template-columns:1fr;} }
.schritt{background:var(--neverything); color:var(--orchid-white); border-radius:18px; padding:26px 22px; min-height:160px;}
.schritt .num{font-family:var(--font-display); color:var(--signalgelb); font-size:22px; font-weight:700;}
.schritt h4{font-size:17px; margin:10px 0 8px;}
.schritt p{font-size:13px; color:rgba(255,252,242,0.65); font-weight:300;}
.detail-list{display:grid; grid-template-columns:repeat(2,1fr); gap:14px 32px; margin-top:24px;}
@media (max-width:700px){ .detail-list{grid-template-columns:1fr;} }
.detail-list .item{border:1px solid rgba(15,15,15,0.1); border-radius:14px; padding:18px 20px;}
.detail-list .item h5{font-size:15px; margin-bottom:6px;}
.detail-list .item p{font-size:13px; color:var(--midnight-navy); font-weight:400;}

.counter-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:32px; margin-top:24px;}
@media (max-width:700px){ .counter-grid{grid-template-columns:repeat(2,1fr);} }
.counter-item{text-align:center;}
.counter-item h5{font-size:clamp(28px,3.4vw,40px); font-family:var(--font-headline); font-weight:800; color:var(--signalgelb);}
.counter-item p{font-size:13px; color:var(--midnight-navy); margin-top:4px;}
.counter-icon{display:flex; align-items:center; justify-content:center; width:40px; height:40px; margin:0 auto 10px; border-radius:12px; background:rgba(15,41,66,0.1);}
.counter-icon svg{width:20px; height:20px; color:var(--midnight-navy);}

.about-gallery{display:grid; grid-template-columns:repeat(3,1fr); grid-auto-rows:200px; gap:16px;}
.about-gallery-item{position:relative; overflow:hidden; border-radius:14px; grid-row:span 1; transition:transform .4s cubic-bezier(.22,1,.36,1); transform:rotate(0deg);}
.about-gallery-item--tall{grid-row:span 2;}
.about-gallery-item:hover{transform:rotate(-1.5deg) scale(1.02); z-index:2; box-shadow:0 18px 36px rgba(15,15,15,0.16);}
.about-gallery-item:nth-child(2n):hover{transform:rotate(1.5deg) scale(1.02);}
.values-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:24px;}
@media (max-width:900px){ .values-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:500px){ .values-grid{grid-template-columns:1fr;} }
.value-card{border:1px solid rgba(15,15,15,0.1); border-radius:16px; padding:22px; transition:transform .3s cubic-bezier(.34,1.56,.64,1), border-color .3s ease, box-shadow .3s ease;}
.values-grid{margin-left:-22px; width:calc(100% + 22px);}
@media (max-width:900px){ .values-grid{margin-left:0; width:100%;} }
.value-card:hover{transform:rotate(-1.5deg) translateY(-4px); border-color:transparent; box-shadow:0 16px 32px rgba(15,15,15,0.1);}
.value-card:nth-child(2n):hover{transform:rotate(1.5deg) translateY(-4px);}
.value-card .icon-chip{width:44px; height:44px; border-radius:12px; background:var(--signalgelb); display:flex; align-items:center; justify-content:center; margin-bottom:14px; transition:background .25s ease, transform .3s ease;}
.value-card .icon-chip svg{width:22px; height:22px; color:var(--neverything); transition:color .25s ease;}
.value-card:hover .icon-chip{background:var(--midnight-navy); transform:scale(1.08);}
.value-card:hover .icon-chip svg{color:var(--orchid-white);}
.value-card h5{font-size:16px; margin-bottom:6px;}
.value-card p{font-size:13px; color:var(--midnight-navy); line-height:1.5;}

.location-split{display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:center;}
@media (max-width:800px){ .location-split{grid-template-columns:1fr; gap:24px;} }
.history-split{grid-template-columns:1.25fr 1fr; align-items:start; position:relative;}
@media (max-width:800px){ .history-split{grid-template-columns:1fr;} }
.history-award-arrow{position:absolute; left:53%; bottom:60px; width:170px; height:140px; margin:0; color:var(--signalgelb); pointer-events:none; transform:scaleX(-1) rotate(20deg);}
@media (max-width:800px){ .history-award-arrow{display:none;} }
.location-address{display:inline-flex; align-items:center; gap:14px; margin-top:20px; text-decoration:none; color:var(--neverything); font-weight:600;}
.location-address .icon-chip{width:44px; height:44px; border-radius:12px; background:var(--signalgelb); display:flex; align-items:center; justify-content:center; flex-shrink:0;}
.location-address .icon-chip svg{width:22px; height:22px; color:var(--neverything);}
.location-address:hover .icon-chip{background:var(--midnight-navy); animation:locationPinHop .5s ease;}
.location-address:hover .icon-chip svg{color:var(--orchid-white);}
@keyframes locationPinHop{0%{transform:translateY(0);}30%{transform:translateY(-7px);}55%{transform:translateY(0);}75%{transform:translateY(-3px);}100%{transform:translateY(0);}}
.location-map{border-radius:16px; overflow:hidden; aspect-ratio:4/3; background:rgba(15,15,15,0.05);}
@media (max-width:800px){ .location-map{aspect-ratio:16/10;} }
.about-gallery-item img{width:100%; height:100%; object-fit:cover; display:block; transition:transform .5s cubic-bezier(.22,1,.36,1);}
.about-gallery-item:hover img{transform:scale(1.06);}

.scroll-gallery{position:relative; height:250vh; background:var(--signalgelb); padding:0; margin-top:-88px;}
.scroll-gallery-pin{position:sticky; top:0; height:100vh; overflow:hidden; display:flex; align-items:center; justify-content:center;}
.scroll-gallery-circle{position:absolute; width:68vmin; height:68vmin; border-radius:50%; border:1px solid rgba(15,15,15,0.15); top:50%; left:50%; transform:translate(-50%,-50%); pointer-events:none; display:flex; align-items:center; justify-content:center;}
.scroll-gallery-circle img{width:22%; height:auto; filter:brightness(0) invert(1);}
.scroll-gallery-bg-logo{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:52vmin; opacity:0.16; pointer-events:none; z-index:0;}
.scroll-gallery-bg-logo img{width:100%; height:auto; display:block;}
.scroll-gallery-text{position:relative; z-index:2; text-align:center; max-width:640px; padding:0 24px; pointer-events:none;}
.scroll-gallery-text h3{font-size:clamp(36px,5.2vw,58px); margin-bottom:16px; color:var(--orchid-white);}
.scroll-gallery-text p{font-size:18px; color:rgba(255,252,242,0.85); line-height:1.6;}
.scroll-gallery-grid{position:absolute; inset:0; display:grid; grid-template-columns:repeat(3,1fr); grid-template-rows:repeat(2,1fr); gap:20px; padding:72px max(32px, calc(50% - var(--max-w)/2 + 32px)); z-index:1; box-sizing:border-box;}
.sg-tile{border-radius:14px; overflow:hidden; opacity:0; box-sizing:border-box;}
.sg-tile img{width:100%; height:100%; object-fit:cover; display:block;}
.sg-tile.sg-settled{opacity:1; transition:transform .4s cubic-bezier(.22,1,.36,1), box-shadow .3s ease;}
@media (max-width:800px){
  .scroll-gallery{height:220vh;}
  .scroll-gallery-grid{grid-template-columns:repeat(2,1fr); grid-template-rows:repeat(3,1fr); padding:88px 24px 24px;}
  .scroll-gallery-circle{width:90vmin; height:90vmin;}
}
@media (max-width:700px){
  .about-gallery{grid-template-columns:repeat(2,1fr); grid-auto-rows:160px;}
}
.faq{border-top:1px solid rgba(15,15,15,0.12);}
.faq-item{border-bottom:1px solid rgba(15,15,15,0.12);}
.faq-q{display:flex; justify-content:space-between; align-items:center; gap:16px; padding:20px 2px; cursor:pointer; font-weight:700; font-size:16px;}
.faq-q .plus{
  position:relative; width:26px; height:26px; border-radius:50%; border:1px solid rgba(15,15,15,0.2); flex-shrink:0;
  font-size:0; line-height:1; color:transparent;
  transition:transform .25s ease, background .2s ease, border-color .2s ease;
}
.faq-q .plus::before, .faq-q .plus::after{
  content:''; position:absolute; top:50%; left:50%; background:currentColor; color:rgba(15,15,15,0.7);
  transition:background .2s ease;
}
.faq-q .plus::before{width:10px; height:1.5px; transform:translate(-50%,-50%);}
.faq-q .plus::after{width:1.5px; height:10px; transform:translate(-50%,-50%);}
.faq-item.open .faq-q .plus{
  background:var(--signalgelb); border-color:var(--signalgelb); transform:rotate(45deg);
}
.faq-item.open .faq-q .plus::before, .faq-item.open .faq-q .plus::after{background:var(--neverything);}
.faq-a{max-height:0; overflow:hidden; transition:max-height .3s ease; font-size:14px; color:var(--midnight-navy); padding:0 2px;}
.faq-item.open .faq-a{max-height:400px; padding:0 2px 20px 2px;}
.ansprechpartner{
  display:flex; align-items:center; gap:20px; background:var(--orchid-white); border:1px solid rgba(15,15,15,0.1);
  border-radius:20px; padding:24px 28px; margin-top:48px; flex-wrap:wrap;
}
.ansprechpartner .avatar{width:64px; height:64px; border-radius:50%; background:var(--midnight-navy); color:var(--orchid-white); display:flex; align-items:center; justify-content:center; font-weight:700; flex-shrink:0;}
.ansprechpartner .avatar-photo{background-size:cover; background-position:center;}
.ansprechpartner .avatar-initials{font-family:var(--font-headline); font-size:20px;}
.ansprechpartner .name{font-weight:700; font-size:16px;}
.ansprechpartner .role{font-size:13px; color:var(--midnight-navy);}
.ansprechpartner .phone{font-size:13px; margin-top:4px;}
/* Kombinierte Box: Ansprechpartner + Kontakt-CTA (aktuell nur KI-Seite) */
.ki-contact-cta{
  display:flex; align-items:center; justify-content:space-between; gap:32px; flex-wrap:wrap;
  background:var(--orchid-white); border:1px solid rgba(15,15,15,0.1); border-radius:24px; padding:36px 40px;
}
.ki-contact-cta .ansprechpartner,
body.ki-page .ki-contact-cta .ansprechpartner{background:none !important; border:none !important; padding:0; margin-top:0;}
.ki-contact-cta-divider{width:1px; align-self:stretch; background:rgba(15,15,15,0.12);}
.ki-contact-cta-main{display:flex; align-items:center; gap:20px; flex-wrap:wrap;}
.ki-contact-cta-main h3{margin:0; font-size:18px; max-width:320px;}
/* Kurze Headlines (SEA, Programmatic, Social, Websites) brauchen eine Mindestbreite, damit sie nicht zu weit rechts hängen */
body.sea-page .ki-contact-cta-main h3,
body.pa-page .ki-contact-cta-main h3,
body.sm-page .ki-contact-cta-main h3,
body.ws-page .ki-contact-cta-main h3,
body.pm-page .ki-contact-cta-main h3{width:400px; max-width:400px;}
@media (max-width:700px){
  .ki-contact-cta-main h3{min-width:0;}
  body.sea-page .ki-contact-cta-main h3,
  body.pa-page .ki-contact-cta-main h3,
  body.sm-page .ki-contact-cta-main h3,
  body.ws-page .ki-contact-cta-main h3,
  body.pm-page .ki-contact-cta-main h3{width:auto; max-width:none;}
}
@media (max-width:700px){
  .ki-contact-cta{flex-direction:column; align-items:stretch; padding:28px;}
  .ki-contact-cta-divider{width:100%; height:1px;}
  .ki-contact-cta-main{flex-direction:column; align-items:flex-start;}
}
body.ki-page .ki-contact-cta{background:rgba(255,252,242,0.04); border-color:rgba(255,252,242,0.12);}
body.ki-page .ki-contact-cta-divider{background:rgba(255,252,242,0.14);}
body.ki-page .ki-contact-cta-main h3{color:var(--orchid-white);}

/* Dunkle Variante (Midnight Navy) für Seiten außerhalb der KI-Seite, z.B. Shopping PLUS */
.ki-contact-cta.dark{background:var(--midnight-navy); border-color:rgba(255,252,242,0.12);}
.ki-contact-cta.dark .name{color:var(--orchid-white); font-family:var(--font-headline); font-weight:700;}
.sp-faq-section .faq-q{font-family:var(--font-headline); font-weight:700;}
.rb-section.sp-faq-section .faq-item.open .faq-q .plus{background:var(--mint-accent); border-color:var(--mint-accent);}
.ki-contact-cta.dark .role{color:rgba(255,252,242,0.6);}
.ki-contact-cta.dark .phone a{color:var(--orchid-white);}
.ki-contact-cta.dark .ki-contact-cta-divider{background:rgba(255,252,242,0.14);}
.ki-contact-cta.dark .ki-contact-cta-main h3{color:var(--orchid-white);}

.team-marquee-cta{background:var(--signalgelb); padding:56px 0 64px; overflow:hidden; position:relative;}
.team-marquee-track{display:flex; width:max-content; white-space:nowrap; animation:teamMarqueeScroll 48s linear infinite;}
.team-marquee-track span{font-family:var(--font-display); font-weight:800; letter-spacing:-0.01em; font-size:clamp(24px,3.6vw,42px); color:var(--neverything); padding-right:0;}
.team-marquee-icon{display:inline-flex; align-items:center; justify-content:center; vertical-align:middle;}
.team-marquee-icon svg{width:0.6em; height:0.6em; display:block;}
@keyframes teamMarqueeScroll{0%{transform:translateX(0);}100%{transform:translateX(-50%);}}
.team-marquee-btn-wrap{display:flex; align-items:center; justify-content:center; gap:36px; flex-wrap:wrap; margin-top:36px; position:relative; z-index:2;}
.team-marquee-btn-wrap .btn-primary{background:var(--neverything); color:var(--orchid-white);}
.team-marquee-btn-wrap .btn-primary:hover{background:var(--midnight-navy); color:var(--orchid-white);}
.team-marquee-btn-wrap .team-marquee-btn-ghost{background:transparent; border:2px solid var(--neverything); color:var(--neverything);}
.team-marquee-btn-wrap .team-marquee-btn-ghost:hover{background:var(--neverything); color:var(--signalgelb);}
@media (prefers-reduced-motion:reduce){ .team-marquee-track{animation:none;} }
.page-cta{text-align:center; padding:64px 0;}
.page-cta h3{font-size:clamp(24px,3vw,32px); margin-bottom:20px;}

/* ---------- SHOPPING PLUS (seitenspezifisch, Struktur angelehnt an developios.com) ---------- */
.sp-section{padding:32px 0;}
.sp-eyebrow{
  font-family:var(--font-accent); font-weight:700; text-transform:uppercase;
  letter-spacing:0.08em; font-size:13px; color:var(--signalgelb); margin-bottom:24px; display:block;
}
.sp-split h2{margin-top:0;}

/* --- Baustein A: dunkle, abgerundete "Floating Card" mit zentrierter Headline + Reihe WEISSER Sub-Cards (wie developios' grüne Feature-Section) --- */
.sp-dark{
  background:var(--midnight-navy); color:var(--orchid-white);
  border-radius:32px; padding:72px 64px; text-align:center;
  width:calc(100vw - 60px); margin-left:calc(-50vw + 50% + 30px); margin-right:calc(-50vw + 50% + 30px);
}
.sp-dark .sp-eyebrow{color:var(--signalgelb);}
.sp-dark h2{font-size:clamp(32px,4.4vw,54px); font-weight:800; line-height:1.15; margin:0 auto; max-width:760px;}
.sp-white-cards{display:grid; grid-template-columns:repeat(3,1fr); gap:20px; text-align:left; max-width:calc(var(--max-w) - 64px); margin:80px auto 40px;}
@media (max-width:1100px){ .sp-dark{padding:48px 32px;} }
.sp-white-cards.cols-4{grid-template-columns:repeat(4,1fr);}
@media (max-width:900px){ .sp-white-cards, .sp-white-cards.cols-4{grid-template-columns:1fr;} }
.sp-white-card{background:#fff; color:var(--neverything); border-radius:18px; padding:36px 30px 40px; transition:transform .3s ease, box-shadow .3s ease;}
.sp-white-card:hover{transform:translateY(-6px); box-shadow:0 20px 40px rgba(0,0,0,0.18);}
.sp-white-card .ic{font-size:28px; margin-bottom:20px; line-height:1; display:inline-block;}
.sp-white-card:hover .ic{animation:spIconPulse .6s ease-in-out;}
@keyframes spIconPulse{
  0%{transform:scale(1);}
  50%{transform:scale(1.15);}
  100%{transform:scale(1);}
}
.sp-white-card h4{font-size:16px; font-weight:700; margin-bottom:8px;}
.sp-white-card p{font-size:14px; line-height:1.6; color:rgba(15,15,15,0.65); margin:0;}

/* --- Baustein B: heller Split-Bereich (Text + Boxen), wie developios' "Why does it matter" --- */
.sp-split{display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:start;}
@media (max-width:900px){ .sp-split{grid-template-columns:1fr;} }
.sp-split h2{font-size:clamp(24px,3vw,34px); margin-bottom:16px; color:var(--neverything);}
.sp-split .sp-body-text{font-size:16px; line-height:1.7; color:rgba(15,15,15,0.55); margin-bottom:18px;}
.sp-split .sp-body-text:last-child{margin-bottom:0;}
.sp-split .sp-body-text strong{color:var(--neverything); font-weight:700;}
.sp-box-light{border:1.5px solid rgba(15,15,15,0.12); border-radius:16px; padding:22px 24px; margin-bottom:16px; background:#fff;}
.sp-box-light h4{color:var(--midnight-navy); font-size:16px; margin-bottom:6px;}
.sp-box-light p{font-size:14px; line-height:1.6; color:rgba(15,15,15,0.65); margin:0;}

/* --- Baustein C: helle Tabs (nummeriert) + Live-Vorschau daneben --- */
.sp-tabs-header{display:flex; justify-content:space-between; align-items:flex-start; gap:24px; margin-bottom:48px; flex-wrap:wrap;}
.sp-tabs-header h2{font-size:clamp(24px,3.2vw,38px); line-height:1.25; max-width:500px; color:var(--neverything); margin:0;}
.sp-tabs-header h2 em{font-style:italic; font-family:var(--font-headline); font-weight:400;}
.sp-tabs-grid{display:grid; grid-template-columns:0.72fr 1.28fr; gap:24px; align-items:start;}
@media (max-width:900px){ .sp-tabs-grid{grid-template-columns:1fr;} }
.sp-tabs-list{display:flex; flex-direction:column; gap:12px;}
.sp-tab-btn{
  text-align:left; background:rgba(15,41,66,0.05); border:none; border-radius:14px;
  padding:18px 22px; font-family:var(--font-headline); font-weight:700; font-size:16px; color:rgba(15,15,15,0.45);
  cursor:pointer; display:flex; align-items:center; gap:14px; transition:background .2s ease, color .2s ease;
}
.sp-tab-btn .n{font-family:var(--font-accent); font-size:13px; font-weight:700; color:rgba(15,15,15,0.35);}
.sp-tab-btn.active{background:var(--midnight-navy); color:var(--orchid-white);}
.sp-tab-btn.active .n{color:var(--signalgelb);}
.sp-tab-body{display:none; background:rgba(15,41,66,0.03); border-radius:20px; padding:40px; opacity:0; transform:translateY(6px); transition:opacity .35s ease, transform .35s ease;}
.sp-tab-body.active{display:block;}
.sp-tab-body.active.sp-show{opacity:1; transform:translateY(0);}
.sp-tab-body h3{font-size:clamp(20px,2.4vw,28px); margin-bottom:14px; color:var(--neverything);}
.sp-tab-body > p{font-size:15px; line-height:1.7; color:rgba(15,15,15,0.6); margin-bottom:24px;}
.sp-tab-body .sp-box-light{margin-top:14px; background:#fff;}
.sp-plain-point{margin-bottom:16px;}
.sp-plain-point:last-child{margin-bottom:0;}
.sp-plain-point h4{color:var(--midnight-navy); font-size:15px; margin-bottom:5px;}
.sp-plain-point p{font-size:13px; line-height:1.6; color:rgba(15,15,15,0.6); margin:0;}
@media (max-width:700px){ .sp-tab-body{padding:24px;} }

.sp-mock-search{
  background:#fff; border-radius:16px; padding:16px; color:var(--neverything);
  box-shadow:0 24px 60px rgba(15,15,15,0.12); border:1px solid rgba(15,15,15,0.06);
}
.sp-mock-searchbar{background:rgba(15,15,15,0.05); border-radius:20px; padding:8px 16px; font-size:12px; color:rgba(15,15,15,0.5); margin-bottom:10px;}
.sp-mock-results{display:grid; grid-template-columns:repeat(3,1fr); gap:8px;}
.sp-mock-result{background:#fff; border:1px solid rgba(15,15,15,0.08); border-radius:10px; padding:8px; font-size:10px; position:relative;}
.sp-mock-result .thumb-block{background:rgba(15,15,15,0.06); border-radius:6px; aspect-ratio:1; margin-bottom:6px;}
.sp-mock-result .tag{position:absolute; top:6px; left:6px; font-size:8px; font-weight:700; padding:2px 6px; border-radius:6px; background:rgba(15,15,15,0.08);}
.sp-mock-result.via-kupona{border-color:var(--signalgelb);}
.sp-mock-result.via-kupona .tag{background:var(--signalgelb); color:var(--neverything);}

/* --- Baustein D: dunkle "Stat"-Card auf Schwarz (wie developios' Testimonial-Section), horizontal scrollende Karten --- */
.sp-stat-section{
  background:var(--midnight-navy); color:var(--orchid-white); border-radius:32px; padding:56px 48px;
  width:calc(100vw - 60px); margin-left:calc(-50vw + 50% + 30px); margin-right:calc(-50vw + 50% + 30px);
}
@media (max-width:1100px){ .sp-stat-section{padding:40px 32px;} }
.sp-stat-section .sp-eyebrow{color:var(--signalgelb);}
.sp-stat-top{display:flex; justify-content:space-between; align-items:flex-end; flex-wrap:wrap; gap:24px; margin-bottom:40px; max-width:calc(var(--max-w) - 64px); margin-left:auto; margin-right:auto;}
.sp-stat-top h2{font-size:clamp(24px,3.2vw,36px); margin:0; max-width:520px;}
.sp-stat-scroll{display:flex; gap:16px; overflow-x:auto; padding-bottom:6px; max-width:calc(var(--max-w) - 64px); margin-left:auto; margin-right:auto;}
.sp-stat-card-dark{
  background:#fff; border:1px solid rgba(15,15,15,0.06); border-radius:16px; padding:26px; min-width:220px; flex:1; color:var(--neverything);
}
.sp-stat-card-dark .stat-num{font-family:var(--font-headline); font-weight:800; font-size:clamp(30px,4vw,44px); color:var(--signalgelb); display:block;}
.sp-stat-card-dark h4{font-size:15px; margin:8px 0 6px; color:var(--neverything);}
.sp-stat-card-dark p{font-size:13px; line-height:1.6; color:rgba(15,15,15,0.6); margin:0;}

/* --- Abschluss-CTA (Signalgelb-Card, wie developios' grüne CTA) --- */
.sp-cta-final{background:var(--signalgelb); color:var(--neverything); border-radius:32px; padding:64px 48px; text-align:center;}
.sp-cta-final .sp-eyebrow{color:var(--neverything); opacity:0.65;}
.sp-cta-final h2{font-size:clamp(28px,4vw,44px); max-width:640px; margin:0 auto 16px;}
.sp-cta-final p{font-size:16px; max-width:520px; margin:0 auto 28px; opacity:0.8;}
.sp-contact-card{
  background:var(--neverything); color:var(--orchid-white); border-radius:20px; padding:26px;
  max-width:360px; margin:32px auto 0; text-align:left;
}
.sp-contact-card .sp-eyebrow{color:var(--signalgelb); opacity:1;}
.sp-contact-card h4{font-size:16px; margin-bottom:10px;}
.sp-contact-card a{display:block; font-size:14px; margin-bottom:4px; text-decoration:underline; opacity:0.85;}

/* --- Baustein E: heller Prozess-Bereich (Split-Header + Schritte-Karten-Reihe) --- */
.sp-steps-header{display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:start; margin-bottom:80px;}
@media (max-width:900px){ .sp-steps-header{grid-template-columns:1fr;} }
.sp-steps-header h2{font-size:clamp(28px,3.6vw,42px); font-weight:800; line-height:1.15; margin:0; color:var(--neverything);}
.sp-steps-header p{font-size:17px; line-height:1.7; color:rgba(15,15,15,0.55); margin:0;}
.sp-step-cards{display:flex; gap:20px;}
@media (max-width:1100px){ .sp-step-cards{flex-wrap:wrap;} .sp-step-cards .sp-step-card{flex-basis:calc(50% - 10px);} }
@media (max-width:600px){ .sp-step-cards{flex-direction:column;} .sp-step-cards .sp-step-card{flex-basis:auto;} }
.sp-step-card{
  background:#fff; border:1px solid rgba(15,15,15,0.08); border-radius:20px; padding:26px;
  position:relative; overflow:hidden; min-height:460px; display:flex; flex-direction:column;
  flex:1 1 0; min-width:0;
  transition:transform .35s ease, box-shadow .35s ease, background .35s ease, flex-grow .45s ease;
}
.sp-step-card:hover{transform:translateY(-4px); box-shadow:0 24px 48px rgba(0,0,0,0.12); flex-grow:1.6;}
.sp-step-card .sp-step-top{position:relative; z-index:2;}
.sp-step-card .sp-step-label{display:flex; align-items:center; gap:8px; margin-bottom:10px; justify-content:flex-start;}
.sp-step-card .sp-step-time{
  font-family:var(--font-accent); font-weight:600; text-transform:none; letter-spacing:0; font-size:11px;
  color:rgba(15,15,15,0.4); background:rgba(15,41,66,0.06); padding:4px 10px; border-radius:20px;
  transition:color .35s ease, background .35s ease;
}
.sp-step-card:hover .sp-step-time{color:var(--signalgelb); background:rgba(255,164,32,0.14);}
.sp-step-card h4{font-family:var(--font-headline); font-weight:900; font-size:22px; margin-bottom:0; color:var(--neverything);}
.sp-step-card .sp-step-detail{max-height:0; opacity:0; overflow:hidden; transition:max-height .45s ease, opacity .3s ease, margin-top .45s ease; position:relative; z-index:2;}
.sp-step-card:hover .sp-step-detail{max-height:260px; opacity:1; margin-top:16px;}
.sp-step-card .sp-step-detail p{font-size:14px; line-height:1.6; color:rgba(15,15,15,0.6); margin:0 0 14px;}
.sp-step-card .sp-step-num{
  position:absolute; right:18px; bottom:-4px; font-family:var(--font-headline); font-weight:800;
  font-size:130px; line-height:1; color:var(--signalgelb); z-index:1; user-select:none;
  transition:color .4s ease;
}
.sp-step-card:hover .sp-step-num{color:rgba(15,41,66,0.08);}

/* Mini-Mockups innerhalb der Schritt-Karten */
.sp-step-mock{background:rgba(15,41,66,0.03); border:1px solid rgba(15,15,15,0.06); border-radius:12px; padding:14px;}
.sp-step-mock .row{display:flex; align-items:center; gap:8px;}
.sp-step-mock .chip{background:#fff; border:1px solid rgba(15,15,15,0.08); border-radius:8px; padding:6px 10px; font-size:11px; font-weight:600; color:var(--midnight-navy); white-space:nowrap;}
.sp-step-mock .chip.accent{background:var(--midnight-navy); color:var(--orchid-white); border-color:var(--midnight-navy);}
.sp-step-mock .dot-line{flex:1; height:2px; background-image:repeating-linear-gradient(to right, rgba(15,41,66,0.35) 0 4px, transparent 4px 9px); min-width:16px;}
.sp-step-mock .feed-row{display:flex; align-items:center; gap:10px; font-size:12px; color:rgba(15,15,15,0.7); margin-bottom:8px;}
.sp-step-mock .feed-row:last-child{margin-bottom:0;}
.sp-step-mock .feed-row .thumb-block{width:22px; height:22px; border-radius:5px; background:rgba(15,41,66,0.12); flex-shrink:0;}
.sp-step-mock .mini-bars{display:flex; align-items:flex-end; gap:6px; height:56px;}
.sp-step-mock .mini-bar{flex:1; background:rgba(15,41,66,0.15); border-radius:4px 4px 0 0;}
.sp-step-mock .mini-bar.hi{background:var(--signalgelb);}

/* --- Baustein F: heller Bild+Text-Split mit Checkliste --- */
.sp-check-split{display:grid; grid-template-columns:0.9fr 1.1fr; gap:64px; align-items:stretch;}
@media (max-width:900px){ .sp-check-split{grid-template-columns:1fr;} }
.sp-check-split h2{font-size:clamp(26px,3.4vw,38px); font-weight:800; line-height:1.2; margin:0 0 16px; color:var(--neverything);}
.sp-check-split h2 em{font-style:italic; font-family:var(--font-headline); font-weight:400;}
.sp-check-split > div:last-child > p.sp-sub{font-size:16px; color:rgba(15,15,15,0.5); margin:0 0 28px;}
.sp-check-list{display:flex; flex-direction:column; gap:18px;}
.sp-check-item{display:flex; align-items:flex-start; gap:14px;}
.sp-check-item .mark{flex-shrink:0; width:26px; height:26px; border-radius:8px; background:rgba(15,41,66,0.06); display:flex; align-items:center; justify-content:center; margin-top:2px;}
.sp-check-item .mark img{display:block;}
.sp-check-item p{margin:0; font-size:15px; line-height:1.6; color:rgba(15,15,15,0.75);}
.sp-check-item p strong{color:var(--midnight-navy);}

.sp-report-mock{background:#fff; border-radius:20px; padding:22px; box-shadow:0 24px 60px rgba(15,15,15,0.1); border:1px solid rgba(15,15,15,0.06); display:flex; flex-direction:column;}
.sp-report-mock .rep-head{display:flex; justify-content:space-between; align-items:center; margin-bottom:16px; font-size:12px; color:rgba(15,15,15,0.45); flex-shrink:0;}
.sp-report-mock .rep-bars{display:flex; align-items:flex-end; gap:10px; flex:1; min-height:80px; margin-bottom:14px;}
.sp-report-mock .rep-bar{flex:1; background:rgba(15,41,66,0.1); border-radius:6px 6px 0 0;}
.sp-report-mock .rep-bar.hi{background:var(--signalgelb);}
.sp-report-mock .rep-stats{display:flex; justify-content:space-between; font-size:11px; color:rgba(15,15,15,0.5); flex-shrink:0;}
.sp-report-mock .rep-stats strong{display:block; font-size:16px; color:var(--neverything); font-family:var(--font-headline);}

/* ---------- AFFILIATE MARKETING (seitenspezifisch, eigener Baukasten analog zu Shopping PLUS) ---------- */
.af-section{padding:32px 0;}
.af-eyebrow{
  font-family:var(--font-accent); font-weight:700; text-transform:uppercase;
  letter-spacing:0.08em; font-size:13px; color:var(--purple-accent); margin-bottom:24px; display:block;
}
.af-split{display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:start;}
@media (max-width:900px){ .af-split{grid-template-columns:1fr;} }
.af-split h2{font-size:clamp(24px,3vw,34px); margin:0 0 16px; color:var(--neverything);}
.af-split .af-body-text{font-size:16px; line-height:1.7; color:rgba(15,15,15,0.55); margin-bottom:18px;}
.af-split .af-body-text:last-child{margin-bottom:0;}
.af-split .af-body-text strong{color:var(--neverything); font-weight:700;}

/* --- Zertifizierungs-Badges unten rechts im Hero --- */
.af-hero-badges{position:absolute; right:32px; bottom:28px; display:flex; align-items:center; gap:20px; z-index:5;}
.af-hero-badges img{height:44px; width:auto; display:block;}
@media (max-width:700px){ .af-hero-badges{display:none;} }

/* --- Baustein: dunkle Card mit weißen Sub-Cards (Die Ausgangslage) --- */
.af-dark{
  background:var(--midnight-navy); color:var(--orchid-white);
  border-radius:32px; padding:72px 64px; text-align:center;
  width:calc(100vw - 60px); margin-left:calc(-50vw + 50% + 30px); margin-right:calc(-50vw + 50% + 30px);
}
.af-dark .af-eyebrow{color:var(--signalgelb);}
.af-dark h2{font-family:var(--font-headline); font-size:clamp(32px,4.4vw,54px); font-weight:800; line-height:1.15; margin:0 auto; max-width:760px;}
@media (max-width:1100px){ .af-dark{padding:48px 32px;} }
.af-white-cards{display:grid; grid-template-columns:repeat(3,1fr); gap:20px; text-align:left; max-width:calc(var(--max-w) - 64px); margin:80px auto 40px;}
@media (max-width:900px){ .af-white-cards{grid-template-columns:1fr;} }
.af-white-card{background:#fff; color:var(--neverything); border-radius:18px; padding:36px 30px 40px; transition:transform .3s ease, box-shadow .3s ease;}
.af-white-card:hover{transform:translateY(-6px); box-shadow:0 20px 40px rgba(0,0,0,0.18);}
.af-white-card .ic{font-size:28px; margin-bottom:20px; line-height:1; display:inline-block;}
.af-white-card:hover .ic{animation:spIconPulse .6s ease-in-out;}
.af-white-card h4{font-size:16px; font-weight:700; margin-bottom:8px;}
.af-white-card p{font-size:14px; line-height:1.6; color:rgba(15,15,15,0.65); margin:0;}

/* --- Baustein: helle Tabs + Detailbereich (Die Lösung) --- */
.af-tabs-header{margin-bottom:48px;}
.af-tabs-header h2{font-family:var(--font-headline); font-weight:900; font-size:clamp(24px,3.2vw,38px); line-height:1.25; max-width:640px; color:var(--neverything); margin:0;}
.af-tabs-header h2 em{font-style:italic; font-family:var(--font-headline); font-weight:400; color:var(--purple-accent);}
.af-tabs-grid{display:grid; grid-template-columns:0.72fr 1.28fr; gap:24px; align-items:start;}
@media (max-width:900px){ .af-tabs-grid{grid-template-columns:1fr;} }
.af-tabs-list{display:flex; flex-direction:column; gap:12px;}
.af-tab-btn{
  text-align:left; background:rgba(15,41,66,0.05); border:none; border-radius:14px;
  padding:18px 22px; font-family:var(--font-headline); font-weight:700; font-size:16px; color:rgba(15,15,15,0.45);
  cursor:pointer; display:flex; align-items:center; gap:14px; transition:background .2s ease, color .2s ease;
}
.af-tab-btn .n{font-family:var(--font-accent); font-size:13px; font-weight:700; color:rgba(15,15,15,0.35);}
.af-tab-btn.active{background:var(--midnight-navy); color:var(--orchid-white);}
.af-tab-btn.active .n{color:var(--purple-accent);}
.af-tab-body{display:none; background:rgba(15,41,66,0.03); border-radius:20px; padding:40px; opacity:0; transform:translateY(6px); transition:opacity .35s ease, transform .35s ease;}
.af-tab-body.active{display:block;}
.af-tab-body.active.af-show{opacity:1; transform:translateY(0);}
.af-tab-body h3{font-size:clamp(20px,2.4vw,28px); margin-bottom:14px; color:var(--neverything);}
.af-tab-body > p{font-size:15px; line-height:1.7; color:rgba(15,15,15,0.6); margin-bottom:24px;}
.af-plain-point{margin-bottom:16px;}
.af-plain-point:last-child{margin-bottom:0;}
.af-plain-point h4{color:var(--midnight-navy); font-size:15px; margin-bottom:5px;}
.af-plain-point p{font-size:13px; line-height:1.6; color:rgba(15,15,15,0.6); margin:0;}
@media (max-width:700px){ .af-tab-body{padding:24px;} }

/* --- Baustein: heller Prozess-Bereich (So funktioniert es) --- */
.af-steps-header{display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:start; margin-bottom:80px;}
@media (max-width:900px){ .af-steps-header{grid-template-columns:1fr;} }
.af-steps-header h2{font-size:clamp(28px,3.6vw,42px); font-weight:800; line-height:1.15; margin:0; color:var(--neverything);}
.af-steps-header p{font-size:17px; line-height:1.7; color:rgba(15,15,15,0.55); margin:0;}
.af-step-cards{display:flex; gap:20px;}
@media (max-width:1100px){ .af-step-cards{flex-wrap:wrap;} .af-step-cards .af-step-card{flex-basis:calc(50% - 10px);} }
@media (max-width:600px){ .af-step-cards{flex-direction:column;} .af-step-cards .af-step-card{flex-basis:auto;} }
.af-step-card{
  background:#fff; border:1px solid rgba(15,15,15,0.08); border-radius:20px; padding:26px;
  position:relative; overflow:hidden; min-height:460px; display:flex; flex-direction:column;
  flex:1 1 0; min-width:0;
  transition:transform .35s ease, box-shadow .35s ease, background .35s ease, flex-grow .45s ease;
}
.af-step-card:hover{transform:translateY(-4px); box-shadow:0 24px 48px rgba(0,0,0,0.12); flex-grow:1.6;}
.af-step-card .af-step-top{position:relative; z-index:2;}
.af-step-card .af-step-label{display:flex; align-items:center; gap:8px; margin-bottom:10px;}
.af-step-card .af-step-time{
  font-family:var(--font-accent); font-weight:600; font-size:11px;
  color:rgba(15,15,15,0.4); background:rgba(15,41,66,0.06); padding:4px 10px; border-radius:20px;
  transition:color .35s ease, background .35s ease;
}
.af-step-card:hover .af-step-time{color:var(--purple-accent); background:rgba(139,92,246,0.14);}
.af-step-card h4{font-family:var(--font-headline); font-weight:900; font-size:22px; margin-bottom:0; color:var(--neverything);}
.af-step-card .af-step-detail{max-height:0; opacity:0; overflow:hidden; transition:max-height .45s ease, opacity .3s ease, margin-top .45s ease; position:relative; z-index:2;}
.af-step-card:hover .af-step-detail{max-height:260px; opacity:1; margin-top:16px;}
.af-step-card .af-step-detail p{font-size:14px; line-height:1.6; color:rgba(15,15,15,0.6); margin:0 0 14px;}
.af-step-card .af-step-num{
  position:absolute; right:18px; bottom:-4px; font-family:var(--font-headline); font-weight:800;
  font-size:130px; line-height:1; color:var(--purple-accent); z-index:1; user-select:none;
  transition:color .4s ease;
}
.af-step-card:hover .af-step-num{color:rgba(15,41,66,0.08);}

/* --- Logo-Marquee der Netzwerk-/Technologiepartner --- */
.af-logo-marquee-wrap{overflow:hidden; mask-image:linear-gradient(to right, transparent, #000 8%, #000 92%, transparent); padding:16px 0;}
.af-logo-marquee-track{display:flex; align-items:center; width:max-content; gap:72px; animation:afLogoMarqueeScroll 36s linear infinite;}
.af-logo-marquee-track a{display:block; flex-shrink:0;}
.af-logo-marquee-track img{height:44px; width:auto; display:block; opacity:0.5; filter:grayscale(1); transition:opacity .25s ease, filter .25s ease, transform .25s ease;}
.af-logo-marquee-track a:hover img{opacity:1; filter:grayscale(0); transform:scale(1.06);}
@keyframes afLogoMarqueeScroll{0%{transform:translateX(0);}100%{transform:translateX(-50%);}}
@media (prefers-reduced-motion:reduce){ .af-logo-marquee-track{animation:none;} }

/* --- Baustein: heller Bild+Text-Split mit Checkliste (Transparenz & Kontrolle) --- */
.af-check-split{display:grid; grid-template-columns:0.9fr 1.1fr; gap:64px; align-items:stretch;}
@media (max-width:900px){ .af-check-split{grid-template-columns:1fr;} }
.af-check-split h2{font-size:clamp(26px,3.4vw,38px); font-weight:800; line-height:1.2; margin:0 0 16px; color:var(--neverything);}
.af-check-split h2 em{font-style:italic; font-family:var(--font-headline); font-weight:400; color:var(--purple-accent);}
.af-check-split .af-sub{font-size:16px; color:rgba(15,15,15,0.5); margin:0 0 28px;}
.af-check-list{display:flex; flex-direction:column; gap:18px;}
.af-check-item{display:flex; align-items:flex-start; gap:14px;}
.af-check-item .mark{flex-shrink:0; width:26px; height:26px; border-radius:8px; background:rgba(139,92,246,0.1); display:flex; align-items:center; justify-content:center; margin-top:2px;}
.af-check-item .mark img{display:block;}
.af-check-item p{margin:0; font-size:15px; line-height:1.6; color:rgba(15,15,15,0.75);}
.af-check-item p strong{color:var(--midnight-navy);}

.af-report-mock{background:#fff; border-radius:20px; padding:22px; box-shadow:0 24px 60px rgba(15,15,15,0.1); border:1px solid rgba(15,15,15,0.06); display:flex; flex-direction:column; margin-top:40px;}
.af-report-mock .rep-head{display:flex; justify-content:space-between; align-items:center; margin-bottom:16px; font-size:12px; color:rgba(15,15,15,0.45); flex-shrink:0;}
.af-report-mock .rep-bars{display:flex; align-items:flex-end; gap:10px; flex:1; min-height:80px; margin-bottom:14px;}
.af-report-mock .rep-bar{flex:1; background:rgba(139,92,246,0.15); border-radius:6px 6px 0 0;}
.af-report-mock .rep-bar.hi{background:var(--purple-accent);}
.af-report-mock .rep-stats{display:flex; justify-content:space-between; font-size:11px; color:rgba(15,15,15,0.5); flex-shrink:0;}
.af-report-mock .rep-stats strong{display:block; font-size:16px; color:var(--neverything); font-family:var(--font-headline);}

/* --- Kontroll-Panel-Mockup mit Toggle-Switches (Transparenz & Kontrolle) --- */
.af-control-mock{background:#fff; border-radius:20px; padding:22px; box-shadow:0 24px 60px rgba(15,15,15,0.1); border:1px solid rgba(15,15,15,0.06);}
.af-control-mock .rep-head{display:flex; justify-content:space-between; align-items:center; margin-bottom:18px; font-size:12px; color:rgba(15,15,15,0.45);}
.af-control-row{display:flex; align-items:center; justify-content:space-between; gap:16px; padding:12px 0; border-top:1px solid rgba(15,15,15,0.06); font-size:13px; color:rgba(15,15,15,0.75);}
.af-control-row:first-of-type{border-top:none;}
.af-toggle{position:relative; width:38px; height:22px; border-radius:20px; background:rgba(15,41,66,0.12); flex-shrink:0; transition:background .25s ease;}
.af-toggle .knob{position:absolute; top:2px; left:2px; width:18px; height:18px; border-radius:50%; background:#fff; box-shadow:0 1px 3px rgba(0,0,0,0.2); transition:transform .25s ease;}
.af-toggle.on{background:var(--purple-accent);}
.af-toggle.on .knob{transform:translateX(16px);}

/* --- Baustein: dunkle Stat-Card auf Midnight Navy (Ihr Risiko) --- */
.af-stat-section{
  background:var(--midnight-navy); color:var(--orchid-white); border-radius:32px; padding:56px 48px;
  width:calc(100vw - 60px); margin-left:calc(-50vw + 50% + 30px); margin-right:calc(-50vw + 50% + 30px);
}
@media (max-width:1100px){ .af-stat-section{padding:40px 32px;} }
.af-stat-section .af-eyebrow{color:var(--signalgelb);}
.af-stat-top{display:flex; justify-content:space-between; align-items:flex-end; flex-wrap:wrap; gap:24px; margin-bottom:40px; max-width:calc(var(--max-w) - 64px); margin-left:auto; margin-right:auto;}
.af-stat-top h2{font-family:var(--font-headline); font-size:clamp(24px,3.2vw,36px); margin:0; max-width:520px;}
.af-stat-scroll{display:flex; gap:16px; overflow-x:auto; padding-bottom:6px; max-width:calc(var(--max-w) - 64px); margin-left:auto; margin-right:auto;}
.af-stat-card-dark{background:#fff; border:1px solid rgba(15,15,15,0.06); border-radius:16px; padding:26px; min-width:220px; flex:1; color:var(--neverything);}
.af-stat-card-dark .stat-num{font-family:var(--font-headline); font-weight:800; font-size:clamp(30px,4vw,44px); color:var(--signalgelb); display:block;}
.af-stat-card-dark h4{font-size:15px; margin:8px 0 6px; color:var(--neverything);}
.af-stat-card-dark p{font-size:13px; line-height:1.6; color:rgba(15,15,15,0.6); margin:0;}

/* ---------- REBOUNCE (seitenspezifisch, eigener Baukasten analog zu Shopping PLUS/Affiliate) ---------- */
.rb-section{padding:32px 0;}
.rb-eyebrow{
  font-family:var(--font-accent); font-weight:700; text-transform:uppercase;
  letter-spacing:0.08em; font-size:13px; color:var(--signalgelb); margin-bottom:24px; display:block;
}
.rb-split{display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:start;}
@media (max-width:900px){ .rb-split{grid-template-columns:1fr;} }
.rb-split h2{font-size:clamp(24px,3vw,34px); margin:0 0 16px; color:var(--neverything);}
.rb-split .rb-body-text{font-size:16px; line-height:1.7; color:rgba(15,15,15,0.55); margin-bottom:18px;}
.rb-split .rb-body-text:last-child{margin-bottom:0;}
.rb-split .rb-body-text strong{color:var(--neverything); font-weight:700;}

/* --- Baustein: dunkle Card mit weißen Sub-Cards (Die Ausgangslage) --- */
.rb-dark{
  background:var(--midnight-navy); color:var(--orchid-white);
  border-radius:32px; padding:72px 64px; text-align:center;
  width:calc(100vw - 60px); margin-left:calc(-50vw + 50% + 30px); margin-right:calc(-50vw + 50% + 30px);
}
.rb-dark .rb-eyebrow{color:var(--signalgelb);}
.rb-dark h2{font-family:var(--font-headline); font-size:clamp(32px,4.4vw,54px); font-weight:800; line-height:1.15; margin:0 auto; max-width:920px;}
@media (max-width:1100px){ .rb-dark{padding:48px 32px;} }
.rb-white-cards{display:grid; grid-template-columns:repeat(3,1fr); gap:20px; text-align:left; max-width:calc(var(--max-w) - 64px); margin:80px auto 40px;}
@media (max-width:900px){ .rb-white-cards{grid-template-columns:1fr;} }
.rb-white-card{background:#fff; color:var(--neverything); border-radius:18px; padding:36px 30px 40px; transition:transform .3s ease, box-shadow .3s ease; box-shadow:0 10px 30px rgba(15,15,15,0.05);}
.rb-white-card:hover{transform:translateY(-6px); box-shadow:0 20px 40px rgba(0,0,0,0.14);}
.rb-white-card .ic{font-size:28px; margin-bottom:20px; line-height:1; display:inline-block;}
.rb-white-card:hover .ic{animation:spIconPulse .6s ease-in-out;}
.rb-white-card h4{font-size:16px; font-weight:700; margin-bottom:8px;}
.rb-white-card p{font-size:14px; line-height:1.6; color:rgba(15,15,15,0.65); margin:0;}

/* --- Baustein: helle Tabs + Detailbereich (Die Lösung) --- */
.rb-tabs-header{margin-bottom:48px;}
.rb-tabs-header h2{font-family:var(--font-headline); font-weight:900; font-size:clamp(24px,3.2vw,38px); line-height:1.25; max-width:640px; color:var(--neverything); margin:0;}
.rb-tabs-header h2 em{font-style:italic; font-family:var(--font-headline); font-weight:400; color:var(--signalgelb);}
.rb-tabs-grid{display:grid; grid-template-columns:0.72fr 1.28fr; gap:24px; align-items:start;}
@media (max-width:900px){ .rb-tabs-grid{grid-template-columns:1fr;} }
.rb-tabs-list{display:flex; flex-direction:column; gap:12px;}
.rb-tab-btn{
  text-align:left; background:rgba(15,41,66,0.05); border:none; border-radius:14px;
  padding:18px 22px; font-family:var(--font-headline); font-weight:700; font-size:16px; color:rgba(15,15,15,0.45);
  cursor:pointer; display:flex; align-items:center; gap:14px; transition:background .2s ease, color .2s ease;
}
.rb-tab-btn .n{font-family:var(--font-accent); font-size:13px; font-weight:700; color:rgba(15,15,15,0.35);}
.rb-tab-btn.active{background:var(--midnight-navy); color:var(--orchid-white);}
.rb-tab-btn.active .n{color:var(--signalgelb);}
.rb-tab-body{display:none; background:rgba(15,41,66,0.03); border-radius:20px; padding:40px; opacity:0; transform:translateY(6px); transition:opacity .35s ease, transform .35s ease;}
.rb-tab-body.active{display:block;}
.rb-tab-body.active.rb-show{opacity:1; transform:translateY(0);}
.rb-tab-body h3{font-size:clamp(20px,2.4vw,28px); margin-bottom:14px; color:var(--neverything);}
.rb-tab-body > p{font-size:15px; line-height:1.7; color:rgba(15,15,15,0.6); margin-bottom:24px;}
.rb-plain-point{margin-bottom:16px;}
.rb-plain-point:last-child{margin-bottom:0;}
.rb-plain-point h4{color:var(--midnight-navy); font-size:15px; margin-bottom:5px;}
.rb-plain-point p{font-size:13px; line-height:1.6; color:rgba(15,15,15,0.6); margin:0;}
@media (max-width:700px){ .rb-tab-body{padding:24px;} }

/* --- Baustein: heller Prozess-Bereich (So funktioniert es) --- */
.rb-steps-header{display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:start; margin-bottom:80px;}
@media (max-width:900px){ .rb-steps-header{grid-template-columns:1fr;} }
.rb-steps-header h2{font-size:clamp(28px,3.6vw,42px); font-weight:800; line-height:1.15; margin:0; color:var(--neverything);}
.rb-steps-header p{font-size:17px; line-height:1.7; color:rgba(15,15,15,0.55); margin:0;}
.rb-step-cards{display:flex; gap:20px;}
@media (max-width:1100px){ .rb-step-cards{flex-wrap:wrap;} .rb-step-cards .rb-step-card{flex-basis:calc(50% - 10px);} }
@media (max-width:600px){ .rb-step-cards{flex-direction:column;} .rb-step-cards .rb-step-card{flex-basis:auto;} }
.rb-step-card{
  background:#fff; border:1px solid rgba(15,15,15,0.08); border-radius:20px; padding:26px;
  position:relative; overflow:hidden; min-height:460px; display:flex; flex-direction:column;
  flex:1 1 0; min-width:0;
  transition:transform .35s ease, box-shadow .35s ease, background .35s ease, flex-grow .45s ease;
}
.rb-step-card:hover{transform:translateY(-4px); box-shadow:0 24px 48px rgba(0,0,0,0.12); flex-grow:1.6;}
.rb-step-card .rb-step-top{position:relative; z-index:2;}
.rb-step-card .rb-step-label{display:flex; align-items:center; gap:8px; margin-bottom:10px;}
.rb-step-card .rb-step-time{
  font-family:var(--font-accent); font-weight:600; font-size:11px;
  color:rgba(15,15,15,0.4); background:rgba(15,41,66,0.06); padding:4px 10px; border-radius:20px;
  transition:color .35s ease, background .35s ease;
}
.rb-step-card:hover .rb-step-time{color:var(--signalgelb); background:rgba(255,164,32,0.14);}
.rb-step-card h4{font-family:var(--font-headline); font-weight:900; font-size:22px; margin-bottom:0; color:var(--neverything);}
.rb-step-card .rb-step-detail{max-height:0; opacity:0; overflow:hidden; transition:max-height .45s ease, opacity .3s ease, margin-top .45s ease; position:relative; z-index:2;}
.rb-step-card:hover .rb-step-detail{max-height:260px; opacity:1; margin-top:16px;}
.rb-step-card .rb-step-detail p{font-size:14px; line-height:1.6; color:rgba(15,15,15,0.6); margin:0 0 14px;}
.rb-step-card .rb-step-num{
  position:absolute; right:18px; bottom:-4px; font-family:var(--font-headline); font-weight:800;
  font-size:130px; line-height:1; color:var(--signalgelb); z-index:1; user-select:none;
  transition:color .4s ease;
}
.rb-step-card:hover .rb-step-num{color:rgba(15,41,66,0.08);}

/* --- Baustein: heller Bild+Text-Split mit Checkliste (Transparenz & Kontrolle) --- */
.rb-check-split{display:grid; grid-template-columns:0.9fr 1.1fr; gap:64px; align-items:stretch;}
@media (max-width:900px){ .rb-check-split{grid-template-columns:1fr;} }
.rb-check-split h2{font-size:clamp(26px,3.4vw,38px); font-weight:800; line-height:1.2; margin:0 0 16px; color:var(--neverything);}
.rb-check-split h2 em{font-style:italic; font-family:var(--font-headline); font-weight:400; color:var(--signalgelb);}
.rb-check-split .rb-sub{font-size:16px; color:rgba(15,15,15,0.5); margin:0 0 28px;}
.rb-check-list{display:flex; flex-direction:column; gap:18px;}
.rb-check-item{display:flex; align-items:flex-start; gap:14px;}
.rb-check-item .mark{flex-shrink:0; width:26px; height:26px; border-radius:8px; background:rgba(15,41,66,0.06); display:flex; align-items:center; justify-content:center; margin-top:2px;}
.rb-check-item .mark img{display:block;}
.rb-check-item p{margin:0; font-size:15px; line-height:1.6; color:rgba(15,15,15,0.75);}
.rb-check-item p strong{color:var(--midnight-navy);}

.rb-report-mock{background:#fff; border-radius:20px; padding:22px; box-shadow:0 24px 60px rgba(15,15,15,0.1); border:1px solid rgba(15,15,15,0.06); display:flex; flex-direction:column; margin-top:40px;}
.rb-report-mock .rep-head{display:flex; justify-content:space-between; align-items:center; margin-bottom:16px; font-size:12px; color:rgba(15,15,15,0.45); flex-shrink:0;}
.rb-report-mock .rep-bars{display:flex; align-items:flex-end; gap:10px; flex:1; min-height:80px; margin-bottom:14px;}
.rb-report-mock .rep-bar{flex:1; background:rgba(45,216,176,0.18); border-radius:6px 6px 0 0;}
.rb-report-mock .rep-bar.hi{background:var(--mint-accent);}
.rb-report-mock .rep-stats{display:flex; justify-content:space-between; font-size:11px; color:rgba(15,15,15,0.5); flex-shrink:0;}
.rb-report-mock .rep-stats strong{display:block; font-size:16px; color:var(--neverything); font-family:var(--font-headline);}

/* --- Mini-Landingpage-Vorschau (Transparenz & Kontrolle) --- */
.rb-page-mock{background:#fff; border-radius:20px; border:1px solid rgba(15,15,15,0.08); box-shadow:0 24px 60px rgba(15,15,15,0.1); overflow:hidden; margin-top:0;}
.rb-page-mock .browser-bar{display:flex; align-items:center; gap:6px; padding:14px 16px; background:rgba(15,41,66,0.04); border-bottom:1px solid rgba(15,15,15,0.06);}
.rb-page-mock .browser-dot{width:8px; height:8px; border-radius:50%; background:rgba(15,15,15,0.15);}
.rb-page-mock .page-body{padding:26px;}
.rb-page-mock .page-heading{font-size:12px; color:rgba(15,15,15,0.5); margin-bottom:16px;}
.rb-page-mock .rec-cards{display:flex; gap:12px;}
.rb-page-mock .rec-card{flex:1; background:rgba(15,41,66,0.03); border:1px solid rgba(15,15,15,0.08); border-radius:12px; padding:12px;}
.rb-page-mock .rec-card .thumb{width:100%; aspect-ratio:1; border-radius:8px; background:rgba(15,41,66,0.1); margin-bottom:10px;}
.rb-page-mock .rec-card .title{font-size:11px; font-weight:700; color:var(--neverything); margin-bottom:6px; line-height:1.3;}
.rb-page-mock .rec-card .tag{display:inline-block; font-size:9px; font-weight:700; text-transform:uppercase; letter-spacing:0.02em; color:var(--neverything); background:rgba(255,164,32,0.18); padding:3px 8px; border-radius:6px;}

/* --- Baustein: Rechner-Teaser (Ihr Potenzial) --- */
.rb-calc-split{display:grid; grid-template-columns:1fr 0.9fr; gap:64px; align-items:center;}
@media (max-width:900px){ .rb-calc-split{grid-template-columns:1fr;} }
.rb-calc-split h2{font-size:clamp(26px,3.4vw,38px); font-weight:800; line-height:1.2; margin:0 0 16px; color:var(--neverything);}
.rb-calc-split .rb-sub{font-size:16px; color:rgba(15,15,15,0.55); line-height:1.7; margin:0 0 28px;}
.rb-calc-mock{background:#fff; border-radius:20px; padding:28px; box-shadow:0 24px 60px rgba(15,15,15,0.1); border:1px solid rgba(15,15,15,0.06);}
.rb-calc-mock .rep-head{display:flex; justify-content:space-between; align-items:center; margin-bottom:18px; font-size:12px; color:rgba(15,15,15,0.45);}
.rb-calc-row{display:flex; align-items:center; justify-content:space-between; gap:16px; padding:12px 0; border-top:1px solid rgba(15,15,15,0.06); font-size:13px; color:rgba(15,15,15,0.75);}
.rb-calc-row:first-of-type{border-top:none;}
.rb-calc-row .val{font-family:var(--font-accent); font-weight:700; color:var(--midnight-navy); background:rgba(15,41,66,0.06); padding:4px 12px; border-radius:20px; font-size:12px;}
.rb-calc-slider{margin-bottom:22px;}
.rb-calc-slider:last-of-type{margin-bottom:0;}
.rb-calc-slider-label{display:flex; align-items:center; justify-content:space-between; font-size:13px; color:rgba(15,15,15,0.75); margin-bottom:10px;}
.rb-calc-slider-label .val{font-family:var(--font-accent); font-weight:700; color:var(--midnight-navy); background:rgba(15,41,66,0.06); padding:3px 11px; border-radius:20px; font-size:12px;}
.rb-calc-slider input[type=range]{-webkit-appearance:none; appearance:none; width:100%; height:4px; border-radius:2px; background:rgba(15,41,66,0.12); outline:none; cursor:pointer; margin:0;}
.rb-calc-slider input[type=range]::-webkit-slider-thumb{-webkit-appearance:none; width:18px; height:18px; border-radius:50%; background:var(--signalgelb); cursor:pointer; border:3px solid #fff; box-shadow:0 1px 6px rgba(0,0,0,0.3);}
.rb-calc-slider input[type=range]::-moz-range-thumb{width:18px; height:18px; border-radius:50%; background:var(--signalgelb); cursor:pointer; border:3px solid #fff; box-shadow:0 1px 6px rgba(0,0,0,0.3);}
.rb-calc-result{margin-top:18px; padding-top:18px; border-top:1px dashed rgba(255,164,32,0.4); display:flex; align-items:center; justify-content:space-between;}
.rb-calc-result .label{font-size:13px; color:rgba(15,15,15,0.6);}
.rb-calc-result .num{font-family:var(--font-headline); font-weight:800; font-size:28px; color:var(--signalgelb);}

/* ---------- PERFORMANCE-LEISTUNGEN: SEA (Template im Developios-Stil, wird auf die anderen Leistungsseiten übertragen) ---------- */
body.sea-page{background:#F6F4EF;}
body.sea-page .prod-hero{background:#F6F4EF; border-bottom:none;}
.sea-section{padding:32px 0;}
.sea-eyebrow{
  font-family:var(--font-accent); font-weight:700; text-transform:uppercase;
  letter-spacing:0.08em; font-size:13px; color:var(--signalgelb); margin-bottom:24px; display:block;
}

/* --- Bewertungs-Badge im Hero --- */
.sea-rating-badge{display:inline-flex; align-items:center; gap:10px; background:#fff; border:1px solid rgba(15,15,15,0.08); border-radius:999px; padding:8px 16px 8px 8px; box-shadow:0 8px 24px rgba(15,15,15,0.06);}
.sea-rating-badge .stars{color:var(--signalgelb); font-size:13px; letter-spacing:1px;}
.sea-rating-badge .txt{font-size:12px; color:rgba(15,15,15,0.55); font-family:var(--font-accent);}
.sea-rating-badge .txt strong{color:var(--neverything); font-weight:700;}

.sea-split{display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:start;}
@media (max-width:900px){ .sea-split{grid-template-columns:1fr;} }
.sea-split h2{font-size:clamp(24px,3vw,34px); margin:0 0 16px; color:var(--neverything);}
.sea-split .sea-body-text{font-size:16px; line-height:1.7; color:rgba(15,15,15,0.55); margin-bottom:18px;}
.sea-split .sea-body-text:last-child{margin-bottom:0;}
.sea-split .sea-body-text strong{color:var(--neverything); font-weight:700;}

/* --- Logo-Marquee (Kunden) --- */
.sea-logo-marquee-wrap{overflow:hidden; mask-image:linear-gradient(to right, transparent, #000 8%, #000 92%, transparent); padding:8px 0;}
.sea-logo-marquee-track{display:flex; align-items:center; width:max-content; gap:64px; animation:seaLogoMarqueeScroll 42s linear infinite;}
.sea-logo-marquee-track img{height:36px; width:auto; display:block; opacity:0.55; filter:grayscale(1); transition:opacity .25s ease, filter .25s ease;}
.sea-logo-marquee-track img:hover{opacity:1; filter:grayscale(0);}
@keyframes seaLogoMarqueeScroll{0%{transform:translateX(0);}100%{transform:translateX(-50%);}}
@media (prefers-reduced-motion:reduce){ .sea-logo-marquee-track{animation:none;} }

/* --- Baustein: eine große Stat-Card mit 2-Spalten-Raster (Bewiesene Wirkung) --- */
.sea-stats-panel{
  background:transparent; border-radius:32px; padding:48px;
  width:calc(100vw - 60px); margin-left:calc(-50vw + 50% + 30px); margin-right:calc(-50vw + 50% + 30px);
}
@media (max-width:1100px){ .sea-stats-panel{padding:32px 24px;} }
.sea-stats-panel-inner{max-width:calc(var(--max-w) - 64px); margin:0 auto;}
.sea-stats-panel-head{display:flex; justify-content:space-between; align-items:flex-end; gap:40px; flex-wrap:wrap;}
.sea-stats-panel-head h2{font-size:clamp(24px,3.2vw,36px); margin:0 0 8px; color:var(--neverything); font-weight:800; max-width:440px;}
.sea-stats-panel-head h2 em{font-style:italic; font-weight:400; color:var(--signalgelb);}
.sea-stats-panel-head p{font-size:15px; color:rgba(15,15,15,0.5); margin:0; max-width:340px; text-align:right;}
@media (max-width:700px){ .sea-stats-panel-head p{text-align:left;} }
.sea-stats-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-top:32px;}
@media (max-width:900px){ .sea-stats-grid{grid-template-columns:1fr 1fr;} }
@media (max-width:500px){ .sea-stats-grid{grid-template-columns:1fr;} }
.sea-stat-cell{padding:28px 24px; background:#fff; border:1px solid rgba(15,15,15,0.06); border-radius:18px; box-shadow:0 16px 40px rgba(15,15,15,0.05);}
.sea-stat-cell .cap{font-family:var(--font-headline); font-weight:800; font-size:16px; color:var(--neverything); margin-bottom:14px; display:block;}
.sea-stat-cell .figure{display:inline-flex; align-items:center; gap:6px; background:rgba(255,164,32,0.12); color:var(--signalgelb); font-family:var(--font-headline); font-weight:800; font-size:20px; padding:6px 16px; border-radius:999px; margin-bottom:10px;}
.sea-stat-cell .sub{display:block; font-size:13px; color:rgba(15,15,15,0.5);}

/* --- Baustein: dunkle Card mit vertikalem Feature-Stack (Warum unser Ansatz funktioniert) --- */
.sea-dark{
  background:var(--midnight-navy); color:var(--orchid-white);
  border-radius:32px; padding:56px 48px 64px;
  width:calc(100vw - 60px); margin-left:calc(-50vw + 50% + 30px); margin-right:calc(-50vw + 50% + 30px);
}
@media (max-width:1100px){ .sea-dark{padding:40px 24px 48px;} }
.sea-dark-head{max-width:calc(var(--max-w) - 64px); margin:0 auto 40px; text-align:center;}
.sea-dark-head h2{font-family:var(--font-headline); font-size:clamp(28px,3.8vw,44px); font-weight:800; margin:0;}
.sea-dark-head h2 em{font-style:italic; font-weight:400; color:var(--signalgelb);}
.sea-feature-stack{display:grid; grid-template-columns:repeat(3,1fr); gap:16px; max-width:calc(var(--max-w) - 64px); margin:0 auto;}
@media (max-width:900px){ .sea-feature-stack{grid-template-columns:1fr 1fr;} }
@media (max-width:600px){ .sea-feature-stack{grid-template-columns:1fr;} }
.sea-feature-card{background:#fff; border-radius:20px; padding:28px 26px; color:var(--neverything); display:block; transition:transform .3s ease, box-shadow .3s ease;}
.sea-feature-card:hover{transform:translateY(-6px); box-shadow:0 20px 40px rgba(0,0,0,0.18);}
.sea-feature-card .icon{margin-bottom:18px;}
.sea-feature-card:hover .icon img{animation:spIconPulse .6s ease-in-out;}
.sea-feature-card .icon{width:44px; height:44px; display:flex; align-items:center; justify-content:center; flex-shrink:0;}
.sea-feature-card .icon img{width:28px; height:28px; display:block;}
.sea-feature-card h4{font-size:18px; font-weight:700; margin:0 0 8px;}
.sea-feature-card p{font-size:14px; line-height:1.65; color:rgba(15,15,15,0.6); margin:0;}

/* --- Kopfzeile: Eyebrow links, große zweizeilige Headline rechts (Was wir liefern) --- */
.sea-liefern-head{display:grid; grid-template-columns:400px 1fr; gap:24px; align-items:start; margin-bottom:40px;}
@media (max-width:700px){ .sea-liefern-head{grid-template-columns:1fr;} }
.sea-liefern-head .sea-eyebrow{white-space:nowrap; margin-bottom:0; padding-top:6px;}

/* --- Baustein: Akkordeon (Was wir liefern) --- */
.sea-acc{border-top:1px solid rgba(15,15,15,0.1);}
.sea-acc-item{border-bottom:1px solid rgba(15,15,15,0.1); overflow:visible;}
.sea-acc-head{
  cursor:pointer; display:grid; grid-template-columns:400px 1fr auto; gap:24px; align-items:center;
  padding:26px 44px 26px 4px; position:relative;
}
@media (max-width:900px){ .sea-acc-head{grid-template-columns:40px 1fr auto;} }
.sea-acc-head .num{font-family:var(--font-accent); font-weight:700; font-size:clamp(17px,2vw,22px); color:rgba(15,15,15,0.35);}
.sea-acc-head .title{font-family:var(--font-headline); font-weight:700; font-size:clamp(17px,2vw,22px); color:var(--neverything); min-width:0;}
.sea-acc-item.open .sea-acc-head .num{color:var(--signalgelb);}
.sea-acc-head .chev{
  width:34px; height:34px; border-radius:50%; background:rgba(15,41,66,0.05); flex-shrink:0; position:relative;
  transition:transform .3s ease, background .3s ease;
}
.sea-acc-head .chev::before, .sea-acc-head .chev::after{content:''; position:absolute; top:44%; width:7px; height:1.6px; background:var(--neverything);}
.sea-acc-head .chev::before{left:50%; transform:translate(-85%,-50%) rotate(45deg);}
.sea-acc-head .chev::after{left:50%; transform:translate(-15%,-50%) rotate(-45deg);}
.sea-acc-item.open .chev{background:var(--signalgelb); transform:rotate(180deg);}
.sea-acc-body{display:grid; grid-template-rows:0fr; transition:grid-template-rows .4s ease;}
.sea-acc-body .inner{overflow:hidden;}
.sea-acc-item.open .sea-acc-body{grid-template-rows:1fr;}
.sea-acc-body p{margin:0; padding:0 44px 28px 424px; font-size:15px; line-height:1.7; color:rgba(15,15,15,0.6); max-width:820px;}
@media (max-width:900px){ .sea-acc-body p{padding-left:64px;} }
.sea-acc-body strong{color:var(--midnight-navy);}

/* --- Baustein: Foto + schlichte Checkliste (Kommt Ihnen bekannt vor?) --- */
.sea-pain-split{display:grid; grid-template-columns:0.9fr 1.1fr; gap:56px; align-items:stretch;}
@media (max-width:900px){ .sea-pain-split{grid-template-columns:1fr;} }
.sea-pain-media{
  border-radius:28px; overflow:hidden; min-height:320px; background:var(--midnight-navy) center/cover no-repeat;
}
.sea-pain-head{margin:0 0 28px;}
.sea-pain-head h2{font-size:clamp(26px,3.6vw,40px); font-weight:800; margin:0 0 16px; color:var(--neverything);}
.sea-pain-head h2 em{font-style:italic; font-weight:400; color:var(--signalgelb);}
.sea-pain-head p{font-size:16px; line-height:1.7; color:rgba(15,15,15,0.55); margin:0;}
.sea-pain-list{display:flex; flex-direction:column; gap:18px; margin:32px 0;}
.sea-pain-list .row{display:flex; align-items:flex-start; gap:14px; font-size:15px; line-height:1.6; color:rgba(15,15,15,0.7);}
.sea-pain-list .row strong{color:var(--neverything);}
.sea-pain-list .mark{flex-shrink:0; width:26px; height:26px; border-radius:8px; background:rgba(15,41,66,0.06); display:flex; align-items:center; justify-content:center; margin-top:2px;}
.sea-pain-list .mark img{display:block;}

/* --- Baustein: Pill-CTA (durchgehende Leiste, statt Kontakt-Card) --- */
.sea-cta-pill{
  background:var(--signalgelb); border-radius:999px; padding:10px 10px 10px 28px;
  display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap;
}
.sea-cta-pill .txt{font-family:var(--font-headline); font-weight:800; font-size:18px; color:var(--neverything);}
.sea-cta-pill .arrow{
  width:52px; height:52px; border-radius:50%; background:var(--neverything); color:#fff; flex-shrink:0;
  display:flex; align-items:center; justify-content:center; font-size:20px; transition:transform .2s ease;
}
.sea-cta-pill:hover .arrow{transform:rotate(45deg);}
.sea-cta-contact{display:flex; align-items:center; gap:10px; margin-top:18px; font-size:13px; color:rgba(15,15,15,0.55);}
.sea-cta-contact strong{color:var(--neverything);}
.sea-cta-contact a{color:var(--midnight-navy); text-decoration:underline;}

/* --- Baustein: dunkle "Unterschied"-Card mit Stat-Trio --- */
.sea-diff{
  background:var(--midnight-navy); color:var(--orchid-white); border-radius:32px; padding:72px 64px; text-align:center;
  width:calc(100vw - 60px); margin-left:calc(-50vw + 50% + 30px); margin-right:calc(-50vw + 50% + 30px);
}
@media (max-width:1100px){ .sea-diff{padding:48px 32px;} }
.sea-diff h2{font-family:var(--font-headline); font-size:clamp(26px,3.4vw,40px); font-weight:800; margin:0 auto 20px; max-width:640px; line-height:1.2;}
.sea-diff h2 em{font-style:italic; font-weight:400; color:var(--signalgelb);}
.sea-diff p{font-size:16px; line-height:1.7; color:rgba(255,252,242,0.65); max-width:680px; margin:0 auto 44px;}
.sea-diff-trio{display:flex; gap:20px; flex-wrap:wrap; justify-content:center; max-width:calc(var(--max-w) - 64px); margin:0 auto;}
.sea-diff-trio .cell{flex:1; min-width:200px; text-align:left; background:#fff; border:1px solid rgba(15,15,15,0.06); border-radius:18px; padding:24px; box-shadow:0 16px 40px rgba(15,15,15,0.1);}
.sea-diff-trio .num{display:block; font-family:var(--font-headline); font-weight:800; font-size:clamp(18px,1.8vw,22px); color:var(--signalgelb); margin-bottom:8px; white-space:nowrap;}
.sea-diff-trio .lbl{font-size:13px; color:rgba(15,15,15,0.6); line-height:1.55;}

/* --- Baustein: Prozess-Karussell (So funktioniert es) --- */
.sea-process-head{margin-bottom:8px;}
.sea-process-head h2{font-size:clamp(26px,4vw,44px); font-weight:800; margin:0 0 16px; color:var(--neverything); line-height:1.1;}
.sea-process-head h2 em{font-style:italic; font-weight:400; color:rgba(15,15,15,0.4);}
.sea-process-head p{font-size:15px; color:rgba(15,15,15,0.5); max-width:640px; margin:0 0 32px;}

/* --- Schritt-Cards (So funktioniert es) — Look wie bei ReBounce/Shopping PLUS/Affiliate --- */
.sea-step-cards{display:flex; gap:20px;}
@media (max-width:1100px){ .sea-step-cards{flex-wrap:wrap;} .sea-step-cards .sea-step-card{flex-basis:calc(50% - 10px);} }
@media (max-width:600px){ .sea-step-cards{flex-direction:column;} .sea-step-cards .sea-step-card{flex-basis:auto;} }
.sea-step-card{
  background:#fff; border:1px solid rgba(15,15,15,0.08); border-radius:20px; padding:26px;
  position:relative; overflow:hidden; min-height:460px; display:flex; flex-direction:column;
  flex:1 1 0; min-width:0;
  transition:transform .35s ease, box-shadow .35s ease, background .35s ease, flex-grow .45s ease;
}
.sea-step-card:hover{transform:translateY(-4px); box-shadow:0 24px 48px rgba(0,0,0,0.12); flex-grow:1.6;}
.sea-step-card .sea-step-top{position:relative; z-index:2;}
.sea-step-card .sea-step-label{display:flex; align-items:center; gap:8px; margin-bottom:10px;}
.sea-step-card .sea-step-time{
  font-family:var(--font-accent); font-weight:600; font-size:11px;
  color:rgba(15,15,15,0.4); background:rgba(15,41,66,0.06); padding:4px 10px; border-radius:20px;
  transition:color .35s ease, background .35s ease;
}
.sea-step-card:hover .sea-step-time{color:var(--signalgelb); background:rgba(255,164,32,0.14);}
.sea-step-card h4{font-family:var(--font-headline); font-weight:900; font-size:22px; margin-bottom:0; color:var(--neverything);}
.sea-step-card .sea-step-detail{max-height:0; opacity:0; overflow:hidden; transition:max-height .45s ease, opacity .3s ease, margin-top .45s ease; position:relative; z-index:2;}
.sea-step-card:hover .sea-step-detail{max-height:260px; opacity:1; margin-top:16px;}
.sea-step-card .sea-step-detail p{font-size:14px; line-height:1.6; color:rgba(15,15,15,0.6); margin:0 0 14px;}
.sea-step-card .sea-step-num{
  position:absolute; right:18px; bottom:-4px; font-family:var(--font-headline); font-weight:800;
  font-size:130px; line-height:1; color:var(--signalgelb); z-index:1; user-select:none;
  transition:color .4s ease;
}
.sea-step-card:hover .sea-step-num{color:rgba(15,41,66,0.08);}

/* --- Reporting-Mock (Transparenz) --- */
.sea-dash-mock{background:#fff; border-radius:20px; border:1px solid rgba(15,15,15,0.08); box-shadow:0 24px 60px rgba(15,15,15,0.1); overflow:hidden;}
.sea-dash-mock .dash-topbar{display:flex; justify-content:space-between; align-items:center; gap:12px; padding:16px 20px; background:var(--midnight-navy);}
.sea-dash-mock .dash-title{font-family:var(--font-headline); font-weight:700; font-size:13px; color:var(--orchid-white);}
.sea-dash-mock .dash-daterange{font-size:11px; color:rgba(255,252,242,0.55); background:rgba(255,252,242,0.08); padding:5px 10px; border-radius:20px;}
.sea-dash-mock .dash-body{display:grid; grid-template-columns:1.2fr 1fr; gap:14px; padding:16px;}
.sea-dash-mock .dash-panel{background:rgba(15,41,66,0.03); border:1px solid rgba(15,41,66,0.1); border-radius:12px; padding:14px;}
.sea-dash-mock .dash-panel-table{grid-column:1 / -1;}
.sea-dash-mock .dash-panel-head{font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:0.03em; color:rgba(15,41,66,0.55); margin-bottom:12px; display:flex; justify-content:space-between;}
.sea-dash-mock .dash-panel-head .sort{color:rgba(15,41,66,0.35); font-size:9px;}
.sea-dash-mock .rep-bars{display:flex; align-items:flex-end; gap:8px; height:84px;}
.sea-dash-mock .rep-bar{flex:1; background:rgba(15,41,66,0.12); border-radius:4px 4px 0 0;}
.sea-dash-mock .rep-bar.hi{background:var(--signalgelb);}
.sea-dash-mock .dash-kpi-grid{display:grid; grid-template-columns:1fr 1fr; gap:10px;}
.sea-dash-mock .dash-kpi{background:#fff; border:1px solid rgba(15,41,66,0.08); border-radius:8px; padding:8px 10px;}
.sea-dash-mock .dash-kpi .lbl{display:block; font-size:9px; color:rgba(15,15,15,0.45); margin-bottom:4px;}
.sea-dash-mock .dash-kpi .val{display:block; font-family:var(--font-headline); font-weight:800; font-size:15px; color:var(--neverything);}
.sea-dash-mock .dash-table-row{display:grid; grid-template-columns:60px 1fr; align-items:center; gap:10px; height:16px; margin-bottom:10px;}
.sea-dash-mock .dash-table-row:last-child{margin-bottom:0;}
.sea-dash-mock .dash-table-row span:first-child{height:8px; border-radius:4px; background:rgba(15,41,66,0.08);}
.sea-dash-mock .dash-table-row .bar{height:8px; border-radius:4px; background:var(--signalgelb);}
.sea-check-split{display:grid; grid-template-columns:0.9fr 1.1fr; gap:64px; align-items:stretch;}
@media (max-width:900px){ .sea-check-split{grid-template-columns:1fr;} }
.sea-check-split h2{font-size:clamp(26px,3.4vw,38px); font-weight:800; line-height:1.2; margin:0 0 16px; color:var(--neverything);}
.sea-check-split h2 em{font-style:italic; font-family:var(--font-headline); font-weight:400; color:var(--signalgelb);}
.sea-check-split .sea-sub{font-size:16px; color:rgba(15,15,15,0.5); margin:0 0 28px;}
.sea-check-list{display:flex; flex-direction:column; gap:18px;}
.sea-check-item{display:flex; align-items:flex-start; gap:14px;}
.sea-check-item .mark{flex-shrink:0; width:26px; height:26px; border-radius:8px; background:rgba(15,41,66,0.06); display:flex; align-items:center; justify-content:center; margin-top:2px;}
.sea-check-item .mark img{display:block;}
.sea-check-item p{margin:0; font-size:15px; line-height:1.6; color:rgba(15,15,15,0.75);}
.sea-check-item p strong{color:var(--midnight-navy);}
.rb-calc-mock .rep-head .live-tag{font-family:var(--font-accent); font-weight:700; font-size:10px; text-transform:uppercase; letter-spacing:0.04em; color:var(--signalgelb); background:rgba(255,164,32,0.14); padding:3px 9px; border-radius:20px;}
.rb-calc-mock .rep-head select.live-tag{appearance:none; -webkit-appearance:none; -moz-appearance:none; border:none; outline:none; cursor:pointer;}

/* --- Baustein: helle Stat-Card (Ihr Risiko) — Alternative zur dunklen Navy-Card --- */
.rb-stat-section{
  background:var(--midnight-navy); color:var(--orchid-white); border-radius:32px; padding:56px 48px;
  width:calc(100vw - 60px); margin-left:calc(-50vw + 50% + 30px); margin-right:calc(-50vw + 50% + 30px);
}
@media (max-width:1100px){ .rb-stat-section{padding:40px 32px;} }
.rb-stat-section .rb-eyebrow{color:var(--signalgelb);}
.rb-stat-top{display:flex; justify-content:space-between; align-items:flex-end; flex-wrap:wrap; gap:24px; margin-bottom:40px; max-width:calc(var(--max-w) - 64px); margin-left:auto; margin-right:auto;}
.rb-stat-top h2{font-family:var(--font-headline); font-size:clamp(24px,3.2vw,36px); margin:0; max-width:520px;}
.rb-stat-scroll{display:flex; gap:16px; overflow-x:auto; padding-bottom:6px; max-width:calc(var(--max-w) - 64px); margin-left:auto; margin-right:auto;}
.rb-stat-card{background:#fff; border:1px solid rgba(15,15,15,0.06); border-radius:16px; padding:26px; min-width:220px; flex:1; color:var(--neverything);}
.rb-stat-card .stat-num{font-family:var(--font-headline); font-weight:800; font-size:clamp(30px,4vw,44px); color:var(--signalgelb); display:block;}
.rb-stat-card h4{font-size:15px; margin:8px 0 6px; color:var(--neverything);}
.rb-stat-card p{font-size:13px; line-height:1.6; color:rgba(15,15,15,0.6); margin:0;}

/* ---------- TEAM PAGE ---------- */
.team-groups{display:flex; flex-direction:column; gap:56px;}
.team-group h3{font-size:22px; margin-bottom:24px;}
.team-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:24px;}
@media (max-width:900px){ .team-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:500px){ .team-grid{grid-template-columns:1fr;} }
.team-member{text-align:left; position:relative; border-radius:16px; overflow:hidden; background:var(--midnight-navy);}
.team-member .tm-photo{width:100%; aspect-ratio:4/5; background:var(--midnight-navy) center/cover no-repeat; display:block;}
.team-member .tm-overlay{position:absolute; left:0; right:0; bottom:0; padding:10px; display:flex; flex-direction:column; gap:8px;}
.team-member .tm-tags{display:flex; flex-wrap:wrap; gap:6px;}
.team-member .tm-tag{font-size:10px; font-weight:600; color:#fff; background:rgba(255,255,255,0.18); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); padding:4px 10px; border-radius:20px; line-height:1.3;}
.team-member .tm-row{display:flex; align-items:center; justify-content:space-between; gap:8px; background:rgba(255,255,255,0.18); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); border-radius:12px; padding:10px 12px;}
.team-member .name{color:#fff; font-weight:700; font-size:15px;}
.team-member .tm-icons{display:flex; gap:6px; flex-shrink:0;}
.team-member .tm-icon{width:26px; height:26px; border-radius:50%; background:rgba(255,255,255,0.18); display:flex; align-items:center; justify-content:center; color:#fff; font-size:22px; line-height:1; font-weight:700; text-decoration:none; flex-shrink:0; transition:background .2s ease; overflow:visible;}
.team-member .tm-icon:hover{background:rgba(255,255,255,0.32);}
.team-placeholder{border:1px dashed rgba(15,15,15,0.25); border-radius:16px; padding:24px; text-align:center; color:rgba(15,15,15,0.5); font-size:13px; margin-top:16px;}

.team-member{opacity:0; transition:opacity .7s ease, transform .7s cubic-bezier(.22,1,.36,1);}
.team-member:nth-child(4n+1){transform:translateX(-70px) rotate(-7deg);}
.team-member:nth-child(4n+2){transform:translateX(70px) rotate(7deg);}
.team-member:nth-child(4n+3){transform:translateX(70px) rotate(7deg);}
.team-member:nth-child(4n+4){transform:translateX(-70px) rotate(-7deg);}
.team-grid.in-view .team-member{opacity:1; transform:translateX(0) rotate(0deg);}
.team-grid.in-view .team-member:nth-child(1){transition-delay:0s;}
.team-grid.in-view .team-member:nth-child(2){transition-delay:.07s;}
.team-grid.in-view .team-member:nth-child(3){transition-delay:.14s;}
.team-grid.in-view .team-member:nth-child(4){transition-delay:.21s;}
.team-grid.in-view .team-member:nth-child(5){transition-delay:.28s;}
.team-grid.in-view .team-member:nth-child(6){transition-delay:.35s;}
.team-grid.in-view .team-member:nth-child(7){transition-delay:.42s;}
.team-grid.in-view .team-member:nth-child(8){transition-delay:.49s;}
.team-grid.in-view .team-member:nth-child(n+9){transition-delay:.56s;}
@media (prefers-reduced-motion:reduce){
  .team-member{opacity:1; transform:none; transition:none;}
}

/* ---------- JOBS PAGE ---------- */
.jobs-list{display:flex; flex-direction:column; gap:16px;}
.job-card{
  display:flex; justify-content:space-between; align-items:center; gap:20px;
  background:var(--orchid-white); border:1px solid rgba(15,15,15,0.1); border-radius:18px; padding:26px 28px; flex-wrap:wrap;
}
.job-card h4{font-size:18px; margin-bottom:6px;}
.job-card p{font-size:14px; color:var(--midnight-navy); font-weight:400;}
.job-card.creative{background:var(--neverything); color:var(--orchid-white); border-color:var(--neverything);}
.job-card.creative p{color:rgba(255,252,242,0.65);}
.job-doodle{width:56px; height:56px; flex-shrink:0;}

.jobs-decobar{
  position:static; margin:30px auto 0; width:calc(var(--max-w) + 48px); max-width:calc(100vw - 32px);
  box-sizing:border-box; display:flex; align-items:center; gap:0;
  background:rgba(15,15,15,0.09); border-radius:16px; padding:8px 56px;
}
.jobs-decobar-dd{position:relative;}
.jobs-decobar-trigger{
  appearance:none; background:none; border:none; display:flex; align-items:center; gap:6px;
  padding:10px 16px; font-size:13px; font-weight:600; color:var(--neverything);
  font-family:inherit; cursor:pointer; border-radius:10px; transition:background .15s ease;
}
.jobs-decobar-trigger:hover{background:rgba(15,15,15,0.06);}
.jobs-decobar-trigger .chev{font-size:11px; opacity:0.5;}
.jobs-filter-dropdown{
  width:min(280px, calc(100vw - 64px)); left:0; transform:translate(0, -8px); padding:14px 16px;
}
.jobs-filter-dropdown.open{transform:translate(0, 4px);}
.jobs-filter-dropdown .mega-row{padding:12px 12px; font-size:14px;}
.jobs-filter-dropdown .mega-row.is-selected{background:rgba(255,164,32,0.14); font-weight:700;}
.jobs-decobar-right{margin-left:auto; display:flex; align-items:center; gap:14px;}
.jobs-decobar-reset{background:none; border:none; font-family:inherit; cursor:pointer;}
.jobs-decobar-count{
  background:var(--neverything); color:var(--orchid-white); font-size:11px; font-weight:700;
  width:20px; height:20px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  transition:background .2s ease, color .2s ease;
}
.jobs-decobar-count.has-filters{background:var(--signalgelb); color:var(--neverything);}
.jobs-decobar-reset{font-size:12px; color:rgba(15,15,15,0.5); font-weight:600; white-space:nowrap;}
@media (max-width:700px){
  .jobs-decobar{padding:8px 20px; overflow-x:auto;}
  .jobs-decobar-reset{display:none;}
}

.jobs-hero{
  position:relative; overflow:hidden; border-bottom:none;
  min-height:calc(100vh - 200px);
  display:grid; grid-template-rows:1fr auto 1fr; padding:0 0 8px;
}
.jobs-hero .wrap{position:relative; z-index:1;}
.jobs-hero-inner{text-align:center; grid-row:2; align-self:center;}
.jobs-hero-bottom-row{grid-row:3; align-self:end; margin-top:0 !important;}
.jobs-hero-title{
  position:relative;
  font-family:'Stack Sans Notch', var(--font-display), sans-serif;
  font-size:clamp(42px,8.3vw,110px); line-height:0.96; margin:0 0 12px; text-transform:uppercase;
  letter-spacing:-0.01em;
}
.jobs-hero-megaphone-wrap{
  position:absolute; left:-180px; top:calc(50% + 40px); transform:translateY(-50%);
  width:150px; height:80px; pointer-events:none; perspective:600px;
}
.jobs-sticker-group{
  position:absolute; inset:0; transform-style:preserve-3d;
}
.sticker-emoji{
  position:absolute; right:0; top:50%; transform:translateY(-50%) rotate(-4deg);
  font-size:80px; line-height:1;
  text-shadow:
    -4px -4px 0 #fff, 4px -4px 0 #fff, -4px 4px 0 #fff, 4px 4px 0 #fff,
    -4px 0 0 #fff, 4px 0 0 #fff, 0 -4px 0 #fff, 0 4px 0 #fff,
    -3px -3px 0 #fff, 3px -3px 0 #fff, -3px 3px 0 #fff, 3px 3px 0 #fff;
}
.sticker-base{
  filter:drop-shadow(4px 8px 8px rgba(15,15,15,0.25));
}
.sticker-flap{
  clip-path:polygon(52% 0, 100% 0, 100% 50%);
  transform-origin:88% 12%;
  backface-visibility:hidden;
  filter:drop-shadow(3px 6px 8px rgba(15,15,15,0.35));
}
.jobs-hiring-tag{
  display:inline-block; vertical-align:middle; margin-left:14px; position:relative;
  background:var(--signalgelb); color:var(--neverything); font-size:15px; font-weight:800;
  padding:9px 16px; border-radius:999px 999px 999px 5px; font-family:var(--font-headline); letter-spacing:0.03em;
  white-space:nowrap; transform:translateY(-38px) rotate(-6deg); transition:transform .1s linear;
  box-shadow:3px 4px 0 rgba(15,15,15,0.85), 6px 9px 14px rgba(15,15,15,0.3);
}
@media (max-width:1100px){ .jobs-hero-megaphone-wrap{display:none;} }
.jobs-hero-sub-center{font-size:16px; color:var(--midnight-navy); max-width:460px; margin:0 auto;}
.jobs-hero-bottom-row{
  width:100%; box-sizing:border-box;
  display:flex; justify-content:space-between; align-items:center; gap:24px; flex-wrap:wrap;
  margin-top:80px; padding-top:20px; border-top:1px solid rgba(15,15,15,0.08);
}
.jobs-hero-stat{font-size:14px; color:var(--midnight-navy);}
.jobs-hero-stat strong{color:var(--neverything); font-family:var(--font-headline); font-size:16px;}
.jobs-hero-teaser{font-size:14px; color:var(--midnight-navy);}
.jobs-hero-teaser a{color:var(--neverything); text-decoration:underline; font-weight:600;}
@media (max-width:700px){ .jobs-hero-bottom-row{flex-direction:column; align-items:flex-start;} }

.jobs-pin-wrap{padding:0; position:relative; z-index:320; background:var(--orchid-white);}
.jobs-pin-panel{
  border-radius:0; padding-top:96px; padding-bottom:96px;
}
.jobs-pin-inner{
  max-width:var(--max-w); margin:0 auto; padding:100px 32px 16px; box-sizing:border-box;
}
.jobs-pin-scroll{
  display:flex; flex-direction:column; gap:16px;
}
.job-card-expanded{
  border:1px solid rgba(15,15,15,0.1); border-radius:20px; padding:32px; background:rgba(15,15,15,0.03); flex-shrink:0;
}
@media (max-width:900px){
  .jobs-pin-inner{padding:28px 20px;}
}
.job-card-head{display:flex; justify-content:space-between; align-items:flex-start; gap:16px; flex-wrap:wrap; margin-bottom:16px;}
.job-card-head h3{font-size:clamp(19px,2.2vw,24px); margin:0;}
.job-card-tags{display:flex; gap:8px; flex-wrap:wrap;}
.job-card-tags span{
  background:rgba(15,15,15,0.05); border-radius:999px; padding:5px 12px;
  font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:0.03em; color:rgba(15,15,15,0.6);
}
.job-card-tags span.tag-accent{background:var(--signalgelb); color:var(--neverything);}
.job-card-meta{display:flex; gap:32px; flex-wrap:wrap; margin-bottom:18px;}
.job-card-meta .label{display:block; font-size:11px; text-transform:uppercase; letter-spacing:0.04em; color:rgba(15,15,15,0.4); margin-bottom:2px;}
.job-card-meta div{font-family:var(--font-headline); font-weight:700; font-size:14px;}
.job-card-desc{font-size:14px; line-height:1.6; color:var(--midnight-navy); font-weight:400; margin-bottom:22px; max-width:640px;}
.jobs-empty{font-size:14px; color:var(--midnight-navy); padding:40px 0; text-align:center;}

/* ---------- PRESSE PAGE ---------- */
.presse-portraits{display:grid; grid-template-columns:1fr 1fr; gap:32px;}
@media (max-width:700px){ .presse-portraits{grid-template-columns:1fr;} }
.presse-portrait{border:1px solid rgba(15,15,15,0.1); border-radius:20px; padding:28px;}
.logo-downloads{display:flex; gap:16px; flex-wrap:wrap; margin-top:24px;}
.logo-download-item{border:1px solid rgba(15,15,15,0.1); border-radius:14px; padding:18px 24px; font-size:13px; font-weight:600;}
.news-list{display:flex; flex-direction:column; gap:0; border-top:1px solid rgba(15,15,15,0.1); margin-top:16px;}
.news-item{display:flex; justify-content:space-between; gap:20px; padding:20px 4px; border-bottom:1px solid rgba(15,15,15,0.1);}
.news-item .date{font-size:12px; color:rgba(15,15,15,0.5); font-family:var(--font-accent); font-weight:700; white-space:nowrap;}

/* ---------- REFERENZEN PAGE ---------- */
.filter-bar{display:flex; gap:10px; flex-wrap:wrap; margin-bottom:40px;}
.filter-chip{
  font-family:var(--font-accent); font-size:13px; font-weight:700; text-transform:uppercase; letter-spacing:0.03em;
  padding:10px 18px; border-radius:999px; border:1px solid rgba(15,15,15,0.2); cursor:pointer; background:transparent;
}
.filter-chip.active{background:var(--neverything); color:var(--orchid-white); border-color:var(--neverything);}
.referenzen-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:20px;}
@media (max-width:900px){ .referenzen-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:600px){ .referenzen-grid{grid-template-columns:1fr;} }
.ref-card{border:1px solid rgba(15,15,15,0.1); border-radius:18px; padding:24px; min-height:140px;}
.ref-card .branche{font-family:var(--font-accent); font-size:11px; font-weight:700; text-transform:uppercase; color:var(--midnight-navy); margin-bottom:8px;}
.ref-card h4{font-size:16px; margin-bottom:6px;}
.ref-card p{font-size:13px; color:rgba(15,15,15,0.5); font-weight:400;}

/* ---------- CASES / REFERENZEN (Card + Lightbox) ---------- */
.branche-tag{display:inline-block; font-family:var(--font-accent); font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:0.02em; color:var(--midnight-navy); background:rgba(15,41,66,0.08); padding:6px 12px; border-radius:999px; margin-bottom:14px;}

.cases-hero-viewport{min-height:calc(100vh - 88px); padding:0; display:flex; align-items:stretch; box-sizing:border-box; position:relative; border-bottom:none;}
.cases-hero-viewport .wrap.cases-hero-grid{width:100%; display:grid; grid-template-columns:35% 1fr; gap:48px; align-items:center;}
.cases-hero-left{display:flex; flex-direction:column; justify-content:center; align-items:flex-start;}
.cases-hero-right{position:relative; border-radius:24px; overflow:hidden; cursor:pointer; margin:0; width:100%; aspect-ratio:16/11;}
.cases-hero-right-media{position:absolute; inset:0; background-size:cover; background-position:center; transition:transform .4s ease;}
.cases-hero-right:hover .cases-hero-right-media{transform:scale(1.04);}
.cases-hero-right-overlay{position:absolute; inset:0; background:linear-gradient(0deg, rgba(15,15,15,0.85) 0%, rgba(15,15,15,0.55) 35%, rgba(15,15,15,0) 70%);}
.cases-hero-right-body{position:absolute; left:0; right:0; bottom:0; padding:44px; color:var(--orchid-white); z-index:1;}
.cases-hero-right-body .branche-tag{background:var(--signalgelb); color:var(--neverything);}
.cases-hero-right-body h2{font-size:clamp(24px,2.8vw,34px); margin-bottom:14px; line-height:1.25;}
.cases-hero-right-body p{font-size:15px; color:rgba(255,252,242,0.85); margin-bottom:20px; max-width:560px;}
.cases-hero-right-body .case-read-link{color:var(--orchid-white);}
@media (max-width:900px){
  .cases-hero-viewport{min-height:0; padding:120px 0 0;}
  .cases-hero-viewport .wrap.cases-hero-grid{grid-template-columns:1fr; gap:24px;}
  .cases-hero-right{min-height:280px; margin-bottom:32px;}
}

.case-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:24px;}
@media (max-width:900px){ .case-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:600px){ .case-grid{grid-template-columns:1fr;} }
.case-card{border:1px solid rgba(15,15,15,0.1); border-radius:18px; overflow:hidden; cursor:pointer; transition:transform .25s ease, box-shadow .25s ease; background:var(--orchid-white);}
.case-card:hover{transform:translateY(-4px); box-shadow:0 16px 32px rgba(15,15,15,0.1);}
.case-card-media{height:170px; background-size:cover; background-position:center; position:relative;}
.case-service-tag{position:absolute; top:14px; left:14px; font-family:var(--font-accent); font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:0.02em; color:var(--neverything); background:var(--signalgelb); padding:6px 12px; border-radius:999px;}
.case-service-tag.tag-affiliate{background:var(--purple-accent); color:var(--orchid-white);}
.case-service-tag.tag-rebounce{background:var(--mint-accent); color:var(--neverything);}
.case-card-body{padding:22px;}
.case-card-body h4{font-size:16px; margin-bottom:8px; line-height:1.3;}
.case-card-body p{font-size:13px; color:rgba(15,15,15,0.55); font-weight:400; margin-bottom:14px;}
.case-read-link{display:inline-flex; align-items:center; gap:8px; font-family:var(--font-accent); font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:0.02em; color:var(--neverything);}
.case-read-link .sq{width:6px; height:6px; background:currentColor; display:inline-block;}

.case-lightbox{position:fixed; inset:0; z-index:500; display:none; align-items:center; justify-content:center; padding:24px;}
.case-lightbox.open{display:flex;}
.case-lightbox-backdrop{position:absolute; inset:0; background:rgba(15,15,15,0.6); backdrop-filter:blur(2px);}
.case-lightbox-panel{position:relative; background:var(--orchid-white); border-radius:24px; max-width:760px; width:100%; max-height:88vh; overflow-y:auto; z-index:1;}
.case-lightbox-close{position:absolute; top:16px; right:16px; width:36px; height:36px; border-radius:50%; background:var(--orchid-white); border:1px solid rgba(15,15,15,0.15); font-size:20px; line-height:1; cursor:pointer; z-index:2;}
.case-lightbox-close:hover{background:var(--neverything); color:var(--orchid-white);}
.case-lightbox-media{height:280px; background-size:cover; background-position:center; border-radius:24px 24px 0 0;}
.case-lightbox-body{padding:36px 40px 44px;}
.case-lightbox-body h2{font-size:clamp(22px,2.8vw,30px); margin-bottom:20px; line-height:1.25;}
.case-lightbox-body p{font-size:15px; color:var(--midnight-navy); line-height:1.65; margin-bottom:16px;}
.case-lightbox-body h3{font-size:17px; margin:28px 0 10px;}
@media (max-width:700px){ .case-lightbox-media{height:180px;} .case-lightbox-body{padding:28px 24px 32px;} }

.case-stats-row{display:grid; grid-template-columns:repeat(auto-fit,minmax(120px,1fr)); gap:12px; margin-bottom:24px;}
.case-stat-tile{border:1px solid rgba(15,15,15,0.1); border-radius:14px; padding:16px 14px; text-align:center;}
.case-stat-value{display:block; font-family:var(--font-display); font-size:22px; font-weight:800; color:var(--midnight-navy); margin-bottom:4px;}
.case-stat-label{display:block; font-size:11px; color:rgba(15,15,15,0.55); line-height:1.3;}

.case-facts-box{border:1px solid rgba(15,15,15,0.1); border-radius:16px; padding:20px 22px; margin-bottom:28px; background:rgba(15,41,66,0.03);}
.case-facts-label{display:block; font-family:var(--font-accent); font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:0.05em; color:var(--midnight-navy); margin-bottom:10px;}
.case-facts-box ul{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:8px;}
.case-facts-box li{font-size:14px; color:var(--midnight-navy); padding-left:20px; position:relative;}
.case-facts-box li::before{content:'✓'; position:absolute; left:0; color:var(--signalgelb); font-weight:700;}

.case-callout{border-left:3px solid var(--signalgelb); background:rgba(255,164,32,0.06); border-radius:0 12px 12px 0; padding:16px 20px; margin:20px 0;}
.case-callout-label{display:block; font-family:var(--font-accent); font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:0.05em; color:var(--midnight-navy); margin-bottom:6px;}
.case-callout p{margin:0; font-size:14px; line-height:1.55;}

/* ---------- KONTAKT PAGE ---------- */
.kontakt-outer-card{background:none; padding:0; margin:0;}
.kontakt-grid{display:grid; grid-template-columns:1.1fr 0.9fr; gap:56px; align-items:center; position:relative;}
@media (max-width:900px){ .kontakt-grid{grid-template-columns:1fr;} }
.kontakt-arrow-connector{position:absolute; left:44%; bottom:16px; width:160px; height:100px; color:var(--signalgelb); pointer-events:none; transform:translateX(-50%); z-index:3;}
@media (max-width:900px){ .kontakt-arrow-connector{display:none;} }
.contact-left{padding-top:8px;}
.kontakt-map{border-radius:20px; min-height:220px; background:var(--midnight-navy); color:var(--orchid-white); display:flex; align-items:center; justify-content:center; font-family:var(--font-display); font-size:14px; margin-bottom:24px;}
.kontakt-partner-list{display:flex; flex-direction:column; gap:16px;}

.kontakt-support-card{
  background:var(--midnight-navy); color:var(--orchid-white); border-radius:20px; padding:44px 40px;
}
.kontakt-support-card h3{font-size:clamp(24px,2.8vw,32px); margin:14px 0 12px; color:var(--orchid-white);}
.kontakt-support-card p{font-size:14px; line-height:1.6; color:rgba(255,252,242,0.65); font-weight:400; max-width:360px;}
.kontakt-support-rows{display:flex; flex-direction:column; gap:16px; margin-top:28px;}
.kontakt-support-row{
  display:flex; align-items:center; gap:14px; text-decoration:none; color:var(--neverything);
}
.kontakt-support-row .thumb{width:36px; height:36px; flex-shrink:0; background:rgba(15,15,15,0.05); border-radius:10px; padding:6px;}
.kontakt-support-row .thumb i.on{background:var(--signalgelb);}
.kontakt-support-row span{font-family:var(--font-headline); font-weight:700; font-size:16px;}
.kontakt-support-row:hover span{text-decoration:underline;}
.kontakt-support-address{
  margin-top:32px; padding-top:20px; border-top:1px solid rgba(15,15,15,0.12);
  font-size:13px; color:var(--midnight-navy); opacity:0.7;
}

/* ---------- BEDARFS-FINDER ---------- */
.finder{background:var(--neverything); border-radius:28px; padding:56px; max-width:var(--max-w); margin:0 auto; box-sizing:border-box;}
@media (max-width:1304px){ .finder{margin:0 32px; max-width:none;} }
@media (max-width:700px){ .finder{margin:0 16px; padding:36px 24px;} }
.finder .eyebrow{color:var(--signalgelb);}
.finder .eyebrow::before{display:none;}
.finder h2{font-size:clamp(24px,3.2vw,32px); margin:14px 0 36px; max-width:600px; color:var(--orchid-white);}
.finder-options{display:grid; grid-template-columns:repeat(3,1fr); gap:18px;}
@media (max-width:800px){ .finder-options{grid-template-columns:1fr;} }
.finder-opt{
  text-align:left; background:rgba(255,252,242,0.06); color:var(--orchid-white);
  border:1.5px solid rgba(255,252,242,0.12); border-radius:16px;
  padding:26px 24px; cursor:pointer; font-family:var(--font-body);
  transition:background .2s ease, border-color .2s ease, transform .2s ease;
}
.finder-opt:hover{background:rgba(255,252,242,0.1); border-color:rgba(255,252,242,0.25); transform:translateY(-2px);}
.finder-opt.active{background:var(--signalgelb); border-color:var(--signalgelb); color:var(--neverything);}
.finder-thumb{width:32px; height:32px; padding:0; border-radius:0; background:transparent; margin-bottom:18px; transition:none;}
.finder-thumb i.on{background:var(--signalgelb);}
.finder-opt.active .finder-thumb i.on{background:var(--neverything);}
.finder-opt .q{font-family:var(--font-accent); font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:0.04em; opacity:0.55; margin-bottom:8px; display:block;}
.finder-opt .a{font-size:17px; font-weight:700; line-height:1.35; display:block;}
.finder-result{
  margin-top:28px; max-height:0; overflow:hidden; transition:max-height .35s ease;
  background:rgba(255,252,242,0.06); border:1.5px solid rgba(255,252,242,0.12); color:var(--orchid-white); border-radius:16px;
}
.finder-result.open{max-height:220px;}
.finder-result-inner{padding:26px 28px; display:flex; justify-content:space-between; align-items:center; gap:20px; flex-wrap:wrap;}
.finder-result p{font-size:15px; line-height:1.5; color:rgba(255,252,242,0.75); max-width:520px;}

/* ---------- JOURNEY TIMELINE ---------- */
.journey{position:relative;}
.journey-track{display:flex; gap:0; position:relative; margin-top:56px;}
.journey-line{
  position:absolute; top:22px; left:0; right:0; height:2px; background:rgba(15,15,15,0.12); z-index:0;
  transform-origin:left center; transform:scaleX(0); transition:transform 1.1s cubic-bezier(.25,.7,.3,1);
}
.journey-track.in-view .journey-line{transform:scaleX(1);}
.journey-step{
  flex:1; position:relative; z-index:1; padding-right:24px;
  opacity:0; transform:translateX(-24px); transition:opacity .6s ease, transform .6s ease;
}
.journey-step:last-child{padding-right:0;}
.journey-track.in-view .journey-step{opacity:1; transform:translateX(0);}
.journey-track.in-view .journey-step:nth-child(2){transition-delay:.15s;}
.journey-track.in-view .journey-step:nth-child(3){transition-delay:.3s;}
.journey-track.in-view .journey-step:nth-child(4){transition-delay:.45s;}
.journey-track.in-view .journey-step:nth-child(5){transition-delay:.6s;}
.journey-dot{width:44px; height:44px; border-radius:50%; background:var(--neverything); color:var(--signalgelb); display:flex; align-items:center; justify-content:center; font-family:var(--font-headline); font-weight:800; margin-bottom:20px;}
.journey-step:last-child .journey-dot{background:var(--signalgelb); color:var(--neverything);}
.journey-step h4{font-size:16px; margin-bottom:8px;}
.journey-step p{font-size:13px; color:var(--midnight-navy); font-weight:400;}
@media (max-width:900px){
  .journey-track{flex-direction:column; gap:32px;}
  .journey-line{display:none;}
  .journey-step{transform:translateY(16px);}
  .journey-track.in-view .journey-step{transform:translateY(0);}
}

/* ---------- JOB-DETAILSEITE (eigenständig, personalisiert) ---------- */
.job-hero{background:var(--orchid-white); color:var(--neverything); padding:88px 0 64px; border-bottom:1px solid rgba(15,15,15,0.08);}
.job-hero.job-hero-viewport{
  min-height:calc(100vh - 88px); display:flex; align-items:center; box-sizing:border-box;
  padding-top:0; padding-bottom:0; position:relative;
}
.job-hero.job-hero-viewport .wrap{width:100%;}
@media (max-width:700px){ .job-hero.job-hero-viewport{min-height:0; padding:120px 0 40px;} }
.job-scroll-hint{
  position:absolute; left:max(32px, calc(50% - var(--max-w)/2 + 32px)); bottom:40px;
  display:flex; align-items:center; gap:8px; cursor:pointer;
  font-family:var(--font-accent); font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:0.08em;
  color:rgba(15,15,15,0.4); animation:jobScrollHintDrift 1.8s ease-in-out infinite;
}
.job-scroll-hint::after{content:'↓';}
@keyframes jobScrollHintDrift{
  0%, 100%{transform:translateY(0);}
  50%{transform:translateY(4px);}
}
@media (max-width:700px){ .job-scroll-hint{display:none;} }
.job-hero-title-row{position:relative; display:block; width:fit-content; max-width:min(100%, 620px); margin:12px 0 20px;}
.job-hero-title-row h1{margin:0;}
.jhs-wrap{
  position:absolute; top:-8px; right:-26px;
  display:inline-flex; align-items:center; justify-content:center; width:52px; height:52px;
  flex-shrink:0; transform:rotate(-8deg); transition:transform .3s cubic-bezier(.34,1.56,.64,1);
  filter:drop-shadow(1px 2px 2px rgba(15,15,15,0.12)); cursor:default;
}
.jhs-emoji{
  font-size:40px; line-height:1;
  text-shadow:
    -3px -3px 0 #fff, 3px -3px 0 #fff, -3px 3px 0 #fff, 3px 3px 0 #fff,
    -3px 0 0 #fff, 3px 0 0 #fff, 0 -3px 0 #fff, 0 3px 0 #fff;
}
.job-hero-title-row:hover .jhs-wrap{transform:rotate(6deg) scale(1.12) translateY(-5px);}
@media (max-width:600px){ .jhs-wrap{right:-8px; top:-30px;} }
.job-hero-bg-icon{
  position:absolute; top:50%; right:max(40px, calc(50% - var(--max-w)/2 + 120px)); transform:translateY(-50%);
  width:380px; height:380px; color:rgba(15,15,15,0.05); pointer-events:none; z-index:0;
}
.job-hero-bg-icon svg{width:100%; height:100%; display:block;}
.job-hero.job-hero-viewport .wrap{position:relative; z-index:1;}
@media (max-width:1100px){ .job-hero-bg-icon{display:none;} }
.job-hero-badge{
  position:absolute; top:40px; right:max(32px, calc(50% - var(--max-w)/2 + 32px));
  width:140px; height:140px; transform:rotate(-8deg);
  display:flex; align-items:center; justify-content:center;
}
.job-hero-badge svg{display:block; width:100%; height:100%;}
.job-hero-badge-text{
  position:absolute; text-align:center; font-family:var(--font-headline); font-weight:800;
  font-size:15px; line-height:1.3; color:var(--neverything); transform:rotate(3deg); white-space:nowrap;
}
@media (max-width:1000px){ .job-hero-badge{display:none;} }
.job-hero .breadcrumb{color:var(--midnight-navy);}
.job-hero h1{color:var(--neverything); font-size:clamp(32px,5vw,54px); margin:12px 0 20px; max-width:760px;}
.job-meta-row{display:flex; gap:32px; flex-wrap:wrap; margin-top:28px;}
.job-meta-item{font-size:13px; color:rgba(15,15,15,0.55); display:flex; align-items:center; gap:12px;}
.job-meta-item strong{display:block; color:var(--neverything); font-family:var(--font-headline); font-size:15px; margin-top:2px;}
.jmi-icon{
  width:46px; height:46px; flex-shrink:0; box-sizing:border-box; padding:11px; border-radius:12px;
  background:var(--signalgelb); color:var(--neverything);
}
.jmi-icon svg{width:100%; height:100%; display:block;}

.job-body-section{padding-bottom:32px;}
.job-body{display:grid; grid-template-columns:1.6fr 1fr; gap:64px; align-items:start;}
@media (max-width:900px){ .job-body{grid-template-columns:1fr;} }
.job-main h2{font-size:22px; margin:40px 0 16px;}
.job-main h2:first-child{margin-top:0;}
.job-main p{font-size:15px; color:var(--midnight-navy); margin-bottom:12px; max-width:620px;}
.job-main ul{margin:0 0 12px 0; padding-left:0; list-style:none; max-width:620px;}
.job-main ul li{font-size:15px; color:var(--neverything); padding:8px 0 8px 26px; position:relative;}
.job-main ul li::before{
  content:''; position:absolute; left:4px; top:15px;
  width:8px; height:8px; background:var(--signalgelb); transform:rotate(45deg);
}

.job-benefits-grid{display:flex; flex-direction:column; margin:20px 0 8px; max-width:620px;}
.job-benefit-box{border-top:1px solid rgba(15,15,15,0.12);}
.job-benefit-box:last-child{border-bottom:1px solid rgba(15,15,15,0.12);}
.job-benefit-row{
  display:flex; align-items:center; gap:16px; width:100%; background:none; border:none;
  padding:16px 2px; cursor:pointer; text-align:left; font-family:inherit; color:inherit;
}
.job-benefit-box .thumb{
  width:36px; height:36px; flex-shrink:0; padding:9px; border-radius:10px;
  background:rgba(15,15,15,0.05); transition:background .25s ease;
}
.job-benefit-box .thumb i.on{background:var(--neverything); transition:background .25s ease;}
.job-benefit-box.open .thumb{background:rgba(255,164,32,0.14);}
.job-benefit-box.open .thumb i.on{background:var(--signalgelb);}
.job-benefit-icon{
  width:36px; height:36px; flex-shrink:0; box-sizing:border-box; border-radius:10px;
  background:rgba(15,15,15,0.05); transition:background .25s ease;
  display:flex; align-items:center; justify-content:center;
}
.job-benefit-icon svg{width:18px; height:18px; color:var(--neverything); transition:color .25s ease;}
.job-benefit-box.open .job-benefit-icon{background:rgba(255,164,32,0.14);}
.job-benefit-box.open .job-benefit-icon svg{color:var(--signalgelb);}
.job-benefit-row h4{flex:1; font-size:15px; font-weight:700; margin:0; transition:color .2s ease;}
.job-benefit-box.open .job-benefit-row h4{color:var(--midnight-navy);}
.job-benefit-plus{
  width:26px; height:26px; border-radius:50%; border:1px solid rgba(15,15,15,0.2); flex-shrink:0;
  box-sizing:border-box; position:relative; font-size:0;
  transition:transform .25s ease, background .2s ease, border-color .2s ease, color .2s ease;
}
.job-benefit-plus::before{
  content:"+"; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  font-size:15px; line-height:1;
}
.job-benefit-box.open .job-benefit-plus{
  background:var(--signalgelb); border-color:var(--signalgelb); color:var(--neverything); transform:rotate(45deg);
}
.job-benefit-box.open .job-benefit-plus::before{color:var(--neverything);}
.job-benefit-panel{max-height:0; overflow:hidden; opacity:0; transition:max-height .3s ease, opacity .25s ease;}
.job-benefit-box.open .job-benefit-panel{max-height:100px; opacity:1;}
.job-benefit-panel p{font-size:13px; color:var(--midnight-navy); margin:0; padding:0 2px 18px 52px; line-height:1.5;}

.job-testimonial{
  background:var(--midnight-navy); color:var(--orchid-white); border-radius:20px; padding:32px 28px;
  margin:32px 0; max-width:620px;
}
.job-testimonial-reveal{position:relative; overflow:visible;}
.job-testimonial-head{display:flex; align-items:center; justify-content:space-between; gap:12px; cursor:pointer;}
.job-testimonial-chev{
  width:22px; height:22px; opacity:0.7; transition:transform .35s ease; flex-shrink:0;
  display:inline-block;
}
.job-testimonial-chev img{width:100%; height:100%; display:block; filter:invert(1) brightness(1.4);}
.job-testimonial-reveal.revealed .job-testimonial-chev{transform:rotate(180deg);}
.job-testimonial-content{
  max-height:0; opacity:0; overflow:hidden;
  transition:max-height .5s cubic-bezier(.22,1,.36,1), opacity .35s ease .05s;
}
.job-testimonial-reveal.revealed .job-testimonial-content{max-height:220px; opacity:1; padding-top:16px;}
.testi-cursor{
  position:absolute; right:-60%; left:auto; top:15%; display:flex; align-items:center; gap:6px;
  opacity:0; z-index:5; pointer-events:none;
  transition:right 1.7s cubic-bezier(.22,1,.36,1), top 1.7s cubic-bezier(.22,1,.36,1), opacity .3s ease;
}
.job-testimonial-reveal.in-view .testi-cursor{opacity:1; right:45%; top:78%;}
.job-testimonial-reveal.wander .testi-cursor{right:14px; top:26px;}
.job-testimonial-reveal.clicked .testi-cursor{opacity:0; transition:opacity .25s ease;}
.cursor-icon{width:18px; height:18px; flex-shrink:0; color:var(--signalgelb); display:block;}
.cursor-icon svg{width:100%; height:100%; display:block;}
.cursor-tag{
  background:var(--signalgelb); color:var(--neverything); font-size:11px; font-weight:700;
  padding:4px 9px; border-radius:6px; white-space:nowrap; font-family:var(--font-headline);
}
.job-testimonial p{color:rgba(255,252,242,0.88); font-size:15px; font-style:italic; margin-bottom:16px;}
.job-testimonial .who{display:flex; align-items:center; gap:12px;}
.job-testimonial .avatar{width:40px; height:40px; border-radius:50%; background:var(--signalgelb); color:var(--neverything); display:flex; align-items:center; justify-content:center; font-family:var(--font-headline); font-weight:800; font-size:13px;}
.job-testimonial .name{font-weight:700; font-size:14px;}
.job-testimonial .role{font-size:12px; color:rgba(255,252,242,0.6);}
.job-testimonial-like{
  position:absolute; right:28px; bottom:-15px; display:inline-flex; align-items:center; gap:7px;
  background:var(--orchid-white); color:var(--neverything); border-radius:20px; padding:6px 14px;
  box-shadow:0 4px 14px rgba(0,0,0,0.18); cursor:pointer; user-select:none; z-index:6;
  opacity:0; transform:scale(0.7) translateY(6px); pointer-events:none;
  transition:opacity .3s ease .1s, transform .3s ease .1s, background .2s ease;
}
.job-testimonial-reveal.revealed .job-testimonial-like{opacity:1; transform:scale(1) translateY(0); pointer-events:auto;}
.job-testimonial-like:hover{background:var(--signalgelb);}
.job-testimonial-like .jtl-emoji{font-size:15px; line-height:1;}
.job-testimonial-like .jtl-count{font-family:var(--font-headline); font-weight:700; font-size:13px;}
.job-testimonial-like.bump .jtl-emoji{animation:jtlBump .3s ease;}
@keyframes jtlBump{0%{transform:scale(1);} 50%{transform:scale(1.4);} 100%{transform:scale(1);}}

.job-apply{
  position:sticky; top:24px; background:var(--orchid-white); border:1px solid rgba(15,15,15,0.1);
  border-radius:20px; padding:28px; margin-top:-28px;
}
.job-apply h3{font-size:18px; margin-bottom:6px;}
.job-apply p.hint{font-size:13px; color:rgba(15,15,15,0.55); margin-bottom:20px;}
.job-apply .proto-form{gap:12px;}
.job-apply .proto-form input, .job-apply .proto-form textarea{
  font-size:14px; background:rgba(15,15,15,0.04); border:1px solid rgba(15,15,15,0.15); color:var(--neverything);
}
.job-apply .proto-form input::placeholder, .job-apply .proto-form textarea::placeholder{color:rgba(15,15,15,0.4);}
.job-apply .upload-box{
  border:1px dashed rgba(15,15,15,0.25); border-radius:12px; padding:16px; text-align:center;
  font-size:13px; color:rgba(15,15,15,0.5); cursor:pointer;
}
.job-apply-choice{
  background:rgba(15,15,15,0.03); border:1px solid rgba(15,15,15,0.1); border-radius:12px; padding:14px;
}
.job-apply-choice-label{display:block; font-size:12.5px; color:rgba(15,15,15,0.6); line-height:1.5; margin-bottom:10px;}
.job-apply-choice-options{display:flex; gap:8px; flex-wrap:wrap;}
.job-apply-choice-option{
  display:flex; align-items:center; gap:6px; border:1px solid rgba(15,15,15,0.15); border-radius:999px;
  padding:8px 14px; font-size:13px; font-weight:600; color:var(--neverything); cursor:pointer;
  transition:background .2s ease, border-color .2s ease;
}
.job-apply-choice-option input{margin:0; accent-color:var(--signalgelb);}
.job-apply-choice-option:has(input:checked){background:var(--signalgelb); border-color:var(--signalgelb);}

.site-footer{background:var(--dark-surface); color:var(--orchid-white); padding:80px 0 0;}
.footer-main{display:grid; grid-template-columns:1fr 2fr; gap:60px; padding-bottom:64px; border-bottom:1px solid rgba(255,252,242,0.1);}
@media (max-width:800px){ .footer-main{grid-template-columns:1fr; gap:48px;} }
.footer-brand{display:flex; flex-direction:column; gap:24px;}
.footer-brand-info{display:flex; flex-direction:column; gap:10px; font-size:14px; color:rgba(255,252,242,0.65); line-height:1.5;}
.footer-brand-info a{color:rgba(255,252,242,0.85); width:fit-content; font-variant-numeric:tabular-nums;}
.footer-brand-info a:hover{color:var(--signalgelb);}
.footer-cols{display:grid; grid-template-columns:repeat(4,1fr); gap:32px;}
@media (max-width:600px){ .footer-cols{grid-template-columns:1fr 1fr;} }
.footer-col{display:flex; flex-direction:column; gap:4px;}
.footer-col-title{
  font-family:var(--font-accent); font-size:13px; font-weight:700; text-transform:uppercase;
  letter-spacing:0.05em; color:var(--signalgelb); margin-bottom:12px;
}
.footer-col a{
  font-size:14px; color:rgba(255,252,242,0.75); padding:6px 0; width:fit-content;
  font-variant-numeric:tabular-nums; transition:color .15s ease;
}
.footer-col a:hover{color:var(--signalgelb);}
.footer-bottom{
  display:grid; grid-template-columns:1fr 2fr; gap:60px; align-items:center;
  padding:20px 0 32px;
}
@media (max-width:800px){ .footer-bottom{grid-template-columns:1fr; gap:16px; text-align:center;} }
.footer-copyright{
  font-family:'Courier New', monospace; font-size:13px; color:rgba(255,252,242,0.35);
}
.footer-social{display:flex; align-items:center; justify-content:flex-end; gap:8px; margin-right:-7px;}
@media (max-width:800px){ .footer-social{justify-content:center; margin-right:0;} }
.footer-social a{
  width:30px; height:30px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  color:rgba(255,252,242,0.6); transition:color .15s ease, background .15s ease;
}
.footer-social a:hover{color:var(--neverything); background:var(--signalgelb);}
.footer-social svg{width:15px; height:15px;}
.scroll-up{
  position:fixed; bottom:28px; right:28px; width:48px; height:48px; border-radius:50%;
  background:var(--neverything); color:var(--orchid-white); display:flex; align-items:center; justify-content:center;
  cursor:pointer; font-size:18px; opacity:0; pointer-events:none; transition:opacity .2s ease; z-index:200;
}
.scroll-up.visible{opacity:1; pointer-events:auto;}

.proto-note{
  font-family:var(--font-body); font-size:11px; color:rgba(15,15,15,0.4);
  text-align:center; padding:8px 0; background:rgba(255,164,32,0.08);
}

/* Leistungen Scrollytelling Section */
.lst-scroll-section{
  position:relative; height:calc(var(--lst-count) * 100vh);
}
.lst-sticky{
  position:sticky; top:0; height:100vh; overflow:hidden;
  display:flex; align-items:center; justify-content:center;
  background:var(--orchid-white);
}
.lst-wrap{
  max-width:var(--max-w); width:100%; margin:0 auto; padding:0 32px; box-sizing:border-box;
  display:grid; grid-template-columns:280px 1fr 320px; gap:60px; align-items:center;
}
.lst-left .eyebrow::before{display:none;}
.lst-left .lst-list{list-style:none; display:flex; flex-direction:column; gap:16px;}
.lst-item{
  display:flex; align-items:center; gap:10px;
  font-family:var(--font-headline); font-weight:600; font-size:19px;
  color:rgba(15,15,15,0.32); transition:color .3s ease;
}
.lst-arrow-mini{
  position:relative; width:18px; height:14px; flex-shrink:0;
  opacity:0; color:var(--signalgelb); transform:translateX(-4px);
  transition:opacity .2s ease, transform .2s ease;
}
.lst-arrow-frame-sm{position:absolute; inset:0; opacity:0; animation:lstArrowFlip 0.9s steps(1) infinite;}
.lst-arrow-frame-sm:nth-child(1){animation-delay:0s;}
.lst-arrow-frame-sm:nth-child(2){animation-delay:0.225s;}
.lst-arrow-frame-sm:nth-child(3){animation-delay:0.45s;}
.lst-arrow-frame-sm:nth-child(4){animation-delay:0.675s;}
.lst-item.active{color:var(--neverything); font-weight:800;}
.lst-item.active .lst-arrow-mini{opacity:1; transform:translateX(0);}

.lst-mid{text-align:center;}
.lst-num{
  font-family:'Stack Sans Notch', var(--font-display), sans-serif; font-weight:800; font-size:clamp(72px,9vw,150px);
  line-height:0.95; color:var(--neverything);
}
.lst-claim{
  font-family:var(--font-headline); font-weight:700; font-size:clamp(24px,2.8vw,40px);
  color:var(--neverything); margin-top:6px;
}

.lst-right .lst-what{
  font-family:'Courier New', monospace; font-size:11px; letter-spacing:0.05em;
  text-transform:uppercase; color:rgba(15,15,15,0.45); line-height:1.6; display:block; margin-bottom:20px;
}
.lst-right p{font-size:15px; line-height:1.6; color:rgba(15,15,15,0.7); margin-bottom:24px;}

.lst-arrow-indicator{
  position:absolute; left:50%; bottom:96px; transform:translateX(-50%);
  width:26px; height:34px; color:rgba(15,15,15,0.4);
  animation:lstArrowBounce 1.6s ease-in-out infinite;
}
@keyframes lstArrowBounce{
  0%, 100%{transform:translateX(-50%) translateY(0);}
  50%{transform:translateX(-50%) translateY(8px);}
}
.lst-arrow-frame{
  position:absolute; inset:0; opacity:0;
  animation:lstArrowFlip 0.9s steps(1) infinite;
}
.lst-arrow-frame:nth-child(1){animation-delay:0s;}
.lst-arrow-frame:nth-child(2){animation-delay:0.225s;}
.lst-arrow-frame:nth-child(3){animation-delay:0.45s;}
.lst-arrow-frame:nth-child(4){animation-delay:0.675s;}
@keyframes lstArrowFlip{
  0%{opacity:1;}
  24.9%{opacity:1;}
  25%{opacity:0;}
  100%{opacity:0;}
}
.lst-progress{
  position:absolute; right:max(32px, calc(50% - var(--max-w)/2 + 32px)); bottom:40px;
  font-family:'Courier New', monospace; font-size:12px; letter-spacing:0.05em;
  color:rgba(15,15,15,0.5);
}
.lst-skip{
  position:absolute; left:max(32px, calc(50% - var(--max-w)/2 + 32px)); bottom:40px;
  background:transparent; border:none; cursor:pointer;
  font-family:'Courier New', monospace; font-size:12px; letter-spacing:0.05em; text-transform:uppercase;
  color:rgba(15,15,15,0.5); display:flex; align-items:center; gap:6px; transition:color .15s ease;
}
.lst-skip:hover{color:var(--neverything);}
.lst-skip span{transition:transform .15s ease;}
.lst-skip:hover span{transform:translateY(2px);}

@media (max-width:960px){
  .lst-scroll-section{height:auto;}
  .lst-sticky{position:relative; height:auto; padding:80px 0 120px;}
  .lst-wrap{grid-template-columns:1fr; gap:32px; text-align:center;}
  .lst-left .lst-list{align-items:center;}
  .lst-arrow-indicator{display:none;}
}

.page-frame{
  position:fixed; inset:0; z-index:150; pointer-events:none;
  overflow:hidden;
  opacity:0; transition:opacity .3s ease;
}
.page-frame::before{
  content:''; position:absolute; inset:14px;
  border-radius:15px;
  box-shadow:0 0 0 9999px var(--signalgelb);
}
body.lst-framed .page-frame{opacity:1;}

/* ---------- SEITEN-ÜBERGANG (Ein-/Austauchen KI-Seite) ---------- */
.page-exit-overlay{
  position:fixed; inset:0; z-index:9999; background:var(--orchid-white);
  opacity:0; transition:opacity 0.5s ease-out; pointer-events:none;
}
.page-exit-overlay.active{opacity:1;}

.ki-boot{
  position:fixed; inset:0; z-index:9998; background:var(--neverything);
  opacity:1; transition:opacity 0.6s ease;
}
.ki-boot.done{opacity:0; pointer-events:none;}

/* ---------- KI & AUTOMATISIERUNG (dunkles, immersives Theme) ---------- */
body.ki-page{background:var(--neverything); color:var(--orchid-white); overflow-x:hidden;}
body.ki-page a{color:inherit;}
body.ki-page section{padding:96px 0;}
body.ki-page h1, body.ki-page h2, body.ki-page h3, body.ki-page h4, body.ki-page h5{color:var(--orchid-white);}
body.ki-page .breadcrumb{color:rgba(255,252,242,0.5); background:rgba(255,252,242,0.08);}
body.ki-page .subline{color:rgba(255,252,242,0.7);}
body.ki-page p, body.ki-page li{color:rgba(255,252,242,0.7);}
body.ki-page .eyebrow{color:var(--signalgelb);}
body.ki-page .eyebrow::before{background:var(--signalgelb);}
body.ki-page .kernpunkte li{border-bottom-color:rgba(255,252,242,0.12); color:rgba(255,252,242,0.75);}
body.ki-page .detail-list .item{border-color:rgba(255,252,242,0.14);}
body.ki-page .detail-list .item h5{color:var(--orchid-white);}
body.ki-page .detail-list .item p{color:rgba(255,252,242,0.65);}
body.ki-page .faq{border-top:none;}
body.ki-page .faq-item{border-bottom-color:rgba(255,252,242,0.14);}
body.ki-page .faq-q{color:var(--orchid-white);}
body.ki-page .faq-a{color:rgba(255,252,242,0.65);}
body.ki-page .ansprechpartner{background:rgba(255,252,242,0.04); border-color:rgba(255,252,242,0.12);}
body.ki-page .ansprechpartner .name{color:var(--orchid-white);}
body.ki-page .ansprechpartner .role, body.ki-page .ansprechpartner .phone{color:rgba(255,252,242,0.65);}
body.ki-page .ansprechpartner .avatar{background:var(--signalgelb); color:var(--neverything);}
body.ki-page .btn-ghost{border-color:var(--orchid-white); color:var(--orchid-white);}
body.ki-page .btn-ghost:hover{background:var(--signalgelb); border-color:var(--signalgelb); color:var(--neverything);}

body.ki-page .mega-dropdown{
  background:var(--neverything); border-color:rgba(255,252,242,0.12);
  box-shadow:0 30px 70px rgba(0,0,0,0.5);
}
body.ki-page .mega-row{color:var(--orchid-white); border-bottom-color:rgba(255,252,242,0.1);}
body.ki-page .mega-row:hover{background:rgba(255,164,32,0.16);}
body.ki-page .mega-row .thumb{background:rgba(255,252,242,0.08);}
body.ki-page .mega-row.rebounce .thumb{background:rgba(45,216,176,0.16);}
body.ki-page .mega-row.otc .thumb{background:rgba(139,92,246,0.2);}
body.ki-page .mega-row.shoppingplus .thumb{background:rgba(139,92,246,0.2);}
body.ki-page .mega-row.affiliate .thumb{background:rgba(139,92,246,0.2);}
body.ki-page .mega-badges-label{color:rgba(255,252,242,0.4);}
body.ki-page .mega-badge{background:rgba(255,252,242,0.08); color:rgba(255,252,242,0.75);}
body.ki-page .nav-info .tag{color:var(--orchid-white) !important;}
body.ki-page .nav-info .tag .home-icon{color:var(--orchid-white) !important;}
body.ki-page .nav-info .claim{color:rgba(255,252,242,0.55) !important;}
body.ki-page .nav-link{color:var(--orchid-white);}
body.ki-page .nav-center-pill{background:rgba(255,252,242,0.08); border-color:rgba(255,252,242,0.12);}
body.ki-page .menu-toggle{background:rgba(255,252,242,0.08); border-color:rgba(255,252,242,0.16); color:var(--orchid-white);}

.ki-sidenav{position:fixed; right:32px; top:50%; transform:translateY(-50%); z-index:250; display:flex; flex-direction:column; align-items:flex-end; gap:16px;}
.ki-sidenav-item{display:flex; align-items:center; gap:10px; cursor:pointer;}
.ki-sidenav-label{font-family:var(--font-body); font-size:11px; font-weight:300; text-transform:uppercase; letter-spacing:0.06em; color:rgba(255,252,242,0.35); white-space:nowrap; opacity:0; transform:translateX(6px); transition:opacity .2s ease, transform .2s ease, color .2s ease;}
.ki-sidenav-item:hover .ki-sidenav-label{opacity:1; transform:translateX(0);}
.ki-sidenav-dot{width:6px; height:6px; border-radius:50%; background:rgba(255,252,242,0.3); transition:background .2s ease, transform .2s ease; flex-shrink:0;}
.ki-sidenav-item.active .ki-sidenav-dot{background:var(--signalgelb); transform:scale(1.6);}
.ki-sidenav-item.active .ki-sidenav-label{opacity:1; transform:translateX(0); color:var(--orchid-white);}
@media (max-width:900px){ .ki-sidenav{display:none;} }

/* --- Generische Sidenav für Leistungsseiten mit hellem Hintergrund (SEA, Social, Programmatic, Websites, Regional, Performance Marketing) --- */
.side-nav{position:fixed; right:32px; top:50%; transform:translateY(-50%); z-index:250; display:flex; flex-direction:column; align-items:flex-end; gap:16px;}
.side-nav-item{display:flex; align-items:center; gap:10px; cursor:pointer;}
.side-nav-label{font-family:var(--font-body); font-size:11px; font-weight:400; text-transform:uppercase; letter-spacing:0.06em; color:rgba(15,15,15,0.35); white-space:nowrap; opacity:0; transform:translateX(6px); transition:opacity .2s ease, transform .2s ease, color .2s ease;}
.side-nav-item:hover .side-nav-label{opacity:1; transform:translateX(0);}
.side-nav-dot{width:6px; height:6px; border-radius:50%; background:rgba(15,15,15,0.18); transition:background .2s ease, transform .2s ease; flex-shrink:0;}
.side-nav-item.active .side-nav-dot{background:var(--signalgelb); transform:scale(1.6);}
.side-nav-item.active .side-nav-label{opacity:1; transform:translateX(0); color:var(--neverything);}
@media (max-width:1100px){ .side-nav{display:none;} }

.ki-hero{
  position:relative; min-height:100vh; margin-top:-88px;
  display:flex; align-items:center; padding:140px 0 100px;
}
.ki-hero-scroll{z-index:2; color:rgba(255,252,242,0.55);}
.ki-hero-orbs{position:absolute; inset:0; z-index:0; pointer-events:none;}
.ki-orb{
  position:absolute; border-radius:50%; filter:blur(70px); opacity:0.45;
  animation:kiDrift 16s ease-in-out infinite;
}
.ki-orb-1{width:420px; height:420px; background:var(--purple-accent); top:-10%; left:-8%; animation-delay:0s;}
.ki-orb-2{width:560px; height:560px; background:var(--signalgelb); bottom:-38%; right:-8%; animation-delay:-6s;}
.ki-orb-3{width:260px; height:260px; background:var(--purple-accent); top:35%; right:20%; opacity:0.28; animation-delay:-11s;}
@keyframes kiDrift{
  0%, 100%{ transform:translate(0,0) scale(1); }
  50%{ transform:translate(30px,-24px) scale(1.08); }
}
.ki-hero-grid{
  position:absolute; inset:0; z-index:0; pointer-events:none; opacity:0.25;
  background-image:linear-gradient(rgba(255,252,242,0.06) 1px, transparent 1px), linear-gradient(90deg, rgba(255,252,242,0.06) 1px, transparent 1px);
  background-size:64px 64px;
  mask-image:radial-gradient(ellipse 70% 70% at 50% 40%, black 40%, transparent 80%);
}
.ki-hero .wrap{position:relative; z-index:1; width:100%;}
.ki-hero-content{opacity:0; transform:translateY(26px) scale(0.98); animation:kiMaterialize 0.9s cubic-bezier(.2,.8,.2,1) forwards; animation-delay:0.35s;}
@keyframes kiMaterialize{ to{ opacity:1; transform:translateY(0) scale(1); } }
.ki-hero h1{font-size:clamp(38px,6vw,68px); margin:16px 0 16px;}
.ki-hero-outline-title{font-size:clamp(44px,7.2vw,86px) !important; line-height:1.05;}
.ki-outline-word{color:transparent; -webkit-text-stroke:1.5px var(--orchid-white); text-stroke:1.5px var(--orchid-white);}
.ki-hero .subline{font-size:19px; max-width:600px;}
@media (max-width:700px){
  .ki-hero{min-height:70vh; padding:120px 0 72px;}
  .ki-orb{filter:blur(50px);}
}

.ki-block-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-top:40px;}
@media (max-width:900px){ .ki-block-grid{grid-template-columns:1fr;} }

.ki-approach{padding:120px 0 !important; position:relative;}
.ki-approach-grid{position:relative; z-index:1;}
.ki-approach-grid{display:grid; grid-template-columns:0.85fr 1.15fr; gap:80px; align-items:start;}
.ki-approach-sticky{position:sticky; top:120px; align-self:start;}
.ki-mascot{position:relative; width:160px; height:160px; margin-top:-16px; margin-bottom:28px; cursor:pointer;}
.ki-mascot-bubble{
  position:absolute; left:calc(100% + 14px); top:-6px; z-index:5; max-width:220px;
  background:var(--orchid-white); color:var(--neverything); font-size:13px; line-height:1.4; font-weight:500;
  padding:12px 14px; border-radius:4px 14px 14px 14px; box-shadow:0 12px 30px rgba(0,0,0,0.35);
  opacity:0; transform:translateY(6px) scale(0.96); pointer-events:none;
  transition:opacity .2s ease, transform .2s ease;
}
.ki-mascot-bubble.visible{opacity:1; transform:translateY(0) scale(1);}
@media (max-width:1100px){ .ki-mascot-bubble{left:0; top:calc(100% + 10px);} }
.ki-mascot-hint{
  position:absolute; left:78%; top:6%; z-index:6; white-space:nowrap;
  background:var(--signalgelb); color:var(--neverything); font-family:var(--font-accent);
  font-size:12px; font-weight:700; letter-spacing:0.01em;
  padding:7px 14px; border-radius:999px; box-shadow:0 10px 24px rgba(255,164,32,0.35);
  opacity:0; transform:translate(0,4px) scale(0.9); pointer-events:none;
  transition:opacity .3s ease, transform .3s ease;
  animation:kiHintBob 1.6s ease-in-out infinite;
}
.ki-mascot-hint.visible{opacity:1; transform:translate(0,0) scale(1); pointer-events:auto;}
.ki-mascot-hint::after{
  content:''; position:absolute; left:16px; bottom:-5px; width:10px; height:10px;
  background:var(--signalgelb); transform:rotate(45deg); border-radius:2px;
}
@keyframes kiHintBob{
  0%, 100%{ transform:translate(0,0) scale(1); }
  50%{ transform:translate(0,-5px) scale(1); }
}
.ki-mascot-hint.visible{ animation:kiHintPop .3s ease, kiHintBob 1.6s ease-in-out .3s infinite; }
@keyframes kiHintPop{
  0%{ opacity:0; transform:translate(0,4px) scale(0.9); }
  60%{ opacity:1; transform:translate(0,-3px) scale(1.05); }
  100%{ opacity:1; transform:translate(0,0) scale(1); }
}
@media (max-width:1100px){ .ki-mascot-hint{left:auto; right:-6px; top:-10px;} }
.ki-mascot-face{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:100px; height:100px; z-index:1;}
.ki-mascot-head{fill:rgba(255,252,242,0.06); stroke:var(--signalgelb); stroke-width:1.5; transition:stroke .5s ease;}
.ki-eye-white{fill:var(--orchid-white);}
.ki-eye-pupil{fill:var(--neverything); transition:transform .1s ease-out;}
.ki-mascot-particle{position:absolute; top:50%; left:50%; width:4px; height:4px; border-radius:50%; background:var(--signalgelb); transform:rotate(calc(var(--i) * 22.5deg)) translate(76px) rotate(calc(var(--i) * -22.5deg)); animation:kiParticlePulse 3s ease-in-out infinite; animation-delay:calc(var(--i) * 0.12s); transition:background .5s ease;}
@keyframes kiParticlePulse{
  0%, 100%{opacity:0.35; transform:rotate(calc(var(--i) * 22.5deg)) translate(76px) rotate(calc(var(--i) * -22.5deg)) scale(0.8);}
  50%{opacity:1; transform:rotate(calc(var(--i) * 22.5deg)) translate(76px) rotate(calc(var(--i) * -22.5deg)) scale(1.2);}
}
.ki-mascot[data-active="1"] .ki-mascot-head{stroke:var(--purple-accent);}
.ki-mascot[data-active="1"] .ki-mascot-particle{background:var(--purple-accent);}
.ki-mascot[data-active="2"] .ki-mascot-head{stroke:var(--mint-accent);}
.ki-mascot[data-active="2"] .ki-mascot-particle{background:var(--mint-accent);}
.ki-mascot[data-active="3"] .ki-mascot-particle{animation-duration:5s;}
@media (max-width:900px){ .ki-mascot{display:none;} }

/* --- KUNO-Kopf (offizielles Artwork aus Brand Book), ersetzt altes Augen-folgen-Maskottchen --- */
.kuno-face-wrap{position:relative;}
.kuno-head-img{width:100%; height:100%; object-fit:contain; display:block; user-select:none; pointer-events:none;}
.kuno-eye-patch{position:absolute; background:rgb(13,35,60); border-radius:999px;}
.kuno-eye-bar{position:absolute; background:var(--signalgelb); border-radius:999px; transform-origin:center; animation:kunoBlink 4.6s ease-in-out infinite;}
#kuno-eye-right{animation-delay:0.02s;}
@keyframes kunoBlink{
  0%, 90%, 100%{transform:scaleY(1);}
  94%{transform:scaleY(0.1);}
  97%{transform:scaleY(1);}
}

.ki-approach-tabs{position:relative; display:flex; align-items:center; gap:22px; margin-top:36px; max-width:420px;}
.ki-approach-tab{
  font-family:var(--font-display); font-size:13px; font-weight:800; letter-spacing:0.04em;
  color:rgba(255,252,242,0.3); transition:color .3s ease; position:relative; z-index:1;
}
.ki-approach-tab.active{color:var(--signalgelb);}
.ki-approach-tabs-line{
  position:absolute; left:0; right:0; bottom:-14px; height:1px; background:rgba(255,252,242,0.14);
}
.ki-approach-tabs-fill{
  position:absolute; left:0; top:0; height:100%; width:0%;
  background:var(--signalgelb); transition:width .5s cubic-bezier(.4,0,.2,1);
}
@media (max-width:900px){ .ki-approach-tabs{display:none;} }
.ki-approach-sticky h2{font-size:clamp(28px,3.6vw,42px); margin:16px 0 16px; line-height:1.15;}
.ki-approach-sticky p{max-width:420px; font-size:15px; line-height:1.6;}
body.ki-page{scroll-snap-type:y proximity;}
.ki-approach-points{display:flex; flex-direction:column; gap:22vh; margin-top:170px;}
.ki-approach-point{
  opacity:0.25; transform:translateY(24px); transition:opacity .5s ease, transform .5s ease; max-width:520px;
  scroll-snap-align:start; scroll-snap-stop:always; scroll-margin-top:140px;
}
.ki-approach-point.in-view{opacity:1; transform:translateY(0);}
.ki-approach-num{display:block; font-family:var(--font-display); font-size:14px; font-weight:800; color:var(--signalgelb); margin-bottom:14px; letter-spacing:0.05em;}
.ki-approach-point h3{font-size:24px; margin-bottom:12px;}
.ki-approach-point p{font-size:15px; line-height:1.65;}
@media (max-width:900px){
  .ki-approach-grid{grid-template-columns:1fr; gap:40px;}
  .ki-approach-sticky{position:static;}
  .ki-approach-points{gap:60px;}
  .ki-approach-point{opacity:1; transform:none; scroll-snap-align:none; scroll-snap-stop:normal;}
}

.ki-block{
  background:rgba(255,252,242,0.04); border:1px solid rgba(255,252,242,0.1);
  border-radius:20px; padding:32px; display:flex; flex-direction:column;
  transition:border-color .2s ease, background .2s ease;
}
.ki-block:hover{background:rgba(255,252,242,0.06); border-color:rgba(255,252,242,0.2);}
.ki-block-icon{
  width:52px; height:52px; border-radius:14px; margin-bottom:20px;
  display:flex; align-items:center; justify-content:center;
}
.ki-block-icon .thumb{width:22px; height:22px;}
.ki-block-yellow .ki-block-icon{background:rgba(255,164,32,0.15);}
.ki-block-yellow .ki-block-icon .thumb i.on{background:var(--signalgelb);}
.ki-block-purple .ki-block-icon{background:rgba(139,92,246,0.18);}
.ki-block-purple .ki-block-icon .thumb i.on{background:var(--purple-accent);}
.ki-block h3{font-size:19px; margin-bottom:10px;}
.ki-block > p{font-size:14px; line-height:1.55; color:rgba(255,252,242,0.65); margin-bottom:20px;}
.ki-block ul{list-style:none; display:flex; flex-direction:column; gap:8px; margin-top:auto;}
.ki-block ul li{
  font-size:13px; color:rgba(255,252,242,0.6); padding-left:16px; position:relative;
}
.ki-block ul li::before{
  content:''; position:absolute; left:0; top:7px; width:6px; height:6px; border-radius:50%;
  background:var(--signalgelb);
}
.ki-block-purple ul li::before{background:var(--purple-accent);}

/* ---------- PRODUKT-HERO (nrg-Referenz: Orange-Wipe über Headline) ---------- */
.prod-hero{
  position:relative; height:calc(100vh - 88px); min-height:560px;
  border-bottom:1px solid rgba(15,15,15,0.08); overflow:hidden;
}
.prod-hero-top{position:absolute; top:210px; left:0; right:0;}
.prod-hero-headline-col{position:absolute; top:260px; left:0; right:0;}
.prod-hero-headline{
  font-family:var(--font-display); font-weight:800;
  font-size:clamp(38px,6.4vw,88px); line-height:0.98; letter-spacing:-0.01em;
  text-transform:uppercase;
}
.prod-hero-line{position:relative; display:block; overflow:hidden;}
.prod-hero-headline-base{display:block; color:var(--neverything);}
.prod-hero-headline-fill{
  position:absolute; top:0; left:0; display:block; color:var(--signalgelb);
  clip-path:inset(0 100% 0 0); pointer-events:none; will-change:clip-path;
}
.prod-hero-bottom-row{
  position:absolute; left:0; right:0; bottom:48px;
  display:flex; justify-content:space-between; align-items:flex-end; gap:40px; flex-wrap:wrap;
}
.prod-hero-sub{max-width:300px; font-size:15px; color:var(--midnight-navy); font-weight:400; text-align:right;}
.prod-hero-hint{
  display:inline-flex; align-items:center; gap:8px; font-family:var(--font-body); font-size:12px;
  color:rgba(15,15,15,0.4); text-transform:uppercase; letter-spacing:0.05em;
  animation:jobScrollHintDrift 1.8s ease-in-out infinite;
}
.prod-hero-hint::after{content:'↓'; font-family:var(--font-accent);}
@media (max-width:900px){
  .prod-hero{height:auto; min-height:100vh; padding-bottom:180px;}
  .prod-hero-bottom-row{flex-direction:column; align-items:flex-start; gap:16px; bottom:32px;}
  .prod-hero-sub{text-align:left; max-width:100%;}
}

/* ---------- OTC USER JOURNEY (sui.io-Referenz: wandernder Cursor auf gepunkteter Linie) ---------- */
.otc-journey-scroll{position:relative; height:420vh; background:var(--orchid-white); color:var(--neverything);}
.otc-journey-head{padding-top:96px;}
.otc-journey-title{font-size:clamp(30px,4.2vw,46px); margin:16px 0 12px; color:var(--neverything);}
.otc-journey-sub{font-size:15px; color:var(--midnight-navy); max-width:520px;}

.otc-journey-sticky{
  position:sticky; top:0; height:100vh; overflow:hidden;
  display:flex; align-items:center;
}
.otc-journey-inner{display:flex; align-items:center; gap:56px; width:100%;}
.otc-journey-line-wrap{position:relative; width:0; height:320px;}
.otc-journey-line{
  position:absolute; top:0; bottom:0; left:0;
  border-left:2px dotted rgba(15,15,15,0.25);
}
.otc-journey-cursor{
  position:absolute; left:-4px; top:0; width:9px; height:9px;
  background:var(--purple-accent); transition:top .1s linear;
}
.otc-journey-connector{
  position:relative; width:56px; height:1px; background:rgba(15,15,15,0.25); flex-shrink:0;
}
.otc-journey-cardzone{position:relative; width:min(480px,78vw); height:220px;}
.otc-journey-card{
  position:absolute; inset:0; opacity:0; pointer-events:none;
  transition:opacity .45s ease, transform .45s ease;
  transform:translateX(var(--enter-x, 36px));
  border:1px solid rgba(15,15,15,0.12); background:rgba(15,15,15,0.015);
}
.otc-journey-card.active{opacity:1; transform:translateX(0); pointer-events:auto;}
.otc-journey-card-top{
  position:relative; padding:16px 20px 16px 92px; min-height:24px;
  border-bottom:1px solid rgba(15,15,15,0.12);
  font-family:monospace; font-size:13px; letter-spacing:0.03em;
  display:flex; align-items:center;
}
.otc-journey-num{
  position:absolute; left:20px; top:50%; transform:translateY(-50%);
  color:var(--purple-accent); font-weight:700; font-size:26px; font-family:var(--font-display);
}
.otc-journey-cardtitle{text-transform:uppercase; color:var(--neverything);}
.otc-journey-card-bottom{display:flex; align-items:center; gap:20px; padding:24px 20px;}
.otc-journey-icon{
  width:52px; height:52px; flex-shrink:0; border:1px solid rgba(15,15,15,0.16);
  display:flex; align-items:center; justify-content:center;
  animation:otcPulse 2.6s ease-in-out infinite;
}
.otc-journey-icon .thumb{width:20px; height:20px;}
.otc-journey-icon .thumb i.on{background:var(--purple-accent);}
@keyframes otcPulse{
  0%, 100%{ transform:scale(1); opacity:0.8; }
  50%{ transform:scale(1.1); opacity:1; }
}
.otc-journey-card-bottom p{font-size:13.5px; line-height:1.55; color:var(--midnight-navy); font-weight:400;}
@media (max-width:800px){
  .otc-journey-sticky{flex-direction:column; gap:24px; justify-content:center;}
  .otc-journey-line-wrap{display:none;}
  .otc-journey-connector{display:none;}
  .otc-journey-cardzone{width:88vw;}
}

/* ---------- PERFORMANCE-LEISTUNGEN: Social Media Advertising (aus SEA-Template abgeleitet) ---------- */
body.sm-page{background:#F6F4EF;}
body.sm-page .prod-hero{background:#F6F4EF; border-bottom:none;}
.sm-section{padding:32px 0;}
.sm-eyebrow{
  font-family:var(--font-accent); font-weight:700; text-transform:uppercase;
  letter-spacing:0.08em; font-size:13px; color:var(--signalgelb); margin-bottom:24px; display:block;
}

/* --- Bewertungs-Badge im Hero --- */
.sm-rating-badge{display:inline-flex; align-items:center; gap:10px; background:#fff; border:1px solid rgba(15,15,15,0.08); border-radius:999px; padding:8px 16px 8px 8px; box-shadow:0 8px 24px rgba(15,15,15,0.06);}
.sm-rating-badge .stars{color:var(--signalgelb); font-size:13px; letter-spacing:1px;}
.sm-rating-badge .txt{font-size:12px; color:rgba(15,15,15,0.55); font-family:var(--font-accent);}
.sm-rating-badge .txt strong{color:var(--neverything); font-weight:700;}

.sm-split{display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:start;}
@media (max-width:900px){ .sm-split{grid-template-columns:1fr;} }
.sm-split h2{font-size:clamp(24px,3vw,34px); margin:0 0 16px; color:var(--neverything);}
.sm-split .sm-body-text{font-size:16px; line-height:1.7; color:rgba(15,15,15,0.55); margin-bottom:18px;}
.sm-split .sm-body-text:last-child{margin-bottom:0;}
.sm-split .sm-body-text strong{color:var(--neverything); font-weight:700;}

/* --- Logo-Marquee (Kunden) --- */
.sm-logo-marquee-wrap{overflow:hidden; mask-image:linear-gradient(to right, transparent, #000 8%, #000 92%, transparent); padding:8px 0;}
.sm-logo-marquee-track{display:flex; align-items:center; width:max-content; gap:64px; animation:seaLogoMarqueeScroll 42s linear infinite;}
.sm-logo-marquee-track img{height:36px; width:auto; display:block; opacity:0.55; filter:grayscale(1); transition:opacity .25s ease, filter .25s ease;}
.sm-logo-marquee-track img:hover{opacity:1; filter:grayscale(0);}
@keyframes seaLogoMarqueeScroll{0%{transform:translateX(0);}100%{transform:translateX(-50%);}}
@media (prefers-reduced-motion:reduce){ .sm-logo-marquee-track{animation:none;} }

/* --- Baustein: eine große Stat-Card mit 2-Spalten-Raster (Bewiesene Wirkung) --- */
.sm-stats-panel{
  background:transparent; border-radius:32px; padding:48px;
  width:calc(100vw - 60px); margin-left:calc(-50vw + 50% + 30px); margin-right:calc(-50vw + 50% + 30px);
}
@media (max-width:1100px){ .sm-stats-panel{padding:32px 24px;} }
.sm-stats-panel-inner{max-width:calc(var(--max-w) - 64px); margin:0 auto;}
.sm-stats-panel-head{display:flex; justify-content:space-between; align-items:flex-end; gap:40px; flex-wrap:wrap;}
.sm-stats-panel-head h2{font-size:clamp(24px,3.2vw,36px); margin:0 0 8px; color:var(--neverything); font-weight:800; max-width:440px;}
.sm-stats-panel-head h2 em{font-style:italic; font-weight:400; color:var(--signalgelb);}
.sm-stats-panel-head p{font-size:15px; color:rgba(15,15,15,0.5); margin:0; max-width:340px; text-align:right;}
@media (max-width:700px){ .sm-stats-panel-head p{text-align:left;} }
.sm-stats-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-top:32px;}
@media (max-width:900px){ .sm-stats-grid{grid-template-columns:1fr 1fr;} }
@media (max-width:500px){ .sm-stats-grid{grid-template-columns:1fr;} }
.sm-stat-cell{padding:28px 24px; background:#fff; border:1px solid rgba(15,15,15,0.06); border-radius:18px; box-shadow:0 16px 40px rgba(15,15,15,0.05);}
.sm-stat-cell .cap{font-family:var(--font-headline); font-weight:800; font-size:16px; color:var(--neverything); margin-bottom:14px; display:block;}
.sm-stat-cell .figure{display:inline-flex; align-items:center; gap:6px; background:rgba(255,164,32,0.12); color:var(--signalgelb); font-family:var(--font-headline); font-weight:800; font-size:20px; padding:6px 16px; border-radius:999px; margin-bottom:10px;}
.sm-stat-cell .sub{display:block; font-size:13px; color:rgba(15,15,15,0.5);}

/* --- Baustein: dunkle Card mit vertikalem Feature-Stack (Warum unser Ansatz funktioniert) --- */
.sm-dark{
  background:var(--midnight-navy); color:var(--orchid-white);
  border-radius:32px; padding:56px 48px 64px;
  width:calc(100vw - 60px); margin-left:calc(-50vw + 50% + 30px); margin-right:calc(-50vw + 50% + 30px);
}
@media (max-width:1100px){ .sm-dark{padding:40px 24px 48px;} }
.sm-dark-head{max-width:calc(var(--max-w) - 64px); margin:0 auto 40px; text-align:center;}
.sm-dark-head h2{font-family:var(--font-headline); font-size:clamp(28px,3.8vw,44px); font-weight:800; margin:0;}
.sm-dark-head h2 em{font-style:italic; font-weight:400; color:var(--signalgelb);}
.sm-feature-stack{display:grid; grid-template-columns:repeat(3,1fr); gap:16px; max-width:calc(var(--max-w) - 64px); margin:0 auto;}
@media (max-width:900px){ .sm-feature-stack{grid-template-columns:1fr 1fr;} }
@media (max-width:600px){ .sm-feature-stack{grid-template-columns:1fr;} }
.sm-feature-card{background:#fff; border-radius:20px; padding:28px 26px; color:var(--neverything); display:block; transition:transform .3s ease, box-shadow .3s ease;}
.sm-feature-card:hover{transform:translateY(-6px); box-shadow:0 20px 40px rgba(0,0,0,0.18);}
.sm-feature-card .icon{margin-bottom:18px;}
.sm-feature-card:hover .icon img{animation:spIconPulse .6s ease-in-out;}
.sm-feature-card .icon{width:44px; height:44px; display:flex; align-items:center; justify-content:center; flex-shrink:0;}
.sm-feature-card .icon img{width:28px; height:28px; display:block;}
.sm-feature-card h4{font-size:18px; font-weight:700; margin:0 0 8px;}
.sm-feature-card p{font-size:14px; line-height:1.65; color:rgba(15,15,15,0.6); margin:0;}

/* --- Kopfzeile: Eyebrow links, große zweizeilige Headline rechts (Was wir liefern) --- */
.sm-liefern-head{display:grid; grid-template-columns:400px 1fr; gap:24px; align-items:start; margin-bottom:40px;}
@media (max-width:700px){ .sm-liefern-head{grid-template-columns:1fr;} }
.sm-liefern-head .sm-eyebrow{white-space:nowrap; margin-bottom:0; padding-top:6px;}

/* --- Baustein: Akkordeon (Was wir liefern) --- */
.sm-acc{border-top:1px solid rgba(15,15,15,0.1);}
.sm-acc-item{border-bottom:1px solid rgba(15,15,15,0.1); overflow:visible;}
.sm-acc-head{
  cursor:pointer; display:grid; grid-template-columns:400px 1fr auto; gap:24px; align-items:center;
  padding:26px 44px 26px 4px; position:relative;
}
@media (max-width:900px){ .sm-acc-head{grid-template-columns:40px 1fr auto;} }
.sm-acc-head .num{font-family:var(--font-accent); font-weight:700; font-size:clamp(17px,2vw,22px); color:rgba(15,15,15,0.35);}
.sm-acc-head .title{font-family:var(--font-headline); font-weight:700; font-size:clamp(17px,2vw,22px); color:var(--neverything); min-width:0;}
.sm-acc-item.open .sm-acc-head .num{color:var(--signalgelb);}
.sm-acc-head .chev{
  width:34px; height:34px; border-radius:50%; background:rgba(15,41,66,0.05); flex-shrink:0; position:relative;
  transition:transform .3s ease, background .3s ease;
}
.sm-acc-head .chev::before, .sm-acc-head .chev::after{content:''; position:absolute; top:44%; width:7px; height:1.6px; background:var(--neverything);}
.sm-acc-head .chev::before{left:50%; transform:translate(-85%,-50%) rotate(45deg);}
.sm-acc-head .chev::after{left:50%; transform:translate(-15%,-50%) rotate(-45deg);}
.sm-acc-item.open .chev{background:var(--signalgelb); transform:rotate(180deg);}
.sm-acc-body{display:grid; grid-template-rows:0fr; transition:grid-template-rows .4s ease;}
.sm-acc-body .inner{overflow:hidden;}
.sm-acc-item.open .sm-acc-body{grid-template-rows:1fr;}
.sm-acc-body p{margin:0; padding:0 44px 28px 424px; font-size:15px; line-height:1.7; color:rgba(15,15,15,0.6); max-width:820px;}
@media (max-width:900px){ .sm-acc-body p{padding-left:64px;} }
.sm-acc-body strong{color:var(--midnight-navy);}

/* --- Baustein: Foto + schlichte Checkliste (Kommt Ihnen bekannt vor?) --- */
.sm-pain-split{display:grid; grid-template-columns:0.9fr 1.1fr; gap:56px; align-items:stretch;}
@media (max-width:900px){ .sm-pain-split{grid-template-columns:1fr;} }
.sm-pain-media{
  border-radius:28px; overflow:hidden; min-height:320px; background:var(--midnight-navy) center/cover no-repeat;
}
.sm-pain-head{margin:0 0 28px;}
.sm-pain-head h2{font-size:clamp(26px,3.6vw,40px); font-weight:800; margin:0 0 16px; color:var(--neverything);}
.sm-pain-head h2 em{font-style:italic; font-weight:400; color:var(--signalgelb);}
.sm-pain-head p{font-size:16px; line-height:1.7; color:rgba(15,15,15,0.55); margin:0;}
.sm-pain-list{display:flex; flex-direction:column; gap:18px; margin:32px 0;}
.sm-pain-list .row{display:flex; align-items:flex-start; gap:14px; font-size:15px; line-height:1.6; color:rgba(15,15,15,0.7);}
.sm-pain-list .row strong{color:var(--neverything);}
.sm-pain-list .mark{flex-shrink:0; width:26px; height:26px; border-radius:8px; background:rgba(15,41,66,0.06); display:flex; align-items:center; justify-content:center; margin-top:2px;}
.sm-pain-list .mark img{display:block;}

/* --- Baustein: Pill-CTA (durchgehende Leiste, statt Kontakt-Card) --- */
.sm-cta-pill{
  background:var(--signalgelb); border-radius:999px; padding:10px 10px 10px 28px;
  display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap;
}
.sm-cta-pill .txt{font-family:var(--font-headline); font-weight:800; font-size:18px; color:var(--neverything);}
.sm-cta-pill .arrow{
  width:52px; height:52px; border-radius:50%; background:var(--neverything); color:#fff; flex-shrink:0;
  display:flex; align-items:center; justify-content:center; font-size:20px; transition:transform .2s ease;
}
.sm-cta-pill:hover .arrow{transform:rotate(45deg);}
.sm-cta-contact{display:flex; align-items:center; gap:10px; margin-top:18px; font-size:13px; color:rgba(15,15,15,0.55);}
.sm-cta-contact strong{color:var(--neverything);}
.sm-cta-contact a{color:var(--midnight-navy); text-decoration:underline;}

/* --- Baustein: dunkle "Unterschied"-Card mit Stat-Trio --- */
.sm-diff{
  background:var(--midnight-navy); color:var(--orchid-white); border-radius:32px; padding:72px 64px; text-align:center;
  width:calc(100vw - 60px); margin-left:calc(-50vw + 50% + 30px); margin-right:calc(-50vw + 50% + 30px);
}
@media (max-width:1100px){ .sm-diff{padding:48px 32px;} }
.sm-diff h2{font-family:var(--font-headline); font-size:clamp(26px,3.4vw,40px); font-weight:800; margin:0 auto 20px; max-width:640px; line-height:1.2;}
.sm-diff h2 em{font-style:italic; font-weight:400; color:var(--signalgelb);}
.sm-diff p{font-size:16px; line-height:1.7; color:rgba(255,252,242,0.65); max-width:680px; margin:0 auto 44px;}
.sm-diff-trio{display:flex; gap:20px; flex-wrap:wrap; justify-content:center; max-width:calc(var(--max-w) - 64px); margin:0 auto;}
.sm-diff-trio .cell{flex:1; min-width:200px; text-align:left; background:#fff; border:1px solid rgba(15,15,15,0.06); border-radius:18px; padding:24px; box-shadow:0 16px 40px rgba(15,15,15,0.1);}
.sm-diff-trio .num{display:block; font-family:var(--font-headline); font-weight:800; font-size:clamp(18px,1.8vw,22px); color:var(--signalgelb); margin-bottom:8px; white-space:nowrap;}
.sm-diff-trio .lbl{font-size:13px; color:rgba(15,15,15,0.6); line-height:1.55;}

/* --- Baustein: Prozess-Karussell (So funktioniert es) --- */
.sm-process-head{margin-bottom:8px;}
.sm-process-head h2{font-size:clamp(26px,4vw,44px); font-weight:800; margin:0 0 16px; color:var(--neverything); line-height:1.1;}
.sm-process-head h2 em{font-style:italic; font-weight:400; color:rgba(15,15,15,0.4);}
.sm-process-head p{font-size:15px; color:rgba(15,15,15,0.5); max-width:640px; margin:0 0 32px;}

/* --- Schritt-Cards (So funktioniert es) — Look wie bei ReBounce/Shopping PLUS/Affiliate --- */
.sm-step-cards{display:flex; gap:20px;}
@media (max-width:1100px){ .sm-step-cards{flex-wrap:wrap;} .sm-step-cards .sm-step-card{flex-basis:calc(50% - 10px);} }
@media (max-width:600px){ .sm-step-cards{flex-direction:column;} .sm-step-cards .sm-step-card{flex-basis:auto;} }
.sm-step-card{
  background:#fff; border:1px solid rgba(15,15,15,0.08); border-radius:20px; padding:26px;
  position:relative; overflow:hidden; min-height:460px; display:flex; flex-direction:column;
  flex:1 1 0; min-width:0;
  transition:transform .35s ease, box-shadow .35s ease, background .35s ease, flex-grow .45s ease;
}
.sm-step-card:hover{transform:translateY(-4px); box-shadow:0 24px 48px rgba(0,0,0,0.12); flex-grow:1.6;}
.sm-step-card .sm-step-top{position:relative; z-index:2;}
.sm-step-card .sm-step-label{display:flex; align-items:center; gap:8px; margin-bottom:10px;}
.sm-step-card .sm-step-time{
  font-family:var(--font-accent); font-weight:600; font-size:11px;
  color:rgba(15,15,15,0.4); background:rgba(15,41,66,0.06); padding:4px 10px; border-radius:20px;
  transition:color .35s ease, background .35s ease;
}
.sm-step-card:hover .sm-step-time{color:var(--signalgelb); background:rgba(255,164,32,0.14);}
.sm-step-card h4{font-family:var(--font-headline); font-weight:900; font-size:22px; margin-bottom:0; color:var(--neverything);}
.sm-step-card .sm-step-detail{max-height:0; opacity:0; overflow:hidden; transition:max-height .45s ease, opacity .3s ease, margin-top .45s ease; position:relative; z-index:2;}
.sm-step-card:hover .sm-step-detail{max-height:260px; opacity:1; margin-top:16px;}
.sm-step-card .sm-step-detail p{font-size:14px; line-height:1.6; color:rgba(15,15,15,0.6); margin:0 0 14px;}
.sm-step-card .sm-step-num{
  position:absolute; right:18px; bottom:-4px; font-family:var(--font-headline); font-weight:800;
  font-size:130px; line-height:1; color:var(--signalgelb); z-index:1; user-select:none;
  transition:color .4s ease;
}
.sm-step-card:hover .sm-step-num{color:rgba(15,41,66,0.08);}

/* --- Reporting-Mock (Transparenz) --- */
.sm-dash-mock{background:#fff; border-radius:20px; border:1px solid rgba(15,15,15,0.08); box-shadow:0 24px 60px rgba(15,15,15,0.1); overflow:hidden;}
.sm-dash-mock .dash-topbar{display:flex; justify-content:space-between; align-items:center; gap:12px; padding:16px 20px; background:var(--midnight-navy);}
.sm-dash-mock .dash-title{font-family:var(--font-headline); font-weight:700; font-size:13px; color:var(--orchid-white);}
.sm-dash-mock .dash-daterange{font-size:11px; color:rgba(255,252,242,0.55); background:rgba(255,252,242,0.08); padding:5px 10px; border-radius:20px;}
.sm-dash-mock .dash-body{display:grid; grid-template-columns:1.2fr 1fr; gap:14px; padding:16px;}
.sm-dash-mock .dash-panel{background:rgba(15,41,66,0.03); border:1px solid rgba(15,41,66,0.1); border-radius:12px; padding:14px;}
.sm-dash-mock .dash-panel-table{grid-column:1 / -1;}
.sm-dash-mock .dash-panel-head{font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:0.03em; color:rgba(15,41,66,0.55); margin-bottom:12px; display:flex; justify-content:space-between;}
.sm-dash-mock .dash-panel-head .sort{color:rgba(15,41,66,0.35); font-size:9px;}
.sm-dash-mock .rep-bars{display:flex; align-items:flex-end; gap:8px; height:84px;}
.sm-dash-mock .rep-bar{flex:1; background:rgba(15,41,66,0.12); border-radius:4px 4px 0 0;}
.sm-dash-mock .rep-bar.hi{background:var(--signalgelb);}
.sm-dash-mock .dash-kpi-grid{display:grid; grid-template-columns:1fr 1fr; gap:10px;}
.sm-dash-mock .dash-kpi{background:#fff; border:1px solid rgba(15,41,66,0.08); border-radius:8px; padding:8px 10px;}
.sm-dash-mock .dash-kpi .lbl{display:block; font-size:9px; color:rgba(15,15,15,0.45); margin-bottom:4px;}
.sm-dash-mock .dash-kpi .val{display:block; font-family:var(--font-headline); font-weight:800; font-size:15px; color:var(--neverything);}
.sm-dash-mock .dash-table-row{display:grid; grid-template-columns:60px 1fr; align-items:center; gap:10px; height:16px; margin-bottom:10px;}
.sm-dash-mock .dash-table-row:last-child{margin-bottom:0;}
.sm-dash-mock .dash-table-row span:first-child{height:8px; border-radius:4px; background:rgba(15,41,66,0.08);}
.sm-dash-mock .dash-table-row .bar{height:8px; border-radius:4px; background:var(--signalgelb);}
.sm-check-split{display:grid; grid-template-columns:0.9fr 1.1fr; gap:64px; align-items:stretch;}
@media (max-width:900px){ .sm-check-split{grid-template-columns:1fr;} }
.sm-check-split h2{font-size:clamp(26px,3.4vw,38px); font-weight:800; line-height:1.2; margin:0 0 16px; color:var(--neverything);}
.sm-check-split h2 em{font-style:italic; font-family:var(--font-headline); font-weight:400; color:var(--signalgelb);}
.sm-check-split .sm-sub{font-size:16px; color:rgba(15,15,15,0.5); margin:0 0 28px;}
.sm-check-list{display:flex; flex-direction:column; gap:18px;}
.sm-check-item{display:flex; align-items:flex-start; gap:14px;}
.sm-check-item .mark{flex-shrink:0; width:26px; height:26px; border-radius:8px; background:rgba(15,41,66,0.06); display:flex; align-items:center; justify-content:center; margin-top:2px;}
.sm-check-item .mark img{display:block;}
.sm-check-item p{margin:0; font-size:15px; line-height:1.6; color:rgba(15,15,15,0.75);}
.sm-check-item p strong{color:var(--midnight-navy);}

/* ---------- PERFORMANCE-LEISTUNGEN: Programmatic Advertising (aus SEA-Template abgeleitet) ---------- */
body.pa-page{background:#F6F4EF;}
body.pa-page .prod-hero{background:#F6F4EF; border-bottom:none;}
.pa-section{padding:32px 0;}
.pa-eyebrow{
  font-family:var(--font-accent); font-weight:700; text-transform:uppercase;
  letter-spacing:0.08em; font-size:13px; color:var(--signalgelb); margin-bottom:24px; display:block;
}

/* --- Bewertungs-Badge im Hero --- */
.pa-rating-badge{display:inline-flex; align-items:center; gap:10px; background:#fff; border:1px solid rgba(15,15,15,0.08); border-radius:999px; padding:8px 16px 8px 8px; box-shadow:0 8px 24px rgba(15,15,15,0.06);}
.pa-rating-badge .stars{color:var(--signalgelb); font-size:13px; letter-spacing:1px;}
.pa-rating-badge .txt{font-size:12px; color:rgba(15,15,15,0.55); font-family:var(--font-accent);}
.pa-rating-badge .txt strong{color:var(--neverything); font-weight:700;}

.pa-split{display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:start;}
@media (max-width:900px){ .pa-split{grid-template-columns:1fr;} }
.pa-split h2{font-size:clamp(24px,3vw,34px); margin:0 0 16px; color:var(--neverything);}
.pa-split .pa-body-text{font-size:16px; line-height:1.7; color:rgba(15,15,15,0.55); margin-bottom:18px;}
.pa-split .pa-body-text:last-child{margin-bottom:0;}
.pa-split .pa-body-text strong{color:var(--neverything); font-weight:700;}

/* --- Logo-Marquee (Kunden) --- */
.pa-logo-marquee-wrap{overflow:hidden; mask-image:linear-gradient(to right, transparent, #000 8%, #000 92%, transparent); padding:8px 0;}
.pa-logo-marquee-track{display:flex; align-items:center; width:max-content; gap:64px; animation:seaLogoMarqueeScroll 42s linear infinite;}
.pa-logo-marquee-track img{height:36px; width:auto; display:block; opacity:0.55; filter:grayscale(1); transition:opacity .25s ease, filter .25s ease;}
.pa-logo-marquee-track img:hover{opacity:1; filter:grayscale(0);}
@keyframes seaLogoMarqueeScroll{0%{transform:translateX(0);}100%{transform:translateX(-50%);}}
@media (prefers-reduced-motion:reduce){ .pa-logo-marquee-track{animation:none;} }

/* --- Baustein: eine große Stat-Card mit 2-Spalten-Raster (Bewiesene Wirkung) --- */
.pa-stats-panel{
  background:transparent; border-radius:32px; padding:48px;
  width:calc(100vw - 60px); margin-left:calc(-50vw + 50% + 30px); margin-right:calc(-50vw + 50% + 30px);
}
@media (max-width:1100px){ .pa-stats-panel{padding:32px 24px;} }
.pa-stats-panel-inner{max-width:calc(var(--max-w) - 64px); margin:0 auto;}
.pa-stats-panel-head{display:flex; justify-content:space-between; align-items:flex-end; gap:40px; flex-wrap:wrap;}
.pa-stats-panel-head h2{font-size:clamp(24px,3.2vw,36px); margin:0 0 8px; color:var(--neverything); font-weight:800; max-width:440px;}
.pa-stats-panel-head h2 em{font-style:italic; font-weight:400; color:var(--signalgelb);}
.pa-stats-panel-head p{font-size:15px; color:rgba(15,15,15,0.5); margin:0; max-width:340px; text-align:right;}
@media (max-width:700px){ .pa-stats-panel-head p{text-align:left;} }
.pa-stats-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-top:32px;}
@media (max-width:900px){ .pa-stats-grid{grid-template-columns:1fr 1fr;} }
@media (max-width:500px){ .pa-stats-grid{grid-template-columns:1fr;} }
.pa-stat-cell{padding:28px 24px; background:#fff; border:1px solid rgba(15,15,15,0.06); border-radius:18px; box-shadow:0 16px 40px rgba(15,15,15,0.05);}
.pa-stat-cell .cap{font-family:var(--font-headline); font-weight:800; font-size:16px; color:var(--neverything); margin-bottom:14px; display:block;}
.pa-stat-cell .figure{display:inline-flex; align-items:center; gap:6px; background:rgba(255,164,32,0.12); color:var(--signalgelb); font-family:var(--font-headline); font-weight:800; font-size:20px; padding:6px 16px; border-radius:999px; margin-bottom:10px;}
.pa-stat-cell .sub{display:block; font-size:13px; color:rgba(15,15,15,0.5);}

/* --- Baustein: dunkle Card mit vertikalem Feature-Stack (Warum unser Ansatz funktioniert) --- */
.pa-dark{
  background:var(--midnight-navy); color:var(--orchid-white);
  border-radius:32px; padding:56px 48px 64px;
  width:calc(100vw - 60px); margin-left:calc(-50vw + 50% + 30px); margin-right:calc(-50vw + 50% + 30px);
}
@media (max-width:1100px){ .pa-dark{padding:40px 24px 48px;} }
.pa-dark-head{max-width:calc(var(--max-w) - 64px); margin:0 auto 40px; text-align:center;}
.pa-dark-head h2{font-family:var(--font-headline); font-size:clamp(28px,3.8vw,44px); font-weight:800; margin:0;}
.pa-dark-head h2 em{font-style:italic; font-weight:400; color:var(--signalgelb);}
.pa-feature-stack{display:grid; grid-template-columns:repeat(3,1fr); gap:16px; max-width:calc(var(--max-w) - 64px); margin:0 auto;}
@media (max-width:900px){ .pa-feature-stack{grid-template-columns:1fr 1fr;} }
@media (max-width:600px){ .pa-feature-stack{grid-template-columns:1fr;} }
.pa-feature-card{background:#fff; border-radius:20px; padding:28px 26px; color:var(--neverything); display:block; transition:transform .3s ease, box-shadow .3s ease;}
.pa-feature-card:hover{transform:translateY(-6px); box-shadow:0 20px 40px rgba(0,0,0,0.18);}
.pa-feature-card .icon{margin-bottom:18px;}
.pa-feature-card:hover .icon img{animation:spIconPulse .6s ease-in-out;}
.pa-feature-card .icon{width:44px; height:44px; display:flex; align-items:center; justify-content:center; flex-shrink:0;}
.pa-feature-card .icon img{width:28px; height:28px; display:block;}
.pa-feature-card h4{font-size:18px; font-weight:700; margin:0 0 8px;}
.pa-feature-card p{font-size:14px; line-height:1.65; color:rgba(15,15,15,0.6); margin:0;}

/* --- Kopfzeile: Eyebrow links, große zweizeilige Headline rechts (Was wir liefern) --- */
.pa-liefern-head{display:grid; grid-template-columns:400px 1fr; gap:24px; align-items:start; margin-bottom:40px;}
@media (max-width:700px){ .pa-liefern-head{grid-template-columns:1fr;} }
.pa-liefern-head .pa-eyebrow{white-space:nowrap; margin-bottom:0; padding-top:6px;}

/* --- Baustein: Akkordeon (Was wir liefern) --- */
.pa-acc{border-top:1px solid rgba(15,15,15,0.1);}
.pa-acc-item{border-bottom:1px solid rgba(15,15,15,0.1); overflow:visible;}
.pa-acc-head{
  cursor:pointer; display:grid; grid-template-columns:400px 1fr auto; gap:24px; align-items:center;
  padding:26px 44px 26px 4px; position:relative;
}
@media (max-width:900px){ .pa-acc-head{grid-template-columns:40px 1fr auto;} }
.pa-acc-head .num{font-family:var(--font-accent); font-weight:700; font-size:clamp(17px,2vw,22px); color:rgba(15,15,15,0.35);}
.pa-acc-head .title{font-family:var(--font-headline); font-weight:700; font-size:clamp(17px,2vw,22px); color:var(--neverything); min-width:0;}
.pa-acc-item.open .pa-acc-head .num{color:var(--signalgelb);}
.pa-acc-head .chev{
  width:34px; height:34px; border-radius:50%; background:rgba(15,41,66,0.05); flex-shrink:0; position:relative;
  transition:transform .3s ease, background .3s ease;
}
.pa-acc-head .chev::before, .pa-acc-head .chev::after{content:''; position:absolute; top:44%; width:7px; height:1.6px; background:var(--neverything);}
.pa-acc-head .chev::before{left:50%; transform:translate(-85%,-50%) rotate(45deg);}
.pa-acc-head .chev::after{left:50%; transform:translate(-15%,-50%) rotate(-45deg);}
.pa-acc-item.open .chev{background:var(--signalgelb); transform:rotate(180deg);}
.pa-acc-body{display:grid; grid-template-rows:0fr; transition:grid-template-rows .4s ease;}
.pa-acc-body .inner{overflow:hidden;}
.pa-acc-item.open .pa-acc-body{grid-template-rows:1fr;}
.pa-acc-body p{margin:0; padding:0 44px 28px 424px; font-size:15px; line-height:1.7; color:rgba(15,15,15,0.6); max-width:820px;}
@media (max-width:900px){ .pa-acc-body p{padding-left:64px;} }
.pa-acc-body strong{color:var(--midnight-navy);}

/* --- Baustein: Foto + schlichte Checkliste (Kommt Ihnen bekannt vor?) --- */
.pa-pain-split{display:grid; grid-template-columns:0.9fr 1.1fr; gap:56px; align-items:stretch;}
@media (max-width:900px){ .pa-pain-split{grid-template-columns:1fr;} }
.pa-pain-media{
  border-radius:28px; overflow:hidden; min-height:320px; background:var(--midnight-navy) center/cover no-repeat;
}
.pa-pain-head{margin:0 0 28px;}
.pa-pain-head h2{font-size:clamp(26px,3.6vw,40px); font-weight:800; margin:0 0 16px; color:var(--neverything);}
.pa-pain-head h2 em{font-style:italic; font-weight:400; color:var(--signalgelb);}
.pa-pain-head p{font-size:16px; line-height:1.7; color:rgba(15,15,15,0.55); margin:0;}
.pa-pain-list{display:flex; flex-direction:column; gap:18px; margin:32px 0;}
.pa-pain-list .row{display:flex; align-items:flex-start; gap:14px; font-size:15px; line-height:1.6; color:rgba(15,15,15,0.7);}
.pa-pain-list .row strong{color:var(--neverything);}
.pa-pain-list .mark{flex-shrink:0; width:26px; height:26px; border-radius:8px; background:rgba(15,41,66,0.06); display:flex; align-items:center; justify-content:center; margin-top:2px;}
.pa-pain-list .mark img{display:block;}

/* --- Baustein: Pill-CTA (durchgehende Leiste, statt Kontakt-Card) --- */
.pa-cta-pill{
  background:var(--signalgelb); border-radius:999px; padding:10px 10px 10px 28px;
  display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap;
}
.pa-cta-pill .txt{font-family:var(--font-headline); font-weight:800; font-size:18px; color:var(--neverything);}
.pa-cta-pill .arrow{
  width:52px; height:52px; border-radius:50%; background:var(--neverything); color:#fff; flex-shrink:0;
  display:flex; align-items:center; justify-content:center; font-size:20px; transition:transform .2s ease;
}
.pa-cta-pill:hover .arrow{transform:rotate(45deg);}
.pa-cta-contact{display:flex; align-items:center; gap:10px; margin-top:18px; font-size:13px; color:rgba(15,15,15,0.55);}
.pa-cta-contact strong{color:var(--neverything);}
.pa-cta-contact a{color:var(--midnight-navy); text-decoration:underline;}

/* --- Baustein: dunkle "Unterschied"-Card mit Stat-Trio --- */
.pa-diff{
  background:var(--midnight-navy); color:var(--orchid-white); border-radius:32px; padding:72px 64px; text-align:center;
  width:calc(100vw - 60px); margin-left:calc(-50vw + 50% + 30px); margin-right:calc(-50vw + 50% + 30px);
}
@media (max-width:1100px){ .pa-diff{padding:48px 32px;} }
.pa-diff h2{font-family:var(--font-headline); font-size:clamp(26px,3.4vw,40px); font-weight:800; margin:0 auto 20px; max-width:640px; line-height:1.2;}
.pa-diff h2 em{font-style:italic; font-weight:400; color:var(--signalgelb);}
.pa-diff p{font-size:16px; line-height:1.7; color:rgba(255,252,242,0.65); max-width:680px; margin:0 auto 44px;}
.pa-diff-trio{display:flex; gap:20px; flex-wrap:wrap; justify-content:center; max-width:calc(var(--max-w) - 64px); margin:0 auto;}
.pa-diff-trio .cell{flex:1; min-width:200px; text-align:left; background:#fff; border:1px solid rgba(15,15,15,0.06); border-radius:18px; padding:24px; box-shadow:0 16px 40px rgba(15,15,15,0.1);}
.pa-diff-trio .num{display:block; font-family:var(--font-headline); font-weight:800; font-size:clamp(18px,1.8vw,22px); color:var(--signalgelb); margin-bottom:8px; white-space:nowrap;}
.pa-diff-trio .lbl{font-size:13px; color:rgba(15,15,15,0.6); line-height:1.55;}

/* --- Baustein: Prozess-Karussell (So funktioniert es) --- */
.pa-process-head{margin-bottom:8px;}
.pa-process-head h2{font-size:clamp(26px,4vw,44px); font-weight:800; margin:0 0 16px; color:var(--neverything); line-height:1.1;}
.pa-process-head h2 em{font-style:italic; font-weight:400; color:rgba(15,15,15,0.4);}
.pa-process-head p{font-size:15px; color:rgba(15,15,15,0.5); max-width:640px; margin:0 0 32px;}

/* --- Schritt-Cards (So funktioniert es) — Look wie bei ReBounce/Shopping PLUS/Affiliate --- */
.pa-step-cards{display:flex; gap:20px;}
@media (max-width:1100px){ .pa-step-cards{flex-wrap:wrap;} .pa-step-cards .pa-step-card{flex-basis:calc(50% - 10px);} }
@media (max-width:600px){ .pa-step-cards{flex-direction:column;} .pa-step-cards .pa-step-card{flex-basis:auto;} }
.pa-step-card{
  background:#fff; border:1px solid rgba(15,15,15,0.08); border-radius:20px; padding:26px;
  position:relative; overflow:hidden; min-height:460px; display:flex; flex-direction:column;
  flex:1 1 0; min-width:0;
  transition:transform .35s ease, box-shadow .35s ease, background .35s ease, flex-grow .45s ease;
}
.pa-step-card:hover{transform:translateY(-4px); box-shadow:0 24px 48px rgba(0,0,0,0.12); flex-grow:1.6;}
.pa-step-card .pa-step-top{position:relative; z-index:2;}
.pa-step-card .pa-step-label{display:flex; align-items:center; gap:8px; margin-bottom:10px;}
.pa-step-card .pa-step-time{
  font-family:var(--font-accent); font-weight:600; font-size:11px;
  color:rgba(15,15,15,0.4); background:rgba(15,41,66,0.06); padding:4px 10px; border-radius:20px;
  transition:color .35s ease, background .35s ease;
}
.pa-step-card:hover .pa-step-time{color:var(--signalgelb); background:rgba(255,164,32,0.14);}
.pa-step-card h4{font-family:var(--font-headline); font-weight:900; font-size:22px; margin-bottom:0; color:var(--neverything);}
.pa-step-card .pa-step-detail{max-height:0; opacity:0; overflow:hidden; transition:max-height .45s ease, opacity .3s ease, margin-top .45s ease; position:relative; z-index:2;}
.pa-step-card:hover .pa-step-detail{max-height:260px; opacity:1; margin-top:16px;}
.pa-step-card .pa-step-detail p{font-size:14px; line-height:1.6; color:rgba(15,15,15,0.6); margin:0 0 14px;}
.pa-step-card .pa-step-num{
  position:absolute; right:18px; bottom:-4px; font-family:var(--font-headline); font-weight:800;
  font-size:130px; line-height:1; color:var(--signalgelb); z-index:1; user-select:none;
  transition:color .4s ease;
}
.pa-step-card:hover .pa-step-num{color:rgba(15,41,66,0.08);}

/* --- Reporting-Mock (Transparenz) --- */
.pa-dash-mock{background:#fff; border-radius:20px; border:1px solid rgba(15,15,15,0.08); box-shadow:0 24px 60px rgba(15,15,15,0.1); overflow:hidden;}
.pa-dash-mock .dash-topbar{display:flex; justify-content:space-between; align-items:center; gap:12px; padding:16px 20px; background:var(--midnight-navy);}
.pa-dash-mock .dash-title{font-family:var(--font-headline); font-weight:700; font-size:13px; color:var(--orchid-white);}
.pa-dash-mock .dash-daterange{font-size:11px; color:rgba(255,252,242,0.55); background:rgba(255,252,242,0.08); padding:5px 10px; border-radius:20px;}
.pa-dash-mock .dash-body{display:grid; grid-template-columns:1.2fr 1fr; gap:14px; padding:16px;}
.pa-dash-mock .dash-panel{background:rgba(15,41,66,0.03); border:1px solid rgba(15,41,66,0.1); border-radius:12px; padding:14px;}
.pa-dash-mock .dash-panel-table{grid-column:1 / -1;}
.pa-dash-mock .dash-panel-head{font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:0.03em; color:rgba(15,41,66,0.55); margin-bottom:12px; display:flex; justify-content:space-between;}
.pa-dash-mock .dash-panel-head .sort{color:rgba(15,41,66,0.35); font-size:9px;}
.pa-dash-mock .rep-bars{display:flex; align-items:flex-end; gap:8px; height:84px;}
.pa-dash-mock .rep-bar{flex:1; background:rgba(15,41,66,0.12); border-radius:4px 4px 0 0;}
.pa-dash-mock .rep-bar.hi{background:var(--signalgelb);}
.pa-dash-mock .dash-kpi-grid{display:grid; grid-template-columns:1fr 1fr; gap:10px;}
.pa-dash-mock .dash-kpi{background:#fff; border:1px solid rgba(15,41,66,0.08); border-radius:8px; padding:8px 10px;}
.pa-dash-mock .dash-kpi .lbl{display:block; font-size:9px; color:rgba(15,15,15,0.45); margin-bottom:4px;}
.pa-dash-mock .dash-kpi .val{display:block; font-family:var(--font-headline); font-weight:800; font-size:15px; color:var(--neverything);}
.pa-dash-mock .dash-table-row{display:grid; grid-template-columns:60px 1fr; align-items:center; gap:10px; height:16px; margin-bottom:10px;}
.pa-dash-mock .dash-table-row:last-child{margin-bottom:0;}
.pa-dash-mock .dash-table-row span:first-child{height:8px; border-radius:4px; background:rgba(15,41,66,0.08);}
.pa-dash-mock .dash-table-row .bar{height:8px; border-radius:4px; background:var(--signalgelb);}
.pa-check-split{display:grid; grid-template-columns:0.9fr 1.1fr; gap:64px; align-items:stretch;}
@media (max-width:900px){ .pa-check-split{grid-template-columns:1fr;} }
.pa-check-split h2{font-size:clamp(26px,3.4vw,38px); font-weight:800; line-height:1.2; margin:0 0 16px; color:var(--neverything);}
.pa-check-split h2 em{font-style:italic; font-family:var(--font-headline); font-weight:400; color:var(--signalgelb);}
.pa-check-split .pa-sub{font-size:16px; color:rgba(15,15,15,0.5); margin:0 0 28px;}
.pa-check-list{display:flex; flex-direction:column; gap:18px;}
.pa-check-item{display:flex; align-items:flex-start; gap:14px;}
.pa-check-item .mark{flex-shrink:0; width:26px; height:26px; border-radius:8px; background:rgba(15,41,66,0.06); display:flex; align-items:center; justify-content:center; margin-top:2px;}
.pa-check-item .mark img{display:block;}
.pa-check-item p{margin:0; font-size:15px; line-height:1.6; color:rgba(15,15,15,0.75);}
.pa-check-item p strong{color:var(--midnight-navy);}

/* ---------- PERFORMANCE-LEISTUNGEN: Websites & Online-Shops (aus SEA-Template abgeleitet) ---------- */
body.ws-page{background:#F6F4EF;}
body.ws-page .prod-hero{background:#F6F4EF; border-bottom:none;}
.ws-section{padding:32px 0;}
.ws-eyebrow{
  font-family:var(--font-accent); font-weight:700; text-transform:uppercase;
  letter-spacing:0.08em; font-size:13px; color:var(--signalgelb); margin-bottom:24px; display:block;
}

/* --- Bewertungs-Badge im Hero --- */
.ws-rating-badge{display:inline-flex; align-items:center; gap:10px; background:#fff; border:1px solid rgba(15,15,15,0.08); border-radius:999px; padding:8px 16px 8px 8px; box-shadow:0 8px 24px rgba(15,15,15,0.06);}
.ws-rating-badge .stars{color:var(--signalgelb); font-size:13px; letter-spacing:1px;}
.ws-rating-badge .txt{font-size:12px; color:rgba(15,15,15,0.55); font-family:var(--font-accent);}
.ws-rating-badge .txt strong{color:var(--neverything); font-weight:700;}

.ws-split{display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:start;}
@media (max-width:900px){ .ws-split{grid-template-columns:1fr;} }
.ws-split h2{font-size:clamp(24px,3vw,34px); margin:0 0 16px; color:var(--neverything);}
.ws-split .ws-body-text{font-size:16px; line-height:1.7; color:rgba(15,15,15,0.55); margin-bottom:18px;}
.ws-split .ws-body-text:last-child{margin-bottom:0;}
.ws-split .ws-body-text strong{color:var(--neverything); font-weight:700;}

/* --- Logo-Marquee (Kunden) --- */
.ws-logo-marquee-wrap{overflow:hidden; mask-image:linear-gradient(to right, transparent, #000 8%, #000 92%, transparent); padding:8px 0;}
.ws-logo-marquee-track{display:flex; align-items:center; width:max-content; gap:64px; animation:seaLogoMarqueeScroll 42s linear infinite;}
.ws-logo-marquee-track img{height:36px; width:auto; display:block; opacity:0.55; filter:grayscale(1); transition:opacity .25s ease, filter .25s ease;}
.ws-logo-marquee-track img:hover{opacity:1; filter:grayscale(0);}
@keyframes seaLogoMarqueeScroll{0%{transform:translateX(0);}100%{transform:translateX(-50%);}}
@media (prefers-reduced-motion:reduce){ .ws-logo-marquee-track{animation:none;} }

/* --- Baustein: eine große Stat-Card mit 2-Spalten-Raster (Bewiesene Wirkung) --- */
.ws-stats-panel{
  background:transparent; border-radius:32px; padding:48px;
  width:calc(100vw - 60px); margin-left:calc(-50vw + 50% + 30px); margin-right:calc(-50vw + 50% + 30px);
}
@media (max-width:1100px){ .ws-stats-panel{padding:32px 24px;} }
.ws-stats-panel-inner{max-width:calc(var(--max-w) - 64px); margin:0 auto;}
.ws-stats-panel-head{display:flex; justify-content:space-between; align-items:flex-end; gap:40px; flex-wrap:wrap;}
.ws-stats-panel-head h2{font-size:clamp(24px,3.2vw,36px); margin:0 0 8px; color:var(--neverything); font-weight:800; max-width:440px;}
.ws-stats-panel-head h2 em{font-style:italic; font-weight:400; color:var(--signalgelb);}
.ws-stats-panel-head p{font-size:15px; color:rgba(15,15,15,0.5); margin:0; max-width:340px; text-align:right;}
@media (max-width:700px){ .ws-stats-panel-head p{text-align:left;} }
.ws-stats-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-top:32px;}
@media (max-width:900px){ .ws-stats-grid{grid-template-columns:1fr 1fr;} }
@media (max-width:500px){ .ws-stats-grid{grid-template-columns:1fr;} }
.ws-stat-cell{padding:28px 24px; background:#fff; border:1px solid rgba(15,15,15,0.06); border-radius:18px; box-shadow:0 16px 40px rgba(15,15,15,0.05);}
.ws-stat-cell .cap{font-family:var(--font-headline); font-weight:800; font-size:16px; color:var(--neverything); margin-bottom:14px; display:block;}
.ws-stat-cell .figure{display:inline-flex; align-items:center; gap:6px; background:rgba(255,164,32,0.12); color:var(--signalgelb); font-family:var(--font-headline); font-weight:800; font-size:20px; padding:6px 16px; border-radius:999px; margin-bottom:10px;}
.ws-stat-cell .sub{display:block; font-size:13px; color:rgba(15,15,15,0.5);}

/* --- Baustein: dunkle Card mit vertikalem Feature-Stack (Warum unser Ansatz funktioniert) --- */
.ws-dark{
  background:var(--midnight-navy); color:var(--orchid-white);
  border-radius:32px; padding:56px 48px 64px;
  width:calc(100vw - 60px); margin-left:calc(-50vw + 50% + 30px); margin-right:calc(-50vw + 50% + 30px);
}
@media (max-width:1100px){ .ws-dark{padding:40px 24px 48px;} }
.ws-dark-head{max-width:calc(var(--max-w) - 64px); margin:0 auto 40px; text-align:center;}
.ws-dark-head h2{font-family:var(--font-headline); font-size:clamp(28px,3.8vw,44px); font-weight:800; margin:0;}
.ws-dark-head h2 em{font-style:italic; font-weight:400; color:var(--signalgelb);}
.ws-feature-stack{display:grid; grid-template-columns:repeat(3,1fr); gap:16px; max-width:calc(var(--max-w) - 64px); margin:0 auto;}
@media (max-width:900px){ .ws-feature-stack{grid-template-columns:1fr 1fr;} }
@media (max-width:600px){ .ws-feature-stack{grid-template-columns:1fr;} }
.ws-feature-card{background:#fff; border-radius:20px; padding:28px 26px; color:var(--neverything); display:block; transition:transform .3s ease, box-shadow .3s ease;}
.ws-feature-card:hover{transform:translateY(-6px); box-shadow:0 20px 40px rgba(0,0,0,0.18);}
.ws-feature-card .icon{margin-bottom:18px;}
.ws-feature-card:hover .icon img{animation:spIconPulse .6s ease-in-out;}
.ws-feature-card .icon{width:44px; height:44px; display:flex; align-items:center; justify-content:center; flex-shrink:0;}
.ws-feature-card .icon img{width:28px; height:28px; display:block;}
.ws-feature-card h4{font-size:18px; font-weight:700; margin:0 0 8px;}
.ws-feature-card p{font-size:14px; line-height:1.65; color:rgba(15,15,15,0.6); margin:0;}

/* --- Kopfzeile: Eyebrow links, große zweizeilige Headline rechts (Was wir liefern) --- */
.ws-liefern-head{display:grid; grid-template-columns:400px 1fr; gap:24px; align-items:start; margin-bottom:40px;}
@media (max-width:700px){ .ws-liefern-head{grid-template-columns:1fr;} }
.ws-liefern-head .ws-eyebrow{white-space:nowrap; margin-bottom:0; padding-top:6px;}

/* --- Baustein: Akkordeon (Was wir liefern) --- */
.ws-acc{border-top:1px solid rgba(15,15,15,0.1);}
.ws-acc-item{border-bottom:1px solid rgba(15,15,15,0.1); overflow:visible;}
.ws-acc-head{
  cursor:pointer; display:grid; grid-template-columns:400px 1fr auto; gap:24px; align-items:center;
  padding:26px 44px 26px 4px; position:relative;
}
@media (max-width:900px){ .ws-acc-head{grid-template-columns:40px 1fr auto;} }
.ws-acc-head .num{font-family:var(--font-accent); font-weight:700; font-size:clamp(17px,2vw,22px); color:rgba(15,15,15,0.35);}
.ws-acc-head .title{font-family:var(--font-headline); font-weight:700; font-size:clamp(17px,2vw,22px); color:var(--neverything); min-width:0;}
.ws-acc-item.open .ws-acc-head .num{color:var(--signalgelb);}
.ws-acc-head .chev{
  width:34px; height:34px; border-radius:50%; background:rgba(15,41,66,0.05); flex-shrink:0; position:relative;
  transition:transform .3s ease, background .3s ease;
}
.ws-acc-head .chev::before, .ws-acc-head .chev::after{content:''; position:absolute; top:44%; width:7px; height:1.6px; background:var(--neverything);}
.ws-acc-head .chev::before{left:50%; transform:translate(-85%,-50%) rotate(45deg);}
.ws-acc-head .chev::after{left:50%; transform:translate(-15%,-50%) rotate(-45deg);}
.ws-acc-item.open .chev{background:var(--signalgelb); transform:rotate(180deg);}
.ws-acc-body{display:grid; grid-template-rows:0fr; transition:grid-template-rows .4s ease;}
.ws-acc-body .inner{overflow:hidden;}
.ws-acc-item.open .ws-acc-body{grid-template-rows:1fr;}
.ws-acc-body p{margin:0; padding:0 44px 28px 424px; font-size:15px; line-height:1.7; color:rgba(15,15,15,0.6); max-width:820px;}
@media (max-width:900px){ .ws-acc-body p{padding-left:64px;} }
.ws-acc-body strong{color:var(--midnight-navy);}

/* --- Baustein: Foto + schlichte Checkliste (Kommt Ihnen bekannt vor?) --- */
.ws-pain-split{display:grid; grid-template-columns:0.9fr 1.1fr; gap:56px; align-items:stretch;}
@media (max-width:900px){ .ws-pain-split{grid-template-columns:1fr;} }
.ws-pain-media{
  border-radius:28px; overflow:hidden; min-height:320px; background:var(--midnight-navy) center/cover no-repeat;
}
.ws-pain-head{margin:0 0 28px;}
.ws-pain-head h2{font-size:clamp(26px,3.6vw,40px); font-weight:800; margin:0 0 16px; color:var(--neverything);}
.ws-pain-head h2 em{font-style:italic; font-weight:400; color:var(--signalgelb);}
.ws-pain-head p{font-size:16px; line-height:1.7; color:rgba(15,15,15,0.55); margin:0;}
.ws-pain-list{display:flex; flex-direction:column; gap:18px; margin:32px 0;}
.ws-pain-list .row{display:flex; align-items:flex-start; gap:14px; font-size:15px; line-height:1.6; color:rgba(15,15,15,0.7);}
.ws-pain-list .row strong{color:var(--neverything);}
.ws-pain-list .mark{flex-shrink:0; width:26px; height:26px; border-radius:8px; background:rgba(15,41,66,0.06); display:flex; align-items:center; justify-content:center; margin-top:2px;}
.ws-pain-list .mark img{display:block;}

/* --- Baustein: Pill-CTA (durchgehende Leiste, statt Kontakt-Card) --- */
.ws-cta-pill{
  background:var(--signalgelb); border-radius:999px; padding:10px 10px 10px 28px;
  display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap;
}
.ws-cta-pill .txt{font-family:var(--font-headline); font-weight:800; font-size:18px; color:var(--neverything);}
.ws-cta-pill .arrow{
  width:52px; height:52px; border-radius:50%; background:var(--neverything); color:#fff; flex-shrink:0;
  display:flex; align-items:center; justify-content:center; font-size:20px; transition:transform .2s ease;
}
.ws-cta-pill:hover .arrow{transform:rotate(45deg);}
.ws-cta-contact{display:flex; align-items:center; gap:10px; margin-top:18px; font-size:13px; color:rgba(15,15,15,0.55);}
.ws-cta-contact strong{color:var(--neverything);}
.ws-cta-contact a{color:var(--midnight-navy); text-decoration:underline;}

/* --- Baustein: dunkle "Unterschied"-Card mit Stat-Trio --- */
.ws-diff{
  background:var(--midnight-navy); color:var(--orchid-white); border-radius:32px; padding:72px 64px; text-align:center;
  width:calc(100vw - 60px); margin-left:calc(-50vw + 50% + 30px); margin-right:calc(-50vw + 50% + 30px);
}
@media (max-width:1100px){ .ws-diff{padding:48px 32px;} }
.ws-diff h2{font-family:var(--font-headline); font-size:clamp(26px,3.4vw,40px); font-weight:800; margin:0 auto 20px; max-width:640px; line-height:1.2;}
.ws-diff h2 em{font-style:italic; font-weight:400; color:var(--signalgelb);}
.ws-diff p{font-size:16px; line-height:1.7; color:rgba(255,252,242,0.65); max-width:680px; margin:0 auto 44px;}
.ws-diff-trio{display:flex; gap:20px; flex-wrap:wrap; justify-content:center; max-width:calc(var(--max-w) - 64px); margin:0 auto;}
.ws-diff-trio .cell{flex:1; min-width:200px; text-align:left; background:#fff; border:1px solid rgba(15,15,15,0.06); border-radius:18px; padding:24px; box-shadow:0 16px 40px rgba(15,15,15,0.1);}
.ws-diff-trio .num{display:block; font-family:var(--font-headline); font-weight:800; font-size:clamp(18px,1.8vw,22px); color:var(--signalgelb); margin-bottom:8px; white-space:nowrap;}
.ws-diff-trio .lbl{font-size:13px; color:rgba(15,15,15,0.6); line-height:1.55;}

/* --- Baustein: Prozess-Karussell (So funktioniert es) --- */
.ws-process-head{margin-bottom:8px;}
.ws-process-head h2{font-size:clamp(26px,4vw,44px); font-weight:800; margin:0 0 16px; color:var(--neverything); line-height:1.1;}
.ws-process-head h2 em{font-style:italic; font-weight:400; color:rgba(15,15,15,0.4);}
.ws-process-head p{font-size:15px; color:rgba(15,15,15,0.5); max-width:640px; margin:0 0 32px;}

/* --- Schritt-Cards (So funktioniert es) — Look wie bei ReBounce/Shopping PLUS/Affiliate --- */
.ws-step-cards{display:flex; gap:20px;}
@media (max-width:1100px){ .ws-step-cards{flex-wrap:wrap;} .ws-step-cards .ws-step-card{flex-basis:calc(50% - 10px);} }
@media (max-width:600px){ .ws-step-cards{flex-direction:column;} .ws-step-cards .ws-step-card{flex-basis:auto;} }
.ws-step-card{
  background:#fff; border:1px solid rgba(15,15,15,0.08); border-radius:20px; padding:26px;
  position:relative; overflow:hidden; min-height:460px; display:flex; flex-direction:column;
  flex:1 1 0; min-width:0;
  transition:transform .35s ease, box-shadow .35s ease, background .35s ease, flex-grow .45s ease;
}
.ws-step-card:hover{transform:translateY(-4px); box-shadow:0 24px 48px rgba(0,0,0,0.12); flex-grow:1.6;}
.ws-step-card .ws-step-top{position:relative; z-index:2;}
.ws-step-card .ws-step-label{display:flex; align-items:center; gap:8px; margin-bottom:10px;}
.ws-step-card .ws-step-time{
  font-family:var(--font-accent); font-weight:600; font-size:11px;
  color:rgba(15,15,15,0.4); background:rgba(15,41,66,0.06); padding:4px 10px; border-radius:20px;
  transition:color .35s ease, background .35s ease;
}
.ws-step-card:hover .ws-step-time{color:var(--signalgelb); background:rgba(255,164,32,0.14);}
.ws-step-card h4{font-family:var(--font-headline); font-weight:900; font-size:22px; margin-bottom:0; color:var(--neverything);}
.ws-step-card .ws-step-detail{max-height:0; opacity:0; overflow:hidden; transition:max-height .45s ease, opacity .3s ease, margin-top .45s ease; position:relative; z-index:2;}
.ws-step-card:hover .ws-step-detail{max-height:260px; opacity:1; margin-top:16px;}
.ws-step-card .ws-step-detail p{font-size:14px; line-height:1.6; color:rgba(15,15,15,0.6); margin:0 0 14px;}
.ws-step-card .ws-step-num{
  position:absolute; right:18px; bottom:-4px; font-family:var(--font-headline); font-weight:800;
  font-size:130px; line-height:1; color:var(--signalgelb); z-index:1; user-select:none;
  transition:color .4s ease;
}
.ws-step-card:hover .ws-step-num{color:rgba(15,41,66,0.08);}

/* --- Reporting-Mock (Transparenz) --- */
.ws-dash-mock{background:#fff; border-radius:20px; border:1px solid rgba(15,15,15,0.08); box-shadow:0 24px 60px rgba(15,15,15,0.1); overflow:hidden;}
.ws-dash-mock .dash-topbar{display:flex; justify-content:space-between; align-items:center; gap:12px; padding:16px 20px; background:var(--midnight-navy);}
.ws-dash-mock .dash-title{font-family:var(--font-headline); font-weight:700; font-size:13px; color:var(--orchid-white);}
.ws-dash-mock .dash-daterange{font-size:11px; color:rgba(255,252,242,0.55); background:rgba(255,252,242,0.08); padding:5px 10px; border-radius:20px;}
.ws-dash-mock .dash-body{display:grid; grid-template-columns:1.2fr 1fr; gap:14px; padding:16px;}
.ws-dash-mock .dash-panel{background:rgba(15,41,66,0.03); border:1px solid rgba(15,41,66,0.1); border-radius:12px; padding:14px;}
.ws-dash-mock .dash-panel-table{grid-column:1 / -1;}
.ws-dash-mock .dash-panel-head{font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:0.03em; color:rgba(15,41,66,0.55); margin-bottom:12px; display:flex; justify-content:space-between;}
.ws-dash-mock .dash-panel-head .sort{color:rgba(15,41,66,0.35); font-size:9px;}
.ws-dash-mock .rep-bars{display:flex; align-items:flex-end; gap:8px; height:84px;}
.ws-dash-mock .rep-bar{flex:1; background:rgba(15,41,66,0.12); border-radius:4px 4px 0 0;}
.ws-dash-mock .rep-bar.hi{background:var(--signalgelb);}
.ws-dash-mock .dash-kpi-grid{display:grid; grid-template-columns:1fr 1fr; gap:10px;}
.ws-dash-mock .dash-kpi{background:#fff; border:1px solid rgba(15,41,66,0.08); border-radius:8px; padding:8px 10px;}
.ws-dash-mock .dash-kpi .lbl{display:block; font-size:9px; color:rgba(15,15,15,0.45); margin-bottom:4px;}
.ws-dash-mock .dash-kpi .val{display:block; font-family:var(--font-headline); font-weight:800; font-size:15px; color:var(--neverything);}
.ws-dash-mock .dash-table-row{display:grid; grid-template-columns:60px 1fr; align-items:center; gap:10px; height:16px; margin-bottom:10px;}
.ws-dash-mock .dash-table-row:last-child{margin-bottom:0;}
.ws-dash-mock .dash-table-row span:first-child{height:8px; border-radius:4px; background:rgba(15,41,66,0.08);}
.ws-dash-mock .dash-table-row .bar{height:8px; border-radius:4px; background:var(--signalgelb);}
.ws-check-split{display:grid; grid-template-columns:0.9fr 1.1fr; gap:64px; align-items:stretch;}
@media (max-width:900px){ .ws-check-split{grid-template-columns:1fr;} }
.ws-check-split h2{font-size:clamp(26px,3.4vw,38px); font-weight:800; line-height:1.2; margin:0 0 16px; color:var(--neverything);}
.ws-check-split h2 em{font-style:italic; font-family:var(--font-headline); font-weight:400; color:var(--signalgelb);}
.ws-check-split .ws-sub{font-size:16px; color:rgba(15,15,15,0.5); margin:0 0 28px;}
.ws-check-list{display:flex; flex-direction:column; gap:18px;}
.ws-check-item{display:flex; align-items:flex-start; gap:14px;}
.ws-check-item .mark{flex-shrink:0; width:26px; height:26px; border-radius:8px; background:rgba(15,41,66,0.06); display:flex; align-items:center; justify-content:center; margin-top:2px;}
.ws-check-item .mark img{display:block;}
.ws-check-item p{margin:0; font-size:15px; line-height:1.6; color:rgba(15,15,15,0.75);}
.ws-check-item p strong{color:var(--midnight-navy);}

/* ---------- PERFORMANCE-LEISTUNGEN: Regionales Online Marketing (aus SEA-Template abgeleitet) ---------- */
.rb-calc-slider:last-of-type{margin-bottom:0;}
.rb-calc-slider-label{display:flex; align-items:center; justify-content:space-between; font-size:13px; color:rgba(15,15,15,0.75); margin-bottom:10px;}
.rb-calc-slider-label .val{font-family:var(--font-accent); font-weight:700; color:var(--midnight-navy); background:rgba(15,41,66,0.06); padding:3px 11px; border-radius:20px; font-size:12px;}
.rb-calc-slider input[type=range]{-webkit-appearance:none; appearance:none; width:100%; height:4px; border-radius:2px; background:rgba(15,41,66,0.12); outline:none; cursor:pointer; margin:0;}
.rb-calc-slider input[type=range]::-webkit-slider-thumb{-webkit-appearance:none; width:18px; height:18px; border-radius:50%; background:var(--signalgelb); cursor:pointer; border:3px solid #fff; box-shadow:0 1px 6px rgba(0,0,0,0.3);}
.rb-calc-slider input[type=range]::-moz-range-thumb{width:18px; height:18px; border-radius:50%; background:var(--signalgelb); cursor:pointer; border:3px solid #fff; box-shadow:0 1px 6px rgba(0,0,0,0.3);}
.rb-calc-result{margin-top:18px; padding-top:18px; border-top:1px dashed rgba(255,164,32,0.4); display:flex; align-items:center; justify-content:space-between;}
.rb-calc-result .label{font-size:13px; color:rgba(15,15,15,0.6);}
.rb-calc-result .num{font-family:var(--font-headline); font-weight:800; font-size:28px; color:var(--signalgelb);}

/* ---------- PERFORMANCE-LEISTUNGEN: Regionales Online Marketing (Template im Developios-Stil, wird auf die anderen Leistungsseiten übertragen) ---------- */
body.rom-page{background:#F6F4EF;}
body.rom-page .prod-hero{background:#F6F4EF; border-bottom:none;}
.rom-section{padding:32px 0;}
.rom-eyebrow{
  font-family:var(--font-accent); font-weight:700; text-transform:uppercase;
  letter-spacing:0.08em; font-size:13px; color:var(--signalgelb); margin-bottom:24px; display:block;
}

/* --- Bewertungs-Badge im Hero --- */
.rom-rating-badge{display:inline-flex; align-items:center; gap:10px; background:#fff; border:1px solid rgba(15,15,15,0.08); border-radius:999px; padding:8px 16px 8px 8px; box-shadow:0 8px 24px rgba(15,15,15,0.06);}
.rom-rating-badge .stars{color:var(--signalgelb); font-size:13px; letter-spacing:1px;}
.rom-rating-badge .txt{font-size:12px; color:rgba(15,15,15,0.55); font-family:var(--font-accent);}
.rom-rating-badge .txt strong{color:var(--neverything); font-weight:700;}

.rom-split{display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:start;}
@media (max-width:900px){ .rom-split{grid-template-columns:1fr;} }
.rom-split h2{font-size:clamp(24px,3vw,34px); margin:0 0 16px; color:var(--neverything);}
.rom-split .rom-body-text{font-size:16px; line-height:1.7; color:rgba(15,15,15,0.55); margin-bottom:18px;}
.rom-split .rom-body-text:last-child{margin-bottom:0;}
.rom-split .rom-body-text strong{color:var(--neverything); font-weight:700;}

/* --- Logo-Marquee (Kunden) --- */
.rom-logo-marquee-wrap{overflow:hidden; mask-image:linear-gradient(to right, transparent, #000 8%, #000 92%, transparent); padding:8px 0;}
.rom-logo-marquee-track{display:flex; align-items:center; width:max-content; gap:64px; animation:seaLogoMarqueeScroll 42s linear infinite;}
.rom-logo-marquee-track img{height:36px; width:auto; display:block; opacity:0.55; filter:grayscale(1); transition:opacity .25s ease, filter .25s ease;}
.rom-logo-marquee-track img:hover{opacity:1; filter:grayscale(0);}
@keyframes seaLogoMarqueeScroll{0%{transform:translateX(0);}100%{transform:translateX(-50%);}}
@media (prefers-reduced-motion:reduce){ .rom-logo-marquee-track{animation:none;} }

/* --- Baustein: eine große Stat-Card mit 2-Spalten-Raster (Bewiesene Wirkung) --- */
.rom-stats-panel{
  background:transparent; border-radius:32px; padding:48px;
  width:calc(100vw - 60px); margin-left:calc(-50vw + 50% + 30px); margin-right:calc(-50vw + 50% + 30px);
}
@media (max-width:1100px){ .rom-stats-panel{padding:32px 24px;} }
.rom-stats-panel-inner{max-width:calc(var(--max-w) - 64px); margin:0 auto;}
.rom-stats-panel-head{display:flex; justify-content:space-between; align-items:flex-end; gap:40px; flex-wrap:wrap;}
.rom-stats-panel-head h2{font-size:clamp(24px,3.2vw,36px); margin:0 0 8px; color:var(--neverything); font-weight:800; max-width:440px;}
.rom-stats-panel-head h2 em{font-style:italic; font-weight:400; color:var(--signalgelb);}
.rom-stats-panel-head p{font-size:15px; color:rgba(15,15,15,0.5); margin:0; max-width:340px; text-align:right;}
@media (max-width:700px){ .rom-stats-panel-head p{text-align:left;} }
.rom-stats-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-top:32px;}
@media (max-width:900px){ .rom-stats-grid{grid-template-columns:1fr 1fr;} }
@media (max-width:500px){ .rom-stats-grid{grid-template-columns:1fr;} }
.rom-stat-cell{padding:28px 24px; background:#fff; border:1px solid rgba(15,15,15,0.06); border-radius:18px; box-shadow:0 16px 40px rgba(15,15,15,0.05);}
.rom-stat-cell .cap{font-family:var(--font-headline); font-weight:800; font-size:16px; color:var(--neverything); margin-bottom:14px; display:block;}
.rom-stat-cell .figure{display:inline-flex; align-items:center; gap:6px; background:rgba(255,164,32,0.12); color:var(--signalgelb); font-family:var(--font-headline); font-weight:800; font-size:20px; padding:6px 16px; border-radius:999px; margin-bottom:10px;}
.rom-stat-cell .sub{display:block; font-size:13px; color:rgba(15,15,15,0.5);}

/* --- Baustein: dunkle Card mit vertikalem Feature-Stack (Warum unser Ansatz funktioniert) --- */
.rom-dark{
  background:var(--midnight-navy); color:var(--orchid-white);
  border-radius:32px; padding:56px 48px 64px;
  width:calc(100vw - 60px); margin-left:calc(-50vw + 50% + 30px); margin-right:calc(-50vw + 50% + 30px);
}
@media (max-width:1100px){ .rom-dark{padding:40px 24px 48px;} }
.rom-dark-head{max-width:calc(var(--max-w) - 64px); margin:0 auto 40px; text-align:center;}
.rom-dark-head h2{font-family:var(--font-headline); font-size:clamp(28px,3.8vw,44px); font-weight:800; margin:0;}
.rom-dark-head h2 em{font-style:italic; font-weight:400; color:var(--signalgelb);}
.rom-feature-stack{display:grid; grid-template-columns:repeat(3,1fr); gap:16px; max-width:calc(var(--max-w) - 64px); margin:0 auto;}
@media (max-width:900px){ .rom-feature-stack{grid-template-columns:1fr 1fr;} }
@media (max-width:600px){ .rom-feature-stack{grid-template-columns:1fr;} }
.rom-feature-card{background:#fff; border-radius:20px; padding:28px 26px; color:var(--neverything); display:block; transition:transform .3s ease, box-shadow .3s ease;}
.rom-feature-card:hover{transform:translateY(-6px); box-shadow:0 20px 40px rgba(0,0,0,0.18);}
.rom-feature-card .icon{margin-bottom:18px;}
.rom-feature-card:hover .icon img{animation:spIconPulse .6s ease-in-out;}
.rom-feature-card .icon{width:44px; height:44px; display:flex; align-items:center; justify-content:center; flex-shrink:0;}
.rom-feature-card .icon img{width:28px; height:28px; display:block;}
.rom-feature-card h4{font-size:18px; font-weight:700; margin:0 0 8px;}
.rom-feature-card p{font-size:14px; line-height:1.65; color:rgba(15,15,15,0.6); margin:0;}

/* --- Kopfzeile: Eyebrow links, große zweizeilige Headline rechts (Was wir liefern) --- */
.rom-liefern-head{display:grid; grid-template-columns:400px 1fr; gap:24px; align-items:start; margin-bottom:40px;}
@media (max-width:700px){ .rom-liefern-head{grid-template-columns:1fr;} }
.rom-liefern-head .rom-eyebrow{white-space:nowrap; margin-bottom:0; padding-top:6px;}

/* --- Baustein: Akkordeon (Was wir liefern) --- */
.rom-acc{border-top:1px solid rgba(15,15,15,0.1);}
.rom-acc-item{border-bottom:1px solid rgba(15,15,15,0.1); overflow:visible;}
.rom-acc-head{
  cursor:pointer; display:grid; grid-template-columns:400px 1fr auto; gap:24px; align-items:center;
  padding:26px 44px 26px 4px; position:relative;
}
@media (max-width:900px){ .rom-acc-head{grid-template-columns:40px 1fr auto;} }
.rom-acc-head .num{font-family:var(--font-accent); font-weight:700; font-size:clamp(17px,2vw,22px); color:rgba(15,15,15,0.35);}
.rom-acc-head .title{font-family:var(--font-headline); font-weight:700; font-size:clamp(17px,2vw,22px); color:var(--neverything); min-width:0;}
.rom-acc-item.open .rom-acc-head .num{color:var(--signalgelb);}
.rom-acc-head .chev{
  width:34px; height:34px; border-radius:50%; background:rgba(15,41,66,0.05); flex-shrink:0; position:relative;
  transition:transform .3s ease, background .3s ease;
}
.rom-acc-head .chev::before, .rom-acc-head .chev::after{content:''; position:absolute; top:44%; width:7px; height:1.6px; background:var(--neverything);}
.rom-acc-head .chev::before{left:50%; transform:translate(-85%,-50%) rotate(45deg);}
.rom-acc-head .chev::after{left:50%; transform:translate(-15%,-50%) rotate(-45deg);}
.rom-acc-item.open .chev{background:var(--signalgelb); transform:rotate(180deg);}
.rom-acc-body{display:grid; grid-template-rows:0fr; transition:grid-template-rows .4s ease;}
.rom-acc-body .inner{overflow:hidden;}
.rom-acc-item.open .rom-acc-body{grid-template-rows:1fr;}
.rom-acc-body p{margin:0; padding:0 44px 28px 424px; font-size:15px; line-height:1.7; color:rgba(15,15,15,0.6); max-width:820px;}
@media (max-width:900px){ .rom-acc-body p{padding-left:64px;} }
.rom-acc-body strong{color:var(--midnight-navy);}

/* --- Baustein: Foto + schlichte Checkliste (Kommt Ihnen bekannt vor?) --- */
.rom-pain-split{display:grid; grid-template-columns:0.9fr 1.1fr; gap:56px; align-items:stretch;}
@media (max-width:900px){ .rom-pain-split{grid-template-columns:1fr;} }
.rom-pain-media{
  border-radius:28px; overflow:hidden; min-height:320px; background:var(--midnight-navy) center/cover no-repeat;
}
.rom-pain-head{margin:0 0 28px;}
.rom-pain-head h2{font-size:clamp(26px,3.6vw,40px); font-weight:800; margin:0 0 16px; color:var(--neverything);}
.rom-pain-head h2 em{font-style:italic; font-weight:400; color:var(--signalgelb);}
.rom-pain-head p{font-size:16px; line-height:1.7; color:rgba(15,15,15,0.55); margin:0;}
.rom-pain-list{display:flex; flex-direction:column; gap:18px; margin:32px 0;}
.rom-pain-list .row{display:flex; align-items:flex-start; gap:14px; font-size:15px; line-height:1.6; color:rgba(15,15,15,0.7);}
.rom-pain-list .row strong{color:var(--neverything);}
.rom-pain-list .mark{flex-shrink:0; width:26px; height:26px; border-radius:8px; background:rgba(15,41,66,0.06); display:flex; align-items:center; justify-content:center; margin-top:2px;}
.rom-pain-list .mark img{display:block;}

/* --- Baustein: Pill-CTA (durchgehende Leiste, statt Kontakt-Card) --- */
.rom-cta-pill{
  background:var(--signalgelb); border-radius:999px; padding:10px 10px 10px 28px;
  display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap;
}
.rom-cta-pill .txt{font-family:var(--font-headline); font-weight:800; font-size:18px; color:var(--neverything);}
.rom-cta-pill .arrow{
  width:52px; height:52px; border-radius:50%; background:var(--neverything); color:#fff; flex-shrink:0;
  display:flex; align-items:center; justify-content:center; font-size:20px; transition:transform .2s ease;
}
.rom-cta-pill:hover .arrow{transform:rotate(45deg);}
.rom-cta-contact{display:flex; align-items:center; gap:10px; margin-top:18px; font-size:13px; color:rgba(15,15,15,0.55);}
.rom-cta-contact strong{color:var(--neverything);}
.rom-cta-contact a{color:var(--midnight-navy); text-decoration:underline;}

/* --- Baustein: dunkle "Unterschied"-Card mit Stat-Trio --- */
.rom-diff{
  background:var(--midnight-navy); color:var(--orchid-white); border-radius:32px; padding:72px 64px; text-align:center;
  width:calc(100vw - 60px); margin-left:calc(-50vw + 50% + 30px); margin-right:calc(-50vw + 50% + 30px);
}
@media (max-width:1100px){ .rom-diff{padding:48px 32px;} }
.rom-diff h2{font-family:var(--font-headline); font-size:clamp(26px,3.4vw,40px); font-weight:800; margin:0 auto 20px; max-width:640px; line-height:1.2;}
.rom-diff h2 em{font-style:italic; font-weight:400; color:var(--signalgelb);}
.rom-diff p{font-size:16px; line-height:1.7; color:rgba(255,252,242,0.65); max-width:680px; margin:0 auto 44px;}
.rom-diff-trio{display:flex; gap:20px; flex-wrap:wrap; justify-content:center; max-width:calc(var(--max-w) - 64px); margin:0 auto;}
.rom-diff-trio .cell{flex:1; min-width:200px; text-align:left; background:#fff; border:1px solid rgba(15,15,15,0.06); border-radius:18px; padding:24px; box-shadow:0 16px 40px rgba(15,15,15,0.1);}
.rom-diff-trio .num{display:block; font-family:var(--font-headline); font-weight:800; font-size:clamp(18px,1.8vw,22px); color:var(--signalgelb); margin-bottom:8px; white-space:nowrap;}
.rom-diff-trio .lbl{font-size:13px; color:rgba(15,15,15,0.6); line-height:1.55;}

/* --- Baustein: Prozess-Karussell (So funktioniert es) --- */
.rom-process-head{margin-bottom:8px;}
.rom-process-head h2{font-size:clamp(26px,4vw,44px); font-weight:800; margin:0 0 16px; color:var(--neverything); line-height:1.1;}
.rom-process-head h2 em{font-style:italic; font-weight:400; color:rgba(15,15,15,0.4);}
.rom-process-head p{font-size:15px; color:rgba(15,15,15,0.5); max-width:640px; margin:0 0 32px;}

/* --- Schritt-Cards (So funktioniert es) — Look wie bei ReBounce/Shopping PLUS/Affiliate --- */
.rom-step-cards{display:flex; gap:20px;}
@media (max-width:1100px){ .rom-step-cards{flex-wrap:wrap;} .rom-step-cards .rom-step-card{flex-basis:calc(50% - 10px);} }
@media (max-width:600px){ .rom-step-cards{flex-direction:column;} .rom-step-cards .rom-step-card{flex-basis:auto;} }
.rom-step-card{
  background:#fff; border:1px solid rgba(15,15,15,0.08); border-radius:20px; padding:26px;
  position:relative; overflow:hidden; min-height:460px; display:flex; flex-direction:column;
  flex:1 1 0; min-width:0;
  transition:transform .35s ease, box-shadow .35s ease, background .35s ease, flex-grow .45s ease;
}
.rom-step-card:hover{transform:translateY(-4px); box-shadow:0 24px 48px rgba(0,0,0,0.12); flex-grow:1.6;}
.rom-step-card .rom-step-top{position:relative; z-index:2;}
.rom-step-card .rom-step-label{display:flex; align-items:center; gap:8px; margin-bottom:10px;}
.rom-step-card .rom-step-time{
  font-family:var(--font-accent); font-weight:600; font-size:11px;
  color:rgba(15,15,15,0.4); background:rgba(15,41,66,0.06); padding:4px 10px; border-radius:20px;
  transition:color .35s ease, background .35s ease;
}
.rom-step-card:hover .rom-step-time{color:var(--signalgelb); background:rgba(255,164,32,0.14);}
.rom-step-card h4{font-family:var(--font-headline); font-weight:900; font-size:22px; margin-bottom:0; color:var(--neverything);}
.rom-step-card .rom-step-detail{max-height:0; opacity:0; overflow:hidden; transition:max-height .45s ease, opacity .3s ease, margin-top .45s ease; position:relative; z-index:2;}
.rom-step-card:hover .rom-step-detail{max-height:260px; opacity:1; margin-top:16px;}
.rom-step-card .rom-step-detail p{font-size:14px; line-height:1.6; color:rgba(15,15,15,0.6); margin:0 0 14px;}
.rom-step-card .rom-step-num{
  position:absolute; right:18px; bottom:-4px; font-family:var(--font-headline); font-weight:800;
  font-size:130px; line-height:1; color:var(--signalgelb); z-index:1; user-select:none;
  transition:color .4s ease;
}
.rom-step-card:hover .rom-step-num{color:rgba(15,41,66,0.08);}

.rom-check-split{display:grid; grid-template-columns:0.9fr 1.1fr; gap:64px; align-items:stretch;}
@media (max-width:900px){ .rom-check-split{grid-template-columns:1fr;} }
.rom-check-split h2{font-size:clamp(26px,3.4vw,38px); font-weight:800; line-height:1.2; margin:0 0 16px; color:var(--neverything);}
.rom-check-split h2 em{font-style:italic; font-family:var(--font-headline); font-weight:400; color:var(--signalgelb);}
.rom-check-split .rom-sub{font-size:16px; color:rgba(15,15,15,0.5); margin:0 0 28px;}

/* --- Beratungs-Mock (Reporting-Ersatz für Regional) --- */
.rom-consult-mock{background:#fff; border-radius:20px; border:1px solid rgba(15,15,15,0.08); box-shadow:0 24px 60px rgba(15,15,15,0.1); overflow:hidden; height:100%; display:flex; flex-direction:column;}
.rom-consult-mock .consult-top{display:flex; align-items:center; gap:12px; padding:20px 22px; background:var(--midnight-navy);}
.rom-consult-mock .consult-avatar{width:38px; height:38px; border-radius:50%; background-size:cover; background-position:center; flex-shrink:0;}
.rom-consult-mock .consult-who{display:flex; flex-direction:column; gap:2px;}
.rom-consult-mock .consult-name{font-family:var(--font-headline); font-weight:700; font-size:13px; color:var(--orchid-white);}
.rom-consult-mock .consult-role{font-size:11px; color:rgba(255,252,242,0.55);}
.rom-consult-mock .consult-body{padding:24px 22px; display:flex; flex-direction:column; gap:16px; flex:1;}
.rom-consult-mock .consult-line{display:flex; gap:12px; align-items:flex-start;}
.rom-consult-mock .consult-line .dot{width:8px; height:8px; border-radius:50%; background:var(--signalgelb); margin-top:6px; flex-shrink:0;}
.rom-consult-mock .consult-line p{margin:0; font-size:14px; line-height:1.5; color:rgba(15,15,15,0.65);}
.rom-consult-mock .consult-quote{margin-top:auto; padding:16px 18px; background:rgba(15,41,66,0.04); border-radius:12px; font-size:13px; font-style:italic; color:rgba(15,15,15,0.55); line-height:1.5;}

/* --- Reporting-Mock (Transparenz) --- */
.rom-dash-mock{background:#fff; border-radius:20px; border:1px solid rgba(15,15,15,0.08); box-shadow:0 24px 60px rgba(15,15,15,0.1); overflow:hidden;}
.rom-dash-mock .dash-topbar{display:flex; justify-content:space-between; align-items:center; gap:12px; padding:16px 20px; background:var(--midnight-navy);}
.rom-dash-mock .dash-title{font-family:var(--font-headline); font-weight:700; font-size:13px; color:var(--orchid-white);}
.rom-dash-mock .dash-daterange{font-size:11px; color:rgba(255,252,242,0.55); background:rgba(255,252,242,0.08); padding:5px 10px; border-radius:20px;}
.rom-dash-mock .dash-body{display:grid; grid-template-columns:1.2fr 1fr; gap:14px; padding:16px;}
.rom-dash-mock .dash-panel{background:rgba(15,41,66,0.03); border:1px solid rgba(15,41,66,0.1); border-radius:12px; padding:14px;}
.rom-dash-mock .dash-panel-table{grid-column:1 / -1;}
.rom-dash-mock .dash-panel-head{font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:0.03em; color:rgba(15,41,66,0.55); margin-bottom:12px; display:flex; justify-content:space-between;}
.rom-dash-mock .dash-panel-head .sort{color:rgba(15,41,66,0.35); font-size:9px;}
.rom-dash-mock .rep-bars{display:flex; align-items:flex-end; gap:8px; height:84px;}
.rom-dash-mock .rep-bar{flex:1; background:rgba(15,41,66,0.12); border-radius:4px 4px 0 0;}
.rom-dash-mock .rep-bar.hi{background:var(--signalgelb);}
.rom-dash-mock .dash-kpi-grid{display:grid; grid-template-columns:1fr 1fr; gap:10px;}
.rom-dash-mock .dash-kpi{background:#fff; border:1px solid rgba(15,41,66,0.08); border-radius:8px; padding:8px 10px;}
.rom-dash-mock .dash-kpi .lbl{display:block; font-size:9px; color:rgba(15,15,15,0.45); margin-bottom:4px;}
.rom-dash-mock .dash-kpi .val{display:block; font-family:var(--font-headline); font-weight:800; font-size:15px; color:var(--neverything);}
.rom-dash-mock .dash-table-row{display:grid; grid-template-columns:60px 1fr; align-items:center; gap:10px; height:16px; margin-bottom:10px;}
.rom-dash-mock .dash-table-row:last-child{margin-bottom:0;}
.rom-dash-mock .dash-table-row span:first-child{height:8px; border-radius:4px; background:rgba(15,41,66,0.08);}
.rom-dash-mock .dash-table-row .bar{height:8px; border-radius:4px; background:var(--signalgelb);}
/* ---------- PERFORMANCE-LEISTUNGEN: Performance Marketing Hub (aus SEA-Template abgeleitet) ----------*/
body.pm-page{background:#F6F4EF;}
body.pm-page .prod-hero{background:#F6F4EF; border-bottom:none;}
.pm-section{padding:32px 0;}
.pm-eyebrow{
  font-family:var(--font-accent); font-weight:700; text-transform:uppercase;
  letter-spacing:0.08em; font-size:13px; color:var(--signalgelb); margin-bottom:24px; display:block;
}

/* --- Bewertungs-Badge im Hero --- */
.pm-rating-badge{display:inline-flex; align-items:center; gap:10px; background:#fff; border:1px solid rgba(15,15,15,0.08); border-radius:999px; padding:8px 16px 8px 8px; box-shadow:0 8px 24px rgba(15,15,15,0.06);}
.pm-rating-badge .stars{color:var(--signalgelb); font-size:13px; letter-spacing:1px;}
.pm-rating-badge .txt{font-size:12px; color:rgba(15,15,15,0.55); font-family:var(--font-accent);}
.pm-rating-badge .txt strong{color:var(--neverything); font-weight:700;}

.pm-split{display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:start;}
@media (max-width:900px){ .pm-split{grid-template-columns:1fr;} }
.pm-split h2{font-size:clamp(24px,3vw,34px); margin:0 0 16px; color:var(--neverything);}
.pm-split .pm-body-text{font-size:16px; line-height:1.7; color:rgba(15,15,15,0.55); margin-bottom:18px;}
.pm-split .pm-body-text:last-child{margin-bottom:0;}
.pm-split .pm-body-text strong{color:var(--neverything); font-weight:700;}

/* --- Logo-Marquee (Kunden) --- */
.pm-logo-marquee-wrap{overflow:hidden; mask-image:linear-gradient(to right, transparent, #000 8%, #000 92%, transparent); padding:8px 0;}
.pm-logo-marquee-track{display:flex; align-items:center; width:max-content; gap:64px; animation:pmLogoMarqueeScroll 42s linear infinite;}
.pm-logo-marquee-track img{height:36px; width:auto; display:block; opacity:0.55; filter:grayscale(1); transition:opacity .25s ease, filter .25s ease;}
.pm-logo-marquee-track img:hover{opacity:1; filter:grayscale(0);}
@keyframes pmLogoMarqueeScroll{0%{transform:translateX(0);}100%{transform:translateX(-50%);}}
@media (prefers-reduced-motion:reduce){ .pm-logo-marquee-track{animation:none;} }

/* --- Baustein: eine große Stat-Card mit 2-Spalten-Raster (Bewiesene Wirkung) --- */
.pm-stats-panel{
  background:transparent; border-radius:32px; padding:48px;
  width:calc(100vw - 60px); margin-left:calc(-50vw + 50% + 30px); margin-right:calc(-50vw + 50% + 30px);
}
@media (max-width:1100px){ .pm-stats-panel{padding:32px 24px;} }
.pm-stats-panel-inner{max-width:calc(var(--max-w) - 64px); margin:0 auto;}
.pm-stats-panel-head{display:flex; justify-content:space-between; align-items:flex-end; gap:40px; flex-wrap:wrap;}
.pm-stats-panel-head h2{font-size:clamp(24px,3.2vw,36px); margin:0 0 8px; color:var(--neverything); font-weight:800; max-width:440px;}
.pm-stats-panel-head h2 em{font-style:italic; font-weight:400; color:var(--signalgelb);}
.pm-stats-panel-head p{font-size:15px; color:rgba(15,15,15,0.5); margin:0; max-width:340px; text-align:right;}
@media (max-width:700px){ .pm-stats-panel-head p{text-align:left;} }
.pm-stats-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-top:32px;}
@media (max-width:900px){ .pm-stats-grid{grid-template-columns:1fr 1fr;} }
@media (max-width:500px){ .pm-stats-grid{grid-template-columns:1fr;} }
.pm-stat-cell{padding:28px 24px; background:#fff; border:1px solid rgba(15,15,15,0.06); border-radius:18px; box-shadow:0 16px 40px rgba(15,15,15,0.05);}
.pm-stat-cell .cap{font-family:var(--font-headline); font-weight:800; font-size:16px; color:var(--neverything); margin-bottom:14px; display:block;}
.pm-stat-cell .figure{display:inline-flex; align-items:center; gap:6px; background:rgba(255,164,32,0.12); color:var(--signalgelb); font-family:var(--font-headline); font-weight:800; font-size:20px; padding:6px 16px; margin-left:-16px; border-radius:999px; margin-bottom:10px;}
.pm-stat-cell .sub{display:block; font-size:13px; color:rgba(15,15,15,0.5);}

/* --- Baustein: dunkle Card mit vertikalem Feature-Stack (Warum unser Ansatz funktioniert) --- */
.pm-dark{
  background:var(--midnight-navy); color:var(--orchid-white);
  border-radius:32px; padding:56px 48px 64px;
  width:calc(100vw - 60px); margin-left:calc(-50vw + 50% + 30px); margin-right:calc(-50vw + 50% + 30px);
}
@media (max-width:1100px){ .pm-dark{padding:40px 24px 48px;} }
.pm-dark-head{max-width:calc(var(--max-w) - 64px); margin:0 auto 40px; text-align:center;}
.pm-dark-head h2{font-family:var(--font-headline); font-size:clamp(28px,3.8vw,44px); font-weight:800; margin:0;}
.pm-dark-head h2 em{font-style:italic; font-weight:400; color:var(--signalgelb);}
.pm-feature-stack{display:grid; grid-template-columns:repeat(3,1fr); gap:16px; max-width:calc(var(--max-w) - 64px); margin:0 auto;}
@media (max-width:900px){ .pm-feature-stack{grid-template-columns:1fr 1fr;} }
@media (max-width:600px){ .pm-feature-stack{grid-template-columns:1fr;} }
.pm-feature-card{background:#fff; border-radius:20px; padding:28px 26px; color:var(--neverything); display:block; transition:transform .3s ease, box-shadow .3s ease;}
.pm-feature-card:hover{transform:translateY(-6px); box-shadow:0 20px 40px rgba(0,0,0,0.18);}
.pm-feature-card .icon{margin-bottom:18px;}
.pm-feature-card:hover .icon img{animation:spIconPulse .6s ease-in-out;}
.pm-feature-card .icon{width:44px; height:44px; display:flex; align-items:center; justify-content:center; flex-shrink:0;}
.pm-feature-card .icon img{width:28px; height:28px; display:block;}
.pm-feature-card h4{font-size:18px; font-weight:700; margin:0 0 8px;}
.pm-feature-card p{font-size:14px; line-height:1.65; color:rgba(15,15,15,0.6); margin:0;}

/* --- Kopfzeile: Eyebrow links, große zweizeilige Headline rechts (Was wir liefern) --- */
.pm-liefern-head{display:grid; grid-template-columns:400px 1fr; gap:24px; align-items:start; margin-bottom:40px;}
@media (max-width:700px){ .pm-liefern-head{grid-template-columns:1fr;} }
.pm-liefern-head .pm-eyebrow{white-space:nowrap; margin-bottom:0; padding-top:6px;}

/* --- Baustein: Akkordeon (Was wir liefern) --- */
.pm-acc{border-top:1px solid rgba(15,15,15,0.1);}
.pm-acc-item{border-bottom:1px solid rgba(15,15,15,0.1); overflow:visible;}
.pm-acc-head{
  cursor:pointer; display:grid; grid-template-columns:400px 1fr auto; gap:24px; align-items:center;
  padding:26px 44px 26px 4px; position:relative;
}
@media (max-width:900px){ .pm-acc-head{grid-template-columns:40px 1fr auto;} }
.pm-acc-head .num{font-family:var(--font-accent); font-weight:700; font-size:clamp(17px,2vw,22px); color:rgba(15,15,15,0.35);}
.pm-acc-head .title{font-family:var(--font-headline); font-weight:700; font-size:clamp(17px,2vw,22px); color:var(--neverything); min-width:0;}
.pm-acc-item.open .pm-acc-head .num{color:var(--signalgelb);}
.pm-acc-head .chev{
  width:34px; height:34px; border-radius:50%; background:rgba(15,41,66,0.05); flex-shrink:0; position:relative;
  transition:transform .3s ease, background .3s ease;
}
.pm-acc-head .chev::before, .pm-acc-head .chev::after{content:''; position:absolute; top:44%; width:7px; height:1.6px; background:var(--neverything);}
.pm-acc-head .chev::before{left:50%; transform:translate(-85%,-50%) rotate(45deg);}
.pm-acc-head .chev::after{left:50%; transform:translate(-15%,-50%) rotate(-45deg);}
.pm-acc-item.open .chev{background:var(--signalgelb); transform:rotate(180deg);}
.pm-acc-body{display:grid; grid-template-rows:0fr; transition:grid-template-rows .4s ease;}
.pm-acc-body .inner{overflow:hidden;}
.pm-acc-item.open .pm-acc-body{grid-template-rows:1fr;}
.pm-acc-body p{margin:0; padding:0 44px 28px 424px; font-size:15px; line-height:1.7; color:rgba(15,15,15,0.6); max-width:820px;}
@media (max-width:900px){ .pm-acc-body p{padding-left:64px;} }
.pm-acc-body strong{color:var(--midnight-navy);}

/* --- Baustein: Foto + schlichte Checkliste (Kommt Ihnen bekannt vor?) --- */
.pm-pain-split{display:grid; grid-template-columns:0.9fr 1.1fr; gap:56px; align-items:stretch;}
@media (max-width:900px){ .pm-pain-split{grid-template-columns:1fr;} }
.pm-pain-media{
  border-radius:28px; overflow:hidden; min-height:320px; background:var(--midnight-navy) center/cover no-repeat;
}
.pm-pain-head{margin:0 0 28px;}
.pm-pain-head h2{font-size:clamp(26px,3.6vw,40px); font-weight:800; margin:0 0 16px; color:var(--neverything);}
.pm-pain-head h2 em{font-style:italic; font-weight:400; color:var(--signalgelb);}
.pm-pain-head p{font-size:16px; line-height:1.7; color:rgba(15,15,15,0.55); margin:0;}
.pm-pain-list{display:flex; flex-direction:column; gap:18px; margin:32px 0;}
.pm-pain-list .row{display:flex; align-items:flex-start; gap:14px; font-size:15px; line-height:1.6; color:rgba(15,15,15,0.7);}
.pm-pain-list .row strong{color:var(--neverything);}
.pm-pain-list .mark{flex-shrink:0; width:26px; height:26px; border-radius:8px; background:rgba(15,41,66,0.06); display:flex; align-items:center; justify-content:center; margin-top:2px;}
.pm-pain-list .mark img{display:block;}

/* --- Baustein: Pill-CTA (durchgehende Leiste, statt Kontakt-Card) --- */
.pm-cta-pill{
  background:var(--signalgelb); border-radius:999px; padding:10px 10px 10px 28px;
  display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap;
}
.pm-cta-pill .txt{font-family:var(--font-headline); font-weight:800; font-size:18px; color:var(--neverything);}
.pm-cta-pill .arrow{
  width:52px; height:52px; border-radius:50%; background:var(--neverything); color:#fff; flex-shrink:0;
  display:flex; align-items:center; justify-content:center; font-size:20px; transition:transform .2s ease;
}
.pm-cta-pill:hover .arrow{transform:rotate(45deg);}
.pm-cta-contact{display:flex; align-items:center; gap:10px; margin-top:18px; font-size:13px; color:rgba(15,15,15,0.55);}
.pm-cta-contact strong{color:var(--neverything);}
.pm-cta-contact a{color:var(--midnight-navy); text-decoration:underline;}

/* --- Baustein: dunkle "Unterschied"-Card mit Stat-Trio --- */
.pm-diff{
  background:var(--midnight-navy); color:var(--orchid-white); border-radius:32px; padding:72px 64px; text-align:center;
  width:calc(100vw - 60px); margin-left:calc(-50vw + 50% + 30px); margin-right:calc(-50vw + 50% + 30px);
}
@media (max-width:1100px){ .pm-diff{padding:48px 32px;} }
.pm-diff h2{font-family:var(--font-headline); font-size:clamp(26px,3.4vw,40px); font-weight:800; margin:0 auto 20px; max-width:640px; line-height:1.2;}
.pm-diff h2 em{font-style:italic; font-weight:400; color:var(--signalgelb);}
.pm-diff p{font-size:16px; line-height:1.7; color:rgba(255,252,242,0.65); max-width:680px; margin:0 auto 44px;}
.pm-diff-trio{display:flex; gap:20px; flex-wrap:wrap; justify-content:center; max-width:calc(var(--max-w) - 64px); margin:0 auto;}
.pm-diff-trio .cell{flex:1; min-width:200px; text-align:left; background:#fff; border:1px solid rgba(15,15,15,0.06); border-radius:18px; padding:24px; box-shadow:0 16px 40px rgba(15,15,15,0.1);}
.pm-diff-trio .num{display:block; font-family:var(--font-headline); font-weight:800; font-size:clamp(18px,1.8vw,22px); color:var(--signalgelb); margin-bottom:8px; white-space:nowrap;}
.pm-diff-trio .lbl{font-size:13px; color:rgba(15,15,15,0.6); line-height:1.55;}

/* --- Baustein: Prozess-Karussell (So funktioniert es) --- */
.pm-process-head{margin-bottom:8px;}
.pm-process-head h2{font-size:clamp(26px,4vw,44px); font-weight:800; margin:0 0 16px; color:var(--neverything); line-height:1.1;}
.pm-process-head h2 em{font-style:italic; font-weight:400; color:rgba(15,15,15,0.4);}
.pm-process-head p{font-size:15px; color:rgba(15,15,15,0.5); max-width:640px; margin:0 0 32px;}

/* --- Schritt-Cards (So funktioniert es) — Look wie bei ReBounce/Shopping PLUS/Affiliate --- */
.pm-step-cards{display:flex; gap:20px;}
@media (max-width:1100px){ .pm-step-cards{flex-wrap:wrap;} .pm-step-cards .pm-step-card{flex-basis:calc(50% - 10px);} }
@media (max-width:600px){ .pm-step-cards{flex-direction:column;} .pm-step-cards .pm-step-card{flex-basis:auto;} }
.pm-step-card{
  background:#fff; border:1px solid rgba(15,15,15,0.08); border-radius:20px; padding:26px;
  position:relative; overflow:hidden; min-height:460px; display:flex; flex-direction:column;
  flex:1 1 0; min-width:0;
  transition:transform .35s ease, box-shadow .35s ease, background .35s ease, flex-grow .45s ease;
}
.pm-step-card:hover{transform:translateY(-4px); box-shadow:0 24px 48px rgba(0,0,0,0.12); flex-grow:1.6;}
.pm-step-card .pm-step-top{position:relative; z-index:2;}
.pm-step-card .pm-step-label{display:flex; align-items:center; gap:8px; margin-bottom:10px;}
.pm-step-card .pm-step-time{
  font-family:var(--font-accent); font-weight:600; font-size:11px;
  color:rgba(15,15,15,0.4); background:rgba(15,41,66,0.06); padding:4px 10px; border-radius:20px;
  transition:color .35s ease, background .35s ease;
}
.pm-step-card:hover .pm-step-time{color:var(--signalgelb); background:rgba(255,164,32,0.14);}
.pm-step-card h4{font-family:var(--font-headline); font-weight:900; font-size:22px; margin-bottom:0; color:var(--neverything);}
.pm-step-card .pm-step-detail{max-height:0; opacity:0; overflow:hidden; transition:max-height .45s ease, opacity .3s ease, margin-top .45s ease; position:relative; z-index:2;}
.pm-step-card:hover .pm-step-detail{max-height:260px; opacity:1; margin-top:16px;}
.pm-step-card .pm-step-detail p{font-size:14px; line-height:1.6; color:rgba(15,15,15,0.6); margin:0 0 14px;}
.pm-step-card .pm-step-num{
  position:absolute; right:18px; bottom:-4px; font-family:var(--font-headline); font-weight:800;
  font-size:130px; line-height:1; color:var(--signalgelb); z-index:1; user-select:none;
  transition:color .4s ease;
}
.pm-step-card:hover .pm-step-num{color:rgba(15,41,66,0.08);}

/* --- Reporting-Mock (Transparenz) --- */
.pm-dash-mock{background:#fff; border-radius:20px; border:1px solid rgba(15,15,15,0.08); box-shadow:0 24px 60px rgba(15,15,15,0.1); overflow:hidden;}
.pm-dash-mock .dash-topbar{display:flex; justify-content:space-between; align-items:center; gap:12px; padding:16px 20px; background:var(--midnight-navy);}
.pm-dash-mock .dash-title{font-family:var(--font-headline); font-weight:700; font-size:13px; color:var(--orchid-white);}
.pm-dash-mock .dash-daterange{font-size:11px; color:rgba(255,252,242,0.55); background:rgba(255,252,242,0.08); padding:5px 10px; border-radius:20px;}
.pm-dash-mock .dash-body{display:grid; grid-template-columns:1.2fr 1fr; gap:14px; padding:16px;}
.pm-dash-mock .dash-panel{background:rgba(15,41,66,0.03); border:1px solid rgba(15,41,66,0.1); border-radius:12px; padding:14px;}
.pm-dash-mock .dash-panel-table{grid-column:1 / -1;}
.pm-dash-mock .dash-panel-head{font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:0.03em; color:rgba(15,41,66,0.55); margin-bottom:12px; display:flex; justify-content:space-between;}
.pm-dash-mock .dash-panel-head .sort{color:rgba(15,41,66,0.35); font-size:9px;}
.pm-dash-mock .rep-bars{display:flex; align-items:flex-end; gap:8px; height:84px;}
.pm-dash-mock .rep-bar{flex:1; background:rgba(15,41,66,0.12); border-radius:4px 4px 0 0;}
.pm-dash-mock .rep-bar.hi{background:var(--signalgelb);}
.pm-dash-mock .dash-kpi-grid{display:grid; grid-template-columns:1fr 1fr; gap:10px;}
.pm-dash-mock .dash-kpi{background:#fff; border:1px solid rgba(15,41,66,0.08); border-radius:8px; padding:8px 10px;}
.pm-dash-mock .dash-kpi .lbl{display:block; font-size:9px; color:rgba(15,15,15,0.45); margin-bottom:4px;}
.pm-dash-mock .dash-kpi .val{display:block; font-family:var(--font-headline); font-weight:800; font-size:15px; color:var(--neverything);}
.pm-dash-mock .dash-table-row{display:grid; grid-template-columns:60px 1fr; align-items:center; gap:10px; height:16px; margin-bottom:10px;}
.pm-dash-mock .dash-table-row:last-child{margin-bottom:0;}
.pm-dash-mock .dash-table-row span:first-child{height:8px; border-radius:4px; background:rgba(15,41,66,0.08);}
.pm-dash-mock .dash-table-row .bar{height:8px; border-radius:4px; background:var(--signalgelb);}
.pm-check-split{display:grid; grid-template-columns:0.9fr 1.1fr; gap:64px; align-items:stretch;}
@media (max-width:900px){ .pm-check-split{grid-template-columns:1fr;} }
.pm-check-split h2{font-size:clamp(26px,3.4vw,38px); font-weight:800; line-height:1.2; margin:0 0 16px; color:var(--neverything);}
.pm-check-split h2 em{font-style:italic; font-family:var(--font-headline); font-weight:400; color:var(--signalgelb);}
.pm-check-split .pm-sub{font-size:16px; color:rgba(15,15,15,0.5); margin:0 0 28px;}
.pm-check-list{display:flex; flex-direction:column; gap:18px;}
.pm-check-item{display:flex; align-items:flex-start; gap:14px;}
.pm-check-item .mark{flex-shrink:0; width:26px; height:26px; border-radius:8px; background:rgba(15,41,66,0.06); display:flex; align-items:center; justify-content:center; margin-top:2px;}
.pm-check-item .mark img{display:block;}
.pm-check-item p{margin:0; font-size:15px; line-height:1.6; color:rgba(15,15,15,0.75);}
.pm-check-item p strong{color:var(--midnight-navy);}
.rb-calc-mock .rep-head .live-tag{font-family:var(--font-accent); font-weight:700; font-size:10px; text-transform:uppercase; letter-spacing:0.04em; color:var(--signalgelb); background:rgba(255,164,32,0.14); padding:3px 9px; border-radius:20px;}
.rb-calc-mock .rep-head select.live-tag{appearance:none; -webkit-appearance:none; -moz-appearance:none; border:none; outline:none; cursor:pointer;}

/* --- Baustein: helle Stat-Card (Ihr Risiko) — Alternative zur dunklen Navy-Card --- */
.rb-stat-section{
  background:var(--midnight-navy); color:var(--orchid-white); border-radius:32px; padding:56px 48px;
  width:calc(100vw - 60px); margin-left:calc(-50vw + 50% + 30px); margin-right:calc(-50vw + 50% + 30px);
}
@media (max-width:1100px){ .rb-stat-section{padding:40px 32px;} }
.rb-stat-section .rb-eyebrow{color:var(--signalgelb);}
.rb-stat-top{display:flex; justify-content:space-between; align-items:flex-end; flex-wrap:wrap; gap:24px; margin-bottom:40px; max-width:calc(var(--max-w) - 64px); margin-left:auto; margin-right:auto;}
.rb-stat-top h2{font-family:var(--font-headline); font-size:clamp(24px,3.2vw,36px); margin:0; max-width:520px;}
.rb-stat-scroll{display:flex; gap:16px; overflow-x:auto; padding-bottom:6px; max-width:calc(var(--max-w) - 64px); margin-left:auto; margin-right:auto;}
.rb-stat-card{background:#fff; border:1px solid rgba(15,15,15,0.06); border-radius:16px; padding:26px; min-width:220px; flex:1; color:var(--neverything);}
.rb-stat-card .stat-num{font-family:var(--font-headline); font-weight:800; font-size:clamp(30px,4vw,44px); color:var(--signalgelb); display:block;}
.rb-stat-card h4{font-size:15px; margin:8px 0 6px; color:var(--neverything);}
.rb-stat-card p{font-size:13px; line-height:1.6; color:rgba(15,15,15,0.6); margin:0;}

/* ---------- TEAM PAGE ---------- */
.team-groups{display:flex; flex-direction:column; gap:56px;}
.team-group h3{font-size:22px; margin-bottom:24px;}
.team-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:24px;}
@media (max-width:900px){ .team-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:500px){ .team-grid{grid-template-columns:1fr;} }
.team-member{text-align:left; position:relative; border-radius:16px; overflow:hidden; background:var(--midnight-navy);}
.team-member .tm-photo{width:100%; aspect-ratio:4/5; background:var(--midnight-navy) center/cover no-repeat; display:block;}
.team-member .tm-overlay{position:absolute; left:0; right:0; bottom:0; padding:10px; display:flex; flex-direction:column; gap:8px;}
.team-member .tm-tags{display:flex; flex-wrap:wrap; gap:6px;}
.team-member .tm-tag{font-size:10px; font-weight:600; color:#fff; background:rgba(255,255,255,0.18); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); padding:4px 10px; border-radius:20px; line-height:1.3;}
.team-member .tm-row{display:flex; align-items:center; justify-content:space-between; gap:8px; background:rgba(255,255,255,0.18); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); border-radius:12px; padding:10px 12px;}
.team-member .name{color:#fff; font-weight:700; font-size:15px;}
.team-member .tm-icons{display:flex; gap:6px; flex-shrink:0;}
.team-member .tm-icon{width:26px; height:26px; border-radius:50%; background:rgba(255,255,255,0.18); display:flex; align-items:center; justify-content:center; color:#fff; font-size:22px; line-height:1; font-weight:700; text-decoration:none; flex-shrink:0; transition:background .2s ease; overflow:visible;}
.team-member .tm-icon:hover{background:rgba(255,255,255,0.32);}
.team-placeholder{border:1px dashed rgba(15,15,15,0.25); border-radius:16px; padding:24px; text-align:center; color:rgba(15,15,15,0.5); font-size:13px; margin-top:16px;}

.team-member{opacity:0; transition:opacity .7s ease, transform .7s cubic-bezier(.22,1,.36,1);}
.team-member:nth-child(4n+1){transform:translateX(-70px) rotate(-7deg);}
.team-member:nth-child(4n+2){transform:translateX(70px) rotate(7deg);}
.team-member:nth-child(4n+3){transform:translateX(70px) rotate(7deg);}
.team-member:nth-child(4n+4){transform:translateX(-70px) rotate(-7deg);}
.team-grid.in-view .team-member{opacity:1; transform:translateX(0) rotate(0deg);}
.team-grid.in-view .team-member:nth-child(1){transition-delay:0s;}
.team-grid.in-view .team-member:nth-child(2){transition-delay:.07s;}
.team-grid.in-view .team-member:nth-child(3){transition-delay:.14s;}
.team-grid.in-view .team-member:nth-child(4){transition-delay:.21s;}
.team-grid.in-view .team-member:nth-child(5){transition-delay:.28s;}
.team-grid.in-view .team-member:nth-child(6){transition-delay:.35s;}
.team-grid.in-view .team-member:nth-child(7){transition-delay:.42s;}
.team-grid.in-view .team-member:nth-child(8){transition-delay:.49s;}
.team-grid.in-view .team-member:nth-child(n+9){transition-delay:.56s;}
@media (prefers-reduced-motion:reduce){
  .team-member{opacity:1; transform:none; transition:none;}
}

/* ---------- JOBS PAGE ---------- */
.jobs-list{display:flex; flex-direction:column; gap:16px;}
.job-card{
  display:flex; justify-content:space-between; align-items:center; gap:20px;
  background:var(--orchid-white); border:1px solid rgba(15,15,15,0.1); border-radius:18px; padding:26px 28px; flex-wrap:wrap;
}
.job-card h4{font-size:18px; margin-bottom:6px;}
.job-card p{font-size:14px; color:var(--midnight-navy); font-weight:400;}
.job-card.creative{background:var(--neverything); color:var(--orchid-white); border-color:var(--neverything);}
.job-card.creative p{color:rgba(255,252,242,0.65);}
.job-doodle{width:56px; height:56px; flex-shrink:0;}

.jobs-decobar{
  position:static; margin:30px auto 0; width:calc(var(--max-w) + 48px); max-width:calc(100vw - 32px);
  box-sizing:border-box; display:flex; align-items:center; gap:0;
  background:rgba(15,15,15,0.09); border-radius:16px; padding:8px 56px;
}
.jobs-decobar-dd{position:relative;}
.jobs-decobar-trigger{
  appearance:none; background:none; border:none; display:flex; align-items:center; gap:6px;
  padding:10px 16px; font-size:13px; font-weight:600; color:var(--neverything);
  font-family:inherit; cursor:pointer; border-radius:10px; transition:background .15s ease;
}
.jobs-decobar-trigger:hover{background:rgba(15,15,15,0.06);}
.jobs-decobar-trigger .chev{font-size:11px; opacity:0.5;}
.jobs-filter-dropdown{
  width:min(280px, calc(100vw - 64px)); left:0; transform:translate(0, -8px); padding:14px 16px;
}
.jobs-filter-dropdown.open{transform:translate(0, 4px);}
.jobs-filter-dropdown .mega-row{padding:12px 12px; font-size:14px;}
.jobs-filter-dropdown .mega-row.is-selected{background:rgba(255,164,32,0.14); font-weight:700;}
.jobs-decobar-right{margin-left:auto; display:flex; align-items:center; gap:14px;}
.jobs-decobar-reset{background:none; border:none; font-family:inherit; cursor:pointer;}
.jobs-decobar-count{
  background:var(--neverything); color:var(--orchid-white); font-size:11px; font-weight:700;
  width:20px; height:20px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  transition:background .2s ease, color .2s ease;
}
.jobs-decobar-count.has-filters{background:var(--signalgelb); color:var(--neverything);}
.jobs-decobar-reset{font-size:12px; color:rgba(15,15,15,0.5); font-weight:600; white-space:nowrap;}
@media (max-width:700px){
  .jobs-decobar{padding:8px 20px; overflow-x:auto;}
  .jobs-decobar-reset{display:none;}
}

.jobs-hero{
  position:relative; overflow:hidden; border-bottom:none;
  min-height:calc(100vh - 200px);
  display:grid; grid-template-rows:1fr auto 1fr; padding:0 0 8px;
}
.jobs-hero .wrap{position:relative; z-index:1;}
.jobs-hero-inner{text-align:center; grid-row:2; align-self:center;}
.jobs-hero-bottom-row{grid-row:3; align-self:end; margin-top:0 !important;}
.jobs-hero-title{
  position:relative;
  font-family:'Stack Sans Notch', var(--font-display), sans-serif;
  font-size:clamp(42px,8.3vw,110px); line-height:0.96; margin:0 0 12px; text-transform:uppercase;
  letter-spacing:-0.01em;
}
.jobs-hero-megaphone-wrap{
  position:absolute; left:-180px; top:calc(50% + 40px); transform:translateY(-50%);
  width:150px; height:80px; pointer-events:none; perspective:600px;
}
.jobs-sticker-group{
  position:absolute; inset:0; transform-style:preserve-3d;
}
.sticker-emoji{
  position:absolute; right:0; top:50%; transform:translateY(-50%) rotate(-4deg);
  font-size:80px; line-height:1;
  text-shadow:
    -4px -4px 0 #fff, 4px -4px 0 #fff, -4px 4px 0 #fff, 4px 4px 0 #fff,
    -4px 0 0 #fff, 4px 0 0 #fff, 0 -4px 0 #fff, 0 4px 0 #fff,
    -3px -3px 0 #fff, 3px -3px 0 #fff, -3px 3px 0 #fff, 3px 3px 0 #fff;
}
.sticker-base{
  filter:drop-shadow(4px 8px 8px rgba(15,15,15,0.25));
}
.sticker-flap{
  clip-path:polygon(52% 0, 100% 0, 100% 50%);
  transform-origin:88% 12%;
  backface-visibility:hidden;
  filter:drop-shadow(3px 6px 8px rgba(15,15,15,0.35));
}
.jobs-hiring-tag{
  display:inline-block; vertical-align:middle; margin-left:14px; position:relative;
  background:var(--signalgelb); color:var(--neverything); font-size:15px; font-weight:800;
  padding:9px 16px; border-radius:999px 999px 999px 5px; font-family:var(--font-headline); letter-spacing:0.03em;
  white-space:nowrap; transform:translateY(-38px) rotate(-6deg); transition:transform .1s linear;
  box-shadow:3px 4px 0 rgba(15,15,15,0.85), 6px 9px 14px rgba(15,15,15,0.3);
}
@media (max-width:1100px){ .jobs-hero-megaphone-wrap{display:none;} }
.jobs-hero-sub-center{font-size:16px; color:var(--midnight-navy); max-width:460px; margin:0 auto;}
.jobs-hero-bottom-row{
  width:100%; box-sizing:border-box;
  display:flex; justify-content:space-between; align-items:center; gap:24px; flex-wrap:wrap;
  margin-top:80px; padding-top:20px; border-top:1px solid rgba(15,15,15,0.08);
}
.jobs-hero-stat{font-size:14px; color:var(--midnight-navy);}
.jobs-hero-stat strong{color:var(--neverything); font-family:var(--font-headline); font-size:16px;}
.jobs-hero-teaser{font-size:14px; color:var(--midnight-navy);}
.jobs-hero-teaser a{color:var(--neverything); text-decoration:underline; font-weight:600;}
@media (max-width:700px){ .jobs-hero-bottom-row{flex-direction:column; align-items:flex-start;} }

.jobs-pin-wrap{padding:0; position:relative; z-index:320; background:var(--orchid-white);}
.jobs-pin-panel{
  border-radius:0; padding-top:96px; padding-bottom:96px;
}
.jobs-pin-inner{
  max-width:var(--max-w); margin:0 auto; padding:100px 32px 16px; box-sizing:border-box;
}
.jobs-pin-scroll{
  display:flex; flex-direction:column; gap:16px;
}
.job-card-expanded{
  border:1px solid rgba(15,15,15,0.1); border-radius:20px; padding:32px; background:rgba(15,15,15,0.03); flex-shrink:0;
}
@media (max-width:900px){
  .jobs-pin-inner{padding:28px 20px;}
}
.job-card-head{display:flex; justify-content:space-between; align-items:flex-start; gap:16px; flex-wrap:wrap; margin-bottom:16px;}
.job-card-head h3{font-size:clamp(19px,2.2vw,24px); margin:0;}
.job-card-tags{display:flex; gap:8px; flex-wrap:wrap;}
.job-card-tags span{
  background:rgba(15,15,15,0.05); border-radius:999px; padding:5px 12px;
  font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:0.03em; color:rgba(15,15,15,0.6);
}
.job-card-tags span.tag-accent{background:var(--signalgelb); color:var(--neverything);}
.job-card-meta{display:flex; gap:32px; flex-wrap:wrap; margin-bottom:18px;}
.job-card-meta .label{display:block; font-size:11px; text-transform:uppercase; letter-spacing:0.04em; color:rgba(15,15,15,0.4); margin-bottom:2px;}
.job-card-meta div{font-family:var(--font-headline); font-weight:700; font-size:14px;}
.job-card-desc{font-size:14px; line-height:1.6; color:var(--midnight-navy); font-weight:400; margin-bottom:22px; max-width:640px;}
.jobs-empty{font-size:14px; color:var(--midnight-navy); padding:40px 0; text-align:center;}

/* ---------- PRESSE PAGE ---------- */
.presse-portraits{display:grid; grid-template-columns:1fr 1fr; gap:32px;}
@media (max-width:700px){ .presse-portraits{grid-template-columns:1fr;} }
.presse-portrait{border:1px solid rgba(15,15,15,0.1); border-radius:20px; padding:28px;}
.logo-downloads{display:flex; gap:16px; flex-wrap:wrap; margin-top:24px;}
.logo-download-item{border:1px solid rgba(15,15,15,0.1); border-radius:14px; padding:18px 24px; font-size:13px; font-weight:600;}
.news-list{display:flex; flex-direction:column; gap:0; border-top:1px solid rgba(15,15,15,0.1); margin-top:16px;}
.news-item{display:flex; justify-content:space-between; gap:20px; padding:20px 4px; border-bottom:1px solid rgba(15,15,15,0.1);}
.news-item .date{font-size:12px; color:rgba(15,15,15,0.5); font-family:var(--font-accent); font-weight:700; white-space:nowrap;}

/* ---------- REFERENZEN PAGE ---------- */
.filter-bar{display:flex; gap:10px; flex-wrap:wrap; margin-bottom:40px;}
.filter-chip{
  font-family:var(--font-accent); font-size:13px; font-weight:700; text-transform:uppercase; letter-spacing:0.03em;
  padding:10px 18px; border-radius:999px; border:1px solid rgba(15,15,15,0.2); cursor:pointer; background:transparent;
}
.filter-chip.active{background:var(--neverything); color:var(--orchid-white); border-color:var(--neverything);}
.referenzen-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:20px;}
@media (max-width:900px){ .referenzen-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:600px){ .referenzen-grid{grid-template-columns:1fr;} }
.ref-card{border:1px solid rgba(15,15,15,0.1); border-radius:18px; padding:24px; min-height:140px;}
.ref-card .branche{font-family:var(--font-accent); font-size:11px; font-weight:700; text-transform:uppercase; color:var(--midnight-navy); margin-bottom:8px;}
.ref-card h4{font-size:16px; margin-bottom:6px;}
.ref-card p{font-size:13px; color:rgba(15,15,15,0.5); font-weight:400;}

/* ---------- CASES / REFERENZEN (Card + Lightbox) ---------- */
.branche-tag{display:inline-block; font-family:var(--font-accent); font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:0.02em; color:var(--midnight-navy); background:rgba(15,41,66,0.08); padding:6px 12px; border-radius:999px; margin-bottom:14px;}

.cases-hero-viewport{min-height:calc(100vh - 88px); padding:0; display:flex; align-items:stretch; box-sizing:border-box; position:relative; border-bottom:none;}
.cases-hero-viewport .wrap.cases-hero-grid{width:100%; display:grid; grid-template-columns:35% 1fr; gap:48px; align-items:center;}
.cases-hero-left{display:flex; flex-direction:column; justify-content:center; align-items:flex-start;}
.cases-hero-right{position:relative; border-radius:24px; overflow:hidden; cursor:pointer; margin:0; width:100%; aspect-ratio:16/11;}
.cases-hero-right-media{position:absolute; inset:0; background-size:cover; background-position:center; transition:transform .4s ease;}
.cases-hero-right:hover .cases-hero-right-media{transform:scale(1.04);}
.cases-hero-right-overlay{position:absolute; inset:0; background:linear-gradient(0deg, rgba(15,15,15,0.85) 0%, rgba(15,15,15,0.55) 35%, rgba(15,15,15,0) 70%);}
.cases-hero-right-body{position:absolute; left:0; right:0; bottom:0; padding:44px; color:var(--orchid-white); z-index:1;}
.cases-hero-right-body .branche-tag{background:var(--signalgelb); color:var(--neverything);}
.cases-hero-right-body h2{font-size:clamp(24px,2.8vw,34px); margin-bottom:14px; line-height:1.25;}
.cases-hero-right-body p{font-size:15px; color:rgba(255,252,242,0.85); margin-bottom:20px; max-width:560px;}
.cases-hero-right-body .case-read-link{color:var(--orchid-white);}
@media (max-width:900px){
  .cases-hero-viewport{min-height:0; padding:120px 0 0;}
  .cases-hero-viewport .wrap.cases-hero-grid{grid-template-columns:1fr; gap:24px;}
  .cases-hero-right{min-height:280px; margin-bottom:32px;}
}

.case-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:24px;}
@media (max-width:900px){ .case-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:600px){ .case-grid{grid-template-columns:1fr;} }
.case-card{border:1px solid rgba(15,15,15,0.1); border-radius:18px; overflow:hidden; cursor:pointer; transition:transform .25s ease, box-shadow .25s ease; background:var(--orchid-white);}
.case-card:hover{transform:translateY(-4px); box-shadow:0 16px 32px rgba(15,15,15,0.1);}
.case-card-media{height:170px; background-size:cover; background-position:center; position:relative;}
.case-service-tag{position:absolute; top:14px; left:14px; font-family:var(--font-accent); font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:0.02em; color:var(--neverything); background:var(--signalgelb); padding:6px 12px; border-radius:999px;}
.case-service-tag.tag-affiliate{background:var(--purple-accent); color:var(--orchid-white);}
.case-service-tag.tag-rebounce{background:var(--mint-accent); color:var(--neverything);}
.case-card-body{padding:22px;}
.case-card-body h4{font-size:16px; margin-bottom:8px; line-height:1.3;}
.case-card-body p{font-size:13px; color:rgba(15,15,15,0.55); font-weight:400; margin-bottom:14px;}
.case-read-link{display:inline-flex; align-items:center; gap:8px; font-family:var(--font-accent); font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:0.02em; color:var(--neverything);}
.case-read-link .sq{width:6px; height:6px; background:currentColor; display:inline-block;}

.case-lightbox{position:fixed; inset:0; z-index:500; display:none; align-items:center; justify-content:center; padding:24px;}
.case-lightbox.open{display:flex;}
.case-lightbox-backdrop{position:absolute; inset:0; background:rgba(15,15,15,0.6); backdrop-filter:blur(2px);}
.case-lightbox-panel{position:relative; background:var(--orchid-white); border-radius:24px; max-width:760px; width:100%; max-height:88vh; overflow-y:auto; z-index:1;}
.case-lightbox-close{position:absolute; top:16px; right:16px; width:36px; height:36px; border-radius:50%; background:var(--orchid-white); border:1px solid rgba(15,15,15,0.15); font-size:20px; line-height:1; cursor:pointer; z-index:2;}
.case-lightbox-close:hover{background:var(--neverything); color:var(--orchid-white);}
.case-lightbox-media{height:280px; background-size:cover; background-position:center; border-radius:24px 24px 0 0;}
.case-lightbox-body{padding:36px 40px 44px;}
.case-lightbox-body h2{font-size:clamp(22px,2.8vw,30px); margin-bottom:20px; line-height:1.25;}
.case-lightbox-body p{font-size:15px; color:var(--midnight-navy); line-height:1.65; margin-bottom:16px;}
.case-lightbox-body h3{font-size:17px; margin:28px 0 10px;}
@media (max-width:700px){ .case-lightbox-media{height:180px;} .case-lightbox-body{padding:28px 24px 32px;} }

.case-stats-row{display:grid; grid-template-columns:repeat(auto-fit,minmax(120px,1fr)); gap:12px; margin-bottom:24px;}
.case-stat-tile{border:1px solid rgba(15,15,15,0.1); border-radius:14px; padding:16px 14px; text-align:center;}
.case-stat-value{display:block; font-family:var(--font-display); font-size:22px; font-weight:800; color:var(--midnight-navy); margin-bottom:4px;}
.case-stat-label{display:block; font-size:11px; color:rgba(15,15,15,0.55); line-height:1.3;}

.case-facts-box{border:1px solid rgba(15,15,15,0.1); border-radius:16px; padding:20px 22px; margin-bottom:28px; background:rgba(15,41,66,0.03);}
.case-facts-label{display:block; font-family:var(--font-accent); font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:0.05em; color:var(--midnight-navy); margin-bottom:10px;}
.case-facts-box ul{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:8px;}
.case-facts-box li{font-size:14px; color:var(--midnight-navy); padding-left:20px; position:relative;}
.case-facts-box li::before{content:'✓'; position:absolute; left:0; color:var(--signalgelb); font-weight:700;}

.case-callout{border-left:3px solid var(--signalgelb); background:rgba(255,164,32,0.06); border-radius:0 12px 12px 0; padding:16px 20px; margin:20px 0;}
.case-callout-label{display:block; font-family:var(--font-accent); font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:0.05em; color:var(--midnight-navy); margin-bottom:6px;}
.case-callout p{margin:0; font-size:14px; line-height:1.55;}

/* ---------- KONTAKT PAGE ---------- */
.kontakt-outer-card{background:none; padding:0; margin:0;}
.kontakt-grid{display:grid; grid-template-columns:1.1fr 0.9fr; gap:56px; align-items:center; position:relative;}
@media (max-width:900px){ .kontakt-grid{grid-template-columns:1fr;} }
.kontakt-arrow-connector{position:absolute; left:44%; bottom:16px; width:160px; height:100px; color:var(--signalgelb); pointer-events:none; transform:translateX(-50%); z-index:3;}
@media (max-width:900px){ .kontakt-arrow-connector{display:none;} }
.contact-left{padding-top:8px;}
.kontakt-map{border-radius:20px; min-height:220px; background:var(--midnight-navy); color:var(--orchid-white); display:flex; align-items:center; justify-content:center; font-family:var(--font-display); font-size:14px; margin-bottom:24px;}
.kontakt-partner-list{display:flex; flex-direction:column; gap:16px;}

.kontakt-support-card{
  background:var(--midnight-navy); color:var(--orchid-white); border-radius:20px; padding:44px 40px;
}
.kontakt-support-card h3{font-size:clamp(24px,2.8vw,32px); margin:14px 0 12px; color:var(--orchid-white);}
.kontakt-support-card p{font-size:14px; line-height:1.6; color:rgba(255,252,242,0.65); font-weight:400; max-width:360px;}
.kontakt-support-rows{display:flex; flex-direction:column; gap:16px; margin-top:28px;}
.kontakt-support-row{
  display:flex; align-items:center; gap:14px; text-decoration:none; color:var(--neverything);
}
.kontakt-support-row .thumb{width:36px; height:36px; flex-shrink:0; background:rgba(15,15,15,0.05); border-radius:10px; padding:6px;}
.kontakt-support-row .thumb i.on{background:var(--signalgelb);}
.kontakt-support-row span{font-family:var(--font-headline); font-weight:700; font-size:16px;}
.kontakt-support-row:hover span{text-decoration:underline;}
.kontakt-support-address{
  margin-top:32px; padding-top:20px; border-top:1px solid rgba(15,15,15,0.12);
  font-size:13px; color:var(--midnight-navy); opacity:0.7;
}

/* ---------- BEDARFS-FINDER ---------- */
.finder{background:var(--neverything); border-radius:28px; padding:56px; max-width:var(--max-w); margin:0 auto; box-sizing:border-box;}
@media (max-width:1304px){ .finder{margin:0 32px; max-width:none;} }
@media (max-width:700px){ .finder{margin:0 16px; padding:36px 24px;} }
.finder .eyebrow{color:var(--signalgelb);}
.finder .eyebrow::before{display:none;}
.finder h2{font-size:clamp(24px,3.2vw,32px); margin:14px 0 36px; max-width:600px; color:var(--orchid-white);}
.finder-options{display:grid; grid-template-columns:repeat(3,1fr); gap:18px;}
@media (max-width:800px){ .finder-options{grid-template-columns:1fr;} }
.finder-opt{
  text-align:left; background:rgba(255,252,242,0.06); color:var(--orchid-white);
  border:1.5px solid rgba(255,252,242,0.12); border-radius:16px;
  padding:26px 24px; cursor:pointer; font-family:var(--font-body);
  transition:background .2s ease, border-color .2s ease, transform .2s ease;
}
.finder-opt:hover{background:rgba(255,252,242,0.1); border-color:rgba(255,252,242,0.25); transform:translateY(-2px);}
.finder-opt.active{background:var(--signalgelb); border-color:var(--signalgelb); color:var(--neverything);}
.finder-thumb{width:32px; height:32px; padding:0; border-radius:0; background:transparent; margin-bottom:18px; transition:none;}
.finder-thumb i.on{background:var(--signalgelb);}
.finder-opt.active .finder-thumb i.on{background:var(--neverything);}
.finder-opt .q{font-family:var(--font-accent); font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:0.04em; opacity:0.55; margin-bottom:8px; display:block;}
.finder-opt .a{font-size:17px; font-weight:700; line-height:1.35; display:block;}
.finder-result{
  margin-top:28px; max-height:0; overflow:hidden; transition:max-height .35s ease;
  background:rgba(255,252,242,0.06); border:1.5px solid rgba(255,252,242,0.12); color:var(--orchid-white); border-radius:16px;
}
.finder-result.open{max-height:220px;}
.finder-result-inner{padding:26px 28px; display:flex; justify-content:space-between; align-items:center; gap:20px; flex-wrap:wrap;}
.finder-result p{font-size:15px; line-height:1.5; color:rgba(255,252,242,0.75); max-width:520px;}

/* ---------- JOURNEY TIMELINE ---------- */
.journey{position:relative;}
.journey-track{display:flex; gap:0; position:relative; margin-top:56px;}
.journey-line{
  position:absolute; top:22px; left:0; right:0; height:2px; background:rgba(15,15,15,0.12); z-index:0;
  transform-origin:left center; transform:scaleX(0); transition:transform 1.1s cubic-bezier(.25,.7,.3,1);
}
.journey-track.in-view .journey-line{transform:scaleX(1);}
.journey-step{
  flex:1; position:relative; z-index:1; padding-right:24px;
  opacity:0; transform:translateX(-24px); transition:opacity .6s ease, transform .6s ease;
}
.journey-step:last-child{padding-right:0;}
.journey-track.in-view .journey-step{opacity:1; transform:translateX(0);}
.journey-track.in-view .journey-step:nth-child(2){transition-delay:.15s;}
.journey-track.in-view .journey-step:nth-child(3){transition-delay:.3s;}
.journey-track.in-view .journey-step:nth-child(4){transition-delay:.45s;}
.journey-track.in-view .journey-step:nth-child(5){transition-delay:.6s;}
.journey-dot{width:44px; height:44px; border-radius:50%; background:var(--neverything); color:var(--signalgelb); display:flex; align-items:center; justify-content:center; font-family:var(--font-headline); font-weight:800; margin-bottom:20px;}
.journey-step:last-child .journey-dot{background:var(--signalgelb); color:var(--neverything);}
.journey-step h4{font-size:16px; margin-bottom:8px;}
.journey-step p{font-size:13px; color:var(--midnight-navy); font-weight:400;}
@media (max-width:900px){
  .journey-track{flex-direction:column; gap:32px;}
  .journey-line{display:none;}
  .journey-step{transform:translateY(16px);}
  .journey-track.in-view .journey-step{transform:translateY(0);}
}

/* ---------- JOB-DETAILSEITE (eigenständig, personalisiert) ---------- */
.job-hero{background:var(--orchid-white); color:var(--neverything); padding:88px 0 64px; border-bottom:1px solid rgba(15,15,15,0.08);}
.job-hero.job-hero-viewport{
  min-height:calc(100vh - 88px); display:flex; align-items:center; box-sizing:border-box;
  padding-top:0; padding-bottom:0; position:relative;
}
.job-hero.job-hero-viewport .wrap{width:100%;}
@media (max-width:700px){ .job-hero.job-hero-viewport{min-height:0; padding:120px 0 40px;} }
.job-scroll-hint{
  position:absolute; left:max(32px, calc(50% - var(--max-w)/2 + 32px)); bottom:40px;
  display:flex; align-items:center; gap:8px; cursor:pointer;
  font-family:var(--font-accent); font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:0.08em;
  color:rgba(15,15,15,0.4); animation:jobScrollHintDrift 1.8s ease-in-out infinite;
}
.job-scroll-hint::after{content:'↓';}
@keyframes jobScrollHintDrift{
  0%, 100%{transform:translateY(0);}
  50%{transform:translateY(4px);}
}
@media (max-width:700px){ .job-scroll-hint{display:none;} }
.job-hero-title-row{position:relative; display:block; width:fit-content; max-width:min(100%, 620px); margin:12px 0 20px;}
.job-hero-title-row h1{margin:0;}
.jhs-wrap{
  position:absolute; top:-8px; right:-26px;
  display:inline-flex; align-items:center; justify-content:center; width:52px; height:52px;
  flex-shrink:0; transform:rotate(-8deg); transition:transform .3s cubic-bezier(.34,1.56,.64,1);
  filter:drop-shadow(1px 2px 2px rgba(15,15,15,0.12)); cursor:default;
}
.jhs-emoji{
  font-size:40px; line-height:1;
  text-shadow:
    -3px -3px 0 #fff, 3px -3px 0 #fff, -3px 3px 0 #fff, 3px 3px 0 #fff,
    -3px 0 0 #fff, 3px 0 0 #fff, 0 -3px 0 #fff, 0 3px 0 #fff;
}
.job-hero-title-row:hover .jhs-wrap{transform:rotate(6deg) scale(1.12) translateY(-5px);}
@media (max-width:600px){ .jhs-wrap{right:-8px; top:-30px;} }
.job-hero-bg-icon{
  position:absolute; top:50%; right:max(40px, calc(50% - var(--max-w)/2 + 120px)); transform:translateY(-50%);
  width:380px; height:380px; color:rgba(15,15,15,0.05); pointer-events:none; z-index:0;
}
.job-hero-bg-icon svg{width:100%; height:100%; display:block;}
.job-hero.job-hero-viewport .wrap{position:relative; z-index:1;}
@media (max-width:1100px){ .job-hero-bg-icon{display:none;} }
.job-hero-badge{
  position:absolute; top:40px; right:max(32px, calc(50% - var(--max-w)/2 + 32px));
  width:140px; height:140px; transform:rotate(-8deg);
  display:flex; align-items:center; justify-content:center;
}
.job-hero-badge svg{display:block; width:100%; height:100%;}
.job-hero-badge-text{
  position:absolute; text-align:center; font-family:var(--font-headline); font-weight:800;
  font-size:15px; line-height:1.3; color:var(--neverything); transform:rotate(3deg); white-space:nowrap;
}
@media (max-width:1000px){ .job-hero-badge{display:none;} }
.job-hero .breadcrumb{color:var(--midnight-navy);}
.job-hero h1{color:var(--neverything); font-size:clamp(32px,5vw,54px); margin:12px 0 20px; max-width:760px;}
.job-meta-row{display:flex; gap:32px; flex-wrap:wrap; margin-top:28px;}
.job-meta-item{font-size:13px; color:rgba(15,15,15,0.55); display:flex; align-items:center; gap:12px;}
.job-meta-item strong{display:block; color:var(--neverything); font-family:var(--font-headline); font-size:15px; margin-top:2px;}
.jmi-icon{
  width:46px; height:46px; flex-shrink:0; box-sizing:border-box; padding:11px; border-radius:12px;
  background:var(--signalgelb); color:var(--neverything);
}
.jmi-icon svg{width:100%; height:100%; display:block;}

.job-body-section{padding-bottom:32px;}
.job-body{display:grid; grid-template-columns:1.6fr 1fr; gap:64px; align-items:start;}
@media (max-width:900px){ .job-body{grid-template-columns:1fr;} }
.job-main h2{font-size:22px; margin:40px 0 16px;}
.job-main h2:first-child{margin-top:0;}
.job-main p{font-size:15px; color:var(--midnight-navy); margin-bottom:12px; max-width:620px;}
.job-main ul{margin:0 0 12px 0; padding-left:0; list-style:none; max-width:620px;}
.job-main ul li{font-size:15px; color:var(--neverything); padding:8px 0 8px 26px; position:relative;}
.job-main ul li::before{
  content:''; position:absolute; left:4px; top:15px;
  width:8px; height:8px; background:var(--signalgelb); transform:rotate(45deg);
}

.job-benefits-grid{display:flex; flex-direction:column; margin:20px 0 8px; max-width:620px;}
.job-benefit-box{border-top:1px solid rgba(15,15,15,0.12);}
.job-benefit-box:last-child{border-bottom:1px solid rgba(15,15,15,0.12);}
.job-benefit-row{
  display:flex; align-items:center; gap:16px; width:100%; background:none; border:none;
  padding:16px 2px; cursor:pointer; text-align:left; font-family:inherit; color:inherit;
}
.job-benefit-box .thumb{
  width:36px; height:36px; flex-shrink:0; padding:9px; border-radius:10px;
  background:rgba(15,15,15,0.05); transition:background .25s ease;
}
.job-benefit-box .thumb i.on{background:var(--neverything); transition:background .25s ease;}
.job-benefit-box.open .thumb{background:rgba(255,164,32,0.14);}
.job-benefit-box.open .thumb i.on{background:var(--signalgelb);}
.job-benefit-icon{
  width:36px; height:36px; flex-shrink:0; box-sizing:border-box; border-radius:10px;
  background:rgba(15,15,15,0.05); transition:background .25s ease;
  display:flex; align-items:center; justify-content:center;
}
.job-benefit-icon svg{width:18px; height:18px; color:var(--neverything); transition:color .25s ease;}
.job-benefit-box.open .job-benefit-icon{background:rgba(255,164,32,0.14);}
.job-benefit-box.open .job-benefit-icon svg{color:var(--signalgelb);}
.job-benefit-row h4{flex:1; font-size:15px; font-weight:700; margin:0; transition:color .2s ease;}
.job-benefit-box.open .job-benefit-row h4{color:var(--midnight-navy);}
.job-benefit-plus{
  width:26px; height:26px; border-radius:50%; border:1px solid rgba(15,15,15,0.2); flex-shrink:0;
  box-sizing:border-box; position:relative; font-size:0;
  transition:transform .25s ease, background .2s ease, border-color .2s ease, color .2s ease;
}
.job-benefit-plus::before{
  content:"+"; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  font-size:15px; line-height:1;
}
.job-benefit-box.open .job-benefit-plus{
  background:var(--signalgelb); border-color:var(--signalgelb); color:var(--neverything); transform:rotate(45deg);
}
.job-benefit-box.open .job-benefit-plus::before{color:var(--neverything);}
.job-benefit-panel{max-height:0; overflow:hidden; opacity:0; transition:max-height .3s ease, opacity .25s ease;}
.job-benefit-box.open .job-benefit-panel{max-height:100px; opacity:1;}
.job-benefit-panel p{font-size:13px; color:var(--midnight-navy); margin:0; padding:0 2px 18px 52px; line-height:1.5;}

.job-testimonial{
  background:var(--midnight-navy); color:var(--orchid-white); border-radius:20px; padding:32px 28px;
  margin:32px 0; max-width:620px;
}
.job-testimonial-reveal{position:relative; overflow:visible;}
.job-testimonial-head{display:flex; align-items:center; justify-content:space-between; gap:12px; cursor:pointer;}
.job-testimonial-chev{
  width:22px; height:22px; opacity:0.7; transition:transform .35s ease; flex-shrink:0;
  display:inline-block;
}
.job-testimonial-chev img{width:100%; height:100%; display:block; filter:invert(1) brightness(1.4);}
.job-testimonial-reveal.revealed .job-testimonial-chev{transform:rotate(180deg);}
.job-testimonial-content{
  max-height:0; opacity:0; overflow:hidden;
  transition:max-height .5s cubic-bezier(.22,1,.36,1), opacity .35s ease .05s;
}
.job-testimonial-reveal.revealed .job-testimonial-content{max-height:220px; opacity:1; padding-top:16px;}
.testi-cursor{
  position:absolute; right:-60%; left:auto; top:15%; display:flex; align-items:center; gap:6px;
  opacity:0; z-index:5; pointer-events:none;
  transition:right 1.7s cubic-bezier(.22,1,.36,1), top 1.7s cubic-bezier(.22,1,.36,1), opacity .3s ease;
}
.job-testimonial-reveal.in-view .testi-cursor{opacity:1; right:45%; top:78%;}
.job-testimonial-reveal.wander .testi-cursor{right:14px; top:26px;}
.job-testimonial-reveal.clicked .testi-cursor{opacity:0; transition:opacity .25s ease;}
.cursor-icon{width:18px; height:18px; flex-shrink:0; color:var(--signalgelb); display:block;}
.cursor-icon svg{width:100%; height:100%; display:block;}
.cursor-tag{
  background:var(--signalgelb); color:var(--neverything); font-size:11px; font-weight:700;
  padding:4px 9px; border-radius:6px; white-space:nowrap; font-family:var(--font-headline);
}
.job-testimonial p{color:rgba(255,252,242,0.88); font-size:15px; font-style:italic; margin-bottom:16px;}
.job-testimonial .who{display:flex; align-items:center; gap:12px;}
.job-testimonial .avatar{width:40px; height:40px; border-radius:50%; background:var(--signalgelb); color:var(--neverything); display:flex; align-items:center; justify-content:center; font-family:var(--font-headline); font-weight:800; font-size:13px;}
.job-testimonial .name{font-weight:700; font-size:14px;}
.job-testimonial .role{font-size:12px; color:rgba(255,252,242,0.6);}
.job-testimonial-like{
  position:absolute; right:28px; bottom:-15px; display:inline-flex; align-items:center; gap:7px;
  background:var(--orchid-white); color:var(--neverything); border-radius:20px; padding:6px 14px;
  box-shadow:0 4px 14px rgba(0,0,0,0.18); cursor:pointer; user-select:none; z-index:6;
  opacity:0; transform:scale(0.7) translateY(6px); pointer-events:none;
  transition:opacity .3s ease .1s, transform .3s ease .1s, background .2s ease;
}
.job-testimonial-reveal.revealed .job-testimonial-like{opacity:1; transform:scale(1) translateY(0); pointer-events:auto;}
.job-testimonial-like:hover{background:var(--signalgelb);}
.job-testimonial-like .jtl-emoji{font-size:15px; line-height:1;}
.job-testimonial-like .jtl-count{font-family:var(--font-headline); font-weight:700; font-size:13px;}
.job-testimonial-like.bump .jtl-emoji{animation:jtlBump .3s ease;}
@keyframes jtlBump{0%{transform:scale(1);} 50%{transform:scale(1.4);} 100%{transform:scale(1);}}

.job-apply{
  position:sticky; top:24px; background:var(--orchid-white); border:1px solid rgba(15,15,15,0.1);
  border-radius:20px; padding:28px; margin-top:-28px;
}
.job-apply h3{font-size:18px; margin-bottom:6px;}
.job-apply p.hint{font-size:13px; color:rgba(15,15,15,0.55); margin-bottom:20px;}
.job-apply .proto-form{gap:12px;}
.job-apply .proto-form input, .job-apply .proto-form textarea{
  font-size:14px; background:rgba(15,15,15,0.04); border:1px solid rgba(15,15,15,0.15); color:var(--neverything);
}
.job-apply .proto-form input::placeholder, .job-apply .proto-form textarea::placeholder{color:rgba(15,15,15,0.4);}
.job-apply .upload-box{
  border:1px dashed rgba(15,15,15,0.25); border-radius:12px; padding:16px; text-align:center;
  font-size:13px; color:rgba(15,15,15,0.5); cursor:pointer;
}
.job-apply-choice{
  background:rgba(15,15,15,0.03); border:1px solid rgba(15,15,15,0.1); border-radius:12px; padding:14px;
}
.job-apply-choice-label{display:block; font-size:12.5px; color:rgba(15,15,15,0.6); line-height:1.5; margin-bottom:10px;}
.job-apply-choice-options{display:flex; gap:8px; flex-wrap:wrap;}
.job-apply-choice-option{
  display:flex; align-items:center; gap:6px; border:1px solid rgba(15,15,15,0.15); border-radius:999px;
  padding:8px 14px; font-size:13px; font-weight:600; color:var(--neverything); cursor:pointer;
  transition:background .2s ease, border-color .2s ease;
}
.job-apply-choice-option input{margin:0; accent-color:var(--signalgelb);}
.job-apply-choice-option:has(input:checked){background:var(--signalgelb); border-color:var(--signalgelb);}

.site-footer{background:var(--dark-surface); color:var(--orchid-white); padding:80px 0 0;}
.footer-main{display:grid; grid-template-columns:1fr 2fr; gap:60px; padding-bottom:64px; border-bottom:1px solid rgba(255,252,242,0.1);}
@media (max-width:800px){ .footer-main{grid-template-columns:1fr; gap:48px;} }
.footer-brand{display:flex; flex-direction:column; gap:24px;}
.footer-brand-info{display:flex; flex-direction:column; gap:10px; font-size:14px; color:rgba(255,252,242,0.65); line-height:1.5;}
.footer-brand-info a{color:rgba(255,252,242,0.85); width:fit-content; font-variant-numeric:tabular-nums;}
.footer-brand-info a:hover{color:var(--signalgelb);}
.footer-cols{display:grid; grid-template-columns:repeat(4,1fr); gap:32px;}
@media (max-width:600px){ .footer-cols{grid-template-columns:1fr 1fr;} }
.footer-col{display:flex; flex-direction:column; gap:4px;}
.footer-col-title{
  font-family:var(--font-accent); font-size:13px; font-weight:700; text-transform:uppercase;
  letter-spacing:0.05em; color:var(--signalgelb); margin-bottom:12px;
}
.footer-col a{
  font-size:14px; color:rgba(255,252,242,0.75); padding:6px 0; width:fit-content;
  font-variant-numeric:tabular-nums; transition:color .15s ease;
}
.footer-col a:hover{color:var(--signalgelb);}
.footer-bottom{
  display:grid; grid-template-columns:1fr 2fr; gap:60px; align-items:center;
  padding:20px 0 32px;
}
@media (max-width:800px){ .footer-bottom{grid-template-columns:1fr; gap:16px; text-align:center;} }
.footer-copyright{
  font-family:'Courier New', monospace; font-size:13px; color:rgba(255,252,242,0.35);
}
.footer-social{display:flex; align-items:center; justify-content:flex-end; gap:8px; margin-right:-7px;}
@media (max-width:800px){ .footer-social{justify-content:center; margin-right:0;} }
.footer-social a{
  width:30px; height:30px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  color:rgba(255,252,242,0.6); transition:color .15s ease, background .15s ease;
}
.footer-social a:hover{color:var(--neverything); background:var(--signalgelb);}
.footer-social svg{width:15px; height:15px;}
.scroll-up{
  position:fixed; bottom:28px; right:28px; width:48px; height:48px; border-radius:50%;
  background:var(--neverything); color:var(--orchid-white); display:flex; align-items:center; justify-content:center;
  cursor:pointer; font-size:18px; opacity:0; pointer-events:none; transition:opacity .2s ease; z-index:200;
}
.scroll-up.visible{opacity:1; pointer-events:auto;}

.proto-note{
  font-family:var(--font-body); font-size:11px; color:rgba(15,15,15,0.4);
  text-align:center; padding:8px 0; background:rgba(255,164,32,0.08);
}

/* Leistungen Scrollytelling Section */
.lst-scroll-section{
  position:relative; height:calc(var(--lst-count) * 100vh);
}
.lst-sticky{
  position:sticky; top:0; height:100vh; overflow:hidden;
  display:flex; align-items:center; justify-content:center;
  background:var(--orchid-white);
}
.lst-wrap{
  max-width:var(--max-w); width:100%; margin:0 auto; padding:0 32px; box-sizing:border-box;
  display:grid; grid-template-columns:280px 1fr 320px; gap:60px; align-items:center;
}
.lst-left .eyebrow::before{display:none;}
.lst-left .lst-list{list-style:none; display:flex; flex-direction:column; gap:16px;}
.lst-item{
  display:flex; align-items:center; gap:10px;
  font-family:var(--font-headline); font-weight:600; font-size:19px;
  color:rgba(15,15,15,0.32); transition:color .3s ease;
}
.lst-arrow-mini{
  position:relative; width:18px; height:14px; flex-shrink:0;
  opacity:0; color:var(--signalgelb); transform:translateX(-4px);
  transition:opacity .2s ease, transform .2s ease;
}
.lst-arrow-frame-sm{position:absolute; inset:0; opacity:0; animation:lstArrowFlip 0.9s steps(1) infinite;}
.lst-arrow-frame-sm:nth-child(1){animation-delay:0s;}
.lst-arrow-frame-sm:nth-child(2){animation-delay:0.225s;}
.lst-arrow-frame-sm:nth-child(3){animation-delay:0.45s;}
.lst-arrow-frame-sm:nth-child(4){animation-delay:0.675s;}
.lst-item.active{color:var(--neverything); font-weight:800;}
.lst-item.active .lst-arrow-mini{opacity:1; transform:translateX(0);}

.lst-mid{text-align:center;}
.lst-num{
  font-family:'Stack Sans Notch', var(--font-display), sans-serif; font-weight:800; font-size:clamp(72px,9vw,150px);
  line-height:0.95; color:var(--neverything);
}
.lst-claim{
  font-family:var(--font-headline); font-weight:700; font-size:clamp(24px,2.8vw,40px);
  color:var(--neverything); margin-top:6px;
}

.lst-right .lst-what{
  font-family:'Courier New', monospace; font-size:11px; letter-spacing:0.05em;
  text-transform:uppercase; color:rgba(15,15,15,0.45); line-height:1.6; display:block; margin-bottom:20px;
}
.lst-right p{font-size:15px; line-height:1.6; color:rgba(15,15,15,0.7); margin-bottom:24px;}

.lst-arrow-indicator{
  position:absolute; left:50%; bottom:96px; transform:translateX(-50%);
  width:26px; height:34px; color:rgba(15,15,15,0.4);
  animation:lstArrowBounce 1.6s ease-in-out infinite;
}
@keyframes lstArrowBounce{
  0%, 100%{transform:translateX(-50%) translateY(0);}
  50%{transform:translateX(-50%) translateY(8px);}
}
.lst-arrow-frame{
  position:absolute; inset:0; opacity:0;
  animation:lstArrowFlip 0.9s steps(1) infinite;
}
.lst-arrow-frame:nth-child(1){animation-delay:0s;}
.lst-arrow-frame:nth-child(2){animation-delay:0.225s;}
.lst-arrow-frame:nth-child(3){animation-delay:0.45s;}
.lst-arrow-frame:nth-child(4){animation-delay:0.675s;}
@keyframes lstArrowFlip{
  0%{opacity:1;}
  24.9%{opacity:1;}
  25%{opacity:0;}
  100%{opacity:0;}
}
.lst-progress{
  position:absolute; right:max(32px, calc(50% - var(--max-w)/2 + 32px)); bottom:40px;
  font-family:'Courier New', monospace; font-size:12px; letter-spacing:0.05em;
  color:rgba(15,15,15,0.5);
}
.lst-skip{
  position:absolute; left:max(32px, calc(50% - var(--max-w)/2 + 32px)); bottom:40px;
  background:transparent; border:none; cursor:pointer;
  font-family:'Courier New', monospace; font-size:12px; letter-spacing:0.05em; text-transform:uppercase;
  color:rgba(15,15,15,0.5); display:flex; align-items:center; gap:6px; transition:color .15s ease;
}
.lst-skip:hover{color:var(--neverything);}
.lst-skip span{transition:transform .15s ease;}
.lst-skip:hover span{transform:translateY(2px);}

@media (max-width:960px){
  .lst-scroll-section{height:auto;}
  .lst-sticky{position:relative; height:auto; padding:80px 0 120px;}
  .lst-wrap{grid-template-columns:1fr; gap:32px; text-align:center;}
  .lst-left .lst-list{align-items:center;}
  .lst-arrow-indicator{display:none;}
}

.page-frame{
  position:fixed; inset:0; z-index:150; pointer-events:none;
  overflow:hidden;
  opacity:0; transition:opacity .3s ease;
}
.page-frame::before{
  content:''; position:absolute; inset:14px;
  border-radius:15px;
  box-shadow:0 0 0 9999px var(--signalgelb);
}
body.lst-framed .page-frame{opacity:1;}

/* ---------- SEITEN-ÜBERGANG (Ein-/Austauchen KI-Seite) ---------- */
.page-exit-overlay{
  position:fixed; inset:0; z-index:9999; background:var(--orchid-white);
  opacity:0; transition:opacity 0.5s ease-out; pointer-events:none;
}
.page-exit-overlay.active{opacity:1;}

.ki-boot{
  position:fixed; inset:0; z-index:9998; background:var(--neverything);
  opacity:1; transition:opacity 0.6s ease;
}
.ki-boot.done{opacity:0; pointer-events:none;}

/* ---------- KI & AUTOMATISIERUNG (dunkles, immersives Theme) ---------- */
body.ki-page{background:var(--neverything); color:var(--orchid-white); overflow-x:hidden;}
body.ki-page a{color:inherit;}
body.ki-page section{padding:96px 0;}
body.ki-page h1, body.ki-page h2, body.ki-page h3, body.ki-page h4, body.ki-page h5{color:var(--orchid-white);}
body.ki-page .breadcrumb{color:rgba(255,252,242,0.5); background:rgba(255,252,242,0.08);}
body.ki-page .subline{color:rgba(255,252,242,0.7);}
body.ki-page p, body.ki-page li{color:rgba(255,252,242,0.7);}
body.ki-page .eyebrow{color:var(--signalgelb);}
body.ki-page .eyebrow::before{background:var(--signalgelb);}
body.ki-page .kernpunkte li{border-bottom-color:rgba(255,252,242,0.12); color:rgba(255,252,242,0.75);}
body.ki-page .detail-list .item{border-color:rgba(255,252,242,0.14);}
body.ki-page .detail-list .item h5{color:var(--orchid-white);}
body.ki-page .detail-list .item p{color:rgba(255,252,242,0.65);}
body.ki-page .faq{border-top:none;}
body.ki-page .faq-item{border-bottom-color:rgba(255,252,242,0.14);}
body.ki-page .faq-q{color:var(--orchid-white);}
body.ki-page .faq-a{color:rgba(255,252,242,0.65);}
body.ki-page .ansprechpartner{background:rgba(255,252,242,0.04); border-color:rgba(255,252,242,0.12);}
body.ki-page .ansprechpartner .name{color:var(--orchid-white);}
body.ki-page .ansprechpartner .role, body.ki-page .ansprechpartner .phone{color:rgba(255,252,242,0.65);}
body.ki-page .ansprechpartner .avatar{background:var(--signalgelb); color:var(--neverything);}
body.ki-page .btn-ghost{border-color:var(--orchid-white); color:var(--orchid-white);}
body.ki-page .btn-ghost:hover{background:var(--signalgelb); border-color:var(--signalgelb); color:var(--neverything);}

body.ki-page .mega-dropdown{
  background:var(--neverything); border-color:rgba(255,252,242,0.12);
  box-shadow:0 30px 70px rgba(0,0,0,0.5);
}
body.ki-page .mega-row{color:var(--orchid-white); border-bottom-color:rgba(255,252,242,0.1);}
body.ki-page .mega-row:hover{background:rgba(255,164,32,0.16);}
body.ki-page .mega-row .thumb{background:rgba(255,252,242,0.08);}
body.ki-page .mega-row.rebounce .thumb{background:rgba(45,216,176,0.16);}
body.ki-page .mega-row.otc .thumb{background:rgba(139,92,246,0.2);}
body.ki-page .mega-row.shoppingplus .thumb{background:rgba(139,92,246,0.2);}
body.ki-page .mega-row.affiliate .thumb{background:rgba(139,92,246,0.2);}
body.ki-page .mega-badges-label{color:rgba(255,252,242,0.4);}
body.ki-page .mega-badge{background:rgba(255,252,242,0.08); color:rgba(255,252,242,0.75);}
body.ki-page .nav-info .tag{color:var(--orchid-white) !important;}
body.ki-page .nav-info .tag .home-icon{color:var(--orchid-white) !important;}
body.ki-page .nav-info .claim{color:rgba(255,252,242,0.55) !important;}
body.ki-page .nav-link{color:var(--orchid-white);}
body.ki-page .nav-center-pill{background:rgba(255,252,242,0.08); border-color:rgba(255,252,242,0.12);}
body.ki-page .menu-toggle{background:rgba(255,252,242,0.08); border-color:rgba(255,252,242,0.16); color:var(--orchid-white);}

.ki-sidenav{position:fixed; right:32px; top:50%; transform:translateY(-50%); z-index:250; display:flex; flex-direction:column; align-items:flex-end; gap:16px;}
.ki-sidenav-item{display:flex; align-items:center; gap:10px; cursor:pointer;}
.ki-sidenav-label{font-family:var(--font-body); font-size:11px; font-weight:300; text-transform:uppercase; letter-spacing:0.06em; color:rgba(255,252,242,0.35); white-space:nowrap; opacity:0; transform:translateX(6px); transition:opacity .2s ease, transform .2s ease, color .2s ease;}
.ki-sidenav-item:hover .ki-sidenav-label{opacity:1; transform:translateX(0);}
.ki-sidenav-dot{width:6px; height:6px; border-radius:50%; background:rgba(255,252,242,0.3); transition:background .2s ease, transform .2s ease; flex-shrink:0;}
.ki-sidenav-item.active .ki-sidenav-dot{background:var(--signalgelb); transform:scale(1.6);}
.ki-sidenav-item.active .ki-sidenav-label{opacity:1; transform:translateX(0); color:var(--orchid-white);}
@media (max-width:900px){ .ki-sidenav{display:none;} }

/* --- Generische Sidenav für Leistungsseiten mit hellem Hintergrund (SEA, Social, Programmatic, Websites, Regional, Performance Marketing) --- */
.side-nav{position:fixed; right:32px; top:50%; transform:translateY(-50%); z-index:250; display:flex; flex-direction:column; align-items:flex-end; gap:16px;}
.side-nav-item{display:flex; align-items:center; gap:10px; cursor:pointer;}
.side-nav-label{font-family:var(--font-body); font-size:11px; font-weight:400; text-transform:uppercase; letter-spacing:0.06em; color:rgba(15,15,15,0.35); white-space:nowrap; opacity:0; transform:translateX(6px); transition:opacity .2s ease, transform .2s ease, color .2s ease;}
.side-nav-item:hover .side-nav-label{opacity:1; transform:translateX(0);}
.side-nav-dot{width:6px; height:6px; border-radius:50%; background:rgba(15,15,15,0.18); transition:background .2s ease, transform .2s ease; flex-shrink:0;}
.side-nav-item.active .side-nav-dot{background:var(--signalgelb); transform:scale(1.6);}
.side-nav-item.active .side-nav-label{opacity:1; transform:translateX(0); color:var(--neverything);}
@media (max-width:1100px){ .side-nav{display:none;} }

.ki-hero{
  position:relative; min-height:100vh; margin-top:-88px;
  display:flex; align-items:center; padding:140px 0 100px;
}
.ki-hero-scroll{z-index:2; color:rgba(255,252,242,0.55);}
.ki-hero-orbs{position:absolute; inset:0; z-index:0; pointer-events:none;}
.ki-orb{
  position:absolute; border-radius:50%; filter:blur(70px); opacity:0.45;
  animation:kiDrift 16s ease-in-out infinite;
}
.ki-orb-1{width:420px; height:420px; background:var(--purple-accent); top:-10%; left:-8%; animation-delay:0s;}
.ki-orb-2{width:560px; height:560px; background:var(--signalgelb); bottom:-38%; right:-8%; animation-delay:-6s;}
.ki-orb-3{width:260px; height:260px; background:var(--purple-accent); top:35%; right:20%; opacity:0.28; animation-delay:-11s;}
@keyframes kiDrift{
  0%, 100%{ transform:translate(0,0) scale(1); }
  50%{ transform:translate(30px,-24px) scale(1.08); }
}
.ki-hero-grid{
  position:absolute; inset:0; z-index:0; pointer-events:none; opacity:0.25;
  background-image:linear-gradient(rgba(255,252,242,0.06) 1px, transparent 1px), linear-gradient(90deg, rgba(255,252,242,0.06) 1px, transparent 1px);
  background-size:64px 64px;
  mask-image:radial-gradient(ellipse 70% 70% at 50% 40%, black 40%, transparent 80%);
}
.ki-hero .wrap{position:relative; z-index:1; width:100%;}
.ki-hero-content{opacity:0; transform:translateY(26px) scale(0.98); animation:kiMaterialize 0.9s cubic-bezier(.2,.8,.2,1) forwards; animation-delay:0.35s;}
@keyframes kiMaterialize{ to{ opacity:1; transform:translateY(0) scale(1); } }
.ki-hero h1{font-size:clamp(38px,6vw,68px); margin:16px 0 16px;}
.ki-hero-outline-title{font-size:clamp(44px,7.2vw,86px) !important; line-height:1.05;}
.ki-outline-word{color:transparent; -webkit-text-stroke:1.5px var(--orchid-white); text-stroke:1.5px var(--orchid-white);}
.ki-hero .subline{font-size:19px; max-width:600px;}
@media (max-width:700px){
  .ki-hero{min-height:70vh; padding:120px 0 72px;}
  .ki-orb{filter:blur(50px);}
}

.ki-block-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-top:40px;}
@media (max-width:900px){ .ki-block-grid{grid-template-columns:1fr;} }

.ki-approach{padding:120px 0 !important; position:relative;}
.ki-approach-grid{position:relative; z-index:1;}
.ki-approach-grid{display:grid; grid-template-columns:0.85fr 1.15fr; gap:80px; align-items:start;}
.ki-approach-sticky{position:sticky; top:120px; align-self:start;}
.ki-mascot{position:relative; width:160px; height:160px; margin-top:-16px; margin-bottom:28px; cursor:pointer;}
.ki-mascot-bubble{
  position:absolute; left:calc(100% + 14px); top:-6px; z-index:5; max-width:220px;
  background:var(--orchid-white); color:var(--neverything); font-size:13px; line-height:1.4; font-weight:500;
  padding:12px 14px; border-radius:4px 14px 14px 14px; box-shadow:0 12px 30px rgba(0,0,0,0.35);
  opacity:0; transform:translateY(6px) scale(0.96); pointer-events:none;
  transition:opacity .2s ease, transform .2s ease;
}
.ki-mascot-bubble.visible{opacity:1; transform:translateY(0) scale(1);}
@media (max-width:1100px){ .ki-mascot-bubble{left:0; top:calc(100% + 10px);} }
.ki-mascot-hint{
  position:absolute; left:78%; top:6%; z-index:6; white-space:nowrap;
  background:var(--signalgelb); color:var(--neverything); font-family:var(--font-accent);
  font-size:12px; font-weight:700; letter-spacing:0.01em;
  padding:7px 14px; border-radius:999px; box-shadow:0 10px 24px rgba(255,164,32,0.35);
  opacity:0; transform:translate(0,4px) scale(0.9); pointer-events:none;
  transition:opacity .3s ease, transform .3s ease;
  animation:kiHintBob 1.6s ease-in-out infinite;
}
.ki-mascot-hint.visible{opacity:1; transform:translate(0,0) scale(1); pointer-events:auto;}
.ki-mascot-hint::after{
  content:''; position:absolute; left:16px; bottom:-5px; width:10px; height:10px;
  background:var(--signalgelb); transform:rotate(45deg); border-radius:2px;
}
@keyframes kiHintBob{
  0%, 100%{ transform:translate(0,0) scale(1); }
  50%{ transform:translate(0,-5px) scale(1); }
}
.ki-mascot-hint.visible{ animation:kiHintPop .3s ease, kiHintBob 1.6s ease-in-out .3s infinite; }
@keyframes kiHintPop{
  0%{ opacity:0; transform:translate(0,4px) scale(0.9); }
  60%{ opacity:1; transform:translate(0,-3px) scale(1.05); }
  100%{ opacity:1; transform:translate(0,0) scale(1); }
}
@media (max-width:1100px){ .ki-mascot-hint{left:auto; right:-6px; top:-10px;} }
.ki-mascot-face{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:100px; height:100px; z-index:1;}
.ki-mascot-head{fill:rgba(255,252,242,0.06); stroke:var(--signalgelb); stroke-width:1.5; transition:stroke .5s ease;}
.ki-eye-white{fill:var(--orchid-white);}
.ki-eye-pupil{fill:var(--neverything); transition:transform .1s ease-out;}
.ki-mascot-particle{position:absolute; top:50%; left:50%; width:4px; height:4px; border-radius:50%; background:var(--signalgelb); transform:rotate(calc(var(--i) * 22.5deg)) translate(76px) rotate(calc(var(--i) * -22.5deg)); animation:kiParticlePulse 3s ease-in-out infinite; animation-delay:calc(var(--i) * 0.12s); transition:background .5s ease;}
@keyframes kiParticlePulse{
  0%, 100%{opacity:0.35; transform:rotate(calc(var(--i) * 22.5deg)) translate(76px) rotate(calc(var(--i) * -22.5deg)) scale(0.8);}
  50%{opacity:1; transform:rotate(calc(var(--i) * 22.5deg)) translate(76px) rotate(calc(var(--i) * -22.5deg)) scale(1.2);}
}
.ki-mascot[data-active="1"] .ki-mascot-head{stroke:var(--purple-accent);}
.ki-mascot[data-active="1"] .ki-mascot-particle{background:var(--purple-accent);}
.ki-mascot[data-active="2"] .ki-mascot-head{stroke:var(--mint-accent);}
.ki-mascot[data-active="2"] .ki-mascot-particle{background:var(--mint-accent);}
.ki-mascot[data-active="3"] .ki-mascot-particle{animation-duration:5s;}
@media (max-width:900px){ .ki-mascot{display:none;} }

/* --- KUNO-Kopf (offizielles Artwork aus Brand Book), ersetzt altes Augen-folgen-Maskottchen --- */
.kuno-face-wrap{position:relative;}
.kuno-head-img{width:100%; height:100%; object-fit:contain; display:block; user-select:none; pointer-events:none;}
.kuno-eye-patch{position:absolute; background:rgb(13,35,60); border-radius:999px;}
.kuno-eye-bar{position:absolute; background:var(--signalgelb); border-radius:999px; transform-origin:center; animation:kunoBlink 4.6s ease-in-out infinite;}
#kuno-eye-right{animation-delay:0.02s;}
@keyframes kunoBlink{
  0%, 90%, 100%{transform:scaleY(1);}
  94%{transform:scaleY(0.1);}
  97%{transform:scaleY(1);}
}

.ki-approach-tabs{position:relative; display:flex; align-items:center; gap:22px; margin-top:36px; max-width:420px;}
.ki-approach-tab{
  font-family:var(--font-display); font-size:13px; font-weight:800; letter-spacing:0.04em;
  color:rgba(255,252,242,0.3); transition:color .3s ease; position:relative; z-index:1;
}
.ki-approach-tab.active{color:var(--signalgelb);}
.ki-approach-tabs-line{
  position:absolute; left:0; right:0; bottom:-14px; height:1px; background:rgba(255,252,242,0.14);
}
.ki-approach-tabs-fill{
  position:absolute; left:0; top:0; height:100%; width:0%;
  background:var(--signalgelb); transition:width .5s cubic-bezier(.4,0,.2,1);
}
@media (max-width:900px){ .ki-approach-tabs{display:none;} }
.ki-approach-sticky h2{font-size:clamp(28px,3.6vw,42px); margin:16px 0 16px; line-height:1.15;}
.ki-approach-sticky p{max-width:420px; font-size:15px; line-height:1.6;}
body.ki-page{scroll-snap-type:y proximity;}
.ki-approach-points{display:flex; flex-direction:column; gap:22vh; margin-top:170px;}
.ki-approach-point{
  opacity:0.25; transform:translateY(24px); transition:opacity .5s ease, transform .5s ease; max-width:520px;
  scroll-snap-align:start; scroll-snap-stop:always; scroll-margin-top:140px;
}
.ki-approach-point.in-view{opacity:1; transform:translateY(0);}
.ki-approach-num{display:block; font-family:var(--font-display); font-size:14px; font-weight:800; color:var(--signalgelb); margin-bottom:14px; letter-spacing:0.05em;}
.ki-approach-point h3{font-size:24px; margin-bottom:12px;}
.ki-approach-point p{font-size:15px; line-height:1.65;}
@media (max-width:900px){
  .ki-approach-grid{grid-template-columns:1fr; gap:40px;}
  .ki-approach-sticky{position:static;}
  .ki-approach-points{gap:60px;}
  .ki-approach-point{opacity:1; transform:none; scroll-snap-align:none; scroll-snap-stop:normal;}
}

.ki-block{
  background:rgba(255,252,242,0.04); border:1px solid rgba(255,252,242,0.1);
  border-radius:20px; padding:32px; display:flex; flex-direction:column;
  transition:border-color .2s ease, background .2s ease;
}
.ki-block:hover{background:rgba(255,252,242,0.06); border-color:rgba(255,252,242,0.2);}
.ki-block-icon{
  width:52px; height:52px; border-radius:14px; margin-bottom:20px;
  display:flex; align-items:center; justify-content:center;
}
.ki-block-icon .thumb{width:22px; height:22px;}
.ki-block-yellow .ki-block-icon{background:rgba(255,164,32,0.15);}
.ki-block-yellow .ki-block-icon .thumb i.on{background:var(--signalgelb);}
.ki-block-purple .ki-block-icon{background:rgba(139,92,246,0.18);}
.ki-block-purple .ki-block-icon .thumb i.on{background:var(--purple-accent);}
.ki-block h3{font-size:19px; margin-bottom:10px;}
.ki-block > p{font-size:14px; line-height:1.55; color:rgba(255,252,242,0.65); margin-bottom:20px;}
.ki-block ul{list-style:none; display:flex; flex-direction:column; gap:8px; margin-top:auto;}
.ki-block ul li{
  font-size:13px; color:rgba(255,252,242,0.6); padding-left:16px; position:relative;
}
.ki-block ul li::before{
  content:''; position:absolute; left:0; top:7px; width:6px; height:6px; border-radius:50%;
  background:var(--signalgelb);
}
.ki-block-purple ul li::before{background:var(--purple-accent);}

/* ---------- PRODUKT-HERO (nrg-Referenz: Orange-Wipe über Headline) ---------- */
.prod-hero{
  position:relative; height:calc(100vh - 88px); min-height:560px;
  border-bottom:1px solid rgba(15,15,15,0.08); overflow:hidden;
}
.prod-hero-top{position:absolute; top:210px; left:0; right:0;}
.prod-hero-headline-col{position:absolute; top:260px; left:0; right:0;}
.prod-hero-headline{
  font-family:var(--font-display); font-weight:800;
  font-size:clamp(38px,6.4vw,88px); line-height:0.98; letter-spacing:-0.01em;
  text-transform:uppercase;
}
.prod-hero-line{position:relative; display:block; overflow:hidden;}
.prod-hero-headline-base{display:block; color:var(--neverything);}
.prod-hero-headline-fill{
  position:absolute; top:0; left:0; display:block; color:var(--signalgelb);
  clip-path:inset(0 100% 0 0); pointer-events:none; will-change:clip-path;
}
.prod-hero-bottom-row{
  position:absolute; left:0; right:0; bottom:48px;
  display:flex; justify-content:space-between; align-items:flex-end; gap:40px; flex-wrap:wrap;
}
.prod-hero-sub{max-width:300px; font-size:15px; color:var(--midnight-navy); font-weight:400; text-align:right;}
.prod-hero-hint{
  display:inline-flex; align-items:center; gap:8px; font-family:var(--font-body); font-size:12px;
  color:rgba(15,15,15,0.4); text-transform:uppercase; letter-spacing:0.05em;
  animation:jobScrollHintDrift 1.8s ease-in-out infinite;
}
.prod-hero-hint::after{content:'↓'; font-family:var(--font-accent);}
@media (max-width:900px){
  .prod-hero{height:auto; min-height:100vh; padding-bottom:180px;}
  .prod-hero-bottom-row{flex-direction:column; align-items:flex-start; gap:16px; bottom:32px;}
  .prod-hero-sub{text-align:left; max-width:100%;}
}

/* ---------- OTC USER JOURNEY (sui.io-Referenz: wandernder Cursor auf gepunkteter Linie) ---------- */
.otc-journey-scroll{position:relative; height:420vh; background:var(--orchid-white); color:var(--neverything);}
.otc-journey-head{padding-top:96px;}
.otc-journey-title{font-size:clamp(30px,4.2vw,46px); margin:16px 0 12px; color:var(--neverything);}
.otc-journey-sub{font-size:15px; color:var(--midnight-navy); max-width:520px;}

.otc-journey-sticky{
  position:sticky; top:0; height:100vh; overflow:hidden;
  display:flex; align-items:center;
}
.otc-journey-inner{display:flex; align-items:center; gap:56px; width:100%;}
.otc-journey-line-wrap{position:relative; width:0; height:320px;}
.otc-journey-line{
  position:absolute; top:0; bottom:0; left:0;
  border-left:2px dotted rgba(15,15,15,0.25);
}
.otc-journey-cursor{
  position:absolute; left:-4px; top:0; width:9px; height:9px;
  background:var(--purple-accent); transition:top .1s linear;
}
.otc-journey-connector{
  position:relative; width:56px; height:1px; background:rgba(15,15,15,0.25); flex-shrink:0;
}
.otc-journey-cardzone{position:relative; width:min(480px,78vw); height:220px;}
.otc-journey-card{
  position:absolute; inset:0; opacity:0; pointer-events:none;
  transition:opacity .45s ease, transform .45s ease;
  transform:translateX(var(--enter-x, 36px));
  border:1px solid rgba(15,15,15,0.12); background:rgba(15,15,15,0.015);
}
.otc-journey-card.active{opacity:1; transform:translateX(0); pointer-events:auto;}
.otc-journey-card-top{
  position:relative; padding:16px 20px 16px 92px; min-height:24px;
  border-bottom:1px solid rgba(15,15,15,0.12);
  font-family:monospace; font-size:13px; letter-spacing:0.03em;
  display:flex; align-items:center;
}
.otc-journey-num{
  position:absolute; left:20px; top:50%; transform:translateY(-50%);
  color:var(--purple-accent); font-weight:700; font-size:26px; font-family:var(--font-display);
}
.otc-journey-cardtitle{text-transform:uppercase; color:var(--neverything);}
.otc-journey-card-bottom{display:flex; align-items:center; gap:20px; padding:24px 20px;}
.otc-journey-icon{
  width:52px; height:52px; flex-shrink:0; border:1px solid rgba(15,15,15,0.16);
  display:flex; align-items:center; justify-content:center;
  animation:otcPulse 2.6s ease-in-out infinite;
}
.otc-journey-icon .thumb{width:20px; height:20px;}
.otc-journey-icon .thumb i.on{background:var(--purple-accent);}
@keyframes otcPulse{
  0%, 100%{ transform:scale(1); opacity:0.8; }
  50%{ transform:scale(1.1); opacity:1; }
}
.otc-journey-card-bottom p{font-size:13.5px; line-height:1.55; color:var(--midnight-navy); font-weight:400;}
@media (max-width:800px){
  .otc-journey-sticky{flex-direction:column; gap:24px; justify-content:center;}
  .otc-journey-line-wrap{display:none;}
  .otc-journey-connector{display:none;}
  .otc-journey-cardzone{width:88vw;}
}



/* --- Performance Marketing Hub: Akkordeon-Link direkt im Fließtext --- */
.pm-acc-link{display:inline-flex; align-items:center; gap:8px; font-weight:800; font-size:15px; color:var(--signalgelb); text-decoration:none; white-space:nowrap;}
.pm-acc-link-chev{width:8px; height:8px; border-right:2px solid var(--signalgelb); border-bottom:2px solid var(--signalgelb); transform:rotate(-45deg); transition:transform .2s ease;}
.pm-acc-link:hover .pm-acc-link-chev{transform:rotate(-45deg) translate(2px,-2px);}

/* ============ FOOTER: minimalistische Abschluss-Szene (fließend, hell/dunkel je nach Seite) ============ */
.site-footer-scene{position:relative; padding:96px 0 0; overflow:hidden;}
.site-footer-scene.on-light{
  background:linear-gradient(to bottom, var(--orchid-white) 0px, var(--page-light,#F6F4EF) 220px, var(--page-light,#F6F4EF) 100%);
  color:var(--neverything);
  --fs-text-dim: rgba(15,15,15,0.45);
  --fs-text-dim2: rgba(15,15,15,0.55);
  --fs-line: rgba(15,15,15,0.12);
  --fs-bleed: var(--signalgelb);
  --fs-glow-1: rgba(255,164,32,0.20);
  --fs-glow-2: rgba(255,164,32,0.10);
  --fs-glow-3: rgba(15,41,66,0.10);
}
.site-footer-scene.on-dark{
  background:var(--neverything); color:var(--orchid-white);
  --fs-text-dim: rgba(255,252,242,0.8);
  --fs-text-dim2: rgba(255,252,242,0.55);
  --fs-line: rgba(255,252,242,0.12);
  --fs-bleed: rgba(255,252,242,0.08);
}
.site-footer-scene.on-dark .footer-scene-glow{display:none;}
.footer-scene-glow{
  position:absolute; top:-30%; left:50%; width:1100px; height:900px; transform:translateX(-50%);
  background:radial-gradient(circle at 50% 30%, var(--fs-glow-1) 0%, var(--fs-glow-2) 30%, var(--fs-glow-3) 55%, rgba(15,15,15,0) 72%);
  filter:blur(40px); animation:footerGlowFlow 12s ease-in-out infinite; pointer-events:none; z-index:0;
  -webkit-mask-image:linear-gradient(to bottom, transparent 0%, transparent 32%, #000 58%);
  mask-image:linear-gradient(to bottom, transparent 0%, transparent 32%, #000 58%);
}
@keyframes footerGlowFlow{
  0%, 100%{ transform:translateX(-50%) translateY(0) scale(1); opacity:0.9; }
  50%{ transform:translateX(-50%) translateY(30px) scale(1.08); opacity:1; }
}
.footer-scene-content{position:relative; z-index:1;}
.footer-scene-bottom{
  display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap;
  padding-top:24px; padding-bottom:32px; border-top:1px solid var(--fs-line);
}
.footer-scene-left{display:flex; align-items:center; gap:20px; flex-wrap:wrap; font-family:var(--font-accent); font-size:13px; font-weight:600;}
.footer-scene-copyright{color:var(--fs-text-dim);}
.footer-scene-legal{display:flex; gap:18px; flex-wrap:wrap;}
.footer-scene-legal a{color:var(--fs-text-dim); transition:color .2s ease;}
.footer-scene-legal a:hover{color:inherit;}
.footer-scene-social{display:flex; align-items:center; gap:10px; font-family:var(--font-accent); font-size:13px; font-weight:600;}
.footer-scene-social a{color:var(--fs-text-dim2); transition:color .2s ease;}
.footer-scene-social a:hover{color:var(--signalgelb);}
.footer-scene-social .sep{color:var(--fs-line);}
.footer-scene-bleed{
  position:relative; z-index:1; margin-top:32px; padding-top:24px;
  font-family:var(--font-display); font-weight:800; text-transform:uppercase;
  font-size:clamp(120px,22vw,320px); line-height:0.72; letter-spacing:-0.02em;
  text-align:center; color:var(--fs-bleed); user-select:none;
}
@media (max-width:640px){
  .footer-scene-bottom{flex-direction:column; align-items:flex-start;}
  .footer-scene-left{flex-direction:column; align-items:flex-start; gap:10px;}
  .footer-scene-bleed{font-size:clamp(80px,32vw,160px);}
}

/* ============ KUNO: globales Chat-Widget (site-weit) ============ */
.kuno-chat-launcher{
  position:fixed; bottom:28px; right:86px; width:52px; height:52px; border-radius:50%;
  background:var(--signalgelb); display:flex; align-items:center; justify-content:center;
  cursor:pointer; z-index:250; box-shadow:0 10px 24px rgba(255,164,32,0.4);
  opacity:0; transform:scale(0.6); pointer-events:none; overflow:hidden;
  transition:opacity .25s ease, transform .25s ease;
}
.kuno-chat-launcher.visible{opacity:1; transform:scale(1); pointer-events:auto;}
.kuno-chat-launcher img{width:76%; height:76%; object-fit:contain;}
.kuno-chat-launcher.pulse{animation:kunoLauncherPulse 1.1s ease-in-out 3;}
@keyframes kunoLauncherPulse{
  0%, 100%{ box-shadow:0 10px 24px rgba(255,164,32,0.4); transform:scale(1); }
  50%{ box-shadow:0 10px 24px rgba(255,164,32,0.4), 0 0 0 10px rgba(255,164,32,0.25); transform:scale(1.06); }
}
@media (max-width:640px){ .kuno-chat-launcher{right:20px; bottom:20px;} }

.kuno-chat-overlay{
  position:fixed; inset:0; z-index:300; background:rgba(15,15,15,0.35);
  display:flex; align-items:flex-end; justify-content:flex-end; padding:28px;
  opacity:0; pointer-events:none; transition:opacity .25s ease;
}
.kuno-chat-overlay.open{opacity:1; pointer-events:auto;}
.kuno-chat-window{
  width:360px; max-width:calc(100vw - 40px); height:520px; max-height:calc(100vh - 56px);
  background:var(--orchid-white); border-radius:24px; box-shadow:0 30px 70px rgba(0,0,0,0.35);
  display:flex; flex-direction:column; overflow:hidden;
  transform:translateY(16px) scale(0.97); opacity:0; transition:transform .25s ease, opacity .25s ease;
}
.kuno-chat-overlay.open .kuno-chat-window{transform:translateY(0) scale(1); opacity:1;}
.kuno-chat-header{
  display:flex; align-items:center; gap:12px; padding:16px 18px;
  background:var(--neverything); color:var(--orchid-white); flex-shrink:0;
}
.kuno-chat-header-avatar{width:36px; height:36px; border-radius:50%; background:var(--signalgelb); display:flex; align-items:center; justify-content:center; flex-shrink:0; overflow:hidden;}
.kuno-chat-header-avatar img{width:80%; height:80%; object-fit:contain;}
.kuno-chat-header-name{font-family:var(--font-accent); font-weight:800; font-size:14px;}
.kuno-chat-header-status{font-size:11px; color:rgba(255,252,242,0.55); display:flex; align-items:center; gap:5px;}
.kuno-chat-header-status::before{content:''; width:6px; height:6px; border-radius:50%; background:#3fd68a; display:inline-block;}
.kuno-chat-close{
  margin-left:auto; width:28px; height:28px; border-radius:50%; border:none;
  background:rgba(255,252,242,0.1); color:var(--orchid-white); font-size:16px; line-height:1; cursor:pointer;
  display:flex; align-items:center; justify-content:center; transition:background .2s ease;
}
.kuno-chat-close:hover{background:rgba(255,252,242,0.2);}
.kuno-chat-body{
  flex:1; overflow-y:auto; padding:18px; display:flex; flex-direction:column; gap:10px;
  background:var(--page-light,#F6F4EF);
}
.kuno-msg{
  max-width:80%; padding:10px 14px; border-radius:14px; font-size:13.5px; line-height:1.45;
  opacity:0; transform:translateY(6px); animation:kunoMsgIn .25s ease forwards;
}
@keyframes kunoMsgIn{ to{ opacity:1; transform:translateY(0); } }
.kuno-msg-bot{
  align-self:flex-start; background:#fff; color:var(--neverything); border:1px solid rgba(15,15,15,0.08);
  border-radius:4px 14px 14px 14px;
}
.kuno-msg-user{
  align-self:flex-end; background:var(--signalgelb); color:var(--neverything);
  border-radius:14px 4px 14px 14px; font-weight:600;
}
.kuno-msg-typing{
  align-self:flex-start; background:#fff; border:1px solid rgba(15,15,15,0.08); border-radius:4px 14px 14px 14px;
  padding:12px 16px; display:flex; gap:4px;
}
.kuno-msg-typing span{width:6px; height:6px; border-radius:50%; background:rgba(15,15,15,0.35); animation:kunoTypingDot 1s infinite ease-in-out;}
.kuno-msg-typing span:nth-child(2){animation-delay:.15s;}
.kuno-msg-typing span:nth-child(3){animation-delay:.3s;}
@keyframes kunoTypingDot{ 0%, 60%, 100%{transform:translateY(0); opacity:0.4;} 30%{transform:translateY(-4px); opacity:1;} }
.kuno-chat-options{display:flex; flex-wrap:wrap; gap:8px; align-self:flex-start; max-width:100%;}
.kuno-chat-option-btn{
  font-family:var(--font-accent); font-weight:700; font-size:12.5px; letter-spacing:0.01em;
  padding:9px 16px; border-radius:999px; border:1.5px solid var(--neverything); background:#fff; color:var(--neverything);
  cursor:pointer; transition:background .2s ease, color .2s ease;
}
.kuno-chat-option-btn:hover{background:var(--neverything); color:var(--orchid-white);}
.kuno-chat-cta{
  align-self:flex-start; margin-top:4px; display:inline-flex; align-items:center; gap:8px;
  font-family:var(--font-accent); font-weight:800; font-size:13px; text-decoration:none;
  background:var(--signalgelb); color:var(--neverything); padding:11px 18px; border-radius:999px;
  opacity:0; transform:translateY(6px); animation:kunoMsgIn .25s ease forwards;
}
@media (max-width:480px){
  .kuno-chat-overlay{padding:0;}
  .kuno-chat-window{width:100%; max-width:100%; height:100%; max-height:100%; border-radius:0;}
}
