/* assets/css/schluss-cta.css — Schluss-Aufruf der Startseite
   (_sections/schluss-cta.php). Alles unter .schluss-cta gescoped, keine
   Klasse aus hero.css wiederverwendet: der Hero ist immer dunkel und traegt
   feste Farben, dieser Abschnitt folgt dem Thema (hell/dunkel ueber Tokens). */

.schluss-cta { text-align: center; background: var(--surface-2); }
.schluss-cta .section-head { margin: 0 auto 30px; }

.schluss-ctas {
  display: flex; gap: 14px; flex-wrap: wrap;
  justify-content: center; align-items: center;
}

/* Die zwei leisen Wege (Sandbox, Browser-Fotobox) unter den Knoepfen. */
.schluss-wege {
  display: flex; gap: 10px 28px; flex-wrap: wrap; justify-content: center;
  margin: 18px 0 0;
}
.schluss-cta .mehr-link { display: inline-flex; margin: 0; }

.schluss-preis {
  margin: 28px 0 0;
  font-size: 15.5px; font-weight: 600; line-height: 1.55;
  color: var(--ink-muted);
}
.schluss-preis b {
  font-family: var(--mono); font-size: 28px; font-weight: 700;
  line-height: 1; letter-spacing: -.01em;
  color: var(--accent-strong); margin-right: 2px;
}
.schluss-trust {
  margin: 14px 0 0;
  font-family: var(--mono); font-size: 12.5px; letter-spacing: .02em;
  line-height: 1.7; color: var(--ink-muted);
}

@media (max-width: 520px) {
  .schluss-ctas .btn { width: 100%; }
  .schluss-preis { font-size: 14.5px; }
  .schluss-preis b { font-size: 25px; }
}