/* The pricing block (#preise on the start page, /preise): layout only – buttons, links, eyebrow and headings are the site's
   (style.css); the backed icon is app-controls' .ac-icon-tile (its rules are appended at build, build-public.mjs), tinted
   here with the site's green. The skeleton has the cards' final size, so nothing moves when the live prices arrive. */
.price-block{--bz-accent:var(--green);--bz-accent-ink:var(--green);--bz-card:#fff;--bz-on-accent:#fff;padding-top:40px;padding-bottom:70px}
.price-page .price-block{padding-top:70px;min-height:60vh}
.price-icon{display:contents}
.price-glyph{width:16px;height:16px;flex:none;color:var(--green);margin-top:2px}
.price-trust{display:flex;flex-wrap:wrap;justify-content:center;gap:10px 26px;list-style:none;padding:0;margin:26px 0 0;font-size:13px;color:var(--ink)}
.price-trust li,.price-checks li{display:flex;gap:9px;align-items:flex-start;min-width:0}
.tier-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,205px),1fr));gap:14px;margin-top:30px}
.tier-card{position:relative;display:flex;flex-direction:column;gap:10px;min-height:470px;background:#fff;border:1px solid var(--line);border-radius:18px;padding:20px 18px 18px;min-width:0;transition:transform .2s,box-shadow .2s,border-color .2s}
.tier-card.free{background:transparent}
.tier-card.recommended{border-color:var(--green);box-shadow:0 0 0 1px var(--green)}
@media(hover:hover){.tier-card:not(.price-skeleton):hover{transform:translateY(-3px);box-shadow:0 14px 30px -18px rgba(37,46,38,.45);border-color:#c3cab8}}
.tier-card:focus-within{border-color:var(--green)}
.price-head{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.tier-card .price-head{flex-direction:column;align-items:flex-start;gap:12px}
.tier-card .price-head .price-flag{position:absolute;top:18px;right:16px}
.price-head h3{font-size:18px;margin:0;line-height:1.25;min-width:0}
.price-flag{background:var(--lime);color:var(--ink);border-radius:999px;padding:3px 9px;font-size:10px;font-weight:700;letter-spacing:.6px;text-transform:uppercase}
.price-detail{margin:0;font-size:13px;line-height:1.5;color:var(--muted);min-height:4.5em}
.price-amount{margin:4px 0 0;display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 8px}
.price-amount strong{color:var(--ink);font-size:30px;font-weight:700;font-variant-numeric:tabular-nums;letter-spacing:-.6px}
.price-vat{font-size:11px;color:var(--muted)}
.price-chips{display:flex;flex-wrap:wrap;gap:6px;list-style:none;padding:0;margin:0}
.price-chips li{border:1px solid var(--line);border-radius:999px;padding:2px 9px;font-size:11px;font-weight:700;color:var(--green);background:var(--paper)}
.price-why{margin:0;font-size:13px;line-height:1.55;color:var(--ink)}
.price-pack{margin:2px 0 0;font-size:12px;line-height:1.5;border-top:1px solid var(--line);padding-top:10px;display:flex;flex-direction:column;gap:6px;align-items:flex-start;font-variant-numeric:tabular-nums;color:var(--muted)}
.price-saving{display:inline-block;background:var(--lime);color:var(--ink);border-radius:999px;padding:3px 9px;font-size:11px;font-weight:700}
.tier-card .button,.price-extra .button{margin-top:auto;width:100%;padding:13px 14px;font-size:13px;gap:10px}
.price-fallback{margin:30px 0 0;text-align:center;border:1px solid var(--line);border-radius:18px;padding:34px 20px;background:#fff}
.price-fallback[hidden]{display:none}
.price-compare{margin-top:26px;border:1px solid var(--line);border-radius:18px;background:#fff}
.price-compare summary{cursor:pointer;padding:18px 22px;font-weight:700;font-size:14px}
.price-compare summary:focus-visible{outline:2px solid var(--green);outline-offset:2px;border-radius:18px}
.price-compare-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:22px 30px;padding:4px 22px 22px}
.price-compare h3{font-size:12px;font-weight:700;letter-spacing:1.4px;text-transform:uppercase;margin:0 0 10px;color:var(--green)}
.price-compare dl{margin:0}
.price-compare dt{font-weight:700;font-size:13px;margin-top:10px}
.price-compare dd{margin:3px 0 0;font-size:13px;line-height:1.55;color:var(--muted)}
.price-checks{list-style:none;padding:0;margin:0;display:grid;gap:9px;font-size:13px;line-height:1.5}
.price-checks.small{font-size:12px;color:var(--muted);gap:5px;padding-left:25px;list-style:disc}
.price-checks.small li{display:list-item}
.price-more{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:14px;margin-top:14px}
.price-more .price-extra:first-child{align-self:start}
.price-extra{display:flex;flex-direction:column;gap:12px;border:1px solid var(--line);border-radius:18px;padding:22px 20px 20px;background:var(--paper);min-width:0}
.price-extra p{margin:0;font-size:13px;line-height:1.55;color:var(--muted)}
.price-extra.price-enterprise{background:#fff}
.price-extra .text-link{align-self:center;font-size:13px}
.price-skeleton .sk{display:block;border-radius:6px;background:linear-gradient(90deg,#ebece4 0%,#f4f4ee 50%,#ebece4 100%);background-size:200% 100%;animation:price-shimmer 1.4s ease-in-out infinite}
.sk-tile{height:40px;width:40px;border-radius:10px!important}.sk-title{height:20px;width:70%}.tier-card.price-skeleton .sk-line:nth-of-type(3){height:58px}.sk-price{height:32px;width:45%;margin-top:4px}.sk-chips{height:20px;width:65%}.sk-line{height:12px;width:100%}.sk-line.short{width:60%}.sk-button{height:44px;width:100%;margin-top:auto;border-radius:7px!important}
@keyframes price-shimmer{from{background-position:100% 0}to{background-position:-100% 0}}
@media(prefers-reduced-motion:reduce){.price-skeleton .sk{animation:none}.tier-card{transition:none}.tier-card:not(.price-skeleton):hover{transform:none}}
@media(max-width:760px){.price-block{padding-top:24px;padding-bottom:50px}.tier-card{min-height:420px}.price-detail{min-height:0}.price-trust{flex-direction:column;align-items:flex-start;max-width:340px;margin-left:auto;margin-right:auto}}

/* app-controls iconTile (packages/app-controls/src/controls.css) */
.ac-icon-tile { display: inline-grid; flex: none; place-items: center; width: 2rem; height: 2rem; border-radius: var(--bz-r3, 10px); background: color-mix(in srgb, var(--bz-accent, #49aecb) 12%, var(--bz-card, #fff)); color: var(--bz-accent-ink, #1e6f86); }
.ac-icon-tile .ac-icon { width: 1.125rem; height: 1.125rem; }
.ac-icon-tile[data-size="large"] { width: 2.5rem; height: 2.5rem; }
.ac-icon-tile[data-size="large"] .ac-icon { width: 1.375rem; height: 1.375rem; }
.ac-icon-tile[data-selected="true"], label:has(input:checked) .ac-icon-tile, [aria-checked="true"] .ac-icon-tile, [aria-expanded="true"] > .ac-icon-tile { background: var(--bz-accent-ink, #1e6f86); color: var(--bz-on-accent, #fff); }