/* =====================================================================
   Relaxed – gemeinsame Bausteine für die statischen Landing Pages (Entscheidung 0012, Nachtrag 2026-10-07):
   zentraler Footer (wie auf den Kurs-Sites) und die Seiten aus shared/pages bzw. products/<marke>/pages
   (Impressum, AGB, Datenschutz, Widerruf, Kontakt, Kündigen, Widerrufen). Kopiert nach /assets/relaxed-landing.css
   von core/relaxed/landing.py. Werte wie im Design-System (styles/base.scss), Markenfarben aus assets/tokens.css.
   Kein Bootstrap auf den Landing Pages: die wenigen Formular-Klassen sind hier nachgebaut.
   ===================================================================== */
:root {
  --rxl-surface: #FFFFFF;
  --rxl-surface-2: #F7F8FB;
  --rxl-ink-900: #0F172A;
  --rxl-ink-700: #2B3350;
  --rxl-ink-500: #5A6382;
  --rxl-ink-400: #858FAB;
  --rxl-line: #E3E7F0;
  --rxl-danger: #E5484D;
  --rxl-danger-ink: #A8323A;
  --rxl-brand: var(--rx-brand, #4F46E5);
  --rxl-brand-alt: var(--rx-brand-alt, #7C3AED);
  --rxl-brand-dark: var(--rx-brand-dark, #3730A3);
  --rxl-brand-tint: var(--rx-brand-tint, #EEF2FF);
}

/* ---- Footer (HTML aus core/relaxed/quarto_config.py → footer_html) -------------------------------- */
footer.rx-landing-footer {
  background: var(--rxl-surface-2);
  border-top: 1px solid var(--rxl-line);
  padding: 0;
  color: var(--rxl-ink-700);
  text-align: left;
}
.rx-landing-footer .rx-footer {
  max-width: 960px;
  margin: 0 auto;
  padding: 2.75rem 1.5rem 1.5rem;
  font-size: .9rem;
}
.rx-landing-footer .rx-footer-cols { display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: 2rem; }
.rx-landing-footer .rx-footer-logo img { height: 2.8rem; width: auto; }
.rx-landing-footer .rx-footer-brand p { margin: .8rem 0 0; max-width: 18rem; color: var(--rxl-ink-500); line-height: 1.55; }
.rx-landing-footer .rx-footer-title {
  margin: 0 0 .7rem; font-size: .75rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase;
  color: var(--rxl-ink-900);
}
.rx-landing-footer .rx-footer-col ul { list-style: none; margin: 0; padding: 0; }
.rx-landing-footer .rx-footer-col li { margin: 0 0 .45rem; }
.rx-landing-footer .rx-footer a { color: var(--rxl-ink-500); text-decoration: none; }
.rx-landing-footer .rx-footer a:hover { color: var(--rxl-brand-dark); }
.rx-landing-footer .rx-footer-vertraege { display: flex; flex-wrap: wrap; gap: .6rem .75rem; margin: 2rem 0 0; }
.rx-landing-footer .rx-footer a.rx-footer-vertrag {
  display: inline-flex; align-items: center; padding: .42rem 1rem; border: 1.5px solid var(--rxl-danger-ink);
  border-radius: 999px; background: var(--rxl-surface); color: var(--rxl-danger-ink); font-weight: 700; line-height: 1.3;
}
.rx-landing-footer .rx-footer a.rx-footer-vertrag:hover,
.rx-landing-footer .rx-footer a.rx-footer-vertrag:focus-visible {
  background: color-mix(in srgb, var(--rxl-danger) 9%, var(--rxl-surface)); color: var(--rxl-danger-ink);
}
.rx-landing-footer .rx-footer-vertraege + .rx-footer-copy { margin-top: 1.25rem; }
.rx-landing-footer .rx-footer-copy {
  margin: 2.25rem 0 0; padding-top: 1.1rem; border-top: 1px solid var(--rxl-line); font-size: .82rem; color: var(--rxl-ink-400);
}
@media (max-width: 767.98px) {
  .rx-landing-footer .rx-footer { padding: 2rem 1.25rem 1.25rem; }
  .rx-landing-footer .rx-footer-cols { grid-template-columns: 1fr 1fr; gap: 1.6rem 1.25rem; }
  .rx-landing-footer .rx-footer-brand { grid-column: 1 / -1; }
}

/* ---- Seiten (Rechtliches, Kontakt, Verträge) ------------------------------------------------------ */
.rx-landing-seite { max-width: 820px; margin: 0 auto; padding: 8rem 1.5rem 4rem; color: var(--rxl-ink-700); line-height: 1.7; }
.rx-landing-seite h1 { margin: 0 0 .5rem; font-size: 2.2rem; line-height: 1.2; color: var(--rxl-ink-900); }
.rx-landing-seite .rx-landing-untertitel { margin: 0 0 2rem; font-size: 1.05rem; color: var(--rxl-ink-500); }
.rx-landing-seite h2 { margin: 2.2rem 0 .8rem; font-size: 1.35rem; color: var(--rxl-ink-900); }
.rx-landing-seite h3 { margin: 1.6rem 0 .6rem; font-size: 1.1rem; color: var(--rxl-ink-900); }
.rx-landing-seite a { color: var(--rxl-brand); overflow-wrap: break-word; }
.rx-landing-seite p, .rx-landing-seite li { overflow-wrap: break-word; }
.rx-landing-seite img { max-width: 100%; height: auto; }
@media (max-width: 767.98px) {
  .rx-landing-seite { padding: 6.5rem 1.25rem 3rem; }
  .rx-landing-seite h1 { font-size: 1.75rem; hyphens: auto; overflow-wrap: anywhere; }
}

/* ---- Formulare (Kontakt, Kündigen, Widerrufen; Logik in assets/relaxed/kontakt.js, vertrag.js) ---------- */
.rx-landing-seite .d-none { display: none !important; }
.rx-landing-seite .text-muted { color: var(--rxl-ink-400); }
.rx-landing-seite .fw-normal { font-weight: 400; }
.rx-vertrag, .rx-kontakt { max-width: 34rem; margin: .5rem 0 2rem; }
.rx-vertrag-feld { margin: 0 0 1.15rem; padding: 0; border: 0; min-width: 0; }
.rx-landing-seite .form-label { display: block; margin-bottom: .35rem; font-weight: 600; color: var(--rxl-ink-900); }
.rx-landing-seite legend.form-label { float: none; margin-bottom: .4rem; font-size: 1rem; }
.rx-landing-seite .form-text { margin-top: .3rem; color: var(--rxl-ink-500); font-size: .85rem; }
.rx-landing-seite .form-control, .rx-landing-seite .form-select {
  display: block; width: 100%; box-sizing: border-box; padding: .6rem .8rem; font: inherit; color: var(--rxl-ink-900);
  background: var(--rxl-surface); border: 1px solid var(--rxl-line); border-radius: .6rem;
}
.rx-landing-seite .form-control:focus, .rx-landing-seite .form-select:focus {
  outline: none; border-color: var(--rxl-brand); box-shadow: 0 0 0 .2rem var(--rxl-brand-tint);
}
.rx-landing-seite textarea.form-control { resize: vertical; }
.rx-landing-seite .form-check { display: flex; align-items: flex-start; gap: .55rem; margin-bottom: .35rem; }
.rx-landing-seite .form-check-input { flex-shrink: 0; margin: .35em 0 0; accent-color: var(--rxl-brand); }
.rx-vertrag-datum { max-width: 14rem; }
.rx-landing-seite .alert { padding: .75rem 1rem; border-radius: .6rem; font-size: .9rem; margin-bottom: 1rem; }
.rx-landing-seite .alert-danger { background: color-mix(in srgb, var(--rxl-danger) 9%, #fff); color: var(--rxl-danger-ink); }
.rx-landing-seite .rx-btn {
  display: inline-flex; align-items: center; gap: .5rem; padding: .66rem 1.3rem; border-radius: 999px; font: inherit;
  font-size: .94rem; font-weight: 600; text-decoration: none; border: 1px solid transparent; cursor: pointer;
  transition: transform .18s ease, filter .18s ease, border-color .18s ease;
}
.rx-landing-seite .rx-btn-primary {
  background: linear-gradient(135deg, var(--rxl-brand), var(--rxl-brand-alt)); color: #fff;
  box-shadow: 0 3px 14px color-mix(in srgb, var(--rxl-brand) 30%, transparent);
}
.rx-landing-seite .rx-btn-primary:hover { transform: translateY(-2px); filter: brightness(1.07); }
.rx-landing-seite .rx-btn-ghost { background: var(--rxl-surface); color: var(--rxl-ink-900); border-color: var(--rxl-line); }
.rx-landing-seite .rx-btn:disabled { opacity: .65; cursor: progress; }
.rx-vertrag-submit { background: var(--rxl-danger-ink); color: #fff; }
.rx-vertrag-submit:hover { filter: brightness(1.1); }
.rx-kontakt-danke, .rx-vertrag-beleg {
  padding: 1.2rem 1.35rem; border: 1px solid var(--rxl-line); border-radius: 1rem; background: var(--rxl-surface-2);
}
.rx-kontakt-danke p { margin: 0; }
.rx-kontakt-danke p:first-child, .rx-vertrag-beleg-titel { font-weight: 700; color: var(--rxl-ink-900); outline: none; }
.rx-vertrag-beleg-titel { margin: 0 0 .5rem; font-size: 1.2rem; }
.rx-vertrag-daten { display: grid; grid-template-columns: minmax(8rem, max-content) 1fr; gap: .35rem 1.2rem; margin: 1.1rem 0 1.3rem; }
.rx-vertrag-daten dt { font-weight: 600; color: var(--rxl-ink-700); }
.rx-vertrag-daten dd { margin: 0; overflow-wrap: anywhere; }
.rx-vertrag-aktionen { display: flex; flex-wrap: wrap; gap: .6rem; }
@media (max-width: 575.98px) {
  .rx-vertrag-daten { grid-template-columns: 1fr; }
  .rx-vertrag-daten dd { margin-bottom: .45rem; }
}
@media print {
  .navbar, footer, .scroll-top { display: none !important; }
  .rx-landing-seite { padding-top: 0; }
  .rx-vertrag-beleg { border: 0; padding: 0; background: none; }
}