/* ============================================================
   Fensterreinigung Pro — legal.css  (Impressum & Datenschutz)
   Uses --fw-* design tokens from main.css
   ============================================================ */

.page-legal { background: var(--fw-bg); }

/* ---------- Hero ---------- */
.leg-hero {
  padding: 54px 0 38px;
  background:
    radial-gradient(820px 340px at 88% -20%, rgba(20,187,188,.13), transparent 60%),
    radial-gradient(680px 300px at 4% 0%, rgba(14,123,214,.11), transparent 55%);
}
.leg-hero__container { max-width: 840px; margin: 0 auto; padding: 0 26px; }
.leg-hero__breadcrumb { display: flex; align-items: center; gap: 9px; font-size: 13.5px; color: var(--fw-muted); margin-bottom: 18px; }
.leg-hero__breadcrumb a { color: var(--fw-primary); font-weight: 600; }
.leg-hero__breadcrumb-sep { opacity: .5; }
.leg-hero__title { font-size: clamp(28px, 4vw, 42px); font-weight: 800; letter-spacing: -.02em; }
.leg-hero__subtitle { margin-top: 12px; color: var(--fw-ink-2); font-size: 16px; line-height: 1.6; }

/* ---------- Main ---------- */
.leg-main { padding: 40px 0 70px; }
.leg-main__container { max-width: 840px; margin: 0 auto; padding: 0 26px; }
.leg-content { display: flex; flex-direction: column; gap: 30px; }

.leg-section { padding: 0; scroll-margin-top: 90px; }
.leg-section__title { font-size: clamp(20px, 2.6vw, 26px); margin-bottom: 16px; color: var(--fw-ink); }

.leg-card { background: #fff; border: 1px solid var(--fw-line); border-radius: var(--fw-r); padding: 24px 26px; box-shadow: var(--fw-sh-sm); margin-bottom: 14px; }
.leg-card:last-child { margin-bottom: 0; }
.leg-card__title { font-size: 17px; margin-bottom: 12px; color: var(--fw-ink); }
.leg-card__body { color: var(--fw-ink-2); font-size: 15px; line-height: 1.75; }
.leg-card__body p { margin: 0 0 12px; }
.leg-card__body p:last-child { margin-bottom: 0; }
.leg-card__body strong { color: var(--fw-ink); }
.leg-card__body em { color: var(--fw-muted); font-style: italic; }

/* Lists (re-enable markers over global reset) */
.leg-list { list-style: disc; padding-left: 1.5em; margin: 6px 0 0; }
.leg-list li { margin: .45em 0; }
.leg-list li::marker { color: var(--fw-primary); }
.leg-list--numbered { list-style: decimal; }
.leg-list--check { list-style: none; padding-left: 0; }
.leg-list--check li { position: relative; padding-left: 30px; }
.leg-list--check li::marker { content: none; }
.leg-list--check li::before {
  content: ""; position: absolute; left: 4px; top: 7px; width: 14px; height: 8px;
  border-left: 2.5px solid var(--fw-accent-d); border-bottom: 2.5px solid var(--fw-accent-d);
  transform: rotate(-45deg);
}

/* Table of contents */
.leg-toc { list-style: none; display: grid; grid-template-columns: 1fr 1fr; gap: 8px 24px; }
.leg-toc li { margin: 0; }
.leg-link { color: var(--fw-primary); font-weight: 600; text-decoration: none; }
.leg-link:hover { text-decoration: underline; }

/* Contact rows */
.leg-contact { display: flex; flex-direction: column; gap: 12px; }
.leg-contact__item { display: flex; flex-wrap: wrap; gap: 4px 12px; }
.leg-contact__label { min-width: 120px; font-weight: 700; color: var(--fw-ink); font-size: 14.5px; }
.leg-contact__value { color: var(--fw-ink-2); font-size: 14.5px; }
a.leg-contact__value { color: var(--fw-primary); font-weight: 600; }

/* Highlight callouts */
.leg-highlight { background: var(--fw-primary-soft); border: 1px solid #BFE0F7; border-left: 4px solid var(--fw-primary); border-radius: var(--fw-r); padding: 22px 26px; color: var(--fw-ink-2); font-size: 15px; line-height: 1.75; }
.leg-highlight p { margin: 0 0 10px; }
.leg-highlight p:last-child { margin-bottom: 0; }
.leg-highlight__title { font-family: var(--fw-display); font-weight: 700; font-size: 17px; color: var(--fw-ink); }
.leg-highlight--info { background: var(--fw-accent-soft); border-color: #BEEAE8; border-left-color: var(--fw-accent-d); }

.leg-note { margin-top: 12px; font-size: 13px; color: var(--fw-muted); font-style: italic; }
.leg-footer-note { margin-top: 16px; padding: 18px 22px; background: var(--fw-surface-2); border: 1px solid var(--fw-line); border-radius: var(--fw-r); font-size: 14px; color: var(--fw-ink-2); }
.leg-footer-note p { margin: 0 0 6px; }
.leg-footer-note p:last-child { margin-bottom: 0; }

/* ---------- Responsive ---------- */
@media (max-width: 768px) {
  .leg-hero { padding: 40px 0 30px; }
  .leg-main { padding: 30px 0 54px; }
  .leg-content { gap: 24px; }
  .leg-toc { grid-template-columns: 1fr; }
}
@media (max-width: 480px) {
  .leg-hero__container, .leg-main__container { padding-left: 18px; padding-right: 18px; }
  .leg-card { padding: 20px; }
  .leg-highlight { padding: 18px 20px; }
  .leg-contact__label { min-width: 0; }
}