/* =========================================================
   SPRINT 2 · VISUELLE KERNVEREINHEITLICHUNG
   Wird innerhalb von style-neu.css nach den Basiskomponenten geladen.
   Ziel: Typografie, Buttons, Formulare und Standardkarten sichtbar angleichen,
   ohne seitenbezogene Spezialkomponenten oder Funktionslogik umzubauen.
========================================================= */

/* -------------------------
   Typografie und Lesefluss
------------------------- */
body {
  font-family: var(--tm-font-family);
  color: var(--tm-color-text);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

.tm-eyebrow,
.tm-unified-eyebrow {
  margin: 0 0 var(--tm-space-4);
  color: var(--tm-color-primary);
  font-size: var(--tm-font-size-xs);
  font-weight: var(--tm-weight-bold);
  letter-spacing: .11em;
  line-height: 1.2;
  text-transform: uppercase;
}

.tm-section-head,
.tm-section-header {
  max-width: 760px;
  margin-bottom: var(--tm-space-12);
}

.tm-section-head h1,
.tm-section-head h2,
.tm-section-head h3,
.tm-section-header h1,
.tm-section-header h2,
.tm-section-header h3 {
  margin-top: 0;
  color: var(--tm-color-text);
  text-wrap: balance;
}

.tm-section-head h2,
.tm-section-header h2 {
  font-size: var(--tm-font-size-h2);
  line-height: var(--tm-line-heading);
  letter-spacing: -.045em;
}

.tm-section-head h3,
.tm-section-header h3 {
  font-size: var(--tm-font-size-h3);
  line-height: var(--tm-line-heading);
  letter-spacing: -.025em;
}

.tm-lead {
  max-width: 68ch;
  color: var(--tm-color-muted);
  font-size: var(--tm-font-size-lg);
  line-height: var(--tm-line-body);
}

/* -------------------------
   Statussystem
------------------------- */
.tm-status-badge,
.tm-portal-pill {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: .3rem .7rem;
  border-radius: var(--tm-radius-pill);
  font-size: var(--tm-font-size-xs);
  font-weight: var(--tm-weight-semibold);
  line-height: 1;
}

.tm-status-good,
.tm-portal-pill-good {
  color: var(--tm-color-success);
  background: var(--tm-color-success-soft);
}

.tm-status-warning,
.tm-portal-pill-warning {
  color: var(--tm-color-warning);
  background: var(--tm-color-warning-soft);
}

.tm-status-danger {
  color: var(--tm-color-danger);
  background: var(--tm-color-danger-soft);
}

.tm-status-info {
  color: var(--tm-color-primary-hover);
  background: var(--tm-color-info-soft);
}

/* Komponentenbibliothek */
.page-components .tm-page-section {
  padding-block: var(--tm-space-section);
}

.page-components .tm-page-section + .tm-page-section {
  border-top: 1px solid var(--tm-color-border);
}

.page-components .tm-page-inner {
  width: min(calc(100% - 40px), 1200px);
  margin-inline: auto;
}

@media (max-width: 640px) {
  .page-components .tm-page-inner {
    width: min(calc(100% - 28px), 1200px);
  }

  .tm-section-head,
  .tm-section-header {
    margin-bottom: var(--tm-space-8);
  }

}