/* Feste Seite „Bald verfügbar“ für meqiri.com bis zum Start (23.10.2026). Farben aus src/lib/ci.ts,
   Überschrift Manrope ExtraBold vom eigenen Server (keine Abrufe bei Google). */
@font-face { font-family: "Manrope"; font-weight: 800; font-display: swap; src: url("/manrope-800.woff2") format("woff2"); }
:root { --hintergrund: #0B1120; --hell: #E5ECF7; --gedaempft: #8A99B5; --rand: #1F2A44; --tuerkis: #2DD4BF; }
* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; background: var(--hintergrund); color: var(--hell);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; }
body { display: flex; flex-direction: column; min-height: 100vh; }
main { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 48px 24px; }
/* Svens Logo mit Glanz als Ganzes (public/meqiri-logo-glanz.webp, 900 × 477), nicht gestaucht. */
img.logo { width: min(360px, 78vw); height: auto; }
h1 { font-family: "Manrope", sans-serif; font-weight: 800; font-size: clamp(2rem, 6vw, 3.25rem); line-height: 1.08; letter-spacing: -0.02em;
  margin: 40px 0 0; max-width: 16ch; text-wrap: balance; color: #FFFFFF; }
p.bald { margin: 24px 0 0; font-size: 1.125rem; color: var(--gedaempft); }
p.bald span { color: var(--tuerkis); }
footer { padding: 24px; display: flex; justify-content: center; gap: 24px; font-size: 0.875rem; border-top: 1px solid var(--rand); }
footer a { color: var(--gedaempft); text-decoration: none; }
footer a:hover { color: var(--hell); }
article { max-width: 720px; margin: 0 auto; padding: 48px 24px; text-align: left; line-height: 1.6; }
article h1 { margin: 0 0 32px; max-width: none; font-size: 2.25rem; }
article h2 { font-size: 1.125rem; margin: 32px 0 8px; color: #FFFFFF; }
article p { margin: 0; color: var(--gedaempft); }
article a { color: var(--tuerkis); }

/* Eintragen für die Benachrichtigung zum Start */
form.eintragen { margin-top: 40px; width: min(460px, 100%); text-align: left; }
form.eintragen label { display: block; font-size: 0.875rem; color: var(--hell); margin-bottom: 8px; }
form.eintragen .zeile { display: flex; gap: 8px; }
form.eintragen input[type=email] { flex: 1; min-width: 0; padding: 12px 14px; border-radius: 12px; border: 1px solid var(--rand);
  background: #111A2E; color: var(--hell); font-size: 1rem; }
form.eintragen input[type=email]:focus { outline: 2px solid #9945FF; outline-offset: 1px; }
form.eintragen button { padding: 12px 18px; border: 0; border-radius: 12px; background: #9945FF; color: #FFFFFF; font-weight: 600; font-size: 1rem; cursor: pointer; }
form.eintragen button:disabled { opacity: 0.6; }
form.eintragen .falle { position: absolute; left: -10000px; width: 1px; height: 1px; opacity: 0; }
form.eintragen .hinweis { margin: 10px 0 0; font-size: 0.75rem; line-height: 1.5; color: var(--gedaempft); }
form.eintragen .hinweis a { color: var(--gedaempft); text-decoration: underline; }
form.eintragen .meldung { margin: 12px 0 0; font-size: 0.9375rem; color: var(--tuerkis); min-height: 1em; }
@media (max-width: 420px) { form.eintragen .zeile { flex-direction: column; } }
.mitte { text-align: center; }
.mitte button { margin-top: 24px; padding: 12px 22px; border: 0; border-radius: 12px; background: #9945FF; color: #FFFFFF; font-weight: 600; font-size: 1rem; cursor: pointer; }