/* ==========================================================================
   Legal pages — Privacy policy, Imprint (Legal notice), Terms & conditions
   ========================================================================== */

.page-legal main {
  background: linear-gradient(90deg, #ffffff 0%, #f5f6ff 100%);
}

/* ---------- Hero ---------- */
.legal-hero { padding-top: 44px; text-align: center; }
.legal-hero .eyebrow { margin-bottom: 10px; }
.legal-hero .h1 { line-height: 64px; }
.legal-hero__date { margin-top: 7px; font-size: 20px; line-height: 28px; color: var(--navy); }

.legal-rule {
  height: 1px;
  margin-top: 40px;
  background: var(--blue);
  transform-origin: center;
  transition: transform 1.4s var(--ease-out) 0.25s, opacity 0.6s 0.25s;
}
/* lytra.js drops [data-reveal] once revealed, so only the pre-reveal state is special-cased */
.legal-rule[data-reveal]:not(.is-in) { transform: scaleX(0); }
.page-legal--imprint .legal-rule { margin-top: 39px; }

/* ---------- Body ---------- */
.legal { width: 512px; max-width: 100%; margin: 0 auto; padding: 59px 0 55px; }
.legal__sec { scroll-margin-top: 120px; }
.legal__sec + .legal__sec { margin-top: 62px; }
.legal__h {
  display: flex;
  align-items: baseline;
  padding-left: 0.25em;
  margin-bottom: 18px;
  font-size: 20px;
  line-height: 28px;
  font-weight: 700;
  color: var(--navy);
}
.legal__n { flex: none; min-width: 1.25em; padding-right: 0.3em; }
.legal p { margin-right: -2px; font-size: 20px; line-height: 32px; color: #666666; }
.legal p + p { margin-top: 24px; }
.legal p + p.blank { margin-top: 32px; }
.legal { overflow-wrap: break-word; }
.legal-hero__note { max-width: 560px; margin: 10px auto 0; font-size: 16px; line-height: 24px; color: #666666; }
.legal strong { font-weight: 600; color: var(--navy); }
/* Numbered clauses (terms: "4.1 …") */
.legal__cn { margin-right: 0.45em; font-weight: 600; color: var(--navy); }
/* Bulleted lists inside a section */
.legal p + .legal__list, .legal .legal__list + p { margin-top: 24px; }
.legal__list li { position: relative; padding-left: 1.2em; font-size: 20px; line-height: 32px; color: #666666; }
.legal__list li + li { margin-top: 8px; }
.legal__list li::before { content: ""; position: absolute; left: 0.25em; top: 13px; width: 6px; height: 6px; border-radius: 50%; background: var(--blue); }
html[lang="de"] .legal__list li { -webkit-hyphens: manual; hyphens: manual; }
.legal a { color: inherit; background: linear-gradient(currentColor, currentColor) 0 100% / 0 1px no-repeat; transition: color 0.3s, background-size 0.5s var(--ease-out); }
.legal a:hover { color: var(--blue); background-size: 100% 1px; }

/* Anchor target flash (e.g. terms.html#liability) */
.legal__sec:target .legal__h { animation: legal-flash 1.8s var(--ease-out) 0.6s both; }
@keyframes legal-flash { 0%, 100% { color: var(--navy); } 30% { color: var(--blue); } }

/* ---------- Tablet ---------- */
@media (max-width: 1199px) {
  .page-legal .container { --gutter: 48px; }
  .legal-hero { padding-top: 44px; }
  .legal-hero .eyebrow { margin-bottom: 10px; }
  .legal-hero .h1 { font-size: 56px; line-height: 64px; }
  .legal-hero__date { margin-top: 7px; }
  .legal-rule { margin-top: 40px; }
  .page-legal--imprint .legal-rule { margin-top: 39px; }
  .legal { padding: 64px 0 63px; }
  .legal__sec + .legal__sec { margin-top: 40px; }
  .legal__h { font-size: 16px; line-height: 22px; margin-bottom: 16px; }
  .legal p { font-size: 16px; line-height: 22px; }
  .legal p + p { margin-top: 24px; }
  .legal p + p.blank { margin-top: 22px; }
  .legal__list li { font-size: 16px; line-height: 22px; }
  .legal__list li::before { top: 8px; }
  .legal p + .legal__list, .legal .legal__list + p { margin-top: 16px; }
}

/* ---------- Phone ---------- */
@media (max-width: 767px) {
  .page-legal .container { --gutter: 16px; }
  .legal-hero { padding-top: 40px; }
  .legal-hero .eyebrow { margin-bottom: 16px; }
  .legal-hero .h1 { font-size: 39px; line-height: 48px; }
  .legal-hero__date { margin-top: 13px; font-size: 16px; line-height: 22px; }
  .legal-rule { margin: 30px 32px 0; }
  .page-legal--imprint .legal-rule { margin-top: 27px; }
  .legal { width: auto; padding: 31px 12px 32px 8px; }
  .legal__sec + .legal__sec { margin-top: 31px; }
  .legal__h { margin-bottom: 15px; }
  .legal p { margin-right: 0; }
  .legal p + p { margin-top: 8px; }
  .legal p + .legal__list, .legal .legal__list + p { margin-top: 8px; }
  .legal-hero__note { margin-top: 12px; font-size: 14px; line-height: 20px; }
}