/* Firmenseiten (B-31) — z. B. adventure-movements.de/ferienprogramm-krones.
   Entwurf B „Gutschein-Ticket“ (Viktor, 2026-10-29). Alles unter .fs gekapselt, damit nichts mit Squarespace kollidiert.
   Frühbucher-Teile tragen .fs-fb, die Preise danach .fs-nach — das Seitenskript setzt .fs--nach ab dem Stichtag. */
.fs { --fs-text: #454545; --fs-dunkel: #212121; --fs-titel: #3588a7; --fs-petrol: #398aa9; --fs-petrol-hell: #e6f1f5;
  --fs-gruen: #2f9e5b; --fs-gruen-hell: #e8f5ee; --fs-orange-hell: #fff3e6; --fs-orange-text: #9a4f05;
  --fs-creme: #fbf9f4; --fs-linie: #e7e3da; --fs-leise: #5f6b76;
  color: var(--fs-text); font-family: Ubuntu, system-ui, sans-serif; font-size: 17px; line-height: 1.6; }
.fs *, .fs *::before, .fs *::after { box-sizing: border-box; }
.fs h1, .fs h2, .fs h3, .fs p { margin: 0; font-family: inherit; }
.fs .fs-nach { display: none; }
.fs.fs--nach .fs-fb { display: none !important; }
.fs.fs--nach .fs-nach { display: revert; }
.fs-code { font-family: ui-monospace, Menlo, monospace; font-weight: 700; letter-spacing: .08em; }
.fs-marke { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: #d9eef6; }
.fs-marke i { width: 8px; height: 8px; border-radius: 50%; background: #f08a24; display: inline-block; }
.fs-cta { display: inline-flex; align-items: center; gap: 8px; background: linear-gradient(45deg, #ff0080, #ff8c00); color: #fff !important;
  font-weight: 700; border-radius: 999px; padding: 12px 22px; text-decoration: none !important; font-size: 16px; }
.fs-plakette { display: inline-flex; align-items: center; gap: 6px; background: var(--fs-orange-hell); color: var(--fs-orange-text); font-weight: 700; font-size: 13px; border-radius: 999px; padding: 4px 10px; }

/* Bühne mit Ticket */
.fs-buehne { background: linear-gradient(135deg, #2f7896 0%, #398aa9 55%, #4aa0bd 100%); color: #fff; border-radius: 26px;
  padding: 44px; display: grid; grid-template-columns: 1.15fr .85fr; gap: 34px; align-items: center; position: relative; overflow: hidden; }
.fs-buehne::after { content: ""; position: absolute; right: -60px; bottom: -80px; width: 260px; height: 260px; border-radius: 50%; background: rgba(255,255,255,.07); pointer-events: none; }
.fs-buehne h1 { color: #fff; font-size: clamp(32px, 4.6vw, 50px); line-height: 1.08; font-weight: 700; margin: 12px 0 14px; }
.fs-buehne p { color: #eaf5f9; font-size: 17px; }
.fs-buehne .fs-cta { margin-top: 22px; }
.fs-ticket { background: #fff; color: var(--fs-dunkel); border-radius: 18px; padding: 22px 22px 18px; position: relative; z-index: 1;
  box-shadow: 0 18px 40px rgba(0,0,0,.18); transform: rotate(-2deg); }
.fs-ticket::before, .fs-ticket::after { content: ""; position: absolute; top: 58%; width: 26px; height: 26px; border-radius: 50%; background: #3b8cab; }
.fs-ticket::before { left: -13px; } .fs-ticket::after { right: -13px; }
.fs-ticket__oben { font-size: 13px; font-weight: 700; color: var(--fs-leise); text-transform: uppercase; letter-spacing: .06em; }
.fs-ticket__code { font: 700 38px/1.1 ui-monospace, Menlo, monospace; letter-spacing: .12em; color: var(--fs-petrol); margin: 6px 0 4px; }
.fs-ticket__status { display: inline-flex; gap: 6px; align-items: center; color: #1f6e40; background: var(--fs-gruen-hell); border-radius: 999px; padding: 3px 10px; font-size: 13px; font-weight: 700; }
.fs-ticket__trenn { border-top: 2px dashed var(--fs-linie); margin: 16px -22px 12px; }
.fs-ticket__zeile { display: flex; justify-content: space-between; gap: 12px; font-size: 15px; padding: 3px 0; }
.fs-ticket__zeile b { color: var(--fs-gruen); white-space: nowrap; }
.fs-ticket__zeile s { color: var(--fs-leise); font-weight: 400; }
.fs-ticket .fs-plakette { margin-top: 10px; }

/* Schritte + Preistabelle */
.fs-schritte { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; max-width: 820px; margin: 30px auto 0; }
.fs-schritte div { background: var(--fs-petrol-hell); border-radius: 14px; padding: 14px 16px; font-size: 14px; }
.fs-schritte b { display: block; color: var(--fs-dunkel); font-size: 15px; margin-bottom: 2px; }
.fs-tabelle { margin: 30px auto 0; max-width: 820px; background: #fff; border: 1px solid var(--fs-linie); border-radius: 18px; overflow: hidden; }
.fs-tabelle table { width: 100%; border-collapse: collapse; font-size: 15px; margin: 0; }
.fs-tabelle th, .fs-tabelle td { padding: 13px 16px; text-align: right; border: 0; border-bottom: 1px solid var(--fs-linie); background: none; }
.fs-tabelle th:first-child, .fs-tabelle td:first-child { text-align: left; }
.fs-tabelle thead th { background: var(--fs-creme); font-size: 13px; color: var(--fs-leise); font-weight: 700; }
.fs-tabelle td.fs-ihr { font-weight: 700; color: var(--fs-gruen); font-size: 17px; }
.fs-tabelle tbody tr:last-child td { border-bottom: 0; }
.fs-tabelle__fuss { padding: 12px 16px; font-size: 13px; color: var(--fs-leise); background: var(--fs-creme); }
.fs-titel2 { text-align: center; color: var(--fs-titel); font-size: 32px; font-weight: 700; margin: 52px 0 18px; }

/* Kästen unter dem Filter */
.fs-kurz { max-width: 820px; margin: 30px auto 0; display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.fs-kurz > div { border: 1px solid var(--fs-linie); border-radius: 14px; padding: 14px 16px; background: #fff; font-size: 14px; }
.fs-kurz b { color: var(--fs-dunkel); display: block; }
.fs-bbt { max-width: 820px; margin: 30px auto 0; background: var(--fs-creme); border: 1px solid var(--fs-linie); border-radius: 16px; padding: 18px 20px; }
.fs-bbt h3 { color: var(--fs-dunkel); font-size: 18px; font-weight: 700; }
.fs-bbt p { font-size: 15px; margin-top: 4px; }
.fs-bbt .ws-element { margin-top: 12px; }
.fs-schnupper { text-align: center; margin: 44px 0 20px; }
.fs-schnupper a { display: inline-block; margin-top: 10px; background: #fff; border-radius: 999px; padding: 10px 18px; font-weight: 700; color: var(--fs-dunkel) !important; text-decoration: none !important; box-shadow: 0 3px 12px rgba(0,0,0,.08); }

@media (max-width: 760px) {
  .fs-buehne { grid-template-columns: 1fr; padding: 30px 22px; }
  .fs-ticket { transform: none; }
  .fs-schritte, .fs-kurz { grid-template-columns: 1fr; }
  .fs-tabelle th:nth-child(3), .fs-tabelle td:nth-child(3), .fs-tabelle th:nth-child(4), .fs-tabelle td:nth-child(4) { display: none; }
  .fs-tabelle th, .fs-tabelle td { padding: 12px; white-space: nowrap; }
  .fs-tabelle td:first-child { white-space: normal; }
}
