/* =====================================================================
   Wischreihen fürs Handy (2026-10-01), Dienstleistungs-Seiten
   Karten, die am Desktop nebeneinander stehen, werden auf schmalen
   Bildschirmen zu einer Wischreihe statt untereinander gestapelt.
   .mswipe    ab <= 700px (Handy)
   .mswipe-t  ab <= 960px (Handy + Tablet, wo das Raster sonst einspaltig wird)
   [data-mswipe-dots]  Reihe scrollt bereits selbst, bekommt nur Punkte
   Punkte baut js/mob-swipe.js (Klassen .lp-dots/.lp-dot aus style.css).
   Desktop bleibt unverändert: alles steckt in max-width-Media-Queries.
   ===================================================================== */
@media (max-width: 960px) {
  .mswipe-t {
    display: flex !important;
    gap: 14px !important;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    max-width: none !important;
    margin-inline: calc(-1 * var(--mb, 24px)) !important;
    padding: 4px var(--mb, 24px) 12px !important;
    scroll-padding-inline: var(--mb, 24px);
  }
  .mswipe-t::-webkit-scrollbar { display: none; }
  .mswipe-t > * { flex: 0 0 min(84%, 400px); scroll-snap-align: start; min-width: 0; }
}
@media (max-width: 700px) {
  .mswipe {
    display: flex !important;
    gap: 14px !important;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    max-width: none !important;
    margin-inline: calc(-1 * var(--mb, 24px)) !important;
    padding: 4px var(--mb, 24px) 12px !important;
    scroll-padding-inline: var(--mb, 24px);
  }
  .mswipe::-webkit-scrollbar { display: none; }
  .mswipe > * { flex: 0 0 min(84%, 400px); scroll-snap-align: start; min-width: 0; }

  /* Ablauf-Leisten (gf-flow): Schritte nebeneinander wie am Desktop, Linie läuft mit */
  .gf-steps.mswipe > .gf-step { flex-basis: min(66%, 270px); }
  .gf-steps.mswipe > .gf-step::after {
    content: ""; position: absolute; top: 11px; left: 20px; right: -14px; height: 2px;
    background: var(--gf-a);
  }
  .gf-steps.mswipe > .gf-step:last-child::after { display: none; }
  .gf-steps.mswipe > .gf-step:nth-last-child(2)::after { background: linear-gradient(90deg, var(--gf-a), var(--gf-ok)); }
  .gf-steps.mswipe + .gf-ends { margin-top: 18px; }
  /* Ablauf-Schritte nicht auf die längste Karte strecken (sonst große Leerflächen, 2026-10-02) */
  .gf-steps.mswipe { align-items: flex-start; }
}
/* Innenabstand der weißen Kachel-Sektionen (site-navy.css: .gad-sheet > .container) */
.gad-sheet { --mb: clamp(22px, 5vw, 60px); }

/* Punkte: 44 px hohe Tippfläche, Optik wie die übrigen Karussell-Punkte */
.mswipe-dots { margin-top: 2px; }
.mswipe-dots[hidden] { display: none; }
.mswipe-dots .lp-dot { padding: 18px; }
.mswipe-dots .lp-dot.is-active { padding: 17px; background: #0b1c3d; }
@media (max-width: 900px) { .mswipe-dots .lp-dot { padding: 18.5px; } }

/* "Mehr lesen" für lange Erklärtexte auf dem Handy ([data-mmore], js/mob-swipe.js), 2026-10-02 */
.mmore-btn { display: none; }
@media (max-width: 700px) {
  [data-mmore].is-clamped { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 4; overflow: hidden; }
  .mmore-btn { display: inline-flex; align-items: center; min-height: 44px; margin: 2px 0 0; padding: 0; border: 0; background: none;
    font: inherit; font-size: 16px; font-weight: 600; color: #0066cc; cursor: pointer; }
  .sub-dark-section .mmore-btn, .grc-hero .mmore-btn { color: #9fd3ff; }
}
.sub-dark-section .mswipe-dots .lp-dot,
.grc-hero .mswipe-dots .lp-dot { background: rgba(255,255,255,.32); }
.sub-dark-section .mswipe-dots .lp-dot.is-active,
.grc-hero .mswipe-dots .lp-dot.is-active { background: #fff; }
@media (prefers-reduced-motion: reduce) {
  .mswipe, .mswipe-t, [data-mswipe-dots] { scroll-behavior: auto; }
}