/* ============================================================
   ABMAHN-CHECKER · V5 · BASE
   @font-face (Geist lokal · DSGVO · kein Google-CDN), Reset,
   Typo-Defaults, Type-Scale-Utilities, Focus-Ring, Scrollbar,
   prefers-reduced-motion. Lädt nach tokens.css.
   ============================================================ */

/* ---- Geist · lokal selbst-gehostet (Variable, alle Gewichte) --- */
@font-face {
  font-family: "Geist";
  src: url("/assets/fonts/geist/Geist-Variable.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Geist Mono";
  src: url("/assets/fonts/geist/GeistMono-Variable.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

/* ---- Reset -------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; tab-size: 4; }

body {
  font-family: var(--font-sans);
  font-size: var(--t-body-size);
  line-height: var(--t-body-lh);
  color: var(--ink-2);
  background: var(--bg);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-feature-settings: var(--font-feature-sans);
  min-height: 100vh;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-sans);
  color: var(--ink);
  font-weight: 700;
  letter-spacing: -0.025em;
  line-height: 1.0;
}
p { margin: 0; }
a { color: inherit; text-decoration: none; }
a:hover { text-decoration: none; }
img, svg, video, canvas { display: block; max-width: 100%; }
button, input, select, textarea { font: inherit; color: inherit; }
button { background: none; border: 0; cursor: pointer; }
ul, ol { list-style: none; padding: 0; }
table { border-collapse: collapse; width: 100%; }
hr { border: 0; border-top: 1px solid var(--rule-1); }
::selection { background: var(--ink); color: var(--card); }

/* ---- Sichtbarer Focus-Ring überall (WCAG 2.2 AA) ----------- */
:focus { outline: none; }
:focus-visible {
  outline: 2px solid var(--ink);
  outline-offset: 2px;
  border-radius: var(--r-1);
}
a:focus-visible, button:focus-visible {
  outline-offset: 3px;
}
/* Auf dunklen Flächen ist ein schwarzer Ring unsichtbar → hell invertieren
   (WCAG 2.2 AA · Phase 7). Greift für Admin-Sidebar, Auth-Brand-Panel,
   card-dark, glow-callout und .section.dark. */
.admin-sidebar :focus-visible,
.auth-brand :focus-visible,
.card-dark :focus-visible,
.glow-callout :focus-visible,
.section.dark :focus-visible {
  outline-color: var(--card);
}

/* ---- Scrollbar · dezent Stein ------------------------------ */
* { scrollbar-width: thin; scrollbar-color: var(--rule-3) transparent; }
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb {
  background: var(--rule-2);
  border-radius: var(--r-full);
  border: 2px solid var(--bg);
}
::-webkit-scrollbar-thumb:hover { background: var(--rule-3); }

/* ---- Type-Scale-Utilities (Handoff §Typografie · 1:1) ------ */
.t-hero  { font-size: var(--t-hero-size);  line-height: var(--t-hero-lh);  letter-spacing: var(--t-hero-ls);  font-weight: var(--t-hero-w);  color: var(--ink); }
.t-h2-lg { font-size: var(--t-h2lg-size);  line-height: var(--t-h2lg-lh);  letter-spacing: var(--t-h2lg-ls);  font-weight: var(--t-h2lg-w);  color: var(--ink); }
.t-h2-md { font-size: var(--t-h2md-size);  line-height: var(--t-h2md-lh);  letter-spacing: var(--t-h2md-ls);  font-weight: var(--t-h2md-w);  color: var(--ink); }
.t-h1    { font-size: var(--t-h1-size);    line-height: var(--t-h1-lh);    letter-spacing: var(--t-h1-ls);    font-weight: var(--t-h1-w);    color: var(--ink); }
.t-h2    { font-size: var(--t-h2-size);    line-height: var(--t-h2-lh);    letter-spacing: var(--t-h2-ls);    font-weight: var(--t-h2-w);    color: var(--ink); }
.t-card-title { font-size: var(--t-cardt-size); line-height: var(--t-cardt-lh); letter-spacing: var(--t-cardt-ls); font-weight: var(--t-cardt-w); color: var(--ink); }
.t-lead  { font-size: var(--t-lead-size);  line-height: var(--t-lead-lh);  letter-spacing: var(--t-lead-ls);  font-weight: var(--t-lead-w);  color: var(--ink-3); }
.t-body-lg { font-size: var(--t-blg-size); line-height: var(--t-blg-lh);   letter-spacing: var(--t-blg-ls);   font-weight: var(--t-blg-w);   color: var(--ink-3); }
.t-body  { font-size: var(--t-body-size);  line-height: var(--t-body-lh);  font-weight: var(--t-body-w); }
.t-body-sm { font-size: var(--t-bsm-size); line-height: var(--t-bsm-lh);   font-weight: var(--t-bsm-w);   color: var(--ink-3); }
.t-caption { font-size: var(--t-cap-size); line-height: var(--t-cap-lh);   font-weight: var(--t-cap-w);   color: var(--ink-4); }
.t-mono-label, .t-mono-tiny {
  font-family: var(--font-mono);
  text-transform: uppercase;
  color: var(--ink-4);
}
.t-mono-label { font-size: var(--t-mono-size); line-height: var(--t-mono-lh); letter-spacing: var(--t-mono-ls); font-weight: var(--t-mono-w); }
.t-mono-tiny  { font-size: var(--t-monot-size); line-height: var(--t-monot-lh); letter-spacing: var(--t-monot-ls); font-weight: var(--t-monot-w); }

/* ---- Helfer ------------------------------------------------- */
.hidden { display: none !important; }
[x-cloak] { display: none !important; }
.mono { font-family: var(--font-mono); }
.tnum { font-variant-numeric: tabular-nums lining-nums; font-feature-settings: var(--font-feature-tnum); }
.text-red  { color: var(--red); }
.text-gold { color: var(--gold); }
.text-moss { color: var(--moss); }
.text-ink-3 { color: var(--ink-3); }
.text-ink-4 { color: var(--ink-4); }

.container        { max-width: var(--container);      margin-inline: auto; padding-inline: var(--container-pad); }
.container-faq    { max-width: var(--container-faq);  margin-inline: auto; padding-inline: var(--container-pad); }
.container-form   { max-width: var(--container-form); margin-inline: auto; padding-inline: var(--container-pad); }

.visually-hidden {
  position: absolute; width: 1px; height: 1px;
  padding: 0; margin: -1px; overflow: hidden;
  clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.skip-link {
  position: absolute; left: -9999px; top: 0; z-index: 100;
  background: var(--ink); color: var(--card);
  padding: 10px 16px; border-radius: 0 0 var(--r-3) 0;
  font-family: var(--font-mono); font-size: 12px;
}
.skip-link:focus { left: 0; }

/* ---- Motion-Keyframes (Handoff §Animations) ---------------- */
@keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.3; } }
@keyframes spin  { to { transform: rotate(360deg); } }
@keyframes blink { 0%, 100% { opacity: 1; } 50% { opacity: 0; } }

/* ---- prefers-reduced-motion -------------------------------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}