/* One design tier per website; previews illustrate the difference in movement. */
.page--preisrechner .pc-design-group { min-width:0; padding:0; margin:0 0 1.8rem; border:0; }
.page--preisrechner .pc-design-group legend { padding:0; color:var(--pc-ink); font-size:1.125rem; font-weight:600; }
.page--preisrechner .pc-design-intro { margin:.6rem 0 1.2rem; font-size:.9375rem; line-height:1.65; color:var(--pc-muted); }
.page--preisrechner .pc-design-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.8rem; }
.page--preisrechner .pc-design-card { display:flex; flex-direction:column; min-width:0; padding:1rem; border:1px solid var(--pc-line); border-radius:.85rem; background:#fff; color:var(--pc-ink); cursor:pointer; }
.page--preisrechner .pc-design-card:hover { border-color:#8297d7; }
.page--preisrechner .pc-design-card.is-selected { border-color:#526dcb; background:#f2f5ff; box-shadow:inset 0 0 0 1px #526dcb; }
.page--preisrechner .pc-design-card:has(input:focus-visible) { outline:2px solid var(--pc-blue); outline-offset:4px; }
.page--preisrechner .pc-design-card__top { display:flex; gap:.55rem; align-items:center; }
.page--preisrechner .pc-design-card__top input { flex:0 0 1rem; width:1rem; height:1rem; margin:0; accent-color:#425fc7; cursor:pointer; }
.page--preisrechner .pc-calculator .pc-design-card input:focus-visible { outline:none; }
.page--preisrechner .pc-design-card__top strong { font-size:1rem; line-height:1.5; }
.page--preisrechner .pc-design-card__price { margin-left:auto; white-space:nowrap; color:#3a54ac; font-size:.875rem; font-weight:600; }
.page--preisrechner .pc-design-card__tagline { display:block; margin:.8rem 0 .7rem; font-size:.9375rem; font-weight:600; line-height:1.5; }
.page--preisrechner .pc-design-card__features { display:grid; gap:.4rem; color:var(--pc-muted); font-size:.8125rem; line-height:1.6; }
.page--preisrechner .pc-design-card__features > span { display:block; padding-left:.9rem; position:relative; }
.page--preisrechner .pc-design-card__features > span::before { content:'·'; position:absolute; left:0; color:#637abe; font-weight:700; }
.page--preisrechner .pc-design-note { color:var(--pc-muted); font-size:.8125rem; line-height:1.7; margin:1rem 0 .6rem; }
.page--preisrechner .pc-functional-title { border-top:1px solid var(--pc-line); padding-top:1.6rem; margin:0 0 1rem; font-size:1.125rem; font-weight:600; }
.pc-design-preview { display:block; height:5rem; margin-top:.85rem; border:1px solid #dce2f2; border-radius:.45rem; background:#f6f8fd; overflow:hidden; position:relative; perspective:160px; }
.pc-design-preview__nav { display:flex; justify-content:flex-end; gap:.25rem; height:.8rem; padding:.25rem .5rem; background:#e7ecf8; }
.pc-design-preview__nav i { display:block; width:.6rem; height:.25rem; border-radius:2px; background:#8798c6; }
.pc-design-preview__scene { position:relative; display:block; padding:.55rem .8rem; }
.pc-design-preview__headline,.pc-design-preview__line { display:block; height:.35rem; border-radius:2px; width:42%; background:#576eaf; margin-bottom:.3rem; }
.pc-design-preview__line { width:65%; height:.2rem; background:#c5cee5; }
.pc-design-preview__tiles { display:flex; gap:.4rem; margin-top:.5rem; }
.pc-design-preview__tiles i { display:block; height:1rem; flex:1; border:1px solid #d0daef; border-radius:.2rem; background:#e6ecf8; }
[data-design-tier=plus] .pc-design-preview__tiles i { background:#dce8fa; }
[data-design-tier=pro] .pc-design-preview { background:linear-gradient(115deg,#edf4ff,#f0edfd); }
[data-design-tier=pro] .pc-design-preview__tiles i:nth-child(2) { background:#cdd5f7; }
[data-design-tier=max] .pc-design-preview { background:radial-gradient(ellipse at 75% 80%,#6a48a5 0,transparent 65%),#182340; border-color:#303d69; }
[data-design-tier=max] .pc-design-preview__nav { background:#ffffff12; }
[data-design-tier=max] .pc-design-preview__headline { background:#cfdbff; width:53%; }
[data-design-tier=max] .pc-design-preview__line { background:#8194c1; }
[data-design-tier=max] .pc-design-preview__tiles i { border-color:#bacaf533; background:#ffffff16; }
@media(hover:hover) and (prefers-reduced-motion:no-preference) {
  [data-design-tier=plus]:is(:hover,:focus-within) .pc-design-preview__nav i { animation:design-menu .65s ease both; }
  [data-design-tier=plus]:is(:hover,:focus-within) .pc-design-preview__scene { animation:design-reveal .8s ease both; }
  [data-design-tier=pro]:is(:hover,:focus-within) .pc-design-preview__scene { animation:design-slide 1s cubic-bezier(.22,1,.36,1) both; }
  [data-design-tier=max]:is(:hover,:focus-within) .pc-design-preview__scene { animation:design-cinema 1.2s cubic-bezier(.22,1,.36,1) both; }
}
@keyframes design-menu { from { transform:translateY(-.4rem); opacity:0; } to { transform:none; opacity:1; } }
@keyframes design-reveal { from { transform:translateY(.4rem); opacity:.2; } to { transform:none; opacity:1; } }
@keyframes design-slide { from { transform:translateX(32%); opacity:.2; } to { transform:none; opacity:1; } }
@keyframes design-cinema { from { transform:translateY(.6rem) rotateX(20deg) scale(1.25); opacity:.2; } to { transform:none; opacity:1; } }
@media(max-width:600px) { .page--preisrechner .pc-design-grid { grid-template-columns:1fr; } }
@media(forced-colors:active) { .page--preisrechner .pc-design-card.is-selected { outline:2px solid Highlight; }.pc-design-preview { display:none; } }
