/* Gedankenspiel 28.10.2026: Startseite von infoboxed im Aufbau und Look des heutigen SoundCloud.
   Dunkler Grund, sehr fette Grossbuchstaben, Pillen-Knoepfe, Fotos; Pink bleibt die Markenfarbe.
   Fotos: Unsplash (freie Lizenz), nur verlinkt. Nur Entwurf in _farbe, nie committen. */
:root{
  --bg:#121212; --card:#1E1E1E; --fg:#FFFFFF; --muted:#A3A3A3; --faint:#777; --line:#2A2A2A; --line2:#3A3A3A; --soft:#1A1A1A;
  --accent:#E0246B; --accent-ink:#FFFFFF; --accent-soft:#3A1526; --accent-text:#FF6B9A; --night:#000;
}
html,body{background:#121212!important;color:#fff}
p,li,.lead{color:#BDBDBD}
a{color:#fff}
main section{background:transparent!important;border:0!important}

/* Schrift wie "IT ALL STARTS WITH AN UPLOAD." */
h1,h2,.sc-titel{color:#fff;font-weight:900!important;text-transform:uppercase;letter-spacing:-.05em!important;line-height:.9!important;margin:0}
h2{font-size:clamp(30px,4vw,52px)!important}
h3{color:#fff;font-weight:800;letter-spacing:-.01em}
em.hl{font-style:normal}

/* Kopfleiste */
.top{background:#121212!important;backdrop-filter:none!important;border-bottom:1px solid #222!important}
.top .brand{color:#fff;letter-spacing:.06em;text-transform:uppercase;font-size:15px;font-weight:800}
.top nav a,.top .mm-knopf,.top .mm-name{color:#fff!important}
.mm-panel,.mm-drop,.mob-menu{background:#1A1A1A!important;color:#fff;border-color:#2A2A2A!important}

/* Knoepfe */
.btn{border-radius:999px!important;font-weight:700;box-shadow:none!important}
.btn.pri{color:#fff!important;border:0}
.btn:not(.pri){background:#000!important;color:#fff!important;border:1px solid #333!important}
.btn.sc-weiss{background:#fff!important;color:#121212!important;border:0!important;height:46px;padding:0 24px;font-size:16px}
.btn.sc-weiss:hover{background:#E8E8E8!important}
.top .btn{height:34px!important;padding:0 16px!important;font-size:14px!important}
.sc-link{color:#fff;font-weight:700;text-decoration:none;font-size:16px}
.sc-link:hover{text-decoration:underline}
.sc-akt{display:flex;align-items:center;gap:28px;flex-wrap:wrap}

/* ---------- Hero: Foto-Karussell ---------- */
.sc-hero{padding:24px 0 0!important}
.sc-hero > .wrap{display:flex;flex-direction:column;align-items:center;max-width:1280px}
.sc-buehne{position:relative;width:100%;height:clamp(440px,38vw,520px);border-radius:12px;overflow:hidden;background:#222}
.sc-slide{position:absolute;inset:0;opacity:0;transition:opacity .9s ease;pointer-events:none}
.sc-slide.an{opacity:1;pointer-events:auto}
.sc-slide img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:0;transform:scale(1.02)}
.sc-slide.an img{animation:sc-zoom 8s ease-out forwards}
.sc-slide::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.72) 0%,rgba(0,0,0,.35) 50%,rgba(0,0,0,.05) 100%)}
.sc-slide .sc-text{position:absolute;z-index:1;left:clamp(24px,8%,120px);top:50%;transform:translateY(-50%);max-width:640px}
.sc-titel{font-size:clamp(40px,5.6vw,76px)!important}
.sc-titel em.hl{display:block}
.sc-sub{color:#fff!important;font-weight:600;font-size:18px;line-height:1.35;margin:18px 0 30px;max-width:30em}
.sc-slide .sc-titel,.sc-slide .sc-sub,.sc-slide .sc-akt{opacity:0;transform:translateY(18px)}
.sc-slide.an .sc-titel,.sc-slide.an .sc-sub,.sc-slide.an .sc-akt{animation:sc-hoch .7s cubic-bezier(.2,.7,.2,1) forwards}
.sc-slide.an .sc-sub{animation-delay:.12s}
.sc-slide.an .sc-akt{animation-delay:.24s}
.sc-punkte{position:absolute;z-index:2;left:50%;bottom:20px;transform:translateX(-50%);display:flex;gap:10px}
.sc-punkte button{width:30px;height:4px;padding:0;border:0;border-radius:2px;background:rgba(255,255,255,.35);cursor:pointer;overflow:hidden}
.sc-punkte button i{display:block;height:100%;width:0;background:#fff}
.sc-punkte button.an i{animation:sc-lauf 6.5s linear forwards}

/* Eingabe wie das Suchfeld, darunter "oder" */
.sc-suche{position:relative;width:min(600px,100%);margin:40px 0 0!important;display:block!important}
.sc-suche input{width:100%;height:48px!important;background:#2A2A2A!important;color:#fff!important;border:0!important;border-radius:999px!important;padding:0 60px 0 24px!important;font-size:16px;text-align:center}
.sc-suche input::placeholder{color:#9A9A9A}
.sc-los{position:absolute;right:5px;top:5px;width:38px;height:38px;border-radius:50%;border:0;background:var(--verlauf-knopf,var(--accent));color:#fff;display:grid;place-items:center;cursor:pointer}
.sc-oder{color:#fff!important;font-weight:700;margin:18px 0}

/* ---------- Trend-Reihe ---------- */
.sc-trend{padding:88px 0 40px!important}
.sc-mitte{text-align:center;font-size:clamp(24px,2.6vw,32px)!important;text-transform:none;letter-spacing:-.02em!important;margin-bottom:32px!important}
.sc-reihe{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.sc-band{display:flex;gap:16px;width:max-content;animation:sc-band 60s linear infinite}
.sc-reihe:hover .sc-band{animation-play-state:paused}
.sc-cover{width:190px;flex:none;text-decoration:none;display:flex;flex-direction:column}
.sc-bild-q{position:relative;display:block;aspect-ratio:1;border-radius:4px;overflow:hidden;margin-bottom:10px;background:#222}
.sc-bild-q img{width:100%;height:100%;object-fit:cover;border-radius:0;transition:transform .5s ease}
.sc-cover:hover .sc-bild-q img{transform:scale(1.06)}
.sc-tag{position:absolute;left:8px;bottom:8px;background:rgba(0,0,0,.65);color:#fff;font-size:11.5px;font-weight:700;padding:3px 8px;border-radius:999px}
.sc-play{position:absolute;right:10px;top:10px;width:44px;height:44px;border-radius:50%;background:var(--verlauf-knopf,var(--accent));opacity:0;transform:scale(.8);transition:.25s}
.sc-play::after{content:"";position:absolute;left:17px;top:13px;border-style:solid;border-width:9px 0 9px 14px;border-color:transparent transparent transparent #fff}
.sc-cover:hover .sc-play{opacity:1;transform:none}
.sc-cover b{color:#fff;font-size:14px;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sc-cover > span:last-child{color:#999;font-size:13px;font-weight:600}
/* Drops zentriert (29.10.2026): Text unter dem Bild und Etikett mittig */
.sc-trend .sc-cover{align-items:center;text-align:center}
.sc-trend .sc-cover .sc-bild-q{align-self:stretch}
.sc-trend .sc-cover b{max-width:100%}
.sc-trend .sc-tag{left:50%;translate:-50% 0;white-space:nowrap}
@keyframes sc-wipp{0%,100%{translate:0 0}50%{translate:0 -4px}}
.sc-mitte-k{display:flex;justify-content:center;margin-top:40px}

/* ---------- Split wie "Never stop listening" ---------- */
.sc-split{padding:72px 0!important}
.sc-split .wrap{display:grid;grid-template-columns:1.1fr 1fr;gap:64px;align-items:center}
.sc-split-bild{position:relative;aspect-ratio:4/4.2;border-radius:12px}
.sc-split-bild > img{width:100%;height:100%;object-fit:cover;border-radius:12px}
.sc-split-bild .phone{position:absolute!important;right:-28px;bottom:-36px;transform:scale(.72);transform-origin:bottom right;margin:0!important}
.sc-float{position:absolute;background:#fff;color:#121212;font-weight:800;font-size:14px;padding:9px 14px;border-radius:999px;box-shadow:0 12px 30px rgba(0,0,0,.4);animation:sc-schweb 5s ease-in-out infinite}
.sc-float::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--accent);margin-right:8px;vertical-align:1px}
.sc-float.f1{left:-22px;top:14%}
.sc-float.f2{left:8%;bottom:10%;animation-delay:-1.6s}
.sc-float.f3{right:22%;top:-16px;animation-delay:-3.1s}
.sc-split-text h2{margin-bottom:22px!important}
.sc-split-text .lead{font-size:17px;max-width:32em}
.sc-orte{list-style:none;padding:0;margin:26px 0 34px;display:flex;flex-wrap:wrap;gap:8px}
.sc-orte li{background:#242424;color:#fff;font-size:14px;font-weight:600;padding:7px 14px;border-radius:999px;margin:0}

/* ---------- Banner wie "Calling all creators" ---------- */
.sc-banner{position:relative;margin:40px auto!important;max-width:1280px;width:calc(100% - 32px);border-radius:12px;overflow:hidden;min-height:480px;display:flex;align-items:center}
.sc-banner > img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:0;transform:scale(1.08);transition:transform 2.4s cubic-bezier(.2,.7,.2,1)}
.sc-banner.da > img{transform:scale(1)}
.sc-banner::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(18,18,18,.92),rgba(18,18,18,.55) 55%,rgba(224,36,107,.25))}
.sc-banner .wrap{position:relative;z-index:1;width:100%}
.sc-banner-text{max-width:560px;padding:56px 0}
.sc-banner-text p{color:#E5E5E5;font-size:17px;margin:20px 0 26px}
.sc-welle{display:flex;align-items:center;gap:3px;height:46px;margin-bottom:30px}
.sc-welle i{flex:1;max-width:5px;height:var(--h);background:#fff;border-radius:2px;opacity:.85;animation:sc-welle 1.4s ease-in-out infinite alternate;animation-delay:calc(var(--d) * -1)}
.sc-welle i:nth-child(-n+18){background:var(--accent)}

/* ---------- Schritte ---------- */
.sc-schritte{padding:88px 0 40px!important}
.sc-schritte ol{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.sc-schritte li{background:#1E1E1E;border-radius:8px;padding:28px;margin:0}
.sc-schritte li span{display:block;font-size:64px;font-weight:900;line-height:1;letter-spacing:-.05em;background:var(--verlauf-text,var(--accent));-webkit-background-clip:text;background-clip:text;color:transparent;margin-bottom:14px}
.sc-schritte h3{font-size:20px;margin:0 0 8px}

/* ---------- Schluss wie "Thanks for listening. Now join in." ---------- */
.sc-schluss{padding:100px 0 110px!important;text-align:center}
.sc-schluss .wrap{display:flex;flex-direction:column;align-items:center}
.sc-schluss h2{font-size:clamp(34px,5vw,64px)!important;max-width:14em}
.sc-schluss p{font-size:18px;max-width:34em;margin:22px 0 30px}
.sc-schluss .btn.pri{height:52px;padding:0 30px;font-size:17px}
.sc-schluss .sc-klein{font-size:15px;margin:20px 0 0}

/* Einblenden beim Scrollen */
/* Einblenden nur, wenn JavaScript laeuft (Klasse ani im head): ohne Skript bleibt alles sichtbar */
html.ani .sc-rein{opacity:0;transform:translateY(28px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.7,.2,1)}
html.ani .sc-rein.da{opacity:1;transform:none}

/* Fuss */
footer{background:#0A0A0A!important;color:#8A8A8A;border-top:1px solid #222}
footer a{color:#BDBDBD!important}

@keyframes sc-zoom{from{transform:scale(1.02)}to{transform:scale(1.1)}}
@keyframes sc-hoch{to{opacity:1;transform:none}}
@keyframes sc-lauf{to{width:100%}}
@keyframes sc-band{to{transform:translateX(calc(-50% - 8px))}}
@keyframes sc-schweb{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
@keyframes sc-welle{from{transform:scaleY(.35)}to{transform:scaleY(1)}}

@media (max-width:860px){
  .sc-split .wrap{grid-template-columns:1fr;gap:56px}
  .sc-split-bild .phone{transform:scale(.55);right:-8px;bottom:-24px}
  .sc-float.f1{left:-6px}
  .sc-schritte ol{grid-template-columns:1fr}
  .sc-buehne{height:520px}
  .sc-slide::after{background:linear-gradient(0deg,rgba(0,0,0,.8) 10%,rgba(0,0,0,.3) 70%,rgba(0,0,0,.15))}
  .sc-slide .sc-text{left:20px;right:20px;top:auto;bottom:56px;transform:none}
  .sc-sub{font-size:16px}
  .sc-cover{width:150px}
  .sc-banner{min-height:560px}
}
@media (prefers-reduced-motion:reduce){
  .sc-band,.sc-float,.sc-welle i,.sc-slide.an img{animation:none!important}
  .sc-slide .sc-titel,.sc-slide .sc-sub,.sc-slide .sc-akt,.sc-rein{opacity:1!important;transform:none!important;animation:none!important}
  .sc-punkte button.an i{animation:none;width:100%}
}
.sc-hero .sc-text,.sc-hero .sc-text *{text-align:left}
.sc-slide .sc-text{max-width:860px}
.sc-titel{max-width:none!important}
.sc-hero h1{max-width:none!important}
.sc-hero > .wrap{gap:0!important;grid-template-columns:none!important}
.sc-hero .err{margin:6px 0 0;min-height:0}
.sc-oder{margin:14px 0 16px!important}

/* Kanaele (28.10.2026): SoundCloud-Bloecke im Wechsel, dazwischen Zweierreihen. Foto + schwebendes Mockup (.mini aus site.css) */
.sc-kanaele{padding:24px 0 40px!important}
.sc-kanaele .wrap{max-width:1180px;display:flex;flex-direction:column;gap:96px}
.sc-kanal{display:grid;grid-template-columns:1fr 1fr;gap:72px;align-items:center}
.sc-kanal.dreh .sc-k-bild{order:-1}
.sc-k-text h2{margin-bottom:22px!important}
.sc-k-text p,.sc-k-karte p{color:#fff;font-weight:600;font-size:17px;line-height:1.4;margin:0 0 26px;max-width:28em}
.sc-k-wo{display:block;font:700 12px var(--f-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--accent);margin-bottom:14px}
.sc-k-text .btn.sc-weiss,.sc-k-karte .btn.sc-weiss{height:40px;padding:0 18px;font-size:15px}
.sc-k-bild{position:relative;aspect-ratio:16/11;margin:0}
.sc-k-bild > img{width:100%;height:100%;object-fit:cover;border-radius:4px;display:block}
.sc-k-bild .mini{--card:#fff;--bg:#F6F5F2;--fg:#16171A;--muted:#5A5F66;--soft:#EEECE8;--line:rgba(22,23,26,.10);--line2:rgba(22,23,26,.18);--ok:#1E8A5A;color:var(--fg);position:absolute;right:-16px;bottom:-28px;width:230px;max-width:none;border:0;box-shadow:0 18px 40px rgba(0,0,0,.5);transform:scale(1.1);transform-origin:bottom right;animation:sc-wipp 6s ease-in-out infinite}
.sc-kanal.dreh .sc-k-bild .mini{right:auto;left:-16px;transform-origin:bottom left}
.sc-k-zwei{display:grid;grid-template-columns:1fr 1fr;gap:48px}
.sc-k-karte .sc-k-bild{aspect-ratio:16/10;margin-bottom:44px}
.sc-k-karte .sc-k-bild .mini{transform:scale(1);right:-14px;bottom:-26px}
.sc-k-karte h3{color:#fff;font-weight:900;text-transform:uppercase;letter-spacing:-.05em;line-height:.9;font-size:clamp(26px,3vw,38px);margin:0 0 16px}
.sc-k-zwei .sc-k-karte:nth-child(2) .mini{animation-delay:-3s}
/* Push-Mockup, auf der Live-Seite gibt es keins */
.m-push{display:flex;align-items:center;padding:0 12px;background:linear-gradient(160deg,#2A2C31,#16171A)!important}
.m-push .note{display:flex;gap:9px;align-items:center;width:100%;background:rgba(255,255,255,.92);border-radius:12px;padding:9px 10px;text-align:left}
.m-push .app{flex:none;width:28px;height:28px;border-radius:7px;background:var(--accent)}
.m-push .tx{display:flex;flex-direction:column;font-size:11px;line-height:1.3;color:#5A5F66;min-width:0}
.m-push .tx b{font-size:12px;color:#16171A}
@media (max-width:900px){
  .sc-kanaele .wrap{gap:72px}
  .sc-kanal,.sc-k-zwei{grid-template-columns:1fr;gap:64px}
  .sc-kanal .sc-k-bild,.sc-kanal.dreh .sc-k-bild{order:-1}
  .sc-k-bild .mini,.sc-k-karte .sc-k-bild .mini{transform:scale(.8);right:-6px;left:auto;transform-origin:bottom right}
}
@media (prefers-reduced-motion:reduce){.sc-k-bild .mini{animation:none!important}}

/* Deine Drops als Endlos-Karussell (29.10.2026): Script scrollt, CSS-Laufband aus, Pfeile wie bei SoundCloud */
.sc-karussell{position:relative}
.sc-endlos{overflow-x:auto;scrollbar-width:none;cursor:grab;outline:none}
.sc-endlos::-webkit-scrollbar{display:none}
.sc-endlos.zieht{cursor:grabbing}
.sc-endlos .sc-band{animation:none!important}
.sc-endlos .sc-cover{user-select:none;-webkit-user-drag:none}
.sc-endlos:focus-visible{box-shadow:0 0 0 2px var(--accent)}
.sc-pfeil{position:absolute;top:95px;z-index:2;width:44px;height:44px;border-radius:50%;border:0;background:#fff;color:#121212;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 8px 24px rgba(0,0,0,.45);transition:transform .2s}
.sc-pfeil:hover{transform:scale(1.08)}
.sc-pfeil svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.sc-pfeil.zurueck{left:12px}.sc-pfeil.weiter{right:12px}
@media (max-width:620px){.sc-pfeil{top:75px;width:38px;height:38px}}
.sc-trend .sc-cover > span:last-child{max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* Kategorie-Auswahl ueber den Drops (29.10.2026) */
.sc-kat{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;max-width:900px;margin:0 auto 34px;padding:0 16px}
.sc-kat button{height:38px;padding:0 16px;border-radius:999px;border:1px solid rgba(255,255,255,.22);background:transparent;color:#fff;font:700 14px var(--f-body);cursor:pointer;transition:background .2s,color .2s,border-color .2s}
.sc-kat button:hover{border-color:#fff}
.sc-kat button[aria-pressed="true"]{background:#fff;color:#121212;border-color:#fff}
.sc-trend .sc-karussell,[data-k]{transition:opacity .18s ease}
.sc-wechsel .sc-trend .sc-karussell,.sc-wechsel [data-k]{opacity:0}
@media (max-width:620px){.sc-kat{gap:6px;margin-bottom:26px}.sc-kat button{height:34px;padding:0 13px;font-size:13px}}
/* Hero 1 gespiegelt: eigene scale-Eigenschaft, damit der Zoom (transform) weiterlaeuft */
.sc-slide img.spiegel{scale:-1 1;width:125%;inset:0 auto 0 0}
/* breiter als die Buehne und links verankert: die Frau rueckt nach rechts, weg vom Titel */

/* Message als Drop (29.10.2026): Message unter der Ueberschrift, Tropfen faellt auf die mittlere Kachel, beim Scrollen faechern sich die anderen auf */
.sc-trend{position:relative}
.sc-trend h2{margin-bottom:26px!important}
.sc-msg{display:flex;justify-content:center;padding:0 16px;margin:0 auto 64px}
.sc-intro .sc-pfeil{opacity:0;pointer-events:none}
.sc-msg-k{display:flex;gap:12px;align-items:center;width:270px;padding:10px;border-radius:14px;background:#fff;color:#16171A;box-shadow:0 20px 50px rgba(0,0,0,.55);text-align:left}
.sc-msg-k img{flex:none;width:58px;height:58px;border-radius:9px;object-fit:cover}
.sc-msg-k > span{display:flex;flex-direction:column;gap:5px;min-width:0}
.sc-msg-k small{font:700 10px var(--f-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--accent)}
.sc-msg-k b{font-size:15px;line-height:1.2}
.sc-msg-k i{display:block;height:5px;border-radius:3px;background:#EEECE8;width:90%}
.sc-msg-k i + i{width:60%}
.sc-tropfen{position:absolute;z-index:4;width:16px;height:22px;border-radius:50% 50% 50% 50%/60% 60% 40% 40%;background:var(--accent);box-shadow:0 0 18px rgba(224,36,107,.7);opacity:0;pointer-events:none}
.sc-tropfen::before{content:"";position:absolute;left:50%;top:-9px;margin-left:-5px;border:5px solid transparent;border-bottom:9px solid var(--accent);border-top:0}
.sc-tropfen.faellt{animation:sc-fall .62s cubic-bezier(.55,0,1,.45) forwards}
@keyframes sc-fall{0%{opacity:0;transform:translateY(0) scale(.6)}15%{opacity:1;transform:translateY(0) scale(1)}95%{opacity:1}100%{opacity:0;transform:translateY(var(--weg)) scale(1,.7)}}
.sc-ring{position:absolute;z-index:4;width:80px;height:80px;border-radius:50%;border:2px solid var(--accent);opacity:0;pointer-events:none}
.sc-ring.an{animation:sc-ring .9s ease-out forwards}
@keyframes sc-ring{0%{opacity:.9;transform:scale(.3)}100%{opacity:0;transform:scale(4)}}
.sc-trifft .sc-bild-q{animation:sc-glanz .9s ease-out}
@keyframes sc-glanz{0%{box-shadow:0 0 0 0 rgba(224,36,107,.9)}100%{box-shadow:0 0 0 14px rgba(224,36,107,0)}}
@media (max-width:620px){.sc-msg{margin-bottom:52px}.sc-msg-k{width:240px}}
.sc-msg-k{transition:opacity .5s ease,transform .5s ease}
.sc-msg-k.weg{opacity:0;transform:translateY(-8px)}
/* Message dunkel (29.10.2026): Karte wie die Kacheln, nur ein feiner Rand und der pinke Schein */
.sc-msg-k{background:#1E1E1E;color:#fff;border:1px solid rgba(255,255,255,.12);box-shadow:0 20px 50px rgba(0,0,0,.6),0 0 0 1px rgba(224,36,107,.0),0 0 40px rgba(224,36,107,.18)}
.sc-msg-k i{background:rgba(255,255,255,.12)}
.sc-msg-lead{max-width:34em;margin:-8px auto 26px;padding:0 16px;text-align:center;color:#B8B8B8;font-size:17px;line-height:1.45}
@media (max-width:620px){.sc-msg-lead{font-size:15px}}
/* Tausch: getroffene Kachel dreht sich einmal um die senkrechte Achse (eigene scale-Eigenschaft, kein Konflikt mit transform) */
.sc-cover.dreht{animation:sc-dreh .36s ease-in-out}
@keyframes sc-dreh{50%{scale:0 1}}
/* Mehr Luft (29.10.2026): alle Sections atmen, zwischen Drops und Kanaelen der groesste Abstand; skaliert mit der Breite */
.sc-trend{padding-top:clamp(80px,10vw,140px)!important;padding-bottom:clamp(90px,12vw,170px)!important}
.sc-split{padding:clamp(80px,10vw,140px) 0!important}
.sc-kanaele{padding:clamp(40px,5vw,72px) 0 clamp(80px,10vw,140px)!important}
.sc-kanaele .wrap{gap:clamp(88px,10vw,140px)}
.sc-banner{margin:clamp(48px,6vw,90px) auto!important}
.sc-schritte{padding-top:clamp(90px,11vw,150px)!important;padding-bottom:clamp(60px,7vw,100px)!important}
.sc-schluss{padding-top:clamp(100px,12vw,160px)!important;padding-bottom:clamp(110px,12vw,170px)!important}
.sc-msg-lead{margin-bottom:34px}
.sc-msg{margin-bottom:76px}
@media (max-width:620px){.sc-msg{margin-bottom:60px}}
/* Abstand unter den Drops = Abstand darueber (Hero-Knopf bis Auswahl); der Abstand kommt allein vom Padding der Kanal-Einleitung */
.sc-trend{padding-bottom:52px!important}
/* Umlaute in pinken Ueberschriften (29.10.2026): der Verlauf wird nur im Kasten der Zeile gemalt, bei line-height .9
   fallen Ae-, Oe-, Ue-Punkte heraus. Kasten nach oben verlaengern, Lage der Zeile bleibt gleich; die Punkte duerfen
   in die weisse Zeile darueber ragen */
h1 em.hl,h2 em.hl,.sc-titel em.hl{padding-top:.2em;margin-top:-.2em}

/* DSGVO-Block (Startseite; Brand Hub und Link in Bio haben dieselben Regeln in ihrer CSS) */
.dsg-liste{list-style:none;padding:0;margin:-6px 0 0;display:flex;flex-wrap:wrap;gap:8px}
.dsg-liste li{font-size:13.5px;font-weight:700;color:#F2F2F2;background:#1E1E1E;border-radius:999px;padding:7px 14px}
.dsg-liste li::before{content:"";display:inline-block;width:7px;height:12px;margin-right:9px;border:solid #FF6E9E;border-width:0 2.5px 2.5px 0;transform:translateY(-2px) rotate(45deg)}
.sc-k-bild .mini.m-dsg{display:flex;align-items:center;gap:14px;padding:16px 18px;height:auto}
.dsg-schild{flex:none;width:44px;height:52px;background:#E0246B;clip-path:polygon(50% 0,100% 16%,100% 52%,50% 100%,0 52%,0 16%);position:relative}
.dsg-schild::after{content:"";position:absolute;left:16px;top:14px;width:9px;height:17px;border:solid #fff;border-width:0 3px 3px 0;transform:rotate(45deg)}
.dsg-z{display:flex;flex-direction:column;font-size:12px;color:var(--muted)}.dsg-z b{font-size:17px;color:var(--fg)}