/* soon.css – Seite /<l>/coming-soon/ „Warteliste“ (29.10.2026, tools/coming-soon.mjs, Logik static/js/soon.js). Band + Abzeichen + Projekt-Kasten: site.css (.wsb, .pill-wait, .wlx).
   Formular nutzt die .lf-*-Bausteine aus site.css (lead.js). Keine Endlos-Animation, Schrift ≥ 12 px, RTL über logische Eigenschaften. */
.wsp-hero .reveal{max-width:54rem}
.wsp-h1{font-size:clamp(2.1rem,6vw,4.2rem);line-height:1.02;margin:0 0 1rem}
.wsp-how{list-style:none;counter-reset:w;display:grid;gap:.6rem;margin:1.3rem 0 1.6rem;padding:0}
.wsp-how li{counter-increment:w;display:grid;grid-template-columns:2rem minmax(0,1fr);gap:.65rem;align-items:start;font-weight:600;line-height:1.45}
.wsp-how li::before{content:counter(w);display:grid;place-items:center;width:2rem;height:2rem;border-radius:50%;font-weight:800;color:#16120a;background:linear-gradient(150deg,var(--gold2),var(--gold) 60%,var(--gold-d))}
@media (min-width:900px){.wsp-how{grid-template-columns:repeat(3,minmax(0,1fr));gap:1.1rem}}
.wsp-hero .btn svg,.lf-ws .lf-go svg{width:18px;height:18px}
.wsp-chips{display:flex;gap:.5rem;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none;margin:0 0 1.2rem;padding:2px}
.wsp-chips::-webkit-scrollbar{display:none}
.wsp-chips .chip{flex:none;min-height:44px}
.wsp-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:1rem}
@media (min-width:700px){.wsp-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1100px){.wsp-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:1.2rem}}
.wsc{display:flex;flex-direction:column;min-width:0;overflow:hidden;border-radius:var(--r-lg);border:1px solid rgba(214,178,112,.24);background:linear-gradient(170deg,#121720,#0b0e13);transition:border-color .25s}
.wsc[hidden]{display:none}
.wsc.is-pick{border-color:var(--gold)}
.wsc-img{position:relative;aspect-ratio:16/10;background:#0d1117}
.wsc-img{overflow:hidden}
.wsc-img img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover}
.wsc-ph{display:grid;place-items:center;width:100%;height:100%;font-size:2.4rem;font-weight:800;letter-spacing:.06em;color:var(--gold2);background:radial-gradient(circle at 30% 25%,rgba(243,220,170,.22),transparent 60%),linear-gradient(160deg,#1a2230,#0b0e13)}
.wsc-st{position:absolute;top:.8rem;inset-inline-start:.8rem;color:var(--gold2)}
.wsc-presale{color:var(--plan)}.wsc-construction{color:var(--build)}.wsc-paused{color:#f0b67a}
.wsc-b{display:flex;flex-direction:column;gap:.3rem;flex:1;padding:1.1rem 1.2rem 1.2rem}
.wsc-h{margin:0;font-size:1.3rem;line-height:1.2;letter-spacing:-.02em}
.wsc-m,.wsc-dev,.wsc-c{margin:0;font-size:.86rem;line-height:1.4;color:var(--muted)}
.wsc-dev{font-weight:700;color:var(--gold2)}
.wsc-p{margin:.2rem 0 0;font-size:.88rem;line-height:1.45}
.wsc-p small{font-size:max(12px,.76rem);color:var(--muted)}
.wsc-q{padding:0 6px;border-radius:999px;border:1px solid var(--line2);font-size:12px;color:var(--muted)}
.wsc-t{margin:.3rem 0 .4rem;line-height:1.5;color:#d9d4cb}
.wsc-a{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:auto;padding-top:.4rem}
.wsc-a svg{width:15px;height:15px}
[dir=rtl] .wsc-a .btn-ghost svg{transform:scaleX(-1)}
.wsc-src{margin:.5rem 0 0;font-size:max(12px,.74rem);line-height:1.5;color:var(--muted)}
.wsc-src a{color:var(--muted);text-decoration:underline;text-underline-offset:2px}
.wsp-empty{max-width:44rem;margin:0;padding:1.2rem 1.3rem;border-radius:var(--r);border:1px dashed rgba(214,178,112,.4);color:#d9d4cb;line-height:1.55}
.wsp-box{display:grid;gap:1.3rem;margin-top:0}
@media (min-width:900px){.wsp-box{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);column-gap:clamp(2rem,4vw,3.5rem);align-items:start}.wsp-box .lf-copy{position:sticky;top:96px;grid-row:1/3}}
.wsp-legal,.wsp-foot{display:flex;gap:.5rem;align-items:flex-start;margin:0 0 .9rem;font-size:max(12px,.8rem);line-height:1.5;color:var(--muted)}
.wsp-foot{margin:0}
.wsp-foot a{color:var(--gold2)}
.wsp-legal svg,.wsp-foot svg{flex:none;width:16px;height:16px;margin-top:.15rem;color:var(--gold)}
.wsp-pick .lf-chip span{min-height:44px}
.lf-ws [hidden],.wsp-box .lf-done [hidden]{display:none!important}
.lf-ws.ws-wa .lf-row2{grid-template-columns:minmax(0,1fr)}
.wsp-alt{display:flex;flex-wrap:wrap;align-items:center;gap:.25rem .5rem;margin:0;font-size:.86rem;color:var(--muted)}
.wsp-alt a{display:inline-flex;align-items:center;gap:.35rem;min-height:44px;font-weight:700;color:var(--gold2)}
.wsp-alt svg,.wsp-wago svg{width:16px;height:16px}
.wsp-box.lf-sent .wsp-alt{display:none}
/* Bildnachweis auf dem Bild (12 px), Eckdaten, Preis-Quelle; ohne JS kein Formular (würde sonst per GET mit Personendaten in der Adresse senden) – WhatsApp bleibt */
.wsc-cr{position:absolute;inset-inline:0;bottom:0;padding:1.4rem .8rem .45rem;font-size:12px;line-height:1.3;color:rgba(255,255,255,.86);background:linear-gradient(transparent,rgba(5,8,12,.72));text-shadow:0 1px 2px rgba(0,0,0,.6);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wsc-f{margin:.1rem 0 0;font-size:.86rem;line-height:1.45;font-weight:600;color:#e9e3d8}
.wsc-pm{font-size:max(12px,.78rem);color:var(--muted)}
html:not(.js) .lf-ws,html:not(.js) .wsp-box .lf-done{display:none}
.ws-wam .wsp-alt{display:none}
