/* Raster und Rahmen */
.fw-wrap {
  width:100%;
  max-width:calc(var(--space-wrap) + 2 * var(--space-gutter));
  margin-left:auto;
  margin-right:auto;
  padding-left:var(--space-gutter);
  padding-right:var(--space-gutter);
}
/* Kopfzeile */
.fw-kopf {
  position:sticky;
  top:0;
  z-index:40;
  height:var(--space-kopf);
  background:var(--color-night);
  border-bottom:1px solid var(--color-rule);
}
.fw-kopf-reihe {
  display:flex;
  align-items:center;
  gap:var(--space-s);
  height:100%;
}
.fw-marke {
  display:flex;
  align-items:center;
  gap:0.7rem;
  margin-right:auto;
  min-height:48px;
  color:var(--color-light);
  text-decoration:none;
}
.fw-marke-zeichen {
  display:grid;
  place-items:center;
  width:34px;
  height:34px;
  border:2px solid var(--color-oxblood);
  font-family:var(--font-display);
  font-size:1.15rem;
  font-weight:600;
  line-height:1;
}
.fw-marke-wort {
  display:flex;
  flex-direction:column;
  font-family:var(--font-display);
  font-size:1.35rem;
  font-weight:500;
  line-height:1.05;
  letter-spacing:-0.01em;
}
.fw-marke-zusatz {
  margin-top:3px;
  font-family:var(--font-text);
  font-size:0.7rem;
  font-weight:500;
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:var(--color-mist);
}
.fw-korb-link {
  display:inline-flex;
  align-items:center;
  gap:0.55rem;
  min-height:48px;
  padding:0 0.25rem;
  color:var(--color-light);
  text-decoration:none;
  font-weight:500;
}
.fw-korb-link:hover .fw-korb-wort {
  color:var(--color-steel);
}
.fw-zaehler {
  display:inline-grid;
  place-items:center;
  min-width:28px;
  height:28px;
  padding:0 7px;
  border-radius:var(--radius-chip);
  background:var(--color-surface-raised);
  border:1px solid var(--color-rule);
  font-size:0.85rem;
  font-variant-numeric:tabular-nums;
}
.fw-zaehler.on {
  background:var(--color-oxblood);
  border-color:var(--color-oxblood);
  color:var(--color-white);
}
.fw-menue-knopf {
  display:inline-grid;
  place-items:center;
  width:48px;
  height:48px;
  padding:0;
  border:1px solid var(--color-rule);
  border-radius:var(--radius-button);
  background:transparent;
  cursor:pointer;
}
.fw-menue-strich, .fw-menue-strich::before, .fw-menue-strich::after {
  display:block;
  width:20px;
  height:2px;
  background:var(--color-light);
}
.fw-menue-strich {
  position:relative;
}
.fw-menue-strich::before, .fw-menue-strich::after {
  content:"";
  position:absolute;
  left:0;
}
.fw-menue-strich::before {
  top:-6px;
}
.fw-menue-strich::after {
  top:6px;
}
/* Navigation: mobil als Vollbild */
.fw-nav {
  position:fixed;
  inset:0;
  z-index:60;
  visibility:hidden;
  overflow-y:auto;
  background:var(--color-night);
}
.fw-nav.on {
  visibility:visible;
}
.fw-nav-innen {
  display:flex;
  flex-direction:column;
  gap:var(--space-m);
  min-height:100%;
  padding:var(--space-m) var(--space-gutter) var(--space-xl);
}
.fw-nav-zu {
  align-self:flex-end;
  min-height:48px;
  padding:0 1.1rem;
  border:1px solid var(--color-rule);
  border-radius:var(--radius-button);
  background:var(--color-surface);
  color:var(--color-light);
  cursor:pointer;
}
.fw-nav-liste {
  margin:0;
  padding:0;
  list-style:none;
  border-top:1px solid var(--color-rule);
}
.fw-nav-liste li {
  border-bottom:1px solid var(--color-rule);
}
.fw-nav-liste a {
  display:block;
  padding:0.9rem 0;
  font-family:var(--font-display);
  font-size:1.6rem;
  color:var(--color-light);
  text-decoration:none;
}
.fw-nav-liste a[aria-current="page"] {
  color:var(--color-steel);
}
.fw-nav-kontakt a {
  display:inline-block;
  padding:0.7rem 0;
}
@media (min-width: 960px) {
  .fw-menue-knopf {
    display:none;
  }
  .fw-korb-link {
    min-width:8.5rem;
    justify-content:flex-end;
  }
  .fw-nav {
    position:sticky;
    inset:auto;
    top:0;
    z-index:41;
    visibility:visible;
    overflow:visible;
    width:max-content;
    height:var(--space-kopf);
    margin-top:calc(-1 * var(--space-kopf));
    margin-left:auto;
    margin-right:calc(max(var(--space-gutter), (100% - var(--space-wrap)) / 2) + 10rem);
    background:transparent;
  }
  .fw-nav-innen {
    flex-direction:row;
    align-items:center;
    min-height:0;
    height:100%;
    padding:0;
  }
  .fw-nav-zu, .fw-nav-kontakt {
    display:none;
  }
  .fw-nav-liste {
    display:flex;
    gap:clamp(1rem, 2vw, 2rem);
    border:0;
  }
  .fw-nav-liste li {
    border:0;
  }
  .fw-nav-liste a {
    display:inline-flex;
    align-items:center;
    min-height:48px;
    padding:0;
    font-family:var(--font-text);
    font-size:0.98rem;
    font-weight:500;
  }
  .fw-nav-liste a:hover {
    color:var(--color-steel);
  }
}
/* geteilte Fläche: Tafel links, Bahn rechts */
.fw-split {
  display:grid;
  border-bottom:1px solid var(--color-rule);
}
.fw-tafel {
  background:var(--color-surface);
  border-bottom:1px solid var(--color-rule);
}
.fw-tafel-innen {
  padding:var(--space-l) var(--space-gutter);
}
.fw-bahn {
  min-width:0;
  padding:var(--space-l) var(--space-gutter) var(--space-xl);
}
.fw-bahn-innen {
  max-width:780px;
}
@media (min-width: 960px) {
  .fw-split {
    grid-template-columns:minmax(0, 38fr) minmax(0, 62fr);
  }
  .fw-tafel {
    border-bottom:0;
    border-right:1px solid var(--color-rule);
  }
  .fw-tafel-innen {
    position:sticky;
    top:var(--space-kopf);
    max-width:480px;
    margin-left:auto;
    padding:var(--space-xl) var(--space-l) var(--space-l) var(--space-gutter);
  }
  .fw-bahn {
    padding:var(--space-xl) var(--space-gutter) var(--space-xxl) clamp(2rem, 4vw, 4.5rem);
  }
}
/* Kartenraster */
.fw-raster {
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(min(100%, 220px), 1fr));
  gap:calc(var(--space-l) + var(--space-offset)) calc(var(--space-m) + var(--space-offset));
  margin-bottom:var(--space-reach);
}
@media (max-width: 699px) {
  .fw-raster {
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:calc(var(--space-m) + var(--space-offset)) calc(var(--space-xs) + var(--space-offset));
  }
  .fw-raster .fw-karte-text {
    padding:var(--space-s);
  }
  .fw-raster .fw-karte-kurz {
    display:none;
  }
}
/* Fußzeile */
.fw-fuss {
  margin-top:0;
  padding:var(--space-xl) 0 var(--space-l);
  background:var(--color-surface);
  border-top:1px solid var(--color-rule);
  font-size:0.95rem;
}
.fw-fuss-raster {
  display:grid;
  gap:var(--space-l);
}
.fw-fuss-marke {
  margin-bottom:var(--space-xs);
  font-family:var(--font-display);
  font-size:1.6rem;
}
.fw-fuss-satz {
  max-width:34rem;
  color:var(--color-mist);
}
.fw-fuss-kontakt a {
  display:inline-block;
  padding:0.6rem 0;
}
.fw-fuss-widerruf {
  margin:var(--space-s) 0 0;
}
.fw-fuss-rechts {
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:var(--space-m);
}
.fw-fuss-liste {
  margin:0;
  padding:0;
  list-style:none;
}
.fw-fuss-liste a {
  display:inline-block;
  padding:0.6rem 0;
  color:var(--color-light);
  text-decoration:none;
}
.fw-fuss-liste a:hover {
  color:var(--color-steel);
}
.fw-rechtszeile {
  margin-top:var(--space-l);
  padding-top:var(--space-m);
  border-top:1px solid var(--color-rule);
  font-size:0.85rem;
  color:var(--color-mist);
}
@media (min-width: 760px) {
  .fw-fuss-raster {
    grid-template-columns:minmax(0, 1fr) minmax(0, 1fr);
  }
}
