/* 099 Landingpage Formulare. Nur auf /formulare und /en/forms geladen. Klassen mit fm-, damit nichts mit style.css kollidiert.
   Layout: zentrierter Kopf, darunter ein Fenster mit dem Ablauf Chat → Seite → App als Animation; Rest in einer ruhigen 720er-Spalte. */
@font-face{font-family:"Poppins";font-style:normal;font-weight:500;font-display:swap;src:url("/fonts/poppins-500-latin.woff2") format("woff2")}
@font-face{font-family:"Poppins";font-style:normal;font-weight:600;font-display:swap;src:url("/fonts/poppins-600-latin.woff2") format("woff2")}
@font-face{font-family:"Poppins";font-style:normal;font-weight:700;font-display:swap;src:url("/fonts/poppins-700-latin.woff2") format("woff2")}
@font-face{font-family:"Nunito";font-style:normal;font-weight:800 900;font-display:swap;src:url("/fonts/nunito-800-900-latin.woff2") format("woff2")}
@font-face{font-family:"Manrope";font-style:normal;font-weight:600 700;font-display:swap;src:url("/fonts/manrope-600-700-latin.woff2") format("woff2")}
@font-face{font-family:"Playfair Display";font-style:italic;font-weight:500;font-display:swap;src:url("/fonts/playfair-display-italic-500-latin.woff2") format("woff2")}
:root{
  --grund:oklch(0.99 0.003 250);
  --flaeche:#ffffff;
  --sanft:oklch(0.95 0.006 250);
  --linie:oklch(0.9 0.005 250);
  --text:oklch(0.16 0.01 260);
  --gedaempft:oklch(0.45 0.01 260);
  --heroGrau:oklch(0.36 0.012 260);
  --akzent:oklch(0.45 0.2 265);
  --akzentSanft:oklch(0.94 0.03 265);
  --strich:oklch(0.52 0.2 28);
  --erfolg:oklch(0.48 0.13 155);
  --erfolgSanft:oklch(0.95 0.04 155);
  --knopfText:#ffffff;
  --schatten:0 1px 2px oklch(0.16 0.01 260 / .04),0 24px 60px -20px oklch(0.16 0.01 260 / .18);
  --punkt:oklch(0.82 0.012 260);
  --glowBlau:oklch(0.78 0.12 265 / .28);
  --glowGelb:oklch(0.9 0.13 90 / .4);
  --doodle:oklch(0.62 0.01 260);
  --logoBlau:#1c45c2;
  --balken:oklch(0.8 0.075 265);
  --logoGruen:#255940;
  --logoGelb:#f5cc58;
  --schrift:"Hanken Grotesk","Helvetica Neue",Helvetica,Arial,sans-serif;
  --mono:ui-monospace,"SF Mono",Menlo,monospace;
}

.fm{position:relative;overflow-x:clip;font:400 16px/1.55 var(--schrift);-webkit-font-smoothing:antialiased;
  padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
:where(.fm) h1,:where(.fm) h2,:where(.fm) h3{margin:0;text-wrap:balance}
:where(.fm) p{margin:0}
.fm-spalte{max-width:960px;margin-inline:auto}
:where(.fm) section{padding-block:clamp(72px,11vw,128px)}
.fm-label{font:500 12px/1.4 var(--mono);text-transform:uppercase;letter-spacing:.08em;color:var(--gedaempft)}
:where(.fm) h2{font-size:clamp(28px,4vw,40px);font-weight:500;letter-spacing:-.03em;line-height:1.1;margin-top:14px}
.fm-klein{font-size:14px;color:var(--gedaempft)}


/* Hintergrund: Punktraster wie Millimeterpapier, Licht in den Logofarben, Formular-Kritzeleien */
.fm-grund{position:absolute;left:0;right:0;top:0;height:1500px;pointer-events:none;z-index:0;overflow:hidden}
.fm-grund .fm-raster{position:absolute;inset:0;background-image:radial-gradient(var(--punkt) 1.1px,transparent 1.4px);background-size:24px 24px;
  -webkit-mask-image:radial-gradient(ellipse 36% 20% at 50% 24%,transparent 55%,#000 100%),radial-gradient(ellipse 70% 60% at 50% 38%,#000 20%,transparent 80%);-webkit-mask-composite:source-in;
  mask-image:radial-gradient(ellipse 36% 20% at 50% 24%,transparent 55%,#000 100%),radial-gradient(ellipse 70% 60% at 50% 38%,#000 20%,transparent 80%);mask-composite:intersect}
.fm-grund .fm-punkte-canvas{position:absolute;left:0;top:0;width:100%;height:100%}
.fm-grund.lebt .fm-raster{display:none}
.fm-grund .fm-licht{position:absolute;border-radius:50%;filter:blur(70px)}
.fm-grund .fm-blau{width:820px;height:480px;left:50%;top:820px;transform:translateX(-50%);background:var(--glowBlau)}
.fm-grund .fm-gelb{width:420px;height:320px;left:calc(50% + 260px);top:80px;background:var(--glowGelb)}
.fm-kritzel{position:absolute;color:var(--doodle)}
.fm-kritzel.fm-blau-k{color:var(--akzent)}
.fm-k1{left:calc(50% - 600px);top:190px;transform:rotate(-8deg)}
.fm-k2{left:calc(50% + 500px);top:240px;animation-delay:-2s}
.fm-k3{left:calc(50% - 560px);top:500px;animation-delay:-4s}
.fm-k4{left:calc(50% + 470px);top:540px;animation-delay:-1s}
.fm-k5{left:calc(50% - 470px);top:20px;animation-delay:-3s}
.fm-kritzel.fm-k1,.fm-kritzel.fm-k4{color:var(--logoBlau)}
.fm-kritzel.fm-k2,.fm-kritzel.fm-k5{color:var(--logoGruen)}
.fm-kritzel.fm-k3{color:var(--text)}
.fm-kritzel .fm-gelb-f{fill:var(--logoGelb)}
@keyframes schweben{50%{translate:0 -8px}}
@media (max-width:1180px){.fm-kritzel{display:none}}

/* Hero, zentriert */
.fm-hero{position:relative;z-index:1;text-align:center;display:grid;justify-items:center;gap:28px;padding-block:clamp(48px,9vw,104px) clamp(56px,7vw,88px)}
.fm-hero h1{font-size:clamp(38px,6.2vw,76px);font-weight:500;letter-spacing:-.035em;line-height:1.08;max-width:none;padding-bottom:.1em}
.fm-hero h1>span.fm-hzeile{display:block}
.fm-welle{position:relative;white-space:nowrap}
.fm-welle svg{position:absolute;left:0;bottom:-.02em;width:calc(100% - .3em);height:.18em;overflow:visible;color:var(--akzent)}
.fm-hero h1 .fm-leiser{color:var(--heroGrau);margin-top:.22em}
.fm-hero .fm-lead{font-size:clamp(18px,2vw,21px);line-height:1.6;color:var(--heroGrau);max-width:48ch;margin-top:-8px}
.fm-knopf{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 26px;border-radius:999px;
  background:var(--text);color:var(--knopfText);font:600 16px var(--schrift);text-decoration:none;border:0;cursor:pointer;transition:transform .15s}
.fm-knopf:hover{transform:translateY(-1px)}
.fm-knopf:focus-visible,.fm-knopf2:focus-visible,.fm-reiter button:focus-visible{outline:3px solid var(--akzentSanft);outline-offset:2px}
.fm-cta{display:grid;justify-items:center;gap:12px;margin-top:8px}

/* Fenster mit Ablauf */
.fm-film{max-width:1040px;margin-inline:auto;position:relative;z-index:1}
.fm-fenster{background:var(--flaeche);border:1.5px solid var(--linie);border-radius:22px;box-shadow:var(--schatten);overflow:hidden}
.fm-leiste{display:flex;align-items:center;gap:8px;padding:12px 16px;border-bottom:1.5px solid var(--linie);font:500 13px var(--mono);color:var(--gedaempft)}
.fm-leiste i{width:9px;height:9px;border-radius:50%;background:var(--linie);display:inline-block;flex:none}
.fm-leiste .fm-url{margin-inline:auto;padding:4px 14px;border-radius:999px;background:var(--sanft);max-width:70%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transition:color .3s}
.fm [hidden]{display:none!important}
.fm-buehne{position:relative;height:500px}
.fm-szene{position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity .45s,visibility .45s;padding:28px clamp(18px,5vw,56px)}
.fm-szene.an{opacity:1;visibility:visible}

/* Szene 1: Chat */
.fm-chat{display:flex;flex-direction:column;gap:14px;max-width:640px;margin-inline:auto;height:100%;justify-content:flex-start}
.fm-bubble{align-self:flex-end;max-width:85%;background:var(--sanft);padding:11px 16px;border-radius:18px 18px 6px 18px;font-size:15.5px;min-height:44px}
.fm-bubble{display:grid}
.fm-bubble>span{grid-area:1/1}
.fm-bubble .fm-geist{visibility:hidden}
.cursor::after{content:"";display:inline-block;width:2px;height:1.05em;background:var(--text);vertical-align:-2px;margin-left:2px;animation:blink 1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}
.fm-antwort{display:grid;gap:10px;font-size:15.5px}
.fm-antwort .fm-wer{font:500 12px var(--mono);color:var(--gedaempft);text-transform:uppercase;letter-spacing:.06em}
.fm-karte{display:flex;align-items:center;gap:12px;padding:12px 14px;border:1.5px solid var(--linie);border-radius:14px;max-width:340px}
.fm-karte .fm-ico{width:36px;height:36px;border-radius:10px;background:var(--akzentSanft);color:var(--akzent);display:grid;place-items:center;flex:none}
.fm-karte b{display:block;font-size:14.5px;font-weight:600}
.fm-karte small{font-size:13px;color:var(--gedaempft)}
.fm-karte.fm-ok .fm-ico{background:var(--erfolgSanft);color:var(--erfolg)}
.fm-tippt{display:inline-flex;gap:4px;padding:6px 0}
.fm-tippt i{width:6px;height:6px;border-radius:50%;background:var(--gedaempft);opacity:.4;animation:tipp 1s infinite}
.fm-tippt i:nth-child(2){animation-delay:.15s}.fm-tippt i:nth-child(3){animation-delay:.3s}
@keyframes tipp{30%{opacity:1;transform:translateY(-2px)}}
.fm-weg{display:none}

/* Szene 2: Seite */
.fm-seite{max-width:520px;margin-inline:auto;display:grid;gap:12px;align-content:center;height:100%}
.fm-seite .fm-anlass{font:500 12px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--akzent)}
.fm-seite h3{font-size:26px;font-weight:500;letter-spacing:-.02em;line-height:1.15}
.fm-feld{display:grid;gap:5px}
.fm-feld span{font-size:13.5px;font-weight:500}
.fm-feld div{height:44px;border:1.5px solid var(--linie);border-radius:12px;padding:0 14px;display:flex;align-items:center;font-size:15.5px;background:var(--grund);transition:border-color .2s}
.fm-feld div.fokus{border-color:var(--text)}
.fm-seite .fm-knopf{width:100%;min-height:48px}
.fm-paar{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px}
.fm-feld div.fm-auswahl{justify-content:space-between}
.fm-feld div.fm-auswahl::after{content:"";width:8px;height:8px;border-right:2px solid var(--gedaempft);border-bottom:2px solid var(--gedaempft);transform:rotate(45deg) translate(-2px,-2px);flex:none;margin-left:8px}
.fm-feld div.fm-auswahl:empty::before{content:"Wählen";color:var(--gedaempft)}
.fm-wahl{margin:0;display:grid;grid-template-columns:1fr 1fr;gap:8px}
.fm-wahl b{height:44px;border:1.5px solid var(--linie);border-radius:12px;display:grid;place-items:center;font-weight:500;font-size:15px;transition:background .2s,color .2s,border-color .2s}
.fm-wahl b.an{border-color:var(--erfolg);background:var(--erfolgSanft);color:var(--erfolg)}
.fm-seite .fm-knopf.druck{transform:scale(.97)}
/* Szene 2 im eigenen Design der Konferenz: Verlauf, weisse Karte, Poppins */
#fm-s1{background:linear-gradient(135deg,#22d3e6 0%,#7b6cf6 50%,#e83ef0 100%);display:grid;place-items:center;font-family:"Poppins","Hanken Grotesk",sans-serif}
#fm-s1 .fm-seite{height:auto;width:100%;max-width:440px;background:#fff;color:#2b2b33;border-radius:14px;padding:24px 30px 26px;box-shadow:0 20px 50px #3b1d6b40;gap:10px}
#fm-s1 .fm-anlass{color:#8a8f9c;font:500 10.5px "Poppins",sans-serif;letter-spacing:.12em;text-align:center}
#fm-s1 h3{font-family:"Poppins",sans-serif;font-weight:700;font-size:23px;letter-spacing:-.01em;line-height:1.15;text-align:center;margin-bottom:4px}
#fm-s1 .fm-paar{gap:18px}
#fm-s1 .fm-feld span{color:#2b2b33;font-size:12px;font-weight:500}
#fm-s1 .fm-feld div{height:34px;border:0;border-bottom:1.5px solid #d5d8e0;border-radius:0;background:transparent no-repeat 0 50%;padding:0 0 0 24px;font-size:14px;color:#2b2b33}
#fm-s1 #fm-f-name{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%239aa3b2' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 21c1.5-4 4.5-6 8-6s6.5 2 8 6'/%3E%3C/svg%3E")}
#fm-s1 #fm-f-mail{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%239aa3b2' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Cpath d='M3 7l9 6 9-6'/%3E%3C/svg%3E")}
#fm-s1 .fm-feld div.fm-auswahl{padding-left:2px}
#fm-s1 .fm-feld div.fokus{border-bottom-color:#7b6cf6}
#fm-s1 .fm-feld div.fm-auswahl::after{border-color:#9aa3b2}
#fm-s1 .fm-wahl b{height:36px;border:1.5px solid #e1e3ea;border-radius:999px;color:#5b6070;font-size:13.5px}
#fm-s1 .fm-wahl b.an{background:linear-gradient(90deg,#22d3e6,#e83ef0);border-color:transparent;color:#fff}
#fm-s1 .fm-knopf{min-height:42px;margin-top:6px;background:linear-gradient(90deg,#22d3e6,#e83ef0);color:#fff;font:600 13px "Poppins",sans-serif;letter-spacing:.08em;text-transform:uppercase;box-shadow:0 8px 22px #e83ef04d}
#fm-s1 .fm-danke{background:#f3effe;color:#6b4fe0;border-radius:999px;font-family:"Poppins",sans-serif;font-size:14px}
.fm-danke{padding:12px 14px;border-radius:12px;background:var(--erfolgSanft);color:var(--erfolg);font-weight:500;font-size:15px;text-align:center}

/* Szene 3: App */
.fm-app{max-width:680px;margin-inline:auto;display:grid;gap:14px;align-content:center;height:100%}
.fm-app .fm-kopfzeile{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.fm-app .fm-kopfzeile b{font-size:18px;font-weight:600}
.fm-pille{display:inline-flex;align-items:center;gap:6px;height:26px;padding:0 10px;border-radius:999px;background:var(--akzentSanft);color:var(--akzent);font-size:13px;font-weight:500}
.fm-tabelle{border:1.5px solid var(--linie);border-radius:14px;overflow:hidden}
.fm-zeile{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr) 70px 80px 56px;gap:12px;padding:12px 16px;border-top:1px solid var(--linie);font-size:14.5px;font-variant-numeric:tabular-nums;align-items:center}
.fm-zeile>*{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fm-zeile.fm-titel{border-top:0;font:500 11.5px var(--mono);text-transform:uppercase;letter-spacing:.06em;color:var(--gedaempft);background:var(--sanft)}
.fm-zeile .fm-r{text-align:right}
.fm-zeile .fm-zeit{color:var(--gedaempft)}
.fm-zeile .fm-ja{color:var(--erfolg);font-weight:500}
.fm-zeile .fm-nein{color:var(--gedaempft)}
.fm-zeile.neu{animation:rein .7s cubic-bezier(.2,.8,.2,1),glanz 2.4s ease-out}
@keyframes rein{from{transform:translateY(-12px);opacity:0}}
@keyframes glanz{from{background:var(--akzentSanft)}to{background:transparent}}
.fm-mail{display:flex;gap:10px;align-items:center;padding:10px 14px;border-radius:12px;border:1.5px solid var(--linie);font-size:14px;color:var(--gedaempft)}
.fm-mail b{color:var(--text);font-weight:500}

/* Durchgestrichen */
.fm-namen-block{text-align:center;padding-block:clamp(64px,9vw,104px) 0;display:grid;gap:20px;justify-items:center}
.fm-namen{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 26px;font-size:clamp(22px,3.2vw,32px);font-weight:500;letter-spacing:-.02em;color:var(--gedaempft);max-width:960px}
.fm-namen s{text-decoration:none;position:relative;white-space:nowrap}
.fm-namen s svg{position:absolute;left:-6%;width:112%;top:28%;height:52%;overflow:visible;pointer-events:none}
.fm-namen s svg path{fill:none;stroke:var(--strich);stroke-width:3.2;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.fm-namen s svg path+path{stroke-width:2.2;opacity:.85}
.fm-namen s{transition:color .25s}
.fm-namen s svg{transition:opacity .25s}
.fm-namen s:hover{color:var(--text)}
.fm-namen s:hover svg{opacity:0}
.fm-namen s:nth-child(2n) svg{transform:rotate(-2deg)}
.fm-namen s:nth-child(2n+1) svg{transform:rotate(1.5deg)}
.fm-namen.zeichnen s svg{animation:zeichnen .5s cubic-bezier(.5,0,.3,1) both;animation-delay:calc(var(--i) * .2s)}
@keyframes zeichnen{from{clip-path:inset(-50% 100% -50% -5%)}to{clip-path:inset(-50% -5% -50% -5%)}}
.fm-namen-block .fm-ersatz{font-size:clamp(18px,2vw,21px)}
.fm-schmerzen{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px 48px;max-width:1000px;width:100%;margin-top:4px}
.fm-schmerz{display:grid;gap:14px;justify-items:center;align-content:start}
.fm-schmerz .fm-namen{font-size:clamp(22px,2.4vw,26px)}
.fm-schmerz>p:last-child{color:var(--gedaempft);font-size:16px;max-width:30ch}
@media (max-width:760px){.fm-schmerzen{grid-template-columns:minmax(0,1fr)}}

/* Stapel */
.fm-stapel{margin-top:36px;border-top:1.5px solid var(--text)}
.fm-posten{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 24px;padding:18px 0;border-bottom:1px solid var(--linie);align-items:baseline}
.fm-posten .fm-was{font-size:17px;font-weight:500}
.fm-posten .fm-wer{font-size:14px;color:var(--gedaempft);grid-column:1}
.fm-posten .fm-preis{grid-column:2;grid-row:1/span 2;font-size:17px;font-variant-numeric:tabular-nums;color:var(--gedaempft);text-decoration:line-through;text-decoration-color:var(--strich);text-decoration-thickness:2px;white-space:nowrap}
.fm-summe{display:flex;justify-content:space-between;align-items:baseline;gap:8px 24px;padding-top:24px;flex-wrap:wrap}
.fm-summe .fm-was{font-size:clamp(20px,2.6vw,26px);font-weight:500;letter-spacing:-.02em}
.fm-summe .fm-preis{font-size:clamp(34px,5vw,48px);font-weight:500;letter-spacing:-.03em;line-height:1;white-space:nowrap}
.fm-summe .fm-preis small{font-size:16px;color:var(--gedaempft);letter-spacing:0;font-weight:400}
.fm-gratis{margin-top:20px;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:24px 26px;border-radius:20px;background:var(--flaeche);border:1.5px solid var(--erfolg)}
.fm-gratis .fm-name{font:500 12px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--erfolg)}
.fm-gratis p{margin-top:8px;font-size:15.5px;max-width:52ch}
.fm-gratis .fm-betrag{font-size:clamp(30px,4vw,40px);font-weight:500;letter-spacing:-.03em;white-space:nowrap;color:var(--erfolg)}
.fm-summe .fm-was small{display:block;font-size:14px;color:var(--gedaempft);letter-spacing:0;font-weight:400;margin-top:4px}
.fm-summe.fm-mehr{padding:22px 4px 0}
.fm-summe.fm-mehr .fm-preis{font-size:clamp(28px,4vw,40px)}
.fm-quelle{margin-top:16px;font-size:13px;color:var(--gedaempft)}

/* Prompt */
.fm-prompt{margin-top:32px;background:var(--flaeche);border:1.5px solid var(--linie);border-radius:16px;overflow:hidden}
.fm-prompt pre{margin:0;padding:20px;font:400 14.5px/1.65 var(--mono);white-space:pre-wrap;color:var(--text)}
.fm-prompt pre mark{background:var(--akzentSanft);color:var(--akzent);border-radius:4px;padding:0 3px}
.fm-prompt .fm-unten{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 12px 10px 20px;border-top:1.5px solid var(--linie);background:var(--sanft);flex-wrap:wrap}
.fm-knopf2{min-height:38px;padding:0 16px;border-radius:999px;border:1.5px solid var(--linie);background:var(--flaeche);color:var(--text);font:500 14px var(--schrift);cursor:pointer}

/* Preis kompakt */

/* Bento */
.fm-bento{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:36px}
.fm-kachel{background:var(--flaeche);border:1.5px solid var(--linie);border-radius:22px;padding:24px;display:grid;gap:8px;align-content:start;min-width:0}
.fm-kachel.fm-breit{grid-column:span 2}
.fm-kachel h3{font-size:19px;font-weight:600;letter-spacing:-.01em;margin-top:12px}
.fm-kachel>p{color:var(--gedaempft);font-size:15.5px;max-width:52ch}
.fm-skizze{background:var(--sanft);border-radius:14px;padding:18px;min-height:132px;display:grid;align-content:center;gap:12px}
.fm-adresse{grid-auto-flow:column;justify-content:start;align-items:center;gap:8px;font:500 14px var(--mono);color:var(--gedaempft)}
.fm-adresse>*{align-self:center}
.fm-adresse span{background:var(--flaeche);border:1.5px solid var(--linie);border-radius:999px;padding:8px 14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.fm-adresse b{color:var(--text);font-weight:600}
.fm-adresse svg{color:var(--logoGruen);flex:none}
.fm-passwort{grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px}
.fm-p-feld{background:var(--flaeche);border:1.5px solid var(--linie);border-radius:12px;padding:10px 14px;letter-spacing:.2em;font-size:15px}
.fm-p-knopf{background:var(--text);color:var(--knopfText);border-radius:999px;padding:10px 16px;font-size:14px;font-weight:600}
.fm-statistik{grid-template-columns:auto minmax(0,1fr);align-items:end;gap:24px}
.fm-s-zahl b{display:block;font-size:40px;font-weight:500;letter-spacing:-.03em;line-height:1;font-variant-numeric:tabular-nums}
.fm-s-zahl span{font-size:13px;color:var(--gedaempft)}
.fm-s-herkunft{display:grid;gap:9px;align-self:center}
.fm-sh-z{display:grid;grid-template-columns:72px minmax(0,1fr) 40px;align-items:center;gap:10px;font-size:13.5px}
.fm-sh-z i{display:block;height:10px;width:var(--w);border-radius:6px;background:var(--balken)}
.fm-sh-z:first-child i{background:var(--logoBlau)}
.fm-sh-z b{font-weight:600;text-align:right;font-variant-numeric:tabular-nums}
@media (max-width:820px){.fm-bento{grid-template-columns:minmax(0,1fr)}.fm-kachel.fm-breit{grid-column:auto}.fm-dokus{grid-template-columns:minmax(0,1fr)}}

.fm-vielfalt{position:relative;min-height:176px;padding:0;overflow:hidden;background:none;display:block}
.fm-stil{position:absolute;inset:0;border-radius:14px;padding:18px 20px;display:grid;align-content:center;gap:10px;opacity:0;transform:translateY(6px);transition:opacity .5s,transform .5s}
.fm-stil.an{opacity:1;transform:none}
.fm-vielfalt{min-height:196px}
/* A: Essenslieferung, rund und knallig */
.fm-stil-a{background:#e8f8fd;color:#0b2b3a;font-family:"Nunito","Hanken Grotesk",sans-serif}
.fm-lf-karte{display:flex;align-items:center;gap:14px;background:#fff;border-radius:16px;padding:10px 12px;box-shadow:0 4px 14px #00577a1a}
.fm-lf-bild{width:64px;height:64px;border-radius:12px;background:#ffe2b8;display:grid;place-items:center;flex:none}
.fm-lf-text{flex:1;min-width:0}
.fm-lf-text b{display:block;font-weight:800;font-size:16px}
.fm-lf-text span{font-size:13px;color:#4b6a78;font-weight:600}
.fm-lf-stepper{display:flex;align-items:center;gap:10px;font-weight:800;font-size:17px}
.fm-lf-stepper i{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;font-style:normal;background:#d5f1fa;color:#009de0;font-size:20px;line-height:1}
.fm-lf-stepper i.fm-plus{background:#009de0;color:#fff}
.fm-lf-titel{font-weight:900;font-size:21px;letter-spacing:-.01em}
.fm-lf-knopf{background:#009de0;color:#fff;border-radius:12px;padding:10px 14px;font-weight:800;font-size:15px;display:flex;justify-content:space-between}
/* B: Onlineshop, sachlich und grün */
.fm-stil-b{background:#f6f6f4;color:#1a1a1a;font-family:"Manrope","Hanken Grotesk",sans-serif;grid-template-columns:96px minmax(0,1fr);align-items:center;gap:18px}
.fm-sh-bild{width:96px;height:120px;border-radius:10px;background:#e3e1da;display:grid;place-items:center}
.fm-sh-info{display:grid;gap:8px;min-width:0}
.fm-sh-name{font-weight:700;font-size:17px}
.fm-sh-preis{font-size:14px;color:#5c5f62}
.fm-sh-farben{display:flex;gap:6px}
.fm-sh-farben i{width:18px;height:18px;border-radius:50%;box-shadow:inset 0 0 0 1px #0002}
.fm-sh-farben i.an{outline:2px solid #1a1a1a;outline-offset:2px}
.fm-sh-groessen{display:flex;gap:6px}
.fm-sh-groessen b{min-width:34px;height:30px;padding:0 8px;border:1px solid #c9cccf;border-radius:8px;display:grid;place-items:center;font-size:13px;font-weight:600;background:#fff}
.fm-sh-groessen b.an{background:#1a1a1a;color:#fff;border-color:#1a1a1a}
.fm-sh-knopf{background:#008060;color:#fff;border-radius:8px;padding:9px 14px;font-weight:700;font-size:14px;text-align:center}
/* C: Reisemagazin, Papier und Serifen */
.fm-stil-c{background:#f3ece0;color:#2a2118;font-family:"Playfair Display",Georgia,serif;gap:12px}
.fm-mg-kopf{display:flex;justify-content:space-between;align-items:baseline;font:600 11px/1 "Manrope",sans-serif;letter-spacing:.18em;text-transform:uppercase;color:#8b5e34;border-bottom:1px solid #2a211833;padding-bottom:8px}
.fm-mg-frage{font-size:24px;font-style:italic;font-weight:500;line-height:1.1}
.fm-mg-wahl{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.fm-mg-wahl span{display:grid;gap:5px;font:600 10.5px "Manrope",sans-serif;letter-spacing:.14em;text-transform:uppercase}
.fm-mg-wahl em{display:block;height:46px;border-radius:2px}
.fm-mg-wahl .an em{outline:2px solid #2a2118;outline-offset:2px}
.fm-mg-wahl .an{color:#8b5e34}
.fm-st-punkte{position:absolute;right:14px;bottom:12px;display:flex;gap:6px;z-index:2}
.fm-st-punkte i{width:7px;height:7px;border-radius:50%;background:#fff;box-shadow:0 0 0 1px #0004;opacity:.45;transition:opacity .3s}
.fm-st-punkte i.an{opacity:1}

/* Stimme */
.fm-stimme-block{padding-top:clamp(16px,3vw,32px);padding-bottom:0}
.fm-stimme{margin:0 auto;max-width:760px;display:grid;justify-items:center;gap:24px;text-align:center}
.fm-sterne{display:flex;gap:4px;color:var(--logoGelb)}
.fm-sterne svg path{stroke:oklch(0.7 0.13 80);stroke-width:1}
.fm-stimme blockquote{margin:0}
.fm-stimme blockquote p{font-size:clamp(20px,2.4vw,26px);line-height:1.45;letter-spacing:-.01em;text-wrap:balance}
.fm-stimme figcaption{display:flex;align-items:center;gap:14px;text-align:left}
.fm-stimme img{width:56px;height:56px;border-radius:50%;object-fit:cover}
.fm-stimme figcaption b{display:block;font-weight:600}
.fm-stimme figcaption small{font-size:14px;color:var(--gedaempft)}
.fm-stimme figcaption a{color:var(--gedaempft)}

/* Video */
.fm-video{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:28px;align-items:center;padding:16px;border:1.5px solid var(--linie);border-radius:22px;background:var(--flaeche);color:var(--text);text-decoration:none}
.fm-v-bild{position:relative;border-radius:14px;overflow:hidden;aspect-ratio:16/9;max-width:100%}
.fm-v-bild img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .4s}
.fm-video:hover .fm-v-bild img{transform:scale(1.03)}
.fm-v-play{position:absolute;left:50%;top:50%;width:64px;height:64px;margin:-32px 0 0 -32px;border-radius:50%;background:#ffffffee;color:#0d0e1a;display:grid;place-items:center;box-shadow:0 8px 24px #0004;transition:transform .2s}
.fm-v-play svg{margin-left:3px}
.fm-video:hover .fm-v-play{transform:scale(1.08)}
.fm-v-dauer{position:absolute;right:10px;bottom:10px;background:#000c;color:#fff;font:500 12px var(--mono);padding:3px 7px;border-radius:6px}
.fm-v-text{display:grid;gap:10px;padding-right:12px}
.fm-v-text b{font-size:clamp(19px,2.2vw,23px);font-weight:500;letter-spacing:-.02em;line-height:1.2;text-wrap:balance}
.fm-v-satz{color:var(--gedaempft);font-size:15.5px}
.fm-v-link{display:inline-flex;align-items:center;gap:6px;color:var(--akzent);font-weight:600;font-size:15px}
.fm-video:focus-visible{outline:3px solid var(--akzentSanft);outline-offset:3px}
@media (max-width:700px){.fm-video{grid-template-columns:minmax(0,1fr);gap:16px}.fm-v-text{padding:0 4px 6px}}

/* Anleitungen */
.fm-dokus{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 32px;margin-top:28px;border-top:1.5px solid var(--text)}
.fm-doku{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:18px 0;border-bottom:1px solid var(--linie);color:var(--text);text-decoration:none}
.fm-doku b{display:block;font-size:17px;font-weight:500}
.fm-doku small{display:block;font-size:14px;color:var(--gedaempft);margin-top:2px}
.fm-doku svg{flex:none;color:var(--gedaempft);transition:transform .2s,color .2s}
.fm-doku:hover svg{transform:translate(2px,-2px);color:var(--akzent)}
.fm-doku:hover b{color:var(--akzent)}
.fm-doku:focus-visible{outline:3px solid var(--akzentSanft);outline-offset:4px;border-radius:4px}
.fm-quelle a,:where(.fm) details a,.fm-kanal a{color:var(--akzent)}

/* Fragen */
:where(.fm) details{border-bottom:1px solid var(--linie);padding-block:18px}
:where(.fm) details:first-of-type{border-top:1.5px solid var(--text);margin-top:28px}
:where(.fm) summary{cursor:pointer;font-size:17px;font-weight:500;list-style:none;display:flex;justify-content:space-between;gap:16px}
:where(.fm) summary::-webkit-details-marker{display:none}
:where(.fm) summary::after{content:"+";color:var(--gedaempft);font-weight:400}
:where(.fm) details[open] summary::after{content:"–"}
:where(.fm) details p{margin-top:10px;color:var(--gedaempft);max-width:62ch}

.fm-schluss{text-align:center;display:grid;gap:24px;justify-items:center}
.fm-schluss h2{font-size:clamp(34px,5.6vw,60px);letter-spacing:-.035em;line-height:1.02;max-width:16ch}

@media (max-width:640px){
  .fm-gratis{flex-direction:column;align-items:flex-start}
  .fm-dokus{grid-template-columns:minmax(0,1fr)}
  .fm-zeile{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr) 64px 48px}
  .fm-zeile .fm-mailspalte{display:none}
}
@media (prefers-reduced-motion:reduce){.fm *{animation:none!important;transition:none!important}}

/* Gegen die globalen Link-Regeln aus style.css (a:hover färbt blau) */
.fm a.fm-knopf:hover{color:var(--knopfText);opacity:.92}
.fm a.fm-video:hover,.fm a.fm-doku:hover{color:var(--text)}
.fm-quelle a,:where(.fm) details a,.fm-kanal a,.fm-stimme figcaption a{text-decoration:underline;text-underline-offset:2px}

/* Kopf: „Formular veröffentlichen“ ist länger als der übliche Knopf; auf schmalen Handys etwas kompakter (AK-11). */
@media (max-width:420px){.kopf .knopf-rand{padding:10px 16px;font-size:16px}.kopf .knopf-rand svg{display:none}.kopf-rechts{gap:14px}}

/* Ohne Inline-Stile: die Website erlaubt per CSP nur style-src 'self'. */
.fm-i0{--i:0}.fm-i1{--i:1}.fm-i2{--i:2}.fm-i3{--i:3}.fm-i4{--i:4}
.fm-label-abstand{margin-top:56px}
.fm-spalte.fm-spalte-breit{max-width:1040px}
:where(.fm) section.fm-ohne-oben{padding-top:0}
.fm-sh-farben .fm-f1{background:#3f5a4c}.fm-sh-farben .fm-f2{background:#1f2a44}.fm-sh-farben .fm-f3{background:#e8e1d3}
.fm-mg-wahl .fm-ort1{background:linear-gradient(170deg,#9fb7c9,#4d6b80 60%,#e8e2d6 61%,#d9cdb8)}
.fm-mg-wahl .fm-ort2{background:linear-gradient(180deg,#f2c58f,#e9967a 45%,#3f7f9a 46%,#24546b)}
.fm-mg-wahl .fm-ort3{background:linear-gradient(180deg,#e7c9a9,#c98d6b 55%,#6b4a3a 56%,#3e2b22)}
.fm-sh-balken{display:block;width:100%;height:10px}
.fm-sh-balken rect{fill:var(--balken)}
.fm-sh-z:first-child .fm-sh-balken rect{fill:var(--logoBlau)}

/* Preisvergleich als Tabelle; sharepa steht vorne, die erste Spalte bleibt beim Wischen stehen. */
.fm-vgl-rahmen{margin-top:36px;overflow-x:auto;border:1.5px solid var(--linie);border-radius:18px;background:var(--flaeche)}
.fm-vgl{width:100%;min-width:580px;border-collapse:collapse;font-size:14.5px}
.fm-vgl caption.fm-vgl-hinweis{caption-side:bottom;text-align:left;padding:10px 16px 12px;font-size:12.5px;color:var(--gedaempft);border-top:1px solid var(--linie)}
.fm-vgl th,.fm-vgl td{padding:14px 16px;text-align:center;border-top:1px solid var(--linie);vertical-align:middle}
.fm-vgl thead th,.fm-vgl thead td{border-top:0;font-weight:600;font-size:15px;padding-block:18px}
.fm-vgl tbody th{text-align:left;font-weight:500;color:var(--text);width:30%}
.fm-vgl td{color:var(--gedaempft)}
.fm-vgl td small{display:block;font-size:12px;margin-top:2px}
.fm-vgl .fm-ja-z{color:var(--erfolg);font-weight:700;font-size:17px}
.fm-vgl .fm-nein-z{color:var(--strich);font-weight:700;font-size:17px}
.fm-vgl .fm-wir{background:var(--akzentSanft);color:var(--text);font-weight:600}
.fm-vgl thead .fm-wir{color:var(--akzent)}
.fm-vgl .fm-vgl-preis td,.fm-vgl .fm-vgl-preis th{font-weight:600;color:var(--text)}
.fm-vgl .fm-vgl-preis .fm-wir{color:var(--akzent)}
.fm-vgl tbody th,.fm-vgl thead td:first-child{position:sticky;left:0;z-index:1;background:var(--flaeche)}
.fm-gratis{margin-top:24px}
@media (max-width:640px){.fm-vgl tbody th{width:auto;min-width:120px;font-size:13.5px}.fm-vgl th,.fm-vgl td{padding:12px 10px}}

/* ── 100 Termine: Kopf mit mehr Luft, Icons weiter aussen ── */
.fm-termine .fm-hero{padding-block:clamp(72px,12vw,150px) clamp(80px,9vw,120px)}
.fm-termine .fm-k1{left:calc(50% - 660px);top:300px}
.fm-termine .fm-k2{left:calc(50% + 570px);top:250px}
.fm-termine .fm-k3{left:calc(50% - 600px);top:600px}
.fm-termine .fm-k4{left:calc(50% + 540px);top:640px}
.fm-termine .fm-k5{left:calc(50% - 520px);top:90px}
@media (max-width:1340px){.fm-termine .fm-kritzel{display:none}}
/* Szene 2: schlichte Buchungskarte mit Bild */
.fm-termine #fm-s1{background:#dfe5ef}
.fm-bk2{width:100%;max-width:300px;background:#fff;border-radius:14px;overflow:hidden;box-shadow:0 34px 60px -28px #1b2a4a66;font-family:"Manrope","Hanken Grotesk",sans-serif;color:#1d2433}
.fm-bk2-bild{position:relative;aspect-ratio:300/160;background:#ece6df}
.fm-bk2-bild svg{display:block;width:100%;height:100%}
.fm-bk2-zurueck{position:absolute;left:14px;top:14px;color:#1d2433}
.fm-bk2-text{padding:18px 20px 20px;display:grid;gap:16px}
.fm-bk2-text h3{font-size:17px;font-weight:700;letter-spacing:-.01em;line-height:1.2}
.fm-bk2-unter{font-size:12.5px;color:#6b7489}
.fm-bk2-kacheln{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.fm-bk2-k{display:grid;gap:3px;padding:10px;border-radius:8px;background:#f3f5f9;border:1.5px solid transparent;transition:border-color .25s,background .25s}
.fm-bk2-k b{font-size:13.5px;font-weight:700}
.fm-bk2-k small{font-size:11px;color:#6b7489}
.fm-bk2-k.leer b{color:#9aa3b5}
.fm-bk2-k.fokus{border-color:#1d2433;background:#fff}
.fm-bk2-knopf{height:42px;border-radius:6px;background:#171c27;color:#fff;font:700 12.5px "Manrope",sans-serif;letter-spacing:.14em;text-transform:uppercase;display:grid;place-items:center;transition:transform .15s}
.fm-bk2-knopf.druck{transform:scale(.97)}
.fm-bk2-danke{height:42px;border-radius:6px;background:#e9f5ee;color:#1f6b45;display:grid;place-items:center;font-size:13px;font-weight:700}
/* Szene 3: Tag im Google Kalender */
.fm-kal{max-width:640px;margin-inline:auto;display:grid;gap:14px;align-content:center;height:100%}
.fm-kal-kopf{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.fm-kal-kopf b{font-size:18px;font-weight:600}
.fm-kal-tag{position:relative;display:grid;grid-template-rows:repeat(5,52px);border:1.5px solid var(--linie);border-radius:14px;overflow:hidden;background:var(--flaeche)}
.fm-kal-h{border-top:1px solid var(--linie);padding:4px 10px;font:500 11.5px var(--mono);color:var(--gedaempft)}
.fm-kal-h:first-child{border-top:0}
.fm-kal-ev{position:absolute;left:56px;right:12px;border-radius:8px;padding:6px 10px;font-size:13px;display:grid;line-height:1.25}
.fm-kal-ev small{font-size:11.5px}
.fm-kal-grau{background:var(--sanft);color:var(--gedaempft)}
.fm-kal-a{top:3px;height:36px}
.fm-kal-b{top:169px;height:52px}
.fm-kal-neu{top:121px;height:35px;background:#1a5fd0;color:#fff;box-shadow:0 6px 18px -6px #1a5fd080}
.fm-kal-neu b{font-weight:600}
.fm-kal-neu.neu{animation:rein .7s cubic-bezier(.2,.8,.2,1)}
.fm-kal-neu.weg{visibility:hidden}
/* Kachel: drei Buchungsseiten */
.fm-bs-a{background:#141414;color:#f2f2f2;font-family:"Manrope","Hanken Grotesk",sans-serif}
.fm-ba-kopf{display:flex;justify-content:space-between;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:#b5b5b5;font-weight:700}
.fm-ba-frage{font-size:22px;font-weight:700;letter-spacing:-.01em;text-transform:uppercase}
.fm-ba-zeiten{display:flex;gap:8px;flex-wrap:wrap}
.fm-ba-zeiten b{padding:7px 12px;border:1px solid #4a4a4a;border-radius:4px;font-size:13px}
.fm-ba-zeiten b.an{background:#e0a63a;border-color:#e0a63a;color:#141414}
.fm-bs-b{background:#f1ecfb;color:#3b2d63;font-family:"Nunito","Hanken Grotesk",sans-serif}
.fm-yo-titel{font-weight:900;font-size:21px}
.fm-yo-karte{display:flex;justify-content:space-between;align-items:center;gap:12px;background:#fff;border-radius:16px;padding:12px 14px;box-shadow:0 4px 14px #3b2d631a}
.fm-yo-karte b{display:block;font-weight:800;font-size:16px}
.fm-yo-karte small{font-size:13px;color:#6a5a98;font-weight:600}
.fm-yo-knopf{background:#7a57e0;color:#fff;border-radius:999px;padding:8px 14px;font-weight:800;font-size:14px;white-space:nowrap}
.fm-bs-c{background:#f3ece0;color:#2a2118;font-family:"Playfair Display",Georgia,serif;gap:12px}
.fm-kz-woche{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;font:600 11px "Manrope",sans-serif;letter-spacing:.14em;text-transform:uppercase}
.fm-kz-woche span{padding:10px 0;text-align:center;border-bottom:2px solid #2a211822;color:#2a2118a0}
.fm-kz-woche span.fm-frei{color:#2a2118;border-color:#2a2118}
.fm-kz-woche span.an{background:#2a2118;color:#f3ece0}
/* Kachel: belegt/frei */
.fm-belegt{gap:8px}
.fm-bl-z{display:grid;grid-template-columns:28px minmax(0,1fr);align-items:center;gap:10px;font:500 12px var(--mono);color:var(--gedaempft)}
.fm-bl-z i{font-style:normal}
.fm-bl-z em{font-style:normal;height:22px;border-radius:6px;display:flex;align-items:center;padding:0 10px;font:500 12px var(--schrift)}
.fm-bl-b{background:repeating-linear-gradient(135deg,var(--linie) 0 6px,var(--sanft) 6px 12px);color:var(--gedaempft)}
.fm-bl-f{background:var(--erfolgSanft);color:var(--erfolg)}
/* Kachel: Orte */
.fm-orte{display:flex;flex-wrap:wrap;gap:8px;align-content:center}
.fm-orte span{padding:8px 14px;border-radius:999px;background:var(--flaeche);border:1.5px solid var(--linie);font-size:14px;font-weight:500}
.fm-orte span:first-child{border-color:var(--logoBlau);color:var(--logoBlau)}
/* Kachel: Bestätigung */
.fm-bestaetigung{gap:10px}
.fm-be-zeile{display:flex;align-items:center;gap:12px}
.fm-be-ico{width:38px;height:38px;border-radius:10px;background:var(--flaeche);border:1.5px solid var(--linie);display:grid;place-items:center;font-weight:600;font-size:13px;color:var(--logoGruen);flex:none}
.fm-be-zeile b{display:block;font-size:15px;font-weight:600}
.fm-be-zeile small{font-size:13px;color:var(--gedaempft)}
.fm-gratis .fm-betrag small{font-size:16px;color:var(--gedaempft);font-weight:400;letter-spacing:0}
.fm-termine #fm-s1 h3{font-family:"Manrope","Hanken Grotesk",sans-serif;font-weight:700;font-size:17px;letter-spacing:-.01em;line-height:1.2;text-align:left;margin:0}