/* Rechtsseiten der Landingpage (Impressum, Datenschutz, Buchungsrichtlinien), 19.09.2026.
   Schweizer Raster: 12 Spalten, harte Haarlinien, Ziffern als Ankerpunkt links.
   Schriften und Farben kommen unveraendert aus stil.css -- keine zweite Schriftfamilie. */

.rp{--spalten:12;--gasse:24px}
.rp main{max-width:var(--breite);margin:0 auto;padding:0 var(--rand) 160px}

/* Kopf: nur Wortmarke und Rueckweg. Die Leiste sitzt auf der Grundlinie des Rasters. */
.rp-kopf{max-width:var(--breite);margin:0 auto;padding:28px var(--rand);
  display:flex;align-items:baseline;justify-content:space-between;gap:24px}
.rp-marke{font-family:Oswald,Impact,sans-serif;font-weight:300;font-size:18px;letter-spacing:.42em;
  text-indent:.42em;text-decoration:none;color:var(--tinte)}
.rp-zurueck{font-family:Inter,system-ui,sans-serif;font-size:11px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--grau);text-decoration:none}
.rp-zurueck:hover{color:var(--tinte)}

/* Titelfeld: Kicker, Titel ueber acht Spalten, rechts die drei Seiten als Register */
.rp-titel{display:grid;grid-template-columns:repeat(var(--spalten),minmax(0,1fr));gap:var(--gasse);
  border-top:1px solid var(--tinte);padding-top:20px;margin-bottom:96px}
.rp-titel .rp-kicker{grid-column:1 / 3}
.rp-titel h1{grid-column:3 / 11;font-size:clamp(30px,5.2vw,72px);line-height:1.02;letter-spacing:-.015em;
  margin:0 0 10px;max-width:14ch;hyphens:auto;overflow-wrap:break-word}   /* "Datenschutzerklaerung" ragte bei 320 px 15 px hinaus */
.rp-stand{grid-column:3 / 11;font-family:Inter,system-ui,sans-serif;font-size:11px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--grau)}
.rp-kicker{font-family:"DM Mono",ui-monospace,monospace;font-weight:500;font-size:11px;letter-spacing:.22em;
  text-transform:uppercase;color:var(--grau);margin:0}

/* Register der drei Seiten, rechte zwei Spalten, untereinander wie ein Inhaltsverzeichnis */
.rp-seiten{grid-column:11 / 13;display:flex;flex-direction:column;gap:10px;align-self:start}
.rp-seiten a{font-family:"DM Mono",ui-monospace,monospace;font-size:11px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--grau);text-decoration:none;padding-bottom:9px;border-bottom:1px solid var(--linie)}
.rp-seiten a:hover{color:var(--tinte)}
.rp-seiten a[aria-current]{color:var(--tinte);border-bottom-color:var(--tinte)}

/* Abschnitt: Ziffer, Titel, Text -- drei Felder auf einer Linie */
.rp-abschnitt{display:grid;grid-template-columns:repeat(var(--spalten),minmax(0,1fr));gap:var(--gasse);
  border-top:1px solid var(--linie);padding:28px 0 56px}
.rp-abschnitt .rp-nr{grid-column:1 / 2;font-family:"DM Mono",ui-monospace,monospace;font-weight:500;font-size:11px;
  letter-spacing:.14em;color:var(--grau);margin:0}
.rp-abschnitt h2{grid-column:2 / 6;font-size:26px;line-height:1.2;letter-spacing:-.005em;margin:0;
  padding-right:24px;text-wrap:balance}
.rp-text{grid-column:6 / 12;display:flex;flex-direction:column;gap:14px;max-width:62ch}
.rp-text p{font-size:17px;line-height:1.66;color:var(--text)}
.rp-text a{color:var(--tinte);text-underline-offset:3px}

/* Zahlenwerk (Stornostaffel): zwei Spalten, Zeile fuer Zeile, Ziffern in Mono */
.rp-staffel{display:flex;flex-direction:column;gap:0;margin:4px 0}
.rp-staffel div{display:flex;justify-content:space-between;align-items:baseline;gap:20px;
  border-top:1px solid var(--linie);padding:10px 0}
.rp-staffel div:last-child{border-bottom:1px solid var(--linie)}
.rp-staffel dt,.rp-staffel span:first-child{font-size:16px;color:var(--text)}
.rp-staffel .rp-wert{font-family:"DM Mono",ui-monospace,monospace;font-size:13px;letter-spacing:.06em;color:var(--tinte);
  white-space:nowrap;flex:0 0 auto}   /* "100 %" darf nie umbrechen (Michael 20.09.2026) */
.rp-staffel div span:first-child{flex:1 1 auto;min-width:0}

/* Fuss: Haarlinie, links Anschrift, rechts die Geschwisterseiten */
.rp-fuss{border-top:1px solid var(--tinte);margin-top:40px;padding-top:20px;
  display:grid;grid-template-columns:repeat(var(--spalten),minmax(0,1fr));gap:var(--gasse)}
.rp-fuss p{grid-column:1 / 7;font-family:Inter,system-ui,sans-serif;font-size:11px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--grau)}
.rp-fuss nav{grid-column:9 / 13;display:flex;gap:20px;justify-content:flex-end;flex-wrap:wrap}
.rp-fuss nav a{font-family:Inter,system-ui,sans-serif;font-size:11px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--grau);text-decoration:none}
.rp-fuss nav a:hover{color:var(--tinte)}

@media (max-width:1180px){
  .rp-abschnitt h2{grid-column:2 / 7}
  .rp-text{grid-column:7 / 13}
  /* Register braucht vier Spalten: in zwei passt "Buchungsrichtlinien" nicht und schiebt
     die Seite 13 px ueber den Rand (gemessen bei 810 px, 20.09.2026). */
  .rp-titel h1{grid-column:3 / 9}
  .rp-seiten{grid-column:9 / 13}
}
@media (max-width:809px){
  .rp main{padding:0 20px 96px}
  .rp-kopf{padding:20px}
  .rp-titel{margin-bottom:56px}
  .rp-titel h1,.rp-stand,.rp-titel .rp-kicker,.rp-seiten{grid-column:1 / 13}
  .rp-seiten{flex-direction:row;flex-wrap:wrap;gap:8px 20px;margin-top:28px}
  .rp-seiten a{border-bottom:0;padding:0}
  .rp-seiten a[aria-current]{border-bottom:1px solid var(--tinte)}
  .rp-abschnitt{padding:20px 0 40px;gap:10px}
  .rp-abschnitt .rp-nr{grid-column:1 / 13}
  .rp-abschnitt h2{grid-column:1 / 13;padding-right:0;font-size:23px}
  .rp-text{grid-column:1 / 13}
  .rp-staffel div{gap:12px}
  .rp-staffel dt,.rp-staffel span:first-child{font-size:15px}
  .rp-fuss p,.rp-fuss nav{grid-column:1 / 13}
  .rp-fuss nav{justify-content:flex-start}
}