/*
Theme Name: FITIN
Theme URI: https://fitin.ch
Description: FITIN Block-Theme — Brutalist Swiss × Logbook-Editorial. Child-Theme von Twenty Twenty-Five. Training. Therapie. Hier.
Author: FITIN GmbH
Version: 2.8.2
Template: twentytwentyfive
Text Domain: fitin
*/

/* ═══════════════════════════════════════════════════════════════
   FITIN v6 — Brutalist Swiss × Logbook-Editorial
   Foundation: Tokens, Type, Buttons, Header/Footer, Marquee,
   Section-Frames, Mobile-Bar, Reveal-Animations.

   v2.1.0 ergänzt am Ende der Datei:
     • Announcement-Bar (Header-Topline mit Sale)
     • Newsletter-Footer + Newsletter-Drawer
     • Social-Strip (Instagram + Facebook)
     • Side-Pillar (Desktop-Sticky-CTAs)
     • Sale-Tag + Hero-Sale-Bar (Easy24-Aktion)
     • Trust-Block (Google-Reviews-Slot)
     • Community-Grid (Instagram-Tile-Grid)
   ═══════════════════════════════════════════════════════════════ */

/* JetBrains Mono wird lokal über theme.json (assets/fonts/JetBrainsMono*.woff2) geladen. */

/* ─────────── TOKENS ─────────── */
:root {
  --paper:        #f6f5f1;
  --paper-elev:   #ffffff;
  --paper-soft:   #eeede8;
  --paper-deep:   #e4e3dd;

  --ink:          #3e3e3e;
  --ink-soft:     #3e3e3e;
  --ink-mute:     #5d5d5d;
  --ink-low:      #8a8a85;

  --line:         #d4d0c5;
  --line-strong:  #b9b5a8;

  --star:         #f0a020;
  /* Aktion/Sale → Physio-Gelb/Gold. */
  --action:       var(--physio);

  --easy:         #6c894f;
  --easy-deep:    #566e3f;
  --easy-tint:    #e7ece0;

  --premium:      #00AEEF;
  --premium-deep: #008cc4;
  --premium-tint: #d6eef9;

  --physio:       #F6C443;
  --physio-deep:  #d6a420;
  --physio-tint:  #fdf2cc;

  --accent:       var(--ink);

  /* Gibson via Adobe Typekit (Kit wzl6foc). 7 Gewichte:
     Heavy 900 / Heavy Italic 900 · Bold 700 · SemiBold 600 ·
     Medium 500 · Regular 400 · Italic 400. */
  --font-sans:    'canada-type-gibson', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  --font-display: 'canada-type-gibson', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  --font-serif:   'canada-type-gibson', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  --font-mono:    'canada-type-gibson', ui-monospace, 'SF Mono', Menlo, monospace;

  --r-sm: 2px;
  --r-md: 4px;

  --ease: cubic-bezier(0.16, 1, 0.3, 1);

  --section-y:    clamp(80px, 8vw, 132px);
}

/* Page-Akzent pro Body-Klasse */
.page-home, .page-standorte, .page-firmen, .page-ueber, .page-probetraining, .page-kontakt { --accent: var(--ink); }
.page-mitgliedschaft { --accent: var(--premium); }
.page-physio        { --accent: var(--physio); }

/* ─────────── RESET & BASE ─────────── */
html { scroll-behavior: smooth; }
body {
  font-family: var(--font-sans);
  background: var(--paper);
  color: var(--ink-soft);
  font-weight: 400;
  font-size: 17px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  margin: 0;
  overflow-x: hidden;
}
img { max-width: 100%; display: block; height: auto; }
a { color: inherit; text-decoration: none; }
* { box-sizing: border-box; }
/* Browser-Default für <strong> ist 700 — mit Gibson Bold würde das in
   Body-Text zu schwer wirken. 600 (SemiBold) trägt Emphase elegant. */
strong, b { font-weight: 600; }

/* ─────────── LAYOUT ─────────── */
.fitin-shell {
  max-width: 1480px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 64px;
  padding-right: 64px;
}
@media (max-width: 980px) { .fitin-shell { padding-left: 32px; padding-right: 32px; } }
@media (max-width: 600px) { .fitin-shell { padding-left: 22px; padding-right: 22px; } }

.fitin-section {
  padding-top: var(--section-y);
  padding-bottom: var(--section-y);
  position: relative;
}

/* ─────────── TYPE ───────────
   H1/H2 = Canada Type Gibson Bold 700 (Display via Typekit).
   H3/H4 = Gibson Regular 400. Body bleibt DM Sans (siehe --font-sans). */
.fitin-h1, .fitin-h2, .fitin-h3, .fitin-h4 {
  font-family: var(--font-display);
  color: var(--ink);
  font-weight: 400;
  line-height: 0.92;
  letter-spacing: -0.04em;
  margin: 0;
}
.fitin-h1 {
  font-size: clamp(56px, 11vw, 168px);
  font-weight: 700;
  line-height: 0.86;
  letter-spacing: -0.05em;
  text-transform: uppercase;
}
.fitin-h2 {
  font-size: clamp(40px, 6vw, 100px);
  font-weight: 700;
  line-height: 0.9;
  letter-spacing: -0.044em;
  text-transform: uppercase;
}
.fitin-h3 {
  font-size: clamp(28px, 3vw, 48px);
  font-weight: 400;
  line-height: 1;
  letter-spacing: -0.026em;
}
.fitin-h4 {
  font-size: clamp(20px, 2vw, 28px);
  font-weight: 400;
  line-height: 1.1;
  letter-spacing: -0.018em;
}

.fitin-h1 em, .fitin-h2 em, .fitin-h3 em {
  font-style: normal;
  color: var(--accent);
}

.fitin-lead {
  font-family: var(--font-sans);
  font-size: clamp(18px, 1.4vw, 24px);
  line-height: 1.45;
  color: var(--ink-soft);
  font-weight: 400;
  margin: 0;
  max-width: 50ch;
}

.fitin-mono {
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--ink-mute);
  margin: 0;
  /* Gibson hat eingebaute Tabular-Lining-Numbers — bringt das "mono"-Feel
     für Index-Labels (01 / 05), Pricing-Zahlen und Tel-Nummern zurück,
     ohne dass eine echte Monospace-Familie nötig ist. */
  font-feature-settings: 'tnum' 1, 'lnum' 1;
}
.fitin-mono--ink { color: var(--ink); }
.fitin-mono--paper { color: var(--paper); }
.fitin-mono--low { color: var(--ink-low); }
.fitin-mono--accent { color: var(--accent); }

/* Editorial Index: --- 01 / 04  ---  */
.fitin-idx {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 32px;
}
.fitin-idx__bar {
  width: 56px;
  height: 2px;
  background: var(--ink);
  flex-shrink: 0;
}
.fitin-idx--paper .fitin-idx__bar { background: var(--paper); }
.fitin-idx--accent .fitin-idx__bar { background: var(--accent); }
.fitin-idx--premium .fitin-idx__bar { background: var(--premium); }
.fitin-idx--physio .fitin-idx__bar { background: var(--physio); }


/* ─────────── BUTTONS ─────────── */
.fitin-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  padding: 20px 30px;
  border-radius: var(--r-sm);
  font-family: var(--font-sans);
  font-weight: 500;
  font-size: 13px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  border: 1.5px solid transparent;
  transition: background 240ms var(--ease), color 240ms, border-color 240ms, transform 240ms;
  white-space: nowrap;
  cursor: pointer;
  line-height: 1;
  text-decoration: none;
}
.fitin-btn--ink         { background: var(--ink); color: var(--paper); }
.fitin-btn--ink:hover   { background: var(--ink-soft); transform: translateY(-2px); }
.fitin-btn--paper       { background: var(--paper); color: var(--ink); }
.fitin-btn--paper:hover { background: var(--ink); color: var(--paper); transform: translateY(-2px); }
.fitin-btn--ghost       { background: transparent; color: var(--ink); border-color: var(--ink); }
.fitin-btn--ghost:hover { background: var(--ink); color: var(--paper); transform: translateY(-2px); }
.fitin-btn--ghost-paper       { background: transparent; color: var(--paper); border-color: var(--paper); }
.fitin-btn--ghost-paper:hover { background: var(--paper); color: var(--ink); transform: translateY(-2px); }
.fitin-btn--premium       { background: var(--premium); color: var(--paper); }
.fitin-btn--premium:hover { background: var(--premium-deep); transform: translateY(-2px); }
.fitin-btn--easy       { background: var(--easy); color: var(--ink); }
.fitin-btn--easy:hover { background: var(--easy-deep); color: var(--paper); transform: translateY(-2px); }
.fitin-btn--physio       { background: var(--physio); color: var(--ink); }
.fitin-btn--physio:hover { background: var(--physio-deep); color: var(--ink); transform: translateY(-2px); }
.fitin-btn--lg { padding: 24px 36px; font-size: 14px; }
.fitin-btn--sm { padding: 14px 22px; font-size: 12px; }

.fitin-btn .arr {
  display: inline-block;
  font-family: var(--font-mono);
  font-weight: 500;
  transition: transform 320ms var(--ease);
}
.fitin-btn:hover .arr { transform: translateX(6px); }

/* ─────────── HEADER (über schwarzen Hero) ─────────── */
.fitin-site-header {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 80;
  padding: 28px 0;
  /* Permanent cream-Header (paper-Background) auf allen Seiten,
     auch über dunklem Hero — saubere Trennung Header ↔ Content. */
  background: rgba(246, 245, 241, 0.96);
  backdrop-filter: saturate(160%) blur(14px);
  -webkit-backdrop-filter: saturate(160%) blur(14px);
  border-bottom: 1px solid var(--line);
  box-shadow: 0 8px 28px -12px rgba(10, 10, 11, 0.16);
  transition: padding 280ms var(--ease), box-shadow 280ms var(--ease);
  margin: 0 !important;
}
/* Beim Scrollen kompakter — gleiche Optik, nur weniger Höhe. */
.fitin-site-header.is-scrolled {
  padding: 16px 0;
  box-shadow: 0 12px 34px -14px rgba(10, 10, 11, 0.22);
}
.fitin-site-header::before {
  content: "";
  position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: var(--premium);
  transform: scaleX(0); transform-origin: left;
  animation: fitin-header-line 1100ms var(--ease) 200ms forwards;
}
@keyframes fitin-header-line { to { transform: scaleX(1); } }

.fitin-site-header__inner {
  max-width: 1480px;
  margin: 0 auto;
  padding: 0 64px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
}
@media (max-width: 980px) { .fitin-site-header__inner { padding: 0 32px; } }
@media (max-width: 600px) { .fitin-site-header__inner { padding: 0 22px; } }

.fitin-site-header__brand {
  display: flex;
  flex-direction: column;
  line-height: 0.95;
  gap: 4px;
}


.fitin-site-header__nav {
  display: flex;
  gap: 44px;
  align-items: center;
}
.fitin-site-header__nav a {
  font-size: 13px;
  font-weight: 500;
  color: var(--ink-mute);
  letter-spacing: 0.03em;
  text-transform: uppercase;
  position: relative;
  padding: 8px 0;
  text-decoration: none;
  transition: color 240ms var(--ease),
              letter-spacing 320ms var(--ease),
              transform 240ms var(--ease);
}
.fitin-site-header__nav a:hover {
  color: var(--ink);
  letter-spacing: 0.06em;
  transform: translateY(-1px);
}

/* Underline animiert von der Mitte (scaleX), Premium-Akzent. */
.fitin-site-header__nav a::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -2px;
  width: 24px;
  height: 2px;
  background: var(--premium);
  transform: translateX(-50%) scaleX(0);
  transform-origin: center;
  transition: transform 320ms var(--ease), width 320ms var(--ease);
}
.fitin-site-header__nav a:hover::after {
  transform: translateX(-50%) scaleX(1);
}

/* Active-Page-Indicator: dauerhaft sichtbarer Premium-Underline + animierter
   Dot oben drüber + Bold + dunkle Schrift. */
body.page-standorte      .fitin-site-header__nav a[href="/standorte/"],
body.page-physio         .fitin-site-header__nav a[href="/physiotherapie/"],
body.page-mitgliedschaft .fitin-site-header__nav a[href="/mitgliedschaft/"],
body.page-firmen         .fitin-site-header__nav a[href="/firmenfitness/"],
body.page-ueber          .fitin-site-header__nav a[href="/ueber-uns/"],
body.page-screens        .fitin-site-header__nav a[href="/screens/"] {
  color: var(--ink);
  font-weight: 600;
}

body.page-standorte      .fitin-site-header__nav a[href="/standorte/"]::after,
body.page-physio         .fitin-site-header__nav a[href="/physiotherapie/"]::after,
body.page-mitgliedschaft .fitin-site-header__nav a[href="/mitgliedschaft/"]::after,
body.page-firmen         .fitin-site-header__nav a[href="/firmenfitness/"]::after,
body.page-ueber          .fitin-site-header__nav a[href="/ueber-uns/"]::after,
body.page-screens        .fitin-site-header__nav a[href="/screens/"]::after {
  transform: translateX(-50%) scaleX(1);
  width: 32px;
}

body.page-standorte      .fitin-site-header__nav a[href="/standorte/"]::before,
body.page-physio         .fitin-site-header__nav a[href="/physiotherapie/"]::before,
body.page-mitgliedschaft .fitin-site-header__nav a[href="/mitgliedschaft/"]::before,
body.page-firmen         .fitin-site-header__nav a[href="/firmenfitness/"]::before,
body.page-ueber          .fitin-site-header__nav a[href="/ueber-uns/"]::before,
body.page-screens        .fitin-site-header__nav a[href="/screens/"]::before {
  content: "";
  position: absolute;
  top: -6px; left: 50%;
  width: 4px; height: 4px;
  border-radius: 50%;
  background: var(--premium);
  transform: translateX(-50%);
  animation: fitinNavDot 1.6s var(--ease) infinite alternate;
}
@keyframes fitinNavDot {
  from { opacity: 0.55; transform: translateX(-50%) scale(1); }
  to   { opacity: 1;    transform: translateX(-50%) scale(1.35); }
}

.fitin-site-header__actions {
  display: flex;
  align-items: center;
  gap: 16px;
}
.fitin-site-header__tel {
  font-family: var(--font-mono);
  font-size: 12px;
  font-weight: 500;
  color: var(--ink);
  letter-spacing: 0.04em;
  font-feature-settings: 'tnum' 1, 'lnum' 1;
  transition: color 200ms;
}
.fitin-site-header__tel:hover { color: var(--premium); }

/* Social-Icons im Header — dezent, nicht aufdringlich. */
.fitin-site-header__social { display: flex; align-items: center; gap: 12px; margin-right: 2px; }
.fitin-site-header__social a {
  display: inline-flex;
  color: var(--ink-low);
  transition: color 220ms var(--ease), transform 220ms var(--ease);
}
.fitin-site-header__social a:hover { color: var(--premium); transform: translateY(-1px); }
@media (max-width: 600px) { .fitin-site-header__social { display: none; } }

/* ═══════════════════════════════════════════════════════════════
   MOBILE-MENÜ — Hamburger + Vollbild-Overlay (v2.4.0)
   ═══════════════════════════════════════════════════════════════ */
.fitin-burger { display: none; }
@media (max-width: 980px) {
  .fitin-burger {
    display: inline-flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 5px;
    width: 42px; height: 42px;
    margin-left: 2px;
    padding: 0;
    background: none; border: none; cursor: pointer;
  }
  .fitin-burger span {
    display: block; width: 24px; height: 2px;
    background: var(--ink); border-radius: 2px;
  }
}

.fitin-mobile {
  position: fixed; inset: 0; z-index: 200;
  background: var(--ink); color: var(--paper);
  display: flex; flex-direction: column;
  opacity: 0; visibility: hidden;
  transition: opacity 360ms var(--ease), visibility 360ms var(--ease);
}
.fitin-mobile.is-open { opacity: 1; visibility: visible; }
body.menu-open { overflow: hidden; }
.fitin-mobile__bar {
  display: flex; align-items: center; justify-content: space-between;
  padding: 20px 22px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.fitin-mobile__brand {
  font-family: var(--font-display); font-weight: 700; font-size: 24px;
  letter-spacing: -.04em; color: var(--paper); text-decoration: none;
}
.fitin-mobile__close {
  width: 44px; height: 44px; display: grid; place-items: center;
  background: none; border: none; color: var(--paper); cursor: pointer;
}
.fitin-mobile__nav {
  flex: 1; overflow-y: auto;
  display: flex; flex-direction: column;
  padding: clamp(18px, 4vh, 44px) 28px;
  gap: 2px;
}
.fitin-mobile__nav > a {
  font-family: var(--font-display);
  font-size: clamp(30px, 9vw, 44px);
  font-weight: 700; letter-spacing: -.03em; line-height: 1.12;
  color: var(--paper); text-decoration: none;
  padding: 6px 0;
  opacity: 0; transform: translateY(14px);
  transition: opacity 420ms var(--ease), transform 420ms var(--ease), color 200ms var(--ease);
}
.fitin-mobile__sub {
  display: flex; flex-wrap: wrap; gap: 10px;
  padding: 10px 0 18px;
  opacity: 0; transform: translateY(14px);
  transition: opacity 420ms var(--ease), transform 420ms var(--ease);
}
.fitin-mobile.is-open .fitin-mobile__nav > a,
.fitin-mobile.is-open .fitin-mobile__sub {
  opacity: 1; transform: translateY(0);
  transition-delay: calc(var(--d, 0) * 55ms + 120ms);
}
.fitin-mobile__nav > a:hover, .fitin-mobile__nav > a:active { color: var(--premium); }
.fitin-mobile__sub a {
  display: inline-flex; align-items: center; gap: 8px;
  font-family: var(--font-mono); font-size: 12px; font-weight: 600;
  letter-spacing: .08em; text-transform: uppercase;
  color: rgba(246, 245, 241, 0.82); text-decoration: none;
  border: 1px solid rgba(255, 255, 255, 0.22); border-radius: 999px;
  padding: 9px 15px;
  transition: border-color 200ms var(--ease), background 200ms var(--ease);
}
.fitin-mobile__sub a:hover { border-color: var(--paper); background: rgba(255, 255, 255, 0.06); }
.fitin-mobile__dot { width: 8px; height: 8px; border-radius: 50%; }
.fitin-mobile__dot--premium { background: var(--premium); }
.fitin-mobile__dot--easy { background: var(--easy); }
.fitin-mobile__foot {
  padding: 22px 28px calc(24px + env(safe-area-inset-bottom, 0px));
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  display: flex; flex-direction: column; gap: 18px;
}
.fitin-mobile__foot .fitin-btn { width: 100%; justify-content: center; }
.fitin-mobile__meta { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.fitin-mobile__meta > a { font-family: var(--font-mono); font-size: 14px; color: var(--paper); text-decoration: none; letter-spacing: .02em; }
.fitin-mobile__social { display: flex; gap: 18px; }
.fitin-mobile__social a { color: rgba(246, 245, 241, 0.7); display: inline-flex; transition: color 200ms var(--ease); }
.fitin-mobile__social a:hover { color: var(--premium); }

/* Aktive Seite im Mobile-Menü hervorheben. */
body.page-standorte      .fitin-mobile__nav a[href="/standorte/"],
body.page-physio         .fitin-mobile__nav a[href="/physiotherapie/"],
body.page-mitgliedschaft .fitin-mobile__nav a[href="/mitgliedschaft/"],
body.page-firmen         .fitin-mobile__nav a[href="/firmenfitness/"],
body.page-screens        .fitin-mobile__nav a[href="/screens/"],
body.page-ueber          .fitin-mobile__nav a[href="/ueber-uns/"],
body.page-premium        .fitin-mobile__sub a[href="/premium/"],
body.page-easy           .fitin-mobile__sub a[href="/easy/"] { color: var(--premium); }

@media (prefers-reduced-motion: reduce) {
  .fitin-mobile, .fitin-mobile__nav > a, .fitin-mobile__sub { transition: none; }
  .fitin-mobile.is-open .fitin-mobile__nav > a, .fitin-mobile.is-open .fitin-mobile__sub { transition-delay: 0s; }
}

/* ═══════════════════════════════════════════════════════════════
   ECHTES FITIN-LOGO (SVG) — Header / Footer / Mobile  [v2.4.0]
   ═══════════════════════════════════════════════════════════════ */
.fitin-site-header__logo-img {
  display: block;
  height: 40px;
  width: auto;
  transition: height 280ms var(--ease);
}
.fitin-site-header.is-scrolled .fitin-site-header__logo-img { height: 33px; }
@media (max-width: 600px) { .fitin-site-header__logo-img { height: 32px; } }

.fitin-footer__brand-img { display: block; height: 46px; width: auto; }
@media (max-width: 600px) { .fitin-footer__brand-img { height: 40px; } }

.fitin-mobile__brand img { display: block; height: 26px; width: auto; }

.fitin-site-header__btn {
  background: var(--ink);
  color: var(--paper);
  padding: 12px 20px;
  border-radius: var(--r-sm);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  text-decoration: none;
  transition: background 240ms, color 240ms;
}
.fitin-site-header__btn:hover { background: var(--premium); color: var(--paper); }

@media (max-width: 980px) {
  .fitin-site-header__nav, .fitin-site-header__tel, .fitin-site-header__btn { display: none; }
}
/* Tablet-Zwischenbreite (981–1080px): Desktop-Nav bleibt, aber Telefon-Text
   und Social-Icons ausblenden, damit der Header nicht überläuft. */
@media (min-width: 981px) and (max-width: 1080px) {
  .fitin-site-header__tel, .fitin-site-header__social { display: none; }
}

/* ─────────── MARQUEE ─────────── */
.fitin-marquee {
  background: var(--paper);
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  overflow: hidden;
  padding: 22px 0;
}
.fitin-marquee--ink {
  background: var(--ink);
  border-top-color: rgba(255, 255, 255, 0.12);
  border-bottom-color: rgba(255, 255, 255, 0.12);
}
.fitin-marquee__track {
  display: flex;
  gap: 56px;
  align-items: center;
  white-space: nowrap;
  width: max-content;
  animation: fitin-marquee 32s linear infinite;
}
.fitin-marquee:hover .fitin-marquee__track { animation-play-state: paused; }
@keyframes fitin-marquee { to { transform: translateX(-50%); } }

.fitin-marquee__item {
  font-family: var(--font-display);
  font-weight: 600;
  font-size: clamp(28px, 3.6vw, 56px);
  letter-spacing: -0.04em;
  color: var(--ink);
  text-transform: uppercase;
  display: inline-flex;
  align-items: baseline;
  line-height: 0.85;
}
.fitin-marquee--ink .fitin-marquee__item { color: var(--paper); }
.fitin-marquee__item .n { color: var(--premium); }
.fitin-marquee__sep {
  font-family: var(--font-mono);
  font-size: 16px;
  font-weight: 500;
  color: var(--ink-low);
  letter-spacing: 0.1em;
}
.fitin-marquee--ink .fitin-marquee__sep { color: rgba(246, 245, 241, 0.4); }

/* Grüne Variante (FITIN Easy-Grün) — Text in Ink für Kontrast, blaues N bleibt Brand-Hook. */
.fitin-marquee--easy {
  background: var(--easy);
  border-top-color: rgba(10, 10, 11, 0.14);
  border-bottom-color: rgba(10, 10, 11, 0.14);
}
.fitin-marquee--easy .fitin-marquee__item { color: var(--ink); }
.fitin-marquee--easy .fitin-marquee__sep { color: rgba(10, 10, 11, 0.4); }

/* Gelbe Variante (Physio-Gelb) — Text in Ink für Kontrast, blaues N bleibt Brand-Hook. */
.fitin-marquee--physio {
  background: var(--physio);
  border-top-color: rgba(10, 10, 11, 0.14);
  border-bottom-color: rgba(10, 10, 11, 0.14);
}
.fitin-marquee--physio .fitin-marquee__item { color: var(--ink); }
.fitin-marquee--physio .fitin-marquee__sep { color: rgba(10, 10, 11, 0.4); }

/* Marquee-Band sitzt bündig am Hero — den von WordPress auf .wp-site-blocks-Kinder
   gesetzten margin-block-start (1.5rem) an diesem Übergang entfernen. */
.fitin-hero + .fitin-marquee { margin-top: 0; }

/* ─────────── HERO (Generic) ─────────── */
.fitin-hero {
  background: var(--ink);
  color: var(--paper);
  padding: 180px 0 80px;
  position: relative;
  overflow: hidden;
  min-height: 100vh;
}
@media (max-width: 980px) { .fitin-hero { padding: 130px 0 80px; min-height: 0; } }
@media (max-width: 600px) { .fitin-hero { padding: 104px 0 44px; } }

/* Hero-Hintergrundbild — direkt unter dem Header sichtbar, mit dunklem
   Gradient-Overlay damit der weisse Text lesbar bleibt. */
.fitin-hero__bgimage {
  position: absolute;
  inset: 0;
  z-index: 0;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  opacity: 0.9;
  pointer-events: none;
}
.fitin-hero__bgimage::after {
  content: "";
  position: absolute;
  inset: 0;
  /* Oben dunkler (Header-Klarheit), Mitte etwas heller (Studio sichtbar),
     unten dunkler (für CTAs/Sale-Tag-Lesbarkeit). */
  background: linear-gradient(180deg,
    rgba(10, 10, 11, 0.62) 0%,
    rgba(10, 10, 11, 0.40) 45%,
    rgba(10, 10, 11, 0.74) 100%);
}

.fitin-hero__shell { position: relative; z-index: 2; }

.fitin-hero__bgwm {
  position: absolute;
  bottom: -50px;
  left: 50%;
  transform: translateX(-50%);
  font-family: var(--font-display);
  font-weight: 900;
  font-size: clamp(280px, 38vw, 580px);
  letter-spacing: -0.06em;
  color: rgba(255, 255, 255, 0.025);
  line-height: 1;
  pointer-events: none;
  z-index: 1;
}


.fitin-hero__top {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 80px;
  padding-bottom: 24px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
  gap: 24px;
  flex-wrap: wrap;
}
@media (max-width: 600px) { .fitin-hero__top { margin-bottom: 26px; padding-bottom: 14px; } }

.fitin-hero__top .fitin-mono { color: rgba(246, 245, 241, 0.6); }
.fitin-hero__top .fitin-mono strong { color: var(--paper); font-weight: 600; }
.fitin-hero__top-right {
  text-align: right;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.fitin-hero__h1 {
  color: var(--paper);
  font-size: clamp(46px, 8vw, 116px);
  margin: 0 0 64px 0;
}
.fitin-hero__h1 em { color: var(--premium); }
@media (max-width: 600px) { .fitin-hero__h1 { margin-bottom: 56px; } }

.fitin-hero__lower {
  display: grid;
  grid-template-columns: 1fr 1.1fr;
  gap: 80px;
  align-items: end;
}
@media (max-width: 980px) { .fitin-hero__lower { grid-template-columns: 1fr; gap: 56px; } }

.fitin-hero__copy { max-width: 42ch; }
.fitin-hero__copy .fitin-lead { color: var(--paper); margin-bottom: 32px; }
.fitin-hero__copy .fitin-lead strong { font-weight: 600; color: var(--paper); }

.fitin-hero__ctas {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 36px;
}
.fitin-hero__ctas .fitin-btn { flex: 1 1 0; }

.fitin-hero__visual {
  position: relative;
  aspect-ratio: 4 / 5;
  overflow: hidden;
  border-radius: var(--r-md);
  background: rgba(255, 255, 255, 0.04);
}
.fitin-hero__visual img {
  width: 100%; height: 100%;
  object-fit: cover;
  filter: contrast(1.05) saturate(0.85);
}
.fitin-hero__visual::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 60%, rgba(10, 10, 11, 0.35));
  pointer-events: none;
}
.fitin-hero__visual-meta {
  position: absolute;
  bottom: 24px; left: 24px; right: 24px;
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  z-index: 2;
  gap: 8px;
  flex-wrap: wrap;
}
.fitin-hero__visual-tag {
  font-family: var(--font-mono);
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--paper);
  padding: 8px 12px;
  background: rgba(10, 10, 11, 0.55);
  backdrop-filter: blur(6px);
  border-radius: 2px;
}
.fitin-hero__visual-tag--premium { background: var(--premium); color: var(--ink); }

/* Hero light variant — for non-home pages */
.fitin-hero--paper {
  background: var(--paper);
  color: var(--ink);
  min-height: 0;
  padding: 220px 0 100px;
}
.fitin-hero--paper .fitin-hero__bgwm { color: rgba(10, 10, 11, 0.03); }
.fitin-hero--paper .fitin-hero__top { border-bottom-color: var(--line); }
.fitin-hero--paper .fitin-hero__top .fitin-mono { color: var(--ink-mute); }
.fitin-hero--paper .fitin-hero__top .fitin-mono strong { color: var(--ink); }
.fitin-hero--paper .fitin-hero__h1 { color: var(--ink); }
.fitin-hero--paper .fitin-hero__h1 em { color: var(--accent); }
.fitin-hero--paper .fitin-hero__copy .fitin-lead { color: var(--ink-soft); }
.fitin-hero--paper .fitin-hero__copy .fitin-lead strong { color: var(--ink); }

/* Page-Akzent-Variants */
.page-physio .fitin-hero--paper { background: var(--physio-tint); }
.page-physio .fitin-hero--paper .fitin-hero__bgwm { color: rgba(214, 164, 32, 0.08); }
.page-mitgliedschaft .fitin-hero--paper .fitin-hero__h1 em { color: var(--premium-deep); }
.page-physio .fitin-hero--paper .fitin-hero__h1 em { color: var(--physio-deep); }


/* ─────────── SECTION HEAD (eyebrow + h2 + lead) ─────────── */
.fitin-section-head {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 64px 96px;
  align-items: end;
  margin-bottom: 96px;
}
@media (max-width: 980px) {
  .fitin-section-head { grid-template-columns: 1fr; gap: 32px; margin-bottom: 64px; }
}
.fitin-section-head h2 { max-width: 14ch; }

/* Section dark variant */
.fitin-section--ink {
  background: var(--ink);
  color: var(--paper);
}
.fitin-section--ink .fitin-h2 { color: var(--paper); }
.fitin-section--ink .fitin-lead { color: rgba(246, 245, 241, 0.78); }
.fitin-section--ink .fitin-mono--low { color: rgba(246, 245, 241, 0.6); }

/* Editorial-Calm Varianten — drei Cream-Töne statt harter Ink-Wechsel. */
.fitin-section--paper-soft { background: var(--paper-soft); }
.fitin-section--paper-deep { background: var(--paper-deep); }

/* ─────────── CARDS / GRIDS (Three Ways pattern, reused) ─────────── */
.fitin-cards-3 {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}
@media (max-width: 980px) { .fitin-cards-3 { grid-template-columns: 1fr; gap: 24px; } }

.fitin-card {
  display: flex;
  flex-direction: column;
  border-radius: var(--r-md);
  overflow: hidden;
  position: relative;
  transition: transform 400ms var(--ease);
}
.fitin-card:hover { transform: translateY(-6px); }
.fitin-card--easy    { background: var(--easy-tint); }
.fitin-card--premium { background: var(--premium-tint); }
.fitin-card--physio  { background: var(--physio-tint); }

.fitin-card__strip { height: 8px; width: 100%; }
.fitin-card--easy    .fitin-card__strip { background: var(--easy); }
.fitin-card--premium .fitin-card__strip { background: var(--premium); }
.fitin-card--physio  .fitin-card__strip { background: var(--physio); }

.fitin-card__img {
  aspect-ratio: 16 / 11;
  overflow: hidden;
  position: relative;
}
.fitin-card__img img {
  width: 100%; height: 100%;
  object-fit: cover;
  filter: contrast(1) saturate(0.9);
  transition: transform 700ms var(--ease);
}
.fitin-card:hover .fitin-card__img img { transform: scale(1.05); }

.fitin-card__body {
  padding: 36px 32px;
  display: flex;
  flex-direction: column;
  flex: 1;
}
.fitin-card__num {
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  margin-bottom: 24px;
}
.fitin-card--easy    .fitin-card__num { color: var(--easy-deep); }
.fitin-card--premium .fitin-card__num { color: var(--premium-deep); }
.fitin-card--physio  .fitin-card__num { color: var(--physio-deep); }

.fitin-card__title {
  font-size: clamp(34px, 3.2vw, 52px);
  font-weight: 600;
  line-height: 0.92;
  letter-spacing: -0.034em;
  color: var(--ink);
  margin: 0 0 20px 0;
  text-transform: uppercase;
}

.fitin-card__desc {
  font-size: 15px;
  line-height: 1.55;
  color: var(--ink-soft);
  margin: 0 0 28px 0;
  flex: 1;
}

.fitin-card__list {
  list-style: none;
  margin: 0 0 32px 0;
  padding: 22px 0 0 0;
  border-top: 1px solid rgba(10, 10, 11, 0.12);
}
.fitin-card__list li {
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 400;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--ink-soft);
  padding: 9px 0;
  display: flex;
  align-items: center;
  gap: 12px;
}
.fitin-card__list li::before { content: "→"; font-weight: 600; }

.fitin-card__cta {
  font-family: var(--font-mono);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 14px 0;
  border-bottom: 1.5px solid currentColor;
  align-self: flex-start;
  transition: gap 280ms var(--ease);
  text-decoration: none;
}
.fitin-card--easy    .fitin-card__cta { color: var(--easy-deep); }
.fitin-card--premium .fitin-card__cta { color: var(--premium-deep); }
.fitin-card--physio  .fitin-card__cta { color: var(--physio-deep); }
.fitin-card:hover .fitin-card__cta { gap: 16px; }

/* ─────────── STUDIO CARDS (in dark sections) ─────────── */
.fitin-studio {
  display: flex;
  flex-direction: column;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: var(--r-md);
  overflow: hidden;
  transition: border-color 360ms var(--ease), transform 360ms var(--ease);
}
.fitin-studio:hover { border-color: var(--premium); transform: translateY(-3px); }
.fitin-studio--flagship { border-color: rgba(0, 174, 239, 0.4); }

.fitin-studio__img {
  aspect-ratio: 16 / 10;
  overflow: hidden;
  position: relative;
  background: rgba(255, 255, 255, 0.05);
}
.fitin-studio__img img {
  width: 100%; height: 100%;
  object-fit: cover;
  filter: contrast(1.02) saturate(0.85);
  transition: transform 700ms var(--ease);
}
.fitin-studio:hover .fitin-studio__img img { transform: scale(1.04); }

.fitin-studio__index {
  position: absolute;
  top: 16px; left: 16px;
  font-family: var(--font-mono);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--paper);
  background: rgba(10, 10, 11, 0.55);
  backdrop-filter: blur(6px);
  padding: 7px 10px;
  border-radius: 2px;
  z-index: 1;
}
.fitin-studio__flag {
  position: absolute;
  top: 16px; right: 16px;
  font-family: var(--font-mono);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--ink);
  background: var(--premium);
  padding: 7px 11px;
  border-radius: 2px;
  z-index: 1;
}

.fitin-studio__body {
  padding: 32px;
  display: flex;
  flex-direction: column;
  flex: 1;
}
.fitin-studio__name {
  font-size: clamp(32px, 3vw, 56px);
  font-weight: 700;
  line-height: 0.92;
  letter-spacing: -0.04em;
  color: var(--paper);
  margin: 0 0 16px 0;
  text-transform: uppercase;
}
.fitin-studio__addr {
  font-family: var(--font-mono);
  font-size: 12px;
  line-height: 1.55;
  color: rgba(246, 245, 241, 0.65);
  margin: 0 0 20px 0;
  letter-spacing: 0.04em;
}
.fitin-studio__badges {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 28px;
}
.fitin-studio__badge {
  font-family: var(--font-mono);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  padding: 5px 9px;
  border-radius: 2px;
  background: rgba(255, 255, 255, 0.08);
  color: rgba(246, 245, 241, 0.85);
}
.fitin-studio__badge--premium { background: var(--premium); color: var(--ink); }
.fitin-studio__badge--easy    { background: var(--easy); color: var(--ink); }
.fitin-studio__badge--physio  { background: var(--physio); color: var(--ink); }

.fitin-studio__meta {
  margin-top: auto;
  padding-top: 20px;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  display: flex;
  flex-direction: column;
  gap: 14px;
  font-family: var(--font-mono);
  font-size: 11px;
  color: rgba(246, 245, 241, 0.55);
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.fitin-studio__actions { display: flex; flex-wrap: wrap; gap: 8px; }
.fitin-studio__action {
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--paper);
  border: 1px solid rgba(246, 245, 241, 0.24);
  border-radius: var(--r-sm);
  padding: 9px 13px;
  text-decoration: none;
  transition: background 200ms var(--ease), color 200ms, border-color 200ms;
}
.fitin-studio__action:hover { background: var(--paper); color: var(--ink); border-color: var(--paper); }
.fitin-studio__action--primary { border-color: rgba(246,245,241,0.55); color: var(--paper); }
.fitin-studio__action--primary:hover { background: var(--paper); color: var(--ink); border-color: var(--paper); }
.fitin-studio__action--physio { border-color: var(--physio); color: var(--physio); }
.fitin-studio__action--physio:hover { background: var(--physio); color: var(--ink); border-color: var(--physio); }

/* ─────────── EDITORIAL SPLIT (image + copy) ─────────── */
.fitin-editorial {
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  gap: 80px;
  align-items: stretch;
}
@media (max-width: 980px) { .fitin-editorial { grid-template-columns: 1fr; gap: 56px; } }
/* Grid-Kinder dürfen unter ihre Content-Breite schrumpfen (sonst 6px Overflow @360). */
.fitin-editorial > * { min-width: 0; }

.fitin-editorial__visual {
  position: relative;
  max-width: 100%;
  aspect-ratio: 4 / 5;
  border-radius: var(--r-md);
  overflow: hidden;
  background: var(--paper-soft);
}
.fitin-editorial__visual img {
  width: 100%; height: 100%;
  object-fit: cover;
  filter: contrast(1.02) saturate(0.9);
}
.fitin-editorial__caption {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  padding: 24px 28px;
  background: linear-gradient(180deg, transparent, rgba(10, 10, 11, 0.7));
  color: var(--paper);
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 8px;
}
.fitin-editorial__caption-name {
  font-size: 17px;
  font-weight: 500;
  letter-spacing: -0.01em;
  margin: 0 0 4px 0;
}
.fitin-editorial__caption-role {
  font-family: var(--font-mono);
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgba(246, 245, 241, 0.75);
}

.fitin-editorial__copy { display: flex; flex-direction: column; }
.fitin-editorial__copy .fitin-lead { margin-bottom: 36px; }


/* ─────────── PHYSIO BLOCK (real gold field) ─────────── */
.fitin-physio-block {
  /* Neutraler Sektion-Hintergrund (paper-soft) — einheitlich mit allen
     Standard-Seiten. Starke Brand-Farben bleiben den Physio-/Premium-/Easy-
     Seiten vorbehalten. */
  background: var(--paper-soft);
  color: var(--ink);
  position: relative;
  overflow: hidden;
  padding-top: var(--section-y);
  padding-bottom: var(--section-y);
}
.fitin-physio-block::after {
  content: "PHYSIO";
  position: absolute;
  bottom: -40px;
  left: 50%;
  transform: translateX(-50%);
  font-family: var(--font-sans);
  font-weight: 900;
  font-size: clamp(180px, 28vw, 420px);
  letter-spacing: -0.05em;
  color: rgba(10, 10, 11, 0.06);
  line-height: 1;
  pointer-events: none;
  white-space: nowrap;
  z-index: 0;
}
.fitin-physio-block__shell { position: relative; z-index: 1; }
.fitin-physio-block .fitin-h2 em { color: var(--ink); }
.fitin-physio-block .fitin-lead { color: var(--ink); }
.fitin-physio-block__details {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px 32px;
  margin: 36px 0;
  padding-top: 32px;
  border-top: 2px solid var(--ink);
}
.fitin-physio-block__detail-lbl {
  font-family: var(--font-mono);
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: rgba(10, 10, 11, 0.65);
  display: block;
  margin-bottom: 6px;
}
.fitin-physio-block__detail-val {
  font-size: 16px;
  font-weight: 500;
  color: var(--ink);
  letter-spacing: -0.01em;
}


/* ─────────── FAQ ─────────── */
.fitin-faq { max-width: 880px; margin: 0 auto; }
.fitin-faq__item {
  border-bottom: 1px solid var(--line);
  padding: 24px 0;
}
.fitin-faq__item:first-child { border-top: 1px solid var(--line); }
.fitin-faq__q {
  font-family: var(--font-sans);
  font-size: clamp(18px, 1.6vw, 22px);
  font-weight: 600;
  color: var(--ink);
  letter-spacing: -0.014em;
  cursor: pointer;
  list-style: none;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 24px;
  margin: 0;
  line-height: 1.3;
}
.fitin-faq__q::-webkit-details-marker { display: none; }
.fitin-faq__q::after {
  content: "+";
  font-family: var(--font-mono);
  font-weight: 400;
  font-size: 24px;
  color: var(--ink-mute);
  transition: transform 240ms var(--ease);
  flex-shrink: 0;
  line-height: 1;
}
.fitin-faq__item[open] .fitin-faq__q::after { content: "\2013"; }
.fitin-faq__a {
  margin-top: 16px;
  color: var(--ink-mute);
  font-size: 16px;
  line-height: 1.65;
  max-width: 70ch;
}
.fitin-faq__a p:not(:last-child) { margin-bottom: 12px; }

/* ─────────── FORM ─────────── */
.fitin-form { max-width: 720px; margin: 0 auto; }
.fitin-form__row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin-bottom: 16px;
}
@media (max-width: 600px) { .fitin-form__row { grid-template-columns: 1fr; } }
.fitin-form__field { display: flex; flex-direction: column; gap: 6px; margin-bottom: 16px; }
.fitin-form__field label {
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink-mute);
}
.fitin-form__field input,
.fitin-form__field select,
.fitin-form__field textarea {
  font-family: var(--font-sans);
  font-size: 16px;
  color: var(--ink);
  background: var(--paper-elev);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  padding: 14px 16px;
  width: 100%;
  transition: border-color 240ms;
}
.fitin-form__field input:focus,
.fitin-form__field select:focus,
.fitin-form__field textarea:focus {
  outline: none;
  border-color: var(--ink);
}
.fitin-form__field textarea { resize: vertical; min-height: 140px; }

.fitin-form__radios {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
}
@media (max-width: 600px) { .fitin-form__radios { grid-template-columns: 1fr; } }
.fitin-form__radio {
  position: relative;
  cursor: pointer;
}
.fitin-form__radio input { position: absolute; opacity: 0; }
.fitin-form__radio span {
  display: block;
  padding: 18px 16px;
  text-align: center;
  border: 1.5px solid var(--line);
  border-radius: var(--r-sm);
  font-family: var(--font-mono);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--ink);
  background: var(--paper-elev);
  transition: border-color 240ms, background 240ms;
}
.fitin-form__radio input:checked + span {
  border-color: var(--ink);
  background: var(--ink);
  color: var(--paper);
}
.fitin-form__radio:hover span { border-color: var(--ink); }

/* ─────────── FINAL CTA (Cream, signed) ─────────── */
.fitin-final-cta {
  background: var(--paper);
  padding: var(--section-y) 0;
  text-align: center;
  position: relative;
  overflow: hidden;
}
.fitin-final-cta::after {
  content: "FITIN";
  position: absolute;
  bottom: -120px;
  left: 50%;
  transform: translateX(-50%);
  font-family: var(--font-sans);
  font-weight: 900;
  font-size: clamp(280px, 40vw, 580px);
  letter-spacing: -0.06em;
  color: rgba(10, 10, 11, 0.025);
  line-height: 1;
  pointer-events: none;
  z-index: 0;
}
.fitin-final-cta__shell { position: relative; z-index: 1; }

.fitin-final-cta__idx {
  display: flex; align-items: center; justify-content: center;
  gap: 16px;
  margin-bottom: 48px;
}
.fitin-final-cta__idx-bar { width: 56px; height: 2px; background: var(--ink); }

.fitin-final-cta h2 {
  margin: 0 auto 32px;
  max-width: 16ch;
}
.fitin-final-cta h2 em { color: var(--accent); font-style: normal; }
.page-mitgliedschaft .fitin-final-cta h2 em { color: var(--premium); }
.page-physio .fitin-final-cta h2 em { color: var(--physio-deep); }

.fitin-final-cta p {
  max-width: 52ch;
  margin: 0 auto 56px;
  font-size: clamp(17px, 1.3vw, 20px);
  line-height: 1.55;
  color: var(--ink-mute);
}
.fitin-final-cta__ctas {
  display: flex; gap: 12px; justify-content: center; flex-wrap: wrap;
}
.fitin-final-cta__sig {
  margin-top: 96px;
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--ink-mute);
  font-weight: 500;
}
.fitin-final-cta__sig strong { color: var(--ink); font-weight: 600; }

/* ─────────── FOOTER ─────────── */
.fitin-footer {
  background: var(--ink);
  color: var(--paper);
  padding: 96px 0 40px;
  position: relative;
  overflow: hidden;
}
.fitin-footer__top {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1fr;
  gap: 64px;
  padding-bottom: 64px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}
@media (max-width: 980px) { .fitin-footer__top { grid-template-columns: 1fr 1fr; gap: 48px; } }
@media (max-width: 600px) { .fitin-footer__top { grid-template-columns: 1fr; gap: 40px; } }

.fitin-footer__brand {
  font-family: var(--font-display);
  font-size: clamp(56px, 8vw, 120px);
  font-weight: 700;
  letter-spacing: -0.05em;
  color: var(--paper);
  line-height: 0.85;
  margin: 0 0 16px 0;
  display: inline-block;
}
.fitin-footer__brand .n { color: var(--premium); }
.fitin-footer__brand .reg {
  font-size: 0.3em;
  font-weight: 600;
  margin-left: 0.04em;
  vertical-align: top;
  position: relative;
  top: 0.1em;
  color: rgba(246, 245, 241, 0.55);
}
.fitin-footer__tag {
  font-family: var(--font-mono);
  font-size: 12px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: rgba(246, 245, 241, 0.7);
  max-width: 32ch;
  line-height: 1.55;
  margin: 12px 0 0 0;
}
.fitin-footer__col h5 {
  font-family: var(--font-mono);
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: rgba(246, 245, 241, 0.45);
  margin: 0 0 24px 0;
}
.fitin-footer__col ul {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin: 0; padding: 0;
}
.fitin-footer__col a {
  font-size: 15px;
  color: rgba(246, 245, 241, 0.9);
  font-weight: 500;
  transition: color 200ms;
  letter-spacing: -0.01em;
  text-decoration: none;
}
.fitin-footer__col a:hover { color: var(--premium); }
.fitin-footer__bottom {
  margin-top: 32px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 16px;
  font-family: var(--font-mono);
  font-size: 10px;
  color: rgba(246, 245, 241, 0.5);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  font-weight: 500;
}
.fitin-footer__legal {
  display: flex; gap: 24px; flex-wrap: wrap;
  list-style: none; margin: 0; padding: 0;
}
.fitin-footer__legal a { color: rgba(246, 245, 241, 0.5); text-decoration: none; }
.fitin-footer__legal a:hover { color: var(--premium); }

/* ── FITIN sticky action bar — Editorial Glass / Segmented Rail ─────────
   Mobile-first. Dark translucent glass over paper; accents only as dots,
   a hairline and a small price chip. Visible state keys off
   .fitin-stickybar.is-show (toggled by the external scroll handler). */

.fitin-stickybar{
  position:fixed; bottom:0; left:0; right:0; z-index:80;
  padding:8px 10px calc(8px + env(safe-area-inset-bottom));
  background:rgba(62,62,62,.86);
  border-top:1px solid rgba(212,208,197,.14);
  -webkit-backdrop-filter:blur(14px) saturate(1.3);
  backdrop-filter:blur(14px) saturate(1.3);
  box-shadow:0 -6px 22px rgba(0,0,0,.16);
  transform:translateY(100%); opacity:0; pointer-events:none;
  transition:transform 420ms var(--ease), opacity 320ms var(--ease);
}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .fitin-stickybar{ background:rgba(62,62,62,.97); }
}
.fitin-stickybar.is-show{ transform:translateY(0); opacity:1; pointer-events:auto; }

/* one tidy unit: a 2px-cornered container divided only by hairlines */
.fitin-stickybar__shell{
  max-width:1180px; margin:0 auto;
  border:1px solid rgba(246,245,241,.14);
  border-radius:var(--r-sm);
  display:grid;
  grid-template-columns:1fr 1fr;
  grid-template-areas:
    "lead   lead"
    "physio tel";
}

/* shared ghost item */
.fitin-stickybar__item{
  position:relative;
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  min-height:50px; padding:11px 10px;
  font-family:var(--font-sans); font-size:13px; font-weight:600;
  letter-spacing:-.01em; line-height:1;
  text-decoration:none; background:transparent; color:var(--paper-soft);
  border:0; cursor:pointer; white-space:nowrap;
  -webkit-tap-highlight-color:transparent;
  transition:background 180ms var(--ease), color 180ms var(--ease);
}
.fitin-stickybar__item:hover,
.fitin-stickybar__item:focus-visible{ background:rgba(246,245,241,.06); color:var(--paper-elev); }
.fitin-stickybar__item:focus-visible{ outline:none; box-shadow:inset 0 0 0 1px rgba(246,245,241,.55); }
.fitin-stickybar__ico{ flex:none; opacity:.92; }

/* the ONE emphasis — Probetraining as a quiet paper ghost-fill (not a slab) */
.fitin-stickybar__item--lead{
  grid-area:lead;
  color:var(--paper-elev); font-weight:700;
  background:rgba(246,245,241,.10);
  box-shadow:inset 0 0 0 1px rgba(246,245,241,.16);
}
.fitin-stickybar__item--lead:hover,
.fitin-stickybar__item--lead:focus-visible{
  background:rgba(246,245,241,.15);
  box-shadow:inset 0 0 0 1px rgba(246,245,241,.28);
}
.fitin-stickybar__arr{ font-size:14px; line-height:1; opacity:.55; transition:transform 200ms var(--ease); }
.fitin-stickybar__item--lead:hover .fitin-stickybar__arr{ transform:translateX(2px); opacity:.85; }

/* utility row */
.fitin-stickybar__physio{
  grid-area:physio; position:relative; display:flex;
  border-top:1px solid rgba(246,245,241,.12);
}
.fitin-stickybar__item--physio{ width:100%; padding-right:26px; }
.fitin-stickybar__item--tel{
  grid-area:tel;
  border-top:1px solid rgba(246,245,241,.12);
  border-left:1px solid rgba(246,245,241,.12);
}

/* brand accents — dots only */
.fitin-stickybar__dot{ width:7px; height:7px; border-radius:50%; flex:none; display:inline-block; }
.fitin-stickybar__dot--physio{ background:var(--physio); }

/* label swap + caret */
.fitin-stickybar__lbl--short{ display:none; }
.fitin-stickybar__caret{
  position:absolute; top:50%; right:9px; transform:translateY(-50%);
  opacity:.5; transition:transform 200ms var(--ease), opacity 200ms var(--ease);
}
.fitin-stickybar__item--physio[aria-expanded="true"]{ background:rgba(246,245,241,.06); color:var(--paper-elev); }
.fitin-stickybar__item--physio[aria-expanded="true"] .fitin-stickybar__caret{ transform:translateY(-50%) rotate(180deg); opacity:.9; }


/* ── upward glass popover / sheet ─────────────────────────────────── */
.fitin-stickybar__pop{
  position:absolute; bottom:calc(100% + 10px); left:0;
  width:min(280px, calc(100vw - 24px));
  background:rgba(62,62,62,.94);
  -webkit-backdrop-filter:blur(16px) saturate(1.3);
  backdrop-filter:blur(16px) saturate(1.3);
  border:1px solid rgba(212,208,197,.18);
  border-radius:var(--r-md);
  box-shadow:0 12px 34px rgba(0,0,0,.30);
  padding:6px; z-index:2;
  opacity:0; transform:translateY(6px); pointer-events:none;
  transition:opacity 180ms var(--ease), transform 220ms var(--ease);
}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .fitin-stickybar__pop{ background:rgba(54,54,54,.99); }
}
.fitin-stickybar__pop[hidden]{ display:none; }
.fitin-stickybar__pop.is-open{ opacity:1; transform:translateY(0); pointer-events:auto; }
.fitin-stickybar__pop::after{
  content:""; position:absolute; top:100%; left:22px;
  border:7px solid transparent; border-top-color:rgba(62,62,62,.94);
}
.fitin-stickybar__pop-head{
  margin:4px 8px 8px; padding:0 0 8px;
  font-family:var(--font-mono); font-size:10px; font-weight:600;
  letter-spacing:.06em; text-transform:uppercase; color:var(--ink-low);
  border-bottom:1px solid rgba(212,208,197,.14);
}
.fitin-stickybar__pop-item{
  display:flex; align-items:center; gap:10px;
  padding:13px 10px; min-height:48px; border-radius:var(--r-sm);
  font-family:var(--font-sans); font-size:14px; font-weight:600; letter-spacing:-.01em;
  color:var(--paper-soft); text-decoration:none;
  transition:background 150ms var(--ease), color 150ms var(--ease);
}
.fitin-stickybar__pop-item:hover,
.fitin-stickybar__pop-item:focus-visible{ background:rgba(246,245,241,.07); color:var(--paper-elev); outline:none; }
.fitin-stickybar__pop-item:focus-visible{ box-shadow:inset 0 0 0 1px rgba(246,196,67,.55); }
.fitin-stickybar__pop-name{ flex:1 1 auto; }
.fitin-stickybar__ext{ opacity:.5; flex:none; }

/* ── pulse keyframes (desktop CTAs) ────────────────────────────────── */
@keyframes sb-pulse-blue{ 0%,100%{ box-shadow:0 0 0 0 rgba(0,174,239,0); } 50%{ box-shadow:0 0 8px 0 rgba(0,174,239,.30); } }
@keyframes sb-pulse-gold{ 0%,100%{ box-shadow:0 0 0 0 rgba(246,196,67,0); } 50%{ box-shadow:0 0 8px 0 rgba(246,196,67,.34); } }

/* ── MOBILE (<720px): Sticky-Bar komplett ausblenden — nur Desktop ──── */
@media (max-width:719px){ .fitin-stickybar{ display:none !important; } }

/* ── narrow phones (≤480px): collapse the ticker, swap to short labels ─ */
@media (max-width:480px){
  .fitin-stickybar__lbl--full{ display:none; }
  .fitin-stickybar__lbl--short{ display:inline; }
}

/* ── tablet / desktop (≥720px): hug-content segmented rail in one row ── */
@media (min-width:720px){
  .fitin-stickybar{ padding:10px 16px calc(10px + env(safe-area-inset-bottom)); }
  .fitin-stickybar__shell{
    width:min(580px, calc(100vw - 32px)); max-width:none; margin:0 auto;
    display:flex; align-items:stretch;
    grid-template-columns:none;
  }
  .fitin-stickybar__item--lead,
  .fitin-stickybar__physio,
  .fitin-stickybar__item--tel{ flex:1 1 0; }
  .fitin-stickybar__item{ min-height:46px; padding:12px 22px; font-size:13.5px; }
  .fitin-stickybar__item--lead{ padding:12px 22px; }
  .fitin-stickybar__physio{ border-top:0; }
  .fitin-stickybar__item--physio{ padding-right:38px; }
  .fitin-stickybar__caret{ right:16px; }
  .fitin-stickybar__item--tel{ border-top:0; border-left:1px solid rgba(246,245,241,.12); }
  .fitin-stickybar__lbl--full{ display:inline; }
  .fitin-stickybar__lbl--short{ display:none; }
  .fitin-stickybar__pop{ left:auto; right:0; }
  .fitin-stickybar__pop::after{ left:auto; right:22px; }
}

/* ── DESKTOP (>=720px): kraeftige, gebrandete CTAs + Aktion wie oben ── */
@media (min-width:720px){
  .fitin-stickybar__item--lead{
    background:var(--premium); color:var(--paper);
    box-shadow:none; animation:sb-pulse-blue 2.6s ease-in-out infinite;
  }
  .fitin-stickybar__item--lead:hover,
  .fitin-stickybar__item--lead:focus-visible{ background:var(--premium-deep); }
  .fitin-stickybar__item--lead .fitin-stickybar__arr{ opacity:.9; }

  .fitin-stickybar__item--physio{
    background:var(--physio); color:var(--ink);
    animation:sb-pulse-gold 2.6s ease-in-out infinite;
  }
  .fitin-stickybar__item--physio:hover,
  .fitin-stickybar__item--physio[aria-expanded="true"]{ background:var(--physio-deep); }
  .fitin-stickybar__item--physio .fitin-stickybar__dot--physio{ display:none; }
}

@media (prefers-reduced-motion:reduce){
  .fitin-stickybar,
  .fitin-stickybar__pop,
  .fitin-stickybar__caret,
  .fitin-stickybar__item,
  .fitin-stickybar__arr{ transition:none; }
  .fitin-stickybar__item--lead,
  .fitin-stickybar__item--physio{ animation:none; }
}

/* ─────────── REVEAL ANIMATION ─────────── */
.fade-up {
  opacity: 0;
  transform: translateY(32px);
  transition: opacity 900ms var(--ease), transform 900ms var(--ease);
}
.fade-up.in { opacity: 1; transform: translateY(0); }
.d1 { transition-delay: 100ms; }
.d2 { transition-delay: 200ms; }
.d3 { transition-delay: 300ms; }
.d4 { transition-delay: 400ms; }

@media (prefers-reduced-motion: reduce) {
  .fade-up, .fade-up.in { transition: none; opacity: 1; transform: none; }
  .fitin-marquee__track { animation: none; }
}

/* ─────────── HELPERS ─────────── */
.fitin-hide-mobile { display: inline-flex; }
.fitin-hide-desktop { display: none; }
@media (max-width: 720px) {
  .fitin-hide-mobile { display: none; }
  .fitin-hide-desktop { display: inline-flex; }
}

/* WP overrides */
.wp-site-blocks { padding: 0 !important; }
.wp-block-group { box-sizing: border-box; }
/* Hinweis: padding-top wird von body.has-announcement gesetzt (siehe unten). */


/* ═══════════════════════════════════════════════════════════════
   v2.1.0 — Announcement / Newsletter / Social / Drawer /
   Side-Pillar / Sale / Trust / Community
   ═══════════════════════════════════════════════════════════════ */

/* ─────────── A11y Utility ─────────── */
.visually-hidden {
  position: absolute !important;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* ─────────── Announcement Bar (Top of Header) ─────────── */
/* Höhe der Announcement-Bar — wird gleichzeitig für Header-Top-Offset
   und Body-Padding-Top genutzt, wenn die Bar sichtbar ist (body.has-announcement). */
:root { --announce-h: 44px; }

.fitin-announcement-bar {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 100;
  background: var(--ink);
  color: var(--paper);
  font-family: var(--font-sans);
  font-size: 13px;
  line-height: 1.4;
  border-bottom: 1px solid rgba(255,255,255,0.06);
  /* Exakte Höhe = Header-Offset → kein heller Spalt, kein Durchscheinen beim Scrollen. */
  height: var(--announce-h);
  display: flex;
  align-items: center;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.4s var(--ease);
}
.fitin-announcement-bar.is-show { max-height: var(--announce-h); }
.fitin-announcement-bar.is-dismissed { display: none; }

/* Header rutscht unter die Bar, wenn diese sichtbar ist. */
body.has-announcement .fitin-site-header { top: var(--announce-h); }
/* Content (alle Pages) wird um die Bar-Höhe nach unten geschoben, damit
   nichts unter der opaquen schwarzen Bar verschwindet. */
body.has-announcement > .wp-site-blocks { padding-top: var(--announce-h) !important; }

.fitin-announcement-bar__inner {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 16px;
  /* Nur vertikal — seitliche Polsterung kommt von .fitin-shell (sonst klebt's am Rand). */
  padding-top: 8px;
  padding-bottom: 8px;
  flex-wrap: nowrap;
}

.fitin-announcement-bar__dot {
  flex-shrink: 0;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--action);
  animation: fitinDotPulse 1.6s ease-in-out infinite;
}
@keyframes fitinDotPulse {
  0%, 100% { transform: scale(1);   opacity: 1;   }
  50%      { transform: scale(1.4); opacity: 0.6; }
}

.fitin-announcement-bar__text {
  flex: 1 1 auto;
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}
.fitin-announcement-bar__text .fitin-mono { color: var(--action); font-weight: 600; }

.fitin-announcement-bar__msg {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.fitin-announcement-bar__msg s { color: var(--ink-low); margin-right: 4px; }

.fitin-announcement-bar__cta {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--ink);
  background: var(--action);
  text-decoration: none;
  font-weight: 600;
  font-size: 13px;
  padding: 4px 12px;
  border: 1px solid var(--action);
  border-radius: 2px;
  transition: background 0.2s var(--ease), border-color 0.2s var(--ease), color 0.2s var(--ease);
}
.fitin-announcement-bar__cta:hover {
  background: transparent;
  color: var(--action);
  border-color: var(--action);
}
.fitin-announcement-bar__cta .arr { transition: transform 0.2s var(--ease); }
.fitin-announcement-bar__cta:hover .arr { transform: translateX(2px); }

.fitin-announcement-bar__close {
  flex-shrink: 0;
  background: none;
  border: none;
  color: var(--ink-low);
  font-size: 20px;
  line-height: 1;
  cursor: pointer;
  padding: 2px 6px;
  transition: color 0.2s var(--ease);
}
.fitin-announcement-bar__close:hover { color: var(--paper); }

@media (max-width: 720px) {
  /* Mehr Höhe → Punkt + voller Text + Sichern-Button passen sauber (2 Zeilen), nichts abgeschnitten. */
  :root { --announce-h: 60px; }
  .fitin-announcement-bar__inner { gap: 10px; }
  .fitin-announcement-bar__msg { white-space: normal; line-height: 1.3; }
  /* Platz für den Button: das Wort „Aktion" entfällt — der pulsierende Punkt signalisiert es. */
  .fitin-announcement-bar__text .fitin-mono { display: none; }
  .fitin-announcement-bar__cta { padding: 5px 11px; font-size: 12px; }
}

/* ─────────── Stay Close (Newsletter + Social — konsolidiert) ─────────── */
.fitin-footer-stayclose {
  background: var(--ink);
  color: var(--paper);
  padding: 96px 0;
}
.fitin-footer-stayclose__shell {
  max-width: 720px;
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: 32px;
}
.fitin-footer-stayclose__head { display: flex; flex-direction: column; gap: 16px; }
.fitin-footer-stayclose__title {
  font-family: var(--font-sans);
  font-size: clamp(48px, 6vw, 88px);
  font-weight: 700;
  letter-spacing: -.034em;
  line-height: .96;
  margin: 0;
  color: var(--paper);
}
.fitin-footer-stayclose__title em {
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 400;
  color: var(--easy);
}
.fitin-footer-stayclose__lead {
  font-size: 15px;
  line-height: 1.6;
  color: rgba(246,245,241,.7);
  max-width: 56ch;
  margin: 0 auto;
}
.fitin-footer-stayclose__field {
  display: flex;
  gap: 0;
  max-width: 520px;
  margin: 0 auto;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.18);
  border-radius: var(--r-sm);
  overflow: hidden;
  transition: border-color 240ms;
}
.fitin-footer-stayclose__field:focus-within { border-color: var(--easy); }
.fitin-footer-stayclose__field input {
  flex: 1;
  padding: 18px 22px;
  background: transparent;
  border: none;
  color: var(--paper);
  font-family: var(--font-sans);
  font-size: 15px;
}
.fitin-footer-stayclose__field input::placeholder { color: rgba(246,245,241,.4); }
.fitin-footer-stayclose__field input:focus { outline: none; }
.fitin-footer-stayclose__submit {
  background: var(--paper);
  color: var(--ink);
  border: none;
  padding: 0 28px;
  font-family: var(--font-sans);
  font-size: 14px;
  font-weight: 600;
  letter-spacing: -.012em;
  cursor: pointer;
  transition: background 200ms;
}
.fitin-footer-stayclose__submit:hover { background: var(--easy); }
.fitin-footer-stayclose__hint {
  font-size: 12px;
  color: rgba(246,245,241,.4);
  max-width: 520px;
  margin: 12px auto 0;
}
.fitin-footer-stayclose__hint a { color: rgba(246,245,241,.7); text-decoration: underline; }
.fitin-footer-stayclose__divider {
  width: 32px; height: 1px;
  background: rgba(255,255,255,.2);
  margin: 8px auto;
}
.fitin-footer-stayclose__social {
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: center;
}
.fitin-footer-stayclose__social-links {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  justify-content: center;
}
.fitin-footer-stayclose__social-links a {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 12px 18px;
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.15);
  border-radius: var(--r-sm);
  color: var(--paper);
  text-decoration: none;
  transition: background 200ms, border-color 200ms;
  font-family: var(--font-sans);
  font-size: 14px;
  font-weight: 600;
}
.fitin-footer-stayclose__social-links a:hover {
  background: rgba(255,255,255,.1);
  border-color: var(--easy);
}
.fitin-footer-stayclose__social-links em {
  font-style: normal;
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: .04em;
  color: rgba(246,245,241,.5);
  font-weight: 500;
}
@media (max-width: 600px) {
  .fitin-footer-stayclose { padding: 64px 0; }
  .fitin-footer-stayclose__field { flex-direction: column; background: transparent; border: none; }
  .fitin-footer-stayclose__field input {
    background: rgba(255,255,255,.06);
    border: 1px solid rgba(255,255,255,.18);
    border-radius: var(--r-sm);
  }
  .fitin-footer-stayclose__submit {
    width: 100%; padding: 16px;
    border-radius: var(--r-sm);
    margin-top: 8px;
  }
  .fitin-footer-stayclose__social-links a em { display: none; }
}

/* ─────────── Newsletter (3-State Container) ─────────── */
.fitin-newsletter {
  position: fixed;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  z-index: 95;
  pointer-events: none;
  display: flex;
  justify-content: flex-end;
}
.fitin-newsletter[data-state="show"] .fitin-newsletter__drawer {
  display: flex; pointer-events: auto;
  animation: drawerIn 480ms cubic-bezier(.2,.7,.3,1);
}
.fitin-newsletter[data-state="show"] .fitin-newsletter__pill { display: none; }
.fitin-newsletter[data-state="mini"] .fitin-newsletter__drawer { display: none; }
.fitin-newsletter[data-state="mini"] .fitin-newsletter__pill {
  display: inline-flex; pointer-events: auto;
  animation: pillIn 320ms cubic-bezier(.2,.7,.3,1);
}
.fitin-newsletter[data-state="hidden"] { display: none; }

@keyframes drawerIn {
  from { transform: translateX(112%); opacity: 0; }
  to { transform: translateX(0); opacity: 1; }
}
@keyframes pillIn {
  from { transform: translateX(108%); opacity: 0; }
  to { transform: translateX(0); opacity: 1; }
}

.fitin-newsletter__drawer {
  display: none;
  flex-direction: column;
  width: min(400px, calc(100vw - 32px));
  margin-right: 16px;
  max-height: calc(100vh - 32px);
  background: var(--ink);
  color: var(--paper);
  border-radius: var(--r-md);
  box-shadow: 0 32px 64px -12px rgba(0,0,0,.32), 0 12px 32px -8px rgba(0,0,0,.18);
  overflow: hidden auto;
  position: relative;
}
.fitin-newsletter__close {
  position: absolute;
  top: 12px; right: 12px;
  width: 28px; height: 28px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.16);
  color: var(--paper);
  border-radius: 50%;
  cursor: pointer;
  font-size: 18px; line-height: 1;
  display: flex; align-items: center; justify-content: center;
  transition: background 200ms;
  z-index: 2;
}
.fitin-newsletter__close:hover { background: rgba(255,255,255,.16); }
.fitin-newsletter__visual {
  background: linear-gradient(135deg, rgba(152,201,60,.14), rgba(0,174,239,.06));
  padding: 32px 28px 20px;
  border-bottom: 1px solid rgba(255,255,255,.08);
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.fitin-newsletter__visual-mark {
  font-family: var(--font-sans);
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -.02em;
  color: var(--paper);
}
.fitin-newsletter__visual-mark .n { color: var(--premium); }
.fitin-newsletter__body {
  padding: 24px 28px 28px;
  display: flex; flex-direction: column; gap: 16px;
}
.fitin-newsletter__title {
  font-family: var(--font-sans);
  font-size: 28px;
  font-weight: 700;
  letter-spacing: -.024em;
  line-height: 1.02;
  margin: 0;
  color: var(--paper);
}
.fitin-newsletter__title em {
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 400;
  color: var(--easy);
}
.fitin-newsletter__benefits {
  list-style: none; margin: 0; padding: 0;
  display: flex; flex-direction: column; gap: 8px;
}
.fitin-newsletter__benefits li {
  display: flex; align-items: baseline; gap: 12px;
  font-size: 13px; color: rgba(246,245,241,.78);
  line-height: 1.5;
}
.fitin-newsletter__benefits li span {
  font-family: var(--font-mono);
  font-size: 10px; font-weight: 600;
  letter-spacing: .12em;
  color: var(--easy);
}
.fitin-newsletter__form {
  display: flex; flex-direction: column; gap: 8px;
  margin-top: 4px;
}
.fitin-newsletter__form input {
  padding: 14px 16px;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.18);
  border-radius: var(--r-sm);
  color: var(--paper);
  font-family: var(--font-sans); font-size: 14px;
  transition: border-color 200ms;
}
.fitin-newsletter__form input::placeholder { color: rgba(246,245,241,.4); }
.fitin-newsletter__form input:focus { outline: none; border-color: var(--easy); background: rgba(255,255,255,.1); }
.fitin-newsletter__submit {
  background: var(--paper); color: var(--ink);
  border: none;
  padding: 14px 20px;
  border-radius: var(--r-sm);
  font-family: var(--font-sans);
  font-size: 14px; font-weight: 600;
  letter-spacing: -.012em;
  cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  transition: background 200ms;
}
.fitin-newsletter__submit:hover { background: var(--easy); }
.fitin-newsletter__pass {
  background: transparent; border: none;
  color: rgba(246,245,241,.4);
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: .08em;
  text-transform: uppercase;
  cursor: pointer;
  padding: 4px 0; margin-top: 4px;
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-color: rgba(255,255,255,.18);
}
.fitin-newsletter__pass:hover { color: rgba(246,245,241,.8); }

/* MINI-PILL */
/* Mini-Zustand: vertikaler Tab am rechten Rand (kollidiert nicht mit Sticky-Bars). */
.fitin-newsletter__pill {
  display: none;
  flex-direction: column;
  align-items: center;
  gap: 9px;
  padding: 16px 8px;
  background: var(--ink);
  color: var(--paper);
  border: 1px solid rgba(255,255,255,.15);
  border-right: none;
  border-radius: 12px 0 0 12px;
  cursor: pointer;
  box-shadow: -8px 0 24px -10px rgba(0,0,0,.32);
  transition: transform 200ms, background 200ms, border-color 200ms;
}
.fitin-newsletter__pill:hover {
  transform: translateX(-3px);
  background: var(--ink-soft);
  border-color: var(--easy);
}
.fitin-newsletter__pill svg { color: var(--easy); }
/* Label vertikal stellen */
.fitin-newsletter__pill > span:not(.fitin-newsletter__pill-close) {
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  font-family: var(--font-mono);
  font-size: 11px; font-weight: 600;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.fitin-newsletter__pill-close {
  display: inline-flex; align-items: center; justify-content: center;
  width: 22px; height: 22px;
  background: rgba(255,255,255,.08);
  border-radius: 50%;
  color: rgba(246,245,241,.6);
  font-size: 14px; line-height: 1;
  margin-left: 4px;
  cursor: pointer;
  transition: background 180ms;
}
.fitin-newsletter__pill-close:hover { background: rgba(255,255,255,.18); color: var(--paper); }

@media (max-width: 600px) {
  /* Tab + Drawer bleiben rechts mittig — frei von Sticky-Bar/Bookbar unten. */
  .fitin-newsletter__drawer { width: min(340px, calc(100vw - 22px)); margin-right: 10px; }
  .fitin-newsletter__pill { padding: 13px 6px; gap: 7px; }
}

/* ─────────── Sale Tag (Reusable Pill) ─────────── */
.fitin-sale-tag {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 10px;
  background: var(--action);
  color: var(--ink);
  border-radius: 999px;
  font-family: var(--font-mono);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  line-height: 1;
  white-space: nowrap;
}
.fitin-sale-tag::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--ink);
}
.fitin-sale-tag--ink {
  background: var(--ink);
  color: var(--action);
}
.fitin-sale-tag--ink::before { background: var(--action); }

/* ─────────── Hero Sale Bar (Below H1) ─────────── */
.fitin-hero__sale {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  margin: 24px 0 0;
  padding: 10px 18px;
  background: var(--action);
  color: var(--ink);
  border-radius: 3px;
  font-family: var(--font-sans);
  font-size: 14px;
  font-weight: 500;
  letter-spacing: -0.005em;
  max-width: fit-content;
}
.fitin-hero__sale-label {
  font-family: var(--font-mono);
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  padding: 4px 8px;
  background: var(--ink);
  color: var(--action);
  border-radius: 2px;
}
.fitin-hero__sale-dot {
  flex-shrink: 0;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--ink);
  animation: fitinDotPulse 1.6s ease-in-out infinite;
}
.fitin-hero__sale-text s {
  color: var(--ink-soft);
  opacity: 0.55;
  margin-right: 4px;
}

@media (max-width: 600px) {
  .fitin-hero__sale {
    font-size: 13px;
    flex-wrap: wrap;
    gap: 8px;
    padding: 8px 12px;
  }
  .fitin-hero__sale-label { font-size: 9px; }
}

/* ─────────── Trust Block (Google Reviews Slot) ─────────── */
.fitin-trust {
  /* Paper-Soft als sanfter Auslauf vor dem schwarzen CTA-Final.
     Cluster mit Community (paper) + Apps (paper) davor. */
  background: var(--paper-soft);
  padding: var(--section-y) 0;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.fitin-trust__shell {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 64px;
  display: grid;
  grid-template-columns: 1fr 2fr;
  gap: 64px;
  align-items: center;
}
@media (max-width: 980px) {
  .fitin-trust__shell {
    grid-template-columns: 1fr;
    padding: 0 32px;
    gap: 40px;
  }
}
@media (max-width: 600px) {
  .fitin-trust__shell { padding: 0 22px; }
}

.fitin-trust__rating {
  text-align: left;
}
.fitin-trust__stars {
  display: inline-flex;
  gap: 4px;
  margin-bottom: 16px;
}
.fitin-trust__stars svg {
  width: 22px;
  height: 22px;
  fill: var(--star);
}

.fitin-trust__score {
  font-family: var(--font-sans);
  font-size: clamp(48px, 5vw, 72px);
  font-weight: 500;
  line-height: 1;
  letter-spacing: -0.025em;
  color: var(--ink);
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
}
.fitin-trust__score-out {
  font-family: var(--font-mono);
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.04em;
  color: var(--ink-low);
}

.fitin-trust__count {
  font-family: var(--font-mono);
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--ink-mute);
  margin-top: 12px;
  display: block;
}

.fitin-trust__google-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 18px;
  color: var(--ink);
  text-decoration: none;
  font-size: 13px;
  font-weight: 500;
  border-bottom: 1px solid var(--line-strong);
  padding-bottom: 2px;
  transition: border-color 0.2s var(--ease);
}
.fitin-trust__google-link:hover { border-color: var(--ink); }

.fitin-trust__quotes {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}
@media (max-width: 880px) {
  .fitin-trust__quotes { grid-template-columns: 1fr; gap: 14px; }
}

.fitin-trust__quote {
  /* Auf paper-soft Section: weiß als Card-Bg, damit Cards leuchten. */
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: 4px;
  padding: 24px 22px;
}
.fitin-trust__quote-stars {
  display: inline-flex;
  gap: 3px;
  margin-bottom: 12px;
}
.fitin-trust__quote-stars svg { width: 14px; height: 14px; fill: var(--star); }

.fitin-trust__quote-text {
  font-family: var(--font-sans);
  font-size: 14.5px;
  line-height: 1.55;
  color: var(--ink-soft);
  margin: 0 0 16px;
  font-style: italic;
}

.fitin-trust__quote-author {
  font-family: var(--font-mono);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--ink-low);
}


.fitin-community__tile {
  position: relative;
  display: block;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  border-radius: 3px;
  background: var(--paper-soft);
}
.fitin-community__tile img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.6s var(--ease);
}
.fitin-community__tile:hover img { transform: scale(1.06); }

.fitin-community__tile::after {
  content: "↗";
  position: absolute;
  bottom: 10px;
  right: 10px;
  width: 28px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--ink);
  color: var(--paper);
  border-radius: 50%;
  font-size: 14px;
  font-family: var(--font-sans);
  opacity: 0;
  transform: translateY(6px);
  transition: opacity 0.25s var(--ease), transform 0.25s var(--ease);
}
.fitin-community__tile:hover::after { opacity: 1; transform: translateY(0); }



/* ═══════════════════════════════════════════════════════════════
   COMPARE TABLE (Easy/Premium Landing) — v2.2.0
   ═══════════════════════════════════════════════════════════════ */


/* ─────────── Compare Table ─────────── */
.fitin-compare {
  margin-top: 96px;
  max-width: 920px;
  margin-left: auto;
  margin-right: auto;
}
.fitin-compare h3 em {
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 400;
  color: var(--premium);
}
.fitin-compare__table {
  width: 100%;
  border-collapse: collapse;
  background: var(--paper-elev);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  overflow: hidden;
}
.fitin-compare__table th,
.fitin-compare__table td {
  padding: 16px 24px;
  text-align: left;
  font-size: 14px;
  border-bottom: 1px solid var(--line);
}
.fitin-compare__table th { background: var(--paper-soft); }
.fitin-compare__table th:nth-child(2),
.fitin-compare__table th:nth-child(3),
.fitin-compare__table td:nth-child(2),
.fitin-compare__table td:nth-child(3) {
  text-align: center;
  width: 130px;
  font-family: var(--font-mono);
  font-weight: 500;
}
.fitin-compare__table tbody tr:last-child th,
.fitin-compare__table tbody tr:last-child td { border-bottom: none; }
.fitin-compare__table tbody tr:nth-child(odd) td { background: rgba(0,0,0,.012); }
.fitin-compare__table td:nth-child(2) { color: var(--premium-deep); }
.fitin-compare__table td:nth-child(3) { color: var(--easy-deep); }
.fitin-compare__table td:nth-child(2):only-of-type,
.fitin-compare__table td:nth-child(3):only-of-type { color: inherit; }

@media (max-width: 720px) {
  .fitin-compare__table th,
  .fitin-compare__table td { padding: 12px 14px; font-size: 13px; }
  .fitin-compare__table th:nth-child(2),
  .fitin-compare__table th:nth-child(3),
  .fitin-compare__table td:nth-child(2),
  .fitin-compare__table td:nth-child(3) { width: 70px; }
}



/* ═══════════════════════════════════════════════════════════════
   v2.2.0 — Landing Pages (/premium/, /easy/)
   ═══════════════════════════════════════════════════════════════ */


/* ─────────── Landing Hero ─────────── */
.fitin-landing-hero {
  padding: 140px 0 96px;
  background: var(--paper);
  border-bottom: 2px solid var(--ink);
}
.fitin-landing-hero__shell {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 64px;
  align-items: center;
}
@media (max-width: 980px) {
  .fitin-landing-hero__shell { grid-template-columns: 1fr; gap: 32px; }
  .fitin-landing-hero { padding: 100px 0 64px; }
}
.fitin-landing-hero__copy {
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.fitin-landing-hero__sale {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  background: var(--easy);
  color: var(--ink);
  padding: 10px 14px;
  border-radius: var(--r-sm);
  align-self: flex-start;
  font-size: 13px;
  font-weight: 600;
}
.fitin-landing-hero__ctas {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}
.fitin-landing-hero__trust {
  display: flex;
  gap: 24px;
  flex-wrap: wrap;
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--ink-mute);
  letter-spacing: .08em;
  text-transform: uppercase;
  padding-top: 24px;
  border-top: 1px solid var(--line);
}
.fitin-landing-hero__visual img {
  width: 100%;
  height: auto;
  border-radius: var(--r-md);
}

/* ─────────── Benefits ─────────── */
.fitin-landing-benefits { padding: var(--section-y) 0; }
.fitin-landing-benefits h2 { margin-bottom: 56px; }
.fitin-landing-benefits__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}
@media (max-width: 980px) { .fitin-landing-benefits__grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 600px) { .fitin-landing-benefits__grid { grid-template-columns: 1fr; } }
.fitin-landing-benefit {
  background: var(--paper-elev);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  padding: 32px 28px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.fitin-landing-benefit h3 {
  font-family: var(--font-sans);
  font-size: 18px;
  font-weight: 600;
  margin: 0;
  letter-spacing: -.014em;
  color: var(--ink);
}
.fitin-landing-benefit p {
  font-size: 14px;
  color: var(--ink-mute);
  line-height: 1.6;
  margin: 0;
}

/* ─────────── Included ─────────── */
.fitin-landing-included {
  padding: var(--section-y) 0;
  background: var(--paper-soft);
}
.fitin-landing-included__head { margin-bottom: 56px; }
.fitin-landing-included__head .fitin-mono { display: block; margin-bottom: 12px; }
.fitin-landing-included__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px;
}
@media (max-width: 980px) { .fitin-landing-included__grid { grid-template-columns: 1fr; gap: 24px; } }
.fitin-landing-included__grid ul {
  list-style: none;
  margin: 0; padding: 0;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.fitin-landing-included__grid li {
  font-size: 15px;
  line-height: 1.6;
  color: var(--ink-soft);
  padding-bottom: 16px;
  border-bottom: 1px solid var(--line);
}
.fitin-landing-included__grid li:last-child { border-bottom: none; }
.fitin-landing-included__grid li strong {
  color: var(--ink);
  display: block;
  margin-bottom: 4px;
  font-weight: 500;
}

/* ─────────── Pricing ─────────── */
.fitin-landing-pricing { padding: var(--section-y) 0; }
.fitin-landing-pricing__head {
  text-align: center;
  margin-bottom: 56px;
}
.fitin-landing-pricing__head .fitin-mono,
.fitin-landing-pricing__head h2,
.fitin-landing-pricing__head p { display: block; }
.fitin-landing-pricing__head .fitin-lead {
  margin: 16px auto 0;
  max-width: 56ch;
}
.fitin-landing-pricing__tiers {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  max-width: 880px;
  margin: 0 auto;
}
@media (max-width: 980px) { .fitin-landing-pricing__tiers { grid-template-columns: 1fr 1fr; } }
@media (max-width: 480px) { .fitin-landing-pricing__tiers { grid-template-columns: 1fr; } }
/* 3-Tarif-Variante (Easy: 3/6/12) — eigene Breakpoints statt Inline-Style,
   damit das Grid auf Mobile sauber umbricht (Inline-Style schlug Media Queries). */
.fitin-landing-pricing__tiers--3 { grid-template-columns: repeat(3, 1fr); max-width: 680px; }
@media (max-width: 760px) { .fitin-landing-pricing__tiers--3 { grid-template-columns: 1fr 1fr; } }
@media (max-width: 480px) { .fitin-landing-pricing__tiers--3 { grid-template-columns: 1fr; } }
.fitin-landing-pricing__tier {
  background: var(--paper-elev);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  padding: 28px 22px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: flex-start;
  position: relative;
}
.fitin-landing-pricing__tier strong {
  font-family: var(--font-sans);
  font-size: clamp(28px, 3vw, 40px);
  font-weight: 700;
  letter-spacing: -.024em;
  color: var(--ink);
}
.fitin-landing-pricing__tier em {
  font-family: var(--font-mono);
  font-style: normal;
  font-size: 11px;
  color: var(--ink-mute);
  letter-spacing: .04em;
}
.fitin-landing-pricing__tier--featured {
  border-color: var(--premium);
  border-width: 2px;
  padding: 27px 21px;
}
.fitin-landing-pricing__badge {
  position: absolute;
  top: -10px;
  left: 50%;
  transform: translateX(-50%);
  background: var(--premium);
  color: var(--ink);
  padding: 4px 10px;
  font-family: var(--font-mono);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  border-radius: 2px;
  white-space: nowrap;
}
.fitin-landing-pricing__note {
  text-align: center;
  margin-top: 32px;
  font-size: 14px;
  color: var(--ink-mute);
}
.fitin-landing-pricing__note a {
  color: var(--ink);
  text-decoration: underline;
  font-weight: 500;
}

/* ─────────── Compare (auf Landing-Page = dunkel) ─────────── */
.fitin-landing-compare {
  padding: var(--section-y) 0;
  background: var(--ink);
  color: var(--paper);
}
.fitin-landing-compare h2 { color: var(--paper); }
.fitin-landing-compare h2 em {
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 400;
}
.fitin-landing-compare .fitin-lead { color: rgba(246,245,241,.7); }
.fitin-landing-compare .fitin-compare__table {
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.12);
  color: var(--paper);
}
.fitin-landing-compare .fitin-compare__table th,
.fitin-landing-compare .fitin-compare__table td {
  border-bottom-color: rgba(255,255,255,.08);
  color: rgba(246,245,241,.85);
}
.fitin-landing-compare .fitin-compare__table th { background: rgba(255,255,255,.05); color: var(--paper); }
.fitin-landing-compare .fitin-compare__table tbody tr:nth-child(odd) td { background: rgba(255,255,255,.02); }
.fitin-landing-compare .fitin-compare__table th.is-featured span { font-weight: 700; }

/* ─────────── Trust (auf Landing-Page = paper-soft Background) ─────────── */
.fitin-landing-trust {
  padding: var(--section-y) 0;
  background: var(--paper-soft);
}

/* ─────────── FAQ ─────────── */
.fitin-landing-faq {
  padding: var(--section-y) 0;
  background: var(--paper);
}
.fitin-landing-faq h2 { margin-bottom: 56px; }
.fitin-landing-faq h2 em {
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 400;
  color: var(--premium);
}
.fitin-faq {
  max-width: 720px;
  margin: 0 auto;
}
.fitin-faq__item {
  padding: 24px 0;
  border-bottom: 1px solid var(--line);
}
.fitin-faq__item summary {
  cursor: pointer;
  list-style: none;
  font-family: var(--font-sans);
  font-size: 17px;
  font-weight: 600;
  letter-spacing: -.014em;
  color: var(--ink);
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
}
.fitin-faq__item summary::-webkit-details-marker { display: none; }
.fitin-faq__item summary::after {
  content: "+";
  font-family: var(--font-mono);
  font-size: 22px;
  font-weight: 400;
  color: var(--ink-mute);
  transition: transform 240ms;
  flex-shrink: 0;
}
.fitin-faq__item[open] summary::after { content: "−"; }
.fitin-faq__item p {
  margin: 16px 0 0;
  font-size: 15px;
  line-height: 1.7;
  color: var(--ink-soft);
  max-width: 60ch;
}
.fitin-faq__item p a { color: var(--ink); text-decoration: underline; font-weight: 500; }

/* ═══════════════════════════════════════════════════════════════
   ABO-DETAILSEITEN — durchgehendes Brand-Theming (v2.3.0)
   Easy = Grün · Premium = Blau. Additive Ebene, scoped über Body-Klassen
   (.fitin-easy-landing / .fitin-premium-landing). Beeinflusst keine andere Seite.
   ═══════════════════════════════════════════════════════════════ */
.fitin-easy-landing    { --brand: var(--easy);    --brand-deep: var(--easy-deep);    --brand-tint: var(--easy-tint);    --brand-on: var(--ink); }
.fitin-premium-landing { --brand: var(--premium); --brand-deep: var(--premium-deep); --brand-tint: var(--premium-tint); --brand-on: var(--paper); }

/* Hero — KNALLIGE Brand-Vollfläche mit hellem Text. */
.fitin-premium-landing .fitin-landing-hero { background: linear-gradient(140deg, var(--premium) 0%, var(--premium-deep) 100%); }
.fitin-easy-landing    .fitin-landing-hero { background: linear-gradient(140deg, var(--easy)  0%, var(--easy-deep)  100%); }
.fitin-landing .fitin-landing-hero { border-bottom: none; padding: 128px 0 72px; color: var(--paper); }
.fitin-landing .fitin-landing-hero__copy .fitin-mono { color: rgba(255,255,255,.82) !important; }
.fitin-landing .fitin-landing-hero .fitin-h1 { color: var(--paper); font-size: clamp(40px, 5.4vw, 74px); line-height: .92; }
.fitin-landing .fitin-landing-hero .fitin-h1 em { color: rgba(255,255,255,.66) !important; }
.fitin-landing .fitin-landing-hero .fitin-lead { color: rgba(255,255,255,.92); }
.fitin-landing .fitin-landing-hero__trust { color: rgba(255,255,255,.85); border-top-color: rgba(255,255,255,.28); }
/* Hero-Buttons auf Brand-Fläche → heller Kontrast. */
.fitin-landing .fitin-landing-hero .fitin-btn--premium,
.fitin-landing .fitin-landing-hero .fitin-btn--easy { background: var(--paper); color: var(--ink); }
.fitin-landing .fitin-landing-hero .fitin-btn--premium:hover,
.fitin-landing .fitin-landing-hero .fitin-btn--easy:hover { background: var(--ink); color: var(--paper); }
.fitin-landing .fitin-landing-hero .fitin-btn--ghost { border-color: rgba(255,255,255,.6); color: var(--paper); }
.fitin-landing .fitin-landing-hero .fitin-btn--ghost:hover { background: var(--paper); color: var(--ink); border-color: var(--paper); }
/* Easy-Sale-Pill auf grüner Fläche → Aktions-Gold (markiert). */
.fitin-easy-landing .fitin-landing-hero__sale { background: var(--action); color: var(--ink); }
/* Hero-Bild dezent absetzen. */
.fitin-landing .fitin-landing-hero__visual img { box-shadow: 0 24px 60px -24px rgba(10,10,11,.5); }

/* Kompakter — deutlich weniger Höhe pro Sektion (weniger Scrollen). */
.fitin-landing .fitin-landing-benefits,
.fitin-landing .fitin-landing-included,
.fitin-landing .fitin-landing-pricing,
.fitin-landing .fitin-landing-trust,
.fitin-landing .fitin-landing-faq { padding-top: clamp(48px, 5.5vw, 76px); padding-bottom: clamp(48px, 5.5vw, 76px); }
.fitin-landing .fitin-landing-benefits h2 { margin-bottom: 40px; }
.fitin-landing .fitin-landing-included__head,
.fitin-landing .fitin-landing-faq h2 { margin-bottom: 40px; }
/* Mehr Brand-Präsenz: Inklusiv-Sektion in Brand-Tint statt neutralem Soft. */
.fitin-premium-landing .fitin-landing-included { background: var(--premium-tint); }
.fitin-easy-landing    .fitin-landing-included { background: var(--easy-tint); }

/* Section-Eyebrows + kursive Akzente generell auf Brand. */
.fitin-landing .fitin-landing-included__head .fitin-mono,
.fitin-landing .fitin-landing-pricing__head .fitin-mono { color: var(--brand-deep) !important; }
.fitin-landing .fitin-landing-benefits h2 em,
.fitin-landing .fitin-landing-included h2 em,
.fitin-landing .fitin-landing-pricing h2 em { color: var(--brand) !important; }

/* Benefits — hochwertige Karten: Brand-Akzentleiste, grosse Brand-Nummer, Hover-Lift. */
.fitin-landing .fitin-landing-benefit {
  position: relative;
  overflow: hidden;
  gap: 8px;
  padding: 34px 30px 30px;
  transition: border-color 300ms var(--ease), transform 300ms var(--ease), box-shadow 300ms var(--ease);
}
.fitin-landing .fitin-landing-benefit::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  background: var(--brand);
}
.fitin-landing .fitin-landing-benefit:hover {
  border-color: var(--brand);
  transform: translateY(-5px);
  box-shadow: 0 22px 44px -26px rgba(10, 10, 11, .32);
}
.fitin-landing .fitin-landing-benefit__ico {
  display: inline-grid;
  place-items: center;
  width: 48px; height: 48px;
  border-radius: 12px;
  background: var(--brand-tint);
  color: var(--brand-deep);
  margin-bottom: 16px;
}
.fitin-landing .fitin-landing-benefit__ico svg { width: 24px; height: 24px; }
.fitin-landing .fitin-landing-benefit .fitin-mono {
  position: absolute;
  top: 26px; right: 26px;
  font-family: var(--font-mono);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .08em;
  color: var(--brand-deep);
  opacity: .5;
}
.fitin-landing .fitin-landing-benefit h3 { font-size: 19px; letter-spacing: -.016em; }

/* Included — Brand-Häkchen vor jedem Item. */
.fitin-landing .fitin-landing-included__grid li { position: relative; padding-left: 28px; }
.fitin-landing .fitin-landing-included__grid li::before {
  content: "✓";
  position: absolute;
  left: 0; top: 0;
  color: var(--brand-deep);
  font-weight: 700;
}

/* Pricing — Brand für Featured, Badge, Preis-Zahl, Tier-Hover, Ghost-Button-Hover. */
.fitin-landing .fitin-landing-pricing__tier { transition: border-color 240ms var(--ease), transform 240ms var(--ease); }
.fitin-landing .fitin-landing-pricing__tier:hover { border-color: var(--brand); transform: translateY(-3px); }
.fitin-landing .fitin-landing-pricing__tier--featured { border-color: var(--brand); }
.fitin-landing .fitin-landing-pricing__tier strong { color: var(--brand-deep); }
.fitin-landing .fitin-landing-pricing__badge { background: var(--brand); color: var(--brand-on); }
.fitin-landing .fitin-landing-pricing__tier .fitin-btn--ghost:hover {
  background: var(--brand); border-color: var(--brand); color: var(--brand-on);
}

/* Compare (dunkel) — Brand für Featured-Spalte + em. */
.fitin-landing .fitin-landing-compare h2 em { color: var(--brand); }
.fitin-landing .fitin-landing-compare .fitin-compare__table th.is-featured {
  border-bottom: 2px solid var(--brand);
}
.fitin-landing .fitin-landing-compare .fitin-compare__table td:nth-child(2) {
  color: var(--paper); font-weight: 600;
}

/* FAQ — Brand für em + offenen Eintrag. */
.fitin-landing .fitin-landing-faq h2 em { color: var(--brand); }
.fitin-landing .fitin-faq__item[open] summary { color: var(--brand-deep); }

/* ── Erweiterte Preise (Schüler/Senioren · Familie) ── */
.fitin-landing-prices-extra {
  max-width: 880px;
  margin: 36px auto 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}
@media (max-width: 700px) { .fitin-landing-prices-extra { grid-template-columns: 1fr; } }
.fitin-landing-prices-extra__card {
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  padding: 24px 26px;
  background: var(--paper-elev);
}
.fitin-landing-prices-extra__card h4 {
  font-family: var(--font-sans);
  font-size: 15px;
  font-weight: 600;
  margin: 0 0 14px;
  color: var(--ink);
  display: flex;
  align-items: baseline;
  gap: 8px;
}
.fitin-landing-prices-extra__card h4 .fitin-mono {
  font-family: var(--font-mono);
  color: var(--brand-deep);
  font-size: 11px;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.fitin-landing-prices-extra__row {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 9px 0;
  border-bottom: 1px solid var(--line);
  font-size: 14px;
  color: var(--ink-soft);
}
.fitin-landing-prices-extra__row:last-child { border-bottom: none; }
.fitin-landing-prices-extra__row span:last-child { font-weight: 600; color: var(--ink); white-space: nowrap; }
.fitin-landing-prices-extra__row.is-na span:last-child { color: var(--ink-low); font-weight: 400; }
.fitin-landing-prices-extra__row s { color: var(--ink-low); margin-right: 4px; }

/* ── Final CTA-Band (Brand-Vollfläche) ── */
.fitin-landing-cta {
  background: var(--brand);
  color: var(--brand-on);
  padding: clamp(56px, 7vw, 96px) 0;
  text-align: center;
}
.fitin-premium-landing .fitin-landing-cta { color: var(--paper); }
.fitin-landing-cta__shell { max-width: 760px; margin: 0 auto; }
.fitin-landing-cta__eyebrow {
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: .16em;
  text-transform: uppercase;
  opacity: .82;
  display: block;
  margin-bottom: 18px;
}
.fitin-landing-cta h2 {
  font-family: var(--font-display);
  font-size: clamp(34px, 5vw, 64px);
  font-weight: 700;
  letter-spacing: -.04em;
  line-height: .96;
  color: inherit;
  margin: 0 0 20px;
}
.fitin-landing-cta h2 em { font-style: normal; opacity: .8; }
.fitin-landing-cta p {
  font-size: clamp(16px, 1.3vw, 19px);
  line-height: 1.6;
  opacity: .92;
  margin: 0 auto 32px;
  max-width: 56ch;
}
.fitin-landing-cta__actions { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; }
.fitin-landing-cta__fine {
  margin-top: 22px;
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: .06em;
  opacity: .72;
}

/* ═══════════════════════════════════════════════════════════════
   HEADER-NAV — Mitgliedschaft-Dropdown (Premium / Easy)  [v2.3.0]
   Nur Desktop (Nav ist <=980px ohnehin ausgeblendet).
   ═══════════════════════════════════════════════════════════════ */
.fitin-nav-has-sub { position: relative; display: inline-flex; align-items: center; }
.fitin-nav-caret {
  display: inline-block;
  margin-left: 5px;
  font-size: 15px;
  line-height: 1;
  transform: rotate(90deg);
  transition: transform 240ms var(--ease), color 240ms var(--ease);
  color: var(--ink-low);
}
.fitin-nav-has-sub:hover .fitin-nav-caret,
.fitin-nav-has-sub:focus-within .fitin-nav-caret { color: var(--premium); }

.fitin-nav-sub {
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%) translateY(6px);
  min-width: 220px;
  background: var(--paper-elev);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  box-shadow: 0 18px 40px -16px rgba(10, 10, 11, .28);
  padding: 8px;
  display: flex;
  flex-direction: column;
  gap: 2px;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 220ms var(--ease), transform 220ms var(--ease);
  z-index: 200;
}
.fitin-nav-sub::before { content: ""; position: absolute; top: -10px; left: 0; right: 0; height: 10px; }
.fitin-nav-has-sub:hover .fitin-nav-sub,
.fitin-nav-has-sub:focus-within .fitin-nav-sub {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateX(-50%) translateY(0);
}
.fitin-site-header__nav .fitin-nav-sub a {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 11px 14px;
  border-radius: var(--r-sm);
  font-size: 12px;
  letter-spacing: .06em;
  color: var(--ink-soft);
  transform: none;
}
.fitin-site-header__nav .fitin-nav-sub a::after { display: none; }
.fitin-site-header__nav .fitin-nav-sub a:hover { background: var(--paper-soft); color: var(--ink); transform: none; letter-spacing: .06em; }
.fitin-site-header__nav .fitin-nav-sub a[href="/premium/"]:hover { color: var(--premium-deep); }
.fitin-site-header__nav .fitin-nav-sub a[href="/easy/"]:hover { color: var(--easy-deep); }
.fitin-nav-sub__dot { width: 9px; height: 9px; border-radius: 50%; flex-shrink: 0; }
.fitin-nav-sub__dot--premium { background: var(--premium); }
.fitin-nav-sub__dot--easy { background: var(--easy); }

/* Parent „Mitgliedschaft" auch auf /premium/ & /easy/ als aktiv markieren. */
body.page-premium .fitin-site-header__nav .fitin-nav-has-sub > a[href="/mitgliedschaft/"],
body.page-easy    .fitin-site-header__nav .fitin-nav-has-sub > a[href="/mitgliedschaft/"] {
  color: var(--ink);
  font-weight: 600;
}
body.page-premium .fitin-site-header__nav .fitin-nav-has-sub > a[href="/mitgliedschaft/"]::after,
body.page-easy    .fitin-site-header__nav .fitin-nav-has-sub > a[href="/mitgliedschaft/"]::after {
  transform: translateX(-50%) scaleX(1);
  width: 32px;
}

/* ═══════════════════════════════════════════════════════════════
   MITGLIEDSCHAFT-ÜBERSICHT — kompakter, klareres Branding  [v2.3.0]
   ═══════════════════════════════════════════════════════════════ */
/* Kompakter Hero — kleinere Headline, weniger Höhe. */
.page-mitgliedschaft .fitin-hero--paper { padding: 148px 0 56px; }
.page-mitgliedschaft .fitin-hero__h1 { margin-bottom: 40px; }
.page-mitgliedschaft .fitin-hero__top { margin-bottom: 44px; }
.page-mitgliedschaft .fitin-hero__lower { gap: 56px; align-items: center; }
.page-mitgliedschaft .fitin-hero__visual { aspect-ratio: 16 / 12; }

/* Kompaktere Sektionen + kleinere, konsistente Section-Titel. */
.page-mitgliedschaft .fitin-section { padding-top: clamp(52px, 6vw, 84px); padding-bottom: clamp(52px, 6vw, 84px); }
/* H2 nutzt die einheitliche Typo-Skala (.fitin-h2) — kein Page-Override mehr. */
.page-mitgliedschaft .fitin-section-head { margin-bottom: 38px; }

/* ── Zwei-Wege-Karten: deutlich stärkeres Brand-Differenzieren ── */
.page-mitgliedschaft .fitin-card { border: 2px solid transparent; }
.page-mitgliedschaft .fitin-card--premium { border-color: var(--premium); }
.page-mitgliedschaft .fitin-card--easy { border-color: var(--easy); }
.page-mitgliedschaft .fitin-card__num {
  display: inline-flex;
  align-items: center;
  align-self: flex-start;
  padding: 6px 13px;
  border-radius: 999px;
  margin-bottom: 18px;
}
.page-mitgliedschaft .fitin-card--premium .fitin-card__num { background: var(--premium); color: var(--paper); }
.page-mitgliedschaft .fitin-card--easy    .fitin-card__num { background: var(--easy);    color: var(--ink); }
.page-mitgliedschaft .fitin-card--premium .fitin-card__title { color: var(--premium-deep); }
.page-mitgliedschaft .fitin-card--easy    .fitin-card__title { color: var(--easy-deep); }
.page-mitgliedschaft .fitin-card--premium .fitin-card__list li::before { color: var(--premium-deep); }
.page-mitgliedschaft .fitin-card--easy    .fitin-card__list li::before { color: var(--easy-deep); }
/* CTA als kräftiger Brand-Button statt Unterstrich-Link. */
.page-mitgliedschaft .fitin-card__cta {
  border-bottom: none;
  align-self: flex-start;
  padding: 15px 26px;
  border-radius: var(--r-sm);
  margin-top: 4px;
}
.page-mitgliedschaft .fitin-card--premium .fitin-card__cta { background: var(--premium); color: var(--paper); }
.page-mitgliedschaft .fitin-card--premium .fitin-card__cta:hover { background: var(--premium-deep); }
.page-mitgliedschaft .fitin-card--easy    .fitin-card__cta { background: var(--easy); color: var(--ink); }
.page-mitgliedschaft .fitin-card--easy    .fitin-card__cta:hover { background: var(--easy-deep); color: var(--paper); }


/* Top-Level-Sektionen bündig aneinander. Entfernt den WP-Default-Spalt
   (:where(.wp-site-blocks) > * { margin-block-start: 1.5rem }), der zwischen
   farbigen Sektionen — v.a. CTA-Band → Footer — als heller Streifen sichtbar war. */
.wp-site-blocks > * { margin-block-start: 0; }

/* ── Vergleich (Übersicht) — modernes Grid mit Häkchen-Badges statt Tabelle ── */
.fitin-vs {
  --vscol: 96px;                       /* Breite der Premium-/Easy-Spalten */
  --vs-prem: rgba(0, 174, 239, .16);   /* durchgehende Blau-Spalte (Premium) */
  --vs-easy: rgba(108, 137, 79, .18);  /* durchgehende Grün-Spalte (Easy) */
  max-width: 760px;
  margin: 0 auto;
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  overflow: hidden;
  background: var(--paper-elev);
}
/* Durchgehende Farbspalten als Hintergrund — füllen jede Zelle komplett (kein „Chip"-Spalt). */
.fitin-vs__head,
.fitin-vs__row {
  display: grid;
  grid-template-columns: 1fr var(--vscol) var(--vscol);
  align-items: center;
  background-image:
    linear-gradient(var(--vs-prem), var(--vs-prem)),
    linear-gradient(var(--vs-easy), var(--vs-easy));
  background-repeat: no-repeat;
  background-size: var(--vscol) 100%, var(--vscol) 100%;
  background-position: right var(--vscol) top, right top;
}
@media (max-width: 560px) { .fitin-vs { --vscol: 64px; } }
.fitin-vs__head { background-color: var(--paper-soft); border-bottom: 1px solid var(--line); }
.fitin-vs__col { text-align: center; padding: 18px 6px; display: flex; flex-direction: column; justify-content: center; gap: 3px; }
.fitin-vs__col strong { font-family: var(--font-display); font-size: 19px; font-weight: 700; letter-spacing: -.02em; line-height: 1; }
.fitin-vs__col em { font-family: var(--font-mono); font-style: normal; font-size: 10px; letter-spacing: .04em; color: var(--ink-mute); }
.fitin-vs__col--premium strong { color: var(--premium-deep); }
.fitin-vs__col--easy strong { color: var(--easy-deep); }
/* Gruppen-Divider. */
.fitin-vs__group {
  background: var(--ink);
  color: var(--paper);
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .14em;
  text-transform: uppercase;
  padding: 10px 18px;
}
.fitin-vs__group--prem { background: var(--premium-deep); }
/* Zeilen + Häkchen-Badges. */
.fitin-vs__row { border-top: 1px solid var(--line); }
.fitin-vs__row > span { padding: 14px 18px; font-size: 14px; color: var(--ink); }
.fitin-vs__row > span em { font-style: normal; color: var(--ink-low); }
.fitin-vs__yes, .fitin-vs__no { width: 27px; height: 27px; border-radius: 50%; display: inline-grid; place-items: center; margin: 0 auto; }
/* Weisser Chip + kräftiger schwarzer Haken → maximaler Kontrast auf der Farbspalte. */
.fitin-vs__yes { background: var(--paper-elev); box-shadow: 0 1px 3px rgba(0,0,0,.16), inset 0 0 0 1px rgba(0,0,0,.05); }
.fitin-vs__yes::before { content: "✓"; color: #131313; font-size: 15px; font-weight: 800; line-height: 1; }
.fitin-vs__no::before { content: "–"; color: var(--ink-mute); font-size: 15px; font-weight: 700; }
/* Preis-Zeile. */
.fitin-vs__row--price { border-top: 2px solid var(--line-strong); }
.fitin-vs__row--price > strong { display: flex; align-items: center; justify-content: center; padding: 16px 2px; font-family: var(--font-sans); font-weight: 700; font-size: 14px; letter-spacing: -.01em; white-space: nowrap; color: var(--ink); }
.fitin-vs__row--price > span { font-weight: 600; }

/* ── FITIN Screens — kompakter Teaser (Startseite + Firmenfitness) ── */
.fitin-screens-teaser { padding: clamp(36px, 4vw, 56px) 0; }
.fitin-screens-teaser__band {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px 36px;
  flex-wrap: wrap;
  background: var(--ink);
  color: var(--paper);
  border-radius: var(--r-md);
  padding: clamp(26px, 3.5vw, 40px) clamp(26px, 4vw, 48px);
  position: relative;
  overflow: hidden;
}
.fitin-screens-teaser__band::before {
  content: "";
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 4px;
  background: var(--premium);
}
.fitin-screens-teaser__text { max-width: 60ch; }
.fitin-screens-teaser__text h3 {
  font-family: var(--font-display);
  font-size: clamp(21px, 2.3vw, 30px);
  font-weight: 700;
  letter-spacing: -.03em;
  line-height: 1.02;
  color: var(--paper);
  margin: 8px 0;
}
.fitin-screens-teaser__text p { font-size: 14px; line-height: 1.55; color: rgba(246, 245, 241, .78); margin: 0; }
.fitin-screens-teaser .fitin-btn { flex-shrink: 0; }
@media (max-width: 700px) { .fitin-screens-teaser__band { flex-direction: column; align-items: flex-start; } }

/* ── Firmenfitness — kompakterer Hero + Kontaktblock (Telefon/E-Mail statt Formular) ── */
.page-firmen .fitin-hero--paper { padding: 148px 0 56px; }
.page-firmen .fitin-hero__h1 { margin-bottom: 40px; }
.page-firmen .fitin-hero__top { margin-bottom: 44px; }
.page-firmen .fitin-hero__lower { gap: 56px; align-items: center; }
.page-firmen .fitin-hero__visual { aspect-ratio: 16 / 12; }
.page-firmen .fitin-section { padding-top: clamp(52px, 6vw, 84px); padding-bottom: clamp(52px, 6vw, 84px); }
/* H2 nutzt die einheitliche Typo-Skala (.fitin-h2) — kein Page-Override mehr. */
.page-firmen .fitin-section-head { margin-bottom: 38px; }

.fitin-firmen-contact {
  display: grid;
  grid-template-columns: 0.85fr 1fr;
  align-items: stretch;
  background: var(--paper-elev);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  overflow: hidden;
}
@media (max-width: 820px) { .fitin-firmen-contact { grid-template-columns: 1fr; } }
.fitin-firmen-contact__visual img { width: 100%; height: 100%; min-height: 260px; object-fit: cover; display: block; }
.fitin-firmen-contact__body { padding: clamp(30px, 3.5vw, 52px); display: flex; flex-direction: column; }
.fitin-firmen-contact__body p { font-size: 15px; line-height: 1.65; color: var(--ink-soft); margin: 16px 0 0; max-width: 48ch; }
.fitin-firmen-contact__actions { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 28px; }

/* ═════════════════════════════════════════════════════════════
   LEGAL — Impressum · Datenschutz · AGB · Hausordnung
   Inhalte 1:1 von fitin.ch übernommen (verifiziert 2026-05).
   ═════════════════════════════════════════════════════════════ */
.fitin-legal {
  background: var(--paper);
  padding: 152px 0 clamp(72px, 8vw, 120px);
}
.fitin-legal__shell { max-width: 860px; }
.fitin-legal__head {
  padding-bottom: 36px;
  margin-bottom: 48px;
  border-bottom: 1px solid var(--line);
}
.fitin-legal__title {
  font-family: var(--font-display, var(--font-mono));
  font-size: clamp(40px, 6vw, 72px);
  font-weight: 700;
  letter-spacing: -.035em;
  line-height: 1.0;
  color: var(--ink);
  margin: 16px 0 0;
}
.fitin-legal__updated {
  display: block;
  margin-top: 18px;
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--ink-mute);
}
.fitin-legal__body { max-width: 70ch; }
.fitin-legal__body > section + section { margin-top: 44px; }
.fitin-legal__body h2 {
  font-size: clamp(20px, 2.4vw, 26px);
  font-weight: 600;
  letter-spacing: -.01em;
  color: var(--ink);
  margin: 0 0 14px;
  line-height: 1.25;
}
.fitin-legal__body h2 .fitin-legal__num {
  font-family: var(--font-mono);
  font-size: .72em;
  font-weight: 600;
  color: var(--easy);
  margin-right: 12px;
  letter-spacing: .04em;
}
.fitin-legal__body h3 {
  font-size: 15px;
  font-weight: 600;
  color: var(--ink);
  margin: 22px 0 8px;
}
.fitin-legal__body p {
  font-size: 16px;
  line-height: 1.72;
  color: var(--ink-soft);
  margin: 0 0 14px;
}
.fitin-legal__body ul,
.fitin-legal__body ol {
  margin: 0 0 14px;
  padding-left: 22px;
}
.fitin-legal__body li {
  font-size: 16px;
  line-height: 1.65;
  color: var(--ink-soft);
  margin: 0 0 6px;
}
.fitin-legal__body a { color: var(--premium); text-decoration: underline; text-underline-offset: 3px; overflow-wrap: anywhere; word-break: break-word; }
.fitin-legal__body a:hover { color: var(--ink); }
.fitin-legal__body strong { color: var(--ink); font-weight: 600; }
.fitin-legal__body .fitin-legal__addr {
  font-style: normal;
  line-height: 1.7;
  font-size: 16px;
  color: var(--ink);
  margin: 0 0 14px;
}
/* Hervorgehobener Kontakt-/Register-Block */
.fitin-legal__card {
  background: var(--paper-soft);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  padding: 28px 30px;
  margin: 0 0 14px;
}
.fitin-legal__card p:last-child { margin-bottom: 0; }
.fitin-legal__reg {
  font-family: var(--font-mono);
  font-size: 13px;
  letter-spacing: .02em;
  color: var(--ink);
  line-height: 1.9;
  margin: 0;
}
.fitin-legal__note {
  font-size: 13px;
  color: var(--ink-mute);
  font-style: italic;
  margin-top: 8px;
}
/* Reminder-Box (Hausordnung) */
.fitin-legal__reminder {
  background: var(--ink);
  color: var(--paper);
  border-radius: var(--r-md);
  padding: 32px 34px;
  margin-top: 44px;
}
.fitin-legal__reminder h2 { color: var(--paper); }
.fitin-legal__reminder p { color: rgba(246, 245, 241, .82); }
/* Querverweise zu den anderen Legal-Seiten */
.fitin-legal__more {
  margin-top: clamp(56px, 7vw, 88px);
  padding-top: 32px;
  border-top: 1px solid var(--line);
  display: flex;
  flex-wrap: wrap;
  gap: 10px 14px;
  align-items: center;
}
.fitin-legal__more > span {
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--ink-mute);
  margin-right: 6px;
}
.fitin-legal__more a {
  font-family: var(--font-mono);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .04em;
  color: var(--ink);
  text-decoration: none;
  padding: 8px 16px;
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  transition: background 220ms, color 220ms, border-color 220ms;
}
.fitin-legal__more a:hover { background: var(--ink); color: var(--paper); border-color: var(--ink); }
.fitin-legal__more a[aria-current="page"] { background: var(--paper-soft); color: var(--ink-mute); pointer-events: none; }
@media (max-width: 600px) {
  .fitin-legal { padding-top: 124px; }
  .fitin-legal__body p, .fitin-legal__body li { font-size: 15px; }
}

/* ═══════════════════════════════════════════════════════════════
   RESPONSIVE SAFETY-NETS (v2.6.0)
   Lange deutsche Komposita (z.B. „Verdauungsbeschwerden", „Physiotherapie")
   und URLs müssen umbrechen können — sonst zwingen sie Grid-/Flex-Tracks
   breiter als den Viewport (horizontaler Overflow auf schmalen Screens).
   `anywhere` (nicht `break-word`) verkleinert auch die Min-Content-Breite.
   ═══════════════════════════════════════════════════════════════ */
.fitin-h1, .fitin-h2, .fitin-h3, .fitin-h4,
.fitin-lead, .fitin-anwendungen li, .fitin-focus__title,
.fitin-team-card__name, .fitin-physio-loc__name,
.fitin-wer-wir-sind__copy p { overflow-wrap: anywhere; }
/* Grid-Spalten dürfen unter ihre Content-Breite schrumpfen. */
.fitin-wer-wir-sind__copy, .fitin-wer-wir-sind__facts { min-width: 0; }


/* ═══════════════════════════════════════════════════════════════
   MOBILE-FEINSCHLIFF (v2.6.3)
   Kompaktere Startseite & Sektionen, grösserer Hero-Titel, schlankeres
   Lauf-Band. Greift nur ≤600px — Desktop bleibt unverändert.
   ═══════════════════════════════════════════════════════════════ */
@media (max-width: 600px) {
  /* Sektionen kompakter — Seiten waren auf Mobile zu lang. */
  :root { --section-y: clamp(48px, 11vw, 80px); }

  /* Hero-Titel der Startseite wuchtiger (Wörter brechen einzeln um;
     Desktop-Grösse bleibt via Basis-Skala einheitlich bei 102px). */
  .page-home .fitin-hero__h1 { font-size: clamp(50px, 13.5vw, 80px); line-height: 0.92; }

  /* Aktion-Box kompakter und darf auf zwei Zeilen umbrechen. */
  .fitin-hero__sale { flex-wrap: wrap; max-width: 100%; gap: 6px 10px; padding: 9px 13px; font-size: 13px; margin-top: 16px; }
  .fitin-hero__sale-text { white-space: normal; line-height: 1.4; }

  /* Lauf-Band: weniger Höhe, lebendigeres Tempo. */
  .fitin-marquee { padding: 11px 0; }
  .fitin-marquee__item { font-size: 23px; }
  .fitin-marquee__track { gap: 34px; animation-duration: 20s; }
}

/* ═══════════════════════════════════════════════════════════════
   NEWSLETTER-FORMULAR-FELDER (Plugin „FITIN Kontakte")
   Selects an die bestehenden Inputs angleichen + Footer-Feldraster.
   ═══════════════════════════════════════════════════════════════ */
.fitin-newsletter__form select,
.fitin-nlform__grid input,
.fitin-nlform__grid select {
  width: 100%;
  padding: 13px 14px;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: var(--r-sm);
  color: var(--paper);
  font-family: var(--font-sans);
  font-size: 14px;
}
.fitin-newsletter__form select option,
.fitin-nlform__grid select option { color: #1d2327; }
.fitin-newsletter__form select:focus,
.fitin-nlform__grid input:focus,
.fitin-nlform__grid select:focus { outline: none; border-color: var(--easy); background: rgba(255, 255, 255, 0.1); }
.fitin-nlform__grid input::placeholder { color: rgba(246, 245, 241, 0.45); }
.fitin-nlform__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-bottom: 12px;
}
@media (max-width: 560px) { .fitin-nlform__grid { grid-template-columns: 1fr; } }
.fitin-nl-success { color: var(--easy); font-weight: 600; font-size: 15px; line-height: 1.5; margin: 6px 0; }