/* Partnerprogramm: Landing (/affiliate) und Dashboard (/affiliate/app). Baut auf den Web-Tokens (body.web) auf.
   Bewegung: ein Hauptmoment im Hero (Karte baut sich auf), sonst Einblenden beim Scrollen; alles mit prefers-reduced-motion im Endzustand. */
.af{--af-r:16px;--af-ease:cubic-bezier(.16,1,.3,1);padding-top:4rem;overflow-x:clip}
.af *{box-sizing:border-box}
.af-w{max-width:1120px;margin:0 auto;padding:0 1.25rem}
.af-narrow{max-width:760px}
.af-mono{font-family:var(--mono)}
.af h1,.af h2,.af h3{margin:0;line-height:1.1}
.af h2{font-size:clamp(1.7rem,3.4vw,2.5rem);margin-bottom:.6rem}
.af-lead{color:var(--w-mut);max-width:60ch;margin:0 0 2rem;font-size:1.08rem}
.af-sec{padding:clamp(3.5rem,8vw,6rem) 0}
.af-alt{background:var(--w-cont)}
.af-btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:.75rem 1.5rem;border-radius:12px;background:var(--w-p);color:var(--w-onp);font:600 1rem var(--body);text-decoration:none;border:1.5px solid var(--w-p);cursor:pointer;transition:transform .2s var(--af-ease),background .2s}
.af-btn:hover{background:var(--w-pl);color:var(--w-onp2);transform:translateY(-1px);text-decoration:none}
.af-btn.ghost{background:transparent;color:var(--w-tx);border-color:var(--w-sub)}.af-btn.ghost:hover{background:var(--w-over);color:var(--w-tx)}
.af-btn:disabled{opacity:.45;cursor:not-allowed;transform:none}
.af-btn.small{min-height:40px;padding:.45rem 1rem;font-size:.9rem}

/* Hero */
.af-hero{padding:clamp(2.5rem,6vw,5rem) 0 clamp(3rem,7vw,5.5rem);position:relative;background:radial-gradient(60rem 28rem at 85% -10%,var(--w-pt),transparent 70%)}
.af-hero-in{display:grid;grid-template-columns:1.1fr .9fr;gap:3rem;align-items:center}
.af-pill{display:inline-flex;align-items:center;gap:.5rem;margin:0 0 1.2rem;padding:.3rem .8rem;border:1px solid var(--w-sub);border-radius:999px;background:var(--w-card);color:var(--w-mut);font:500 .78rem var(--body)}
.af-dot{width:.5rem;height:.5rem;border-radius:50%;background:var(--w-gr)}
.af-hero h1{font-size:clamp(2.2rem,4.6vw,3.8rem);letter-spacing:-.035em;line-height:1.02}
.af-big{display:inline-block;color:var(--w-p);font-variant-numeric:tabular-nums}
.af-sub{margin:1.4rem 0 1.8rem;max-width:52ch;font-size:1.12rem;color:var(--w-mut2)}
.af-cta{display:flex;gap:.8rem;flex-wrap:wrap}
.af-card{margin:0;padding:1.4rem;border-radius:20px;background:var(--w-card);border:1px solid var(--w-sub);box-shadow:0 30px 60px -30px rgba(15,23,42,.35),0 2px 0 var(--w-sub)}
.af-card figcaption{display:flex;justify-content:space-between;align-items:center;gap:1rem;font:600 .85rem var(--body);color:var(--w-mut);margin-bottom:1rem}
.af-badge{padding:.2rem .65rem;border-radius:999px;background:var(--w-pt);color:var(--w-p);font:600 .8rem var(--mono)}
.af-kv{margin:0;display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.af-kv dt{font-size:.78rem;color:var(--w-mut);margin-bottom:.2rem}.af-kv dd{margin:0;font:700 1.7rem var(--display);letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.af-kv .af-main dd{color:var(--w-gr);font-size:2.1rem}
.af-spark{width:100%;height:84px;margin:.8rem 0 .4rem;display:block;overflow:visible}
.af-area{fill:var(--w-pt);stroke:none}.af-line{fill:none;stroke:var(--w-p);stroke-width:3;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.af-sales{list-style:none;margin:0;padding:0;display:grid;gap:.5rem}
.af-sales li{display:grid;grid-template-columns:auto 1fr auto;gap:.7rem;align-items:center;padding:.55rem .75rem;border-radius:12px;background:var(--w-cont);font-size:.88rem}
.af-sales b{font:600 .9rem var(--mono);color:var(--w-gr)}
.af-ava{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--w-p);color:var(--w-onp);font:700 .75rem var(--display)}.af-ava.c2{background:var(--w-cy);color:#04293a}.af-ava.c3{background:var(--w-gr);color:#032d1d}
.af-fine{margin:.8rem 0 0;font-size:.75rem;color:var(--w-mut)}
/* Aufbau einmalig beim Laden */
@media (prefers-reduced-motion:no-preference){
 .af-hero-copy>*{animation:af-up .7s var(--af-ease) both}.af-hero-copy>:nth-child(2){animation-delay:.08s}.af-hero-copy>:nth-child(3){animation-delay:.16s}.af-hero-copy>:nth-child(4){animation-delay:.24s}
 .af-card{animation:af-up .8s var(--af-ease) .25s both}
 .af-line{stroke-dasharray:1;stroke-dashoffset:1;animation:af-draw 1.6s var(--af-ease) .7s forwards}
 .af-area{opacity:0;animation:af-fade .8s ease 1.6s forwards}
 .af-sales li{opacity:0;transform:translateY(10px);animation:af-up .6s var(--af-ease) calc(.9s + var(--i) * .25s) forwards}
 .af-big{animation:af-pop .9s var(--af-ease) .5s both}
}
@keyframes af-up{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes af-draw{to{stroke-dashoffset:0}}
@keyframes af-fade{to{opacity:1}}
@keyframes af-pop{from{opacity:0;transform:scale(.85)}to{opacity:1;transform:none}}

/* Einblenden beim Scrollen (ohne JS sofort sichtbar) */
.js [data-reveal]{opacity:0;transform:translateY(22px);transition:opacity .7s var(--af-ease),transform .7s var(--af-ease);transition-delay:calc(var(--i,0) * .1s)}
.js [data-reveal].in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.js [data-reveal]{opacity:1;transform:none;transition:none}}

/* Schritte */
.af-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem;position:relative}
.af-steps li{position:relative;padding:1.6rem;border-radius:var(--af-r);background:var(--w-card);border:1px solid var(--w-sub)}
.af-steps li::after{content:"";position:absolute;top:2.6rem;right:-1.2rem;width:1.2rem;height:2px;background:linear-gradient(90deg,var(--w-p),transparent)}
.af-steps li:last-child::after{display:none}
.af-ico{display:grid;place-items:center;width:52px;height:52px;border-radius:14px;background:var(--w-pt);margin-bottom:1rem}
.af-ico svg{width:26px;height:26px;fill:none;stroke:var(--w-p);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.af-n{position:absolute;top:1.2rem;right:1.4rem;font:700 2.6rem var(--display);color:var(--w-sub);line-height:1}
.af-steps h3{font-size:1.2rem;margin-bottom:.5rem}.af-steps p{margin:0;color:var(--w-mut2)}

/* Stufen */
.af-tiers{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;align-items:end}
.af-tier h3{font-size:1.15rem;margin:.9rem 0 .2rem}.af-tier p{margin:0;color:var(--w-mut2);font-size:.92rem}
.af-bar{height:240px;display:flex;align-items:flex-end}
.af-bar b{display:flex;align-items:flex-start;justify-content:center;width:100%;height:var(--h);min-height:56px;padding-top:.7rem;border-radius:14px 14px 6px 6px;font:700 1.5rem var(--display);color:var(--w-onp);background:linear-gradient(180deg,var(--w-p),var(--w-pl));transform-origin:bottom;font-variant-numeric:tabular-nums}
.af-tier.t2 .af-bar b{background:linear-gradient(180deg,#6366f1,#4f46e5)}.af-tier.t3 .af-bar b{background:linear-gradient(180deg,#0ea5e9,#4f46e5)}.af-tier.t4 .af-bar b{background:linear-gradient(180deg,#10b981,#0ea5e9);color:#032d1d}
.js .af-tiers[data-reveal] .af-bar b{transform:scaleY(.04);transition:transform 1s var(--af-ease);transition-delay:calc(var(--i) * .15s + .2s)}
.js .af-tiers.in .af-bar b{transform:none}
@media (prefers-reduced-motion:reduce){.js .af-tiers[data-reveal] .af-bar b{transform:none;transition:none}}

/* Rechner */
.af-calc{display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:center}
.af-range{display:grid;grid-template-columns:1fr auto;gap:.3rem .8rem;align-items:center;margin:1.2rem 0;font-weight:500}
.af-range output{font:600 1rem var(--mono);color:var(--w-p)}.af-range input{grid-column:1/-1;width:100%;accent-color:var(--w-p);min-height:32px}
.af-result{display:grid;gap:1rem;padding:1.6rem;border-radius:20px;background:var(--w-card);border:1px solid var(--w-sub)}
.af-result div{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;padding-bottom:1rem;border-bottom:1px solid var(--w-sub)}.af-result div:last-child{border:0;padding:0}
.af-result span{color:var(--w-mut);font-size:.9rem}.af-result b{font:700 1.5rem var(--display);font-variant-numeric:tabular-nums}
.af-result .af-main b{font-size:2.3rem;color:var(--w-gr)}.af-result [hidden]{display:none}

/* Vorteile */
.af-bens{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.af-bens article{position:relative;padding:1.5rem 1.4rem 1.4rem;border-radius:var(--af-r);background:var(--w-card);border:1px solid var(--w-sub);transition:transform .25s var(--af-ease),border-color .25s}
.af-bens article:hover{transform:translateY(-3px);border-color:var(--w-p)}
.af-tick{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--w-gt);color:var(--w-gr);font-weight:700;margin-bottom:.9rem}
.af-bens h3{font-size:1.1rem;margin-bottom:.45rem}.af-bens p{margin:0;color:var(--w-mut2);font-size:.95rem}
.af-who{margin:1.6rem 0 0;padding:1.1rem 1.3rem;border-radius:var(--af-r);background:var(--w-pt);color:var(--w-mut2);max-width:none}
/* Eckdaten, Regeln, FAQ */
.af-facts{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;margin-top:1.6rem}
.af-facts article{padding:1.4rem;border-radius:var(--af-r);background:var(--w-card);border:1px solid var(--w-sub)}.af-facts h3{font-size:1.25rem;margin-bottom:.5rem;color:var(--w-p)}.af-facts p{margin:0;color:var(--w-mut2);font-size:.95rem}
.af-fair{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem}
.af-fair>div{padding:1.6rem;border-radius:var(--af-r);border:1px solid var(--w-sub);background:var(--w-card)}
.af-fair h3{margin-bottom:.8rem;font-size:1.2rem}.af-fair ul{list-style:none;margin:0;padding:0;display:grid;gap:.7rem}
.af-fair li{position:relative;padding-left:1.9rem;color:var(--w-mut2)}
.af-fair li::before{position:absolute;left:0;top:.05rem;font-weight:700;font-size:1.1rem}
.af-do{border-top:3px solid var(--w-gr)!important}.af-do li::before{content:"✓";color:var(--w-gr)}
.af-dont{border-top:3px solid var(--w-err)!important}.af-dont li::before{content:"✕";color:var(--w-err)}
details{border-bottom:1px solid var(--w-sub);padding:1.1rem 0}
details summary{cursor:pointer;font:600 1.08rem var(--body);list-style:none;display:flex;justify-content:space-between;gap:1rem;min-height:32px}
details summary::-webkit-details-marker{display:none}details summary::after{content:"+";font:400 1.5rem/1 var(--mono);color:var(--w-p);transition:transform .25s var(--af-ease)}
details[open] summary::after{transform:rotate(45deg)}details p{margin:.8rem 0 0;color:var(--w-mut2);max-width:62ch}
.af-final{padding:clamp(3.5rem,8vw,6rem) 0;text-align:center;background:linear-gradient(135deg,#312e81,#4f46e5 55%,#0ea5e9);color:#fff}
.af-final h2{font-size:clamp(2rem,4.4vw,3.2rem)}.af-final p{opacity:.9;max-width:50ch;margin:.8rem auto 1.6rem}
.af-final .af-btn{background:#fff;color:#312e81;border-color:#fff}.af-final .af-btn:hover{background:#eef2ff;color:#312e81}
.af-final .af-links{font-size:.9rem;margin-top:1.6rem}.af-final a:not(.af-btn){color:#fff;text-decoration:underline}

@media (max-width:900px){
 .af-hero-in,.af-calc,.af-fair{grid-template-columns:1fr}
 .af-steps,.af-facts,.af-bens{grid-template-columns:1fr 1fr}.af-steps li::after{display:none}
 .af-tiers{grid-template-columns:repeat(2,1fr)}.af-bar{height:150px}
}
@media (max-width:560px){.af-steps,.af-facts,.af-bens{grid-template-columns:1fr}.af-kv dd{font-size:1.4rem}.af-kv .af-main dd{font-size:1.7rem}}

/* ---------- Dashboard ---------- */
.afd{max-width:1120px;margin:0 auto;padding:5.5rem 1.25rem 4rem}
.afd p{max-width:none}
.afd h1{font-size:clamp(1.6rem,3vw,2.2rem);margin:0 0 .3rem}
.afd-top{display:flex;justify-content:space-between;align-items:flex-end;gap:1rem;flex-wrap:wrap;margin-bottom:1.4rem}
.afd-tabs{display:flex;gap:.3rem;overflow-x:auto;padding:.25rem;border:1px solid var(--w-sub);border-radius:12px;background:var(--w-card);margin-bottom:1.4rem;scrollbar-width:none}
.afd-tabs button{flex:none;min-height:40px;padding:.4rem .95rem;border:0;border-radius:9px;background:transparent;color:var(--w-mut);font:500 .9rem var(--body);cursor:pointer}
.afd-tabs button[aria-selected=true]{background:var(--w-p);color:var(--w-onp)}
.afd-card{padding:1.3rem;border-radius:var(--af-r,16px);background:var(--w-card);border:1px solid var(--w-sub);margin-bottom:1rem}
.afd-card h2{font-size:1.15rem;margin:0 0 .9rem}
.afd-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:.8rem;margin-bottom:1rem}
.afd-kpi{padding:1rem 1.1rem;border-radius:14px;background:var(--w-card);border:1px solid var(--w-sub)}.afd-kpi span{display:block;font-size:.78rem;color:var(--w-mut)}
.afd-kpi b{display:block;font:700 1.6rem var(--display);font-variant-numeric:tabular-nums;margin-top:.2rem}.afd-kpi.good b{color:var(--w-gr)}.afd-kpi small{color:var(--w-mut);font-size:.75rem}
.afd-row{display:flex;gap:.7rem;flex-wrap:wrap;align-items:center}
.afd-grid2{display:grid;grid-template-columns:1.6fr 1fr;gap:1rem}
.afd form{display:grid;gap:.9rem;max-width:520px}.afd label{display:grid;gap:.3rem;font-weight:500;font-size:.92rem}
.afd input,.afd select{min-height:44px;padding:.5rem .8rem;border-radius:10px;border:1px solid var(--w-sub);background:var(--w-bg);color:var(--w-tx);font:400 1rem var(--body)}
.afd input[type=checkbox]{min-height:0;width:20px;height:20px;accent-color:var(--w-p)}.afd .check{display:flex;gap:.6rem;align-items:flex-start;font-weight:400}
.afd table{width:100%;border-collapse:collapse;font-size:.9rem}.afd th{text-align:left;color:var(--w-mut);font-weight:500;padding:.5rem .6rem;border-bottom:1px solid var(--w-sub)}
.afd td{padding:.6rem;border-bottom:1px solid var(--w-sub);font-variant-numeric:tabular-nums}.afd .num{text-align:right;font-family:var(--mono)}
.afd .tw{overflow-x:auto}
.afd-pill{display:inline-block;padding:.12rem .55rem;border-radius:999px;font:600 .74rem var(--body);background:var(--w-over);color:var(--w-mut2)}.afd-pill.paid{background:var(--w-gt);color:var(--w-gr)}.afd-pill.bad{background:var(--w-wt);color:var(--w-warn)}
.afd-err{color:var(--w-err);margin:.4rem 0}.afd-ok{color:var(--w-gr);margin:.4rem 0}.afd-muted{color:var(--w-mut);font-size:.9rem}
.afd-bar{height:12px;border-radius:999px;background:var(--w-over);overflow:hidden;margin:.6rem 0}.afd-bar i{display:block;height:100%;width:var(--p,0%);border-radius:999px;background:linear-gradient(90deg,var(--w-p),var(--w-cy));transition:width 1s var(--af-ease,ease)}
.afd-tiers{display:flex;gap:.4rem;flex-wrap:wrap}.afd-tiers span{padding:.2rem .6rem;border-radius:8px;border:1px solid var(--w-sub);font:500 .78rem var(--mono);color:var(--w-mut)}.afd-tiers span.on{border-color:var(--w-p);color:var(--w-p);background:var(--w-pt)}
.afd-copy{display:flex;gap:.5rem;align-items:stretch}.afd-copy input{flex:1;font-family:var(--mono);font-size:.88rem}
.afd-chart{width:100%;height:auto;display:block}.afd-chart text{font:500 10px var(--mono);fill:var(--w-mut)}
.afd-seg{display:inline-flex;border:1px solid var(--w-sub);border-radius:10px;overflow:hidden}.afd-seg button{min-height:36px;padding:.2rem .8rem;border:0;background:transparent;color:var(--w-mut);font:500 .85rem var(--body);cursor:pointer}.afd-seg button[aria-pressed=true]{background:var(--w-p);color:var(--w-onp)}
.afd-auth{max-width:440px;margin:3rem auto}
.afd-tabs-auth{display:flex;gap:.5rem;margin-bottom:1rem}
.afd-google{display:flex;align-items:center;justify-content:center;gap:.7rem;min-height:46px;border-radius:10px;border:1px solid var(--w-sub);background:#fff;color:#1f1f1f;text-decoration:none;font:500 .95rem var(--body)}
.afd-pre{white-space:pre-wrap;padding:.9rem;border-radius:10px;background:var(--w-cont);font-size:.92rem;margin:.4rem 0}
@media (max-width:820px){.afd-grid2{grid-template-columns:1fr}}
@media (prefers-reduced-motion:no-preference){.afd-card,.afd-kpi{animation:af-up .5s var(--af-ease,ease) both}}

/* Onboarding */
.afo{max-width:760px;margin:0 auto}
.afo-steps{display:flex;gap:.4rem;margin:1rem 0 1.6rem;padding:0;list-style:none;counter-reset:s}
.afo-steps li{flex:1;display:grid;gap:.35rem;justify-items:start;font:500 .78rem var(--body);color:var(--w-mut)}
.afo-steps li::before{counter-increment:s;content:counter(s);display:grid;place-items:center;width:28px;height:28px;border-radius:50%;border:1.5px solid var(--w-sub);font:600 .8rem var(--mono);background:var(--w-card)}
.afo-steps li.on{color:var(--w-tx)}.afo-steps li.on::before{background:var(--w-p);border-color:var(--w-p);color:var(--w-onp)}
.afo-steps li.done::before{content:"✓";background:var(--w-gt);border-color:var(--w-gr);color:var(--w-gr)}
.afo-bar{height:6px;border-radius:99px;background:var(--w-over);margin-bottom:1.4rem;overflow:hidden}.afo-bar i{display:block;height:100%;width:var(--p);background:linear-gradient(90deg,var(--w-p),var(--w-cy));transition:width .6s var(--af-ease)}
.afo-card{padding:1.6rem;border-radius:20px;background:var(--w-card);border:1px solid var(--w-sub);animation:af-up .5s var(--af-ease) both}
.afo-card h2{font-size:1.5rem;margin:0 0 .4rem}.afo-nav{display:flex;justify-content:space-between;gap:1rem;margin-top:1.4rem;flex-wrap:wrap}
.afo-ben{display:grid;grid-template-columns:1fr 1fr;gap:.7rem;margin:1rem 0}.afo-ben div{padding:.9rem 1rem;border-radius:12px;background:var(--w-cont)}.afo-ben b{display:block;margin-bottom:.2rem}.afo-ben span{font-size:.88rem;color:var(--w-mut2)}
.afo-ex{display:grid;grid-template-columns:repeat(3,1fr);gap:.7rem;margin:.8rem 0}.afo-ex div{padding:1rem;border-radius:14px;border:1px solid var(--w-sub);text-align:center}.afo-ex strong{display:block;font:700 1.6rem var(--display);color:var(--w-gr);margin:.3rem 0}.afo-ex small{display:block;color:var(--w-mut);font-size:.78rem}
.afo ul{padding-left:1.2rem;color:var(--w-mut2)}
.afd-gs{list-style:none;padding:0;margin:.4rem 0 0;display:grid;gap:.5rem}.afd-gs li{display:flex;gap:.6rem;align-items:center}.afd-gs li::before{content:"";width:18px;height:18px;border-radius:50%;border:2px solid var(--w-sub);flex:none}.afd-gs li.ok::before{background:var(--w-gr);border-color:var(--w-gr)}
.afd-gs li.ok{color:var(--w-mut);text-decoration:line-through}
@media (max-width:640px){.afo-ben,.afo-ex{grid-template-columns:1fr}.afo-steps li span{display:none}}