/* ---------- Schriften (selbst gehostet, @fontsource): eine Serif, eine Sans ---------- */
@font-face{font-family:'Source Serif 4';src:url('../fonts/source-serif-4-latin-600-normal.woff2') format('woff2');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:'IBM Plex Sans';src:url('../fonts/ibm-plex-sans-latin-400-normal.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'IBM Plex Sans';src:url('../fonts/ibm-plex-sans-latin-500-normal.woff2') format('woff2');font-weight:500;font-style:normal;font-display:swap}

/* ---------- Token: Papier, Tinte, wenig Gold ---------- */
:root{
  --aub-900:#1E0B36; --aub-600:#44265C; --aub-500:#5B3A78; --aub-100:#EFEAF3; --aub-50:#F7F5F9;
  --gold:#D4AF37; --gold-deep:#7A5A0E; --gold-line:rgba(212,175,55,.55);
  --paper:#FFFFFF; --paper-2:#F7F5F9;
  /* Getönte Flächen: Lavendel aus der Aubergine-Palette (keine neue Markenfarbe), dunkler Verlauf aus aub-600 nach aub-900 */
  --wash:linear-gradient(180deg,var(--aub-100) 0%,var(--aub-50) 100%);
  --deep:linear-gradient(165deg,var(--aub-600) 0%,var(--aub-900) 70%);
  --ink:#1E0B36; --ink-2:#3F3352; --ink-3:#6B6279;
  --on-dark:#F5F1F8; --on-dark-2:rgba(245,241,248,.78); --on-dark-3:rgba(245,241,248,.6);
  --line:rgba(30,11,54,.14); --line-strong:rgba(30,11,54,.36);
  --line-dark:rgba(245,241,248,.16);
  --err:#9E2318; --err-bg:#FBEDEB;
  --serif:'Source Serif 4',Georgia,'Times New Roman',serif;
  --sans:'IBM Plex Sans','Segoe UI',system-ui,sans-serif;
  --out:cubic-bezier(.22,1,.36,1);
  --col-gap:clamp(2rem,5vw,4rem);
  --gutter:clamp(1.25rem,5vw,4rem);
  --max:1280px;
  --header-h:4.75rem;
}

/* ---------- Basis ---------- */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--header-h) + 1rem);-webkit-text-size-adjust:100%;overflow-x:clip}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--paper);color:var(--ink-2);font-family:var(--sans);font-size:1.0625rem;line-height:1.65;overflow-x:clip;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
h1,h2,h3,h4,p,ul,ol,dl,dd{margin:0}
ul,ol{padding:0;list-style:none}
svg{display:block}
p,li,dd{text-wrap:pretty}
::selection{background:var(--aub-900);color:#fff}
:focus-visible{outline:2px solid var(--aub-600);outline-offset:3px}
.dark :focus-visible,.dark:focus-visible{outline-color:var(--gold)}
.skip{position:absolute;left:var(--gutter);top:-4rem;z-index:100;background:var(--paper);color:var(--ink);padding:.6rem 1rem;border:1px solid var(--line-strong);font-weight:500}
.skip:focus-visible{top:.75rem}
.wrap{width:100%;max-width:var(--max);margin-inline:auto;padding-inline:var(--gutter)}
.ic{width:1em;height:1em;flex:none}
.vh{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
[hidden]{display:none !important}
strong{font-weight:500;color:var(--ink)}
.dark strong{color:var(--on-dark)}

/* Markenzeichen in Tinte: die goldenen Logodateien dienen als Alpha-Maske, gefüllt mit Aubergine. Ohne Maskenunterstützung bleibt das Originalbild */
.mask-img{display:none}
@supports (mask-image:url("")) or (-webkit-mask-image:url("")){
  .mask-img{display:block;background:var(--ink);-webkit-mask-image:var(--m);mask-image:var(--m);-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}
  .mask-fallback{display:none}
}

/* ---------- Typografie: Serif für Überschriften (Bezug zur Wortmarke), Sans für Lauftext, Bedienelemente und gesperrte Versalzeilen ---------- */
.kicker{font-family:var(--sans);font-weight:500;font-size:.75rem;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-deep);line-height:1.5}
.dark .kicker{color:var(--gold)}
.h1{font-family:var(--serif);font-weight:600;font-size:clamp(2.5rem,1.2rem + 3.4vw,4.25rem);line-height:1.05;letter-spacing:-.02em;color:var(--ink);text-wrap:balance}
.h1 .gold{color:inherit}
@media (max-width:379px){.h1{font-size:2.2rem}}
.h2{font-family:var(--serif);font-weight:600;font-size:clamp(1.85rem,1.25rem + 1.8vw,2.75rem);line-height:1.14;letter-spacing:-.015em;color:var(--aub-600);text-wrap:balance}
.dark .h2{color:var(--on-dark)}
.h2-s{font-family:var(--serif);font-weight:600;font-size:clamp(1.5rem,1.2rem + 1vw,2rem);line-height:1.2;letter-spacing:-.01em;color:var(--ink);text-wrap:balance}
.dark .h2-s{color:var(--on-dark)}
.h3{font-family:var(--serif);font-weight:600;font-size:1.375rem;line-height:1.25;letter-spacing:-.01em;color:var(--ink);text-wrap:balance}
.dark .h3{color:var(--on-dark)}
.h4{font-family:var(--sans);font-weight:500;font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink);line-height:1.5}
.dark .h4{color:var(--on-dark)}
.sub{font-size:clamp(1.0625rem,1rem + .3vw,1.1875rem);line-height:1.6;color:var(--ink-2);max-width:34rem}
.intro{max-width:36rem;font-size:clamp(1.0625rem,1rem + .3vw,1.1875rem);line-height:1.6}
.small{font-size:.9375rem;color:var(--ink-3)}
.dark .small{color:var(--on-dark-3)}
.dark{color:var(--on-dark-2)}

/* Markenanspruch mit dem goldenen Siegel */
.claim{display:inline-flex;align-items:center;gap:1.25rem;font-family:var(--sans);font-weight:500;font-size:.75rem;letter-spacing:.18em;text-transform:uppercase;color:var(--gold-deep);line-height:1.4;text-wrap:balance}
.dark .claim{color:var(--gold)}
.claim img{width:5rem;height:5rem;flex:none}
@media (max-width:479px){.hero .claim{font-size:.6875rem;letter-spacing:.14em;gap:1rem}.hero .claim img{width:4rem;height:4rem}}

/* ---------- Knöpfe und Links: eckig, gesperrte Versalien ---------- */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:.75rem;min-height:3.25rem;padding:.9rem 1.6rem;border:1px solid transparent;border-radius:0;font-family:var(--sans);font-weight:500;font-size:.8125rem;letter-spacing:.12em;text-transform:uppercase;line-height:1.2;white-space:nowrap;transition:background-color .3s var(--out),border-color .3s var(--out),color .3s var(--out),transform .3s var(--out)}
.btn:active{transform:translateY(1px)}
.btn .ic{transition:transform .35s var(--out)}
.btn:hover .ic,.btn:focus-visible .ic{transform:translateX(3px)}
.btn-primary{background:var(--aub-900);color:#fff;border-color:var(--aub-900)}
/* Feiner goldener Innenrahmen wie der Doppelring des Siegels; beim Zeigen voll sichtbar */
.btn-primary::after{content:"";position:absolute;inset:3px;border:1px solid var(--gold);opacity:.55;pointer-events:none;transition:opacity .3s var(--out)}
.btn-primary:hover,.btn-primary:focus-visible{background:var(--aub-600);border-color:var(--aub-600)}
.btn-primary:hover::after,.btn-primary:focus-visible::after{opacity:1}
.dark .btn-primary{background:transparent;color:var(--on-dark);border-color:var(--gold-line)}
.dark .btn-primary::after{display:none}
.dark .btn-primary:hover,.dark .btn-primary:focus-visible{background:var(--gold);color:var(--aub-900);border-color:var(--gold)}
.btn-ghost{border-color:var(--line-strong);color:var(--ink)}
.btn-ghost:hover,.btn-ghost:focus-visible{border-color:var(--ink);background:var(--aub-50)}
.btn[disabled]{opacity:.6;cursor:progress;transform:none}
@media (max-width:479px){.btn{white-space:normal;text-align:center}}
.link{display:inline-flex;align-items:center;gap:.5rem;padding:.3rem 0 .2rem;font-weight:500;font-size:.9375rem;color:var(--ink);border-bottom:1px solid var(--line-strong);transition:border-color .3s var(--out),color .3s var(--out)}
.link:hover,.link:focus-visible{border-bottom-color:var(--gold)}
.link .ic{transition:transform .35s var(--out)}
.link:hover .ic,.link:focus-visible .ic{transform:translateX(3px)}
.link:active{transform:translateY(1px)}
.dark .link{color:var(--on-dark);border-bottom-color:rgba(245,241,248,.4)}
.dark .link:hover,.dark .link:focus-visible{color:#fff;border-bottom-color:#fff}
.actions{display:flex;flex-wrap:wrap;align-items:center;gap:1rem 2rem}
@media (max-width:479px){.actions .btn{width:100%}}

/* ---------- Kopf: weiß, Textlinks, Haarlinie nach dem ersten Scrollen ---------- */
/* Feine Goldkante am oberen Seitenrand: die Marke ist beim Scrollen immer präsent */
.header{position:sticky;top:0;z-index:50;background:var(--paper);border-top:3px solid var(--gold);border-bottom:1px solid transparent;transition:border-bottom-color .35s var(--out)}
.header.solid,html:not(.js) .header{border-bottom-color:var(--line)}
.header .bar{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;min-height:var(--header-h)}
.brand{display:inline-flex;align-items:center;padding:.25rem 0;transition:opacity .25s var(--out)}
.brand:hover{opacity:.72}
.brand:active{opacity:.6}
.brand img{height:2.25rem;width:auto}
.wordmark{width:8.75rem;aspect-ratio:280/74}
@media (min-width:1024px){.wordmark{width:9.75rem}.brand img{height:2.6rem}}
.nav{display:none;align-items:center;gap:2rem}
.nav a{position:relative;font-weight:500;font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-2);padding:.5rem 0;transition:color .25s var(--out)}
.nav a::after{content:"";position:absolute;left:0;right:0;bottom:.15rem;height:2px;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .35s var(--out)}
.nav a:hover,.nav a:focus-visible,.nav a[aria-current="true"]{color:var(--ink)}
.nav a:hover::after,.nav a:focus-visible::after,.nav a[aria-current="true"]::after{transform:scaleX(1)}
.nav a:active{color:var(--aub-600)}
/* Sprachumschalter: zwei Buchstabenpaare, nichts weiter */
.lang{display:inline-flex;align-items:center;gap:.45rem;margin-left:auto;font-family:var(--sans);font-weight:500;font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3);white-space:nowrap}
.lang a{color:var(--ink-3);padding:.4rem .1rem;transition:color .25s var(--out)}
.lang a:hover,.lang a:focus-visible{color:var(--ink)}
.lang a:active{color:var(--aub-600)}
.lang [aria-current]{color:var(--ink);padding:.4rem .1rem}
.lang-sep{opacity:.45}
.header-cta{display:none;min-height:2.75rem;padding:.6rem 1.1rem;font-size:.75rem}
.menu-btn{display:inline-flex;align-items:center;gap:.65rem;min-height:2.75rem;padding:.4rem .5rem;margin-right:-.5rem;font-weight:500;font-size:.8125rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink);transition:background-color .25s var(--out)}
.menu-btn:hover,.menu-btn:focus-visible{background:var(--aub-50)}
.menu-btn:active{background:var(--aub-100)}
.menu-btn .lines{display:block;width:18px;height:11px;position:relative}
.menu-btn .lines::before,.menu-btn .lines::after{content:"";position:absolute;left:0;right:0;height:1px;background:currentColor;transition:transform .3s var(--out)}
.menu-btn .lines::before{top:0}
.menu-btn .lines::after{bottom:0}
.menu-btn[aria-expanded="true"] .lines::before{transform:translateY(5px) rotate(45deg)}
.menu-btn[aria-expanded="true"] .lines::after{transform:translateY(-5px) rotate(-45deg)}
.menu{display:none;position:absolute;left:0;right:0;top:100%;background:var(--paper);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.menu.open{display:block}
/* Ohne JavaScript: Menü als normale Liste unter der Kopfzeile, kein Knopf */
html:not(.js) .menu{display:block;position:static;border-top:0}
html:not(.js) .menu-btn{display:none}
html:not(.js) .header{position:relative}
.rv-on .menu{display:block;opacity:0;transform:translateY(-4px);pointer-events:none;visibility:hidden;transition:opacity .3s var(--out),transform .3s var(--out),visibility 0s .3s}
.rv-on .menu.open{opacity:1;transform:none;pointer-events:auto;visibility:visible;transition:opacity .3s var(--out),transform .3s var(--out),visibility 0s}
.menu ul{padding:.25rem 0 1.25rem}
.menu li{border-top:1px solid var(--line)}
.menu li:first-child{border-top:0}
.menu a:not(.btn){display:block;padding:.95rem 0;font-weight:500;font-size:1.0625rem;color:var(--ink);transition:color .25s var(--out)}
.menu a:not(.btn):hover,.menu a:not(.btn):focus-visible{color:var(--aub-500)}
.menu a:not(.btn):active{color:var(--aub-600)}
.menu .btn{margin-top:.75rem;width:100%;margin-bottom:1.5rem}
@media (min-width:1024px){
  .nav{display:inline-flex}
  .lang{margin-left:0}
  .menu-btn,.menu,.rv-on .menu,html:not(.js) .menu{display:none}
}
@media (min-width:1280px){.header-cta{display:inline-flex}}

/* ---------- Abschnitte: Haarlinie oben im Satzspiegel (nicht über die volle Breite), viel Luft ---------- */
.sec,.paths,.refs{position:relative}
.sec::before,.paths::before,.refs::before{content:"";position:absolute;top:0;left:50%;transform:translateX(-50%);width:min(100% - 2 * var(--gutter),var(--max) - 2 * var(--gutter));height:1px;background:var(--line)}
.sec{padding-block:clamp(4.5rem,10vw,8rem)}
.sec.dark{background:var(--deep)}
.sec.tint{background:var(--aub-100)}
.sec.dark::before,.sec.tint::before{display:none}
/* Direkt unter einer getönten Fläche braucht der weiße Abschnitt keine Haarlinie, die Kante ist die Farbe */
.hero + .sec::before,.sec.tint + .sec::before{display:none}
.sec-head{display:grid;gap:1.25rem var(--col-gap)}
.sec-head .h2{max-width:22ch}
.sec-head .intro,.proc-rail .intro,.fn-copy .intro,.person-copy .intro{margin-top:1.25rem}
@media (min-width:900px){
  .sec-head{grid-template-columns:minmax(0,7fr) minmax(0,5fr);align-items:start}
  .sec-head .intro{margin-top:.5rem}
}

/* ---------- Hero: nur Typografie. Siegel und Claim, Überschrift, Haarlinie, darunter die Zahlungsaussage neben Satz und Knöpfen ---------- */
.hero{position:relative;background:var(--wash);display:flex;align-items:center;min-height:calc(100svh - var(--header-h));padding-block:clamp(3rem,9vh,6.5rem) clamp(3.5rem,9vh,6.5rem)}
.hero-sentinel{position:absolute;left:0;top:0;width:1px;height:24px;pointer-events:none}
.hero-copy{width:100%}
.hero .h1{margin-top:clamp(1.75rem,4vw,2.75rem);max-width:22ch}
.hero-deal{position:relative;display:grid;gap:1.25rem;margin-top:clamp(2.5rem,6vw,4rem);padding-top:clamp(1.5rem,3vw,2.25rem);border-top:1px solid var(--line)}
/* Goldmarke am Anfang der Haarlinie, dasselbe Zeichen wie bei Leistungen und Vergütung */
.hero-deal::before{content:"";position:absolute;left:0;top:-1px;width:2.5rem;height:2px;background:var(--gold)}
.hero-fee{font-family:var(--serif);font-weight:600;font-size:clamp(1.25rem,1.05rem + .8vw,1.75rem);line-height:1.3;letter-spacing:-.01em;color:var(--ink);max-width:22ch;text-wrap:balance}
.hero .sub{max-width:36rem}
.hero .actions{margin-top:.75rem}
@media (min-width:900px){
  .hero-deal{grid-template-columns:minmax(0,5fr) minmax(0,7fr);column-gap:var(--col-gap);row-gap:1.5rem;align-items:start}
  .hero-deal .hero-fee{grid-column:1;grid-row:1 / span 2}
  .hero-deal .sub{grid-column:2;grid-row:1}
  .hero-deal .actions{grid-column:2;grid-row:2;margin-top:.25rem}
}
/* Hero-Einblendung: ruhiges Aufblenden, ohne rv-on steht alles sofort da */
.rv-on .hero .claim{animation:fadeUp .8s var(--out) both}
.rv-on .hero .h1{animation:fadeUp .9s var(--out) .1s both}
.rv-on .hero .hero-deal{animation:fadeUp .9s var(--out) .3s both}
@keyframes fadeUp{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

/* ---------- Zwei Wege: zwei Spalten, eine Haarlinie dazwischen ---------- */
.paths{padding-block:clamp(3.5rem,8vw,6rem)}
.paths-grid{display:grid;gap:2.5rem}
.paths-grid > *{min-width:0}
.path{display:flex;flex-direction:column;gap:1.1rem}
.path + .path{padding-top:2.5rem;border-top:1px solid var(--line)}
.path .kicker{margin-bottom:.15rem}
.path p{max-width:32rem}
/* Knopf und Textlink untereinander: gleiche Form in beiden Spalten und Sprachen */
.path .actions{margin-top:.75rem;flex-direction:column;align-items:flex-start;gap:1.1rem}
@media (min-width:760px){
  .paths-grid{grid-template-columns:1fr 1fr;gap:0}
  .path{padding-right:var(--col-gap)}
  .path + .path{padding-top:0;padding-left:var(--col-gap);padding-right:0;border-top:0;border-left:1px solid var(--line)}
}

/* ---------- Referenzen ---------- */
.refs{padding-block:clamp(2rem,4vw,3rem)}
.refs-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1.25rem 3rem}
.refs-title{font-family:var(--sans);font-weight:500;font-size:.75rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-3)}
.marks{display:flex;flex-wrap:wrap;align-items:center;gap:1rem clamp(2rem,5vw,4.5rem)}
.marks img{display:block;width:auto;filter:grayscale(1);opacity:.72;transition:opacity .35s var(--out),filter .35s var(--out)}
.marks li:hover img{opacity:1;filter:none}
.marks .m-kaisers{height:clamp(52px,4vw + 32px,68px)}
.marks .m-pinkberry{height:clamp(26px,2vw + 16px,34px)}

/* ---------- Leistungen: vier gleichwertige Felder im Linienraster (keine Nummern, weil keine Reihenfolge) ---------- */
.svc{display:grid;margin-top:clamp(3rem,6vw,4.5rem);border-top:1px solid var(--line)}
.svc li{position:relative;padding:1.75rem 0 2rem;border-bottom:1px solid var(--line)}
.svc li::before{content:"";position:absolute;left:0;top:-1px;width:2.5rem;height:2px;background:var(--gold)}
.svc li p{margin-top:.75rem;max-width:30rem}
@media (min-width:760px){
  .svc{grid-template-columns:1fr 1fr}
  .svc li{padding:2.25rem 0 2.5rem}
  .svc li:nth-child(odd){padding-right:var(--col-gap)}
  .svc li:nth-child(even){padding-left:var(--col-gap);border-left:1px solid var(--line)}
  .svc li:nth-child(even)::before{left:var(--col-gap)}
}
/* Für wen wir arbeiten */
.fit{display:grid;gap:1.5rem var(--col-gap);margin-top:clamp(3rem,6vw,4.5rem)}
.fit-head{max-width:32rem}
.fit-head p{margin-top:.9rem}
.fit-cols{display:grid;border-top:1px solid var(--line)}
.fit-col{position:relative;padding:1.5rem 0;border-bottom:1px solid var(--line)}
/* Goldmarke nur an der Spalte, die passt */
.fit-col.yes::before{content:"";position:absolute;left:0;top:-1px;width:2.5rem;height:2px;background:var(--gold)}
.fit-col .h4{color:var(--gold-deep)}
.fit-col.no .h4{color:var(--ink-3)}
.fit-col p{margin-top:.75rem;color:var(--ink-2)}
@media (min-width:760px){
  .fit-cols{grid-template-columns:1fr 1fr}
  .fit-col.yes{padding-right:var(--col-gap)}
  .fit-col.no{padding-left:var(--col-gap);border-left:1px solid var(--line)}
}
@media (min-width:980px){.fit{grid-template-columns:minmax(0,4fr) minmax(0,8fr);align-items:start}}

/* ---------- Vergütung: dunkle Fläche, zwei Teile nebeneinander, Haarlinie dazwischen ---------- */
.fee-tl{display:grid;margin-top:clamp(3rem,6vw,4.5rem);border-top:1px solid var(--line-dark)}
.fee-row{position:relative;display:grid;gap:.5rem;padding:2rem 0;border-bottom:1px solid var(--line-dark)}
.fee-row::before{content:"";position:absolute;left:0;top:-1px;width:2.5rem;height:2px;background:var(--gold)}
.fee-mark{display:none}
.fee-row .h3{font-size:clamp(1.5rem,1.3rem + .8vw,2rem);margin-top:.35rem}
.fee-text{margin-top:.5rem;max-width:30rem}
@media (min-width:900px){
  .fee-tl{grid-template-columns:1fr 1fr}
  .fee-row{padding:2.5rem 0 2.75rem}
  .fee-row:first-child{padding-right:var(--col-gap)}
  .fee-row + .fee-row{padding-left:var(--col-gap);border-left:1px solid var(--line-dark)}
  .fee-row + .fee-row::before{left:var(--col-gap)}
}
.fee-foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1.25rem 2rem;margin-top:2.5rem}
.fee-foot p{max-width:36rem}

/* ---------- Vorgehen: Phasen als Liste mit Haarlinien, Nummern klein in Gold (echte Reihenfolge) ---------- */
.proc-grid{display:grid;gap:3rem;align-items:start}
.proc-rail{position:relative}
.phases{display:grid;border-top:1px solid var(--line)}
.phase{display:grid;grid-template-columns:auto minmax(0,1fr);gap:1.25rem;padding:2rem 0;border-bottom:1px solid var(--line)}
.phase-num{font-family:var(--serif);font-weight:600;font-size:1.25rem;line-height:1.3;letter-spacing:.04em;color:var(--gold-deep);min-width:2.5rem;padding-top:.1rem}
.phase-body p{margin-top:.6rem;max-width:34rem}
.res-list{display:grid;margin-top:1.25rem;max-width:34rem}
.res{display:grid;grid-template-columns:7rem minmax(0,1fr);gap:1rem;margin:0;padding:.6rem 0;border-top:1px solid var(--line);font-size:.9375rem}
.res-k{font-weight:500;color:var(--ink-3);letter-spacing:.12em;text-transform:uppercase;font-size:.6875rem;line-height:2.1}
.res-v{font-weight:500;color:var(--ink)}
@media (max-width:479px){.res{grid-template-columns:1fr;gap:.1rem}}
@media (min-width:980px){
  .proc-grid{grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(3rem,6vw,6rem)}
  .proc-rail{position:sticky;top:calc(var(--header-h) + 2.5rem)}
  .phase{grid-template-columns:4rem minmax(0,1fr);gap:1.5rem;padding:2.5rem 0}
}

/* ---------- Ansprechpartner ---------- */
.person-grid{display:grid;gap:2.5rem;align-items:center}
.portrait{position:relative;width:100%;max-width:20rem;aspect-ratio:4/5;background:var(--paper);border:1px solid var(--line)}
.portrait::after{content:"";position:absolute;inset:12px;border:1px solid var(--gold-line);pointer-events:none}
.portrait .mono{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-family:var(--serif);font-weight:600;font-size:clamp(4.5rem,12vw,6.5rem);letter-spacing:.04em;color:var(--ink);line-height:1}
.person-role{margin-top:.9rem;font-weight:500;font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-deep)}
.person-facts{display:grid;margin-top:2rem;border-top:1px solid var(--line);max-width:34rem}
.person-facts > div{display:grid;grid-template-columns:9.5rem minmax(0,1fr);gap:1rem;padding:.8rem 0;border-bottom:1px solid var(--line)}
.person-facts dt{font-size:.6875rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);font-weight:500;line-height:2.1}
.person-facts dd{font-weight:500;color:var(--ink)}
.person-facts a{text-decoration:underline;text-underline-offset:.18em;text-decoration-color:var(--line-strong);word-break:break-word;transition:text-decoration-color .25s}
.person-facts a:hover,.person-facts a:focus-visible{text-decoration-color:currentColor}
/* Schmale Bildschirme: Bezeichnung über dem Wert, damit die E-Mail-Adresse nicht im Wort umbricht */
@media (max-width:599px){.person-facts > div{grid-template-columns:1fr;gap:.2rem;padding:.9rem 0}.person-facts dt{line-height:1.6}}
@media (min-width:900px){.person-grid{grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(3rem,6vw,6rem)}}

/* ---------- Franchisenehmer ---------- */
.fn-grid{display:grid;gap:2.5rem;align-items:start}
.fn-note{margin-top:1.5rem;padding-top:1.25rem;border-top:1px solid var(--gold-line);max-width:34rem;font-size:.9375rem;line-height:1.6}
.steps{display:grid;border-top:1px solid var(--line)}
.steps li{display:grid;grid-template-columns:auto minmax(0,1fr);gap:1.25rem;padding:1.75rem 0;border-bottom:1px solid var(--line)}
.step-n{font-family:var(--serif);font-weight:600;font-size:1.25rem;line-height:1.3;letter-spacing:.04em;color:var(--gold-deep);min-width:2.5rem;padding-top:.1rem}
.steps p{margin-top:.5rem;max-width:32rem}
.fn-copy .actions{margin-top:2rem}
@media (min-width:980px){
  .fn-grid{grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(3rem,6vw,6rem)}
  .fn-copy{position:sticky;top:calc(var(--header-h) + 2.5rem)}
  .steps li{grid-template-columns:4rem minmax(0,1fr);gap:1.5rem;padding:2.25rem 0}
}

/* ---------- Fragen ---------- */
.faq{display:grid;gap:2.5rem;margin-top:clamp(2.5rem,5vw,3.5rem)}
.faq-group .h3{margin-bottom:.75rem;font-family:var(--sans);font-weight:500;font-size:.75rem;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-deep)}
.q{border-top:1px solid var(--line)}
.q:last-child{border-bottom:1px solid var(--line)}
.q summary{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;padding:1.1rem 0;font-weight:500;color:var(--ink);cursor:pointer;list-style:none;transition:color .25s var(--out)}
.q summary::-webkit-details-marker{display:none}
.q summary:hover{color:var(--aub-500)}
.q summary:active{color:var(--aub-600)}
.q summary .pm{position:relative;width:1rem;height:1rem;flex:none;margin-top:.35rem;color:var(--gold-deep);transition:transform .35s var(--out)}
.q summary .pm::before,.q summary .pm::after{content:"";position:absolute;left:50%;top:50%;width:1rem;height:1px;background:currentColor;transform:translate(-50%,-50%)}
.q summary .pm::after{transform:translate(-50%,-50%) rotate(90deg)}
.q[open] summary .pm{transform:rotate(45deg)}
.q .a{padding:0 2.5rem 1.25rem 0;max-width:38rem}
@media (min-width:860px){.faq{grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,4rem)}}

/* ---------- Kontakt mit Formularen ---------- */
.sec.contact{padding-bottom:clamp(4rem,8vw,7rem)}
.contact-panel{display:grid;gap:3rem}
/* Überschriften in schmalen 5/12-Spalten (Vorgehen, Franchisenehmer, Kontakt) eine Stufe kleiner als die breiten Abschnittsköpfe */
.proc-rail .h2,.fn-copy .h2,.contact-side .h2{font-size:clamp(1.75rem,1.25rem + 1.4vw,2.4rem)}
.contact-side .intro{margin-top:1.25rem}
.person-mini{display:flex;flex-wrap:wrap;align-items:center;gap:.75rem 1rem;margin-top:2rem;padding-top:1.75rem;border-top:1px solid var(--line)}
.avatar{width:3.5rem;height:3.5rem;flex:none;background:var(--paper);border:1px solid var(--line);display:flex;align-items:center;justify-content:center;font-family:var(--serif);font-weight:600;font-size:1.1rem;letter-spacing:.04em;color:var(--ink)}
.person-mini .name{font-weight:500;color:var(--ink);font-size:1.0625rem}
.person-mini .role{font-size:.9375rem;color:var(--ink-3)}
.person-mini .mail{flex-basis:100%;font-size:.9375rem;color:var(--ink);text-decoration:underline;text-underline-offset:.18em;text-decoration-color:var(--line-strong);overflow-wrap:anywhere;transition:text-decoration-color .25s}
.person-mini .mail:hover,.person-mini .mail:focus-visible{text-decoration-color:currentColor}
.trust{display:grid;margin-top:1.75rem}
.trust li{padding:.7rem 0;border-top:1px solid var(--line);font-size:.9375rem;color:var(--ink-2);font-weight:500}
.trust li:last-child{border-bottom:1px solid var(--line)}
.tabs{display:none;border-bottom:1px solid var(--line);margin-bottom:2rem}
.js .tabs{display:flex;gap:2.25rem}
.tab{position:relative;padding:.9rem 0;font-weight:500;font-size:.8125rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);text-align:left;transition:color .25s var(--out)}
.tab::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .35s var(--out)}
.tab:hover{color:var(--ink)}
.tab:active{color:var(--aub-600)}
.tab[aria-selected="true"]{color:var(--ink)}
.tab[aria-selected="true"]::after{transform:scaleX(1)}
.aform{display:grid;gap:1.25rem;scroll-margin-top:calc(var(--header-h) + 1.25rem)}
.aform + .aform{margin-top:3.5rem;padding-top:3rem;border-top:1px solid var(--line)}
.js .aform:not(.is-active){display:none}
.js .aform + .aform{margin-top:0;padding-top:0;border-top:0}
.aform-head{margin-bottom:.25rem}
.aform-head p{margin-top:.5rem}
.aform-head .h2-s{font-size:clamp(1.4rem,1.2rem + .8vw,1.75rem)}
/* Fortschritt: nur mit JS sichtbar */
.wiz-progress{display:none;align-items:center;gap:1rem}
.js .wiz-progress{display:flex}
.wiz-count{font-size:.6875rem;letter-spacing:.14em;text-transform:uppercase;font-weight:500;color:var(--ink-3);white-space:nowrap;font-variant-numeric:tabular-nums}
.wiz-bar{flex:1;height:2px;background:var(--line);overflow:hidden}
.wiz-fill{display:block;height:100%;background:var(--gold);transform-origin:left;transform:scaleX(0);transition:transform .6s var(--out)}
/* Schritte: ohne JS alle untereinander, mit JS einer nach dem anderen */
.wiz-steps{display:grid;gap:2.75rem;margin-top:.25rem}
.js .wiz-steps{gap:0;min-height:12rem}
.step{display:grid;gap:1.1rem;align-content:start;min-width:0;margin:0;padding:0;border:0}
.js .step:not(.is-active){display:none}
.step-q{float:left;width:100%;margin:0;padding:0;font-family:var(--serif);font-weight:600;font-size:clamp(1.3rem,1.1rem + .8vw,1.75rem);line-height:1.22;letter-spacing:-.01em;color:var(--ink);text-wrap:balance}
.step-hint{margin-top:-.55rem;max-width:34rem;font-size:.9375rem;line-height:1.5;color:var(--ink-3)}
.js .nojs-only{display:none}
.field{display:grid;gap:.45rem}
.field > label{font-weight:500;font-size:.9375rem;color:var(--ink)}
.field .opt{font-weight:400;color:var(--ink-3)}
.field-row{display:grid;gap:1rem}
@media (min-width:600px){.field-row{grid-template-columns:1fr 1fr}}
/* Optionsfelder: echte Radios oder Kästchen, Feld als Fläche mit Haarlinie */
.choices{display:grid;gap:.5rem}
@media (min-width:600px){.choices{grid-template-columns:1fr 1fr}.choices > .ch:last-child:nth-child(odd){grid-column:1 / -1}}
.ch{position:relative;display:block;cursor:pointer;-webkit-tap-highlight-color:transparent}
.ch input{position:absolute;left:.5rem;top:50%;width:1px;height:1px;margin:0;opacity:0;pointer-events:none}
.ch-box{display:flex;align-items:center;gap:.9rem;min-height:3.5rem;padding:.85rem 1.1rem;border:1px solid var(--line-strong);background:var(--paper);color:var(--ink);font-weight:500;font-size:1rem;line-height:1.35;transition:border-color .2s var(--out),background-color .2s var(--out)}
.ch:hover .ch-box{border-color:var(--ink)}
.ch:active .ch-box{background:var(--aub-50)}
.ch-dot{position:relative;width:1.1rem;height:1.1rem;flex:none;border-radius:50%;border:1px solid var(--line-strong);transition:border-color .2s var(--out)}
.ch-dot::after{content:"";position:absolute;inset:3px;border-radius:50%;background:var(--ink);transform:scale(0);transition:transform .25s var(--out)}
.ch input[type="checkbox"] + .ch-box .ch-dot{border-radius:0}
.ch input[type="checkbox"] + .ch-box .ch-dot::after{border-radius:0}
.ch input:checked + .ch-box{border-color:var(--ink);background:var(--paper);box-shadow:0 0 0 1px var(--ink)}
.ch input:checked + .ch-box .ch-dot{border-color:var(--ink)}
.ch input:checked + .ch-box .ch-dot::after{transform:scale(1)}
.ch input:focus-visible + .ch-box{outline:2px solid var(--aub-600);outline-offset:3px}
.field.is-invalid .ch-box{border-color:var(--err)}
/* Navigation: ohne JS nur der Absende-Knopf */
.wiz-nav{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:.75rem 1.25rem;margin-top:.5rem;padding-top:1.5rem;border-top:1px solid var(--line)}
.wiz-back,.wiz-skip,.wiz-next,.wiz-hint{display:none}
.js .wiz-back{display:inline-flex;margin-right:auto;border-color:var(--line-strong);color:var(--ink)}
.js .wiz-back:hover,.js .wiz-back:focus-visible{border-color:var(--ink);background:var(--aub-50)}
.wiz-back:hover .ic,.wiz-back:focus-visible .ic{transform:translateX(-3px)}
.js .wiz-skip{display:inline-flex;align-items:center;min-height:3.25rem;padding:.5rem .25rem;font-weight:500;font-size:.8125rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);transition:color .25s var(--out)}
.js .wiz-skip:hover,.js .wiz-skip:focus-visible{color:var(--ink)}
.js .wiz-skip:active{transform:translateY(1px)}
.js .wiz-next{display:inline-flex}
.js .wiz-submit,.js .aform.is-final .wiz-next{display:none}
.js .aform.is-final .wiz-submit{display:inline-flex}
.wiz-hint{font-size:.8125rem;color:var(--ink-3)}
@media (hover:hover) and (min-width:600px){.js .aform:not(.is-final) .wiz-hint{display:inline}}
@media (max-width:479px){
  .js .wiz-nav{display:grid;grid-template-columns:1fr auto;gap:.75rem}
  .js .wiz-next,.js .aform.is-final .wiz-submit{grid-column:1 / -1;grid-row:1;width:100%}
  .js .wiz-back{grid-row:2;grid-column:1;justify-self:start;margin-right:0}
  .js .wiz-skip{grid-row:2;grid-column:2;justify-self:end}
  .js .wiz-steps{min-height:9rem}
}
/* Schrittwechsel: nur transform und opacity, ohne Bewegung kein Übergang */
@media (prefers-reduced-motion:no-preference){
  .js .step.is-active > *{animation:stepIn .5s var(--out) both}
  .js .step.is-active > :nth-child(2){animation-delay:.05s}
  .js .step.is-active > :nth-child(3){animation-delay:.1s}
  .js .step.is-active > :nth-child(4){animation-delay:.15s}
  .js .step.is-active > :nth-child(5){animation-delay:.2s}
  .js .step.is-active.dir-back > *{animation-name:stepInBack}
  .js .step.is-leaving > *{animation:stepOut .18s var(--out) both}
  .js .step.is-leaving.dir-back > *{animation-name:stepOutBack}
}
@keyframes stepIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes stepInBack{from{opacity:0;transform:translateY(-12px)}to{opacity:1;transform:none}}
@keyframes stepOut{to{opacity:0;transform:translateY(-8px)}}
@keyframes stepOutBack{to{opacity:0;transform:translateY(8px)}}
.input{width:100%;min-height:3rem;padding:.7rem .9rem;border:1px solid var(--line-strong);border-radius:0;background:var(--paper);color:var(--ink);font:inherit;font-size:1rem;line-height:1.4;transition:border-color .2s var(--out),box-shadow .2s var(--out)}
.input::placeholder{color:#857C91}
.input:hover{border-color:var(--ink)}
.input:focus{outline:none;border-color:var(--ink);box-shadow:0 0 0 1px var(--ink)}
.input:focus-visible{outline:none}
textarea.input{min-height:6.5rem;resize:vertical}
.check{display:flex;gap:.75rem;align-items:flex-start;font-size:.9375rem;line-height:1.5;color:var(--ink-2)}
.check input{width:1.1rem;height:1.1rem;margin:.2rem 0 0;flex:none;accent-color:var(--aub-900);cursor:pointer}
.check label{cursor:pointer;flex:1 1 0;min-width:0}
.check a,.note a{color:var(--ink);text-decoration:underline;text-underline-offset:.18em;text-decoration-color:var(--line-strong);transition:text-decoration-color .25s}
.check a:hover,.check a:focus-visible,.note a:hover,.note a:focus-visible{text-decoration-color:currentColor}
.note{font-size:.875rem;line-height:1.55;color:var(--ink-3);max-width:36rem}
.field.is-invalid .input{border-color:var(--err);box-shadow:0 0 0 1px var(--err)}
.field.is-invalid label,.check.is-invalid label{color:var(--err)}
.err{display:none;font-size:.875rem;color:var(--err);line-height:1.4}
.is-invalid .err{display:block}
.check.is-invalid{flex-wrap:wrap}
.check.is-invalid .err{width:100%;padding-left:1.85rem}
.hp{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
.alert{display:none;gap:.75rem;align-items:flex-start;padding:1rem 1.1rem;font-size:.9375rem;line-height:1.5}
.alert.show{display:flex}
.alert .ic{margin-top:.15rem}
.alert-err{background:var(--err-bg);color:var(--err);border:1px solid rgba(158,35,24,.3)}
.alert-err a{font-weight:500;text-decoration:underline;text-underline-offset:.15em}
.ok-mark{display:inline-flex;align-items:center;justify-content:center;width:2.5rem;height:2.5rem;background:var(--aub-900);border:1px solid var(--aub-900);color:var(--gold);margin-bottom:1.25rem}
@media (min-width:980px){
  .contact-panel{grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(3rem,6vw,6rem);align-items:start}
  .contact-side{position:sticky;top:calc(var(--header-h) + 2.5rem)}
}

/* ---------- Mikrozeile unter Knöpfen: drei belegte Fakten, durch Goldpunkte getrennt ---------- */
.micro{font-size:.8125rem;line-height:1.5;color:var(--ink-3);letter-spacing:.01em;text-wrap:balance}
.micro b{font-weight:400;color:var(--gold-deep);margin:0 .4rem}
.dark .micro{color:var(--on-dark-3)}
.dark .micro b{color:var(--gold)}
.actions .micro{flex-basis:100%;margin-top:-.25rem}
.cta-stack{display:grid;gap:.75rem;justify-items:start}
.fee-foot .cta-stack{justify-items:start}

/* ---------- Schlussblock der Startseite: Gespräch, zwei Wege, drei Schritte ---------- */
.next{display:grid;margin-top:1.75rem;border-top:1px solid var(--line);max-width:34rem}
.next li{display:grid;grid-template-columns:2rem minmax(0,1fr);gap:.75rem;padding:.9rem 0;border-bottom:1px solid var(--line);font-size:.9375rem;line-height:1.5;color:var(--ink-2)}
.next .n{font-family:var(--serif);font-weight:600;font-size:1rem;line-height:1.5;letter-spacing:.04em;color:var(--gold-deep)}
.next b{display:block;font-weight:500;color:var(--ink)}
.contact-side .actions{margin-top:2rem}
.contact-aside .h4{color:var(--gold-deep)}
.contact-aside .trust{margin-top:1rem}
.contact-aside .block + .block{margin-top:2.5rem}

/* ---------- Anfrageseite: schlanke Kopfzeile, Formular als Hauptsache, Einwände darunter ---------- */
.header.slim .bar{gap:1rem}
.back-link{display:inline-flex;align-items:center;gap:.55rem;margin-left:auto;padding:.5rem 0;font-weight:500;font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-2);white-space:nowrap;transition:color .25s var(--out)}
.back-link .ic{transition:transform .35s var(--out)}
.back-link:hover,.back-link:focus-visible{color:var(--ink)}
.back-link:hover .ic,.back-link:focus-visible .ic{transform:translateX(-3px)}
.back-link:active{color:var(--aub-600)}
.header.slim .lang{margin-left:0}
@media (max-width:479px){.back-link .bl-long{display:none}}
@media (min-width:480px){.back-link .bl-short{display:none}}
.enq{background:var(--wash);padding-block:clamp(2.5rem,6vw,4.5rem) clamp(4rem,8vw,7rem)}
.enq::before{display:none}
.enq .kicker{margin-bottom:1rem}
.enq-panel{display:grid;gap:3rem}
.enq-side .h2{font-size:clamp(1.75rem,1.25rem + 1.4vw,2.4rem)}
.enq-side .intro{margin-top:1.25rem}
.enq-aside .h4{color:var(--gold-deep)}
.enq-aside .next{margin-top:.75rem}
.enq-aside .trust{margin-top:2rem}
.enq-aside .person-mini{margin-top:1.75rem;padding-top:1.5rem;border-top:0}
@media (min-width:980px){
  .enq-panel{grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:2.5rem clamp(3rem,6vw,6rem);align-items:start}
  .enq-side{grid-column:1;grid-row:1}
  .enq-aside{grid-column:1;grid-row:2;position:sticky;top:calc(var(--header-h) + 2.5rem)}
  .enq-panel .contact-forms{grid-column:2;grid-row:1 / span 2}
}
.pre-faq{margin-top:3rem;padding-top:2rem;border-top:1px solid var(--line)}
.pre-faq .h4{margin-bottom:.75rem;color:var(--gold-deep)}
.pre-faq .faq-group + .faq-group{margin-top:2.5rem}
.js .pre-faq .faq-group:not(.is-active){display:none}
.js .pre-faq .faq-group + .faq-group{margin-top:0}

/* ---------- Textseiten (Impressum, Datenschutz, Danke, 404): schmale Spalte, Serif-Zwischentitel, Haarlinien ---------- */
.page{padding-block:clamp(3rem,7vw,5.5rem) clamp(4.5rem,9vw,7rem)}
.page-head{max-width:46rem}
.page-head .h1{font-size:clamp(2rem,1.3rem + 2vw,3rem);line-height:1.1}
.page-head .intro{margin-top:1.25rem}
.page-head .kicker{margin-bottom:1rem}
.prose{max-width:42rem;margin-top:clamp(2.5rem,5vw,3.5rem)}
.prose h2{font-family:var(--serif);font-weight:600;font-size:1.375rem;line-height:1.25;letter-spacing:-.01em;color:var(--ink);margin-top:2.5rem;padding-top:1.5rem;border-top:1px solid var(--line)}
.prose h2:first-child{margin-top:0;padding-top:0;border-top:0}
.prose dl + h2{margin-top:2.25rem;padding-top:0;border-top:0}
.prose h3{font-family:var(--sans);font-weight:500;font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-deep);margin-top:1.5rem}
.prose p,.prose li{margin-top:.75rem}
.prose ul{list-style:disc;padding-left:1.25rem}
.prose li{margin-top:.4rem;padding-left:.15rem}
.prose a{color:var(--ink);text-decoration:underline;text-underline-offset:.18em;text-decoration-color:var(--line-strong);overflow-wrap:anywhere;transition:text-decoration-color .25s}
.prose a:hover,.prose a:focus-visible{text-decoration-color:currentColor}
.prose dl{display:grid;margin-top:1rem;border-top:1px solid var(--line)}
.prose dl > div{display:grid;grid-template-columns:11rem minmax(0,1fr);gap:1rem;padding:.75rem 0;border-bottom:1px solid var(--line)}
.prose dt{font-size:.6875rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);font-weight:500;line-height:2.1}
.prose dd{color:var(--ink)}
@media (max-width:599px){.prose dl > div{grid-template-columns:1fr;gap:.2rem}.prose dt{line-height:1.6}}
.todo{color:var(--gold-deep);font-weight:500;border-bottom:1px dashed var(--gold-line);white-space:nowrap}
.draft{display:inline-block;margin-right:.5rem;padding:.1rem .45rem;border:1px solid var(--gold-line);font-size:.6875rem;letter-spacing:.1em;text-transform:uppercase;color:var(--gold-deep);vertical-align:.12em;font-family:var(--sans);font-weight:500}
.notice{margin-top:1.5rem;padding:1rem 1.25rem;border:1px solid var(--line);background:var(--paper-2);font-size:.9375rem;line-height:1.55;color:var(--ink-2)}
.notice p{margin:0}
.notice p + p{margin-top:.5rem}
.page-foot{display:flex;flex-wrap:wrap;gap:1rem 2rem;margin-top:3rem;padding-top:1.5rem;border-top:1px solid var(--line);font-size:.875rem;color:var(--ink-3)}

/* ---------- Danke und 404: eine ruhige Fläche, Siegel-Haken, drei Schritte ---------- */
.thanks{background:var(--wash);display:flex;align-items:center;min-height:calc(100svh - var(--header-h));padding-block:clamp(3rem,8vw,6rem)}
.thanks-grid{display:grid;gap:2.5rem;width:100%}
.thanks .h1{font-size:clamp(2rem,1.3rem + 2vw,3rem);line-height:1.1;max-width:18ch}
.thanks .intro{margin-top:1.25rem}
.thanks .actions{margin-top:2rem}
.thanks .steps{margin-top:0}
.thanks-aside .h4{margin-bottom:.25rem;color:var(--gold-deep)}
@media (min-width:900px){.thanks-grid{grid-template-columns:minmax(0,6fr) minmax(0,6fr);gap:clamp(3rem,6vw,6rem);align-items:start}}

/* ---------- Fuß: die einzige große dunkle Fläche neben der Vergütung; hier stehen Siegel und Wortmarke in ihrem Originalgold ---------- */
.footer{background:linear-gradient(180deg,var(--aub-600) -60%,var(--aub-900) 60%);color:var(--on-dark-2);padding:clamp(3.5rem,7vw,5.5rem) 0 2.5rem}
.footer-top{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1.5rem 2rem}
.footer-brand{display:flex;align-items:center;gap:1.25rem}
.footer-brand .seal{width:3.5rem;height:3.5rem;flex:none}
.footer-brand .brand img{height:1.75rem}
.footer-brand .claim{display:block;margin-top:.45rem;font-size:.6875rem;letter-spacing:.14em;color:var(--gold)}
.footer-nav{display:flex;flex-wrap:wrap;gap:1.75rem}
.footer-nav a{font-size:.8125rem;letter-spacing:.12em;text-transform:uppercase;font-weight:500;color:var(--on-dark-2);padding:.4rem 0;border-bottom:1px solid transparent;transition:color .25s var(--out),border-color .25s var(--out)}
.footer-nav a:hover,.footer-nav a:focus-visible{color:var(--on-dark);border-bottom-color:var(--gold)}
.footer-nav a:active{color:#fff}
.footer-note{margin-top:2.5rem;padding-top:1.5rem;border-top:1px solid var(--line-dark);font-size:.9375rem;color:var(--on-dark-3);max-width:46rem}
.footer-nav{column-gap:1.5rem}
.copy{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.5rem 2rem;margin-top:1.5rem;padding-top:1.5rem;border-top:1px solid var(--line-dark);font-size:.8125rem;color:var(--on-dark-3)}
.copy a{text-decoration:underline;text-underline-offset:.18em;text-decoration-color:rgba(245,241,248,.3);transition:text-decoration-color .25s}
.copy a:hover,.copy a:focus-visible{text-decoration-color:currentColor}

/* ---------- Weiche (Startseite): Marke, Überschrift, eine Frage, zwei gleichwertige Felder in einem gemeinsamen Rahmen ---------- */
.gate{position:relative;background:var(--wash);display:flex;align-items:center;min-height:calc(100svh - var(--header-h) - 3px);padding-block:clamp(1.25rem,4.5vh,3.5rem) clamp(1.5rem,5vh,3.5rem)}
.gate-copy{width:100%}
.gate .h1{margin-top:clamp(1rem,3.2vh,2.25rem);max-width:21ch}
.gate .sub{margin-top:clamp(.85rem,2vh,1.25rem);max-width:40rem}
.gate-ask{display:flex;align-items:center;gap:1.25rem;margin-top:clamp(1.5rem,4.5vh,3.25rem)}
.gate-ask::after{content:"";flex:1;height:1px;background:var(--gold-line);order:1}
.gate-q{font-family:var(--sans);font-weight:500;font-size:.75rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ink);line-height:1.5;white-space:nowrap}
.gate-last{order:2;font-size:.8125rem;color:var(--ink-3);white-space:nowrap}
.gate-last a{display:inline-flex;align-items:center;gap:.4rem;padding:.3rem 0;color:var(--ink-2);border-bottom:1px solid var(--line);transition:color .25s var(--out),border-color .25s var(--out)}
.gate-last a:hover,.gate-last a:focus-visible{color:var(--ink);border-bottom-color:var(--ink)}
.gate-last a:active{color:var(--aub-600)}
.gate-choices{display:grid;margin-top:clamp(.9rem,2vh,1.25rem);border:1px solid var(--line-strong);background:var(--paper)}
.gate-choices > li{min-width:0;display:flex}
.gate-choices > li + li{border-top:1px solid var(--line-strong)}
.choice{position:relative;display:flex;flex-direction:column;gap:.55rem;width:100%;padding:clamp(1.15rem,2.6vw,2.25rem) clamp(1.15rem,2.6vw,2.5rem) clamp(1.25rem,2.8vw,2.5rem);color:var(--ink-2);transition:background-color .35s var(--out)}
.choice::before{content:"";position:absolute;left:0;right:0;top:-1px;height:2px;background:var(--gold);transform:scaleX(.08);transform-origin:left;transition:transform .55s var(--out)}
.choice:hover,.choice:focus-visible{background:var(--aub-50)}
.choice:hover::before,.choice:focus-visible::before{transform:scaleX(1)}
.choice:focus-visible{outline:2px solid var(--aub-600);outline-offset:-5px}
.choice:active{background:var(--aub-100)}
.choice-who{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;font-family:var(--serif);font-weight:600;font-size:clamp(1.45rem,1.1rem + .75vw,1.65rem);line-height:1.15;letter-spacing:-.015em;color:var(--ink);text-wrap:balance}
.choice-who .ic{width:1.1rem;height:1.1rem;margin-top:.32em;color:var(--ink);transition:transform .4s var(--out)}
@media (min-width:1000px){
  .gate-head{display:grid;grid-template-columns:minmax(0,8fr) minmax(0,4fr);column-gap:var(--col-gap);align-items:end}
  .gate-head .sub{margin-top:0;padding-bottom:.6rem}
}
.choice:hover .choice-who .ic,.choice:focus-visible .choice-who .ic{transform:translateX(5px)}
.choice:active .choice-who .ic{transform:translateX(7px)}
.choice-motto{font-family:var(--serif);font-weight:600;font-size:clamp(1.0625rem,1rem + .35vw,1.3rem);line-height:1.3;letter-spacing:-.005em;color:var(--gold-deep)}
.choice-text{margin-top:.2rem;max-width:31rem;font-size:.9375rem;line-height:1.6}
.gate-refs{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.75rem 2.5rem;margin-top:clamp(1.25rem,3.5vh,2.5rem)}
.gate-refs .marks{gap:.75rem clamp(1.75rem,4vw,3.5rem)}
.gate-refs .marks .m-kaisers{height:clamp(44px,2vw + 32px,56px)}
.gate-refs .marks .m-pinkberry{height:clamp(22px,1vw + 16px,28px)}
@media (min-width:760px){
  .gate-choices{grid-template-columns:1fr 1fr}
  .gate-choices > li + li{border-top:0;border-left:1px solid var(--line-strong)}
}
@media (max-width:479px){
  .gate .claim{font-size:.6875rem;letter-spacing:.14em;gap:.9rem}
  .gate .claim img{width:3.25rem;height:3.25rem}
  .gate .h1{font-size:clamp(2.05rem,8.6vw,2.4rem)}
  .gate .sub{font-size:1rem;line-height:1.55}
  .gate-ask{margin-top:1.25rem}
  .choice{gap:.35rem}
  .choice-text{font-size:.9rem;line-height:1.5}
}
@media (max-width:599px){.gate .sub{display:none}}
.rv-on .gate .claim{animation:fadeUp .8s var(--out) both}
.rv-on .gate .h1{animation:fadeUp .9s var(--out) .08s both}
.rv-on .gate .sub{animation:fadeUp .9s var(--out) .16s both}
.rv-on .gate-ask,.rv-on .gate-choices{animation:fadeUp .9s var(--out) .26s both}
.rv-on .gate-refs{animation:fadeUp .9s var(--out) .4s both}

/* ---------- Zielgruppenseiten: Wechsel zur anderen Zielgruppe in der Kopfzeile, Fragen in einer Spalte ---------- */
.switch{display:none;align-items:center;gap:.5rem;padding:.5rem 0 .5rem 1.5rem;border-left:1px solid var(--line);font-weight:500;font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-deep);white-space:nowrap;transition:color .25s var(--out)}
.switch .ic{transition:transform .35s var(--out)}
.switch:hover,.switch:focus-visible{color:var(--ink)}
.switch:hover .ic,.switch:focus-visible .ic{transform:translateX(3px)}
.switch:active{color:var(--aub-600)}
.menu a.menu-switch:not(.btn){color:var(--gold-deep)}
.menu a.menu-switch:not(.btn):hover,.menu a.menu-switch:not(.btn):focus-visible{color:var(--ink)}
@media (min-width:1024px){.switch{display:inline-flex}}
@media (min-width:1024px) and (max-width:1279px){.header .nav{gap:1.5rem}.header .bar{gap:1.25rem}}
.hero .claim-aud{font-size:.8125rem}
.faq-list{display:grid}
.contact-side .cross{margin-top:2.25rem;padding-top:1.5rem;border-top:1px solid var(--line);font-size:.9375rem;color:var(--ink-3)}
.contact-side .cross .link{margin-top:.35rem}

/* ---------- Einblenden (nur mit JS, ohne reduced motion): leise, nur Deckkraft und wenige Pixel ---------- */
.rv-on .rv{opacity:0;transform:translateY(12px);transition:opacity .8s var(--out),transform .8s var(--out)}
.rv-on .rv.in{opacity:1;transform:none}
.rv-on .rv-g > *{opacity:0;transform:translateY(12px);transition:opacity .8s var(--out) var(--d,0s),transform .8s var(--out) var(--d,0s)}
.rv-on .rv-g > .in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition-duration:.01ms !important;animation-duration:.01ms !important}
}