/* ============================================================
   Fernwartung (cd_fernwartung) — AnyDesk-Kachel
   ============================================================
   Links der Kopf (Ueberschrift plus Einleitung), rechts eine helle
   Karte mit dem Download-Knopf, drei Schritten und dem Rueckruf.
   Auf schmalen Schirmen stapelt sich beides.
   ============================================================ */

.cd-fernwartung {
  background: var(--cd-flaeche-2);
}

/* Kopf (Bauteile/Portalkopf) oben, darunter die Karte in
   lesbarer Breite links — kein zweispaltiges Raster mehr. */
.cd-fernwartung__inhalt {
  display: grid;
  /* var(--cd-a5) und nicht clamp(24px, 4vw, 40px): Der Rasterabstand
     ADDIERTE sich zum Aussenabstand des Portalkopfs — gemessen 64 px
     zwischen Kopf und Karte, waehrend die uebrigen sechs Portalseiten
     bei 24 px stehen. Beim Durchklicken las sich das als Sprung ohne
     Grund. */
  gap: var(--cd-a5);
}

/* --- Karte --- */
.cd-fernwartung__karte {
  display: grid;
  gap: var(--cd-a4);
  max-inline-size: 33rem;
  padding: clamp(24px, 4vw, 38px);
  background: var(--cd-weiss);
  border: 1px solid var(--cd-linie);
  border-radius: var(--cd-r-gross);
  box-shadow: var(--cd-schatten-karte);
}

.cd-fernwartung__download {
  inline-size: 100%;
  justify-content: center;
}
.cd-fernwartung__mini {
  margin: calc(var(--cd-a4) * -1 + 2px) 0 0;
  font-size: var(--cd-gr-klein);
  color: var(--cd-text-3);
  text-align: center;
}
.cd-fernwartung__hinweis {
  margin: 0;
  padding: 14px 16px;
  border-radius: var(--cd-r-feld);
  background: var(--cd-flaeche-2);
  border: 1px solid var(--cd-linie);
  color: var(--cd-text-2);
  font-size: var(--cd-gr-klein);
  line-height: 1.5;
}

/* --- Drei Schritte --- */
.cd-fernwartung__schritte {
  list-style: none;
  margin: 0;
  padding: var(--cd-a2) 0 0;
  display: grid;
  gap: var(--cd-a3);
  border-block-start: 1px solid var(--cd-linie);
}
.cd-fernwartung__schritte li {
  display: flex;
  align-items: flex-start;
  gap: var(--cd-a3);
  color: var(--cd-text-2);
  line-height: 1.5;
}
.cd-fernwartung__schritte strong { color: var(--cd-tinte); font-weight: 600; }
.cd-fernwartung__nr {
  flex: 0 0 auto;
  inline-size: 1.75rem;
  block-size: 1.75rem;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--cd-rot);
  color: var(--cd-weiss);
  font-family: var(--cd-schrift-mono);
  font-weight: 700;
  font-size: .82rem;
}

.cd-fernwartung__anruf {
  inline-size: 100%;
  justify-content: center;
}
