/* Online-Anfrage /anfrage/ (1.3.0) – loaded only on this page. Tokens from site.css. */
.view-anfrage { background: var(--paper); }
.af { --top: 72px; --gold: linear-gradient(135deg, #7a4f00, #b07400 45%, #e8a200); --wineg: linear-gradient(135deg, var(--wine-d), var(--wine) 50%, #e0446f); --violet: linear-gradient(135deg, #2e0b4f, #5a1690 50%, #8a3fd0); }
.af__grid { width: min(100% - 2 * var(--gut), 1340px); margin-inline: auto; display: grid; grid-template-columns: 230px minmax(0, 1fr) 340px; column-gap: clamp(24px, 3vw, 44px); padding-bottom: 110px; }

/* dark stage behind the intro (full width) */
.af__band { grid-row: 1; grid-column: 1 / -1; margin-inline: calc(50% - 50vw); position: relative; overflow: hidden; isolation: isolate; background: radial-gradient(120% 120% at 80% 0%, #3a0b1d 0%, var(--night-2) 45%, var(--night) 100%); }
.af__band::after { content: ""; position: absolute; inset: auto 0 0; height: 90px; background: linear-gradient(transparent, rgba(18,6,11,.35)); }
.af__intro { grid-row: 1; grid-column: 2; position: relative; z-index: 1; padding: 150px 0 120px; color: #fff; }
.af__h { font-size: clamp(2.3rem, 4.6vw, 3.7rem); font-weight: 800; color: #fff; margin-bottom: 18px; }
.af__h em { background: linear-gradient(100deg, #ff9ab3, #ffd3dd 45%, #ff6f95); -webkit-background-clip: text; background-clip: text; }
.af__intro .hero__lead { margin-bottom: 22px; }
.af__facts { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.af__facts li { display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px; border-radius: 999px; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.14); font: 600 .88rem/1 var(--head); color: rgba(255,255,255,.88); }
.af__facts .ico { color: var(--rose); }
.js .af__intro > * { animation: rise .9s var(--ease) both; }
.js .af__intro > :nth-child(2) { animation-delay: .06s; } .js .af__intro > :nth-child(3) { animation-delay: .12s; } .js .af__intro > :nth-child(4) { animation-delay: .18s; } .js .af__intro > :nth-child(5) { animation-delay: .24s; }

/* ---------- left: step navigation ---------- */
.af-nav { grid-column: 1; grid-row: 1 / 4; align-self: start; position: sticky; top: var(--top); z-index: 5; margin-top: 150px; }
.af-nav__bar { display: none; }
.af-nav__h { margin: 0 0 12px 6px; font: 800 .78rem/1 var(--head); letter-spacing: .12em; text-transform: uppercase; color: var(--rose); }
.af-nav__list { --fill: 0; list-style: none; margin: 0; padding: 14px 10px; border-radius: 24px; background: rgba(255,255,255,.96); border: 1px solid var(--line); box-shadow: 0 30px 60px -40px rgba(60, 10, 30, .45); position: relative; display: grid; gap: 2px; }
.af-nav__list::before, .af-nav__list::after { content: ""; position: absolute; left: 31px; top: 34px; bottom: 34px; width: 2px; border-radius: 2px; background: var(--line); }
.af-nav__list::after { background: linear-gradient(var(--wine), #e0446f); transform-origin: top; transform: scaleY(var(--fill)); transition: transform .6s var(--ease); }
.af-nav__list a { position: relative; z-index: 1; display: flex; align-items: center; gap: 12px; padding: 7px 10px; border-radius: 14px; color: var(--grey); text-decoration: none; font: 600 .92rem/1.2 var(--head); transition: background .25s, color .25s; }
.af-nav__list a:hover { background: var(--paper); color: var(--ink); }
.af-nav__no { position: relative; flex: none; width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; background: #fff; border: 2px solid #e3d6db; font: 800 .72rem/1 var(--head); color: var(--grey); transition: background .3s, border-color .3s, color .3s, transform .3s var(--ease), box-shadow .3s; }
.af-nav__no svg { position: absolute; width: 13px; height: 13px; fill: none; stroke: #fff; stroke-width: 3.2; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 24; stroke-dashoffset: 24; transition: stroke-dashoffset .45s var(--ease) .1s; }
.af-nav__list a.is-done .af-nav__no { background: var(--wine); border-color: var(--wine); }
.af-nav__list a.is-done .af-nav__no b { opacity: 0; }
.af-nav__list a.is-done .af-nav__no svg { stroke-dashoffset: 0; }
.af-nav__list a.is-active { background: var(--blush); color: var(--wine); }
.af-nav__list a.is-active .af-nav__no { border-color: var(--wine); color: var(--wine); transform: scale(1.12); box-shadow: 0 0 0 5px rgba(162, 16, 54, .12); }
.af-nav__list a.is-active.is-done .af-nav__no { color: #fff; }

/* ---------- middle: steps ---------- */
.af__steps { grid-row: 2; grid-column: 2; display: grid; gap: 22px; margin-top: -64px; position: relative; z-index: 1; }
.af-step { scroll-margin-top: 80px; padding: clamp(22px, 3vw, 34px); border-radius: 28px; background: var(--card); border: 1px solid var(--line); box-shadow: 0 30px 60px -48px rgba(60, 10, 30, .5); transition: border-color .4s, box-shadow .4s; }
.af-step.is-active { border-color: #efc9d4; box-shadow: 0 40px 70px -46px rgba(162, 16, 54, .55); }
.af-step__head { display: flex; gap: 16px; align-items: flex-start; margin-bottom: 22px; }
.af-step__no { flex: none; font: 800 .95rem/1 var(--head); color: #fff; width: 46px; height: 46px; border-radius: 15px; display: grid; place-items: center; background: var(--wineg); box-shadow: 0 12px 24px -12px rgba(162, 16, 54, .8); }
.af-step__head > div { flex: 1; min-width: 0; }
.af-step__h { font-size: clamp(1.3rem, 2.2vw, 1.65rem); margin: 4px 0 4px; }
.af-step__hint { margin: 0; color: var(--grey); font-size: .95rem; line-height: 1.5; }
.af-step__ico { flex: none; width: 46px; height: 46px; border-radius: 15px; display: grid; place-items: center; background: var(--blush); color: var(--wine); }
.af-step__ico .ico { width: 22px; height: 22px; }
.af-step__body { display: grid; gap: 18px; }
.af-step__body--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 18px; }

/* text fields */
.af-field { display: grid; gap: 7px; }
.af-field > span { font: 700 .9rem/1.2 var(--head); color: var(--ink); }
.af-field input, .af-field textarea { width: 100%; min-height: 54px; padding: 14px 16px; border-radius: 16px; border: 1.5px solid var(--line); background: var(--paper); font: 400 1rem/1.4 var(--body); color: var(--ink); transition: border-color .25s, background .25s, box-shadow .25s; -webkit-appearance: none; appearance: none; }
.af-field textarea { resize: vertical; min-height: 0; }
.af-field input::placeholder, .af-field textarea::placeholder { color: #a39aa1; }
.af-field input:hover, .af-field textarea:hover { border-color: #e3cdd5; }
.af-field input:focus, .af-field textarea:focus { outline: none; border-color: var(--wine); background: #fff; box-shadow: 0 0 0 4px rgba(162, 16, 54, .12); }
.af-field--wide { grid-column: 1 / -1; }
.af-field[data-af-if] { transition: opacity .35s var(--ease), transform .35s var(--ease); }
.af-field[data-af-if].is-hidden { display: none; }
.af-group { border: 0; margin: 0; padding: 0; min-width: 0; }
.af-sub { padding: 0; margin: 0 0 10px; font: 700 .9rem/1.2 var(--head); color: var(--ink); }

/* chips */
.af-chips { display: flex; flex-wrap: wrap; gap: 10px; }
.af-chip { position: relative; display: inline-flex; align-items: center; gap: 11px; min-height: 54px; padding: 10px 20px 10px 14px; border-radius: 999px; border: 1.5px solid var(--line); background: #fff; font: 700 .98rem/1.25 var(--head); color: var(--ink); cursor: pointer; user-select: none; -webkit-tap-highlight-color: transparent; transition: border-color .25s, background .25s, transform .25s var(--ease), box-shadow .25s, color .25s; }
.af-chip:hover { border-color: #e2b8c5; transform: translateY(-2px); }
.af-chip:active { transform: scale(.97); }
.af-chip input, .af-card input, .af-check input { position: absolute; opacity: 0; width: 1px; height: 1px; pointer-events: none; }
.af-chip__box { flex: none; position: relative; width: 24px; height: 24px; border-radius: 50%; border: 2px solid #dccdd3; background: #fff; display: grid; place-items: center; transition: background .3s var(--ease), border-color .3s, transform .3s var(--ease); }
input[type="checkbox"] + .af-chip__box { border-radius: 8px; }
.af-chip__box svg, .af-card__check svg { width: 14px; height: 14px; fill: none; stroke: #fff; stroke-width: 3.2; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 24; stroke-dashoffset: 24; transition: stroke-dashoffset .4s var(--ease) .05s; }
input:checked + .af-chip__box { background: var(--wine); border-color: var(--wine); animation: pop .4s var(--ease); }
input:checked + .af-chip__box svg { stroke-dashoffset: 0; }
.af-chip:has(input:checked) { border-color: var(--wine); background: linear-gradient(120deg, #fff, #fdf0f3); color: var(--wine-d); box-shadow: 0 14px 28px -18px rgba(162, 16, 54, .7); }
.af-chip:has(input:focus-visible), .af-card:has(input:focus-visible), .af-check:has(input:focus-visible) { outline: 3px solid var(--rose); outline-offset: 3px; }
@keyframes pop { 40% { transform: scale(1.22); } }
.af-gem { display: inline-grid; place-items: center; width: 24px; height: 24px; margin-left: -3px; border-radius: 8px; background: #efe3fb; color: #6d1fa8; }
.af-gem .ico { width: 14px; height: 14px; }
.af-chip--ent:has(input:checked) { border-color: #7a2ab8; background: linear-gradient(120deg, #fff, #f6eefe); color: #3d0f66; }
.af-chip--ent input:checked + .af-chip__box { background: #6d1fa8; border-color: #6d1fa8; }

/* page cards */
.af-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.af-card { position: relative; display: grid; gap: 3px; align-content: start; min-height: 84px; padding: 16px 52px 16px 18px; border-radius: 20px; border: 1.5px solid var(--line); background: #fff; cursor: pointer; -webkit-tap-highlight-color: transparent; transition: border-color .25s, background .25s, transform .25s var(--ease), box-shadow .25s; }
.af-card:hover { border-color: #e2b8c5; transform: translateY(-2px); }
.af-card:active { transform: scale(.98); }
.af-card b { font: 800 1rem/1.25 var(--head); color: var(--ink); }
.af-card small { font-size: .86rem; line-height: 1.4; color: var(--grey); }
.af-card__check { position: absolute; top: 16px; right: 16px; width: 26px; height: 26px; border-radius: 9px; border: 2px solid #dccdd3; background: #fff; display: grid; place-items: center; transition: background .3s, border-color .3s; }
.af-card:has(input:checked) { border-color: var(--wine); background: linear-gradient(140deg, #fff 40%, #fdeef2); box-shadow: 0 18px 34px -24px rgba(162, 16, 54, .75); }
.af-card input:checked ~ .af-card__check { background: var(--wine); border-color: var(--wine); animation: pop .4s var(--ease); }
.af-card input:checked ~ .af-card__check svg { stroke-dashoffset: 0; }
.af-card.is-fixed { cursor: default; background: linear-gradient(140deg, var(--night-2), #3a0b1d); border-color: transparent; }
.af-card.is-fixed:hover { transform: none; }
.af-card.is-fixed b { color: #fff; } .af-card.is-fixed small { color: rgba(255,255,255,.7); }
.af-card.is-fixed .af-card__check { background: var(--wine); border-color: var(--wine); }
.af-card.is-fixed .af-card__check svg { stroke-dashoffset: 0; }
.af-card__tag { justify-self: start; margin-top: 6px; padding: 4px 10px; border-radius: 999px; background: rgba(255,255,255,.12); color: var(--rose); font: 700 .72rem/1 var(--head); letter-spacing: .04em; text-transform: uppercase; }
.af-note { display: flex; align-items: center; gap: 8px; margin: 14px 0 0; color: var(--grey); font-size: .9rem; }
.af-note .ico { color: var(--wine); }

/* ---------- end: what happens next + send ---------- */
.af-end { grid-row: 3; grid-column: 2; display: grid; gap: 26px; margin-top: 22px; }
.af-weiter { position: relative; overflow: hidden; padding: clamp(26px, 3.4vw, 40px); border-radius: 28px; color: #fff; background: radial-gradient(120% 120% at 100% 0%, #3a0b1d, var(--night-2) 55%, var(--night)); }
.af-weiter .eyebrow { margin-bottom: 14px; }
.af-weiter__h { font-size: clamp(1.5rem, 2.6vw, 2rem); color: #fff; margin: 0 0 22px; }
.af-next { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; counter-reset: n; }
.af-next li { display: flex; gap: 14px; align-items: flex-start; padding: 16px; border-radius: 18px; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.12); }
.af-next__ico { flex: none; width: 42px; height: 42px; border-radius: 13px; display: grid; place-items: center; background: var(--wineg); color: #fff; box-shadow: 0 10px 20px -10px rgba(224, 68, 111, .8); }
.af-next b { display: block; font: 800 1rem/1.3 var(--head); color: #fff; }
.af-next small { display: block; margin-top: 3px; font-size: .88rem; line-height: 1.45; color: rgba(255,255,255,.72); }
.af-send { display: grid; justify-items: center; gap: 14px; text-align: center; padding: 10px 0 0; }
.af-send .btn { min-width: min(100%, 340px); }
.af-send__note { display: flex; gap: 10px; align-items: flex-start; max-width: 560px; margin: 0; font-size: .88rem; line-height: 1.5; color: var(--grey); text-align: left; }
.af-send__note .ico { color: var(--wine); margin-top: 2px; }
.af-reset { font-size: .88rem; color: var(--grey); }
.af-reset.is-confirm { color: var(--wine); font-weight: 700; }
.btn.is-busy { pointer-events: none; opacity: .85; }
.btn.is-busy .ico { animation: fly .9s var(--ease) infinite; }
@keyframes fly { 50% { transform: translate(4px, -4px); opacity: .4; } }

/* ---------- right: live summary ---------- */
.af-sum { grid-column: 3; grid-row: 1 / 4; align-self: start; position: sticky; top: var(--top); z-index: 5; margin-top: 150px; max-height: calc(100vh - var(--top) - 20px); overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; display: grid; gap: 14px; padding: 18px; border-radius: 28px; background: rgba(255,255,255,.97); border: 1px solid var(--line); box-shadow: 0 40px 80px -46px rgba(60, 10, 30, .55); }
.af-sum__h { display: flex; align-items: center; gap: 8px; margin: 2px 4px 0; font: 800 .78rem/1 var(--head); letter-spacing: .12em; text-transform: uppercase; color: var(--wine); }
.af-pkg { position: relative; overflow: hidden; display: flex; align-items: center; gap: 16px; padding: 20px; border-radius: 22px; color: #fff; background: var(--gold); box-shadow: 0 24px 40px -24px rgba(122, 79, 0, .8); transition: box-shadow .5s; isolation: isolate; }
.af-pkg::before { content: ""; position: absolute; inset: 0; z-index: -1; opacity: 0; transition: opacity .6s var(--ease); background: var(--wineg); }
.af-pkg::after { content: ""; position: absolute; inset: 0; z-index: -1; opacity: 0; transition: opacity .6s var(--ease); background: var(--violet); }
.af-pkg--business { box-shadow: 0 24px 40px -24px rgba(162, 16, 54, .85); } .af-pkg--business::before { opacity: 1; }
.af-pkg--enterprise { box-shadow: 0 24px 40px -22px rgba(90, 22, 144, .9); } .af-pkg--enterprise::after { opacity: 1; }
.af-pkg__icon { flex: none; width: 58px; height: 58px; border-radius: 18px; display: grid; place-items: center; background: #fff4d6; color: #8a5a00; box-shadow: 0 10px 20px -10px rgba(0,0,0,.4); transition: background .5s, color .5s; }
.af-pkg--business .af-pkg__icon { background: var(--blush); color: var(--wine); }
.af-pkg--enterprise .af-pkg__icon { background: #efe3fb; color: #5a1690; }
.af-pkg__icon .ico { width: 28px; height: 28px; }
.af-pkg__txt { display: grid; gap: 2px; min-width: 0; }
.af-pkg__txt small { font: 700 .72rem/1 var(--head); letter-spacing: .1em; text-transform: uppercase; opacity: .8; }
.af-pkg__txt b { font: 800 1.85rem/1.05 var(--head); letter-spacing: -.02em; }
.af-pkg__time { display: inline-flex; align-items: center; gap: 6px; font: 600 .86rem/1.2 var(--body); opacity: .92; }
.af-pkg__time .ico { width: 15px; height: 15px; }
.af-pkg__shine { position: absolute; inset: 0; z-index: 1; pointer-events: none; background: linear-gradient(110deg, transparent 30%, rgba(255,255,255,.4) 48%, transparent 66%); transform: translateX(-120%); }
.af-pkg.is-swap .af-pkg__shine { animation: shine 1s var(--ease); }
.af-pkg.is-swap .af-pkg__icon { animation: spinpop .7s var(--ease); }
.af-pkg.is-swap .af-pkg__txt b { animation: swapin .55s var(--ease); }
@keyframes shine { to { transform: translateX(120%); } }
@keyframes spinpop { 0% { transform: scale(.6) rotate(-30deg); } 60% { transform: scale(1.12) rotate(6deg); } }
@keyframes swapin { from { opacity: 0; transform: translateY(14px); filter: blur(4px); } }
.af-sum__why { margin: 0 4px; font: 600 .92rem/1.45 var(--body); color: var(--ink); }
.af-sum__counts { margin: -6px 4px 0; font: 700 .86rem/1.2 var(--head); color: var(--grey); }
.af-sum__prog { display: grid; gap: 7px; padding: 12px 14px; border-radius: 16px; background: var(--paper); border: 1px solid var(--line); font: 600 .86rem/1.2 var(--body); color: var(--grey); }
.af-sum__prog b { color: var(--ink); font-family: var(--head); }
.af-sum__prog > i, .af-nav__bar > i { display: block; height: 6px; border-radius: 6px; background: #eadde2; overflow: hidden; }
.af-sum__prog > i > b, .af-nav__bar > i > b { display: block; height: 100%; width: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--wine), #e0446f, var(--rose)); transform-origin: left; transform: scaleX(var(--p, 0)); transition: transform .6s var(--ease); }
.af-sum__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; font-size: .86rem; line-height: 1.35; }
.af-sum__list li { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 2px 10px; padding: 8px 10px; border-radius: 12px; background: #fff; border: 1px solid var(--line); animation: swapin .4s var(--ease); }
.af-sum__list li b { font: 800 .74rem/1.4 var(--head); color: var(--wine); white-space: nowrap; }
.af-sum__list li span { color: var(--ink); overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.af-sum__list li.is-empty { display: block; color: var(--grey); background: transparent; border-style: dashed; text-align: center; }
.af-check { position: relative; display: flex; align-items: flex-start; gap: 11px; padding: 4px; cursor: pointer; font: 600 .92rem/1.35 var(--head); color: var(--ink); }
.af-check small { display: block; font: 400 .78rem/1.3 var(--body); color: var(--grey); }
.af-check .af-chip__box { margin-top: -1px; }
.af-sum__send { width: 100%; min-height: 58px; font-size: 1.05rem; }
.af-sum__wa { display: inline-flex; align-items: center; justify-content: center; gap: 8px; font: 700 .9rem var(--head); color: #128c4a; text-decoration: none; padding: 4px; }
.af-sum__wa .ico { color: #25D366; }
.af-sum__wa:hover { text-decoration: underline; }

/* honeypot - out of sight for people */
.af-hp { position: absolute !important; left: -9999px; top: auto; width: 1px; height: 1px; overflow: hidden; }

/* mobile bottom bar */
.af-dock { display: none; }

/* ---------- thank-you state ---------- */
.af.is-done .af__grid { display: none; }
.af-thanks { position: relative; min-height: 100svh; padding: 140px var(--gut) 90px; display: grid; justify-items: center; color: #fff; isolation: isolate; outline: none; }
.af__band--full { position: absolute; inset: 0; z-index: -1; margin: 0; grid-row: auto; grid-column: auto; }
.af-thanks__in { width: min(100%, 760px); display: grid; justify-items: center; text-align: center; gap: 18px; }
.af-thanks .hero__lead { margin: 0; }
.af-thanks .af-pkg { width: min(100%, 420px); text-align: left; }
.af-tick { width: 92px; height: 92px; fill: none; stroke-linecap: round; stroke-linejoin: round; }
.af-tick circle { stroke: rgba(255,255,255,.18); stroke-width: 3; }
.af-tick path { stroke: #57e389; stroke-width: 4; stroke-dasharray: 40; stroke-dashoffset: 40; animation: draw .6s var(--ease) .45s forwards; }
.af-tick circle { stroke-dasharray: 152; stroke-dashoffset: 152; animation: draw .7s var(--ease) forwards; stroke: #57e389; }
@keyframes draw { to { stroke-dashoffset: 0; } }
.af-thanks__in > * { animation: rise .8s var(--ease) both; }
.af-thanks__in > :nth-child(2) { animation-delay: .1s; } .af-thanks__in > :nth-child(3) { animation-delay: .18s; } .af-thanks__in > :nth-child(4) { animation-delay: .26s; } .af-thanks__in > :nth-child(5) { animation-delay: .34s; } .af-thanks__in > :nth-child(6) { animation-delay: .42s; } .af-thanks__in > :nth-child(7) { animation-delay: .5s; }
.af-thanks__in > .af-tick { animation: none; }
.af-thanks__list { list-style: none; margin: 0; padding: 14px; width: min(100%, 620px); display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; border-radius: 22px; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.12); text-align: left; font-size: .88rem; line-height: 1.35; }
.af-thanks__list li { padding: 8px 10px; border-radius: 12px; background: rgba(255,255,255,.05); }
.af-thanks__list b { display: block; font: 800 .72rem/1.4 var(--head); color: var(--rose); letter-spacing: .04em; text-transform: uppercase; }
.af-thanks__list span { color: rgba(255,255,255,.88); overflow-wrap: anywhere; }
.af-thanks__btns { justify-content: center; }
.af-thanks__next { width: 100%; margin-top: 26px; text-align: left; }
.af-thanks__next .af-weiter__h { text-align: center; }

/* ---------- tablet + phone ---------- */
@media (max-width: 1099px) {
  .af { --top: 60px; }
  html:has(.view-anfrage) { scroll-padding-top: 122px; }
  .af__grid { grid-template-columns: minmax(0, 1fr); padding-bottom: 40px; }
  .af__band { grid-row: 1; grid-column: 1; }
  .af__intro { grid-row: 1; grid-column: 1; padding: 128px 0 92px; }
  .af-nav { grid-row: 2; grid-column: 1; margin: -60px 0 14px; top: 60px; z-index: 40; }
  .af-nav__h, .af-nav__list { display: none; }
  .af-nav__bar { display: grid; gap: 8px; padding: 12px 16px; border-radius: 18px; background: rgba(22, 8, 14, .88); color: #fff; backdrop-filter: saturate(1.6) blur(16px); -webkit-backdrop-filter: saturate(1.6) blur(16px); border: 1px solid rgba(255,255,255,.12); box-shadow: 0 20px 40px -24px rgba(0,0,0,.6); font: 600 .9rem/1.2 var(--head); }
  .af-nav__bar b { font-weight: 800; }
  .af-nav__bar > span > span { color: var(--rose); }
  .af-nav__bar > i { height: 4px; background: rgba(255,255,255,.15); }
  .af__steps { grid-row: 3; grid-column: 1; margin-top: 0; }
  .af-step { scroll-margin-top: 132px; }
  .af-sum { grid-row: 4; grid-column: 1; position: static; margin: 22px 0 0; max-height: none; overflow: visible; scroll-margin-top: 72px; }
  .af-sum__send { display: none; }
  .af-end { grid-row: 5; grid-column: 1; }
  .af-dock { position: fixed; z-index: 95; left: 0; right: 0; bottom: 0; display: flex; align-items: center; gap: 12px; padding: 10px max(16px, env(safe-area-inset-right)) calc(10px + env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left)); background: rgba(22, 8, 14, .9); backdrop-filter: saturate(1.6) blur(18px); -webkit-backdrop-filter: saturate(1.6) blur(18px); border-top: 1px solid rgba(255,255,255,.1); box-shadow: 0 -20px 40px -24px rgba(0,0,0,.6); transform: translateY(0); transition: transform .4s var(--ease); }
  .af-dock.is-off { transform: translateY(110%); }
  .af-dock__pkg { flex: 1; min-width: 0; display: flex; align-items: center; gap: 10px; color: #fff; text-decoration: none; }
  .af-dock__pkg small { display: block; font: 600 .72rem/1.1 var(--body); color: var(--rose); }
  .af-dock__pkg b { display: block; font: 800 1.08rem/1.15 var(--head); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .af-dock__ico { flex: none; width: 42px; height: 42px; border-radius: 13px; display: grid; place-items: center; background: var(--gold); color: #fff; transition: background .4s; }
  .af-dock__ico.af-pkg--business { background: var(--wineg); } .af-dock__ico.af-pkg--enterprise { background: var(--violet); }
  .af-dock__ico::before, .af-dock__ico::after { display: none; }
  .af-dock__ico.is-swap { animation: spinpop .6s var(--ease); }
  .af-dock__send { min-height: 48px; padding: 0 20px; }
  .view-anfrage .wa-fab { bottom: calc(84px + env(safe-area-inset-bottom)); }
  .view-anfrage .ftr { padding-bottom: calc(100px + env(safe-area-inset-bottom)); }
  .view-anfrage:has(.af.is-done) .wa-fab, .view-anfrage:has(.af-dock.is-off) .wa-fab { bottom: calc(18px + env(safe-area-inset-bottom)); }
}
@media (max-width: 640px) {
  .af-step__body--2, .af-cards, .af-next, .af-thanks__list { grid-template-columns: minmax(0, 1fr); }
  .af-step { border-radius: 22px; }
  .af-step__ico { display: none; }
  .af-step__no { width: 40px; height: 40px; border-radius: 13px; }
  .af-chip { flex: 1 1 auto; min-height: 52px; padding: 10px 16px 10px 12px; font-size: .95rem; }
  .af-card { min-height: 0; }
  .af-thanks { padding-top: 120px; }
  .af-pkg__txt b { font-size: 1.6rem; }
}
@media (max-width: 340px) { .af-dock__send span { display: none; } .af-dock__send { width: 52px; padding: 0; } }

@media (prefers-reduced-motion: reduce) {
  .af-pkg.is-swap .af-pkg__shine, .af-pkg.is-swap .af-pkg__icon, .af-pkg.is-swap .af-pkg__txt b { animation: none; }
  .af-tick path, .af-tick circle { stroke-dashoffset: 0; }
}
@media print { .af-nav, .af-dock, .af-sum__send, .af-send .btn { display: none; } }

/* summary panel: always fits the screen - only the answer list scrolls, the send button stays visible */
@media (min-width: 1100px) {
  .af-sum { display: flex; flex-direction: column; overflow: hidden; gap: 12px; padding: 16px; }
  .af-sum > * { flex: none; }
  .af-sum__list { flex: 1 1 auto; min-height: 44px; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; padding-right: 2px; }
}
.af-sum__list li.is-empty[hidden], .af-thanks__list[hidden] { display: none; }
.af-sum__list li span { -webkit-line-clamp: 1; }
.af-pkg { padding: 16px 18px; gap: 14px; }
.af-pkg__icon { width: 52px; height: 52px; border-radius: 16px; }
.af-pkg__txt b { font-size: 1.65rem; }
.af-pkg__time { white-space: nowrap; font-size: .82rem; }
.af-thanks .af-pkg__txt b { font-size: 1.9rem; }

/* sending layer (1.3.1) */
.af-ov { position: fixed; inset: 0; z-index: 400; display: grid; place-items: center; padding: var(--gut); background: rgba(18, 6, 11, .55); backdrop-filter: blur(8px); opacity: 0; transition: opacity .35s var(--ease); }
.af-ov.is-on { opacity: 1; }
.af-ov__box { width: min(100%, 420px); background: #fff; border-radius: 22px; padding: 30px 28px 26px; box-shadow: 0 40px 80px -30px rgba(18, 6, 11, .6); text-align: center; transform: translateY(14px) scale(.98); transition: transform .45s var(--ease); }
.af-ov.is-on .af-ov__box { transform: none; }
.af-ov__ring { width: 58px; height: 58px; margin: 0 auto 14px; border-radius: 50%; border: 4px solid var(--blush); border-top-color: var(--wine); animation: af-spin 1s linear infinite; position: relative; }
.af-ov.is-ok .af-ov__ring { animation: none; border-color: #1f9d55; background: #1f9d55; }
.af-ov.is-ok .af-ov__ring i { position: absolute; left: 17px; top: 9px; width: 12px; height: 22px; border: solid #fff; border-width: 0 4px 4px 0; transform: rotate(45deg); }
.af-ov__h { margin: 0 0 16px; font: 800 1.15rem/1.3 var(--head); color: var(--ink); }
.af-ov__bar { height: 8px; border-radius: 99px; background: var(--blush); overflow: hidden; margin-bottom: 16px; }
.af-ov__bar i { display: block; height: 100%; width: 0; border-radius: inherit; background: linear-gradient(90deg, var(--wine), #e0446f); animation: af-fill 1.6s var(--ease) forwards; }
.af-ov.is-ok .af-ov__bar i { width: 100%; animation: none; transition: width .3s; }
.af-ov__steps { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; text-align: left; font-size: .92rem; color: var(--grey); }
.af-ov__steps li { display: flex; align-items: center; gap: 10px; opacity: .45; transition: opacity .3s, color .3s; }
.af-ov__steps li::before { content: ""; flex: none; width: 18px; height: 18px; border-radius: 50%; border: 2px solid var(--line); transition: background .3s, border-color .3s; }
.af-ov__steps li.is-done { opacity: 1; color: var(--ink); }
.af-ov__steps li.is-done::before { background: var(--wine) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12 5 5L20 7'/%3E%3C/svg%3E") center/12px no-repeat; border-color: var(--wine); }
@keyframes af-spin { to { transform: rotate(360deg); } }
@keyframes af-fill { 0% { width: 0; } 60% { width: 78%; } 100% { width: 92%; } }
@media (prefers-reduced-motion: reduce) { .af-ov__ring { animation: none; } .af-ov__bar i { animation: none; width: 70%; } }

/* elements with the hidden attribute stay hidden even when a class sets display (1.3.2: thank-you block was visible below the form) */
[hidden] { display: none !important; }