/* OOMAC – Seite „Registrieren“ (Vorschau /start/registrieren.html). Baut auf startseite.css auf (Kopf, Knöpfe, Plaketten, Leiste, Fußzeile).
   Regeln wie dort: Farben nur als Variablen, Schriften lokal, Deko pointer-events:none, keine Hex-Werte. */
.reg-seite { position: relative; min-height: 100svh; display: flex; flex-direction: column; isolation: isolate; }
.reg-grund { position: fixed; inset: 0; z-index: -1; width: 100%; height: 100%; object-fit: cover; object-position: center top; pointer-events: none; }
.reg-grund-dunkel { position: fixed; inset: 0; z-index: -1; pointer-events: none; background: linear-gradient(rgba(10, 10, 10, .62), rgba(10, 10, 10, .88) 55%, var(--bg)); }
.reg-seite .kopf { position: relative; inset: auto; background: rgba(10, 10, 10, .82); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); border-bottom: 1px solid var(--arena-linie); }
.reg-seite .kopf-innen { max-width: 1200px; margin-inline: auto; }
.reg-seite .menue { z-index: 55; }

.reg-inhalt { flex: 1 0 auto; width: min(100% - 24px, 1040px); margin: 0 auto; padding: 1.4rem 0 1rem; }
.reg-titel { margin: 0 0 .4rem; text-align: center; font: 400 clamp(1.5rem, 6vw, 2.5rem)/1.2 var(--schrift-marke); letter-spacing: .01em; color: var(--creme); text-shadow: 0 2px 12px var(--arena-schatten); filter: url(#rau); overflow-wrap: break-word; }
.reg-intro { margin: 0 0 1.4rem; text-align: center; font: 600 1rem/1.4 var(--schrift-text); color: var(--white); text-shadow: 0 1px 8px var(--arena-schatten); }

.reg-karten { display: grid; grid-template-columns: minmax(0, 1fr); gap: 14px; }
/* Karte = Rahmen A (Altgold, gealtert) wie die Tafeln der Startseite. Alles waagrecht UND senkrecht mittig; genug Innenabstand, damit nichts an die Eck-Ornamente stößt; keine Silbentrennung in der Marken-Schrift. */
.wahl { --rb: 16px; position: relative; isolation: isolate; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; gap: .35rem; min-height: 44px; padding: 1.3rem 1.5rem 1.2rem; text-decoration: none; color: var(--white); cursor: pointer; -webkit-tap-highlight-color: transparent;
  border: var(--rb) solid transparent; border-image: var(--rahmen-gold) 24 fill / var(--rb) / 0 stretch; filter: url(#rau); }
.wahl > * { position: relative; }
.wahl:active { transform: translateY(1px); }
.wahl-ico { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; margin-bottom: .2rem; color: var(--gold-text); }
.wahl-ico .ico { width: 34px; height: 34px; }
.wahl-titel { margin: 0; max-width: 100%; font: 400 1.6rem/1.15 var(--schrift-marke); letter-spacing: .01em; color: var(--gold-text); text-shadow: 0 1px 2px var(--arena-schatten); overflow-wrap: break-word; hyphens: none; -webkit-hyphens: none; }
.wahl-sub { margin: 0 0 .5rem; max-width: 100%; font: 500 .85rem/1.3 var(--schrift-unter); letter-spacing: .2em; text-transform: uppercase; color: var(--rot-unter); text-shadow: 0 1px 4px var(--arena-schatten); hyphens: none; -webkit-hyphens: none; }
.wahl-text { margin: 0; max-width: 100%; font: 400 .98rem/1.45 var(--schrift-text); color: var(--white); text-wrap: balance; }
html[lang="ar"] .wahl-titel, html[lang="ar"] .reg-titel { letter-spacing: 0; }
html[lang="ar"] .wahl-sub { letter-spacing: 0 !important; }

.reg-zurueck { display: flex; justify-content: center; margin-top: 1.4rem; }
.reg-zurueck .knopf { --rb: 14px; min-height: 54px; font-size: 1.05rem; }

@media (min-width: 760px) {
  .reg-karten { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
  .wahl { padding: 1.8rem 1.8rem 1.6rem; gap: .45rem; }
  .wahl-titel { font-size: 1.75rem; }
  .reg-inhalt { padding-top: 3rem; }
}
/* Handy quer: untereinander, kompakter; bei genug Breite drei nebeneinander */
@media (max-height: 500px) { .reg-inhalt { padding-top: .8rem; } .wahl { padding-block: .8rem; } .wahl-ico { width: 36px; height: 36px; } .wahl-ico .ico { width: 28px; height: 28px; } }
@media (max-height: 500px) and (min-width: 700px) {
  .reg-karten { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .wahl { padding: .8rem 1rem; }
  .wahl-titel { font-size: 1.15rem; } .wahl-sub { font-size: .7rem; } .wahl-text { font-size: .82rem; line-height: 1.35; }
}