#wdl{--bg:#07090F;--surf:#0D1118;--card:#111820;--acc:#00C896;--acc2:#00DFAC;--aglow:rgba(0,200,150,.18);--adim:rgba(0,200,150,.07);--txt:#EDF2FF;--sub:#8A96A6;--mute:#465362;--line:rgba(255,255,255,.07);--fh:'Poppins',sans-serif;--fb:'Hind',sans-serif;--fs:'Architects Daughter',cursive;--r:12px;--maxw:1120px;display:block !important;width:100% !important;max-width:none !important;margin:0 !important;padding:0 !important;background:var(--bg);color:var(--txt);font-family:var(--fb);font-size:17px;line-height:1.72;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden;box-sizing:border-box}#wdl *,#wdl *::before,#wdl *::after{box-sizing:border-box}#wdl a{text-decoration:none;color:inherit}#wdl ul{list-style:none;margin:0;padding:0}#wdl img{display:block;max-width:100%}#wdl button{font-family:inherit;cursor:pointer}#wdl h1,#wdl h2,#wdl h3{margin:0;font-family:var(--fh)}#wdl p{margin:0}#wdl svg{display:block}.wdl-s{display:block;width:100%;padding:100px 0}.wdl-s0{background:var(--bg)}.wdl-s1{background:var(--surf)}.wdl-w{max-width:var(--maxw);margin:0 auto;padding:0 52px}.wdl-chip{display:inline-flex;align-items:center;gap:10px;font-family:var(--fs);font-size:16px;color:var(--acc);margin-bottom:22px}.wdl-chip::before{content:'';display:block;width:18px;height:1px;background:var(--acc);flex-shrink:0}.wdl-h2{font-size:clamp(32px,4.6vw,52px);font-weight:900;line-height:1.1;letter-spacing:-.02em;color:var(--txt);margin-bottom:28px}.wdl-h2 em{color:var(--acc);font-style:normal}.wdl-lead{font-size:18px;color:var(--sub);line-height:1.76;max-width:720px;margin-bottom:52px}.wdl-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-family:var(--fh);font-weight:700;font-size:14px;padding:15px 30px;border-radius:999px;border:none;transition:transform .22s ease,background .22s ease,color .22s ease,border-color .22s ease,box-shadow .22s ease;white-space:nowrap;cursor:pointer}.wdl-btn svg{transition:transform .22s ease}.wdl-btn:hover svg{transform:translateX(3px)}.wdl-bg{background:var(--acc);color:#071015;box-shadow:0 12px 28px rgba(0,200,150,.08)}.wdl-bg:hover{background:var(--acc2);color:#071015;transform:translateY(-2px);box-shadow:0 16px 34px var(--aglow)}.wdl-br{background:transparent;color:var(--txt);border:1.5px solid var(--line)}.wdl-br:hover{border-color:var(--acc);color:var(--acc);transform:translateY(-2px)}.wdl-ph{background:var(--card);border:1.5px dashed var(--mute);border-radius:var(--r);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;color:var(--mute);font-size:13px;text-align:center;padding:32px 24px}.wdl-ph strong{color:var(--sub);font-weight:600;font-family:var(--fh);font-size:14px}.wdl-ph small{font-size:12px;opacity:.7}#wdl-hero{position:relative;min-height:100vh;min-height:100svh;display:flex;align-items:center;background:var(--bg);padding:136px 0 96px;overflow:hidden}#wdl-hero::before{content:'';position:absolute;inset:0;background-image:linear-gradient(rgba(0,200,150,.024) 1px,transparent 1px),linear-gradient(90deg,rgba(0,200,150,.024) 1px,transparent 1px);background-size:70px 70px;mask-image:radial-gradient(ellipse 80% 80% at 50% 40%,black 0%,transparent 100%);-webkit-mask-image:radial-gradient(ellipse 80% 80% at 50% 40%,black 0%,transparent 100%);pointer-events:none}.wdl-orb{position:absolute;border-radius:50%;pointer-events:none}.wdl-orb-a{width:700px;height:700px;background:radial-gradient(circle,rgba(0,200,150,.10) 0%,transparent 68%);top:50%;left:50%;transform:translate(-50%,-50%);animation:wOrb 9s ease-in-out infinite}.wdl-orb-b{width:320px;height:320px;background:radial-gradient(circle,rgba(50,110,255,.08) 0%,transparent 70%);top:10%;right:10%;animation:wFloat 10s ease-in-out infinite}@keyframes wOrb{0%,100%{opacity:.9;transform:translate(-50%,-50%) scale(1)}50%{opacity:.6;transform:translate(-50%,-50%) scale(1.1)}}@keyframes wFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-22px)}}.wdl-hero-in{position:relative;z-index:2}.wdl-hero-eyebrow{display:inline-flex;align-items:center;gap:10px;font-family:var(--fh);font-size:12px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--sub);margin-bottom:32px;animation:wUp .7s ease both}.wdl-live{width:8px;height:8px;border-radius:50%;background:var(--acc);flex-shrink:0;animation:wPing 2s ease-in-out infinite;will-change:box-shadow}@keyframes wPing{0%{box-shadow:0 0 0 0 rgba(0,200,150,.55)}70%{box-shadow:0 0 0 8px rgba(0,200,150,0)}100%{box-shadow:0 0 0 0 rgba(0,200,150,0)}}#wdl-hero h1{font-size:clamp(48px,9vw,102px);font-weight:900;line-height:1.01;letter-spacing:-.035em;color:var(--txt);margin-bottom:36px;max-width:940px;animation:wUp .7s .08s ease both}#wdl-hero h1 .ha{color:var(--acc)}#wdl-hero h1 .hd{color:var(--sub);font-weight:700}.wdl-hero-sub{font-size:clamp(17px,2.1vw,20px);color:var(--sub);max-width:760px;line-height:1.75;margin-bottom:24px;animation:wUp .7s .16s ease both}.wdl-hero-meta{font-size:15px;color:var(--txt);opacity:.92;margin-bottom:52px;animation:wUp .7s .22s ease both}.wdl-ctas{display:flex;flex-wrap:wrap;gap:12px;animation:wUp .7s .3s ease both}.wdl-stats{display:flex;gap:46px;flex-wrap:wrap;margin-top:68px;padding-top:34px;border-top:1px solid var(--line);animation:wUp .7s .4s ease both}.wdl-stat-n{font-family:var(--fh);font-size:38px;font-weight:900;line-height:1;letter-spacing:-.02em;color:var(--txt)}.wdl-stat-n em{color:var(--acc);font-style:normal}.wdl-stat-l{font-size:13px;color:var(--sub);margin-top:6px}@keyframes wUp{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}#wdl-trust{background:var(--surf);border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:24px 0}.wdl-trust-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:16px 42px}.wdl-ti{display:flex;align-items:center;gap:8px;font-family:var(--fh);font-size:12px;font-weight:600;letter-spacing:.04em;color:var(--sub);text-transform:uppercase}.wdl-ti-ico{color:var(--acc);flex-shrink:0}.wdl-about-grid{display:grid;grid-template-columns:360px 1fr;gap:72px;align-items:center}.wdl-about-img{aspect-ratio:4 / 5;border-radius:18px;overflow:hidden;border:1px solid var(--line);position:relative;background:var(--bg)}.wdl-about-img img{filter:brightness(0.92) saturate(0.85) hue-rotate(5deg);width:100%;height:100%;object-fit:cover;object-position:center top;display:block;border-radius:18px}.wdl-about-img::after{content:'';position:absolute;inset:0;border-radius:18px;background:linear-gradient(to bottom,transparent 60%,#07090F 100%),linear-gradient(to right,transparent 75%,rgba(7,9,15,.4) 100%),linear-gradient(to left,transparent 85%,rgba(7,9,15,.2) 100%);pointer-events:none}.wdl-about-txt .wdl-chip{margin-bottom:20px}.wdl-about-txt .wdl-h2{margin-bottom:32px}.wdl-about-txt p{color:var(--sub);margin-bottom:20px;line-height:1.82}.wdl-about-txt p strong{color:var(--txt);font-weight:600}.wdl-tags{display:flex;flex-wrap:wrap;gap:10px;margin:30px 0 40px}.wdl-tag{font-family:var(--fh);font-size:12px;font-weight:600;letter-spacing:.03em;padding:7px 12px;border-radius:999px;background:var(--card);border:1px solid var(--line);color:var(--sub);transition:all .18s ease}.wdl-tag:hover{border-color:var(--acc);color:var(--acc)}.wdl-srv-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:60px}.wdl-srv{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:38px 30px;position:relative;overflow:hidden;transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease}.wdl-srv::after{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,var(--acc),transparent);opacity:0;transition:opacity .25s ease}.wdl-srv:hover{transform:translateY(-5px);box-shadow:0 18px 40px rgba(0,0,0,.28);border-color:rgba(0,200,150,.18)}.wdl-srv:hover::after{opacity:1}.wdl-srv-ico{width:50px;height:50px;border-radius:12px;background:var(--adim);border:1px solid rgba(0,200,150,.14);display:flex;align-items:center;justify-content:center;margin-bottom:24px;color:var(--acc)}.wdl-srv h3{font-size:19px;font-weight:700;letter-spacing:-.01em;color:var(--txt);margin-bottom:14px}.wdl-srv p{font-size:15px;color:var(--sub);line-height:1.72}.wdl-pkg-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:60px;align-items:center}.wdl-pkg{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:44px 32px;display:flex;flex-direction:column;position:relative;transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease}.wdl-pkg:hover{transform:translateY(-5px);box-shadow:0 22px 44px rgba(0,0,0,.32)}.wdl-pkg-hl{border-color:var(--acc);background:linear-gradient(160deg,#0C1E30 0%,#091523 100%);box-shadow:0 0 0 1px var(--acc),0 22px 44px rgba(0,200,150,.12);transform:scale(1.03)}.wdl-pkg-hl:hover{transform:scale(1.03) translateY(-5px)}.wdl-pkg-badge{position:absolute;top:-13px;left:50%;transform:translateX(-50%);background:var(--acc);color:#071015;font-family:var(--fh);font-weight:700;font-size:10px;letter-spacing:.14em;text-transform:uppercase;padding:5px 16px;border-radius:999px;white-space:nowrap}.wdl-pkg-tier{font-family:var(--fh);font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--sub);margin-bottom:12px}.wdl-pkg-hl .wdl-pkg-tier{color:var(--acc)}.wdl-pkg h3{font-size:22px;font-weight:800;letter-spacing:-.01em;color:var(--txt);margin-bottom:22px}.wdl-pkg-amt{font-family:var(--fh);font-size:50px;font-weight:900;line-height:1;letter-spacing:-.03em;color:var(--txt);margin-bottom:8px}.wdl-pkg-hl .wdl-pkg-amt{color:var(--acc)}.wdl-pkg-from{font-size:13px;color:var(--sub);margin-bottom:28px}.wdl-pkg-sep{height:1px;background:var(--line);margin-bottom:24px}.wdl-pkg-kicker{font-size:14px;color:var(--txt);margin-bottom:22px;line-height:1.65}.wdl-pkg-list{flex:1;margin-bottom:32px}.wdl-pkg-list li{font-size:14px;color:var(--sub);padding:10px 0;border-bottom:1px solid var(--line);display:flex;align-items:flex-start;gap:9px;line-height:1.52}.wdl-pkg-list li:last-child{border-bottom:none}.wdl-pkg-list li svg{flex-shrink:0;margin-top:3px;color:var(--acc)}.wdl-pkg-note{text-align:center;margin-top:52px;font-size:14px;color:var(--sub);line-height:1.9}.wdl-steps-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin-top:68px;position:relative}.wdl-steps-grid::before{content:'';position:absolute;top:32px;left:calc(12.5% + 16px);right:calc(12.5% + 16px);height:1px;background:linear-gradient(90deg,var(--acc) 0%,rgba(0,200,150,.1) 100%)}.wdl-step{padding:0 18px;text-align:center}.wdl-step-n{width:64px;height:64px;border-radius:50%;background:var(--card);border:1px solid var(--line);display:flex;align-items:center;justify-content:center;margin:0 auto 26px;font-family:var(--fh);font-size:18px;font-weight:900;color:var(--acc);position:relative;z-index:1}.wdl-step:first-child .wdl-step-n{background:var(--acc);color:#071015;border-color:var(--acc)}.wdl-step h3{font-size:16px;font-weight:700;color:var(--txt);margin-bottom:12px}.wdl-step p{font-size:14px;color:var(--sub);line-height:1.7}#wdl-ref{text-align:center}.wdl-quote{max-width:720px;margin:0 auto;background:var(--card);border:1px solid var(--line);border-radius:18px;padding:56px 48px;position:relative}.wdl-q-mark{font-family:var(--fh);font-size:94px;line-height:.45;color:var(--acc);opacity:.14;position:absolute;top:36px;left:30px;font-weight:900;user-select:none;pointer-events:none}.wdl-q-txt{font-size:20px;line-height:1.74;color:var(--txt);font-style:italic;margin-bottom:28px;position:relative;z-index:1}.wdl-q-attr{font-family:var(--fh);font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--sub)}.wdl-faq-w{max-width:760px;margin:60px auto 0}.wdl-fq{border-bottom:1px solid var(--line)}.wdl-fq-btn{width:100%;background:none;border:none;color:var(--txt);font-family:var(--fh);font-size:16.5px;font-weight:700;text-align:left;padding:28px 0;display:flex;justify-content:space-between;align-items:center;gap:16px;transition:color .18s ease}.wdl-fq-btn:hover{color:var(--acc)}.wdl-fq-ico{width:28px;height:28px;border-radius:50%;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;flex-shrink:0;color:var(--sub);transition:all .26s ease}.wdl-fq.wdl-open .wdl-fq-ico{background:var(--acc);border-color:var(--acc);color:#071015;transform:rotate(45deg)}.wdl-fq-ans{max-height:0;overflow:hidden;transition:max-height .38s ease,padding-bottom .28s ease;font-size:15.5px;line-height:1.76;color:var(--sub)}.wdl-fq.wdl-open .wdl-fq-ans{max-height:320px;padding-bottom:28px}#wdl-kontakt{position:relative;overflow:hidden;text-align:center}.wdl-k-orb{position:absolute;width:560px;height:560px;border-radius:50%;background:radial-gradient(circle,rgba(0,200,150,.06) 0%,transparent 70%);top:50%;left:50%;transform:translate(-50%,-50%);pointer-events:none}.wdl-k-body{position:relative;z-index:2;max-width:760px;margin:0 auto}.wdl-k-body .wdl-chip{margin-bottom:22px}.wdl-k-body .wdl-h2{margin-bottom:34px}.wdl-k-body .wdl-lead{margin:0 auto 14px}.wdl-contact-btn{display:inline-flex;align-items:center;gap:10px;font-family:var(--fh);font-size:clamp(17px,3vw,26px);font-weight:800;letter-spacing:-.01em;color:var(--acc);border:1.5px solid var(--acc);border-radius:100px;padding:20px 40px;margin:34px 0 24px;transition:all .26s ease}.wdl-contact-btn:hover{background:var(--acc);color:#071015;box-shadow:0 0 48px var(--aglow)}.wdl-k-note{font-size:15px;color:var(--sub);line-height:1.8;margin-top:8px}.wdl-k-note strong{color:var(--txt);font-weight:600}#wdl-footer{background:var(--bg);border-top:1px solid var(--line);padding:36px 0}.wdl-foot{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px}.wdl-foot-copy{font-size:13px;color:var(--mute)}.wdl-foot-links{display:flex;gap:22px;flex-wrap:wrap}.wdl-foot-links a{font-size:13px;color:var(--mute);transition:color .18s ease}.wdl-foot-links a:hover{color:var(--acc)}.wdl-legal{max-width:760px;margin:0 auto;padding:130px 52px 110px}.wdl-legal h1{font-family:var(--fh);font-size:clamp(32px,5vw,52px);font-weight:900;letter-spacing:-.025em;color:var(--txt);margin-bottom:16px}.wdl-legal-sub{font-size:15px;color:var(--sub);margin-bottom:60px;padding-bottom:36px;border-bottom:1px solid var(--line)}.wdl-legal h2{font-family:var(--fh);font-size:20px;font-weight:700;color:var(--txt);margin:44px 0 14px}.wdl-legal h3{font-family:var(--fh);font-size:15px;font-weight:700;color:var(--sub);margin:28px 0 8px;text-transform:uppercase;letter-spacing:.05em}.wdl-legal p{font-size:15.5px;color:var(--sub);line-height:1.82;margin-bottom:14px}.wdl-legal ul{padding-left:20px;margin-bottom:14px}.wdl-legal ul li{list-style:disc;margin-bottom:6px;line-height:1.78;color:var(--sub);font-size:15.5px}.wdl-legal a{color:var(--acc);text-decoration:underline;text-underline-offset:3px}.wdl-legal strong{color:var(--txt);font-weight:600}.wdl-cf-wrap{max-width:680px;margin:0 auto;padding:130px 52px 110px}.wdl-cf-wrap h1{font-family:var(--fh);font-size:clamp(36px,5vw,56px);font-weight:900;letter-spacing:-.025em;color:var(--txt);margin-bottom:16px}.wdl-cf-intro{font-size:17px;color:var(--sub);line-height:1.78;margin-bottom:52px;padding-bottom:36px;border-bottom:1px solid var(--line)}.wdl-cf-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.wdl-cf-field{display:flex;flex-direction:column;gap:7px;margin-bottom:20px}.wdl-cf-label{font-family:var(--fh);font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--sub);margin-bottom:8px}.wdl-cf-label span{color:var(--acc);margin-left:2px}.wdl-cf-input,.wdl-cf-textarea,.wdl-cf-select{background:var(--card);border:1px solid var(--line);border-radius:10px;color:var(--txt);font-family:var(--fb);font-size:15.5px;line-height:1.6;padding:13px 16px;outline:none;transition:border-color .18s ease,box-shadow .18s ease;width:100%;appearance:none;-webkit-appearance:none}.wdl-cf-input::placeholder,.wdl-cf-textarea::placeholder{color:var(--mute)}.wdl-cf-input:focus,.wdl-cf-textarea:focus,.wdl-cf-select:focus{border-color:var(--acc);box-shadow:0 0 0 3px rgba(0,200,150,.10)}.wdl-cf-input.err,.wdl-cf-textarea.err,.wdl-cf-select.err{border-color:#e05555;box-shadow:0 0 0 3px rgba(224,85,85,.08)}.wdl-cf-textarea{resize:vertical;min-height:148px}.wdl-cf-select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%238A96A6' stroke-width='2.5'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;padding-right:40px;cursor:pointer}.wdl-cf-select option{background:#111820;color:#EDF2FF}.wdl-cf-err{font-size:12.5px;color:#e07070;margin-top:2px}.wdl-cf-errbox{background:rgba(224,85,85,.08);border:1px solid rgba(224,85,85,.22);border-radius:10px;padding:14px 18px;font-size:14px;color:#e07070;margin-bottom:24px;line-height:1.6}.wdl-cf-submit{display:inline-flex;align-items:center;gap:10px;font-family:var(--fh);font-weight:700;font-size:15px;padding:16px 36px;border-radius:999px;border:none;background:var(--acc);color:#071015;cursor:pointer;transition:background .2s ease,transform .2s ease,box-shadow .2s ease;margin-top:8px}.wdl-cf-submit:hover{background:var(--acc2);transform:translateY(-2px);box-shadow:0 12px 28px rgba(0,200,150,.22)}.wdl-cf-submit svg{transition:transform .2s ease}.wdl-cf-submit:hover svg{transform:translateX(3px)}.wdl-cf-note{margin-top:26px;font-size:13px;color:var(--mute);line-height:1.78}.wdl-cf-note a{color:var(--sub);text-decoration:underline;text-underline-offset:3px}.wdl-cf-success{background:var(--card);border:1px solid rgba(0,200,150,.2);border-radius:16px;padding:60px 44px;text-align:center}.wdl-cf-success-ico{width:64px;height:64px;border-radius:50%;background:rgba(0,200,150,.1);border:1px solid rgba(0,200,150,.2);display:flex;align-items:center;justify-content:center;margin:0 auto 22px;color:var(--acc)}.wdl-cf-success h2{font-family:var(--fh);font-size:24px;font-weight:800;color:var(--txt);margin-bottom:16px}.wdl-cf-success p{font-size:16px;color:var(--sub);line-height:1.72;max-width:400px;margin:0 auto 32px}.wdl-hp{display:none !important;visibility:hidden !important;position:absolute !important}.wdl-cf-info{display:flex;flex-direction:column;gap:12px;margin-bottom:44px}.wdl-cf-info-item{display:flex;gap:12px;align-items:flex-start;background:var(--card);border:1px solid var(--line);border-radius:10px;padding:18px 20px}.wdl-cf-info-item svg{color:var(--acc);flex-shrink:0;margin-top:2px}.wdl-cf-info-item strong{font-family:var(--fh);font-size:13px;font-weight:700;color:var(--txt);display:block;margin-bottom:3px}.wdl-cf-info-item span{font-size:13px;color:var(--sub);line-height:1.6}.wdl-contact-back{display:inline-flex;align-items:center;gap:8px;font-family:var(--fh);font-size:14px;font-weight:600;color:var(--sub);transition:color .18s ease}.wdl-contact-back:hover{color:var(--acc)}@media (prefers-reduced-motion:reduce){#wdl *,#wdl *::before,#wdl *::after{animation:none !important;transition:none !important;scroll-behavior:auto !important}}@media (max-width:1040px){.wdl-about-grid{grid-template-columns:1fr;gap:42px}.wdl-about-img{max-width:340px;aspect-ratio:3 / 2}/* Bildausschnitt im Querformat: oben ansetzen, nicht bei 20 Prozent.
   Das Portrait vom 18.08.2026 hat ueber dem Kopf keine Luft - bei 20
   Prozent wurden die Haare abgeschnitten. Angeschnitten werden jetzt
   die Schultern, und das ist die richtige Stelle dafuer. */
.wdl-about-img img{filter:brightness(0.92) saturate(0.85) hue-rotate(5deg);object-position:center top}.wdl-srv-grid{grid-template-columns:repeat(2,1fr)}.wdl-pkg-grid{grid-template-columns:1fr;max-width:430px;margin-left:auto;margin-right:auto}.wdl-pkg-hl{transform:none}.wdl-pkg-hl:hover{transform:translateY(-5px)}}@media (max-width:768px){.wdl-s{padding:70px 0}.wdl-w{padding:0 24px}.wdl-srv-grid{grid-template-columns:1fr}.wdl-steps-grid{grid-template-columns:repeat(2,1fr);gap:40px}.wdl-steps-grid::before{display:none}.wdl-stats{gap:28px}.wdl-ctas{flex-direction:column;align-items:flex-start}.wdl-trust-row{gap:12px 24px}.wdl-quote{padding:36px 28px}.wdl-foot{flex-direction:column;text-align:center}.wdl-foot-links{justify-content:center}.wdl-legal{padding:110px 24px 90px}.wdl-cf-wrap{padding:110px 24px 90px}.wdl-cf-grid{grid-template-columns:1fr}.wdl-cf-submit{width:100%;justify-content:center}}@media (max-width:520px){.wdl-w{padding:0 18px}.wdl-steps-grid{grid-template-columns:1fr}.wdl-ctas .wdl-btn{width:100%}.wdl-contact-btn{width:100%;justify-content:center;font-size:16px;padding:18px 22px}.wdl-q-txt{font-size:18px}.wdl-about-img{aspect-ratio:4 / 3}.wdl-legal{padding:100px 18px 80px}.wdl-cf-wrap{padding:100px 18px 80px}}.wdl-bg{color:#020c08}.wdl-bg:hover{color:#020c08}.wdl-foot-copy{color:#A7B2C2 !important}.wdl-foot-links a{color:#A7B2C2 !important}.wdl-foot-links a:hover{color:var(--acc) !important}:root{--nav-bg:#07090F;--nav-border:rgba(255,255,255,.07);--nav-txt:#8A96A6;--nav-txt-hv:#EDF2FF;--nav-acc:#00C896;--nav-acc2:#00DFAC;--nav-fh:'Poppins',sans-serif;--nav-fb:'Hind',sans-serif;--nav-h:72px}#wdl-nav{position:fixed;top:0;left:0;right:0;z-index:900;height:var(--nav-h);background:transparent;border-bottom:1px solid transparent;transition:background .3s ease,border-color .3s ease,box-shadow .3s ease}#wdl-nav.scrolled{background:rgba(7,9,15,.92);border-color:var(--nav-border);box-shadow:0 8px 32px rgba(0,0,0,.28);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}.wdl-nav-in{max-width:1120px;margin:0 auto;padding:0 52px;height:100%;display:flex;align-items:center;justify-content:space-between;gap:24px}.wdl-nav-logo{display:flex;flex-direction:column;line-height:1;text-decoration:none;flex-shrink:0}.wdl-nav-name{font-family:var(--nav-fh);font-size:15px;font-weight:700;color:#EDF2FF;letter-spacing:-.01em}.wdl-nav-dot{display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--nav-acc);margin-left:2px;vertical-align:middle;position:relative;top:-2px}.wdl-nav-sub{font-family:var(--nav-fb);font-size:11px;color:var(--nav-acc);letter-spacing:.04em;margin-top:2px}.wdl-nav-links{display:flex;align-items:center;gap:6px}.wdl-nav-links a{font-family:var(--nav-fh);font-size:13px;font-weight:600;color:var(--nav-txt);text-decoration:none;padding:8px 14px;border-radius:8px;transition:color .18s ease,background .18s ease}.wdl-nav-links a:hover{color:var(--nav-txt-hv);background:rgba(255,255,255,.05)}.wdl-nav-links .wdl-nav-cta{background:var(--nav-acc);color:#071015;font-weight:700;padding:9px 20px;border-radius:999px;margin-left:6px;transition:background .2s ease,transform .2s ease,box-shadow .2s ease}.wdl-nav-links .wdl-nav-cta:hover{background:var(--nav-acc2);color:#071015;transform:translateY(-1px);box-shadow:0 8px 22px rgba(0,200,150,.22)}.wdl-nav-burger{display:none;flex-direction:column;justify-content:center;gap:5px;width:36px;height:36px;background:none;border:1px solid var(--nav-border);border-radius:8px;padding:8px;cursor:pointer;flex-shrink:0}.wdl-nav-burger span{display:block;width:100%;height:1.5px;background:#EDF2FF;border-radius:2px;transition:all .24s ease;transform-origin:center}.wdl-nav-burger.open span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}.wdl-nav-burger.open span:nth-child(2){opacity:0;transform:scaleX(0)}.wdl-nav-burger.open span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}.wdl-nav-mobile{display:none;position:fixed;top:var(--nav-h);left:0;right:0;background:rgba(7,9,15,.97);border-bottom:1px solid var(--nav-border);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);z-index:899;padding:20px 24px 28px;flex-direction:column;gap:4px;opacity:0;transform:translateY(-8px);transition:opacity .22s ease,transform .22s ease}.wdl-nav-mobile.open{opacity:1;transform:translateY(0)}.wdl-nav-mobile a{font-family:var(--nav-fh);font-size:15px;font-weight:600;color:var(--nav-txt);text-decoration:none;padding:12px 16px;border-radius:10px;transition:color .16s ease,background .16s ease}.wdl-nav-mobile a:hover{color:var(--nav-txt-hv);background:rgba(255,255,255,.05)}.wdl-nav-mobile .wdl-nav-cta{margin-top:8px;background:var(--nav-acc);color:#071015;text-align:center;border-radius:999px;font-weight:700;padding:14px 20px}.wdl-nav-mobile .wdl-nav-cta:hover{background:var(--nav-acc2)}@media (max-width:768px){.wdl-nav-in{padding:0 24px}.wdl-nav-links{display:none}.wdl-nav-burger{display:flex}.wdl-nav-mobile{display:flex}}@media (max-width:520px){.wdl-nav-in{padding:0 18px}}.wdl-nav-mobile[aria-hidden="true"]{visibility:hidden}.wdl-nav-mobile[aria-hidden="false"]{visibility:visible}#wdl a.wdl-btn.wdl-bg,#wdl a.wdl-btn.wdl-bg:link,#wdl a.wdl-btn.wdl-bg:visited{background:#00C896 !important;background-color:#00C896 !important;color:#071015 !important;border:1px solid #00C896 !important;opacity:1 !important;filter:none !important;text-shadow:none !important;box-shadow:0 12px 28px rgba(0,200,150,.22) !important}#wdl a.wdl-btn.wdl-bg:hover,#wdl a.wdl-btn.wdl-bg:focus,#wdl a.wdl-btn.wdl-bg:active{background:#00D39E !important;background-color:#00D39E !important;color:#071015 !important;border-color:#00D39E !important;opacity:1 !important;filter:none !important;text-shadow:none !important;box-shadow:0 16px 34px rgba(0,200,150,.26) !important;transform:translateY(-2px) !important}#wdl a.wdl-btn.wdl-bg *,#wdl a.wdl-btn.wdl-bg svg,#wdl a.wdl-btn.wdl-bg svg *{color:currentColor !important;fill:currentColor !important;stroke:currentColor !important;opacity:1 !important;filter:none !important}#wdl a.wdl-btn.wdl-bg:focus,#wdl a.wdl-btn.wdl-bg:focus-visible{outline:3px solid #111111 !important;outline-offset:2px !important}.wdl-s{padding:108px 0}.wdl-w{padding:0 56px}#wdl-hero{padding:148px 0 108px}.wdl-hero-eyebrow{margin-bottom:24px}#wdl-hero h1{margin-bottom:36px}.wdl-hero-sub{margin-bottom:26px}.wdl-hero-meta{margin-bottom:38px;line-height:1.8}.wdl-ctas{gap:14px}.wdl-stats{margin-top:72px;padding-top:38px;gap:18px 52px}#wdl-trust{padding:28px 0}.wdl-about-grid{gap:84px}.wdl-about-txt .wdl-chip{margin-bottom:22px}.wdl-about-txt .wdl-h2{margin-bottom:28px}.wdl-about-txt p{margin-bottom:22px}.wdl-tags{margin:34px 0 42px}.wdl-srv-grid{margin-top:64px;gap:22px}.wdl-srv{padding:40px 32px}.wdl-pkg-grid{margin-top:64px;gap:24px}.wdl-pkg{padding:46px 34px}.wdl-pkg-list{margin-bottom:36px}.wdl-pkg-note{margin-top:56px}.wdl-steps-grid{margin-top:64px}.wdl-step{padding:0 20px}.wdl-quote{padding:60px 52px}.wdl-faq-w{margin-top:56px}.wdl-fq-btn{padding:30px 0}.wdl-fq.wdl-open .wdl-fq-ans{padding-bottom:30px}.wdl-k-body .wdl-chip{margin-bottom:22px}.wdl-k-body .wdl-h2{margin-bottom:28px}.wdl-k-body .wdl-lead{margin:0 auto 22px}.wdl-contact-btn{margin:0 0 52px}.wdl-k-note{margin-top:12px}#wdl-footer{padding:40px 0}@media (max-width:1024px){.wdl-s{padding:82px 0}.wdl-w{padding:0 28px}#wdl-hero{padding:134px 0 92px}.wdl-about-grid{gap:52px}.wdl-srv-grid,.wdl-pkg-grid,.wdl-steps-grid,.wdl-faq-w{margin-top:52px}.wdl-quote{padding:42px 32px}.wdl-stats{margin-top:52px;gap:22px 32px}}@media (max-width:767px){.wdl-s{padding:68px 0}.wdl-w{padding:0 18px}#wdl-hero{padding:120px 0 78px}.wdl-hero-eyebrow{margin-bottom:18px}#wdl-hero h1{margin-bottom:26px}.wdl-hero-sub{margin-bottom:22px}.wdl-hero-meta{margin-bottom:30px}.wdl-ctas{gap:12px}.wdl-ctas .wdl-btn{width:100%}.wdl-stats{margin-top:42px;padding-top:26px;gap:18px 24px}.wdl-about-grid{gap:36px}.wdl-tags{margin:28px 0 34px}.wdl-srv-grid,.wdl-pkg-grid,.wdl-steps-grid,.wdl-faq-w{margin-top:42px}.wdl-srv{padding:34px 24px}.wdl-pkg{padding:38px 24px}.wdl-step{padding:0 8px}.wdl-quote{padding:34px 24px}.wdl-fq-btn{padding:24px 0}.wdl-k-body .wdl-h2{margin-bottom:24px}.wdl-contact-btn{width:100%;justify-content:center;margin:34px 0 22px;padding:18px 24px}}.wdl-ctas{margin-top:14px}.wdl-pkg-list{margin-bottom:38px}.wdl-pkg .wdl-btn{margin-top:10px}.wdl-pkg-note{margin-top:64px;padding-top:10px}@media (max-width:767px){.wdl-ctas{margin-top:12px}.wdl-pkg .wdl-btn{margin-top:12px}.wdl-pkg-note{margin-top:52px;padding-top:8px}}.wdl-about-txt .wdl-h2{margin-bottom:40px}.wdl-about-txt p:first-of-type{margin-top:4px}@media (max-width:767px){.wdl-about-txt .wdl-h2{margin-bottom:32px}.wdl-about-txt p:first-of-type{margin-top:2px}}.wdl-about-txt .wdl-h2{margin-bottom:38px}.wdl-about-txt .wdl-h2+p{margin-top:2px}#wdl-leistungen .wdl-h2,#wdl-pakete .wdl-h2,#wdl-kontakt .wdl-k-body .wdl-h2{margin-bottom:30px}#wdl-leistungen .wdl-lead,#wdl-pakete .wdl-lead,#wdl-kontakt .wdl-k-body .wdl-lead{margin-top:0}@media (max-width:767px){.wdl-about-txt .wdl-h2{margin-bottom:32px}#wdl-leistungen .wdl-h2,#wdl-pakete .wdl-h2,#wdl-kontakt .wdl-k-body .wdl-h2{margin-bottom:24px}}#wdl-about .wdl-about-txt .wdl-h2{margin-bottom:48px !important}#wdl-about .wdl-about-txt .wdl-h2+p{margin-top:4px !important}@media (max-width:767px){#wdl-about .wdl-about-txt .wdl-h2{margin-bottom:38px !important}#wdl-about .wdl-about-txt .wdl-h2+p{margin-top:2px !important}}.wdl-legal{padding:158px 64px 136px !important}.wdl-legal .wdl-chip,.wdl-legal .wdl-eyebrow{margin-bottom:28px !important}.wdl-legal h1{margin-bottom:34px !important;line-height:1.06 !important}.wdl-legal h1+p,.wdl-legal h1+div,.wdl-legal h1+ul{margin-top:0 !important;margin-bottom:52px !important}.wdl-legal hr{margin:42px 0 46px !important}.wdl-legal h2{margin:64px 0 22px !important;line-height:1.2 !important}.wdl-legal h3{margin:40px 0 16px !important;line-height:1.25 !important}.wdl-legal p{margin-bottom:22px !important;line-height:1.95 !important}.wdl-legal ul,.wdl-legal ol{margin:8px 0 26px 0 !important;padding-left:26px !important}.wdl-legal ul li,.wdl-legal ol li{margin-bottom:12px !important;line-height:1.9 !important}.wdl-legal strong{display:inline-block;margin-bottom:4px}@media (max-width:1024px){.wdl-legal{padding:132px 32px 110px !important}.wdl-legal h1{margin-bottom:28px !important}.wdl-legal h1+p,.wdl-legal h1+div,.wdl-legal h1+ul{margin-bottom:44px !important}.wdl-legal hr{margin:36px 0 40px !important}.wdl-legal h2{margin:54px 0 20px !important}.wdl-legal h3{margin:34px 0 14px !important}}@media (max-width:767px){.wdl-legal{padding:118px 22px 92px !important}.wdl-legal .wdl-chip,.wdl-legal .wdl-eyebrow{margin-bottom:22px !important}.wdl-legal h1{margin-bottom:24px !important}.wdl-legal h1+p,.wdl-legal h1+div,.wdl-legal h1+ul{margin-bottom:36px !important}.wdl-legal hr{margin:30px 0 34px !important}.wdl-legal h2{margin:42px 0 16px !important}.wdl-legal h3{margin:28px 0 12px !important}.wdl-legal p{margin-bottom:18px !important;line-height:1.85 !important}.wdl-legal ul,.wdl-legal ol{margin-bottom:22px !important;padding-left:22px !important}.wdl-legal ul li,.wdl-legal ol li{margin-bottom:9px !important;line-height:1.82 !important}}#wdl-pakete .wdl-pkg-note{margin-top:88px !important;padding-top:14px !important}@media (max-width:767px){#wdl-pakete .wdl-pkg-note{margin-top:64px !important;padding-top:10px !important}}#wdl .wdl-h2+p,#wdl .wdl-h2+.wdl-lead{margin-top:24px}body{overflow-x:hidden}.wdl-orb{max-width:100vw;max-height:100vw}#wdl-hero{overflow:hidden}html{overflow-x:hidden}.wdl-mail-protect{unicode-bidi:bidi-override;direction:rtl}.wdl-mail-user::before{content:"kontakt"}.wdl-mail-at::before{content:"@"}.wdl-mail-dom::before{content:"web-designer-leipzig"}.wdl-mail-tld::before{content:".de"}.wdl-nav-logo{display:flex;align-items:center;gap:12px}.wdl-nav-logo-mark{display:block;width:34px;height:34px;flex:0 0 34px}.wdl-nav-logo-text{display:flex;flex-direction:column;min-width:0}@media (max-width:640px){.wdl-nav-logo-mark{width:30px;height:30px;flex-basis:30px}}#wdl-nav .wdl-nav-logo{display:inline-flex !important;flex-direction:row !important;align-items:center !important;justify-content:flex-start !important;gap:10px !important;text-align:left !important;white-space:nowrap !important}#wdl-nav .wdl-nav-logo-mark{display:block !important;width:28px !important;height:28px !important;flex:0 0 28px !important;margin:0 !important;align-self:center !important}#wdl-nav .wdl-nav-logo-text{display:flex !important;flex-direction:column !important;align-items:flex-start !important;justify-content:center !important;min-width:0 !important;margin:0 !important}#wdl-nav .wdl-nav-name,#wdl-nav .wdl-nav-sub{display:block !important;margin:0 !important;text-align:left !important}@media (max-width:640px){#wdl-nav .wdl-nav-logo{gap:8px !important}#wdl-nav .wdl-nav-logo-mark{width:24px !important;height:24px !important;flex:0 0 24px !important}}#wdl-nav .wdl-nav-logo-mark{width:32px !important;height:32px !important;flex:0 0 32px !important}@media (max-width:640px){#wdl-nav .wdl-nav-logo-mark{width:26px !important;height:26px !important;flex:0 0 26px !important}}#wdl-nav .wdl-nav-logo{display:inline-flex !important;flex-direction:row !important;align-items:center !important;justify-content:flex-start !important;gap:10px !important;text-align:left !important;white-space:nowrap !important}#wdl-nav .wdl-nav-logo-mark{display:block !important;width:clamp(26px,2vw,32px) !important;height:clamp(26px,2vw,32px) !important;flex:0 0 clamp(26px,2vw,32px) !important;margin:0 !important;align-self:center !important}#wdl-nav .wdl-nav-logo-text{display:flex !important;flex-direction:column !important;align-items:flex-start !important;justify-content:center !important;min-width:0 !important;margin:0 !important;line-height:1 !important}#wdl-nav .wdl-nav-name,#wdl-nav .wdl-nav-sub{display:block !important;margin:0 !important;text-align:left !important}@media (max-width:640px){#wdl-nav .wdl-nav-logo{gap:8px !important}#wdl-nav .wdl-nav-logo-mark{width:26px !important;height:26px !important;flex:0 0 26px !important}}#wdl-nav .wdl-nav-dot{margin-left:4px !important;vertical-align:middle !important}#wdl-footer{padding:0 !important}#wdl-footer .wdl-foot-wrap{padding:52px 0 28px}#wdl-footer .wdl-foot-brand{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:10px;margin-bottom:34px}#wdl-footer .wdl-foot-logo{display:block;width:56px;height:56px}#wdl-footer .wdl-foot-claim{max-width:720px;font-family:var(--fh);font-size:clamp(18px,1.9vw,24px);font-weight:800;line-height:1.18;letter-spacing:-.01em;color:var(--txt)}#wdl-footer .wdl-foot-subline{max-width:620px;font-size:14px;line-height:1.7;color:var(--sub)}#wdl-footer .wdl-foot-bottom{position:relative;display:flex;align-items:center;justify-content:space-between;gap:18px;padding-top:28px}#wdl-footer .wdl-foot-bottom::before{content:"";position:absolute;top:0;left:50%;transform:translateX(-50%);width:clamp(120px,24vw,260px);height:1px;background:linear-gradient(90deg,rgba(0,200,150,0),rgba(0,200,150,.35) 22%,rgba(255,255,255,.10) 50%,rgba(0,200,150,.35) 78%,rgba(0,200,150,0))}#wdl-footer .wdl-foot-copy{font-size:13px;color:var(--mute)}#wdl-footer .wdl-foot-links{display:flex;gap:22px;flex-wrap:wrap}#wdl-footer .wdl-foot-links a{font-size:13px;color:var(--mute);transition:color .18s ease}#wdl-footer .wdl-foot-links a:hover{color:var(--acc)}@media (max-width:780px){#wdl-footer .wdl-foot-wrap{padding:42px 0 24px}#wdl-footer .wdl-foot-logo{width:50px;height:50px}#wdl-footer .wdl-foot-claim{font-size:17px}#wdl-footer .wdl-foot-subline{font-size:13px;line-height:1.65}#wdl-footer .wdl-foot-bottom{flex-direction:column;justify-content:center;text-align:center;padding-top:24px}#wdl-footer .wdl-foot-bottom::before{width:140px}#wdl-footer .wdl-foot-links{justify-content:center}}#wdl-leistungen,#wdl-pakete,#wdl-ablauf,#wdl-ref,#wdl-faq,#wdl-kontakt{scroll-margin-top:calc(var(--nav-h) + 18px)}@media (max-width:780px){#wdl-leistungen,#wdl-pakete,#wdl-ablauf,#wdl-ref,#wdl-faq,#wdl-kontakt{scroll-margin-top:calc(var(--nav-h) + 14px)}}#wdl-top{position:fixed;right:18px;bottom:18px;z-index:140;width:48px;height:48px;display:inline-flex;align-items:center;justify-content:center;border:1px solid rgba(0,200,150,.22);border-radius:999px;background:rgba(13,17,24,.88);color:var(--acc);opacity:0;visibility:hidden;transform:translateY(10px);transition:opacity .2s ease,transform .2s ease,visibility .2s ease,background .2s ease,color .2s ease,border-color .2s ease;cursor:pointer;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}#wdl-top.is-visible{opacity:1;visibility:visible;transform:translateY(0)}#wdl-top:hover,#wdl-top:focus-visible{background:var(--acc);color:var(--surf);border-color:var(--acc)}#wdl-top svg{width:20px;height:20px;display:block}@media (max-width:780px){#wdl-top{right:14px;bottom:14px;width:44px;height:44px}#wdl-top svg{width:18px;height:18px}}#wdl-footer .wdl-foot-wrap{padding-bottom:92px !important}#wdl-footer .wdl-foot-bottom{padding-right:78px !important}@media (max-width:980px){#wdl-footer .wdl-foot-bottom{padding-right:0 !important}}@media (max-width:780px){#wdl-footer .wdl-foot-wrap{padding-bottom:96px !important}}.wdl-live{position:relative;box-shadow:none !important;animation:none !important;will-change:auto !important}.wdl-live::after{content:"";position:absolute;inset:-6px;border-radius:999px;border:2px solid rgba(0,200,150,.24);opacity:.55;transform:scale(1);pointer-events:none;animation:wdlLivePulseLite 1.8s ease-out infinite}@keyframes wdlLivePulseLite{0%{opacity:.55;transform:scale(1)}70%{opacity:0;transform:scale(1.55)}100%{opacity:0;transform:scale(1.55)}}#wdl-footer .wdl-foot-bottom{display:flex !important;flex-direction:column !important;align-items:center !important;justify-content:center !important;gap:18px !important;text-align:center !important}#wdl-footer .wdl-foot-copy{order:2 !important;margin:0 !important;text-align:center !important}#wdl-footer .wdl-foot-links{order:1 !important;width:auto !important;justify-content:center !important;margin:0 !important}#wdl-footer .wdl-foot-bottom::before{margin:0 auto 18px auto !important}#wdl-footer .wdl-foot-links a{text-align:center !important}#wdl-footer .wdl-foot-bottom{width:100% !important;display:flex !important;flex-direction:column !important;align-items:center !important;justify-content:center !important;text-align:center !important;gap:18px !important}#wdl-footer .wdl-foot-bottom::before{display:block !important;margin:0 auto 18px auto !important}#wdl-footer .wdl-foot-links{width:100% !important;display:flex !important;justify-content:center !important;align-items:center !important;flex-wrap:wrap !important;gap:22px !important;margin:0 auto !important;text-align:center !important}#wdl-footer .wdl-foot-copy{width:100% !important;display:block !important;margin:0 auto !important;text-align:center !important}#wdl-footer .wdl-foot-wrap{display:flex !important;flex-direction:column !important;align-items:center !important}#wdl-footer .wdl-foot-bottom{width:100% !important;max-width:100% !important;padding-right:0 !important;padding-left:0 !important;margin:0 auto !important;display:flex !important;flex-direction:column !important;align-items:center !important;justify-content:center !important;text-align:center !important}#wdl-footer .wdl-foot-links,#wdl-footer .wdl-foot-copy{width:100% !important;margin-left:auto !important;margin-right:auto !important;text-align:center !important}

/* ===== tls-nachschliff, 16.08.2026 =====================================
   Zwei Werte aus der Messung, beide knapp unter der Grenze.
   ==================================================================== */

/* Die Verweise im Fussbereich messen 22 Punkte, noetig sind 24.
   Sie stehen dicht nebeneinander, dort verdruckt man sich am
   ehesten, deshalb zusaetzlich etwas Abstand dazwischen. */
#wdl .wdl-foot-links a {
  display: inline-block;
  min-block-size: 24px;
  padding-block: 3px;
}
#wdl .wdl-foot-links { gap: 6px 16px; }

/* Der Hinweis unter dem Formular kam auf 2.53 gegen den fast
   schwarzen Grund. #7d8a9b erreicht 5.67. */
#wdl .wdl-cf-note { color: #7d8a9b; }

/* Der Zurueckverweis auf den Rechtsseiten misst 20 Punkte. Er steht in
   einem eigenen Absatz und faellt daher nicht unter die
   Fliesstext-Ausnahme von WCAG 2.5.8. */
#wdl .wdl-legal > p > a {
  display: inline-block;
  min-block-size: 24px;
  padding-block: 2px;
}

/* Nachtrag 16.08.2026: Abschlussbereich und Bewertungen.
   Der Abschlussknopf war der schwaechste der Seite, obwohl er an der
   Stelle mit der hoechsten Kaufbereitschaft steht. Jetzt gefuellt wie
   im Kopfbereich, daneben ein zweiter Weg zum Anruf. */
.wdl-k-wege{display:flex;flex-wrap:wrap;gap:14px;align-items:center;margin:34px 0 24px}
.wdl-k-wege .wdl-contact-btn{margin:0}
.wdl-contact-btn-voll{background:var(--acc);color:#06231B;border-color:var(--acc);box-shadow:0 0 34px var(--aglow)}
.wdl-contact-btn-voll:hover{background:var(--acc2);border-color:var(--acc2);transform:translateY(-2px)}
.wdl-contact-btn-tel{font-size:clamp(16px,2.2vw,20px);color:var(--txt);border-color:var(--line)}
.wdl-contact-btn-tel:hover{border-color:var(--acc);color:var(--acc)}
@media (max-width:640px){
  .wdl-k-wege{flex-direction:column;align-items:stretch}
  .wdl-k-wege .wdl-contact-btn{width:100%;justify-content:center}
}

/* Gesamtnote ueber den Stimmen. Vier Einzelstimmen ohne Gesamtbild
   wirken duenner, als sie sind. */
.wdl-rv-gesamt{display:flex;flex-wrap:wrap;align-items:baseline;gap:10px 16px;margin:0 0 34px}
.wdl-rv-gesamt-n{font-family:var(--fh);font-weight:900;font-size:38px;line-height:1;color:var(--txt)}
.wdl-rv-gesamt-s{color:#FBBC04;letter-spacing:2px;font-size:19px}
.wdl-rv-gesamt-t{color:var(--sub);font-size:15px}
.wdl-rv-gesamt-t a{color:var(--acc);border-bottom:1px solid rgba(0,200,150,.4);padding-bottom:1px}
.wdl-rv-gesamt-t a:hover{border-bottom-color:var(--acc)}


/* Nachtrag 16.08.2026: Abschnitt Arbeitsproben.
   Eine Webdesigner-Seite ohne gebaute Website ist eine Behauptung ohne
   Beleg. Die Karten zeigen vier eigene Auftritte. */
.wdl-pr-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:26px}
.wdl-pr-card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;display:flex;flex-direction:column;transition:border-color .24s ease,transform .24s ease}
.wdl-pr-card:hover{border-color:rgba(0,200,150,.42);transform:translateY(-3px)}
/* Ohne Vorschaubild, seit 16.08.2026. Die Screenshots brachten die
   Bildsprache der Tonstudio-Seiten mit und passten nicht. */
.wdl-pr-zahl{font-family:var(--fh);font-weight:900;font-size:13px;letter-spacing:.06em;color:var(--acc);margin-bottom:14px}
.wdl-pr-card{position:relative}
.wdl-pr-card::before{content:'';position:absolute;left:0;top:0;width:100%;height:2px;background:linear-gradient(90deg,var(--acc),transparent 70%);opacity:.5;transition:opacity .24s ease}
.wdl-pr-card:hover::before{opacity:1}
.wdl-pr-text{padding:28px 26px 28px;display:flex;flex-direction:column;flex:1}
.wdl-pr-art{font-family:var(--fh);font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--acc);margin-bottom:9px}
.wdl-pr-titel{font-size:21px;font-weight:800;line-height:1.25;color:var(--txt);margin-bottom:11px}
.wdl-pr-b{font-size:15px;line-height:1.7;color:var(--sub);margin-bottom:16px}
.wdl-pr-zahlen{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:20px}
.wdl-pr-zahlen li{font-size:12px;font-weight:600;font-family:var(--fh);color:var(--sub);background:var(--adim);border:1px solid var(--line);border-radius:999px;padding:5px 12px}
.wdl-pr-link{display:inline-flex;align-items:center;gap:7px;margin-top:auto;font-family:var(--fh);font-weight:700;font-size:14px;color:var(--acc);min-height:24px}
.wdl-pr-link:hover{color:var(--acc2)}
.wdl-pr-link svg{transition:transform .22s ease}
.wdl-pr-link:hover svg{transform:translateX(3px)}
@media (max-width:860px){
  .wdl-pr-grid{grid-template-columns:1fr;gap:22px}
  .wdl-pr-text{padding:22px 20px 24px}
}

/* Korrektur 16.08.2026: Die Farbregeln der beiden Abschlussknoepfe
   griffen nicht. `#wdl a{color:inherit}` hat mit ID plus Element eine
   hoehere Spezifitaet als eine Klasse, der gefuellte Knopf erbte
   deshalb die helle Textfarbe: Kontrast 1.93 statt der geforderten 4.5.
   Dasselbe Muster wie beim Hauptknopf im Kopfbereich, der genau
   deswegen schon mit `#wdl a.wdl-btn.wdl-bg` und !important arbeitet. */
#wdl a.wdl-contact-btn-voll,
#wdl a.wdl-contact-btn-voll:link,
#wdl a.wdl-contact-btn-voll:visited{background:#00C896 !important;color:#071015 !important;border-color:#00C896 !important}
#wdl a.wdl-contact-btn-voll:hover,
#wdl a.wdl-contact-btn-voll:focus{background:#00D39E !important;color:#071015 !important;border-color:#00D39E !important}
#wdl a.wdl-contact-btn-voll svg,
#wdl a.wdl-contact-btn-voll svg *{color:currentColor !important;fill:currentColor !important;stroke:currentColor !important}
#wdl a.wdl-contact-btn-tel,
#wdl a.wdl-contact-btn-tel:link,
#wdl a.wdl-contact-btn-tel:visited{color:#EDF2FF !important;border-color:rgba(255,255,255,.28) !important}
#wdl a.wdl-contact-btn-tel:hover,
#wdl a.wdl-contact-btn-tel:focus{color:#00DFAC !important;border-color:#00C896 !important}


/* Nachtrag 16.08.2026: Preisbereich.
   Der Aufbauhinweis trennt sichtbar, was auf dem kleineren Paket
   aufsetzt. Die Begruendung unter dem hervorgehobenen Paket macht aus
   dem Etikett eine nachvollziehbare Empfehlung. */
#wdl .wdl-pkg-mehr{color:var(--txt);margin-bottom:4px}
#wdl .wdl-pkg-mehr strong{font-family:var(--fh);font-size:13px;letter-spacing:.01em}
#wdl .wdl-pkg-warum{font-size:14px;line-height:1.62;color:var(--sub);border-left:2px solid var(--acc);padding:2px 0 2px 13px;margin:0 0 6px}


/* Nachtrag 16.08.2026: geschuetzte Projekte, Handlungsaufruf,
   Erstgespraech. */
#wdl .wdl-pr-still{margin-top:26px;background:var(--adim);border:1px solid var(--line);border-left:2px solid var(--acc);border-radius:var(--r);padding:20px 24px}
#wdl .wdl-pr-still-t{font-size:15px;line-height:1.72;color:var(--sub)}
#wdl .wdl-pr-still-t strong{color:var(--txt);font-family:var(--fh);font-size:15px}
#wdl .wdl-pr-cta{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:18px;margin-top:34px}
#wdl .wdl-pr-cta-t{font-family:var(--fh);font-weight:800;font-size:clamp(18px,2.4vw,23px);color:var(--txt)}

#wdl .wdl-erst{display:grid;grid-template-columns:1fr auto;gap:34px;align-items:center;margin-top:40px;background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:34px 38px}
#wdl .wdl-erst-k{font-family:var(--fh);font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--acc);margin-bottom:9px}
#wdl .wdl-erst-h{font-size:clamp(23px,3vw,30px);font-weight:900;color:var(--txt);margin-bottom:12px}
#wdl .wdl-erst-b{font-size:16px;line-height:1.72;color:var(--sub);margin-bottom:16px;max-width:640px}
#wdl .wdl-erst-liste{display:flex;flex-direction:column;gap:8px}
#wdl .wdl-erst-liste li{display:flex;align-items:flex-start;gap:9px;font-size:15px;color:var(--sub);line-height:1.6}
#wdl .wdl-erst-liste svg{color:var(--acc);flex-shrink:0;margin-top:5px}
#wdl .wdl-erst-r{display:flex;flex-direction:column;gap:12px;align-items:stretch}
#wdl a.wdl-erst-tel{display:inline-flex;align-items:center;justify-content:center;gap:9px;font-family:var(--fh);font-weight:700;font-size:15px;padding:14px 24px;border-radius:999px;border:1.5px solid var(--line);color:#EDF2FF;min-height:24px}
#wdl a.wdl-erst-tel:hover{border-color:var(--acc);color:#00DFAC}
@media (max-width:860px){
  #wdl .wdl-erst{grid-template-columns:1fr;gap:24px;padding:26px 22px}
  #wdl .wdl-erst-r{width:100%}
  #wdl .wdl-pr-cta{flex-direction:column;align-items:stretch;text-align:center}
}


/* Nachtrag 16.08.2026: Beleg-Streifen unter den Arbeitsproben.
   Ohne freigegebene Kundenprojekte sind nachpruefbare Messwerte der
   staerkste verfuegbare Beweis. */
#wdl .wdl-beleg{margin-top:30px;padding:26px 28px;background:var(--card);border:1px solid var(--line);border-radius:var(--r)}
#wdl .wdl-beleg-k{font-family:var(--fh);font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--acc);margin-bottom:18px}
#wdl .wdl-beleg-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px}
#wdl .wdl-beleg-n{font-family:var(--fh);font-weight:900;font-size:clamp(17px,1.9vw,21px);line-height:1.2;color:var(--txt);margin-bottom:6px}
#wdl .wdl-beleg-t{font-size:14px;line-height:1.6;color:var(--sub)}
/* --mute ergibt auf dem Kartengrund nur 2.28 : 1 und ist damit fuer
   Fliesstext zu schwach. --sub liegt bei 5.95 : 1. Nachgerechnet mit
   pruefung/_kontrastrechner.mjs, bevor die Farbe gesetzt wurde. */
#wdl .wdl-beleg-f{margin-top:20px;padding-top:16px;border-top:1px solid var(--line);font-size:13px;line-height:1.7;color:var(--sub)}
@media (max-width:860px){
  #wdl .wdl-beleg{padding:22px 20px}
  #wdl .wdl-beleg-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
}
@media (max-width:420px){
  #wdl .wdl-beleg-grid{grid-template-columns:1fr;gap:15px}
}


/* Nachtrag 16.08.2026: feste Anfrageleiste fuer Telefone.
   Die Seite ist auf 390 Punkten 34 Bildschirme lang; die obere Leiste
   zeigt dort nur Logo und Menuesymbol. Am Rechner nicht noetig, dort
   laeuft "Projekt anfragen" oben mit. */
.wdl-leiste{display:none}
@media (max-width:860px){
  #wdl .wdl-leiste,
  .wdl-leiste{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:150;gap:10px;
    padding:10px 14px calc(10px + env(safe-area-inset-bottom));
    background:rgba(7,9,15,.94);border-top:1px solid rgba(255,255,255,.08);
    backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
  #wdl a.wdl-leiste-a,
  .wdl-leiste-a{flex:1;display:inline-flex;align-items:center;justify-content:center;
    min-height:48px;padding:12px 18px;border-radius:999px;
    font-family:'Poppins',sans-serif;font-weight:700;font-size:15px;
    background:#00C896;color:#071015;border:1px solid #00C896;text-decoration:none}
  #wdl a.wdl-leiste-a:active{background:#00D39E}
  #wdl a.wdl-leiste-t,
  .wdl-leiste-t{display:inline-flex;align-items:center;justify-content:center;
    width:48px;min-height:48px;border-radius:999px;flex-shrink:0;
    border:1px solid rgba(255,255,255,.16);color:#EDF2FF;text-decoration:none}
  #wdl a.wdl-leiste-t:active{border-color:#00C896;color:#00DFAC}

  /* Der Nach-oben-Knopf sitzt unten rechts und wuerde verdeckt. */
  #wdl-top{bottom:82px}

  /* Damit der letzte Absatz nicht unter der Leiste verschwindet.
     Zwei Elementnamen statt einem: im Dokument steht ein style-Block
     mit body{padding:0}, der nach dieser Datei geladen wird. Mit
     "html body" gewinnt die Regel ueber die hoehere Spezifitaet,
     unabhaengig von der Reihenfolge. */
  html body{padding-bottom:78px}
}

/* Nachtrag 16.08.2026: Ablaufschritte linksbuendig.
   Die Beschreibungen laufen ueber fuenf bis sieben Zeilen. Zentriert
   fehlt der linke Leseanker, das Auge sucht bei jeder Zeile neu den
   Anfang. Ueberschrift und Ziffer bleiben in der Flucht des Textes.
   Die verbindende Linie zwischen den Ziffern lag auf halber Breite und
   passt jetzt zur linken Ausrichtung. */
#wdl .wdl-step{text-align:left}
#wdl .wdl-steps-grid::before{left:calc(12.5% + 14px);right:calc(12.5% + 14px)}
@media (max-width:860px){
  #wdl .wdl-step{padding:0}
}

/* Nachtrag 16.08.2026: Grundschrift fuer die Navigation.
   Die Kopf- und Menueleisten liegen ausserhalb von #wdl und erbten
   deshalb die Standardschrift des Browsers, also Times New Roman.
   Sichtbar war das bisher nicht, weil jedes Kindelement eine eigene
   Angabe hat. Jeder neue Text dort waere aber in Times erschienen.
   Auf einer Seite, die Webdesign verkauft, ist das ein Fehler, den man
   nicht dem Zufall ueberlassen sollte. */
#wdl-nav,
.wdl-nav,
.wdl-nav-mobile,
.wdl-nav-in,
.wdl-leiste{font-family:'Hind',system-ui,-apple-system,'Segoe UI',sans-serif}
.wdl-nav-logo-text,
.wdl-nav-links{font-family:'Poppins','Hind',system-ui,sans-serif}

/* Nachtrag 16.08.2026: Rundungen vereinheitlicht.
   Gemessen waren zehn verschiedene Werte, darunter vier fuer denselben
   Zweck: Karten mit 12, 16, 18 und 26 px. Das faellt einzeln nicht auf,
   nimmt der Seite aber die Ruhe.

   Jetzt zwei Stufen und zwei Sonderfaelle:
     var(--r)  12px   normale Karten und Kaesten
     16px             grosse Flaechen (Paket- und Shopkarte)
     999px            alles Pillenfoermige
     50%              Kreise

   Die Vorgabe steht in der Variablen --r, deshalb wird sie benutzt und
   nicht noch einmal eine Zahl geschrieben. */
#wdl .wdl-about-img,
#wdl .wdl-about-img img,
#wdl .wdl-rv-card,
#wdl .wdl-shop-note{border-radius:var(--r)}
#wdl .wdl-shop-card{border-radius:16px}
#wdl a.wdl-contact-btn,
#wdl a.wdl-contact-btn-voll,
#wdl a.wdl-contact-btn-tel{border-radius:999px}


/* Nachtrag 16.08.2026: Aufruf am Ende des Ablaufs.
   Zwischen Shopbereich und Abschluss lagen knapp 3900 Punkte ohne
   Anfrageweg. Wer den Ablauf gelesen hat, steht bei Schritt 1. */
#wdl .wdl-ablauf-cta{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:20px;margin-top:56px;padding-top:38px;border-top:1px solid var(--line)}
#wdl .wdl-ablauf-cta-t{font-family:var(--fh);font-weight:800;font-size:clamp(17px,2.2vw,21px);color:var(--txt)}
@media (max-width:640px){
  #wdl .wdl-ablauf-cta{flex-direction:column;align-items:stretch;text-align:center;gap:16px}
  #wdl .wdl-ablauf-cta .wdl-btn{justify-content:center}
}

/* Nachtrag 16.08.2026: Zeilenlaengen begrenzt.
   Gemessen mit pruefung/_webd-zeilenlaenge.mjs. Auf dem Rechner liefen
   mehrere Fliesstexte ueber die volle Breite:

     wdl-beleg-f     149 Zeichen je Zeile
     wdl-pkg-note    147
     wdl-hero-meta   128
     wdl-k-note      103
     wdl-aud-p        93

   Gut lesbar sind 45 bis 75 Zeichen. Darueber verliert das Auge beim
   Zeilenwechsel die Spur und springt in dieselbe Zeile zurueck. Auf dem
   Telefon lag alles zwischen 42 und 52, dort aendert sich nichts.

   Gemessen wird in ch, also in Zeichenbreiten der jeweiligen Schrift.
   Zentrierte Texte behalten ihre Mitte ueber margin-inline:auto. */
#wdl .wdl-beleg-f{max-width:72ch}
#wdl .wdl-pkg-note{max-width:70ch;margin-inline:auto}
#wdl .wdl-k-note{max-width:72ch;margin-inline:auto}
#wdl .wdl-hero-meta{max-width:70ch}
#wdl .wdl-aud-p{max-width:60ch}
#wdl .wdl-erst-b{max-width:68ch}
#wdl .wdl-lead{max-width:72ch}
#wdl .wdl-hero-sub{max-width:62ch}

/* Nachtrag 16.08.2026: Zielgruppen zweispaltig auf breiten Schirmen.
   Nachdem die Zeilenlaenge auf 60 Zeichen begrenzt wurde, stand die
   rechte Haelfte der Flaeche leer. Zwei Spalten nutzen sie, ohne die
   Zeilen wieder lang werden zu lassen.
   Unter 1000 Punkten bleibt es einspaltig, dort ist kein Platz. */
@media (min-width:1000px){
  #wdl .wdl-aud{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:56px}
  #wdl .wdl-aud-item{border-top:1px solid var(--line)}
  #wdl .wdl-aud-item:nth-child(2){border-top:1px solid var(--line)}
  #wdl .wdl-aud-p{max-width:46ch}
}

/* Nachtrag 16.08.2026: Leistungen auf dem Tablet zweispaltig.
   Die vorhandene Regel schaltet bei 768 Punkten auf eine Spalte. Genau
   768 ist aber die Breite eines Tablets im Hochformat, dort standen
   sechs Karten untereinander und die halbe Flaeche blieb leer.
   Die Umschaltung auf eine Spalte beginnt jetzt erst bei 660 Punkten,
   also im Bereich grosser Telefone. */
@media (min-width:661px) and (max-width:768px){
  #wdl .wdl-srv-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* Nachtrag 16.08.2026: Kopfbereich auf sehr schmalen Geraeten.
   Gemessen bei 320 x 568 Punkten, also einem kleinen iPhone SE: die
   Ueberschrift lief ueber fuenf Zeilen und 339 Punkte Hoehe, der
   Hauptknopf lag bei 770 Punkten und damit unter der Falz.
   Bei 390 und 430 Punkten Breite steht er dagegen darueber.

   Deshalb greift das hier nur unter 380 Punkten: kleinere Ueberschrift,
   engere Polsterung, weniger Abstand darunter. Die feste untere Leiste
   zeigt ohnehin durchgehend einen Anfrageweg, das hier verkuerzt nur
   den Weg dorthin. */
@media (max-width:379px){
  #wdl-hero{padding:118px 0 76px}
  #wdl-hero h1{font-size:40px;margin-bottom:24px;letter-spacing:-.03em}
  #wdl .wdl-hero-sub{font-size:16px;margin-bottom:14px}
  #wdl .wdl-hero-meta{font-size:14px}
  #wdl .wdl-ctas{gap:10px}
}

/* Auf der Kontaktseite bleibt in der festen Leiste nur der Anruf.
   Der Anfrageknopf zeigte dort auf die eigene Seite. */
@media (max-width:860px){
  #wdl .wdl-leiste-tel-nur,
  .wdl-leiste-tel-nur{justify-content:center}
  #wdl .wdl-leiste-tel-nur a.wdl-leiste-t,
  .wdl-leiste-tel-nur .wdl-leiste-t{width:auto;gap:10px;padding:12px 26px;font-family:'Poppins',sans-serif;font-weight:700;font-size:15px}
  .wdl-leiste-tel-nur .wdl-leiste-t::after{content:'0159 0222 5021'}
}

/* Die Dauer stand nur in der FAQ, also hinter einem Klick. An dieser
   Stelle beantwortet sie die Frage, die sich nach dem Ablauf stellt. */
#wdl .wdl-ablauf-cta-s{display:block;margin-top:8px;font-family:var(--fb);font-weight:400;font-size:15px;line-height:1.65;color:var(--sub);max-width:52ch}

/* Nachtrag: zwei Fliesstexte, die erst auf dem Tablet zu breit wurden.
   Am Rechner stehen sie in Spalten und sind kurz; bei 768 Punkten
   laufen sie einspaltig ueber die volle Breite. */
#wdl .wdl-pr-b{max-width:62ch}
#wdl .wdl-shop-copy{max-width:70ch}

/* Verweis aus dem Shopbereich auf die eigene Arbeitsprobe. Der Beleg
   stand bisher nur weiter oben, ohne Bezug zum Angebot. */
#wdl .wdl-shop-note a{color:var(--acc);border-bottom:1px solid rgba(0,200,150,.4);padding-bottom:1px}
#wdl .wdl-shop-note a:hover{border-bottom-color:var(--acc)}

/* Nachtrag 16.08.2026: Ziffern der Ablaufschritte auf schmalen
   Geraeten linksbuendig.
   Gemessen bei 390 Punkten: Karte und Titel beginnen bei 18, die
   Ziffer stand bei 163. Auf breiten Schirmen ist die Zentrierung
   richtig, dort verbindet eine Linie die Ziffern. Unter 860 Punkten
   ist diese Linie ausgeblendet, und eine allein zentrierte Ziffer
   ueber linksbuendigem Text wirkt wie ein Versehen.
   Betrifft Ablauf und den KI-Bereich, beide nutzen dieselben Klassen. */
@media (max-width:860px){
  #wdl .wdl-step-n{margin-left:0;margin-right:auto}
}

/* Nachtrag 16.08.2026: Kontaktdaten in der Fusszeile.
   Der Claim nannte drei Floskeln ("Klarheit, Struktur und Wirkung"),
   die Unterzeile wiederholte "digital" im selben Satz. Beides ersetzt.
   Neu dazu Rufnummer und Ort: die Fusszeile ist die Stelle, an der
   Besucher Kontaktdaten suchen, und sie fehlten dort ganz. */
#wdl-footer .wdl-foot-kontakt,
.wdl-foot-kontakt{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:10px;margin-top:14px;font-family:'Poppins',sans-serif;font-weight:600;font-size:15px;color:#8A96A6}
#wdl-footer .wdl-foot-kontakt a,
.wdl-foot-kontakt a{color:#EDF2FF;text-decoration:none;padding-block:4px;border-bottom:1px solid rgba(0,200,150,.35)}
#wdl-footer .wdl-foot-kontakt a:hover,
.wdl-foot-kontakt a:hover{color:#00DFAC;border-bottom-color:#00C896}

/* Nachtrag 16.08.2026: Bewertungssterne.
   Derselbe Inline-Style stand viermal im Dokument. Als Klasse ist er
   an einer Stelle zu pflegen, und die Inhaltsrichtlinie braucht dafuer
   kein 'unsafe-inline' mehr. Die Farbe ist das Gelb, das Google fuer
   Sterne verwendet. */
#wdl .wdl-sterne{color:#FBBC04;letter-spacing:2px}
/* Engerer Abstand unter einzelnen Ueberschriften, vorher als
   Inline-Style im Dokument. */
#wdl .wdl-h2-eng{margin-bottom:24px}

/* Nachtrag 16.08.2026: Doppelter Anfrageknopf im Kopfbereich.
   Auf dem Telefon steht die feste Leiste unmittelbar unter dem
   Hero-Knopf, beide mit demselben Text und derselben Farbe. Fabian hat
   das an einem Screenshot gezeigt.
   Der Hero-Knopf entfaellt deshalb nur dort, wo die Leiste laeuft, also
   bis 860 Punkte. Am Rechner gibt es keine Leiste, dort bleibt er der
   einzige Weg im Kopfbereich und muss stehen bleiben.
   "Pakete ansehen" rueckt auf und wird auf dem Telefon zum Hauptknopf,
   weil es der einzige verbleibende ist. */
@media (max-width:860px){
  #wdl #wdl-hero .wdl-ctas .wdl-btn.wdl-bg{display:none}
  #wdl #wdl-hero .wdl-ctas .wdl-btn.wdl-br{width:100%;justify-content:center}
}

/* Dasselbe im ausgeklappten Menue: dort stand "Projekt anfragen" ein
   drittes Mal, waehrend die feste Leiste darunter denselben Knopf
   zeigt. Das Menue gibt es nur auf schmalen Geraeten, also genau dort,
   wo die Leiste ohnehin laeuft. */
@media (max-width:860px){
  #wdl .wdl-nav-mobile .wdl-nav-cta,
  .wdl-nav-mobile .wdl-nav-cta{display:none}
}

/* Nachtrag 16.08.2026: FAQ-Antworten wurden abgeschnitten.
   Die Klapphoehe stand auf max-height:320px. Drei der laengeren
   Antworten brauchen auf 390 Punkten Breite 330px und wurden dadurch
   um die letzten Zeilen gekuerzt, ohne Hinweis.
   Gemessen mit pruefung/_webd-faq-hoehe.mjs, das scrollHeight gegen die
   sichtbare Hoehe vergleicht.
   700px sind grosszuegig genug fuer jede vorhandene Antwort und auch
   fuer 320 Punkte Breite. Ein fester Wert bleibt noetig, weil die
   Auf-und-Zu-Bewegung sonst nicht laeuft. */
#wdl .wdl-fq.wdl-open .wdl-fq-ans{max-height:700px}

/* Nachtrag 16.08.2026: Sprungversatz war unwirksam.
   Im Stylesheet steht

       scroll-margin-top:calc(var(--nav-h) + 18px)

   ohne Leerzeichen um das Plus. calc() verlangt sie zwingend; ohne sie
   ist der ganze Ausdruck ungueltig und der Browser verwirft die
   Eigenschaft. Gemessen wurde deshalb auf allen Abschnitten 0px, und
   wer aus dem Menue sprang, landete hinter der festen Kopfleiste.

   Derselbe Fehler ist im Projekt schon einmal aufgetreten, damals auf
   fabianguenther-music.de durch einen CSS-Verkleinerer, der die
   Leerzeichen entfernt hat.

   #wdl-arbeiten fehlte zudem in der Aufzaehlung, der Abschnitt ist neu. */
#wdl-leistungen,
#wdl-arbeiten,
#wdl-pakete,
#wdl-shops,
#wdl-ablauf,
#wdl-modern,
#wdl-ref,
#wdl-faq,
#wdl-kontakt,
#wdl-zielgruppen,
#wdl-about{scroll-margin-top:calc(var(--nav-h) + 18px)}
@media (max-width:780px){
  #wdl-leistungen,
  #wdl-arbeiten,
  #wdl-pakete,
  #wdl-shops,
  #wdl-ablauf,
  #wdl-modern,
  #wdl-ref,
  #wdl-faq,
  #wdl-kontakt,
  #wdl-zielgruppen,
  #wdl-about{scroll-margin-top:calc(var(--nav-h) + 12px)}
}


/* 404: Wege in die Bereiche der Seite.
   Steht anstelle des zweiten Knopfes, der dasselbe sagte wie die feste
   Leiste. Textlinks statt Knoepfen, damit der eine Hauptweg zur
   Startseite seine Wirkung behaelt. */
.wdl-404-wege{display:flex;flex-wrap:wrap;justify-content:center;gap:10px 26px;margin:44px auto 0;max-width:640px}
#wdl .wdl-404-wege a{color:var(--sub);font-size:15px;text-decoration:none;border-bottom:1px solid transparent;padding-bottom:2px;transition:color .18s,border-color .18s}
#wdl .wdl-404-wege a:hover,#wdl .wdl-404-wege a:focus-visible{color:var(--acc);border-bottom-color:var(--acc)}
@media (max-width:560px){.wdl-404-wege{gap:8px 18px;margin-top:34px}#wdl .wdl-404-wege a{font-size:14px}}


/* Der Link "bei Google ansehen" war als Akzentfarbe gedacht, wurde aber
   grau gezeichnet: #wdl a{color:inherit} hat eine ID und schlaegt jede
   Klassenregel. Der Unterstrich kam durch, die Farbe nicht. Gefunden
   mit pruefung/_link-farben.mjs. */
#wdl .wdl-rv-gesamt-t a{color:var(--acc)}


/* Links in den Rechtstexten waren weder gruen noch unterstrichen:
   #wdl a{color:inherit;text-decoration:none} setzt beides zurueck und
   gewinnt mit seiner ID gegen jede Klassenregel. Damit war im Impressum
   nicht zu erkennen, dass E-Mail, Telefonnummer und Kontaktseite
   anklickbar sind. Gefunden mit pruefung/_link-farben-messen.mjs. */
#wdl .wdl-legal a{color:var(--acc);text-decoration:underline;text-underline-offset:3px}


/* Der Verweis auf die Datenschutzerklaerung unter dem Kontaktformular
   war weder farbig noch unterstrichen, also von normalem Text nicht zu
   unterscheiden. Bei einem Pflichthinweis nach Art. 13 DSGVO ist das
   mehr als ein Schoenheitsfehler: Wer den Link nicht sieht, kommt nicht
   an die Erklaerung. Gleiche Behandlung wie in den Rechtstexten. */
#wdl .wdl-cf-note a{color:var(--acc);text-decoration:underline;text-underline-offset:3px}


/* Reduzierte Bewegung gilt auch ausserhalb von #wdl.
   Die bestehende Regel fasst nur "#wdl *". Navigation, mobiles Menue
   und der Kaufknopf der Kopfzeile stehen aber davor im Dokument und
   behielten deshalb ihre Bewegung: Das Menue fuhr weiter ein, der
   Knopf sprang beim Ueberfahren. Wer die Einstellung setzt, tut das
   meist wegen Schwindel; dann darf nichts uebrig bleiben.
   Gefunden mit pruefung/_webd-bewegung-rest.mjs. */
@media (prefers-reduced-motion:reduce){
  #wdl-nav,#wdl-nav *,#wdl-nav *::before,#wdl-nav *::after,
  #wdl-nav-mobile,#wdl-nav-mobile *,
  #wdl-footer,#wdl-footer *,
  .wdl-leiste,.wdl-leiste *{
    animation:none !important;transition:none !important
  }
  html{scroll-behavior:auto !important}
}


/* Ohne feste Leiste keinen Platz fuer sie freihalten.
   Der Rumpf traegt sonst 78 px Polsterung unten, damit die Leiste
   nichts verdeckt. Auf der Kontaktseite gibt es sie nicht mehr, und
   die Polsterung waere ein leerer Streifen. "html body" schlaegt die
   Regel im Dokument, die nur "body" anspricht. */
html body.wdl-ohne-leiste{padding-bottom:0}


/* Der Kontaktbereich der Startseite ist mittig gesetzt, sein
   Knopfcontainer war aber auf zwei Knoepfe nebeneinander ausgelegt und
   damit linksbuendig. Seit der Telefonknopf fehlt, stand der eine
   verbliebene Knopf sichtbar aus der Mitte. */
#wdl .wdl-k-wege{justify-content:center}


/* Ohne feste Leiste sitzt der Nach-oben-Knopf wieder unten.
   Er rueckt auf schmalen Geraeten auf 82 px hoch, damit die Leiste ihn
   nicht verdeckt. Auf der Kontaktseite gibt es sie nicht mehr, dort
   schwebte er ueber leerer Flaeche. */
html body.wdl-ohne-leiste #wdl-top{bottom:14px}
