/* v70 (24.08.2026): Die Beratungsseite zeigt zwei eigenstaendige Angebote statt
   zweier Bausteine eines Ganzen. Jedes Angebot steht in einer eigenen Karte mit
   Kopf, Inhalt und eigener Aktion. Additiv zu v66.css. */

.angebot-section {
  padding: 32px 0;
}

.angebot-karte {
  display: block;
  background: var(--surface-card);
  border: 1px solid var(--border-subtle);
  border-radius: 20px;
  padding: 44px 40px 40px;
}

.angebot-kopf {
  max-width: 780px;
}

.angebot-kopf h2 {
  margin-top: 4px;
}

.angebot-kopf .product-facts-v36 {
  margin-top: 20px;
}

.angebot-inhalt {
  margin-top: 40px;
  padding-top: 36px;
  border-top: 1px solid var(--border-subtle);
}

.angebot-inhalt .workshop-timeline {
  margin-top: 24px;
}

.angebot-aktion {
  margin-top: 36px;
}

@media (max-width: 900px) {
  .angebot-karte {
    padding: 32px 24px 28px;
  }

  .angebot-inhalt {
    margin-top: 28px;
    padding-top: 24px;
  }
}

@media (max-width: 620px) {
  .angebot-karte {
    padding: 26px 18px 24px;
    border-radius: 16px;
  }
}

.ablauf-hinweis {
  margin-top: 20px;
  max-width: 46em;
}
