/* Offline-Karte für den Notfall — ergänzt site.css */
.okt { padding: 32px 20px 48px; max-width: 920px; }
.okt-kopf { display: grid; grid-template-columns: 1fr 240px; gap: 36px; align-items: start; }
.okt h1 { font-size: clamp(28px, 4.4vw, 42px); font-weight: 800; line-height: 1.15; margin: 6px 0 14px; text-wrap: balance; }
.okt .einleitung { font-size: clamp(15.5px, 2vw, 17px); color: var(--fg-2); max-width: 620px; margin-bottom: 20px; }
.okt .knoepfe { display: flex; flex-wrap: wrap; gap: 10px; }
.okt-bild { margin: 0; }
.okt-bild img { width: 100%; height: auto; border-radius: 22px; border: 1px solid var(--rand); box-shadow: 0 12px 40px rgb(0 0 0 / .18); }
.okt-teil { margin-top: 40px; max-width: 720px; }
.okt-teil h2, .okt-app h2 { font-size: 22px; margin: 0 0 12px; text-align: left; text-wrap: balance; }
.okt-teil h2 + * { margin-top: 0; }
.okt-teil p { color: var(--fg-2); margin: 0 0 18px; }
.okt-teil p + h2 { margin-top: 28px; }
.okt-schritte { padding-left: 22px; display: grid; gap: 10px; color: var(--fg-2); }
.okt-schritte b, .okt-liste b { color: var(--fg); }
.okt-liste { padding-left: 20px; display: grid; gap: 8px; color: var(--fg-2); }
.okt-app { margin-top: 40px; padding: 22px; border: 1px solid var(--rand); border-radius: 16px; background: var(--bg-2); }
.okt-app p { color: var(--fg-2); max-width: 680px; margin-bottom: 14px; }
.sprachlink { font-size: 14px; color: var(--fg-2); padding: 6px 10px; border: 1px solid var(--rand); border-radius: 8px; text-decoration: none; }
@media (max-width: 720px) {
  .okt { padding-left: 16px; padding-right: 16px; }
  .okt-kopf { grid-template-columns: 1fr; gap: 24px; }
  .okt-bild { max-width: 220px; margin: 0 auto; }
}
