/* Neue Startseite (Vorschau 28.10.2026): der Baum aus „lebendig“ auf Creme, eine richtige
   Navigation, Stimmen als laufende Bänder, die Handys auf Burgund, die sich zeichnen,
   anmalen und dann massiv dastehen. Baut auf ../lebendig-2026-10-q7n3/ auf. */

/* ── Kopfzeile mit Navigation ─────────────────────────────── */
.nx-head{position:sticky;top:0;z-index:60;background:rgba(251,246,239,.86);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid transparent;transition:border-color .3s,box-shadow .3s}
.nx-head.is-scrolled{border-color:rgba(125,8,69,.10);box-shadow:0 6px 24px rgba(46,26,74,.06)}
.nx-head-in{display:flex;align-items:center;gap:22px;max-width:1200px;margin:0 auto;padding:12px 20px}
.nx-head .pv-logo{font-size:28px}
.nx-head .pv-logo img{width:38px;height:38px}
.nx-nav{display:none;margin-left:auto;gap:4px}
.nx-nav a{font:500 15.5px/1 var(--sans);color:var(--ink);text-decoration:none;padding:11px 13px;border-radius:999px;transition:background .2s,color .2s}
.nx-nav a:hover{background:rgba(125,8,69,.07);color:var(--burgund)}
.nx-get{display:inline-flex;align-items:center;gap:8px;margin-left:auto;font:600 15px/1 var(--sans);color:#fff;background:var(--burgund);border-radius:999px;padding:12px 18px;text-decoration:none;white-space:nowrap;transition:transform .2s var(--ease),box-shadow .2s var(--ease)}
.nx-get svg{width:17px;height:17px}
.nx-get:hover{transform:translateY(-1px);box-shadow:0 10px 24px rgba(125,8,69,.28)}
.nx-burger{display:inline-grid;place-items:center;width:44px;height:44px;border:0;background:none;padding:0;cursor:pointer;color:var(--burgund)}
.nx-burger span{display:block;width:22px;height:2px;background:currentColor;border-radius:2px;box-shadow:0 -7px 0 currentColor,0 7px 0 currentColor;transition:transform .25s,box-shadow .25s}
.nx-head.is-open .nx-burger span{transform:rotate(45deg);box-shadow:0 0 0 currentColor,0 0 0 currentColor}
.nx-head.is-open .nx-burger span::after{content:"";display:block;width:22px;height:2px;background:currentColor;transform:rotate(-90deg)}
.nx-drawer{display:grid;gap:2px;max-height:0;overflow:hidden;padding:0 20px;transition:max-height .35s var(--ease),padding .35s var(--ease)}
.nx-head.is-open .nx-drawer{max-height:420px;padding:4px 20px 18px}
.nx-drawer a{font:700 24px/1.2 var(--display);color:var(--burgund);text-decoration:none;padding:10px 2px;border-bottom:1px solid rgba(125,8,69,.08)}
@media (min-width:1180px){
  .nx-nav{display:flex}
  .nx-get{margin-left:12px}
  .nx-burger,.nx-drawer{display:none}
}

/* Der Musik-Knopf (song.js), wie auf der Live-Startseite, nur unter der Kopfzeile */
.bn-song{position:fixed;top:84px;right:18px;z-index:55;display:inline-flex;align-items:center;gap:7px;height:44px;padding:0 14px 0 16px;border:1px solid rgba(125,8,69,.3);border-radius:999px;font:600 14px/1 var(--sans);background:rgba(255,255,255,.92);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:var(--burgund);cursor:pointer;box-shadow:0 2px 10px rgba(46,26,74,.12);transition:background .18s,border-color .18s,color .18s,transform .18s}
.bn-song[hidden]{display:none}
.bn-song:hover{border-color:var(--burgund);transform:translateY(-1px)}
.bn-song.is-playing{background:var(--burgund);border-color:var(--burgund);color:#fff}
.bn-song svg{display:block;width:22px;height:22px;flex-shrink:0}
.bn-song-slash{opacity:1;transition:opacity .18s}
.bn-song.is-playing .bn-song-slash{opacity:0}
@media (max-width:700px){.bn-song{top:auto;bottom:calc(88px + env(safe-area-inset-bottom));right:12px}}
@media (max-width:520px){.nx-head .pv-logo{font-size:24px}.nx-head .pv-logo img{width:32px;height:32px;margin-right:7px}.nx-get{padding:10px 14px;font-size:14px}.nx-get svg{display:none}.nx-head-in{gap:10px;padding:10px 14px}}

/* Hero: das Bild sitzt unter der Kopfzeile, nicht mehr hinter ihr */
.hero-big{padding-top:10px}
.hero-get{display:flex;flex-direction:column;align-items:center;gap:0}
.hero-get .dl-smart{min-width:230px}

/* ── Stimmen: zwei Bänder, gegenläufig ───────────────────── */
.voices{padding:34px 0 64px;overflow:hidden;background:linear-gradient(180deg,#fbf3ea,#fbf6ef)}
.voices h2{font:700 clamp(26px,6.5vw,40px)/1.1 var(--display);color:var(--burgund);text-align:center;margin:0 22px 26px;text-wrap:balance}
.lane{display:flex;align-items:stretch;width:max-content;gap:16px;padding:8px 0;animation:lane var(--dur,90s) linear infinite}
.lane--rev{animation-direction:reverse;margin-top:14px}
.lane-wrap{-webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)}
.lane-wrap:hover .lane,.lane-wrap:focus-within .lane{animation-play-state:paused}
@keyframes lane{to{transform:translateX(-50%)}}
.vq{flex:none;width:min(78vw,360px);margin:0;padding:20px 22px 18px;border-radius:22px;background:#fff;box-shadow:0 8px 22px rgba(46,26,74,.07);display:flex;flex-direction:column;justify-content:space-between;gap:16px}
.vq blockquote{position:relative;padding-top:18px;margin:0;font:500 16px/1.5 var(--sans);color:var(--ink)}
.vq blockquote::before{content:"“";position:absolute;left:-2px;top:-8px;font:700 44px/1 Georgia,serif;color:var(--amber)}
.vq figcaption{display:flex;align-items:center;gap:12px;font-size:13.5px;line-height:1.3;color:var(--muted)}
.vq figcaption img,.vq .ini{width:42px;height:42px;border-radius:50%;object-fit:cover;flex:none}
.vq .ini{display:grid;place-items:center;background:var(--rose);color:var(--burgund);font:700 15px/1 var(--sans)}
.vq strong{display:block;color:var(--burgund);font-weight:600;font-size:14.5px}
/* Nutzer*innen in Burgund, damit man die beiden Stimmen auseinanderhält */
.vq--user{background:var(--burgund);box-shadow:0 10px 26px rgba(125,8,69,.22)}
.vq--user blockquote{color:#fff;font-size:17px}
.vq--user figcaption{color:rgba(255,255,255,.75)}
.vq--user .stars{color:var(--amber);letter-spacing:2px;font-size:15px}
.voices-note{text-align:center;font-size:13px;color:var(--muted);margin:22px 22px 0}
@media (prefers-reduced-motion:reduce){
  .lane{animation:none;width:auto;overflow-x:auto;padding:8px 20px;scroll-snap-type:x mandatory}
  .lane .vq{scroll-snap-align:center}
  .lane [aria-hidden="true"]{display:none}
}

/* ── Handys auf Burgund: zeichnen, anmalen, massiv ───────── */
.phones{padding:90px 20px 100px;text-align:center}
.phones h2{font:700 clamp(32px,8.5vw,58px)/1.05 var(--display);margin:0 auto;max-width:720px;text-wrap:balance}
.phones h2 em{font-style:normal;color:var(--amber)}
.phones > p{font-size:18px;line-height:1.55;color:rgba(255,255,255,.84);max-width:460px;margin:16px auto 0}
.ph-row{display:grid;gap:56px;max-width:1080px;margin:56px auto 0;perspective:1400px}
.ph-item{display:grid;justify-items:center;gap:22px}
.ph-item h3{font:700 24px/1.15 var(--display);margin:0}
.ph-item p{margin:6px auto 0;max-width:280px;font-size:15.5px;line-height:1.5;color:rgba(255,255,255,.8)}
@media (min-width:860px){.ph-row{grid-template-columns:repeat(3,1fr);gap:28px}.ph-item:nth-child(2){margin-top:-28px}}

@property --pen{syntax:"<percentage>";inherits:false;initial-value:0%}
@property --paint{syntax:"<percentage>";inherits:false;initial-value:100%}
.ph{position:relative;width:min(66vw,270px);aspect-ratio:600/1262;transform-style:preserve-3d;transform:scale(.94);transition:transform 1.1s cubic-bezier(.2,1.25,.4,1),filter 1s var(--ease)}
.ph > *{position:absolute;inset:0;width:100%;height:100%}
/* 1 · gezeichnet: die Linien in Creme, ein Stift fährt von oben nach unten */
.ph-line{background:var(--ink,#fde7d4);-webkit-mask:var(--line) center/contain no-repeat,linear-gradient(172deg,#000 calc(var(--pen) - 6%),transparent var(--pen));-webkit-mask-composite:source-in;mask:var(--line) center/contain no-repeat,linear-gradient(172deg,#000 calc(var(--pen) - 6%),transparent var(--pen));mask-composite:intersect;transition:opacity .9s var(--ease)}
/* 2 · angemalt: die Farbe steigt von unten unter den Linien auf */
.ph-color{clip-path:inset(var(--paint) 0 0 0 round 0 0 13% 13%);object-fit:contain}
/* 3 · massiv: Glanz und Kante */
.ph-gloss{border-radius:13% / 6.2%;opacity:0;pointer-events:none;background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,.38) 45%,transparent 58%);background-size:260% 100%;background-position:120% 0;mix-blend-mode:screen}
.ph-item.go .ph-line{animation:pen 1.9s cubic-bezier(.45,.1,.35,1) calc(var(--i,0) * .35s) forwards}
.ph-item.go .ph-color{animation:paint 1.2s var(--ease) calc(var(--i,0) * .35s + 2s) forwards}
.ph-item.go.solid .ph-line{opacity:0}
.ph-row .ph-item.solid .ph{transform:rotateY(-14deg) rotateX(5deg) scale(1);filter:drop-shadow(-18px 34px 34px rgba(0,0,0,.45)) drop-shadow(0 4px 6px rgba(0,0,0,.25))}
.ph-row .ph-item:nth-child(2).solid .ph{transform:rotateY(0) rotateX(6deg) scale(1.04)}
.ph-row .ph-item:nth-child(3).solid .ph{transform:rotateY(14deg) rotateX(5deg) scale(1);filter:drop-shadow(18px 34px 34px rgba(0,0,0,.45)) drop-shadow(0 4px 6px rgba(0,0,0,.25))}
.ph-item.solid .ph-gloss{opacity:1;animation:gloss 1.6s var(--ease) .1s forwards}
.ph-row .ph-item.solid .ph{animation:hover 7s ease-in-out 1.4s infinite}
.ph-row .ph-item.solid:nth-child(2) .ph{animation-delay:2.2s}
.ph-row .ph-item.solid:nth-child(3) .ph{animation-delay:3s}
@keyframes pen{to{--pen:112%}}
@keyframes paint{to{--paint:0%}}
@keyframes gloss{to{background-position:-60% 0}}
@keyframes hover{0%,100%{translate:0 0}50%{translate:0 -10px}}
.ph:hover{transform:rotateY(0) rotateX(0) scale(1.03)!important}
@media (prefers-reduced-motion:reduce){
  .ph-line{display:none}.ph-color{clip-path:none}.ph{transform:none;filter:drop-shadow(0 30px 30px rgba(0,0,0,.4))}
}

/* ── Overlay „App laden“ mit QR-Code (am Computer) ───────── */
.qr-dlg{border:0;padding:0;background:transparent;max-width:none;max-height:none;overflow:visible}
.qr-dlg::backdrop{background:rgba(46,10,32,.55);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.qr-dlg[open]{animation:dlg-in .35s var(--ease)}
.qr-dlg[open]::backdrop{animation:fade .35s var(--ease)}
@keyframes dlg-in{from{opacity:0;transform:translateY(18px) scale(.96)}}
@keyframes fade{from{opacity:0}}
.qr-card{position:relative;width:min(92vw,420px);padding:38px 34px 30px;border-radius:30px;background:var(--creme);text-align:center;box-shadow:0 40px 90px rgba(46,10,32,.35)}
.qr-card img.mark{width:56px;height:56px;margin:0 auto 10px}
.qr-card h2{font:700 30px/1.1 var(--display);color:var(--burgund);margin:0}
.qr-card p{color:var(--muted);font-size:15.5px;line-height:1.5;margin:10px auto 22px;max-width:300px}
.qr-card .qr{width:220px;height:220px;margin:0 auto;padding:14px;border-radius:24px;background:#fff;box-shadow:0 10px 30px rgba(46,26,74,.10)}
.qr-card .badges{display:flex;justify-content:center;gap:10px;margin-top:22px}
.qr-card .badges img{height:42px;width:auto}
.qr-card .fine{font-size:13px;margin:16px 0 0}
.qr-x{position:absolute;top:12px;right:14px;width:40px;height:40px;border:0;border-radius:50%;background:rgba(125,8,69,.07);color:var(--burgund);font-size:24px;line-height:1;cursor:pointer}
.qr-x:hover{background:rgba(125,8,69,.14)}

/* ── Fußzeile: aufgeräumt, mit Sprache ───────────────────── */
.nx-foot{background:#2a0217;color:rgba(255,255,255,.78);padding:56px 22px 34px;font-size:14.5px}
.nx-foot-in{max-width:1100px;margin:0 auto;display:grid;gap:34px}
.nx-foot .pv-logo{color:#fff;font-size:28px}
.nx-foot .pv-logo img{width:36px;height:36px}
.nx-foot .claim{margin:12px 0 0;max-width:280px;line-height:1.5}
.nx-cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 20px}
.nx-cols h3{font:600 12.5px/1 var(--sans);letter-spacing:.09em;text-transform:uppercase;color:var(--amber);margin:0 0 14px}
.nx-cols ul{list-style:none;margin:0;padding:0;display:grid;gap:9px}
.nx-foot a{color:#fff;text-decoration:none}
.nx-foot a:hover{text-decoration:underline;text-underline-offset:4px}
.nx-lang{display:flex;flex-wrap:wrap;gap:8px}
.nx-lang a{padding:7px 12px;border:1px solid rgba(255,255,255,.22);border-radius:999px;font-size:13.5px}
.nx-lang a[aria-current]{background:#fff;color:var(--burgund);border-color:#fff}
.nx-lang a:hover{text-decoration:none;border-color:#fff}
.nx-base{border-top:1px solid rgba(255,255,255,.14);padding-top:22px;display:grid;gap:6px;font-size:13px;color:rgba(255,255,255,.6)}
.nx-base p{margin:0}
@media (min-width:860px){
  .nx-foot-in{grid-template-columns:1.1fr 2.4fr}
  .nx-cols{grid-template-columns:repeat(4,minmax(0,1fr))}
  .nx-base{grid-column:1 / -1;grid-template-columns:1fr auto}
}

/* „App laden“ ohne Store-Logo (Owner 28.10.2026: „bitte entferne das Apple Logo aus dem Button“).
   shared.js setzt das Zeichen weiter ein, hier wird es nur nicht gezeigt. */
.nx-get svg,.dl-smart svg{display:none}

/* Hero niedriger (Owner 28.10.2026): das Bild ist 16:9 und höchstens gut halb so hoch wie das Fenster */
.hero-stage{aspect-ratio:1376/768;width:130vw;margin-left:calc(50% - 65vw)}
@media (min-width:700px){.hero-stage{width:min(1100px,calc(100vw - 40px),calc(54svh * 1.79));margin:0 auto}}

/* ── Was bloomnow für dich bietet: Text und gekippter Screen abwechselnd, mit schwebender Karte ── */
.offer{max-width:1120px;margin:0 auto;padding:70px 22px 30px}
.offer > h2{font:700 clamp(30px,8vw,52px)/1.06 var(--display);color:var(--burgund);text-align:center;margin:0 auto 40px;text-wrap:balance}
.row{display:grid;gap:30px;align-items:center;padding:30px 0 50px}
.kicker{font:600 13px/1 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--burgund)}
.row h3{font:700 clamp(30px,7.5vw,48px)/1.06 var(--display);color:var(--ink);margin:12px 0 0;text-wrap:balance}
.row p{font-size:18px;line-height:1.6;color:var(--muted);margin:16px 0 0;max-width:460px}
.row-btn{display:inline-block;margin-top:24px;padding:13px 22px;border:1.5px solid var(--ink);border-radius:999px;font:600 15.5px/1 var(--sans);color:var(--ink);text-decoration:none;transition:background .2s,color .2s}
.row-btn:hover{background:var(--ink);color:#fff}
.row-art{position:relative;display:grid;place-items:center;min-height:440px;perspective:1600px}
.row-art::before{content:"";position:absolute;inset:8% 6%;border-radius:50%;background:radial-gradient(closest-side,rgba(125,8,69,.10),rgba(255,176,0,.06) 60%,transparent);z-index:-1}
.dev{width:min(58vw,250px);aspect-ratio:540/1171;border-radius:38px;padding:9px;background:#1a1a1a;box-shadow:-24px 40px 60px rgba(46,26,74,.28),0 4px 10px rgba(0,0,0,.18),inset 0 0 0 2px #3a3a3a;transform:rotateY(14deg) rotateX(6deg) rotateZ(-4deg);transition:transform 1s cubic-bezier(.2,1.2,.4,1)}
.dev img{width:100%;height:100%;object-fit:cover;border-radius:30px}
.row.rev .dev{transform:rotateY(-14deg) rotateX(6deg) rotateZ(4deg);box-shadow:24px 40px 60px rgba(46,26,74,.28),0 4px 10px rgba(0,0,0,.18),inset 0 0 0 2px #3a3a3a}
.offer .row:last-of-type .row-art:hover .dev{transform:none}
.dev--back{position:absolute;transform:translate(-34%,-6%) rotateZ(-10deg) scale(.88)!important;filter:brightness(.97)}
.row .dev--back + .dev{position:relative;transform:translate(18%,4%) rotateY(-10deg) rotateZ(4deg)}
/* die schwebende Karte, Burgund mit Bernstein */
.float{position:absolute;right:max(0px,calc(50% - 240px));top:12%;min-width:190px;max-width:240px;padding:16px 18px;border-radius:18px;background:rgba(74,4,40,.92);color:#fff;box-shadow:0 22px 44px rgba(46,10,32,.35);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);font-size:14.5px;line-height:1.35;transform:translateY(16px);opacity:0;transition:opacity .7s var(--ease) .25s,transform .9s var(--ease) .25s}
.row.rev .float{right:auto;left:max(0px,calc(50% - 240px));top:auto;bottom:10%}
.row.in .float{opacity:1;transform:none}
@keyframes bob{50%{transform:translateY(-6px)}}
.float b{display:block;font-weight:600;color:var(--amber);margin-bottom:8px}
.float small{display:block;color:rgba(255,255,255,.72);font-size:12.5px}
.float ul{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.float li::before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--amber);margin-right:9px;vertical-align:2px}
.float ul.ok li::before{content:"✓";width:auto;height:auto;background:none;color:var(--amber);font-weight:700;vertical-align:0}
.float .bar{display:block;height:6px;border-radius:3px;background:rgba(255,255,255,.2);margin:10px 0 6px;overflow:hidden}
.float .bar i{display:block;width:25%;height:100%;background:var(--amber);border-radius:3px}
@media (min-width:860px){
  .row{grid-template-columns:1fr 1fr;gap:60px;padding:50px 0 70px}
  .row.rev .row-txt{order:2}
  .row-art{min-height:560px}
  .dev{width:270px}
}
@media (prefers-reduced-motion:reduce){.float{opacity:1;transform:none}}

/* ── Das Video ─────────────────────────────────────────── */
.film{padding:40px 22px 80px;text-align:center}
.film-frame{width:min(100%,520px);margin:0 auto;border-radius:32px;overflow:hidden;background:var(--burgund-dark);box-shadow:0 30px 60px rgba(125,8,69,.22);outline:8px solid #fff}
.film-frame video{display:block;width:100%;height:auto;aspect-ratio:1/1;background:#000}
.film-cap{margin:18px 0 0;color:var(--muted);font-size:15px}

/* Desktop kompakt (Owner 28.10.2026: „Es soll am Desktop die Empfehlungsleiste immer schon auch
   sichtbar sein“): Text links, Bild rechts, das Bild richtet sich nach der Fensterhöhe. */
@media (min-width:1000px){
  .hero-big{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);align-items:center;gap:36px;max-width:1260px;margin:0 auto;padding:18px 28px 8px;text-align:left;background:none}
  .hero-big .hero-txt{order:-1;padding:0;margin:0;max-width:none}
  .hero-big h1{font-size:clamp(38px,3.7vw,60px)}
  .hero-big p{margin:16px 0 24px;max-width:440px}
  .hero-big .hero-get{align-items:flex-start}
  .hero-stage{width:min(100%,calc((100svh - 300px) * 1.79));margin:0 0 0 auto}
  .voices{padding:6px 0 56px;background:none}
  .voices h2{font-size:26px;margin-bottom:12px}
}

/* Proportionen (Owner 28.10.2026: „zu klein, die Proportionen von Feedback vs Bild und Text passen
   gar nicht“): die Stimmen-Karten kompakt, das Bild größer, weniger Luft vor den Bereichen. */
.vq{width:min(74vw,300px);padding:14px 16px 12px;border-radius:16px;gap:10px;box-shadow:0 4px 14px rgba(46,26,74,.06)}
.vq blockquote{font-size:14px;line-height:1.45;padding-top:14px}
.vq blockquote::before{font-size:32px;top:-8px}
.vq--user blockquote{font-size:14.5px}
.vq figcaption{font-size:12px;gap:9px}
.vq figcaption img,.vq .ini{width:30px;height:30px;font-size:12px}
.vq strong{font-size:12.5px}
.vq--user .stars{font-size:12px}
.lane{gap:12px}
.voices{padding-bottom:20px}
.offer{padding-top:36px}
.offer > h2{margin-bottom:6px}
@media (min-width:1000px){
  .hero-big{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:28px;padding-top:10px}
  .hero-big h1{font-size:clamp(36px,3.4vw,56px)}
  .hero-stage{width:min(100%,calc((100svh - 240px) * 1.79))}
  .voices h2{font-size:22px;margin-bottom:10px}
}

/* ── Hero mittig (Owner 28.10.2026, Vorbild shadowmap.org): Text oben in der Mitte, die Zeichnung
   rundherum. Am Handy steht der Text über dem Bild; ab 900 px liegt er im leeren Himmel der
   Zeichnung. --w ist die Bildbreite: so breit wie möglich, aber nie so hoch, dass die Stimmen
   unter den ersten Bildschirm rutschen. */
.hero-c{display:block;max-width:none;padding:22px 0 10px;text-align:center;position:relative}
.hero-c .hero-txt{text-align:center;margin:0 auto;padding:0 22px;max-width:700px}
.hero-c .hero-txt p{margin:14px auto 22px}
.hero-c .hero-get{align-items:center}
.hero-c .hero-stage{aspect-ratio:1584/672;width:170vw;margin:10px 0 0 calc(50% - 85vw);-webkit-mask-image:linear-gradient(to bottom,#000 88%,transparent);mask-image:linear-gradient(to bottom,#000 88%,transparent)}
@media (min-width:900px){
  .hero-c{--w:min(1500px,100vw,calc((100svh - 260px) * 2.357));padding:0}
  .hero-c .hero-stage{width:var(--w);margin:0 auto;-webkit-mask-image:linear-gradient(to right,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(to right,transparent,#000 6%,#000 94%,transparent)}
  .hero-c .hero-txt{position:absolute;z-index:2;left:50%;top:calc(var(--w) * 0.012);transform:translateX(-50%);width:calc(var(--w) * 0.46);max-width:none;padding:0}
  .hero-c h1{font-size:calc(var(--w) * 0.033);line-height:1.05}
  .hero-c .hero-txt p{font-size:clamp(14px,calc(var(--w) * 0.0115),18px);max-width:calc(var(--w) * 0.4);margin:calc(var(--w) * 0.008) auto calc(var(--w) * 0.014)}
  .hero-c .dl-smart{min-height:50px}
}

/* Hero: Text etwas schmaler, damit er bloomie nicht berührt */
@media (min-width:900px){.hero-c .hero-txt{width:calc(var(--w) * 0.42);top:0}.hero-c h1{font-size:calc(var(--w) * 0.031)}}

/* ── Darauf kannst du dich verlassen ─────────────────────── */
.trust-b{max-width:1080px;margin:0 auto;padding:40px 22px 50px;text-align:center}
.trust-b h2,.price-b h2,.faq-b h2{font:700 clamp(28px,7vw,44px)/1.08 var(--display);color:var(--burgund);margin:0 0 26px;text-wrap:balance}
.trust-grid{display:grid;gap:14px;text-align:left}
.trust-grid > div{background:#fff;border-radius:20px;padding:20px 20px 18px;box-shadow:0 6px 18px rgba(46,26,74,.06);border-top:4px solid var(--burgund)}
.trust-grid b{display:block;font:700 19px/1.2 var(--display);color:var(--burgund);margin-bottom:6px}
.trust-grid span{font-size:15px;line-height:1.5;color:var(--muted)}
.trust-grid a{color:var(--burgund);font-weight:600}
@media (min-width:760px){.trust-grid{grid-template-columns:1fr 1fr}}
@media (min-width:1080px){.trust-grid{grid-template-columns:repeat(4,1fr)}}

/* ── Preise (Tabelle wie auf der Live-Startseite) ────────── */
.price-b{max-width:980px;margin:0 auto;padding:60px 22px 30px;text-align:center}
.price-b > p{font-size:17px;line-height:1.55;color:var(--muted);max-width:560px;margin:0 auto 14px}
.bn-price-pill{display:inline-block;background:var(--amber);color:var(--deep);font-weight:600;font-size:14px;padding:8px 16px;border-radius:999px;margin:4px 0 22px}
.bn-visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.bn-price-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.bn-price-table{width:100%;min-width:560px;border-collapse:separate;border-spacing:0;background:#fff;border-radius:22px;box-shadow:0 8px 24px rgba(46,26,74,.07);overflow:hidden;font-size:15px;text-align:left}
.bn-price-table th,.bn-price-table td{padding:14px 16px;vertical-align:top;border-bottom:1px solid rgba(125,8,69,.08)}
.bn-price-table thead th{font:700 19px/1.2 var(--display);color:var(--burgund)}
.bn-price-table tbody th{font-weight:600;color:var(--ink);white-space:nowrap}
.bn-price-table .is-main{background:rgba(125,8,69,.05)}
.bn-price-table thead .is-main{background:var(--burgund);color:#fff}
.bn-price-table td div{display:flex;flex-direction:column;gap:2px}
.bn-price-table del{color:var(--muted);font-size:13px}
.bn-price-table strong{font-size:20px;color:var(--ink)}
.bn-price-table td span{font-size:13px;color:var(--muted)}
.bn-price-table .is-free{font-weight:600;color:var(--burgund);vertical-align:middle}
.bn-price-table ul{margin:0;padding-left:18px}
.bn-price-table li{margin:2px 0}

/* ── Häufige Fragen ──────────────────────────────────────── */
.faq-b{max-width:760px;margin:0 auto;padding:50px 22px 60px}
.faq-b h2{text-align:center}
.fq{background:#fff;border-radius:18px;margin:0 0 10px;box-shadow:0 4px 14px rgba(46,26,74,.05)}
.fq summary{cursor:pointer;list-style:none;padding:18px 52px 18px 20px;font:600 17px/1.35 var(--sans);color:var(--ink);position:relative}
.fq summary::-webkit-details-marker{display:none}
.fq summary::after{content:"+";position:absolute;right:20px;top:50%;transform:translateY(-50%);font:400 26px/1 var(--sans);color:var(--burgund);transition:transform .2s}
.fq[open] summary::after{transform:translateY(-50%) rotate(45deg)}
.fq > div{padding:0 20px 18px;color:var(--muted);font-size:16px;line-height:1.6}
.fq > div p{margin:0 0 10px}
.fq a{color:var(--burgund)}

/* Handy: der leere Himmel über dem Panorama gehört dem Text, also rückt das Bild nach oben */
@media (max-width:899px){.hero-c .hero-stage{margin-top:-24vw}}

/* Handy: eine Karte je Paket, seitlich zu wischen, bloom now in der Mitte zuerst im Bild (Marco, 28.10.2026:
   Pakete nebeneinander vergleichen statt Zeiträume). Die Tabelle bleibt für breite Fenster. */
.plans{display:none}
@media (max-width:640px){
  .bn-price-table{display:none!important}
  .bn-price-wrap{overflow:visible}
  .plans{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;margin:0 -22px;padding:6px 22px 18px;text-align:left}
  .plan{position:relative;flex:none;width:78%;scroll-snap-align:center;background:#fff;border-radius:22px;padding:20px 20px 18px;box-shadow:0 8px 24px rgba(46,26,74,.08);border:1px solid rgba(125,8,69,.08)}
  .plan.is-main{border:2px solid var(--burgund);box-shadow:0 12px 30px rgba(125,8,69,.16)}
  .plan h3{margin:0 0 10px;font:700 21px/1.2 var(--display);color:var(--burgund)}
  .plan-price{margin:0 0 6px;display:flex;flex-direction:column;gap:2px}
  .plan-price del{color:var(--muted);font-size:13px}
  .plan-price strong{font-size:22px;color:var(--ink)}
  .plan-price span{font-size:13px;color:var(--muted)}
  .plan-try{margin:0 0 10px;font-size:13.5px;font-weight:600;color:var(--burgund)}
  .plan ul{margin:10px 0 0;padding-left:18px;font-size:14.5px;line-height:1.4}
  .plan li{margin:3px 0}
}
html[data-theme="burgund"] .plan{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.12);box-shadow:none;color:#fbf6ef}
html[data-theme="burgund"] .plan h3,html[data-theme="burgund"] .plan-try{color:#ffd27a}
html[data-theme="burgund"] .plan-price strong{color:#fff}
html[data-theme="burgund"] .plan.is-main{border-color:#ffb000}
html[data-theme="ruhig"] .plan{background:#fafaf8;box-shadow:none;border:1px solid #e5e7eb}
html[data-theme="ruhig"] .plan.is-main{border:2px solid var(--burgund)}

/* Store-Badges unter dem Knopf, unverändert, mindestens 40 px hoch */
.hero-badges{display:flex;gap:10px;justify-content:center;margin-top:14px}
.hero-badges img{height:40px;width:auto}

/* Auszeichnung und Presse: eine ruhige Zeile unter den Stimmen */
.press{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:14px 28px;max-width:1100px;margin:6px auto 0;padding:14px 22px 26px}
.press-award{display:inline-flex;align-items:center;gap:12px;text-decoration:none;color:var(--ink);background:#fff;border:1px solid rgba(255,176,0,.5);border-radius:999px;padding:9px 18px 9px 10px;box-shadow:0 4px 14px rgba(46,26,74,.06)}
.press-star{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:#fff;box-shadow:inset 0 0 0 1.5px rgba(255,176,0,.6);flex:none}
.press-star img{width:36px;height:36px;object-fit:contain}
.press-award b{display:block;font:700 15px/1.2 var(--display);color:var(--burgund)}
.press-award span span,.press-award > span:last-child{font-size:12.5px;color:var(--muted)}
.press-outlets{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:6px 18px;font:600 15px/1.2 var(--sans);color:#8a8290;letter-spacing:.01em}
.press-lead{font:500 12px/1 var(--sans);text-transform:uppercase;letter-spacing:.1em;color:var(--muted)}
.nx-base .nx-tm{grid-column:1 / -1;font-size:11.5px;color:rgba(255,255,255,.45)}
@media (min-width:900px){
  .hero-c .hero-get{flex-direction:row;justify-content:center;align-items:center;gap:12px}
  .hero-c .hero-get .dl-smart{min-width:0;padding:0 26px;min-height:46px}
  .hero-c .hero-badges{margin-top:0}
}

.press-rating{display:inline-flex;align-items:baseline;gap:7px;font-size:14px;color:var(--muted)}
.press-rating b{font:700 16px/1 var(--display);color:var(--ink)}
.press-stars{color:var(--amber);letter-spacing:1px}
.press-rating small{font-size:12px}

/* ── Handys plastisch (Owner 28.10.2026: „die sind grad flach“): Titanrahmen mit Lichtkante,
   eine sichtbare Seitenkante in 3D, Seitentaste, Glanz über dem Glas und ein weicher Schatten
   am Boden. Auf dem Glas laufen die Videos aus den App Previews (App Store). ── */
.row-art{perspective:1500px}
.row-art .dev,.bloomie-dev .dev{position:relative;width:min(56vw,250px);aspect-ratio:auto;padding:10px;border-radius:50px;
  background:linear-gradient(135deg,#9a9aa2 0%,#3a3a3f 9%,#141416 30%,#0c0c0d 55%,#2e2e33 85%,#8d8d95 100%);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.45),inset 0 0 0 3px #08080a,inset 0 0 0 4.5px rgba(255,255,255,.07);
  transform-style:preserve-3d;transform:rotateY(-24deg) rotateX(7deg) rotateZ(2deg);
  filter:drop-shadow(30px 40px 34px rgba(46,26,74,.32)) drop-shadow(6px 10px 8px rgba(0,0,0,.18));
  transition:transform 1.1s cubic-bezier(.2,1.15,.35,1)}
.row.rev .row-art .dev{transform:rotateY(24deg) rotateX(7deg) rotateZ(-2deg);filter:drop-shadow(-30px 40px 34px rgba(46,26,74,.32)) drop-shadow(-6px 10px 8px rgba(0,0,0,.18))}
/* Nur das letzte Handy dreht sich zur Person, die anderen bleiben ruhig (Boris, 28.10.2026: mit
   allen laufenden Screens sonst zu viel Bewegung) */
.offer .row:last-of-type .row-art:hover .dev{transform:rotateY(-8deg) rotateX(3deg)}
.offer .row.rev:last-of-type .row-art:hover .dev{transform:rotateY(8deg) rotateX(3deg)}
.dev-screen{display:block;width:100%!important;height:auto!important;aspect-ratio:432/936;object-fit:cover;border-radius:41px!important;background:#000}
.dev-edge{position:absolute;top:30px;bottom:30px;right:0;width:15px;border-radius:8px;transform-origin:right center;transform:rotateY(-90deg);
  background:linear-gradient(to bottom,#6d6d74,#25252a 12%,#45454b 50%,#25252a 88%,#6d6d74)}
.row.rev .dev-edge{right:auto;left:0;transform-origin:left center;transform:rotateY(90deg)}
.dev-btn{position:absolute;right:-2px;top:24%;width:3px;height:10%;border-radius:2px;background:linear-gradient(90deg,#55555b,#1d1d20)}
.row.rev .dev-btn{right:auto;left:-2px}
.dev-gloss{position:absolute;inset:10px;border-radius:41px;pointer-events:none;
  background:linear-gradient(118deg,rgba(255,255,255,.26) 0%,rgba(255,255,255,.08) 22%,rgba(255,255,255,0) 40%)}
/* Ein zweites Gerät dahinter, kleiner und weiter weg */
.row-art .dev.dev--back{position:absolute;transform:translate(-38%,-4%) translateZ(-120px) rotateY(-30deg) rotateZ(-8deg) scale(.86)!important;filter:drop-shadow(18px 26px 24px rgba(46,26,74,.22)) brightness(.96)}
.row.rev .row-art .dev.dev--back{transform:translate(38%,-4%) translateZ(-120px) rotateY(30deg) rotateZ(8deg) scale(.86)!important}
.row-art .dev--back + .dev{position:relative;transform:translate(16%,3%) rotateY(-24deg) rotateX(7deg) rotateZ(2deg)}
.row.rev .row-art .dev--back + .dev{transform:translate(-16%,3%) rotateY(24deg) rotateX(7deg) rotateZ(-2deg)}
/* der weiche Fleck am Boden */
.row-art::after{content:"";position:absolute;left:50%;bottom:4%;width:240px;height:34px;margin-left:-120px;border-radius:50%;background:radial-gradient(closest-side,rgba(46,26,74,.22),transparent);filter:blur(6px);z-index:-1}
.bloomie-dev{position:relative;display:grid;place-items:center;min-height:500px}
@media (min-width:860px){.row-art .dev,.bloomie-dev .dev{width:268px}}
@media (prefers-reduced-motion:reduce){.row-art .dev{transition:none}}

/* ── Handy-Ansicht (Owner 28.10.2026: auch für mobile optimieren, Installieren-Knopf auffällig, bloomie
   in der Ecke). Unten links der Knopf, unten rechts bloomie; Musik oben rechts unter der Kopfzeile. ── */
@media (max-width:899px){
  .sticky{left:14px;right:auto;justify-content:flex-start;bottom:calc(20px + env(safe-area-inset-bottom))}
  .sticky .dl-smart{width:auto;min-width:0;min-height:54px;padding:0 26px;font-size:17px;box-shadow:0 12px 30px rgba(125,8,69,.38),0 0 0 4px rgba(255,255,255,.85)}
  .bn-song{top:74px;bottom:auto;right:12px;height:38px;padding:0 10px}
  .bn-song > span{display:none}
  /* Karten unter das Handy statt über den Screen */
  .row-art{display:flex;flex-direction:column;align-items:center;min-height:0;padding-bottom:6px}
  .row-art .float{position:relative;right:auto!important;left:auto!important;top:auto!important;bottom:auto!important;margin:-56px auto 0;z-index:3;max-width:260px}
  .row .dev--back{display:none}
  .row-art .dev--back + .dev{transform:rotateY(-18deg) rotateX(6deg) rotateZ(2deg)}
  .row.rev .row-art .dev--back + .dev{transform:rotateY(18deg) rotateX(6deg) rotateZ(-2deg)}
  .row{gap:18px;padding:22px 0 40px}
  .press{flex-direction:column;gap:12px}
  .press-rating{flex-wrap:wrap;justify-content:center;text-align:center}
  .press-rating small{flex-basis:100%}
  .hero-c .hero-txt h1{font-size:clamp(30px,8.6vw,40px)}
  .film{padding-bottom:110px}
  .nx-foot{padding-bottom:110px}
}

/* ════════════════════════════════════════════════════════════════════════════════
   Drei Design-Varianten, eine Struktur (Owner 28.10.2026, „das ist v1“). Die Seiten
   burgund/ und ruhig/ erzeugt scripts/build-vorschau-varianten.py aus index.html, hier
   steht nur, was sich am Aussehen unterscheidet. Farben nur aus dem App-System
   (docs/DESIGN_GUIDELINES.md §2): Burgund, Creme, Bernstein, Orange, Rosé, Deep, Surface.
   ════════════════════════════════════════════════════════════════════════════════ */
.pv-bar a{font-weight:500}
html[data-theme="creme"] .pv-bar [data-v="creme"],html[data-theme="burgund"] .pv-bar [data-v="burgund"],html[data-theme="ruhig"] .pv-bar [data-v="ruhig"]{font-weight:700;text-decoration:none;background:#5a4300;color:#fff3c4;padding:1px 7px;border-radius:999px}

/* ── B · Burgund: dunkler Burgund-Grund, Creme-Schrift, Bernstein als Akzent ── */
html[data-theme="burgund"]{--ink:#fbf6ef;--muted:rgba(251,246,239,.74)}
html[data-theme="burgund"] body{background:radial-gradient(120% 60% at 50% 0%,#7d0845 0%,#4a0428 55%,#2a0217 100%) fixed,#4a0428;color:var(--ink)}
html[data-theme="burgund"] .nx-head{background:rgba(42,2,23,.78);border-color:rgba(255,255,255,.08)}
html[data-theme="burgund"] .nx-head.is-scrolled{border-color:rgba(255,255,255,.12)}
html[data-theme="burgund"] .pv-logo{color:#fbf6ef}
html[data-theme="burgund"] .nx-nav a{color:#fbf6ef}
html[data-theme="burgund"] .nx-nav a:hover{background:rgba(255,255,255,.08);color:var(--amber)}
html[data-theme="burgund"] .nx-get,html[data-theme="burgund"] .dl-smart--burgund{background:var(--amber);color:var(--deep)}
html[data-theme="burgund"] .nx-burger{color:#fbf6ef}
html[data-theme="burgund"] .nx-drawer a{color:#fbf6ef;border-color:rgba(255,255,255,.1)}
html[data-theme="burgund"] .hero-big{background:none}
html[data-theme="burgund"] .hero-big h1,html[data-theme="burgund"] .scene h2,html[data-theme="burgund"] .offer > h2,html[data-theme="burgund"] .trust-b h2,html[data-theme="burgund"] .price-b h2,html[data-theme="burgund"] .faq-b h2{color:#fbf6ef}
html[data-theme="burgund"] .hero-big h1 em{background:linear-gradient(90deg,#ffd27a,#ffb000,#f3d5be);-webkit-background-clip:text;background-clip:text;color:transparent}
html[data-theme="burgund"] .hero-c .hero-stage{-webkit-mask-image:linear-gradient(to right,transparent,#000 8%,#000 92%,transparent),linear-gradient(to bottom,#000 85%,transparent);mask-image:linear-gradient(to right,transparent,#000 8%,#000 92%,transparent)}
html[data-theme="burgund"] .voices{background:none}
html[data-theme="burgund"] .vq{background:rgba(255,255,255,.07);box-shadow:none;border:1px solid rgba(255,255,255,.1)}
html[data-theme="burgund"] .vq blockquote{color:#fbf6ef}
html[data-theme="burgund"] .vq strong{color:var(--amber)}
html[data-theme="burgund"] .vq--user{background:#f3d5be;border-color:#f3d5be}
html[data-theme="burgund"] .vq--user blockquote{color:#4a0428}
html[data-theme="burgund"] .vq--user figcaption{color:rgba(74,4,40,.7)}
html[data-theme="burgund"] .vq--user blockquote::before{color:#c46a2a}
html[data-theme="burgund"] .lane-wrap{-webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)}
html[data-theme="burgund"] .press-award{background:rgba(255,255,255,.07);border-color:rgba(255,176,0,.45);color:#fbf6ef}
html[data-theme="burgund"] .press-award b{color:var(--amber)}
html[data-theme="burgund"] .press-outlets{color:rgba(251,246,239,.6)}
html[data-theme="burgund"] .press-rating b{color:#fbf6ef}
html[data-theme="burgund"] .kicker,html[data-theme="burgund"] .eyebrow{color:var(--amber);background:rgba(255,176,0,.12)}
html[data-theme="burgund"] .row h3{color:#fbf6ef}
html[data-theme="burgund"] .row-btn{border-color:#fbf6ef;color:#fbf6ef}
html[data-theme="burgund"] .row-btn:hover{background:#fbf6ef;color:#4a0428}
html[data-theme="burgund"] .row-art::before{background:radial-gradient(closest-side,rgba(255,176,0,.16),rgba(243,213,190,.06) 60%,transparent)}
html[data-theme="burgund"] .row-art::after{background:radial-gradient(closest-side,rgba(0,0,0,.4),transparent)}
html[data-theme="burgund"] .float{background:rgba(251,246,239,.96);color:#4a0428}
html[data-theme="burgund"] .float li::before{background:#c46a2a}
html[data-theme="burgund"] .trust-grid > div,html[data-theme="burgund"] .fq,html[data-theme="burgund"] .who a,html[data-theme="burgund"] .bn-price-table{background:rgba(255,255,255,.07);box-shadow:none;border-color:rgba(255,255,255,.1)}
html[data-theme="burgund"] .trust-grid > div{border-top-color:var(--amber)}
html[data-theme="burgund"] .trust-grid b,html[data-theme="burgund"] .who strong,html[data-theme="burgund"] .bn-price-table thead th{color:var(--amber)}
html[data-theme="burgund"] .trust-grid a,html[data-theme="burgund"] .fq a{color:var(--amber)}
html[data-theme="burgund"] .fq summary{color:#fbf6ef}
html[data-theme="burgund"] .fq summary::after{color:var(--amber)}
html[data-theme="burgund"] .bn-price-table th,html[data-theme="burgund"] .bn-price-table td{border-color:rgba(255,255,255,.08)}
html[data-theme="burgund"] .bn-price-table tbody th,html[data-theme="burgund"] .bn-price-table strong{color:#fbf6ef}
html[data-theme="burgund"] .bn-price-table .is-main{background:rgba(255,176,0,.08)}
html[data-theme="burgund"] .bn-price-table thead .is-main{background:var(--amber);color:var(--deep)}
html[data-theme="burgund"] .bn-price-table .is-free{color:var(--amber)}
html[data-theme="burgund"] .scene--tint{background:rgba(0,0,0,.14)}
html[data-theme="burgund"] .bubble{background:#fbf6ef;color:#4a0428}
html[data-theme="burgund"] .film-frame{outline-color:rgba(255,255,255,.14)}
html[data-theme="burgund"] .cta-end{background:none}
html[data-theme="burgund"] .wall-bg{opacity:.55}
html[data-theme="burgund"] .nx-foot{background:rgba(0,0,0,.28)}
html[data-theme="burgund"] .bn-song{background:rgba(42,2,23,.85);color:#fbf6ef;border-color:rgba(255,255,255,.25)}
html[data-theme="burgund"] .bn-song.is-playing{background:var(--amber);color:var(--deep);border-color:var(--amber)}
html[data-theme="burgund"] .sticky .dl-smart{box-shadow:0 12px 30px rgba(0,0,0,.4),0 0 0 4px rgba(42,2,23,.6)}
html[data-theme="burgund"] .qr-card{background:#fbf6ef}
html[data-theme="burgund"] .qr-card p{color:#5b5560}

/* ── C · Ruhig: angelehnt an „Reizarm“ der App. Flache Flächen, ein Akzent, kaum Schatten,
   nichts läuft von selbst, die Handys stehen gerade. ── */
html[data-theme="ruhig"]{--ink:#1a1a1a;--muted:#4b5563}
html[data-theme="ruhig"] body{background:#f0efed}
html[data-theme="ruhig"] .nx-head{background:#f0efed;-webkit-backdrop-filter:none;backdrop-filter:none;border-bottom:1px solid #e5e7eb;box-shadow:none}
html[data-theme="ruhig"] .hero-big,html[data-theme="ruhig"] .voices,html[data-theme="ruhig"] .scene--tint{background:none}
html[data-theme="ruhig"] .hero-big h1 em{background:none;color:var(--burgund);-webkit-text-fill-color:currentColor}
html[data-theme="ruhig"] .scene h2,html[data-theme="ruhig"] .offer > h2,html[data-theme="ruhig"] .trust-b h2,html[data-theme="ruhig"] .price-b h2,html[data-theme="ruhig"] .faq-b h2,html[data-theme="ruhig"] .row h3{color:#1a1a1a}
html[data-theme="ruhig"] .lane{animation:none!important;width:auto;overflow-x:auto;padding:4px 22px 12px;scroll-snap-type:x mandatory;scrollbar-width:none}
html[data-theme="ruhig"] .lane::-webkit-scrollbar{display:none}
html[data-theme="ruhig"] .lane > [aria-hidden="true"]{display:none}
html[data-theme="ruhig"] .lane .vq{scroll-snap-align:start}
html[data-theme="ruhig"] .lane-wrap{-webkit-mask-image:none;mask-image:none}
html[data-theme="ruhig"] .vq{background:#fafaf8;box-shadow:none;border:1px solid #e5e7eb}
html[data-theme="ruhig"] .vq--user{background:#fafaf8;border-left:4px solid var(--burgund)}
html[data-theme="ruhig"] .vq--user blockquote{color:#1a1a1a}
html[data-theme="ruhig"] .vq--user figcaption{color:#4b5563}
html[data-theme="ruhig"] .vq--user .stars{color:var(--burgund)}
html[data-theme="ruhig"] .vq blockquote::before{color:var(--burgund)}
html[data-theme="ruhig"] .press-award,html[data-theme="ruhig"] .trust-grid > div,html[data-theme="ruhig"] .fq,html[data-theme="ruhig"] .who a,html[data-theme="ruhig"] .bn-price-table{background:#fafaf8;box-shadow:none;border:1px solid #e5e7eb}
html[data-theme="ruhig"] .trust-grid > div{border-top:1px solid #e5e7eb}
html[data-theme="ruhig"] .press-star{background:#fafaf8;box-shadow:inset 0 0 0 1.5px var(--burgund)}
html[data-theme="ruhig"] .press-stars{color:var(--burgund)}
html[data-theme="ruhig"] .kicker{color:var(--burgund)}
html[data-theme="ruhig"] .eyebrow{background:none;padding-left:0}
html[data-theme="ruhig"] .row-art::before,html[data-theme="ruhig"] .row-art::after{display:none}
html[data-theme="ruhig"] .row-art .dev,html[data-theme="ruhig"] .bloomie-dev .dev,html[data-theme="ruhig"] .row.rev .row-art .dev,html[data-theme="ruhig"] .row-art .dev--back + .dev,html[data-theme="ruhig"] .row.rev .row-art .dev--back + .dev{transform:none!important;filter:drop-shadow(0 12px 18px rgba(26,26,26,.12))}
html[data-theme="ruhig"] .row-art .dev.dev--back{transform:translate(-36%,-4%) scale(.86)!important}
html[data-theme="ruhig"] .row.rev .row-art .dev.dev--back{transform:translate(36%,-4%) scale(.86)!important}
html[data-theme="ruhig"] .dev-edge{display:none}
html[data-theme="ruhig"] .dev-gloss{opacity:.4}
html[data-theme="ruhig"] .float{background:#fafaf8;color:#1a1a1a;border:1px solid #e5e7eb;box-shadow:0 6px 16px rgba(26,26,26,.08);-webkit-backdrop-filter:none;backdrop-filter:none}
html[data-theme="ruhig"] .row.in .float{animation:none}
html[data-theme="ruhig"] .float li::before{background:var(--burgund)}
html[data-theme="ruhig"] .film-frame{box-shadow:none;outline:1px solid #e5e7eb}
html[data-theme="ruhig"] .wall,html[data-theme="ruhig"] .cta-end{background:var(--burgund)}
html[data-theme="ruhig"] .wall-bg,html[data-theme="ruhig"] .grain::after{display:none}
html[data-theme="ruhig"] .dl-smart--amber{background:#fafaf8;color:var(--burgund)}
html[data-theme="ruhig"] .nx-foot{background:#1a1a1a}
html[data-theme="ruhig"] .bn-price-table thead .is-main{background:var(--burgund)}
html[data-theme="ruhig"] .bn-price-pill{background:#fafaf8;color:var(--burgund);border:1px solid var(--burgund)}
html[data-theme="ruhig"] .rv{transition-duration:.3s}

/* ── Navigation mit Dropdowns und Pfeilen (Owner 28.10.2026) ───────────── */
.nx-dd{position:relative}
.nx-top{display:inline-flex;align-items:center;gap:6px}
.nx-chev{width:12px;height:12px;flex:none;opacity:.7;transition:transform .2s var(--ease)}
.nx-dd:hover .nx-chev,.nx-dd:focus-within .nx-chev{transform:rotate(180deg);opacity:1}
.nx-nav .nx-top[aria-current]{color:var(--burgund);background:rgba(125,8,69,.07)}
.nx-menu{position:absolute;left:50%;top:100%;padding-top:10px;transform:translate(-50%,6px);opacity:0;visibility:hidden;transition:opacity .18s,transform .18s,visibility .18s;z-index:70}
.nx-dd:hover .nx-menu,.nx-dd:focus-within .nx-menu{opacity:1;visibility:visible;transform:translate(-50%,0)}
.nx-menu-in{min-width:230px;background:#fff;border-radius:18px;padding:8px;box-shadow:0 18px 40px rgba(46,26,74,.16),0 2px 6px rgba(46,26,74,.06);border:1px solid rgba(125,8,69,.08)}
.nx-menu-in::before{content:"";position:absolute;left:50%;top:5px;width:12px;height:12px;margin-left:-6px;background:#fff;transform:rotate(45deg);border-left:1px solid rgba(125,8,69,.08);border-top:1px solid rgba(125,8,69,.08)}
.nx-nav .nx-menu a{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 12px;border-radius:12px;font-size:15px;white-space:nowrap}
.nx-nav .nx-menu a::after{content:"→";opacity:0;transform:translateX(-4px);transition:opacity .15s,transform .15s;color:var(--burgund)}
.nx-nav .nx-menu a:hover::after{opacity:1;transform:none}
/* Handy: das Menü als aufklappbare Gruppen */
.nx-head.is-open .nx-drawer{max-height:80vh;overflow-y:auto}
.nx-acc{border-bottom:1px solid rgba(125,8,69,.08)}
.nx-acc summary{list-style:none;display:flex;align-items:center;justify-content:space-between;font:700 22px/1.2 var(--display);color:var(--burgund);padding:12px 2px;cursor:pointer}
.nx-acc summary::-webkit-details-marker{display:none}
.nx-acc summary .nx-chev{width:16px;height:16px}
.nx-acc[open] summary .nx-chev{transform:rotate(180deg)}
.nx-acc > div{display:grid;padding:0 0 12px 4px}
.nx-drawer .nx-acc a{font:500 16px/1.3 var(--sans);color:var(--ink);border:0;padding:9px 2px}
.nx-lang-h{font:600 12.5px/1 var(--sans);letter-spacing:.09em;text-transform:uppercase;color:var(--amber);margin:0 0 14px}

html[data-theme="burgund"] .nx-menu-in,html[data-theme="burgund"] .nx-menu-in::before{background:#3a0320;border-color:rgba(255,255,255,.12)}
html[data-theme="burgund"] .nx-nav .nx-menu a{color:#fbf6ef}
html[data-theme="burgund"] .nx-nav .nx-menu a:hover{background:rgba(255,255,255,.08)}
html[data-theme="burgund"] .nx-nav .nx-menu a::after{color:var(--amber)}
html[data-theme="burgund"] .nx-nav .nx-top[aria-current]{color:var(--amber);background:rgba(255,176,0,.1)}
html[data-theme="burgund"] .nx-head.is-open{background:#2a0217}
html[data-theme="burgund"] .nx-acc{border-color:rgba(255,255,255,.1)}
html[data-theme="burgund"] .nx-acc summary{color:#fbf6ef}
html[data-theme="burgund"] .nx-drawer .nx-acc a{color:rgba(251,246,239,.85)}
html[data-theme="ruhig"] .nx-menu-in{box-shadow:0 8px 20px rgba(26,26,26,.08);border-color:#e5e7eb}
html[data-theme="ruhig"] .nx-menu{transition:none}

/* ── Unterseiten (Pädagog*innen, Expert*innen) ─────────────────────────── */
.sub-c{display:grid;gap:10px;justify-items:center;text-align:center;max-width:1160px;margin:0 auto;padding:26px 22px 40px}
.sub-c .sub-art{width:min(62vw,300px);aspect-ratio:1/1}
.sub-c .kicker{display:block;margin-bottom:12px}
.sub-c h1{font:700 clamp(32px,8.8vw,58px)/1.06 var(--display);color:var(--burgund);margin:0;text-wrap:balance;max-width:760px}
.sub-c h1 em{font-style:normal;background:linear-gradient(90deg,#c0185f,#c46a2a 60%,#e89a00);-webkit-background-clip:text;background-clip:text;color:transparent}
.sub-c .hero-txt p{font-size:17px;line-height:1.6;color:var(--muted);max-width:540px;margin:16px auto 22px}
.sub-c .hero-get{display:flex;flex-direction:column;align-items:center;gap:12px}
.sub-link{display:inline-block;margin-top:16px;font:600 15px/1 var(--sans);color:var(--burgund);text-decoration:none;border-bottom:2px solid currentColor;padding-bottom:4px}
@media (min-width:900px){
  .sub-c{grid-template-columns:1.05fr .95fr;align-items:center;text-align:left;justify-items:start;gap:50px;padding:50px 28px 60px}
  .sub-c .hero-txt{order:-1}
  .sub-c .hero-txt p{margin-left:0}
  .sub-c .hero-get{flex-direction:row;align-items:center}
  .sub-c .sub-art{width:420px;justify-self:center}
}
.row-art--line canvas{width:min(70vw,340px);aspect-ratio:1/1}
.row-art--line::before{inset:4% 4%}
.lead{font-size:17px;line-height:1.6;color:var(--muted);max-width:620px;margin:-8px auto 26px}
@media (min-width:1080px){.trust-grid--3{grid-template-columns:repeat(3,1fr)}}
.steps{max-width:980px;margin:0 auto;padding:40px 22px 50px;text-align:center}
.steps h2{font:700 clamp(28px,7vw,44px)/1.08 var(--display);color:var(--burgund);margin:0 0 26px}
.steps-list{list-style:none;padding:0;margin:0 0 26px;display:grid;gap:14px;text-align:left;counter-reset:s}
.steps-list li{display:flex;align-items:flex-start;gap:16px;background:#fff;border-radius:20px;padding:18px 20px;box-shadow:0 6px 18px rgba(46,26,74,.06);font-size:16px;line-height:1.5}
.steps-list b{display:grid;place-items:center;flex:none;width:38px;height:38px;border-radius:50%;background:var(--burgund);color:#fff;font:700 18px/1 var(--display)}
@media (min-width:860px){.steps-list{grid-template-columns:repeat(3,1fr)}}
.band-b{background:radial-gradient(120% 120% at 0% 0%,#7d0845,#4a0428 60%,#2a0217);color:#fbf6ef;padding:70px 22px;margin:20px 0}
.band-in{max-width:980px;margin:0 auto;text-align:center}
.band-b .kicker{color:var(--amber)}
.band-b h2{font:700 clamp(30px,8vw,50px)/1.06 var(--display);margin:12px 0 0;text-wrap:balance}
.band-b p{font-size:17px;line-height:1.6;color:rgba(251,246,239,.85);max-width:600px;margin:16px auto 0}
.band-list{list-style:none;padding:0;margin:30px 0;display:grid;gap:12px;text-align:left}
.band-list li{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);border-radius:18px;padding:16px 18px;font-size:15px;color:rgba(251,246,239,.8)}
.band-list b{display:block;color:var(--amber);font:700 18px/1.2 var(--display);margin-bottom:4px}
@media (min-width:860px){.band-list{grid-template-columns:repeat(4,1fr)}}
.price-b .row-btn{margin-top:6px}

html[data-theme="burgund"] .sub-c h1{color:#fbf6ef}
html[data-theme="burgund"] .sub-c h1 em{background:linear-gradient(90deg,#ffd27a,#ffb000,#f3d5be);-webkit-background-clip:text;background-clip:text;color:transparent}
html[data-theme="burgund"] .sub-link{color:var(--amber)}
html[data-theme="burgund"] .steps h2{color:#fbf6ef}
html[data-theme="burgund"] .steps-list li{background:rgba(255,255,255,.07);box-shadow:none;border:1px solid rgba(255,255,255,.1)}
html[data-theme="burgund"] .steps-list b{background:var(--amber);color:var(--deep)}
html[data-theme="burgund"] .band-b{background:rgba(0,0,0,.22)}
html[data-theme="ruhig"] .sub-c h1 em{background:none;color:var(--burgund);-webkit-text-fill-color:currentColor}
html[data-theme="ruhig"] .sub-c h1,html[data-theme="ruhig"] .steps h2{color:#1a1a1a}
html[data-theme="ruhig"] .steps-list li{background:#fafaf8;box-shadow:none;border:1px solid #e5e7eb}
html[data-theme="ruhig"] .band-b{background:var(--burgund)}

/* ── Professionelle Fußzeile (Owner 28.10.2026) ─────────────────────────── */
.nf{background:#2a0217;color:rgba(251,246,239,.72);padding:64px 22px 30px;font-size:14.5px}
.nf-in{max-width:1180px;margin:0 auto}
.nf a{color:#fbf6ef;text-decoration:none}
.nf a:hover{color:var(--amber)}
.nf-top{display:grid;gap:44px;padding-bottom:40px;border-bottom:1px solid rgba(255,255,255,.1)}
.nf-brand .pv-logo{color:#fff;font-size:30px}
.nf-brand .pv-logo img{width:38px;height:38px}
.nf-brand .claim{margin:14px 0 22px;max-width:300px;line-height:1.55;color:rgba(251,246,239,.8)}
.nf-get{display:flex;align-items:center;gap:14px}
.nf-qr{width:84px;height:84px;background:#fff;border-radius:12px;padding:6px}
.nf-badges{display:flex;flex-direction:column;gap:8px}
.nf-badges img{height:40px;width:auto}
.nf-award{display:inline-flex;align-items:center;gap:10px;margin-top:22px;padding:8px 14px 8px 8px;border:1px solid rgba(255,176,0,.4);border-radius:999px;font-size:13px}
.nf-award span{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--amber);color:#2a0217;font-size:13px}
.nf-cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 20px}
.nf-col h3{font:600 12.5px/1 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--amber);margin:0 0 16px}
.nf-col ul{list-style:none;margin:0;padding:0;display:grid;gap:11px}
.nf-col li{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.nf-tag{font:600 10.5px/1 var(--sans);letter-spacing:.04em;text-transform:uppercase;color:#2a0217;background:var(--amber);padding:4px 7px;border-radius:999px}
.nf-trust{list-style:none;margin:0;padding:22px 0;display:flex;flex-wrap:wrap;gap:10px 26px;border-bottom:1px solid rgba(255,255,255,.1)}
.nf-trust li{display:flex;align-items:center;gap:8px;font-size:13.5px}
.nf-trust li::before{content:"";width:16px;height:16px;border-radius:50%;background:rgba(255,176,0,.18) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.5 8.2 7 10.6l4.6-5' fill='none' stroke='%23ffb000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/16px no-repeat}
.nf-lang{display:flex;flex-wrap:wrap;align-items:center;gap:12px 16px;padding:22px 0;border-bottom:1px solid rgba(255,255,255,.1)}
.nf-lang-h{font:600 12.5px/1 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--amber)}
.nf-base{padding-top:22px;display:grid;gap:6px;font-size:12.5px;color:rgba(251,246,239,.55)}
.nf-base p{margin:0}
.nf-base a{color:rgba(251,246,239,.8)}
.nf-tm{font-size:11px;color:rgba(251,246,239,.4)}
@media (min-width:900px){
  .nf-top{grid-template-columns:minmax(260px,1fr) 2.6fr;gap:60px}
  .nf-cols{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media (max-width:899px){.nf{padding-bottom:110px}}
html[data-theme="burgund"] .nf{background:rgba(0,0,0,.32)}
html[data-theme="ruhig"] .nf{background:#1a1a1a}
html[data-theme="ruhig"] .nf-col h3,html[data-theme="ruhig"] .nf-lang-h{color:#f3d5be}

/* Platzhalter-Seite „in Arbeit“ */
.soon{min-height:62vh;display:grid;justify-items:center;align-content:center;gap:12px;text-align:center;padding:50px 22px 70px;max-width:680px;margin:0 auto}
.soon-art{width:min(60vw,240px);aspect-ratio:1/1}
.soon h1{font:700 clamp(32px,8vw,54px)/1.06 var(--display);color:var(--burgund);margin:6px 0 0;text-wrap:balance}
.soon p{font-size:17px;line-height:1.6;color:var(--muted);margin:6px 0 16px}
.soon a:not(.dl-smart){color:var(--burgund);font-weight:600}
html[data-theme="burgund"] .soon h1{color:#fbf6ef}
html[data-theme="burgund"] .soon a:not(.dl-smart){color:var(--amber)}
html[data-theme="ruhig"] .soon h1{color:#1a1a1a}

/* Zeichnung über einer Abschnitts-Überschrift (Owner 28.10.2026: auf allen Seiten mit sich zeichnenden Bildern arbeiten) */
.sec-art{display:block;width:150px;height:150px;margin:0 auto 6px}
@media (min-width:900px){.sec-art{width:170px;height:170px}}

/* Das schwebende bloomie in den Farben der Seite statt im Rosa der Live-Seite (Owner 28.10.2026) */
html .bloomie-launch .bloomie-ring{background:#f3d5be!important;box-shadow:0 0 0 3px #fbf6ef,0 10px 24px rgba(125,8,69,.28)!important}
html .bloomie-launch:hover .bloomie-ring{box-shadow:0 0 0 3px #fbf6ef,0 14px 30px rgba(125,8,69,.38)!important}
html .bloomie-nudge{background:#fbf6ef!important;color:#7d0845!important;border:1px solid rgba(125,8,69,.18)}
html[data-theme="burgund"] .bloomie-launch .bloomie-ring{background:#7d0845!important;box-shadow:0 0 0 3px #ffb000,0 10px 26px rgba(0,0,0,.45)!important}
html[data-theme="burgund"] .bloomie-nudge{background:#4a0428!important;color:#fbf6ef!important;border-color:rgba(255,176,0,.5)}
html[data-theme="ruhig"] .bloomie-launch .bloomie-ring{background:#fafaf8!important;box-shadow:0 0 0 1px #e5e7eb,0 4px 10px rgba(26,26,26,.08)!important}
html[data-theme="ruhig"] .bloomie-nudge{background:#fafaf8!important;color:#1a1a1a!important;border-color:#e5e7eb}

/* Die Umschaltleiste oben: schmal, nur die drei Designs (Owner 28.10.2026) */
.pv-switch{display:flex;justify-content:center;gap:4px;padding:4px 10px;background:#fff3c4;font:600 12px/1 var(--sans)}
.pv-switch a{padding:5px 12px;border-radius:999px;color:#5a4300;text-decoration:none}
.pv-switch a:hover{background:rgba(90,67,0,.1)}
html[data-theme="creme"] .pv-switch [data-v="creme"],html[data-theme="burgund"] .pv-switch [data-v="burgund"],html[data-theme="ruhig"] .pv-switch [data-v="ruhig"]{background:#5a4300;color:#fff3c4;padding:5px 12px}

/* Musik in der Kopfzeile: ein runder Knopf, gleiche Höhe wie „App laden“ */
.bn-song.in-head{position:static;margin-left:auto;height:40px;width:auto;padding:0 12px;box-shadow:none;flex:none}
.bn-song.in-head > span{display:none}
.bn-song.in-head svg{width:20px;height:20px}
@media (min-width:980px){.bn-song.in-head{margin-left:12px}.nx-head-in .nx-get{margin-left:8px}}
@media (max-width:979px){.nx-head-in .nx-get{margin-left:0}}
html[data-theme="burgund"] .bn-song.in-head{background:rgba(255,255,255,.08)}

/* Safari-Fehler (Owner-Screenshot 28.10.2026, iPhone): eine Maske über einem sehr breiten, bewegten
   Band schneidet in Safari Kacheln weg, links blieb nur leere Fläche. Ohne Maske, und das Band
   läuft über translate3d auf der Grafikkarte. */
.lane-wrap,html[data-theme="burgund"] .lane-wrap{-webkit-mask-image:none!important;mask-image:none!important}
.lane{will-change:transform;-webkit-backface-visibility:hidden;backface-visibility:hidden;animation-name:lane3d}
@keyframes lane3d{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}}

/* Expert*innen-Seite: die Stimmen abwechselnd weiß und Burgund wie auf der Eltern-Seite (Boris, 28.10.2026) */
.voices--alt .vq:nth-child(even){background:var(--burgund);box-shadow:0 10px 26px rgba(125,8,69,.22)}
.voices--alt .vq:nth-child(even) blockquote{color:#fff}
.voices--alt .vq:nth-child(even) figcaption{color:rgba(255,255,255,.75)}
.voices--alt .vq:nth-child(even) strong{color:#ffd27a}
.voices--alt .vq:nth-child(even) .ini{background:rgba(255,255,255,.16);color:#fff}
html[data-theme="burgund"] .voices--alt .vq:nth-child(even){background:#f3d5be;border-color:#f3d5be}
html[data-theme="burgund"] .voices--alt .vq:nth-child(even) blockquote,html[data-theme="burgund"] .voices--alt .vq:nth-child(even) strong{color:#4a0428}
html[data-theme="burgund"] .voices--alt .vq:nth-child(even) figcaption{color:rgba(74,4,40,.7)}
html[data-theme="burgund"] .voices--alt .vq:nth-child(even) blockquote::before{color:#c46a2a}
html[data-theme="ruhig"] .voices--alt .vq:nth-child(even){background:#fafaf8;border-left:4px solid var(--burgund);box-shadow:none}
html[data-theme="ruhig"] .voices--alt .vq:nth-child(even) blockquote{color:#1a1a1a}
html[data-theme="ruhig"] .voices--alt .vq:nth-child(even) strong{color:var(--burgund)}
html[data-theme="ruhig"] .voices--alt .vq:nth-child(even) figcaption{color:#4b5563}

/* Sprache im Kopf: schmal, mit Abstand zum Menü, die Liste rechtsbündig */
.nx-nav .nx-lang{margin-left:6px;padding-left:6px;border-left:1px solid rgba(125,8,69,.14)}
.nx-nav .nx-lang .nx-top{font-weight:600;letter-spacing:.04em;padding:11px 10px}
.nx-nav .nx-lang .nx-menu-in{min-width:180px}
html[data-theme="burgund"] .nx-nav .nx-lang{border-color:rgba(255,255,255,.16)}

/* Stimmen still (Owner 29.10.2026): drei weiße Karten nebeneinander, nichts läuft, am Handy zum Wischen */
.voices--still{padding:clamp(36px,6vw,72px) 22px clamp(18px,3vw,30px)}
.vq-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;max-width:1080px;margin:0 auto}
.vq-row .vq{width:auto;background:#fff;box-shadow:0 6px 18px rgba(46,26,74,.06)}
.vq-row .vq--user,.voices--still .vq{background:#fff}
@media (max-width:760px){
  .vq-row{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;margin:0 -22px;padding:4px 22px 14px}
  .vq-row .vq{flex:none;width:80%;scroll-snap-align:center}
}
html[data-theme="burgund"] .vq-row .vq{background:rgba(255,255,255,.07);box-shadow:none;border:1px solid rgba(255,255,255,.1)}
html[data-theme="ruhig"] .vq-row .vq{background:#fafaf8;box-shadow:none;border:1px solid #e5e7eb}

/* Die Punkte stehen unter dem Text, nicht mehr als Box über dem Telefon (Owner 29.10.2026: „das macht es
   schwieriger zu lesen“). Ein ruhiges Häkchen-Raster in zwei Spalten. */
.row-list{list-style:none;margin:18px 0 0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,max-content));gap:8px 22px;font-size:15.5px;line-height:1.35;color:var(--ink)}
.row-list li{display:flex;gap:9px;align-items:baseline}
.row-list li::before{content:"";flex:none;width:7px;height:7px;border-radius:50%;background:var(--amber);transform:translateY(-1px)}
.row-txt .row-btn{margin-top:22px}
@media (max-width:899px){.row-list{grid-template-columns:1fr 1fr;gap:8px 14px;font-size:14.5px;text-align:left}}
html[data-theme="burgund"] .row-list{color:#fbf6ef}
html[data-theme="ruhig"] .row-list li::before{background:var(--burgund)}

/* Kopf, Variante A (Owner 29.10.2026): Text frei oben mit viel Luft zur Navigation, darunter nur der Kern
   der Zeichnung (das Kind, die Eltern, bloomie). Hebt die Panorama-Regeln von .hero-c auf. */
.hero-c.hero-k{padding:clamp(28px,8vh,96px) 0 0}
.hero-c.hero-k .hero-txt{position:static;transform:none;width:auto;max-width:1080px;margin:0 auto;padding:0 22px}
.hero-c.hero-k h1{font-size:clamp(32px,3.8vw,56px);line-height:1.1;text-wrap:balance}
.hero-c.hero-k .hero-txt p{font-size:clamp(16px,1.3vw,19px);max-width:700px;margin:18px auto 26px}
.hero-c.hero-k .hero-stage{aspect-ratio:1376/768;width:min(820px,100%);margin:clamp(16px,3vh,40px) auto 0;-webkit-mask-image:none;mask-image:none}
@media (max-width:899px){.hero-c.hero-k .hero-stage{width:128vw;margin:20px 0 0 calc(50% - 64vw)}}
html[data-theme="burgund"] .hero-c.hero-k .hero-stage{-webkit-mask-image:none;mask-image:none}
.hero-c.hero-k h1 em{white-space:nowrap}

/* Der schwebende bloomie: lebendig.css kennt eine eigene Klasse .bloomie-in (Einblend-Animation) und
   eine Bildregel max-width:100 %; beide griffen auf den Knopf durch, der Hals endete mitten in der
   Scheibe statt am Rand (Owner 29.10.2026: „hängt in der Luft, soll aus dem Rand kommen“). */
#bloomie-root .bloomie-launch .bloomie-in{transform:none!important;animation:none!important;opacity:1!important;width:66px!important;height:66px!important}
#bloomie-root .bloomie-launch .bloomie-fig img{animation:none!important;max-width:none!important;width:104px!important;height:104px!important}

/* Kopf in eigener Farbe (Owner 29.10.2026: „die Top section in einer anderen Farbe wie die Sections
   darunter“): ein warmer Creme-Ton, der unten in das helle Creme der Seite übergeht. */
.hero-c.hero-k{background:linear-gradient(180deg,#fbf3ea 0%,#f8e6d8 100%);padding-bottom:0}
html[data-theme="burgund"] .hero-c.hero-k{background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.02))}
html[data-theme="ruhig"] .hero-c.hero-k{background:#fafaf8;border-bottom:1px solid #e5e7eb}

/* Stimmen: laufen langsam in einer begrenzten Breite und verschwinden an beiden Rändern (Owner 29.10.2026,
   Vorbild Logo-Leiste). Statt einer Maske liegen zwei Verläufe in der Seitenfarbe über den Rändern,
   eine Maske hat Safari an dieser Stelle die Karten abgeschnitten. Alle Karten weiß. */
.voices--fade{padding-top:clamp(28px,4vw,48px)}
.voices--fade .lane-wrap{position:relative;max-width:1180px;margin:0 auto;overflow:hidden}
.voices--fade .lane-wrap::before,.voices--fade .lane-wrap::after{content:"";position:absolute;top:0;bottom:0;width:clamp(36px,9vw,140px);z-index:2;pointer-events:none}
.voices--fade .lane-wrap::before{left:0;background:linear-gradient(90deg,var(--creme),rgba(250,250,248,0))}
.voices--fade .lane-wrap::after{right:0;background:linear-gradient(270deg,var(--creme),rgba(250,250,248,0))}
.voices--fade .lane{animation-duration:240s!important}
.voices--fade .vq--user{background:#fff;box-shadow:0 8px 22px rgba(46,26,74,.07)}
.voices--fade .vq--user blockquote{color:var(--ink);font-size:14px}
.voices--fade .vq--user figcaption{color:var(--muted)}
/* Burgund: der Seitengrund ist ein fester Verlauf, also bekommt die Leiste ein eigenes ruhiges Band, in dessen Farbe die Ränder ausblenden */
html[data-theme="burgund"] .voices--fade{background:#3d0322}
html[data-theme="burgund"] .voices--fade .lane-wrap::before{background:linear-gradient(90deg,#3d0322,rgba(61,3,34,0))}
html[data-theme="burgund"] .voices--fade .lane-wrap::after{background:linear-gradient(270deg,#3d0322,rgba(61,3,34,0))}
html[data-theme="burgund"] .voices--fade .vq--user{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.1);box-shadow:none}
html[data-theme="burgund"] .voices--fade .vq--user blockquote{color:#fbf6ef}
html[data-theme="burgund"] .voices--fade .vq--user figcaption{color:rgba(251,246,239,.74)}
html[data-theme="ruhig"] .voices--fade .lane-wrap::before{background:linear-gradient(90deg,#f0efed,rgba(240,239,237,0))}
html[data-theme="ruhig"] .voices--fade .lane-wrap::after{background:linear-gradient(270deg,#f0efed,rgba(240,239,237,0))}
html[data-theme="ruhig"] .voices--fade .vq--user{background:#fafaf8;border:1px solid #e5e7eb;border-left:1px solid #e5e7eb}

/* Unterüberschriften in Lexend, die Zierschrift nur für die großen Überschriften (Owner 29.10.2026:
   „wegen Lesbarkeit“). */
main h3{font-family:var(--sans)!important;font-weight:700;letter-spacing:-.01em}
.row h3{font-size:clamp(24px,5.6vw,34px);line-height:1.2}

/* Die Brücke über „Darauf kannst du dich verlassen“ größer (Owner 29.10.2026); die Zeichnung ist flach,
   also holen negative Ränder den leeren Himmel und Boden des quadratischen Bildes wieder herein. */
.trust-b .sec-art[data-line*="bridge"]{width:min(78vw,300px);height:min(78vw,300px);margin:-46px auto -40px}
@media (min-width:900px){.trust-b .sec-art[data-line*="bridge"]{width:380px;height:380px;margin:-64px auto -56px}}

/* Die Bereiche enger (Owner 29.10.2026: „muss man so weit scrollen“): weniger Luft um jede Zeile, das Handy
   etwas kleiner, die Zeilen greifen am Desktop leicht ineinander. */
@media (min-width:900px){
  .row{padding:6px 0 10px;gap:48px}
  .row-art{min-height:470px}
  .row-art .dev,.bloomie-dev .dev{width:236px}
  .offer .row + .row{margin-top:-10px}
}
@media (max-width:899px){.row{padding:14px 0 26px}}

/* Preise als eigener Menüpunkt ohne Untermenü, im Handy-Menü als einfacher Link (Owner 29.10.2026) */
.nx-acc-link{display:block;font:700 22px/1.2 var(--display);color:var(--burgund);padding:12px 2px;text-decoration:none;border-bottom:1px solid rgba(125,8,69,.1)}
html[data-theme="burgund"] .nx-acc-link{color:#fbf6ef;border-color:rgba(255,255,255,.1)}
/* Startseite: nur der Hinweis auf die Preise */
.price-teaser{padding-bottom:50px}
.price-teaser .dl-smart{margin-top:8px}
/* Preis-Seite: die Überschrift so groß wie sonst ein h2 */
.price-b h1{font:700 clamp(30px,7vw,48px)/1.08 var(--display);color:var(--burgund);margin:clamp(36px,7vh,80px) 0 26px;text-wrap:balance}
html[data-theme="burgund"] .price-b h1{color:#fbf6ef}

/* Mit „Preise“ ist das Menü einen Punkt länger: nichts darf umbrechen */
.nx-nav a{white-space:nowrap}
@media (min-width:900px) and (max-width:1500px){.nx-nav{gap:0}.nx-nav a{padding:11px 9px;font-size:15px}.nx-nav .nx-lang .nx-top{padding:11px 8px}}

/* Zeilen mit Zeichnung statt Handy (Pädagog*innen): die Zeichnung braucht keine Handy-Höhe (Owner 29.10.2026:
   „zu viel Abstand“) */
@media (min-width:900px){
  .row-art.row-art--line{min-height:0}
  .row-art--line canvas{width:300px}
  .offer .row:has(.row-art--line){padding:0}
  .offer .row:has(.row-art--line) + .row{margin-top:-24px}
}
.row-art--line::after{display:none}

/* ── Über uns und Team im neuen Design (Owner 29.10.2026), runde Bilder für Team und Beirat ── */
.uu .bn-container{max-width:1120px;margin:0 auto;padding:0 22px}
.uu .bn-section{padding:clamp(40px,7vw,80px) 0 10px;text-align:center}
.uu .bn-vision{background:linear-gradient(180deg,#fbf3ea 0%,#f8e6d8 100%);padding-bottom:clamp(40px,6vw,70px)}
.uu .bn-vision-icon img,.uu .bn-team-icon img{width:72px;height:72px}
.uu h1.bn-section-title{font:700 clamp(32px,4.6vw,56px)/1.08 var(--display);color:var(--burgund);margin:14px 0 18px;text-wrap:balance}
.uu h2.bn-section-title{font:700 clamp(28px,4vw,44px)/1.1 var(--display);color:var(--burgund);margin:12px 0 14px;text-wrap:balance}
.uu .bn-vision-lead{font-size:clamp(18px,1.6vw,22px);font-weight:600;color:var(--ink);max-width:700px;margin:0 auto 18px}
.uu .bn-vision-body,.uu .bn-section-body{max-width:680px;margin:0 auto;font-size:17px;line-height:1.6;color:var(--muted)}
.uu .bn-vision-body p{margin:0 0 12px}
.uu .bn-claim{font-weight:600;color:var(--burgund)}
.uu .bn-vision-cta a{display:inline-block;margin-top:10px;font-weight:600;color:var(--burgund)}
.uu .bn-team-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:20px;margin:30px 0 10px;text-align:center}
.uu .bn-team-card{background:#fff;border-radius:22px;padding:24px 20px 18px;box-shadow:0 8px 22px rgba(46,26,74,.07);display:flex;flex-direction:column;align-items:center}
.uu .bn-team-avatar{width:120px;height:120px;border-radius:50%;overflow:hidden;margin:0 auto 14px;box-shadow:0 0 0 4px #fff,0 0 0 6px var(--rose),0 10px 22px rgba(46,26,74,.14);flex:none}
.uu .bn-team-avatar img{width:100%;height:100%;object-fit:cover;border-radius:50%;display:block}
.uu .bn-team-name{font:700 16.5px/1.3 var(--sans);color:var(--ink);margin:0}
.uu .bn-team-role{font-size:14px;font-weight:600;color:var(--burgund);margin:4px 0 8px}
.uu .bn-team-tagline{font-size:14.5px;line-height:1.5;color:var(--muted);margin:0 0 10px}
.uu .bn-team-cv{margin-top:auto;width:100%;text-align:left}
.uu .bn-team-cv summary{list-style:none;cursor:pointer;text-align:center;font-size:14px;font-weight:600;color:var(--burgund)}
.uu .bn-team-cv summary::-webkit-details-marker{display:none}
.uu .bn-team-cv .less,.uu .bn-team-cv[open] .more{display:none}
.uu .bn-team-cv[open] .less{display:inline}
.uu .bn-team-bio{margin:12px 0 0;padding-left:18px;font-size:14px;line-height:1.5;color:var(--ink)}
.uu .bn-team-quote{font-size:14px;font-style:italic;color:var(--muted);margin:10px 0 0}
.uu .bn-team-link{font-size:14px;margin:8px 0 0}
.uu .bn-team-link a{color:var(--burgund);font-weight:600}
.uu .bn-team-subtitle{font:700 clamp(28px,4vw,44px)/1.1 var(--display)!important;color:var(--burgund);margin:60px 0 6px;scroll-margin-top:90px}
.uu .bn-team-grouphead{margin:34px 0 0}
.uu .bn-team-grouptitle{font:700 20px/1.25 var(--sans);color:var(--ink);margin:0}
.uu .bn-team-groupnote{font-size:15px;color:var(--muted);margin:4px 0 0}
.uu .bn-incubator-card{display:flex;gap:30px;align-items:center;text-align:left;background:#fff;border-radius:22px;padding:28px 30px;box-shadow:0 8px 22px rgba(46,26,74,.07);max-width:860px;margin:0 auto 50px}
.uu .bn-incubator-card h2.bn-section-title{font-size:clamp(24px,3vw,32px);margin-top:0}
.uu .bn-incubator-text p{color:var(--muted);line-height:1.6}
.uu .bn-incubator-text a{color:var(--burgund);font-weight:600}
@media (max-width:640px){.uu .bn-incubator-card{flex-direction:column;text-align:center}}
html[data-theme="burgund"] .uu .bn-vision{background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.02))}
html[data-theme="burgund"] .uu .bn-team-card,html[data-theme="burgund"] .uu .bn-incubator-card{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.1);box-shadow:none}
html[data-theme="burgund"] .uu h1.bn-section-title,html[data-theme="burgund"] .uu h2.bn-section-title,html[data-theme="burgund"] .uu .bn-team-subtitle,html[data-theme="burgund"] .uu .bn-vision-lead,html[data-theme="burgund"] .uu .bn-team-name,html[data-theme="burgund"] .uu .bn-team-grouptitle,html[data-theme="burgund"] .uu .bn-team-bio{color:#fbf6ef}
html[data-theme="burgund"] .uu .bn-team-role,html[data-theme="burgund"] .uu .bn-claim,html[data-theme="burgund"] .uu a,html[data-theme="burgund"] .uu .bn-team-cv summary{color:var(--amber)}
html[data-theme="burgund"] .uu .bn-team-avatar{box-shadow:0 0 0 3px #4a0428,0 0 0 5px var(--amber)}
html[data-theme="burgund"] .uu .bn-incubator-logo img{filter:brightness(0) invert(1)}
html[data-theme="ruhig"] .uu .bn-vision{background:#fafaf8;border-bottom:1px solid #e5e7eb}
html[data-theme="ruhig"] .uu .bn-team-card,html[data-theme="ruhig"] .uu .bn-incubator-card{background:#fafaf8;box-shadow:none;border:1px solid #e5e7eb}
html[data-theme="ruhig"] .uu .bn-team-avatar{box-shadow:0 0 0 3px #fafaf8,0 0 0 4px #e5e7eb}

/* „Bekannt von“ mit einfarbigen Logos der Medien (Owner 29.10.2026) */
.press-logos{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:14px 26px}
.press-logos img{display:block;width:auto!important;height:var(--h,28px)!important;max-width:none;opacity:.62;transition:opacity .2s}
.press-logos img:hover{opacity:.9}
html[data-theme="burgund"] .press-logos img{filter:brightness(0) invert(1);opacity:.7}
html[data-theme="ruhig"] .press-logos img{opacity:.5}
@media (max-width:640px){.press-logos{gap:12px 22px}.press-logos img{transform:scale(.85)}}

.uu .bn-vision-icon,.uu .bn-team-icon{display:block;width:72px;margin:0 auto}
/* Gelber Hinweis auf dunklem Grund: dunkle Schrift, weiß auf Gelb ist nicht lesbar (Owner 29.10.2026) */
html[data-theme="burgund"] .bn-price-pill{color:#2a0217!important;font-weight:700}

/* Vertrauens-Karten mit unseren Zeichnungen im Hintergrund (Owner 29.10.2026, statt der Karten mit Rand oben).
   Die Zeichnung füllt die Karte, unten liegt ein Verlauf in der Kartenfarbe, darauf der Text. */
.trust-grid.tcards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;max-width:1120px;margin:0 auto}
.trust-grid > .tcard{position:relative;overflow:hidden;aspect-ratio:4/5;border-radius:24px;background:#fbf3ea;box-shadow:0 10px 26px rgba(46,26,74,.08);text-align:left;border:0!important;padding:0!important}
.tcard::before{display:none!important}
.tcard-art{position:absolute;inset:4% 6% 34%;background:var(--burgund);-webkit-mask:var(--art) center/contain no-repeat;mask:var(--art) center/contain no-repeat;opacity:.55}
.tcard::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(251,243,234,0) 38%,rgba(251,243,234,.92) 62%,#fbf3ea 78%);pointer-events:none}
.tcard-txt{position:absolute;left:0;right:0;bottom:0;z-index:1;padding:18px 18px 20px}
.tcard-txt b{display:block;font:700 17px/1.25 var(--sans);color:var(--burgund);margin-bottom:6px}
.tcard-txt span{display:block;font-size:14.5px;line-height:1.45;color:var(--ink)}
.tcard-txt a{color:var(--burgund);font-weight:600}
@media (max-width:899px){.trust-grid.tcards{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.trust-grid > .tcard{aspect-ratio:3/4}.tcard-txt{padding:12px 12px 14px}.tcard-txt b{font-size:15px}.tcard-txt span{font-size:13px}}
html[data-theme="burgund"] .trust-grid > .tcard{background:#4a0428;box-shadow:none;border:1px solid rgba(255,255,255,.1)!important}
html[data-theme="burgund"] .tcard-art{background:#fde7d4;opacity:.42}
html[data-theme="burgund"] .tcard::after{background:linear-gradient(180deg,rgba(74,4,40,0) 38%,rgba(74,4,40,.92) 62%,#4a0428 78%)}
html[data-theme="burgund"] .tcard-txt b,html[data-theme="burgund"] .tcard-txt a{color:var(--amber)}
html[data-theme="burgund"] .tcard-txt span{color:#fbf6ef}
html[data-theme="ruhig"] .trust-grid > .tcard{background:#fafaf8;box-shadow:none;border:1px solid #e5e7eb!important}
html[data-theme="ruhig"] .tcard::after{background:linear-gradient(180deg,rgba(250,250,248,0) 38%,rgba(250,250,248,.94) 62%,#fafaf8 78%)}
html[data-theme="ruhig"] .tcard-art{opacity:.4}
/* Handy: eine Karte pro Zeile, die Zeichnung rechts, der Text links auf einem seitlichen Verlauf */
@media (max-width:640px){
  .trust-grid.tcards{grid-template-columns:1fr;gap:12px}
  .trust-grid > .tcard{aspect-ratio:auto;min-height:150px}
  .tcard-art{inset:10% 4% 10% 52%}
  .tcard::after{background:linear-gradient(90deg,#fbf3ea 45%,rgba(251,243,234,.85) 58%,rgba(251,243,234,0) 78%)}
  html[data-theme="burgund"] .tcard::after{background:linear-gradient(90deg,#4a0428 45%,rgba(74,4,40,.85) 58%,rgba(74,4,40,0) 78%)}
  html[data-theme="ruhig"] .tcard::after{background:linear-gradient(90deg,#fafaf8 45%,rgba(250,250,248,.88) 58%,rgba(250,250,248,0) 78%)}
  .tcard-txt{position:relative;right:auto;width:62%;padding:18px 0 18px 18px}
  .tcard-txt b{font-size:16px}.tcard-txt span{font-size:14px}
}
/* Pfeile im Menü dezenter (Owner 29.10.2026) */
.nx-nav .nx-chev{width:9px;height:9px;opacity:.38;margin-left:1px}
.nx-dd:hover .nx-chev,.nx-dd:focus-within .nx-chev{opacity:.7}
/* Logo oben etwas größer (Owner 29.10.2026) */
.nx-head .pv-logo{font-size:32px}
.nx-head .pv-logo img{width:44px;height:44px}
@media (max-width:520px){.nx-head .pv-logo{font-size:24px}.nx-head .pv-logo img{width:32px;height:32px}}

/* Kopf: die Zeichnung links, der Startbildschirm der App groß und still rechts daneben, darunter die
   Auszeichnung (Owner 29.10.2026) */
.hero-pair{display:flex;flex-direction:column;align-items:center}
.hero-c.hero-k .hero-pair .hero-stage{margin-top:clamp(16px,3vh,36px)}
.hero-phone.row-art{min-height:0;padding:10px 0 24px}
.hero-phone .dev{width:min(62vw,250px)!important}
.hero-award{display:flex;justify-content:center;padding:18px 22px clamp(26px,4vw,40px)}
@media (min-width:900px){
  .hero-pair{flex-direction:row;justify-content:center;gap:clamp(10px,2vw,40px);max-width:1240px;margin:0 auto;padding:0 22px}
  .hero-c.hero-k .hero-pair .hero-stage{width:min(760px,62%);margin:clamp(12px,2vh,28px) 0 0}
  .hero-phone.row-art{padding:0;align-self:flex-end;margin-bottom:-8px}
  .hero-phone .dev{width:min(22vw,290px)!important}
}
/* weniger Luft über den Zitaten */
.voices--fade{padding-top:8px}
.press{padding-top:10px}
@media (max-width:899px){.hero-phone{display:none}}

/* Zeilen ruhiger: zwei Schriftarten statt drei, die Punkte sehen aus wie der Text darüber (Owner 29.10.2026) */
.row-list{font-size:16px;color:var(--muted);font-weight:400}
.row-list li::before{width:5px;height:5px;opacity:.8}
html[data-theme="burgund"] .row-list{color:rgba(251,246,239,.74)}
/* Die Überschriften der Vertrauens-Karten auf einer Höhe (Owner 29.10.2026) */
@media (min-width:641px){.tcard-txt{top:54%;bottom:auto}}
/* Das größere Logo darf das Menü nie überdecken */
.nx-head .pv-logo{flex:none;margin-right:18px}

/* EDISON unter dem Bild, ohne Rahmen (Owner 29.10.2026) */
.award{display:inline-flex;align-items:center;gap:12px;text-decoration:none;color:var(--ink)}
.award-cup{width:60px;height:60px;flex:none}
.award-txt{display:flex;flex-direction:column;align-items:flex-start;gap:4px;text-align:left}
.award-logo{display:block;height:26px;width:auto}
.award-sub{font-size:14px;color:var(--muted);line-height:1.35}
.award-sub b{color:var(--burgund);font-weight:700}
html[data-theme="burgund"] .award-logo{filter:brightness(0) invert(1)}
html[data-theme="burgund"] .award-sub b{color:var(--amber)}
@media (max-width:520px){.award-cup{width:48px;height:48px}.award-logo{height:22px}.award-sub{font-size:13px}}

/* Burgund: „Mehr erfahren“ auf der Team-Seite in Gold, sonst nicht lesbar (Owner 29.10.2026) */
html[data-theme="burgund"] .uu .bn-team-cv summary,html[data-theme="burgund"] .uu .bn-team-cv summary span{color:var(--amber)!important;border-color:var(--amber)!important;text-decoration-color:var(--amber)}

/* ⛔ Regel (Owner 29.10.2026, gilt für alle Seiten der neuen Website): Unterüberschriften und die Titel in
   Boxen und Karten stehen in der Textschrift (Lexend). Die Zierschrift (BauhausBugler) trägt nur die großen
   Überschriften (h1, h2) und das Logo. */
main :is(h3,h4,h5,h6,dt,summary,th,.trust-grid b,.tcard-txt b,.vq strong,.plan h3,.step b,.steps b){font-family:var(--sans)!important;letter-spacing:0}
.uu .bn-team-subtitle{font-family:var(--display)!important}

/* Soziale Bestätigung über der Überschrift (Owner 29.10.2026), Avatare aus unserer Zeichnung */
.proof{display:inline-flex;align-items:center;gap:10px;margin:0 0 14px;font-size:15px;font-weight:600;color:var(--ink)}
.proof-av{display:flex}
.proof-av img{width:36px;height:36px;border-radius:50%;object-fit:cover;background:#fff;box-shadow:0 0 0 2.5px #fbf3ea;margin-left:-10px}
.proof-av img:first-child{margin-left:0}
html[data-theme="burgund"] .proof{color:#fbf6ef}
html[data-theme="burgund"] .proof-av img{box-shadow:0 0 0 2.5px #4a0428}

/* Gleiche Abstände um das Video (Owner 29.10.2026) */
.film{padding:clamp(36px,5vw,64px) 22px clamp(36px,5vw,64px)!important;margin:0!important}
.trust-b{padding-bottom:0!important}
@media (min-width:1100px){
  .hero-c.hero-k h1{font-size:clamp(30px,2.9vw,46px)}
  .hero-c.hero-k .hero-txt p:not(.proof){font-size:16px;line-height:1.55;max-width:560px;margin:12px 0 18px}
  .hero-c.hero-k .award-cup{width:44px;height:44px}
  .hero-c.hero-k .award-logo{height:22px}
  .hero-c.hero-k .hero-award{padding:2px 0 8px}
  .voices--fade .vq{width:330px}
  .voices--fade .vq blockquote{font-size:13px}
  .proof{margin-bottom:10px}
}
@media (min-width:1100px) and (max-height:820px){
  .hero-c.hero-k{padding-top:10px}
  .hero-c.hero-k h1{font-size:clamp(28px,2.5vw,38px)}
  .hero-c.hero-k .hero-pair .hero-stage{height:min(36vh,320px)}
  .voices--fade .vq{width:360px}
}

/* Kopf am Desktop (Owner 29.10.2026, zweiter Versuch): Text mittig oben, die Zeichnung mittig darunter,
   das Handy rechts daneben; alles bis zu den Logos auf dem ersten Bildschirm. */
.proof{font-size:13.5px;gap:8px;margin-bottom:8px}
.proof-av img{width:28px;height:28px;margin-left:-8px}
@media (min-width:1100px){
  .hero-c.hero-k{padding:clamp(10px,2.5vh,32px) 0 0}
  .hero-c.hero-k .hero-txt{max-width:900px}
  .hero-c.hero-k .hero-txt p:not(.proof){font-size:16px;line-height:1.5;max-width:720px;margin:10px auto 14px}
  .hero-c.hero-k .hero-pair{position:relative;max-width:1240px;margin:0 auto;padding:0 22px;display:block}
  .hero-c.hero-k .hero-pair .hero-stage{height:clamp(220px,33vh,330px);width:auto;aspect-ratio:1376/768;margin:4px auto 0}
  .hero-c.hero-k .hero-phone{position:absolute;right:max(22px,calc(50% - 600px));bottom:-6px;padding:0}
  .hero-c.hero-k .hero-phone .dev{width:clamp(130px,11vw,190px)!important}
  .hero-c.hero-k .hero-award{padding:2px 0 8px}
  .voices--fade{padding-top:6px;padding-bottom:4px}
  .voices--fade .vq{width:340px;padding:12px 14px 10px;gap:8px}
  .voices--fade .vq blockquote{font-size:13px;line-height:1.4;padding-top:12px}
  .press{padding:6px 0 12px}
}
@media (min-width:1100px) and (max-height:820px){
  .hero-c.hero-k h1{font-size:clamp(28px,2.5vw,38px)}
  .hero-c.hero-k .hero-pair .hero-stage{height:clamp(200px,30vh,280px)}
}
/* Erster Bildschirm bis zu den Logos (Owner 29.10.2026): Überschrift in einer Zeile, Absatz breiter, Zeichnung flacher */
@media (min-width:1100px){
  .hero-c.hero-k{padding-top:16px}
  .hero-c.hero-k .hero-txt{max-width:1240px}
  .hero-c.hero-k h1{font-size:clamp(30px,2.6vw,44px);white-space:nowrap}
  .proof{margin-bottom:4px}
  .hero-c.hero-k .hero-txt p:not(.proof){max-width:900px;margin:8px auto 12px}
  .hero-c.hero-k .hero-pair .hero-stage{height:clamp(200px,27vh,300px)}
  .hero-c.hero-k .hero-award{padding:0 0 6px}
  .voices--fade .vq{min-height:0}
  .voices--fade .vq blockquote{display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
}
@media (min-width:1100px) and (max-height:820px){
  .hero-c.hero-k h1{font-size:clamp(28px,2.4vw,36px)}
  .hero-c.hero-k .hero-pair .hero-stage{height:clamp(180px,25vh,240px)}
}

/* Kopf, dritte Fassung (Owner 29.10.2026, Vorbild shadowmap): links Text und darunter mittig die Zeichnung,
   rechts direkt daneben groß das Handy, oben bündig mit dem Text. Die Nutzerzeile klein. */
.proof{font-size:13px;font-weight:500;gap:7px;margin-bottom:6px}
.proof-av img{width:24px;height:24px;margin-left:-7px;box-shadow:0 0 0 2px #fbf3ea}
@media (min-width:1100px){
  .hero-c.hero-k{display:grid;grid-template-columns:minmax(0,820px) auto;grid-template-areas:"txt phone" "stage phone" "award award";
    justify-content:center;column-gap:clamp(24px,3vw,56px);padding:clamp(14px,2.5vh,30px) 32px 0}
  .hero-c.hero-k .hero-txt{grid-area:txt;max-width:none;margin:0;padding:0}
  .hero-c.hero-k h1{white-space:normal;font-size:clamp(30px,2.7vw,46px)}
  .hero-c.hero-k .hero-txt p:not(.proof){max-width:680px}
  .hero-c.hero-k .hero-pair{display:contents}
  .hero-c.hero-k .hero-pair .hero-stage{grid-area:stage;justify-self:center;margin:6px 0 0}
  .hero-c.hero-k .hero-phone{grid-area:phone;position:static;align-self:start;padding:0}
  .hero-c.hero-k .hero-phone .dev{width:clamp(200px,15vw,270px)!important}
  .hero-c.hero-k .hero-award{grid-area:award}
}
@media (min-width:1100px) and (max-height:820px){
  .hero-c.hero-k .hero-phone .dev{width:clamp(180px,13vw,220px)!important}
}
.press{display:flex;flex-direction:column;align-items:center;gap:10px}
.press .award{gap:10px}
.press .award-cup{width:40px;height:40px}
.press .award-logo{height:22px}
.press .award-sub{font-size:14px}
@media (min-width:1100px){
  .hero-c.hero-k{padding-top:10px!important}
  .hero-c.hero-k .hero-txt{padding-top:0!important}
  .hero-c.hero-k .proof{margin-top:0}
  .hero-c.hero-k .hero-get{margin-bottom:0}
  .hero-c.hero-k .hero-pair .hero-stage{height:clamp(170px,23vh,260px);margin-top:0}
  .voices--fade .vq blockquote{-webkit-line-clamp:3}
  .voices--fade{padding-bottom:0}
  .press{gap:6px;padding:8px 0 10px}
}
@media (min-width:1100px) and (max-height:820px){
  .hero-c.hero-k .hero-pair .hero-stage{height:clamp(150px,21vh,200px)}
  .hero-c.hero-k h1{font-size:clamp(28px,2.4vw,36px)}
}
@media (min-width:1100px){
  .hero-c.hero-k h1{margin-top:4px}
  .hero-c.hero-k .hero-pair .hero-stage{margin-top:-10px}
  .voices--fade{padding-top:0}
}
@media (min-width:1100px) and (max-height:920px){
  .hero-c.hero-k .hero-pair .hero-stage{height:clamp(150px,20vh,190px)}
  .voices--fade .vq{padding:10px 14px 8px}
  .voices--fade .vq blockquote{-webkit-line-clamp:2}
}
/* Luft über und unter „Damit jedes Kind aufblühen kann.“ (Owner 29.10.2026) */
.press{padding-bottom:28px!important}
.offer > h2{margin-bottom:clamp(24px,3vw,44px)}
@media (min-width:1100px) and (max-height:780px){
  .hero-c.hero-k .hero-pair .hero-stage{height:150px}
  .hero-c.hero-k .hero-txt p:not(.proof){font-size:15px;margin:6px auto 10px}
}
@media (min-width:1100px) and (max-height:780px){.hero-c.hero-k .hero-pair .hero-stage{height:140px}}
/* Die Nutzerzeile wirklich klein: die Absatzregeln des Kopfs griffen auch auf sie (Owner 29.10.2026) */
.hero-c .hero-txt p.proof{font-size:12px!important;font-weight:500;line-height:1.2;margin:0 auto 8px!important;color:var(--muted);letter-spacing:.01em}
.hero-c .hero-txt p.proof .proof-av img{width:20px;height:20px;margin-left:-6px}
.hero-c .hero-txt p.proof .proof-av img:first-child{margin-left:0}
/* Weniger gedrängt, Bild größer, Nutzerzeile noch kleiner (Owner 29.10.2026). Die Zeichnung nimmt sich die
   Höhe, die bis zu den Logos übrig bleibt. */
.hero-c .hero-txt p.proof{font-size:11px!important;margin-bottom:12px!important}
.hero-c .hero-txt p.proof .proof-av img{width:18px;height:18px}
@media (min-width:1100px){
  .hero-c.hero-k{padding-top:clamp(18px,3.5vh,40px)!important}
  .hero-c.hero-k h1{margin-top:0;margin-bottom:6px}
  .hero-c.hero-k .hero-txt p:not(.proof){margin:12px auto 20px!important}
  .hero-c.hero-k .hero-pair .hero-stage{height:calc(100vh - 610px)!important;min-height:180px;max-height:420px;margin-top:6px}
}
@media (min-width:1100px) and (max-height:820px){
  .hero-c.hero-k .hero-pair .hero-stage{height:calc(100vh - 560px)!important;min-height:170px}
}
@media (min-width:1100px){.hero-c.hero-k .hero-pair .hero-stage{height:calc(100vh - 700px)!important}}
@media (min-width:1100px) and (max-height:820px){.hero-c.hero-k .hero-pair .hero-stage{height:calc(100vh - 650px)!important;min-height:120px}}
/* Luft zwischen EDISON und den Logos */
.press{gap:16px!important}
@media (min-width:1100px){.hero-c.hero-k .hero-pair .hero-stage{min-height:150px!important;max-height:340px!important}}
@media (min-width:1100px) and (max-height:780px){.hero-c.hero-k .hero-pair .hero-stage{min-height:120px!important}.hero-c.hero-k{padding-top:14px!important}}
.hero-phone .dev-screen{image-rendering:auto;-webkit-backface-visibility:hidden;backface-visibility:hidden}
/* Mehr Luft zwischen Überschrift und Text, Überschrift größer (Owner 29.10.2026) */
@media (min-width:1100px){
  .hero-c.hero-k h1{font-size:clamp(34px,3.1vw,54px);margin-bottom:0}
  .hero-c.hero-k .hero-txt p:not(.proof){margin:24px auto 28px!important}
  .hero-c .hero-txt p.proof{margin-bottom:18px!important}
  .hero-c.hero-k .hero-pair .hero-stage{height:calc(100vh - 770px)!important}
}
@media (min-width:1100px) and (max-height:820px){
  .hero-c.hero-k h1{font-size:clamp(30px,2.7vw,42px)}
  .hero-c.hero-k .hero-txt p:not(.proof){margin:16px auto 20px!important}
  .hero-c.hero-k .hero-pair .hero-stage{height:calc(100vh - 690px)!important}
}
@media (min-width:1100px){.hero-c.hero-k .hero-pair .hero-stage{margin-top:4px!important;min-height:0!important;max-height:none!important}.voices--fade{margin-top:-10px}}
@media (min-width:1100px){
  .hero-c.hero-k .hero-get{margin-bottom:-16px}
  .voices--fade{margin-top:-18px}
  .press{padding-top:4px!important;gap:12px!important}
}
@media (min-width:1100px) and (max-height:920px){
  .voices--fade .vq{padding:8px 12px 6px;gap:4px}
  .voices--fade .vq blockquote{padding-top:10px;font-size:12.5px}
  .voices--fade .vq figcaption{font-size:11px}
  .voices--fade .vq figcaption img,.voices--fade .vq .ini{width:24px;height:24px}
}
/* Handy mittig im beigen Kopf und eine Spur größer, mehr Luft zwischen EDISON und Logos (Owner 29.10.2026) */
@media (min-width:1100px){
  .hero-c.hero-k .hero-phone{align-self:center!important;padding:0 0 18px}
  .hero-c.hero-k .hero-phone .dev{width:clamp(220px,16.5vw,300px)!important}
  .press{gap:20px!important}
}
@media (min-width:1100px) and (max-height:820px){.hero-c.hero-k .hero-phone .dev{width:clamp(190px,14vw,240px)!important}}
/* Die Stimmen nicht in den beigen Kopf schieben: dort malten die Rand-Verläufe helle Kästen (Owner 29.10.2026) */
@media (min-width:1100px){
  .voices--fade{margin-top:0!important;padding-top:10px!important}
  .hero-c.hero-k .hero-phone .dev{width:min(clamp(220px,16.5vw,300px),calc((100vh - 330px) * .46))!important}
}
/* bloomie: drei Beispielfragen */
.bubbles{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.bubbles .bubble{margin:0}
/* Preis-Seite: mehr Luft und eine Zeichnung über der Überschrift (Owner 29.10.2026) */
.price-b .sec-art{width:150px;height:150px;margin:clamp(30px,6vh,64px) auto 0;display:block}
.price-b h1{margin-top:6px!important}
.price-b > p{margin-bottom:22px}
.price-b .bn-price-pill{margin:6px 0 36px}
.price-b{padding-bottom:clamp(50px,8vh,100px)}
.hero-c .hero-txt p.proof{font-size:12px!important}

/* Seitenwechsel ohne Flackern der Navigation (Owner 29.10.2026): Kopfzeile und Farbleiste bleiben stehen, nur
   der Inhalt blendet über. Chrome, Edge und Safari ab 18.2; andere Browser laden wie bisher. */
@view-transition{navigation:auto}
.pv-switch{view-transition-name:pv-bar}
.nx-head{view-transition-name:nx-head}
::view-transition-old(root),::view-transition-new(root){animation-duration:.18s}
::view-transition-group(nx-head),::view-transition-group(pv-bar){animation:none}
@media (prefers-reduced-motion:reduce){@view-transition{navigation:none}}

/* Handy (Owner 29.10.2026, auf dem iPhone geprüft): weniger Leerraum oben, und die Stimmen als ruhige
   Wisch-Reihe statt laufender Leiste; die laufende 3D-Leiste hat Safari am Handy teils leer gemalt. */
@media (max-width:1099px){
  .hero-c.hero-k{padding-top:16px!important}
  .hero-c .hero-txt p.proof{margin-bottom:10px!important}
  .hero-c.hero-k .hero-pair .hero-stage{margin-top:8px}
  .voices--fade .lane-wrap::before,.voices--fade .lane-wrap::after{display:none}
  .voices--fade .lane-wrap{overflow:visible}
  .voices--fade .lane{animation:none!important;transform:none!important;will-change:auto;width:auto;display:flex;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;padding:6px 20px 12px;scrollbar-width:none}
  .voices--fade .lane::-webkit-scrollbar{display:none}
  .voices--fade .lane .vq{scroll-snap-align:center;width:78vw}
  .voices--fade .lane .vq[aria-hidden="true"]{display:none}
  .voices--fade .vq blockquote{-webkit-line-clamp:5}
  .press .award{flex-wrap:wrap;justify-content:center;text-align:center;padding:0 16px}
}
/* „außer-gewöhnliche Kinder“ in einer Zeile (Owner 29.10.2026) */
@media (min-width:600px){h1 .nb{white-space:nowrap}}
/* Feinschliff Abstände (Owner 29.10.2026): unter der Nutzerzeile weniger, zwischen Stimmen und EDISON mehr */
.hero-c .hero-txt p.proof{margin-bottom:8px!important}
.press{padding-top:16px!important}
/* etwas mehr Luft über den Stimmen (Owner 29.10.2026) */
.voices--fade{padding-top:18px!important}

/* ═══════════════════════════════════════════════════════════════════════════════════════════════
   Design-System der neuen Website (Owner 29.10.2026: „Etabliere Standard-Design-Elemente für Boxen,
   Schriften etc. anhand dessen, was wir auf der Startseite gemacht haben“). Gilt für jede Seite mit
   <main class="ns">, also alle Seiten, die scripts/build-vorschau-seiten.py aus den Live-Seiten baut.
   Die Regeln:
   1 Schrift  h1 und h2 in der Zierschrift, Burgund; alles darunter (h3 bis h6, Box-Titel) Lexend Bold.
              Fließtext Lexend 17 px, Zeilenhöhe 1.6, gedämpft; Lesebreite höchstens 720 px.
   2 Kopf     der erste Abschnitt einer Seite steht auf dem warmen Creme-Verlauf wie der Startseiten-Kopf.
   3 Karte    weiß, Radius 22, weicher Schatten, kein Rand, kein farbiger Balken.
   4 Box      ein Hinweis oder eine Zusammenfassung steht auf warmem Creme, Radius 22, ohne Rand.
   5 Knopf    Pille in Burgund, weiße Schrift; der zweite Knopf ist eine Pille mit Rand.
   6 Link     Burgund, dünn unterstrichen.
   7 Formular Felder mit Radius 14, ruhiger Rand, Fokus in Burgund.
   8 Ruhe     keine Kicker-Zeilen über Überschriften, keine Schmuck-Unterstreichungen.
   ═══════════════════════════════════════════════════════════════════════════════════════════════ */
.ns{--ns-w:1080px;--ns-read:720px;--ns-card:#fff;--ns-box:#fbf3ea;--ns-line:rgba(125,8,69,.12);
  font-family:var(--sans);color:var(--ink);background:var(--creme);overflow-x:clip}
.ns *{box-sizing:border-box}
/* 1 Schrift */
.ns h1{font:700 clamp(32px,4.4vw,54px)/1.1 var(--display)!important;color:var(--burgund)!important;letter-spacing:0!important;text-wrap:balance;margin:0 0 18px}
.ns h2{font:700 clamp(26px,3.2vw,40px)/1.12 var(--display)!important;color:var(--burgund)!important;letter-spacing:0!important;text-wrap:balance;margin:40px 0 14px}
.ns :is(h3,h4,h5,h6){font-family:var(--sans)!important;font-weight:700!important;color:var(--ink)!important;letter-spacing:0!important;line-height:1.3}
.ns h3{font-size:clamp(18px,1.6vw,22px)!important;margin:28px 0 8px}
.ns h4{font-size:17px!important;margin:20px 0 6px}
.ns :is(p,li,dd,td){font-size:17px;line-height:1.6}
.ns p{color:var(--muted)}
.ns :is(strong,b){color:var(--ink)}
/* Lesebreite für Fließtext-Seiten */
.ns :is(.bn-container,.seo-wrap,.bn-legal,article,.bn-mf-inner){max-width:var(--ns-w);margin-left:auto;margin-right:auto}
.ns-hilfen,.ns-datenschutz,.ns-agb,.ns-impressum,.ns-manifest{--ns-w:820px}
.ns > *{padding-left:22px;padding-right:22px}
/* 2 Kopf */
.ns > :first-child{background:linear-gradient(180deg,#fbf3ea 0%,#f8e6d8 100%);padding-top:clamp(36px,6vh,72px)!important;padding-bottom:clamp(28px,5vh,56px)!important;margin-top:0!important;border:0!important}
.ns > :first-child :is(h1,h2):first-of-type{margin-top:0}
/* 3 Karte */
.ns :is([class*="card"]:not([class*="card-"]),.bn-pr-clip,.seo-faq-item,details,.bn-mf-card,.bn-team-card,.bn-account-card,.expert,.bn-expert){
  background:var(--ns-card)!important;border:0!important;border-radius:22px!important;box-shadow:0 8px 24px rgba(46,26,74,.07)!important}
.ns :is([class*="card"]:not([class*="card-"]))::before{display:none}
.ns details{padding:4px 20px;margin:10px 0}
.ns details summary{font-weight:600;color:var(--ink);padding:14px 0;cursor:pointer}
/* 4 Box */
.ns :is(.seo-tldr,.bn-legal-summary,.seo-box,.bn-callout,blockquote,.bn-mf-muted,.bn-account-note,[class*="summary"]:not(summary):not(.bn-team-cv)){
  background:var(--ns-box)!important;border:0!important;border-radius:22px!important;padding:20px 24px!important;box-shadow:none!important}
.ns blockquote{margin:22px 0;font-size:18px;color:var(--ink)}
/* 5 Knopf */
.ns :is(.bn-btn,.btn,button[type="submit"],input[type="submit"],.bn-cta,[class*="-btn"]:not(.seo-share-btn):not(.nz-btn)){
  display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:0 22px!important;border-radius:999px!important;
  background:var(--burgund)!important;color:#fff!important;border:0!important;font:600 15px/1 var(--sans)!important;text-decoration:none!important;box-shadow:none!important;cursor:pointer}
.ns :is(.bn-btn-secondary,.btn-secondary,.bn-btn--ghost){background:transparent!important;color:var(--burgund)!important;box-shadow:inset 0 0 0 1.5px var(--burgund)!important}
/* 6 Link */
.ns a:not([class]){color:var(--burgund);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
/* 7 Formular */
.ns :is(input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]),select,textarea){
  font:400 16px/1.4 var(--sans);color:var(--ink);background:#fff;border:1px solid rgba(46,26,74,.18);border-radius:14px;padding:12px 14px;max-width:100%}
.ns :is(input,select,textarea):focus{outline:2px solid var(--burgund);outline-offset:1px;border-color:transparent}
.ns label{font-size:14px;font-weight:600;color:var(--ink)}
/* 8 Ruhe */
.ns :is([class*="eyebrow"],[class*="kicker"],[class*="overline"]){display:none!important}
.ns :is(h1,h2,h3)::after{display:none!important}
.ns img{max-width:100%;height:auto}
/* Burgund und Ruhig */
html[data-theme="burgund"] .ns{--ns-card:rgba(255,255,255,.07);--ns-box:rgba(255,255,255,.06);background:transparent;color:#fbf6ef}
html[data-theme="burgund"] .ns :is(h1,h2){color:#fbf6ef!important}
html[data-theme="burgund"] .ns :is(h3,h4,h5,h6,strong,b,label,details summary,blockquote){color:#fbf6ef!important}
html[data-theme="burgund"] .ns :is(p,li,dd,td){color:rgba(251,246,239,.8)}
html[data-theme="burgund"] .ns > :first-child{background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.02))}
html[data-theme="burgund"] .ns a:not([class]){color:var(--amber)}
html[data-theme="burgund"] .ns :is([class*="card"]:not([class*="card-"]),.bn-pr-clip,.seo-faq-item,details,.bn-mf-card,.bn-account-card){box-shadow:none!important;outline:1px solid rgba(255,255,255,.1)}
html[data-theme="burgund"] .ns :is(.bn-btn,.btn,button[type="submit"],input[type="submit"],.bn-cta,[class*="-btn"]:not(.seo-share-btn):not(.nz-btn)){background:var(--amber)!important;color:#2a0217!important}
html[data-theme="ruhig"] .ns{--ns-card:#fafaf8;--ns-box:#f0efed}
html[data-theme="ruhig"] .ns > :first-child{background:#fafaf8;border-bottom:1px solid #e5e7eb!important}
html[data-theme="ruhig"] .ns :is([class*="card"]:not([class*="card-"]),.bn-pr-clip,.seo-faq-item,details,.bn-mf-card,.bn-account-card){box-shadow:none!important;outline:1px solid #e5e7eb}
/* Titel in Karten sind Unterüberschriften: Lexend, nicht die Zierschrift (Regel 1) */
.ns :is([class*="card"],.bn-pr-clip,.expert) :is(h1,h2,h3,h4){font:700 18px/1.3 var(--sans)!important;color:var(--ink)!important;margin:10px 0 6px!important;text-wrap:pretty}
.ns :is(h1,h2,h3,h4) a{color:inherit!important;text-decoration:none!important}
html[data-theme="burgund"] .ns :is([class*="card"],.bn-pr-clip,.expert) :is(h1,h2,h3,h4){color:#fbf6ef!important}
/* Formulare untereinander, ruhig (Kontakt, Bewerbung, Widerruf) */
.ns form{display:grid;gap:12px;max-width:620px}
.ns form :is(label,input,select,textarea,button){width:100%}
.ns form :is(input[type="checkbox"],input[type="radio"]){width:auto}
/* Handy im Kopf schärfer (Owner 29.10.2026): kein Schatten-Filter auf dem 3D-Element (der zwingt den Browser,
   es als unscharfes Bild zu drehen), der Schatten als box-shadow, und eine sanftere Drehung. */
@media (min-width:1100px){
  .hero-k .hero-phone .dev{filter:none!important;box-shadow:-18px 30px 50px rgba(46,26,74,.22),0 4px 10px rgba(0,0,0,.12)!important;
    transform:perspective(1600px) rotateY(-12deg) rotateX(4deg) rotateZ(2deg)!important}
  .hero-k .hero-phone .dev-screen{image-rendering:-webkit-optimize-contrast}
}

/* Der zweite Knopf im Kopf: Tipps in der Nähe, leiser als „App laden“ */
.nx-tipps{display:inline-flex;align-items:center;gap:7px;margin-left:auto;height:44px;padding:0 16px 0 13px;border:1.5px solid rgba(125,8,69,.32);border-radius:999px;font:600 15px/1 var(--sans);color:var(--burgund);text-decoration:none;white-space:nowrap;transition:border-color .2s,background .2s}
.nx-tipps svg{width:18px;height:18px}
.nx-tipps:hover,.nx-tipps[aria-current]{border-color:var(--burgund);background:rgba(125,8,69,.06)}
.nx-tipps+.nx-get{margin-left:8px}
.nx-tipps-s{display:none}
@media (min-width:1180px){.nx-tipps{margin-left:12px}}
@media (min-width:1360px){.nx-head-in{max-width:1320px}}
@media (min-width:1180px) and (max-width:1300px){.nx-head-in{gap:12px}}
@media (max-width:1499px) and (min-width:1180px){.nx-tipps{width:44px;padding:0;justify-content:center;flex-shrink:0}.nx-tipps span{display:none!important}}
/* Am Handy nur die Nadel, sonst passt der Kopf nicht in 390 px; der Musik-Knopf weicht unter 440 px ganz */
@media (max-width:520px){.nx-tipps{width:40px;height:40px;padding:0;justify-content:center;flex-shrink:0}.nx-tipps span{display:none!important}.nx-tipps svg{width:20px;height:20px}.nx-tipps+.nx-get{margin-left:0}.nx-burger{flex-shrink:0;width:40px}}
@media (max-width:440px){.nx-head-in .bn-song.in-head{display:none}.nx-head-in{gap:8px;padding:10px 12px}}
@media (max-width:374px){.nx-head .pv-logo{font-size:21px}.nx-head .pv-logo img{width:28px;height:28px;margin-right:5px}.nx-get{padding:10px 12px}}
html[data-theme="burgund"] .nx-tipps{color:#fde7d4;border-color:rgba(253,231,212,.4)}
html[data-theme="burgund"] .nx-tipps:hover,html[data-theme="burgund"] .nx-tipps[aria-current]{border-color:#fde7d4;background:rgba(253,231,212,.08)}

/* Anmelden in der Kopfzeile (Owner 30.10.2026: „dezent Login in der Nav“). Ein Eintrag wie „DE“,
   hinter demselben Trennstrich, kein dritter Knopf neben Tipps und App laden. Zwischen 1180 und
   1499 px nur die Figur, unter 1180 px steht es im Menü. */
.nx-nav .nx-login{gap:7px;font-weight:600;font-size:14.5px;color:var(--muted);padding:11px 10px}
.nx-nav .nx-login:hover,.nx-nav .nx-login[aria-current]{color:var(--burgund)}
.nx-person{width:18px;height:18px;flex-shrink:0}
@media (max-width:1499px) and (min-width:1180px){.nx-nav .nx-login{padding:11px 8px}.nx-login-l{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}}
.nx-drawer .nx-acc-login{display:flex;align-items:center;gap:10px;font:600 17px/1.2 var(--sans);color:var(--muted);border-bottom:0;padding-top:16px}
.nx-drawer .nx-acc-login .nx-person{width:20px;height:20px}
html[data-theme="burgund"] .nx-nav .nx-login,html[data-theme="burgund"] .nx-drawer .nx-acc-login{color:rgba(251,246,239,.78)}
html[data-theme="burgund"] .nx-nav .nx-login:hover{color:#fbf6ef}

/* Die Anmeldeseite */
.login{min-height:62vh;display:grid;place-items:center;padding:56px 18px 80px}
.login-card{width:min(100%,440px);background:#fff;border:1px solid rgba(125,8,69,.12);border-radius:24px;padding:34px 28px 30px;box-shadow:0 18px 50px rgba(125,8,69,.08)}
.login-card h1{font:700 clamp(30px,6vw,40px)/1.1 var(--display);color:var(--burgund);margin:0 0 12px}
.login-step{display:grid;gap:14px}
.login-step[hidden],.login-msg[hidden]{display:none}
.login-lead{margin:0;font-size:16.5px;line-height:1.55;color:var(--ink)}
.login-note{margin:0;font-size:15.5px;line-height:1.55;color:var(--muted)}
.login-field{display:grid;gap:6px;font:600 14px/1.2 var(--sans);color:var(--ink)}
.login-field input{font:400 17px/1.3 var(--sans);padding:13px 14px;border:1.5px solid rgba(125,8,69,.25);border-radius:14px;background:#fff;color:var(--ink)}
.login-field input:focus{outline:none;border-color:var(--burgund);box-shadow:0 0 0 3px rgba(125,8,69,.12)}
.login-step .dl-smart{justify-content:center;border:0;cursor:pointer;font-family:var(--sans)}
.login-back{justify-self:start;background:none;border:0;padding:4px 0;font:600 14.5px/1.2 var(--sans);color:var(--burgund);cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.login-msg{margin:0;font-size:15px;color:var(--burgund);font-weight:600}
html[data-theme="burgund"] .login-card{background:rgba(255,255,255,.06);border-color:rgba(253,231,212,.2);box-shadow:none}
html[data-theme="burgund"] .login-card h1,html[data-theme="burgund"] .login-back,html[data-theme="burgund"] .login-msg{color:#fde7d4}
html[data-theme="burgund"] .login-lead,html[data-theme="burgund"] .login-field{color:#fbf6ef}
html[data-theme="burgund"] .login-note{color:rgba(251,246,239,.78)}
html[data-theme="ruhig"] .login-card{box-shadow:none}

/* „Tipps in der Nähe“ und „App laden“ gleich hoch und dicht beieinander (Owner 30.10.2026) */
.nx-head-in .nx-get,.nx-head-in .nx-tipps{height:42px;padding-top:0;padding-bottom:0;box-sizing:border-box}
.nx-head-in .nx-tipps+.nx-get{margin-left:-12px}
@media (min-width:1180px) and (max-width:1300px){.nx-head-in .nx-tipps+.nx-get{margin-left:-4px}}
@media (max-width:520px){.nx-head-in .nx-get,.nx-head-in .nx-tipps{height:40px}.nx-head-in .nx-tipps+.nx-get{margin-left:0}}
@media (min-width:1180px) and (max-width:1260px){.nx-nav>a,.nx-nav .nx-top{padding-left:7px!important;padding-right:7px!important}}

/* Ohne Sprache im Kopf trägt „Anmelden“ den Trennstrich zum Menü (Owner 30.10.2026) */
.nx-nav .nx-login{margin-left:6px;border-left:1px solid rgba(125,8,69,.14);border-radius:0;padding-left:14px!important}
html[data-theme="burgund"] .nx-nav .nx-login{border-color:rgba(255,255,255,.16)}
/* Ton aus links vor „Tipps in der Nähe“, dicht dran und gleich hoch (Owner 30.10.2026) */
.nx-head-in .bn-song.in-head{height:42px}
.nx-head-in .bn-song.in-head+.nx-tipps{margin-left:-12px}
@media (min-width:1180px) and (max-width:1300px){.nx-head-in .bn-song.in-head+.nx-tipps{margin-left:-4px}}
@media (max-width:520px){.nx-head-in .bn-song.in-head{height:40px}.nx-head-in .bn-song.in-head+.nx-tipps{margin-left:0}}

/* ── Feedback-Runde 30.10.2026 (Marco, Boris, Sicht neurodivergenter Menschen), freigegeben vom Owner ── */
/* Text ist sofort da: nur Bilder und Zeichnungen dürfen sich beim Scrollen einblenden, Sätze nicht */
.rv:not(canvas):not(.tcard){opacity:1!important;transform:none!important}
/* Handys stehen aufrecht, ohne Dreh- und Kipp-Effekt, auch beim Darüberfahren */
.row-art .dev,.bloomie-dev .dev,.row.rev .row-art .dev,.row-art .dev--back + .dev,.row.rev .row-art .dev--back + .dev,
.offer .row-art:hover .dev,.hero-k .hero-phone .dev,.hero-phone .dev{transform:none!important}
.row-art .dev.dev--back{transform:translate(-36%,-4%) scale(.86)!important}
.row.rev .row-art .dev.dev--back{transform:translate(36%,-4%) scale(.86)!important}
.dev-edge{display:none}
/* Unterzeile im Hero: Zeilen nicht zu lang; am Handy linksbündig, weil zentrierter Fließtext über
   mehrere Zeilen schwer zu lesen ist */
.hero-txt .hero-sub{max-width:62ch}
@media (max-width:700px){.hero-txt .hero-sub,.price-b > p,.kurz p{text-align:left}}
/* Weiche zu Pädagog*innen und Expert*innen */
.hero-txt .hero-switch{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 18px;margin:14px auto 0;max-width:none;font-size:15px}
.hero-switch a{color:var(--burgund);font-weight:600;text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px;padding:6px 0}
.hero-switch a:hover{text-decoration-thickness:2px}
/* Kurz gesagt */
.kurz{max-width:760px;margin:0 auto;padding:40px 22px 10px}
.kurz h2{font:600 14px/1 var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--burgund);margin:0 0 12px}
.kurz p{font-size:18px;line-height:1.6;color:#1a1a1a;margin:0;max-width:65ch}
/* Zeile zur Lage über jedem Nutzen-Block */
.row-kicker{font-size:15px;line-height:1.45;color:#4b5563;font-style:italic;margin:0 0 8px}
/* Knöpfe im Inhalt */
.offer-get{text-align:center;margin:30px 0 0}
.price-get{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:12px 22px;margin:8px 0 0}
.price-all{color:var(--burgund);font-weight:600;text-decoration:underline;text-underline-offset:3px;padding:8px 0}
/* Transkript zum Video */
.film-txt{max-width:640px;margin:14px auto 0;text-align:left}
.film-txt summary{cursor:pointer;color:var(--burgund);font-weight:600;font-size:15px;text-align:center;list-style-position:inside}
.film-txt p{font-size:16px;line-height:1.6;color:#1a1a1a;margin:12px 0 0}
/* Presse-Logos führen zum Bericht */
.press-a{display:inline-flex;align-items:center;border-radius:6px}
.press-a:hover img{opacity:1;filter:none}
.press-a:focus-visible{outline:2px solid var(--burgund);outline-offset:4px}
/* Tippflächen: der Knopf im Kopf mindestens 44 px hoch (Apple), auch am Handy */
.nx-head-in .nx-get{min-height:44px}
/* Musik ist auf jeder Seite einschaltbar, auch am schmalen Handy */
@media (max-width:440px){.nx-head-in .bn-song.in-head{display:inline-flex;height:40px;padding:0 9px}}
/* Am schmalen Handy nur die Blüte als Logo, damit Musik, Tipps, „Kostenlos laden“ und das Menü in eine Zeile passen */
@media (max-width:440px){.nx-head-in .pv-word{display:none}.nx-head-in .nx-get{padding:10px 14px}}
/* Mindestgröße 14 px für alles, was man lesen soll: Stimmen, Namen, Belegzeile, „Bekannt von“ */
.vq blockquote{font-size:max(14px,1em)!important}
.vq figcaption,.vq figcaption strong,.vq figcaption span{font-size:14px!important}
.vq .stars{font-size:15px!important;color:var(--burgund)}
.proof span:not(.proof-av),.press-lead,.award-sub{font-size:14px!important}
/* Die Fußzeilen-Seiten (Hilfe-Center, Karriere, Partnerschaften, Sicherheit, Barrierefreiheit), 30.10.2026 */
.doc{max-width:860px;margin:0 auto;padding:30px 22px 20px}
.doc h2{font:700 clamp(26px,5.6vw,36px)/1.1 var(--display);color:var(--burgund);margin:26px 0 14px;text-wrap:balance}
.doc > p,.doc .jobs-empty p{font-size:17px;line-height:1.6;color:#1a1a1a;max-width:65ch;margin:0 0 14px}
.doc a:not([class]){color:var(--burgund);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.doc-cards{display:grid;gap:14px;margin:6px 0 18px}
@media (min-width:760px){.doc-cards{grid-template-columns:1fr 1fr}}
.doc-card{background:#fff;border:1px solid rgba(125,8,69,.1);border-radius:18px;padding:20px 22px}
.doc-card h3{font:700 18px/1.3 var(--sans);color:#1a1a1a;margin:0 0 8px}
.doc-card p{font-size:16px;line-height:1.55;color:#4b5563;margin:0 0 8px}
.doc-card p:last-child{margin-bottom:0}
.doc-card a{color:var(--burgund);font-weight:600}
.doc.faq-b{padding-top:20px}
.doc.faq-b h2{text-align:left}
.jobs{list-style:none;margin:0;padding:0}
.jobs:empty{display:none}
.jobs-empty{background:#fff;border:1px dashed rgba(125,8,69,.3);border-radius:18px;padding:22px 24px}
.doc-end{padding-bottom:60px}