/* ============================================================
   Grosse Startseite. Alles hier gilt NUR fuer die Startseite.
   Bewegung nach Emil Kowalski: ein gestalteter Moment je Abschnitt,
   exponentielles Ausklingen, Schliessen schneller als Oeffnen,
   und bei prefers-reduced-motion bleibt nichts uebrig ausser Deckkraft.
   ============================================================ */

/* ---------- 1. Auftakt: geschichtete Bildcollage ----------
   Kein Vollbild-Foto mit Text drauf (das sieht jede zweite Campingseite so).
   Stattdessen helles Papier wie auf der Hausseite, daneben zwei versetzte
   Bildtafeln, die als Paar durchgleiten. Beim Scrollen wandern die Ebenen
   unterschiedlich schnell - dadurch die Tiefe. */
.buehne{position:relative; overflow:clip; background:var(--papier); padding-block:var(--s6) 0}
.buehne-raster{display:grid; gap:var(--s5); align-items:start}

.buehne-worte{position:relative; z-index:3}
.buehne h1{
  font-size:clamp(34px,5.4vw,60px); line-height:1.03; letter-spacing:-.035em;
  max-width:16ch; color:var(--tinte); text-wrap:balance;
}
.buehne h1 .sonne{color:#d06a00}
.buehne h1[data-auftakt]{transition:opacity .28s ease; display:flex; align-items:flex-end}
.buehne h1[data-auftakt].wechselt{opacity:0}
.buehne-unter{margin-top:var(--s4); max-width:40ch; font-size:clamp(16px,1.6vw,18.5px); color:var(--neben)}

/* Wegweiser: echte Entfernungen, im Streifenmotiv der Marke */
.wegweiser{
  display:flex; flex-wrap:wrap; gap:0; margin-top:var(--s5);
  border-block:6px solid transparent; border-image:var(--schraffur) 6 repeat;
  padding-block:var(--s3);
}
.wegweiser li{display:flex; align-items:baseline; gap:8px; padding-right:var(--s5)}
.wegweiser b{font-family:var(--schrift-display); font-size:19px; letter-spacing:-.02em; color:var(--tinte); font-variant-numeric:tabular-nums}
.wegweiser span{font-size:13.5px; color:var(--neben)}

/* Die Bildtafeln */
.buehne-tafeln{position:relative; z-index:2; min-height:340px; touch-action:pan-y; cursor:grab}
.buehne-tafeln:active{cursor:grabbing}
.tafel{position:relative}
.tafel-gross, .tafel-klein{position:absolute; overflow:hidden; background:var(--sand-hell); border-radius:var(--r-flaeche)}
.tafel-gross{inset:0 0 auto auto; width:78%; aspect-ratio:4/3; box-shadow:0 30px 60px -40px rgba(34,31,26,.6)}
.tafel-klein{left:0; bottom:-6%; width:44%; aspect-ratio:1/1; border:6px solid var(--karte); box-shadow:0 22px 44px -30px rgba(34,31,26,.7)}
.tafel figure{margin:0; height:100%}
.tafel picture{display:block; height:100%}
.tafel img{width:100%; height:100%; object-fit:cover}

/* Motive liegen uebereinander und werden per Deckkraft getauscht.
   Die kleine Tafel laeuft dabei ein Stueck weiter als die grosse - das ist der
   Parallax-Moment im Wechsel selbst. */
.motiv{position:absolute; inset:0; opacity:0; pointer-events:none;
  transition:opacity 720ms var(--kurve)}
.motiv.an{opacity:1; pointer-events:auto}
.motiv .tafel-gross{transform:translate3d(calc(var(--v,0) * 26px),0,0) scale(1.001);
  transition:transform 900ms var(--kurve)}
.motiv .tafel-klein{transform:translate3d(calc(var(--v,0) * -54px),0,0);
  transition:transform 900ms var(--kurve)}
.motiv.an .tafel-gross,.motiv.an .tafel-klein{--v:0}
.motiv.kommt{--v:1}
.motiv.geht{--v:-1}

/* Der Stempel der Marke, dreht sich langsam mit dem Scrollen */
.stempel{
  position:absolute; z-index:4; right:4%; bottom:8%;
  width:104px; height:104px; border-radius:99px; background:var(--karte);
  display:grid; place-items:center; text-align:center;
  box-shadow:0 16px 34px -22px rgba(34,31,26,.7);
  transform:rotate(calc(-8deg + var(--dreh,0) * 18deg));
}
.stempel b{display:block; font-family:var(--schrift-display); font-size:23px; letter-spacing:-.03em; line-height:1; margin-top:3px}
.stempel span{display:block; font-size:9.5px; letter-spacing:.16em; text-transform:uppercase; color:var(--neben)}
.stempel::before{content:""; position:absolute; inset:7px; border:1px solid var(--sand); border-radius:99px}

/* Bedienung */
.buehne-steuer{display:flex; align-items:center; gap:var(--s3); margin-top:var(--s6); position:relative; z-index:3}
.buehne-titel{font-size:13.5px; color:var(--neben); letter-spacing:.04em; min-width:0; flex:1}
.buehne-punkte{display:flex; gap:7px}
.buehne-punkte button{
  width:30px; height:3px; border:0; padding:0; cursor:pointer; background:var(--linie);
  position:relative; overflow:hidden;
}
.buehne-punkte button[aria-current="true"]::after{
  content:""; position:absolute; inset:0; background:var(--sonne); transform-origin:left;
  animation:punktlauf 6.5s linear forwards;
}
@keyframes punktlauf{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.buehne-pause{
  width:38px;height:38px;border-radius:99px;border:1.5px solid var(--tinte);
  background:var(--karte); color:var(--tinte); display:grid; place-items:center; cursor:pointer;
  transition:background var(--schnell) var(--kurve), transform var(--schnell) var(--kurve);
}
.buehne-pause svg{width:12px;height:12px}
.buehne-pause:active{transform:scale(.94)}
@media (hover:hover) and (pointer:fine){ .buehne-pause:hover{background:var(--sand-weich)} }

.buehne-suche{position:relative; z-index:5; margin-top:var(--s6); padding-bottom:var(--s7)}
/* Entweder Kante oder Erhebung, nicht beides. Die Karte liegt auf Papier,
   also traegt sie der Schatten. */
.buehne-suche .suche{border:0; box-shadow:0 2px 4px -2px rgba(34,31,26,.14), 0 26px 54px -38px rgba(34,31,26,.8)}

/* Auf sehr schmalen Handys bleibt der Bildtitel lesbar. Punkte und Pause
   bekommen eine zweite Zeile, statt den Titel auf drei Wörterzeilen zu quetschen. */
@media (max-width:360px){
  .buehne-steuer{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px var(--s3)}
  .buehne-titel{grid-column:1;grid-row:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .buehne-punkte{grid-column:1;grid-row:2}
  .buehne-punkte button{width:24px}
  .buehne-pause{grid-column:2;grid-row:1 / 3;align-self:center}
}

@media (min-width:900px){
  .buehne{padding-block:var(--s7) 0}
  .buehne-raster{grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr); gap:var(--s7); align-items:center}
  .buehne-tafeln{min-height:520px}
  .buehne-suche{margin-top:calc(var(--s7) * -1 + 8px)}
}
@media (max-width:899px){
  .buehne-tafeln{min-height:0; aspect-ratio:1/1; margin-top:var(--s5); margin-bottom:var(--s6)}
  .tafel-klein{bottom:0; width:48%}
  .stempel{width:82px;height:82px; right:2%; bottom:2%}
  .stempel b{font-size:19px}
}

/* ---------- 2. Tagesaktuelle Belegung ---------- */
.belegung-aktuell{padding-block:var(--s5) 0}
.belegung-klappe{border:1px solid var(--linie);border-top:4px solid var(--gruen);border-radius:var(--r-flaeche);background:var(--karte);overflow:hidden}
.belegung-klappe summary{display:flex;align-items:center;justify-content:space-between;gap:var(--s4);padding:var(--s4) var(--s5);cursor:pointer;list-style:none}
.belegung-klappe summary::-webkit-details-marker{display:none}
.belegung-klappe summary>span:first-child{display:grid;gap:1px}
.belegung-klappe summary small{text-transform:uppercase;letter-spacing:.08em;font-size:11px;font-weight:700;color:var(--gruen)}
.belegung-klappe summary strong{font-family:var(--schrift-display);font-size:clamp(20px,2.4vw,27px);line-height:1.15}
.belegung-klappe summary::after{content:"+";font:700 24px/1 var(--schrift-display);color:var(--gruen)}
.belegung-klappe[open] summary::after{content:"–"}
.belegung-status{margin-left:auto;color:var(--neben);font-size:14px;text-align:right}
.belegung-inhalt{padding:0 var(--s5) var(--s5);border-top:1px solid var(--linie)}
.belegung-inhalt>p{max-width:78ch;color:var(--neben);padding-top:var(--s4)}
.belegung-liste{display:grid;gap:8px;margin-top:var(--s4)}
.belegung-liste li{display:grid;grid-template-columns:12px minmax(0,1fr) auto;align-items:center;gap:10px;min-height:42px;padding:8px 10px;background:var(--sand-weich);border-radius:var(--r-element);font-size:14px}
.belegung-liste li i{width:10px;height:10px;border-radius:50%;background:var(--gruen);box-shadow:0 0 0 3px rgba(95,122,63,.14)}
.belegung-liste li b{font-size:12px;color:#355022;text-align:right}
.belegung-liste li[data-lage="knapp"] i{background:var(--sonne);box-shadow:0 0 0 3px rgba(248,154,52,.17)}
.belegung-liste li[data-lage="knapp"] b{color:#8b4b08}
.belegung-liste li[data-lage="voll"] i{background:#9b5141;box-shadow:0 0 0 3px rgba(155,81,65,.14)}
.belegung-liste li[data-lage="voll"] b{color:#7d372a}
.belegung-liste li[data-lage="unbekannt"] i{background:#7a8583;box-shadow:0 0 0 3px rgba(122,133,131,.14)}
.belegung-liste li[data-lage="unbekannt"] b{color:var(--neben)}
.belegung-liste .belegung-laedt,.belegung-liste .belegung-hinweis{display:block;color:var(--neben);grid-column:1/-1}
.belegung-fuss{display:flex;align-items:center;justify-content:space-between;gap:var(--s4);margin-top:var(--s4)}
.belegung-fuss small{color:var(--neben)}
@media (min-width:760px){.belegung-liste{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1080px){.belegung-liste{grid-template-columns:repeat(5,minmax(0,1fr))}.belegung-liste li{grid-template-columns:12px minmax(0,1fr)}.belegung-liste li b{grid-column:2;text-align:left;font-weight:400}}
@media (max-width:640px){.belegung-klappe summary{padding:14px var(--s4)}.belegung-status{display:none}.belegung-inhalt{padding:0 var(--s4) var(--s4)}.belegung-fuss{align-items:stretch;flex-direction:column}.belegung-fuss .knopf{width:100%}}

/* ---------- 3. Verfuegbarkeitsband ---------- */
.band-frei{padding-block:var(--s6)}
.band-frei h2{font-size:clamp(21px,2.4vw,26px)}
.wochen{
  display:grid; grid-auto-flow:column; grid-auto-columns:minmax(118px,1fr);
  gap:var(--s2); margin-top:var(--s4); overflow-x:auto; overscroll-behavior-inline:contain;
  padding-bottom:var(--s2); scroll-snap-type:x proximity;
}
.woche{
  scroll-snap-align:start; text-align:left; cursor:pointer;
  border:1px solid var(--linie); border-radius:var(--r-element); background:var(--karte);
  padding:12px; display:grid; gap:6px; min-height:86px;
  transition:border-color var(--mittel) var(--kurve), transform var(--mittel) var(--kurve), background var(--mittel) var(--kurve);
}
.woche b{font-size:14px; font-weight:600}
.woche small{color:var(--neben); font-size:12.5px}
.woche .balken{height:5px; border-radius:99px; background:var(--linie); overflow:hidden}
.woche .balken i{display:block; height:100%; border-radius:99px; background:var(--gruen); transform-origin:left;
  animation:balken-auf 620ms var(--kurve) both}
@keyframes balken-auf{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.woche[data-lage="knapp"] .balken i{background:var(--akzent)}
.woche[data-lage="voll"] .balken i{background:var(--linie-weich)}
.woche[data-lage="voll"]{opacity:.62}
.woche:active{transform:translateY(1px)}
@media (hover:hover) and (pointer:fine){
  .woche:hover{border-color:var(--linie-weich); background:var(--weich)}
}
.wochen-laedt{color:var(--neben); font-size:15px; margin-top:var(--s4)}

/* ---------- 3. Tagesverlauf: stehendes Bild, wechselnder Text ---------- */
.tag{background:var(--tiefe); color:#fff; padding-block:var(--s8)}
.tag-raster{display:grid; gap:var(--s6)}
.tag-bilder{
  position:relative; border-radius:var(--r-flaeche); overflow:hidden;
  aspect-ratio:4/5; background:#0e1c1e;
}
/* Nur die direkten Kinder sind die Bildebenen. Das Bildwerkzeug legt darin eine
   eigene <figure> ab - die darf NICHT mit ausgeblendet werden (war schwarz). */
.tag-bilder > figure{position:absolute; inset:0; margin:0; opacity:0; transition:opacity 700ms var(--kurve), transform 900ms var(--kurve); transform:scale(1.04)}
.tag-bilder > figure.an{opacity:1; transform:none}
.tag-bilder > figure > figure{position:static; height:100%; margin:0; opacity:1; transform:none}
.tag-bilder picture{display:block;height:100%}
.tag-bilder img{width:100%;height:100%;object-fit:cover}
.tag-schritte{display:grid; gap:var(--s5); align-content:center}
.tag-schritt{
  padding:var(--s5) 0 var(--s5) var(--s5); border-left:1px solid rgba(255,255,255,.18);
  opacity:.72; transition:opacity 420ms var(--kurve), border-color 420ms var(--kurve);
}
.tag-schritt.an{opacity:1; border-color:var(--akzent)}
.tag-schritt h3{color:#fff; font-size:clamp(20px,2.4vw,27px)}
.tag-schritt p{margin-top:10px; color:#c9d5d3; max-width:46ch}
.tag-zeit{display:block; font-size:13px; color:#ffb184; margin-bottom:8px; font-variant-numeric:tabular-nums}
@media (min-width:900px){
  .tag-raster{grid-template-columns:.95fr 1.05fr; gap:var(--s7); align-items:center}
  .tag-bilder{position:sticky; top:104px; aspect-ratio:4/5}
  .tag-schritte{gap:var(--s8); padding-block:18vh}
}

/* ---------- 4. Platzplan: Entdecken und direkt freie Plaetze sehen ---------- */
.plan-aktionen{display:flex;flex-wrap:wrap;gap:var(--s3);margin-top:var(--s4)}
.plan-aktionen .knopf{min-height:48px}
.planfeld{position:relative;display:grid;gap:var(--s4);align-items:start}
.planfeld .bildbereich{position:relative; border-radius:var(--r-flaeche); overflow:hidden; background:var(--karte); border:1px solid var(--linie)}
.planfeld img{width:100%; display:block}
.marke-plan{
  position:absolute; transform:translate(-50%,-50%); z-index:2;
  width:30px;height:30px;border-radius:99px;border:0; cursor:pointer;
  background:var(--aktion); color:#fff; display:grid; place-items:center;
  box-shadow:0 2px 6px -2px rgba(26,26,26,.5);
  transition:transform var(--mittel) var(--kurve);
}
.marke-plan span{font-size:13px;font-weight:700;line-height:1}
.marke-plan::before{
  content:""; position:absolute; inset:-7px; border-radius:99px;
  border:2px solid var(--aktion); opacity:.42;
  animation:puls 2.6s var(--kurve) infinite;
}
@keyframes puls{0%{transform:scale(.8);opacity:.5}70%{transform:scale(1.25);opacity:0}100%{opacity:0}}
.marke-plan[aria-expanded="true"]{transform:translate(-50%,-50%) scale(1.18)}
.marke-plan[aria-expanded="true"]::before{animation:none; opacity:0}
@media (hover:hover) and (pointer:fine){ .marke-plan:hover{transform:translate(-50%,-50%) scale(1.14)} }
.plan-info{min-width:0;outline:none}
.plan-hinweis{
  border:1px solid var(--linie);border-radius:var(--r-flaeche);background:var(--sand-weich);
  padding:var(--s5);display:flex;gap:var(--s4);align-items:flex-start
}
.plan-hinweis b{font-family:var(--schrift-display);font-size:25px;color:var(--sonne);line-height:1}
.plan-hinweis strong{display:block;font-family:var(--schrift-display);font-size:18px;line-height:1.2}
.plan-hinweis p{margin-top:7px;color:var(--neben);font-size:14.5px}
.plan-karte{
  position:relative;border:1px solid var(--linie);border-radius:var(--r-flaeche);
  background:var(--karte);overflow:hidden;display:grid
}
.plan-karte-bild{aspect-ratio:16/10;overflow:hidden;background:var(--sand-hell)}
.plan-karte-bild picture{display:block;height:100%}
.plan-karte-bild img{width:100%;height:100%;object-fit:cover}
.plan-karte-inhalt{padding:var(--s4);display:grid;gap:10px}
.plan-karte-schliessen{
  position:absolute;z-index:2;right:10px;top:10px;width:42px;height:42px;border:0;border-radius:99px;
  display:grid;place-items:center;background:rgba(255,255,255,.94);color:var(--tinte);cursor:pointer;
  box-shadow:0 2px 12px -6px rgba(26,26,26,.65)
}
.plan-karte-schliessen svg{width:15px;height:15px}
.plan-station{font-size:12.5px;color:var(--neben);font-weight:700;letter-spacing:.04em;text-transform:uppercase}
.plan-karte h3{display:flex;align-items:center;gap:9px;font-size:clamp(20px,2vw,24px)}
.plan-karte h3 svg{width:19px;height:19px;color:var(--akzent)}
.plan-karte p{color:var(--neben); font-size:15.5px}
.plan-karte .zeile{display:grid;gap:7px;font-size:14px;color:var(--neben)}
.plan-karte .zeile span{display:flex;align-items:flex-start;gap:6px}
.plan-karte .zeile svg{flex:none;margin-top:3px}
.plan-karte-fuss{display:flex;align-items:center;justify-content:space-between;gap:var(--s3);margin-top:3px;padding-top:var(--s3);border-top:1px solid var(--linie)}
.plan-route{display:flex;gap:7px}
.plan-route button{
  width:42px;height:42px;border:1px solid var(--linie);border-radius:var(--r-element);background:var(--karte);
  color:var(--tinte);display:grid;place-items:center;cursor:pointer
}
.plan-route svg{width:12px;height:12px}
@media (hover:hover) and (pointer:fine){
  .plan-route button:hover,.plan-karte-schliessen:hover{background:var(--sand-weich)}
}
@media (min-width:960px){
  .planfeld{grid-template-columns:minmax(0,1.9fr) minmax(290px,.78fr)}
  .plan-info{position:sticky;top:96px}
}
@media (max-width:959px){
  .plan-info.ist-offen{
    position:fixed;z-index:80;left:8px;right:8px;bottom:max(8px,env(safe-area-inset-bottom));
    max-height:calc(100svh - 24px);overflow:auto;overscroll-behavior:contain;
    border-radius:var(--r-flaeche);box-shadow:0 24px 70px -20px rgba(26,26,26,.72)
  }
  .plan-info.ist-offen .plan-karte{border:0}
  body.plan-offen{overflow:hidden}
  body.plan-offen::before{content:"";position:fixed;z-index:79;inset:0;background:rgba(26,26,26,.52)}
}
@media (prefers-reduced-motion:no-preference){
  .plan-karte{animation:karte-rein 240ms var(--kurve)}
  @keyframes karte-rein{from{opacity:0; transform:translateY(6px)}to{opacity:1; transform:none}}
}

/* ---------- 5. Zahlen, die hochlaufen ---------- */
.zahlenband{padding-block:var(--s7)}
.zahlenband ul{display:grid; gap:var(--s5); grid-template-columns:repeat(2,1fr)}
@media (min-width:860px){ .zahlenband ul{grid-template-columns:repeat(4,1fr)} }
.zahlenband b{
  display:block; font-family:var(--schrift-display); font-size:clamp(34px,5vw,54px);
  letter-spacing:-.03em; line-height:1; font-variant-numeric:tabular-nums;
}
.zahlenband span{display:block; margin-top:8px; color:var(--neben); font-size:15px; max-width:22ch}
.zahlenband svg{width:clamp(32px,4vw,44px);height:clamp(32px,4vw,44px);color:var(--akzent); margin-bottom:16px}

/* ---------- 7. Kopfzeile verdichtet sich ---------- */
.kopf{transition:box-shadow var(--mittel) var(--kurve), background var(--mittel) var(--kurve)}
.kopf[data-gescrollt="ja"]{box-shadow:0 1px 0 var(--linie), 0 10px 24px -22px rgba(26,26,26,.6)}
/* Kein Hoehen-Uebergang: das waere eine Layout-Animation und ruckelt beim
   Scrollen. Die Kopfzeile wird ueber Deckkraft und Schatten leiser, die
   Zweitzeile verschwindet ohne Sprung (max-height statt height). */
.kopf[data-gescrollt="ja"] .marke small{opacity:0; transform:translateY(-4px)}
.marke small{transition:opacity var(--schnell) var(--kurve), transform var(--schnell) var(--kurve)}

@media (prefers-reduced-motion:reduce){
  .buehne-bild.an img{animation:none; transform:none}
  .buehne-punkte button[aria-current="true"]::after{animation:none; transform:scaleX(1)}
  .marke-plan::before{animation:none; opacity:.35}
  .woche .balken i{animation:none}
  [data-auftauchen]{opacity:1; transform:none; filter:none}
}


/* ---------- 8. Banderole: echtes Parallax im Bildausschnitt ----------
   Das Bild ist hoeher als der Rahmen und wandert darin gegen die Scrollrichtung. */
.banderole{position:relative; overflow:hidden; height:clamp(300px,54vh,540px); background:var(--tiefe)}
.banderole .schicht{position:absolute; inset:-14% 0; will-change:transform}
.banderole figure{margin:0; height:100%}
.banderole picture{display:block; height:100%}
.banderole img{width:100%; height:100%; object-fit:cover}
.banderole::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(to right, rgba(24,21,17,.72), rgba(24,21,17,.30) 52%, rgba(24,21,17,.05));
}
.banderole-worte{position:absolute; inset:auto 0 0 0; z-index:2; padding-block:var(--s6); color:#fff}
.banderole-worte p{max-width:34ch; font-family:var(--schrift-display); font-weight:700;
  font-size:clamp(22px,3.2vw,36px); line-height:1.12; letter-spacing:-.025em}
.banderole-worte small{display:block; margin-top:10px; font-size:14px; color:#e6ded0; font-family:var(--schrift-text); font-weight:400; letter-spacing:0}

/* Schraffur als Abschnittstrenner, das Streifenmotiv der Marke */
.trennschraffur{height:6px; background:var(--schraffur)}

/* ---------- Google-Bewertungen ----------
   Nur sichtbar. KEIN Review- oder AggregateRating-Schema daraus bauen,
   das verbieten Googles Richtlinien fuer fremde Bewertungen (ERRORS.md E465). */
.stimmen{padding-block:var(--s7)}
.stimmen-kopf{display:flex; flex-wrap:wrap; align-items:baseline; gap:var(--s3) var(--s5); margin-bottom:var(--s5)}
.stimmen-wert{display:flex; align-items:baseline; gap:10px}
.stimmen-wert b{font-family:var(--schrift-display); font-size:clamp(30px,4vw,44px); letter-spacing:-.03em; line-height:1}
.sterne{display:inline-flex; gap:2px}
.sterne svg{width:17px;height:17px;color:var(--sonne)}
.sterne svg.leer{color:var(--sand); opacity:.85}
.stimmen-kopf small{color:var(--neben); font-size:15px}
.stimmen-liste{display:grid; gap:var(--s4)}
@media (min-width:860px){ .stimmen-liste{grid-template-columns:repeat(3,1fr)} }
.stimme{
  background:var(--karte); border:1px solid var(--linie); border-radius:var(--r-flaeche);
  padding:var(--s5); display:grid; gap:10px; align-content:start;
}
.stimme .oben{display:flex; align-items:center; gap:10px}
.stimme .oben b{font-size:15.5px}
.stimme .oben span{color:var(--neben); font-size:13px; margin-left:auto}
.stimme p{color:#333; font-size:15.5px; line-height:1.6}
.stimme .mehr{color:var(--gold); font-size:14px; text-decoration:underline; text-underline-offset:3px}