/* Build Web – Seiten-Stile. Animationen und Klassen aus dem Entwurf (startseite-entwurf.dc.html, Z. 14–133).
   Schriften liegen auf dem eigenen Server (SIL Open Font License, siehe /fonts/*-LIZENZ.txt). */
@font-face{font-family:"Bricolage Grotesque";src:url("../fonts/bricolage.woff2") format("woff2");font-weight:200 800;font-display:swap}
@font-face{font-family:"Inter";src:url("../fonts/inter.woff2") format("woff2");font-weight:400 700;font-display:swap}
@font-face{font-family:"Fraunces";src:url("../fonts/fraunces.woff2") format("woff2");font-weight:400 700;font-style:normal;font-display:swap}
@font-face{font-family:"Fraunces";src:url("../fonts/fraunces-italic.woff2") format("woff2");font-weight:400;font-style:italic;font-display:swap}

:root{--grund:#F6F4EF;--tinte:#15131C;--tinte-2:#4A4656;--orange:#FF6A3D;--orange-text:#C2410C;--flieder:#B9A6FF;--mint:#9BE7C4;--linie:#ECE7DD;--titel:"Bricolage Grotesque",Inter,sans-serif;color-scheme:light}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:16px}
body{margin:0;background:#F6F4EF;font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;color:#15131C;line-height:1.6;font-size:17px;overflow-x:clip}
img,svg{max-width:100%}
a{color:#15131C}a:hover{color:#C2410C}
h1,h2,h3{font-family:var(--titel)}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:3px solid #FF6A3D;outline-offset:3px}
.bw-sprung{position:absolute;left:16px;top:-80px;z-index:60;background:#15131C;color:#fff;padding:10px 16px;border-radius:10px;text-decoration:none}
.bw-sprung:focus{top:16px;color:#fff}
.bw-nur-vorlesen{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* Kopf und Menü */
.bw-kopf{border-bottom:1px solid #E5E0D6;background:#F6F4EF;position:relative;z-index:20}
.bw-kopf-innen{max-width:1240px;margin:0 auto;padding:16px 24px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px}
.bw-logo{display:flex;align-items:center;gap:12px;text-decoration:none;color:#15131C;min-height:44px}
.bw-logo svg{flex:none}
.bw-wortmarke{font-family:var(--titel);font-weight:800;letter-spacing:-0.035em;white-space:nowrap;line-height:1}
.bw-nav{display:flex;flex-wrap:wrap;align-items:center;gap:8px 26px;font-size:15px;font-weight:500}
.bw-nav a{text-decoration:none;min-height:44px;display:inline-flex;align-items:center}
.bw-btn-dunkel{background:#15131C;color:#FFFFFF!important;font-weight:600;padding:11px 20px;border-radius:999px;gap:8px}
.bw-burger{font:inherit;width:48px;height:48px;border-radius:14px;border:1.5px solid #D9D3C7;background:#FFFFFF;cursor:pointer;align-items:center;justify-content:center}
.bw-mnav{display:none;flex-direction:column;padding:4px 24px 22px;border-top:1px solid #E5E0D6}
.bw-mnav a{padding:14px 4px;font-size:19px;font-weight:600;text-decoration:none;border-bottom:1px solid #ECE7DD}
.bw-mnav .bw-mnav-haupt{margin-top:16px;text-align:center;background:#15131C;color:#FFFFFF;padding:15px 20px;border-radius:999px;min-height:52px;border:0}
.bw-mnav .bw-mnav-tel{margin-top:10px;text-align:center;padding:12px;border:0}

/* Fuß */
.bw-fuss{border-top:1px solid #E5E0D6}
.bw-fuss-innen{max-width:1240px;margin:0 auto;padding:28px 24px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;font-size:14px;color:#4A4656}
.bw-fuss-marke{display:flex;flex-wrap:wrap;align-items:center;gap:8px 18px}
.bw-fuss-nav{display:flex;gap:22px}
.bw-fuss-nav a{font-weight:600;text-decoration:none;min-height:44px;display:inline-flex;align-items:center}

/* Rechtstexte und ruhige Seiten */
.bw-recht{max-width:780px;margin:0 auto;padding:56px 24px 88px}
.bw-recht h1{font-weight:800;font-size:clamp(36px,6vw,56px);line-height:1.05;letter-spacing:-0.04em;margin:0 0 10px}
.bw-recht h2{font-weight:700;font-size:22px;letter-spacing:-0.02em;margin:36px 0 8px}
.bw-recht p,.bw-recht li{color:#4A4656}
.bw-recht p{margin:0 0 12px}
.bw-recht a{color:#C2410C;font-weight:600}
.bw-recht .bw-unterzeile{font-size:19px}
.bw-recht .bw-stand{margin-top:40px;font-size:14px}

/* Musterseiten-Studio */
.bw-studio-titel{font-size:13px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#4A4656}
.bw-pill{font-size:14px;font-weight:600;padding:9px 15px;border-radius:999px;cursor:pointer;border:1.5px solid #D9D3C7;background:#FFFFFF;color:#15131C}
.bw-pill[aria-pressed="true"]{background:#15131C;color:#FFFFFF;border-color:#15131C}
.bw-segmente{display:flex;gap:6px;background:#F6F4EF;border-radius:999px;padding:5px}
.bw-seg{flex:1;font-size:14px;font-weight:600;padding:9px 10px;border-radius:999px;cursor:pointer;border:0;background:transparent;color:#15131C}
.bw-seg[aria-pressed="true"]{background:#FFFFFF;box-shadow:0 2px 8px rgba(21,19,28,.14)}
.bw-farbe{width:44px;height:44px;border-radius:50%;border:0;cursor:pointer}
.bw-farbe[aria-pressed="true"]{box-shadow:0 0 0 3px #FFFFFF,0 0 0 5px #15131C}
.bw-schalter{font-size:14px;font-weight:600;padding:9px 14px;border-radius:12px;cursor:pointer;border:1.5px solid #D9D3C7;background:#FFFFFF;color:#15131C;display:inline-flex;align-items:center;gap:8px}
.bw-schalter[aria-pressed="true"]{background:#FFF1EB;border-color:#FF6A3D}
.bw-haken{width:18px;height:18px;border-radius:5px;border:1.5px solid #15131C;background:#FFFFFF;color:transparent;display:inline-flex;align-items:center;justify-content:center}
.bw-schalter[aria-pressed="true"] .bw-haken{background:#FF6A3D;color:#15131C}
.bw-zufall{font-weight:600;font-size:15px;background:#FF6A3D;color:#15131C;border:0;border-radius:999px;padding:13px 20px;min-height:48px;cursor:pointer;gap:10px}
.bw-studio-hinweis{margin:0;font-size:13px;color:#4A4656}
.bw-demo{position:relative;width:100%;max-width:100%;border:1px solid #ECE7DD;border-radius:26px;overflow:hidden;background:var(--d-bg);box-shadow:0 40px 80px rgba(21,19,28,.16)}
.bw-demo-leiste{display:flex;align-items:center;gap:7px;padding:12px 16px;background:#FFFFFF;border-bottom:1px solid #ECE7DD}
.bw-demo-scroll{height:640px}
.bw-d-kopf{font-family:var(--d-kopf);font-weight:var(--d-gewicht);font-style:var(--d-kursiv)}
.bw-demo-handy{max-width:390px;border:11px solid #15131C;border-radius:44px}
.bw-demo-handy .bw-demo-leiste{display:none}
.bw-demo-handy .bw-demo-scroll{height:720px}
[data-bereich][hidden]{display:none!important}
@media (max-width: 760px){.bw-demo-scroll{height:560px}.bw-demo-handy .bw-demo-scroll{height:600px}}

/* Vorher/Nachher */
.bw-nh-link{font-size:13px;font-weight:600;padding:8px 14px;border-radius:999px;border:0;cursor:pointer;background:transparent;color:#E8E4DC}
.bw-nh-link[aria-pressed="true"]{background:#FFFFFF;color:#15131C}
[data-unterseite][hidden]{display:none!important}
.bw-ba [data-kein-ziehen]{cursor:default}

/* Pakete */
.bw-zahlweise{font-size:14px;font-weight:600;padding:9px 18px;border-radius:999px;cursor:pointer;border:0;background:transparent;color:#15131C;display:inline-flex;align-items:center;gap:8px}
.bw-zahlweise[aria-pressed="true"]{background:#15131C;color:#FFFFFF}
.bw-seg-schmal{flex:none;padding:9px 16px}

/* Domain-Check, Fragen, Kontakt */
[data-zustand][hidden]{display:none!important}
.bw-vorschlag{font-size:14px;font-weight:600;padding:8px 14px;border-radius:999px;border:1.5px solid #D9D3C7;background:#F6F4EF;color:#15131C;cursor:pointer}
.bw-frage{background:#FFFFFF;border:1px solid #ECE7DD;border-radius:22px}
.bw-faq{list-style:none;font-size:18px;font-weight:600;color:#15131C;border-radius:22px;padding:22px 26px;min-height:64px;display:flex;align-items:center;justify-content:space-between;gap:16px;cursor:pointer}
.bw-faq::-webkit-details-marker{display:none}
.bw-frage-punkt{flex:none;width:36px;height:36px;border-radius:50%;background:#F6F4EF;display:flex;align-items:center;justify-content:center;transition:background-color .3s}
.bw-frage-punkt svg{transition:transform .4s cubic-bezier(.22,1.4,.36,1)}
.bw-frage[open] .bw-frage-punkt{background:#FF6A3D}
.bw-frage[open] .bw-frage-punkt svg{transform:rotate(45deg)}
.bw-fangfeld{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
.bw-formular-hinweis{margin:0;background:#FFE4D9;color:#15131C;border-radius:14px;padding:12px 16px;font-size:15px;font-weight:600}
.bw-kontakt-form button[disabled]{opacity:.6;cursor:wait}
.bw-kontakt-form select{width:100%;min-width:0;max-width:100%}
.bw-kontakt-form label{min-width:0}

/* Newsletter */
.bw-nl-status{margin:0;background:#FFFFFF;color:#15131C;border-radius:14px;padding:12px 16px;font-size:15px;font-weight:600}
.bw-nl-status.bw-nl-gut{background:#9BE7C4}
.bw-newsletter button[disabled]{opacity:.6;cursor:wait}

/* Aus dem Entwurf */
.bw-ease{transition:all .6s cubic-bezier(.22,1,.36,1)}
.bw-lb2{animation:bw-slide-in 1s cubic-bezier(.22,1.4,.36,1) .2s both}
.bw-lb3{animation:bw-slide-in 1s cubic-bezier(.22,1.4,.36,1) .4s both}
@keyframes bw-slide-in{from{transform:translateX(16px);opacity:0}}
.bw-logo rect{transition:transform .4s cubic-bezier(.22,1.4,.36,1)}
.bw-logo:hover .bw-lb2{transform:translateX(2px)}
.bw-logo:hover .bw-lb3{transform:translateX(-1px)}
.bw-swash{stroke-dasharray:420;stroke-dashoffset:420;animation:bw-draw-in 1.4s cubic-bezier(.22,1,.36,1) .6s forwards}
@keyframes bw-draw-in{to{stroke-dashoffset:0}}
.bw-words{display:flex;flex-direction:column;animation:bw-words 9s cubic-bezier(.65,0,.35,1) infinite}
@keyframes bw-words{0%,28%{transform:translateY(0)}33%,61%{transform:translateY(-1.05em)}66%,94%{transform:translateY(-2.1em)}100%{transform:translateY(-3.15em)}}
.bw-pulse{animation:bw-pulse 2s ease-out infinite}
@keyframes bw-pulse{0%{box-shadow:0 0 0 0 rgba(255,106,61,.55)}100%{box-shadow:0 0 0 9px rgba(255,106,61,0)}}
.bw-drop{animation:bw-drop 9s cubic-bezier(.22,1.3,.36,1) infinite both}
@keyframes bw-drop{0%,4%{opacity:0;transform:translateY(-26px) scale(.96)}12%,88%{opacity:1;transform:none}96%,100%{opacity:0;transform:translateY(8px)}}
.bw-hue{background-color:#1F4FD8;animation:bw-hue 8s infinite}
@keyframes bw-hue{0%,22%{background-color:#1F4FD8}25%,47%{background-color:#B3261E}50%,72%{background-color:#0F766E}75%,97%{background-color:#6D28D9}100%{background-color:#1F4FD8}}
.bw-cursor{animation:bw-cursor 8s cubic-bezier(.65,0,.35,1) infinite}
@keyframes bw-cursor{0%,8%{transform:translate(17px,18px)}18%,26%{transform:translate(49px,18px)}43%,51%{transform:translate(81px,18px)}68%,76%{transform:translate(113px,18px)}93%,100%{transform:translate(17px,18px)}}
.bw-float{animation:bw-float 7s ease-in-out infinite}
.bw-float-2{animation:bw-float 9s ease-in-out infinite reverse}
.bw-float-3{animation:bw-float-3 14s ease-in-out infinite}
@keyframes bw-float{50%{transform:translateY(-12px)}}
@keyframes bw-float-3{0%,100%{transform:translate(0,0) rotate(0)}33%{transform:translate(18px,-22px) rotate(8deg)}66%{transform:translate(-12px,14px) rotate(-6deg)}}
.bw-spin{animation:bw-spin 20s linear infinite}
.bw-spin-slow{animation:bw-spin 6s linear infinite}
@keyframes bw-spin{to{transform:rotate(360deg)}}
.bw-marquee{display:flex;width:max-content;animation:bw-marquee 40s linear infinite}
@keyframes bw-marquee{to{transform:translateX(-50%)}}
.bw-bounce-1{animation:bw-bounce 2.4s cubic-bezier(.22,1.4,.36,1) infinite}
.bw-bounce-2{animation:bw-bounce 2.4s cubic-bezier(.22,1.4,.36,1) .2s infinite}
.bw-bounce-3{animation:bw-bounce 2.4s cubic-bezier(.22,1.4,.36,1) .4s infinite}
@keyframes bw-bounce{0%,60%,100%{transform:none}30%{transform:translateY(-14px)}}
.bw-morph{animation:bw-morph 7s cubic-bezier(.65,0,.35,1) infinite}
@keyframes bw-morph{0%,100%{border-radius:50%;background-color:#FF6A3D;transform:rotate(0)}33%{border-radius:16px;background-color:#B9A6FF;transform:rotate(45deg)}66%{border-radius:50% 50% 50% 6px;background-color:#9BE7C4;transform:rotate(0)}}
.bw-bar{transform-origin:bottom;animation:bw-bar 3s cubic-bezier(.22,1.3,.36,1) infinite}
@keyframes bw-bar{0%{transform:scaleY(.15)}45%,85%{transform:scaleY(1)}100%{transform:scaleY(.15)}}
.bw-needle{transform-origin:50px 50px;animation:bw-needle 3.2s cubic-bezier(.65,0,.35,1) infinite alternate}
@keyframes bw-needle{from{transform:rotate(-70deg)}to{transform:rotate(62deg)}}
.bw-type{display:inline-block;overflow:hidden;white-space:nowrap;vertical-align:bottom;border-right:2px solid #15131C;animation:bw-type 6s steps(20) infinite,bw-caret .8s step-end infinite}
@keyframes bw-type{0%{width:0}45%,90%{width:20ch}100%{width:0}}
@keyframes bw-caret{50%{border-color:transparent}}
.bw-serp-you{animation:bw-serp-you 8s cubic-bezier(.65,0,.35,1) infinite}
@keyframes bw-serp-you{0%,20%{transform:translateY(198px)}45%,88%{transform:translateY(0)}100%{transform:translateY(198px)}}
.bw-serp-down{animation:bw-serp-down 8s cubic-bezier(.65,0,.35,1) infinite}
@keyframes bw-serp-down{0%,20%{transform:translateY(0)}45%,88%{transform:translateY(66px)}100%{transform:translateY(0)}}
.bw-serp-badge{animation:bw-serp-badge 8s ease infinite}
@keyframes bw-serp-badge{0%,40%{opacity:0;transform:scale(.6)}48%,86%{opacity:1;transform:none}92%,100%{opacity:0}}
.bw-hint{animation:bw-hint 1.8s ease-in-out infinite}
.bw-offer::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 35%,rgba(255,255,255,.14) 50%,transparent 65%);transform:translateX(-100%);animation:bw-shine 4.5s ease-in-out infinite;pointer-events:none}
@keyframes bw-shine{55%,100%{transform:translateX(100%)}}
.bw-era{animation:bw-era 6s cubic-bezier(.22,1,.36,1) infinite}
@keyframes bw-era{0%,30%{transform:translateY(-8px);box-shadow:0 24px 50px rgba(21,19,28,.16)}38%,100%{transform:none;box-shadow:none}}
@keyframes bw-hint{50%{transform:translateY(5px)}}
.bw-card{transition:transform .5s cubic-bezier(.22,1,.36,1),box-shadow .5s cubic-bezier(.22,1,.36,1)}
.bw-card:hover{transform:translateY(-6px);box-shadow:0 24px 50px rgba(21,19,28,.12)}
.bw-btn{display:inline-flex;align-items:center;justify-content:center;min-height:44px;text-decoration:none;transition:transform .35s cubic-bezier(.22,1.4,.36,1),box-shadow .35s,background-color .3s}
.bw-btn:hover{transform:translateY(-2px);box-shadow:0 12px 26px rgba(21,19,28,.22)}
.bw-btn .bw-arrow{transition:transform .35s cubic-bezier(.22,1.4,.36,1)}
.bw-btn:hover .bw-arrow{transform:translateX(4px)}
.bw-ctl{min-height:44px;transition:background-color .3s,color .3s,box-shadow .3s,transform .3s cubic-bezier(.22,1.4,.36,1)}
.bw-ctl:hover{transform:translateY(-2px)}
.bw-btn:focus-visible,.bw-ctl:focus-visible,.bw-faq:focus-visible{outline:3px solid #FF6A3D;outline-offset:3px}
.bw-range{width:100%;accent-color:#FF6A3D;min-height:44px}
.bw-scroll{scrollbar-width:thin;scrollbar-color:#C9C2B5 transparent}
.bw-burger{display:none}
.bw-ba{touch-action:pan-y;cursor:ew-resize;user-select:none;-webkit-user-select:none}
.bw-ba-handle:focus-visible{outline:3px solid #FF6A3D;outline-offset:4px}
.bw-nudge{animation:bw-nudge 1.6s ease-in-out infinite}
.bw-pagein{animation:bw-pagein .55s cubic-bezier(.22,1,.36,1) both}
.bw-spinner{flex:none;width:20px;height:20px;border:3px solid rgba(21,19,28,.18);border-top-color:#15131C;border-radius:50%;animation:bw-spin .8s linear infinite}
@keyframes bw-pagein{from{opacity:0;transform:translateY(16px)}}
@keyframes bw-nudge{0%,100%{transform:translateX(0)}25%{transform:translateX(-8px)}75%{transform:translateX(8px)}}
.bw-old-marquee{display:inline-block;white-space:nowrap;animation:bw-old 10s linear infinite}
@keyframes bw-old{from{transform:translateX(60%)}to{transform:translateX(-100%)}}
.bw-blink{animation:bw-blink 1s step-end infinite}
@keyframes bw-blink{50%{opacity:0}}
/* Kontaktformular: Interessen als Häkchen-Chips, angehakt orange */
.bw-wahl{display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:8px 16px 8px 12px;border-radius:999px;background:#2E2A38;color:#F6F4EF;font-size:15px;font-weight:500;cursor:pointer;box-sizing:border-box;transition:background-color .2s,color .2s}
.bw-wahl input{width:18px;height:18px;margin:0;accent-color:#FF6A3D;cursor:pointer}
.bw-wahl:has(input:checked){background:#FF6A3D;color:#15131C}
.bw-wahl:has(input:checked) input{accent-color:#15131C}
.bw-wahl:has(input:focus-visible){outline:2px solid #FF6A3D;outline-offset:2px}
/* Mittlere Breiten (Tablet quer, kleine Laptops): Menü mit KI-Assistenten bleibt einzeilig */
@media (min-width: 761px) and (max-width: 1180px){.bw-nav{gap:8px 15px;font-size:14px}}
@media (max-width: 760px){
.js .bw-nav{display:none!important}
.js .bw-burger{display:inline-flex!important}
.js .bw-mnav:not([hidden]){display:flex}
.bw-nav{gap:4px 18px}
.bw-sec{padding-top:64px!important;padding-bottom:40px!important}
.bw-hero{padding-top:40px!important;padding-bottom:56px!important;gap:40px!important}
.bw-hide-sm{display:none!important}
.bw-pad-sm{padding:26px 20px!important}
.bw-ba{height:540px!important}
.bw-ba-after-in{padding:22px!important;align-items:flex-end!important}
.bw-ba-tag{max-width:44%!important;font-size:12px!important}
.bw-kopf-innen{padding:12px 16px}
.bw-fuss-innen{padding:24px 16px}
.bw-recht{padding:36px 16px 64px}
}
.bw-progress{position:fixed;left:0;top:0;height:4px;width:100%;background:linear-gradient(90deg,#FF6A3D,#B9A6FF,#9BE7C4);transform-origin:left center;z-index:50;pointer-events:none;display:none}
.bw-kicker{display:inline-flex;align-items:center;gap:10px}
.bw-kicker::before{content:"";width:28px;height:2px;border-radius:2px;background:currentColor;transform-origin:left center}
.bw-wheel{animation:bw-wheel 1.6s ease-in-out infinite}
@keyframes bw-wheel{0%{transform:translateY(0);opacity:1}80%{transform:translateY(12px);opacity:0}100%{opacity:0}}
@supports (animation-timeline: scroll()){
.bw-progress{display:block;animation:bw-grow linear both;animation-timeline:scroll(root)}
}
@supports (animation-timeline: view()){
.bw-reveal{animation:bw-rise linear both;animation-timeline:view();animation-range:entry 0% cover 24%}
.bw-d1{animation-range:entry 5% cover 30%}
.bw-d2{animation-range:entry 10% cover 36%}
.bw-d3{animation-range:entry 15% cover 42%}
.bw-line{transform-origin:left center;animation:bw-grow linear both;animation-timeline:view();animation-range:entry 30% cover 55%}
.bw-kicker::before{animation:bw-grow linear both;animation-timeline:view();animation-range:entry 20% cover 40%}
.bw-par{animation:bw-par linear both;animation-timeline:view();animation-range:cover}
.bw-zoom{animation:bw-zoom linear both;animation-timeline:view();animation-range:entry 0% cover 32%}
.bw-tilt{animation:bw-tilt linear both;animation-timeline:view();animation-range:entry 0% cover 30%}
}
@keyframes bw-par{from{transform:translateY(60px)}to{transform:translateY(-60px)}}
@keyframes bw-zoom{from{transform:scale(.92)}}
@keyframes bw-tilt{from{transform:perspective(1000px) rotateX(12deg) translateY(50px);opacity:0}}
@keyframes bw-rise{from{opacity:0;transform:translateY(48px) scale(.98)}}
@keyframes bw-grow{from{transform:scaleX(0)}}
@media (prefers-reduced-motion: reduce){*,*::before,*::after{animation:none!important;transition:none!important}.bw-swash{stroke-dashoffset:0}html{scroll-behavior:auto}}
