/* ============================================================
   WALTERSDORF · seitenlokale Ergänzungen  (css/waltersdorf-v3.css)
   ------------------------------------------------------------
   Wird AUSSCHLIESSLICH von "Standort Waltersdorf-Schönefeld v2
   (High End).html" geladen, und zwar NACH css/standort-v3.css.

   Warum diese Datei existiert:
   Waltersdorf hatte bis 01.08.2026 keine eigene Stylesheet-Datei.
   Alle Layoutänderungen der Seite gehören hierher — css/standort.css,
   css/standort-v3.css, css/mobile-nav.css und die kids-Stylesheets
   werden von anderen Seiten geladen und bleiben unangetastet.

   Inhalt
   0 · Hero · echtes Foto (Hero Waltersdorf)
   1 · Hero · CTA-Ausrichtung nach Wegfall des zweiten Buttons
   2 · Sportarten · zusammengeführte Bento-Sektion (.wal-*)
   3 · Stimmen · Karten-Stapel (kv3-Mechanik portiert)
   ============================================================ */


/* ============================================================
   0 · HERO · echtes Foto „Hero Waltersdorf" (seit Oktober 2026)
   Wie in tegel-v3.css: css/standort.css (.s-hero) ist der Fallback,
   sichtbar ist die von js/standort-v3.js eingefügte Ebene
   .s-hero__bg (css/standort-v3.css). Beide Ebenen bekommen das Foto,
   der Verlauf bleibt 1:1. Ausschnitt je Breite über die zweite Ebene.
   ============================================================ */
.v3 .s-hero {
  background:
    linear-gradient(180deg, rgba(20,16,15,0.55) 0%, rgba(20,16,15,0.15) 30%, rgba(20,16,15,0.85) 100%),
    url('../assets/fotos/hero-waltersdorf.webp') 50% 35%/cover no-repeat,
    var(--rp-tiefschwarz);
}
.v3 .s-hero__bg {
  background:
    linear-gradient(180deg, rgba(20,16,15,0.55) 0%, rgba(20,16,15,0.15) 30%, rgba(20,16,15,0.85) 100%),
    url('../assets/fotos/hero-waltersdorf.webp') 50% 35%/cover no-repeat;
}
@media (min-width: 769px) and (max-width: 1100px) {
  .v3 .s-hero, .v3 .s-hero__bg { background-position: 0 0, 52% 50%, 0 0; }
}
@media (max-width: 768px) {
  /* 74 %: ganzes Gesicht der Trainerin im Bild, daneben ein Kind
     (bei 54 % lief der rechte Bildrand mitten durch ihr Gesicht). */
  .v3 .s-hero, .v3 .s-hero__bg { background-position: 0 0, 74% 50%, 0 0; }
}
/* Ab 901 px ist die Hero-Ecke („7 Standorte …") sichtbar. Sie steht
   oben rechts auf hellen Deckenlampen und Spiegelreflexen — dort eine
   weiche radiale Abdunklung als zusätzliche erste Ebene. Positionslisten
   deshalb hier mit 4 Einträgen (Abdunklung, Verlauf, Foto, Grundfarbe). */
@media (min-width: 901px) {
  .v3 .s-hero {
    background:
      radial-gradient(ellipse 40% 34% at 100% 0%, rgba(20,16,15,0.80) 0%, rgba(20,16,15,0.58) 45%, rgba(20,16,15,0) 100%),
      linear-gradient(180deg, rgba(20,16,15,0.55) 0%, rgba(20,16,15,0.15) 30%, rgba(20,16,15,0.85) 100%),
      url('../assets/fotos/hero-waltersdorf.webp') 50% 35%/cover no-repeat,
      var(--rp-tiefschwarz);
  }
  .v3 .s-hero__bg {
    background:
      radial-gradient(ellipse 40% 34% at 100% 0%, rgba(20,16,15,0.80) 0%, rgba(20,16,15,0.58) 45%, rgba(20,16,15,0) 100%),
      linear-gradient(180deg, rgba(20,16,15,0.55) 0%, rgba(20,16,15,0.15) 30%, rgba(20,16,15,0.85) 100%),
      url('../assets/fotos/hero-waltersdorf.webp') 50% 35%/cover no-repeat;
  }
}
@media (min-width: 901px) and (max-width: 1100px) {
  .v3 .s-hero, .v3 .s-hero__bg { background-position: 0 0, 0 0, 52% 50%, 0 0; }
}
/* Hero-Schrift auf dem hellen Foto: weicher dunkler Schein hinter
   Ecke und Kicker (wie in Tegel), damit die beige Mono-Schrift auch
   auf hellen Lampen, Spiegeln und weißen Anzügen lesbar bleibt. */
.v3 .s-hero__corner { text-shadow: 0 1px 2px rgba(20,16,15,0.7), 0 0 12px rgba(20,16,15,0.7); }
.v3 .s-hero .s-kicker { text-shadow: 0 1px 2px rgba(20,16,15,0.6), 0 0 14px rgba(20,16,15,0.6); }
/* Tablet hochkant (769–1100 px): Dort liegt der Kicker genau auf dem
   weißen Anzug und dem gelben Gürtel-Aufnäher des Jungen links — ein
   Verschieben des Bildes hilft nicht (der Anzug füllt das linke Drittel).
   Deshalb eine feine dunkle Kontur direkt an den Buchstaben plus ein
   dunkler Schein darum (ein weicher Schein allein reicht bei der
   dünnen 13-px-Mono-Schrift auf Weiß nicht). */
@media (min-width: 769px) and (max-width: 1100px) {
  .v3 .s-hero .s-kicker {
    text-shadow:
      0 1px 1px #14100f, 0 0 2px #14100f, 0 0 2px #14100f,
      0 0 4px rgba(20,16,15,0.95), 0 0 8px rgba(20,16,15,0.9),
      0 0 14px rgba(20,16,15,0.85), 0 0 26px rgba(20,16,15,0.75);
  }
}


/* ============================================================
   1 · HERO · CTA-BLOCK
   Der zweite Button (.s-btn--scroll „Kursangebot ansehen") ist
   entfallen. Die Meta-Zeile steht jetzt zentriert unter dem
   verbliebenen Button — auf Desktop wie auf Mobil.
   Schreibweise wie Lübars: normal gesetzt, keine Versalien.
   ============================================================ */
.s-page .s-hero__cta-wrap {
  align-items: center;      /* statt flex-start — der Wrap ist nur noch so breit wie der Button */
  align-self: flex-end;
  gap: 16px;
}
.s-page .s-hero__cta-row {
  justify-content: center;
  width: 100%;
}
.s-page .s-hero__meta {
  /* Versalien-Look der Standardregel bewusst aufgehoben */
  text-transform: none;
  font-family: var(--font-body);
  font-size: 13.5px;
  letter-spacing: 0.01em;
  color: rgba(212,201,181,0.86);
  text-align: center;
  width: 100%;
  display: block;
}

@media (max-width: 900px) {
  /* .s-hero__inner rechnet content-box: width:100% + 2×24px Padding
     ergibt eine Spalte, die ~35 px breiter ist als das Viewport (vom
     overflow:hidden des Hero abgeschnitten). Der zentrierte CTA-Block
     säße dadurch sichtbar links von der echten Mitte. Seitenlokal auf
     border-box gestellt — betrifft nur diese Seite und nur Mobil. */
  .s-page .s-hero__inner { box-sizing: border-box; }

  /* Auf Mobil steht der CTA-Block unter dem Fließtext und füllt die
     Spalte — Button und Meta-Zeile bleiben gemeinsam mittig. */
  .s-page .s-hero__cta-wrap { width: 100%; align-self: stretch; }
  .s-page .s-hero__cta-row { flex-direction: column; align-items: stretch; }
  .s-page .s-hero__cta-row .s-btn { text-align: center; justify-content: center; }
}
/* Keine Regel blendet .s-hero__meta auf Mobil aus — geprüft in
   standort.css, standort-v3.css, mobile-nav.css und polish.css.
   Die Zeile ist am Handy sichtbar. */


/* ============================================================
   2 · SPORTARTEN · EINE SEKTION, GEMISCHTE KACHELGRÖSSEN
   ------------------------------------------------------------
   Ersetzt die früher getrennten Sektionen .s-sports--kids
   (4 × .s-prog) und .s-sports--adults (8 × .s-disc).
   Vorbild: .w-bento (Wilmersdorf) und .c-feature/.c-tilegrid
   (Spandau) — hier als eigener .wal-*-Namensraum nachgebaut,
   damit KEINE Regel aus css/standort.css verändert werden muss.

   Hinweis zur Klasse s-sports__grid--kids am Bento-Container:
   sie ist reiner JS-Hook. js/standort-v3.js staffelt darüber die
   Scroll-Reveals der Kacheln (group('.s-sports__grid--kids > *')).
   Ihre drei Layoutregeln aus standort.css werden unten vollständig
   überschrieben; die .s-prog-Nachfahrenregeln greifen nicht, weil
   die Kacheln .wal-tile heißen.
   ============================================================ */
.wal-sports { padding-bottom: clamp(90px, 9vw, 140px); }
.wal-sports .s-sports__lede { max-width: 62ch; }

/* Kennzahlen-Zeile unter dem Kopf (Breite des Angebots) */
.wal-sports__breadth {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 14px;
  margin: 0 0 clamp(28px, 3vw, 44px);
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: rgba(26,20,20,0.62);
}
.wal-sports__breadth b { color: var(--rp-rot-anker); font-weight: 700; }
.wal-sports__breadth .dot {
  width: 5px; height: 5px; border-radius: 50%;
  background: var(--rp-rot-akzent); flex-shrink: 0;
}

/* ---- Bento-Raster ----------------------------------------
   Ein einziges 12-Spalten-Grid, damit jede Kachel direktes Kind
   bleibt und ihren eigenen gestaffelten Scroll-Reveal bekommt.
     Reihe 1 · drei Schwerpunkte      je span 4
     Reihe 2 · Krav Maga span 6 + zwei kleine je span 3
     Reihe 3 · vier kleine            je span 3
   ---------------------------------------------------------- */
.wal-sports .wal-bento {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: 16px;
}
.wal-sports .wal-tile--feat { grid-column: span 4; }
.wal-sports .wal-tile--wide { grid-column: span 6; }
.wal-sports .wal-tile--sm   { grid-column: span 3; }

/* ---- Große Bildkachel (Schwerpunkt) ---------------------- */
.wal-tile {
  position: relative;
  display: block;
  overflow: hidden;
  isolation: isolate;
  border-radius: 20px;
  color: #fff;
  background: var(--rp-tiefschwarz);
}
.wal-tile img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 700ms var(--ease-standard);
}
.wal-tile::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(180deg, rgba(20,16,15,0.06) 0%, rgba(20,16,15,0.34) 46%, rgba(20,16,15,0.92) 100%);
}
.wal-tile:hover img { transform: scale(1.05); }

.wal-tile--feat { aspect-ratio: 4 / 5; }
.wal-tile__body {
  position: absolute;
  z-index: 2;
  left: clamp(22px, 2vw, 30px);
  right: clamp(22px, 2vw, 30px);
  bottom: clamp(24px, 2.4vw, 32px);
}
.wal-tile__kicker {
  display: block;
  margin: 0 0 12px;
  font-family: var(--font-mono);
  font-size: 10.5px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--rp-beige);
}
.wal-tile__name {
  margin: 0 0 12px;
  font-family: var(--font-display);
  font-weight: 800;
  font-size: clamp(24px, 2.4vw, 34px);
  line-height: 0.98;
  letter-spacing: -0.025em;
  color: #fff;
  text-wrap: balance;
}
.wal-tile__sub {
  margin: 0;
  font-size: 14px;
  line-height: 1.5;
  color: rgba(255,255,255,0.82);
  max-width: 34ch;
}
.wal-tile__age {
  margin: 12px 0 0;
  font-family: var(--font-mono);
  font-size: 10.5px;
  letter-spacing: 0.13em;
  text-transform: uppercase;
  color: rgba(212,201,181,0.86);
  line-height: 1.65;
}
.wal-tile__badge {
  position: absolute;
  z-index: 3;
  top: 16px;
  left: 16px;
  padding: 6px 12px;
  border-radius: 999px;
  background: var(--rp-rot-akzent);
  font-family: var(--font-mono);
  font-weight: 500;
  font-size: 9.5px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: #fff;
}
.wal-tile__arrow {
  position: absolute;
  z-index: 3;
  top: 16px;
  right: 18px;
  font-size: 18px;
  color: rgba(255,255,255,0.6);
  transition: color 220ms var(--ease-standard), transform 220ms var(--ease-standard);
}
.wal-tile:hover .wal-tile__arrow { color: #fff; transform: translate(3px, -3px); }

/* ---- Kleine und breite Kacheln --------------------------- */
.wal-tile--sm { aspect-ratio: 4 / 3; }
.wal-tile--wide { aspect-ratio: 8 / 3; }
.wal-tile--sm .wal-tile__name { font-size: clamp(19px, 1.6vw, 23px); margin-bottom: 8px; }
.wal-tile--sm .wal-tile__body,
.wal-tile--wide .wal-tile__body { left: 22px; right: 22px; bottom: 22px; }
.wal-tile--wide .wal-tile__name { font-size: clamp(22px, 2vw, 30px); }
/* ---- Bildausschnitte je Motiv ----------------------------
   `object-fit: cover` schneidet mittig — bei drei Motiven landen die
   Personen dadurch außerhalb des sichtbaren Bandes. Die Werte unten sind
   aus der Bildgeometrie gerechnet, nicht geschätzt. Adressiert über den
   Dateinamen, damit kein zusätzliches class-Attribut ins Markup muss.
   ---------------------------------------------------------- */

/* Jiu-Jitsu Budokai · 1086×1448 (hochkant) in einer 8:3-Kachel.
   Mittig sichtbar wären nur Gürtel und Hüften — die beiden Gesichter
   sitzen bei 10–28 % Bildhöhe. Band nach oben schieben. */
.wal-tile img[src$="budokai-waffenabwehr.jpg"] { object-position: center 10%; }

/* Kickboxen · 2048×1152 (quer) in einer 4:3-Kachel.
   Die linke Bildhälfte ist leere Wand; Junge, Trainer und Pratze stehen
   rechts (49–98 % Bildbreite). Band nach rechts schieben. */
.wal-tile img[src$="kickboxen-kinder-hero.webp"] { object-position: 85% center; }

/* Kickbox-Fitness · 898×1027 (hochkant) in einer 4:3-Kachel.
   Der Kopf sitzt bei 8–19 % Bildhöhe und wurde mittig abgeschnitten. */
.wal-tile img[src$="kbf-pratzenrunde-sandsack.png"] { object-position: center 12%; }

/* Kürzere Kacheln brauchen einen härteren Verlauf: bei hellen Motiven
   (Milon-Studio, Sandsackreihe) säuft die Schrift sonst unten ab. */
.wal-tile--sm::after,
.wal-tile--wide::after {
  background: linear-gradient(180deg, rgba(20,16,15,0.10) 0%, rgba(20,16,15,0.44) 40%, rgba(20,16,15,0.96) 100%);
}
/* Die breite Kachel trägt Kicker, Name, Satz und Altersangabe. Damit
   der Block flach bleibt, darf der Satz breiter laufen (zwei statt
   drei Zeilen); ein Verlauf von links hält den Kicker auf hellen
   Bildstellen lesbar. */
.wal-tile--wide .wal-tile__sub { max-width: 62ch; }
.wal-tile--wide::after {
  background:
    linear-gradient(90deg, rgba(20,16,15,0.55) 0%, rgba(20,16,15,0) 62%),
    linear-gradient(180deg, rgba(20,16,15,0.10) 0%, rgba(20,16,15,0.44) 40%, rgba(20,16,15,0.96) 100%);
}

/* ---- Fußnote unter dem Raster ---------------------------- */
.wal-sports__foot {
  margin: clamp(26px, 3vw, 40px) 0 0;
  padding-top: 22px;
  border-top: 1px solid rgba(26,20,20,0.16);
  font-size: 15px;
  line-height: 1.6;
  color: rgba(26,20,20,0.74);
  max-width: 78ch;
}
.wal-sports__foot strong { color: var(--rp-rot-anker); font-weight: 700; }

/* ---- Breakpoints -----------------------------------------
   Geprüft bei 1920 · 1440 · 1280 · 900 · 375 px.
   ---------------------------------------------------------- */
@media (max-width: 1280px) {
  /* Bei drei Kacheln nebeneinander wird 4/5 zu breit für die Typo */
  .wal-tile--feat { aspect-ratio: 3 / 4; }
  .wal-tile--feat .wal-tile__sub { font-size: 13.5px; }
}
@media (min-width: 1101px) and (max-width: 1280px) {
  /* Die breite Kachel wird hier flach (8/3 auf halber Breite); damit
     der Textblock nicht bis an die Oberkante reicht, rückt er enger. */
  .wal-tile--wide .wal-tile__body { bottom: 18px; }
  .wal-tile--wide .wal-tile__kicker { margin-bottom: 8px; }
  .wal-tile--wide .wal-tile__name { margin-bottom: 6px; }
  .wal-tile--wide .wal-tile__sub { font-size: 13px; line-height: 1.42; max-width: none; }
  .wal-tile--wide .wal-tile__age { margin-top: 6px; }
}
@media (max-width: 1100px) {
  /* kleine Kacheln zu zweit, die breite Kachel über die volle Breite */
  .wal-sports .wal-tile--wide { grid-column: span 12; }
  .wal-sports .wal-tile--sm   { grid-column: span 6; }
  .wal-tile--wide { aspect-ratio: 12 / 4; }
}
@media (max-width: 900px) {
  /* Schwerpunkte untereinander, quer statt hochkant */
  .wal-sports .wal-tile--feat { grid-column: span 12; }
  .wal-tile--feat { aspect-ratio: 16 / 10; }
  .wal-tile--wide { aspect-ratio: 16 / 9; }
}
@media (max-width: 560px) {
  /* „Selbstverteidigung." ist bei 38px breiter als die Textspalte und
     stieß am rechten Rand an — hier eine Stufe kleiner. */
  .wal-sports .s-sports__h { font-size: clamp(29px, 8.2vw, 38px); }
  .wal-sports .wal-bento { gap: 14px; }
  .wal-sports .wal-tile--sm { grid-column: span 12; }
  .wal-tile--feat { aspect-ratio: 4 / 3; }
  .wal-tile--sm   { aspect-ratio: 3 / 2; }
  /* Die breite Kachel trägt mehr Text als die kleinen. Bei 3/2 rückt
     der Textblock bis an die Gesichter heran — etwas mehr Höhe schafft
     die nötige Luft. */
  .wal-tile--wide { aspect-ratio: 4 / 3; }
  .wal-sports__breadth { font-size: 10px; gap: 10px; }
}


/* ============================================================
   3 · STIMMEN · KARTEN-STAPEL
   ------------------------------------------------------------
   Mechanik portiert aus css/kids-scroll-v3.css (.kv3-stack /
   .kv3-stack__wrap / .kv3-card), nach dem Vorbild von
   css/wilmersdorf.css. Die kids-Stylesheets werden auf dieser
   Seite bewusst NICHT verlinkt — sie bringen Kinderseiten-
   Styling mit.

   Die Kartentexte nutzen eigene .wal-q__*-Klassen statt
   .s-quote__q: js/standort-v3.js zerlegt genau ein .s-quote__q
   in Einzelwörter und blendet sie erst bei .s-quote.is-in ein —
   das würde bei vier gestapelten Karten nur die erste bedienen.
   ============================================================ */
/* WICHTIG · Voraussetzung dafür, dass der Stapel überhaupt klebt:
   css/standort.css setzt auf .s-quote ein `overflow: hidden` (für den
   Radial-Glow im ::before). Ein Vorfahre mit overflow: hidden macht
   `position: sticky` wirkungslos — die Karten scrollen einfach mit.
   Die Blaupausen haben das Problem nicht: .s-testimonial (Wilmersdorf)
   und .fq-voices (FAQ) setzen gar kein overflow.
   `overflow: clip` schneidet weiterhin ab, erzeugt aber KEINEN
   Scroll-Container — damit bleibt sticky funktionsfähig.
   Nur für die .s-quote-Sektion mit Stapel, nur auf dieser Seite. */
.s-quote:has(.kv3-stack) { overflow: clip; padding-bottom: 0; }

.kv3-stack { position: relative; padding-bottom: 9vh; }
.kv3-stack__wrap {
  position: sticky;
  top: 0;
  height: 100svh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 20px;
}
.kv3-card {
  /* box-sizing explizit: die Seite rechnet sonst content-box, dann
     wäre die Karte um die Innenabstände breiter als min(880px,94vw). */
  box-sizing: border-box;
  position: relative;
  width: min(880px, 94vw);
  border-radius: 24px;
  padding: clamp(32px, 5vw, 64px);
  background: #fff;
  border-top: 4px solid var(--rp-rot-akzent);
  box-shadow: 0 40px 90px -36px rgba(26,20,20,0.45);
  will-change: transform;
}
.kv3-card__num {
  position: absolute;
  top: 26px;
  right: 30px;
  margin: 0;
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--rp-grau-muted);
}
.kv3-card--beige { background: var(--rp-beige-deep); }
/* Abweichung von Wilmersdorf: dort steht der Stapel auf Weiß, hier auf
   dem Rot-Anker der .s-quote-Sektion. Eine Karte in Rot-Anker würde mit
   dem Hintergrund verschmelzen — die Abschlusskarte läuft deshalb in
   Tiefschwarz. */
.kv3-card--anker { background: var(--rp-tiefschwarz); border-top-color: var(--rp-beige); }
.kv3-card--anker .kv3-card__num { color: rgba(237,228,210,0.72); }

/* ---- Karteninhalt ---------------------------------------- */
.wal-q__stars {
  margin: 0 0 18px;
  font-size: 15px;
  letter-spacing: 0.18em;
  color: var(--rp-rot-akzent);
}
.wal-q__text {
  margin: 0 0 28px;
  font-family: var(--font-serif);
  font-style: italic;
  font-weight: 400;
  font-size: clamp(19px, 2.05vw, 30px);
  line-height: 1.34;
  letter-spacing: -0.01em;
  color: var(--rp-tiefschwarz);
  max-width: 46ch;
  text-wrap: pretty;
}
.wal-q__attr {
  margin: 0;
  padding-top: 20px;
  border-top: 1px solid var(--rp-border-soft);
  font-family: var(--font-mono);
  font-size: 11.5px;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--rp-grau-7012);
}
.wal-q__attr strong { color: var(--rp-rot-anker); font-weight: 700; }
.wal-q__note {
  margin: 12px 0 0;
  font-family: var(--font-mono);
  font-size: 10.5px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--rp-grau-muted);
  line-height: 1.6;
}

/* Abschlusskarte (Rot-Anker) */
.kv3-card--anker .wal-q__stars { color: var(--rp-beige); }
.kv3-card--anker .wal-q__text { color: #fff; }
.kv3-card--anker .wal-q__attr {
  color: rgba(237,228,210,0.88);
  border-top-color: rgba(255,255,255,0.24);
}
.kv3-card--anker .wal-q__attr strong { color: var(--rp-beige); }
/* Button an die Kartenbreite binden — sonst schiebt er auf 375 px
   über den Rand hinaus (die Seite rechnet content-box). */
.kv3-card .s-btn {
  box-sizing: border-box;
  max-width: 100%;
  text-align: center;
  margin-top: 28px;
}

@media (max-width: 900px) {
  .kv3-card { padding: 30px 24px 28px; }
  .kv3-card__num { top: 16px; right: 18px; }
  .wal-q__text { font-size: clamp(18px, 4.4vw, 22px); }
}

/* Ohne JS und bei reduzierter Bewegung bleibt der Stapel statisch:
   die Karten stehen untereinander und sind vollständig lesbar. */
@media (prefers-reduced-motion: reduce) {
  .kv3-stack { padding-bottom: 48px; }
  .kv3-stack__wrap { position: static; height: auto; padding: 14px 20px; }
}

/* ── Finaler CTA · Schlusswort auf schmalen Handys (06.10.2026)
   Der Abschluss-Block hat hier mehr Innenabstand als auf den anderen
   Standortseiten (Zeile 268 statt 312px bei 360px Breite), deshalb eine
   eigene Grenze, damit „auszuprobieren." nicht im Wort umbricht. */
@media (max-width: 420px) {
  .v3 .s-final__h { font-size: min(42px, calc((100vw - 92px) / 7.9)); }
}