.funnel-page{min-height:100svh;background:#111214}.funnel-header{max-width:1340px;margin:auto;display:flex;align-items:center;justify-content:space-between;padding:30px 48px;border-bottom:1px solid #ffffff0a;gap:25px}.funnel-header>.logo{font-size:39px}.funnel-header>span{color:#777480;font-size:12px;margin-right:auto}.funnel-progress{width:130px}.funnel-progress>span{display:block;text-align:right;font-size:11px;color:#aca4b8;margin-bottom:10px}.funnel-progress>div{height:3px;background:#2e2935;border-radius:5px;overflow:hidden}.funnel-progress i{display:block;height:100%;width:33.333%;background:#c0a5f5;transition:width .5s}.funnel-main{width:min(1040px,calc(100% - 64px));margin:auto;position:relative;padding:35px 0 70px}.funnel-glow{pointer-events:none;position:absolute;top:0;left:50%;transform:translateX(-50%);width:min(750px,100%);height:480px;background:radial-gradient(ellipse,#8561af12,transparent 65%);z-index:-1}.funnel-step{animation:step-appear .5s cubic-bezier(.2,.7,.2,1)}.funnel-step[hidden]{display:none}.funnel-intro{text-align:center}.funnel-sculpture{height:106px;display:grid;place-items:center;margin-bottom:15px}.funnel-sculpture .loop-mark{width:109px;height:97px}.funnel-sculpture .loop-mark:before,.funnel-sculpture .loop-mark:after{border-width:14px}.funnel-page h1{font-size:52px;margin:0 0 18px;letter-spacing:-2.8px;font-weight:600;outline:none}.funnel-page h1 span{color:#bd9fea}.funnel-intro>p,.narrow-step>p{font-size:14px;line-height:1.8;color:#99929f}.package-options{padding:0;margin:38px 0 0;border:0;display:grid;grid-template-columns:repeat(3,1fr);gap:17px}.package-option{margin:0;cursor:pointer;position:relative}.package-option>input,.contact-options input{position:absolute;width:1px;height:1px;opacity:0;padding:0;overflow:hidden;pointer-events:none}.package-inner{display:block;border:1px solid #ffffff1b;background:linear-gradient(150deg,#23202990,#17171a);border-radius:17px;padding:25px;transition:transform .25s,border-color .25s,background .25s;min-height:320px}.package-option:hover .package-inner{transform:translateY(-5px);border-color:#b498d46b}.package-option input:checked+.package-inner{border-color:#b89add;background:linear-gradient(150deg,#3b2c4e,#201b28);box-shadow:0 0 0 1px #ac8ccd33,0 15px 50px #0002}.package-option input:focus-visible+.package-inner,.contact-options input:focus-visible+span{outline:2px solid #d4bbff;outline-offset:5px}.package-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:25px}.selection-check{display:grid;place-items:center;border:1px solid #ffffff30;border-radius:50%;width:22px;height:22px;color:transparent}.package-option input:checked+.package-inner .selection-check{color:#292032;background:#c4a8f4;border-color:#c4a8f4}.package-drawing{width:49px;height:46px;display:block;position:relative}.package-drawing i{position:absolute;border:1px solid #d8b8ffab;border-radius:5px;width:35px;height:38px;left:5px;top:3px;background:linear-gradient(135deg,#b398d480,#51386b);transform:rotate(-10deg);box-shadow:3px 4px 0 #6d4b8d}.drawing-one i:after{content:'';position:absolute;inset:10px 6px;border-top:3px solid #e7d5ff80;border-bottom:8px solid #e7d5ff40}.drawing-business i:last-child{left:16px;top:10px;background:linear-gradient(135deg,#c4ade9,#6c4f8d)}.drawing-custom i{width:24px;height:24px;top:1px}.drawing-custom i:nth-child(2){left:27px;top:10px}.drawing-custom i:nth-child(3){left:7px;top:26px;background:#bddb93;border-color:#d1edac;box-shadow:3px 4px 0 #64844b}.package-inner>strong{display:block;color:#f0eaf6;font-size:20px;font-weight:500;letter-spacing:-.5px;margin-bottom:12px}.package-description{display:block;font-size:12px;line-height:1.8;color:#aca2b7}.package-features{display:block;border-top:1px solid #ffffff0d;padding-top:20px;margin-top:20px;line-height:2;font-size:11px;color:#968ba4}.package-bottom{display:flex;justify-content:space-between;align-items:center;font-size:10px;color:#ccb8e4;margin-top:26px;gap:5px}.package-bottom>span{font-size:19px}.funnel-actions{display:flex;justify-content:center}.funnel-next{min-width:200px;justify-content:space-between;font-size:13px;padding:18px 25px}.funnel-error{color:#f1a3b5;min-height:21px;font-size:12px;line-height:1.6;margin:13px 0;text-align:center}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.narrow-step{max-width:530px;margin:45px auto 0}.narrow-step h1{font-size:49px}.step-art{position:relative;width:130px;height:110px;margin-bottom:35px}.hello-orb,.message-orb{display:grid;place-items:center;width:90px;height:90px;border-radius:27px;background:linear-gradient(135deg,#ddc6ff,#a982d7 65%,#70548d);color:#342345;font-family:Manrope,sans-serif;font-size:44px;font-weight:700;letter-spacing:-3px;transform:rotate(-9deg);box-shadow:5px 7px 0 #654481,10px 20px 35px #0005;animation:loop-drift 6s ease-in-out infinite}.hello-bubble,.message-bubble{position:absolute;right:0;bottom:5px;background:#d0eab0;color:#40512c;padding:12px 18px;border-radius:18px 18px 18px 4px;font-size:17px;font-weight:600;transform:rotate(8deg);animation:bob 5s ease-in-out infinite}.funnel-label{margin:35px 0 12px;font-size:12px;color:#c2b4d0}.big-input{background:#1a191e;border:1px solid #ffffff25;border-radius:12px;padding:21px;font-size:21px;letter-spacing:-.5px;color:#f3edf9;width:100%;margin:0;transition:border-color .2s,box-shadow .2s}.big-input:focus{border-color:#bb9ce6;box-shadow:0 0 0 3px #ab8bda12}.big-input[aria-invalid=true]{border-color:#da839b}.big-input::placeholder{color:#62586f}.narrow-step .funnel-error{text-align:left}.narrow-step .funnel-next{width:100%;margin-top:20px}.contact-options{border:0;padding:0;display:flex;gap:10px;margin:28px 0 0}.contact-options label{flex:1;margin:0;cursor:pointer;position:relative}.contact-options label>span{display:block;text-align:center;padding:14px 10px;border:1px solid #ffffff20;border-radius:9px;color:#b3a8c0;background:#ffffff03;font-size:12px;transition:background .2s,border-color .2s}.contact-options input:checked+span{color:#e6d5ff;border-color:#b49ad6;background:#b296d81c}.contact-options+.funnel-label{margin-top:24px}.contact-hint{font-size:11px;color:#887c97;margin-top:10px}.lead-summary{display:flex;gap:15px;justify-content:space-between;font-size:11px;color:#aaa0b6;border-top:1px solid #ffffff15;padding-top:20px;overflow-wrap:anywhere}.consent-check{display:flex;align-items:flex-start;gap:11px;margin:20px 0 0;cursor:pointer;font-size:12px;line-height:1.6;color:#b3a8c0;position:relative}.consent-check input{position:absolute;width:1px;height:1px;opacity:0;margin:0;padding:0;pointer-events:none}.consent-box{flex:none;width:20px;height:20px;display:grid;place-items:center;border:1px solid #ffffff40;border-radius:6px;background:#1a191e;color:transparent;font-size:12px;transition:background .2s,border-color .2s}.consent-check:hover .consent-box{border-color:#b49ad6}.consent-check input:checked+.consent-box{background:#c4a8f4;border-color:#c4a8f4;color:#292032}.consent-check input:focus-visible+.consent-box{outline:2px solid #d4bbff;outline-offset:3px}.consent-check input[aria-invalid=true]+.consent-box{border-color:#da839b}.consent-check+.funnel-error{margin:6px 0 0;min-height:0}.complete-art{width:95px;height:95px;display:grid;place-items:center;border-radius:28px;background:linear-gradient(135deg,#dbf2bd,#a9cb83);color:#3b512c;font-size:47px;box-shadow:5px 7px 0 #54723d;transform:rotate(-8deg);margin-bottom:40px;animation:loop-drift 6s ease-in-out infinite}.complete-summary{margin-top:35px;border:1px solid #ffffff1a;padding:10px 25px;border-radius:14px;background:#201c26}.complete-summary>div{padding:17px 0;border-bottom:1px solid #ffffff10}.complete-summary>div:last-child{border:0}.complete-summary dt{font-size:11px;color:#93849f;margin-bottom:7px}.complete-summary dd{margin:0;color:#dfd2ed;font-size:16px;overflow-wrap:anywhere}@keyframes step-appear{from{opacity:0;transform:translateY(13px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:760px){.funnel-header{padding:22px 25px}.funnel-header>span{display:none}.funnel-main{width:calc(100% - 40px);padding-top:25px}.package-options{gap:11px}.package-inner{padding:17px}.package-inner>strong{font-size:17px}.package-bottom{font-size:9px}.funnel-page h1{font-size:42px}}
@media(max-width:580px){.funnel-header{padding:18px 22px}.funnel-header .logo{font-size:32px}.funnel-progress{width:100px}.funnel-main{padding-top:20px}.funnel-sculpture{height:73px;margin-bottom:18px}.funnel-sculpture .loop-mark{width:83px;height:73px}.funnel-sculpture .loop-mark:before,.funnel-sculpture .loop-mark:after{border-width:11px}.funnel-page h1{font-size:35px;letter-spacing:-1.6px;margin-bottom:11px}.funnel-intro>p,.narrow-step>p{font-size:12px}.package-options{grid-template-columns:1fr;margin-top:25px;gap:10px}.package-inner{min-height:0;padding:18px 18px 18px 83px;position:relative}.package-top{position:absolute;left:19px;top:20px;margin:0}.package-drawing{scale:.8;transform-origin:left top}.selection-check{position:absolute;left:calc(100vw - 103px);top:3px;width:18px;height:18px;font-size:10px}.package-inner>strong{font-size:17px;margin-bottom:7px;padding-right:20px}.package-description{font-size:11px;line-height:1.6}.package-features,.package-bottom{display:none}.funnel-error{margin:9px 0;min-height:18px}.funnel-next{width:100%;padding:16px 22px}.narrow-step{margin:30px auto 0}.narrow-step h1{font-size:37px}.step-art{margin-bottom:25px;scale:.88;transform-origin:left bottom}.big-input{font-size:18px;padding:18px}.funnel-label{margin-top:27px}.contact-options{gap:8px}.contact-options label>span{font-size:11px}.complete-art{width:80px;height:80px;font-size:39px}.complete-summary{padding:7px 20px}}

.contact-options+.funnel-error{margin:8px 0 0;min-height:0}
.contact-field .funnel-label{display:block;margin-top:22px}
.contact-field .funnel-error{margin:6px 0 0;min-height:0}
.contact-options input:checked+span::before{content:"✓ ";color:#d4bbff}
.lead-summary{flex-direction:column;align-items:flex-start;gap:6px;font-size:15px;color:#dfd2ed}

/* Anfrage-Ablauf direkt auf der Startseite: links Überschrift, rechts kompaktes Formular */
.contact.has-funnel{grid-template-columns:1fr minmax(0,440px);gap:60px;align-items:start}
.inline-funnel{position:relative;min-width:0}
.inline-funnel .funnel-progress{width:110px;margin:0 0 4px auto}
.inline-funnel .funnel-intro{text-align:left}
.inline-funnel .funnel-title{font-size:30px;margin:0 0 8px;letter-spacing:-1.3px;font-weight:600;outline:none}
.inline-funnel .funnel-title span{color:#bd9fea}
.inline-funnel .funnel-intro>p,.inline-funnel .narrow-step>p{font-size:12px;line-height:1.7;margin:0}
/* Pakete als kompakte Liste */
.inline-funnel .package-options{grid-template-columns:1fr;gap:10px;margin-top:20px}
.inline-funnel .package-inner{min-height:0;padding:15px 44px 15px 74px;border-radius:13px;position:relative}
.inline-funnel .package-option:hover .package-inner{transform:translateY(-2px)}
.inline-funnel .package-top{position:absolute;left:15px;top:14px;right:15px;margin:0}
.inline-funnel .package-drawing{scale:.8;transform-origin:left top}
.inline-funnel .selection-check{position:absolute;left:auto;right:0;top:2px;width:18px;height:18px;font-size:10px}
.inline-funnel .package-inner>strong{font-size:16px;margin-bottom:4px}
.inline-funnel .package-description{font-size:11px;line-height:1.6}
.inline-funnel .package-features,.inline-funnel .package-bottom{display:none}
/* Schritte 2–4 kompakt */
.inline-funnel .narrow-step{max-width:none;margin:6px 0 0}
.inline-funnel .step-art{scale:.6;transform-origin:left bottom;height:80px;margin:-10px 0 14px}
.inline-funnel .funnel-label{margin:20px 0 8px}
.inline-funnel .big-input{font-size:15px;padding:13px 15px;border-radius:10px;letter-spacing:0}
.inline-funnel .contact-options{margin-top:18px}
.inline-funnel .contact-options label>span{padding:11px 8px;font-size:11px}
.inline-funnel .contact-field .funnel-label{margin-top:16px}
.inline-funnel .lead-summary{font-size:13px;padding-top:14px;margin-top:14px}
.inline-funnel .consent-check{margin-top:14px;font-size:11px}
.inline-funnel .narrow-step .funnel-next{margin-top:12px;padding:15px 22px}
.inline-funnel .complete-art{width:64px;height:64px;font-size:30px;border-radius:20px;margin-bottom:22px}
.inline-funnel .complete-summary{margin-top:20px;padding:4px 18px}
.inline-funnel .complete-summary>div{padding:11px 0}
.inline-funnel .complete-summary dd{font-size:14px}
@media(max-width:900px){.contact.has-funnel{grid-template-columns:1fr;gap:30px}.has-funnel .contact-loop{display:none}}
.narrow-step>.funnel-error{color:#f1a3b5}
.funnel-header>span{color:#9a97a3}
.contact-hint{color:#9b92a8}
.big-input::placeholder{color:#8f8a99}

/* Zurück-Button (nur Schritt 2 → Schritt 1) */
.funnel-back{display:inline-flex;align-items:center;gap:7px;background:none;border:0;padding:6px 0;margin:0 0 14px;font:inherit;font-size:12px;color:#b3a8c0;cursor:pointer}
.funnel-back:hover{color:#fff}
.funnel-back span{transition:transform .2s}
.funnel-back:hover span{transform:translateX(-3px)}

/* Kontakt-Schritt kompakt, sobald mehrere Kontaktwege gewählt sind */
.multi-contact .contact-hint{display:none}
/* Grafik wandert groß und transparent in den Hintergrund oben links, statt Platz wegzunehmen */
.narrow-step.multi-contact{position:relative;isolation:isolate}
.multi-contact .step-art,.inline-funnel .multi-contact .step-art{position:absolute;top:-58px;left:-86px;margin:0;height:110px;scale:1.5;transform-origin:left top;opacity:.24;filter:saturate(1.3);z-index:-1;pointer-events:none}
.multi-contact .step-art .message-orb,.multi-contact .step-art .message-bubble{box-shadow:none}
@media(max-width:640px){.multi-contact .step-art,.inline-funnel .multi-contact .step-art{left:-10px;top:-40px;scale:1.2}}
.multi-contact .contact-options{margin-top:18px}
.multi-contact .contact-field .funnel-label{margin:12px 0 6px}
.multi-contact .big-input{padding:14px 16px;font-size:16px}
.multi-contact .lead-summary{margin-top:14px;padding-top:12px}
.multi-contact .consent-check{margin-top:12px}
.multi-contact .funnel-next{margin-top:12px}
.funnel-page .narrow-step.multi-contact{margin-top:15px}
.multi-contact .funnel-title,.funnel-page .multi-contact h1{margin-bottom:8px}
.multi-contact .contact-field .funnel-label{margin:10px 0 5px}
.multi-contact .big-input{padding:12px 15px}

/* Kontakt-Schritt: fester Aufbau. Fläche für 3 Felder ist immer reserviert,
   nur die Feldgröße passt sich an (1 Feld groß, 3 Felder kompakt) – nichts springt. */
.contact-fields{display:flex;flex-direction:column;gap:10px;min-height:232px;margin-top:10px}
.multi-contact .contact-fields .contact-field .funnel-label{margin:0 0 5px}
.multi-contact .contact-fields .big-input{transition:height .25s ease,font-size .25s ease}
.multi-contact[data-count="1"] .big-input{height:96px;font-size:24px;padding:0 20px}
.multi-contact[data-count="2"] .big-input{height:70px;font-size:19px;padding:0 18px}
.multi-contact[data-count="3"] .big-input{height:47px;font-size:15px;padding:0 15px}

/* /anfrage: alles auf einen Bildschirm – Header, Schritt und Footer */
.funnel-page{display:flex;flex-direction:column;min-height:100svh}
.funnel-page .funnel-header{padding-block:18px}
.funnel-page .funnel-main{flex:1;padding:22px 0 20px}
.funnel-page footer.site-footer{margin-top:0;padding-block:14px 16px;grid-template-columns:1fr auto auto;align-items:center}
.funnel-page .site-footer .logo{font-size:24px}
.funnel-page .footer-copy{grid-column:auto}
@media(max-width:640px){.funnel-page footer.site-footer{grid-template-columns:1fr;gap:8px;padding-block:12px}.funnel-page .site-footer .logo{display:none}.funnel-page .footer-business{font-size:10px}}

/* Feste Fläche exakt für 3 Felder (Label ~28px + Feld) – Button bleibt bei 1/2/3 Kanälen an derselben Stelle */
.contact-fields{--h3:47px;min-height:calc(3 * (var(--h3) + 28px) + 20px)}
.multi-contact[data-count="3"] .big-input{height:var(--h3)}
/* Zusammenfassung über dem Button in einer Zeile */
.multi-contact .lead-summary{flex-direction:row;flex-wrap:wrap;gap:4px 14px;font-size:13px}
.multi-contact .lead-summary span+span::before{content:'· ';color:#9a97a3}
/* Fertig-Seite: kompakte Zusammenfassung (Bezeichnung links, Wert rechts) */
.complete-summary>div{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:11px 0}
.complete-summary dt{margin:0;flex:none}
.complete-summary dd{text-align:right;font-size:14px}
.funnel-page .complete-art{width:72px;height:72px;font-size:34px;border-radius:22px;margin-bottom:24px}

/* /anfrage auf niedrigeren Bildschirmen (z. B. Laptop 1366×768) */
@media(max-height:860px) and (min-width:641px){
.funnel-page .funnel-header{padding-block:12px}
.funnel-page .funnel-sculpture{display:none}
.funnel-page .narrow-step{margin-top:18px}
.funnel-page .narrow-step h1{font-size:42px;margin-bottom:10px}
.funnel-page .step-art{scale:.8;transform-origin:left bottom;height:90px;margin-bottom:18px}
.funnel-page .package-inner{min-height:0}
}
/* /anfrage auf dem Handy */
@media(max-width:640px){
.funnel-page .funnel-header{padding-block:12px}
.funnel-page .funnel-sculpture{display:none}
.funnel-page .footer-business{display:none}
.funnel-page footer.site-footer{grid-template-columns:1fr auto;gap:6px 14px}
.funnel-page .narrow-step{margin-top:10px}
.contact-fields{--h3:42px}
.multi-contact[data-count="1"] .big-input{height:84px;font-size:21px}
.multi-contact[data-count="2"] .big-input{height:62px;font-size:18px}
}
@media(max-width:640px) and (max-height:700px){
.funnel-page .multi-contact #contact-intro{display:none}
.funnel-page .narrow-step h1{font-size:32px}
.funnel-page .step-art{scale:.75;height:80px;margin-bottom:12px}
}
@media(max-height:860px) and (min-width:641px){.funnel-page .multi-contact .contact-options{margin-top:10px}.funnel-page .contact-fields{margin-top:6px}.funnel-page .multi-contact .lead-summary{margin-top:10px;padding-top:10px}}
@media(max-width:640px) and (max-height:700px){.funnel-page .multi-contact .contact-options{margin-top:10px}.funnel-page .contact-fields{margin-top:4px;--h3:40px;gap:8px}.funnel-page .multi-contact .lead-summary{margin-top:8px;padding-top:8px}.funnel-page .multi-contact .consent-check{margin-top:8px}.funnel-page .multi-contact .funnel-next{margin-top:8px}}
.funnel-page .funnel-header{width:100%;box-sizing:border-box}
.multi-contact .lead-summary{justify-content:flex-start}
/* Browser soll beim Ein-/Ausblenden der Kontaktfelder NICHT die Scrollposition korrigieren (sonst springt die Seite) */
html:has(.multi-contact:not([hidden])),.inline-funnel,.funnel-main{overflow-anchor:none}
@media(max-width:640px) and (max-height:700px){.inline-funnel .multi-contact #contact-intro{display:none}}
/* Zoom-Ausgleich (siehe style.css): /anfrage bleibt genau bildschirmhoch, Eingabefelder bleiben in Originalgröße */
.funnel-page{min-height:calc(100svh / var(--z, 1))}
.contact-fields .big-input,#lead-name{zoom:calc(1 / var(--z, 1))}
@media(min-width:1500px) and (max-height:960px){.funnel-page .funnel-sculpture{display:none}}

/* /anfrage: NIEMALS scrollen, NIEMALS Scrollbalken. Das Formular wird per JS immer passend verkleinert. */
html:has(body.funnel-page){overflow:hidden}
/* Kompakteres Formular: kleinere Kontaktweg-Buttons und Abstände */
.funnel-page .contact-options{gap:8px;margin-top:14px}
.funnel-page .contact-options label>span{padding:8px 6px;font-size:11px;border-radius:8px}
.funnel-page .multi-contact .contact-options{margin-top:12px}
.funnel-page .contact-fields{margin-top:4px}
.funnel-page .narrow-step>p{line-height:1.6}
/* Neues Kontaktfeld sanft einblenden, nachdem die anderen Felder kleiner geworden sind */
.contact-field.field-enter{animation:field-in .22s ease-out}
@keyframes field-in{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}

/* Anfrage-Formular: Spam-Falle (für Menschen unsichtbar) und Sende-Zustand */
.hp-field{position:absolute!important;left:-10000px;width:1px;height:1px;overflow:hidden}
.funnel-next[aria-busy="true"]{opacity:.65;cursor:progress;pointer-events:none}
#send-error{color:#f1a3b5;margin:12px 0 0;min-height:0}