/* ============================================================
   Anker UI Polish Pack — 2026-06-10
   Sticky Header · Mobile App-Bar · Scroll-Reveal · View Transitions
   FAQ-Akkordeon · Design-Token-Feinschliff · Touch-Feedback
   Wird siteweit nach styles.min.css geladen.
   ============================================================ */

/* ---------- 0) Basis / App-Gefühl ---------- */
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
* { -webkit-tap-highlight-color: transparent; }
a, button, summary, .btn-primary, .btn-cta, .form-quick-btn { touch-action: manipulation; }

.btn-primary, .btn-cta, .btn-submit, .btn-next, .btn-prev, .form-quick-btn, .anker-mini-submit {
  transition: transform .15s ease, box-shadow .2s ease, background-color .2s ease;
}
.btn-primary:active, .btn-cta:active, .btn-submit:active, .btn-next:active,
.form-quick-btn:active, .anker-mini-submit:active { transform: scale(.96); }
.btn-primary:hover, .btn-cta:hover { box-shadow: 0 6px 18px rgba(11,42,74,.22); }

/* iOS-Zoom beim Fokussieren verhindern (App-Gefühl) */
@media (max-width: 768px) {
  input, select, textarea { font-size: 16px !important; }
}

/* Dezente Scrollbar (Desktop) */
@media (min-width: 769px) {
  ::-webkit-scrollbar { width: 10px; }
  ::-webkit-scrollbar-track { background: #f0f3f7; }
  ::-webkit-scrollbar-thumb { background: #b9c6d4; border-radius: 6px; }
  ::-webkit-scrollbar-thumb:hover { background: #8fa3b8; }
}

:focus-visible { outline: 2px solid #0b2a4a; outline-offset: 2px; border-radius: 4px; }

/* ---------- 1) Sticky Header ---------- */
.header {
  position: sticky; top: 0; z-index: 980;
  background: #fff;
  transition: box-shadow .25s ease;
}
.header.hdr-scrolled { box-shadow: 0 2px 16px rgba(11,42,74,.13); }
@media (max-width: 768px) {
  .header { position: sticky; top: 0; }
}

/* ---------- 2) Mobile App-Bar (untere Schnellleiste) ---------- */
.anker-mobilebar { display: none; }
@media (max-width: 768px) {
  .anker-mobilebar {
    display: grid; grid-template-columns: 1fr 1fr 1.2fr;
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 990;
    background: rgba(255,255,255,.92);
    -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
    border-top: 1px solid #e3e9f0;
    padding-bottom: env(safe-area-inset-bottom);
    box-shadow: 0 -4px 18px rgba(11,42,74,.10);
  }
  .anker-mobilebar a {
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    gap: 3px; padding: 9px 4px 10px; min-height: 56px;
    font-size: 11.5px; font-weight: 600; color: #0b2a4a; text-decoration: none;
  }
  .anker-mobilebar a:active { background: #eef3f8; }
  .anker-mobilebar svg { width: 21px; height: 21px; fill: none; stroke: currentColor; stroke-width: 1.9; }
  .anker-mobilebar a.mb-primary {
    background: #0b2a4a; color: #fff; margin: 8px 10px 8px 4px;
    border-radius: 12px; min-height: 0; padding: 7px 4px 8px;
    box-shadow: 0 4px 14px rgba(11,42,74,.30);
  }
  .anker-mobilebar a.mb-primary:active { background: #143d68; }

  /* Platz für die Bar schaffen */
  body { padding-bottom: calc(64px + env(safe-area-inset-bottom)); }

  /* Rechte Button-Säule mobil reduzieren: nur WhatsApp bleibt, über der Bar */
  .form-quick-buttons { display: none !important; }
  .whatsapp-container { bottom: calc(76px + env(safe-area-inset-bottom)) !important; }

  /* Chat-Balon über WhatsApp stapeln (Bar -> WhatsApp -> Chat), nichts überlappt */
  .ankc-btn {
    bottom: calc(148px + env(safe-area-inset-bottom, 0px)) !important;
    right: 18px !important;
  }

  /* Cookie-Banner über die Bar heben */
  .cookie-banner { bottom: calc(66px + env(safe-area-inset-bottom)) !important; }
}

/* ---------- 3) Scroll-Reveal (nur mit JS aktiv) ---------- */
html.anker-js .anker-reveal {
  opacity: 0; transform: translateY(16px);
  transition: opacity .55s cubic-bezier(.22,.61,.36,1), transform .55s cubic-bezier(.22,.61,.36,1);
  will-change: opacity, transform;
}
html.anker-js .anker-reveal.in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  html.anker-js .anker-reveal { opacity: 1 !important; transform: none !important; transition: none !important; }
}

/* Sanfter Hover-Lift für Karten */
.service-card, .price-card { transition: transform .25s ease, box-shadow .25s ease; }
@media (min-width: 769px) {
  .service-card:hover, .price-card:hover { transform: translateY(-4px); box-shadow: 0 10px 26px rgba(11,42,74,.13); }
}

/* ---------- 4) View Transitions (sanfter Seitenwechsel) ---------- */
@view-transition { navigation: auto; }
::view-transition-old(root) { animation-duration: .16s; }
::view-transition-new(root) { animation-duration: .22s; }
@media (prefers-reduced-motion: reduce) {
  ::view-transition-old(root), ::view-transition-new(root) { animation: none; }
}

/* ---------- 5) FAQ-Akkordeon (einheitlich) ---------- */
.faq-item.anker-acc {
  background: #fff; border: 1px solid #e3e9f0; border-left: 4px solid #0b2a4a;
  border-radius: 10px; padding: 0; margin-bottom: 12px; overflow: hidden;
}
.faq-item.anker-acc > h3 {
  cursor: pointer; margin: 0; padding: 16px 44px 16px 18px; position: relative;
  font-size: 1.04rem; user-select: none;
}
.faq-item.anker-acc > h3::after {
  content: "+"; position: absolute; right: 16px; top: 50%; transform: translateY(-50%);
  font-size: 1.4rem; font-weight: 400; color: #0b2a4a; transition: transform .3s ease;
}
.faq-item.anker-acc.open > h3::after { content: "–"; }
.faq-item.anker-acc .anker-acc-body {
  display: grid; grid-template-rows: 0fr; transition: grid-template-rows .35s ease;
}
.faq-item.anker-acc.open .anker-acc-body { grid-template-rows: 1fr; }
.faq-item.anker-acc .anker-acc-inner { overflow: hidden; }
.faq-item.anker-acc .anker-acc-inner > * { margin: 0; padding: 0 18px 16px; }

/* Bestehende <details>-FAQs an denselben Look angleichen */
main details:not(.nav-dd details):not(.ft-dd) > summary { user-select: none; }

/* ---------- 6) Tabellen-Feinschliff (moderner Look: nur Zeilentrenner) ---------- */
main table {
  border-radius: 12px; overflow: hidden;
  border-collapse: separate !important; border-spacing: 0;
  box-shadow: 0 2px 14px rgba(11,42,74,.08);
}
main table td, main table th {
  border-left-width: 0 !important;
  border-right-width: 0 !important;
  border-top-width: 0 !important;
}
main table tbody tr:last-child td { border-bottom-width: 0 !important; }
main table tbody tr { transition: background-color .15s ease; }
main table tbody tr:hover { background: #f4f8fc; }

/* Anker-Ziele nicht unter dem Sticky-Header verstecken */
[id] { scroll-margin-top: 96px; }

/* ---------- 7) Stat-Counter Cursor ---------- */
.stat-number { font-variant-numeric: tabular-nums; }