/* Gemeinsame Gestaltungsgrundlage aller Seiten von turq.app: Startseiten, 404,
   Rechtstexte und Einladungsseite binden diese Datei ein.
   Farben aus den App-Tokens im Dark Mode (apps/turq/constants/color-palette.cjs,
   theme.ts). Bewusst ohne Webfonts und ohne Skripte Dritter. */
:root {
  --bg: #050b14;
  --bg-alt: #07111d;
  --card: #101e2c;
  --inset: #1a2c3d;
  --border: #203244;
  --text: #e0f2f1;
  --muted: #9db3c2;
  --primary: #1cce99;
  --on-primary: #050b14;
  --aqua: #2de1fc;
  --radius-card: 20px;
  --gutter: 20px;
  --maxw: 1120px;
  --font: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  color-scheme: dark;
}

/* ---------- Marke ---------- */
.brand {
  display: inline-flex; align-items: center; gap: 10px;
  color: var(--text); text-decoration: none;
  font-weight: 800; font-size: 19px; letter-spacing: -0.02em;
}
.brand-tile { width: 36px; height: 36px; border-radius: 10px; overflow: hidden; background: #fff; flex: none; }
/* Das App-Icon hat viel Weißraum; im kleinen Tile den Schriftzug vergrößern (wie Feature-Grafik) */
.brand-tile img { display: block; width: 100%; height: 100%; transform: scale(1.6); }

/* ---------- Knöpfe ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 52px; padding: 0 26px; border-radius: 999px;
  background: linear-gradient(135deg, var(--primary), var(--aqua));
  color: var(--on-primary); font-weight: 800; font-size: 16px; text-decoration: none;
  box-shadow: 0 10px 30px rgba(28, 206, 153, 0.28);
}
.btn:hover { filter: brightness(1.06); }
.btn-sm { min-height: 40px; padding: 0 16px; font-size: 14px; box-shadow: none; }
.btn-outline {
  min-height: 44px; padding: 0 18px; font-size: 15px;
  background: transparent; color: var(--primary); border: 1.5px solid var(--primary); box-shadow: none;
}
.btn-outline:hover { background: rgba(28, 206, 153, 0.1); filter: none; }

/* ---------- Fokus ---------- */
.btn:focus-visible, .brand:focus-visible { outline: 3px solid var(--aqua); outline-offset: 3px; }