/* excire.com — legal/plain pages (Impressum, Datenschutz, EULA, …) */

/* Long legal documents use the standard site content width (the .container
   max-width), so their side margins match the rest of the website. */
/* Short pages (Kontakt) stay in a narrow readable column. */
.legal__container--narrow { max-width: 760px; margin-inline: auto; }
.legal__heading { font-size: var(--fs-h2); margin-bottom: var(--space-5); }

/* Title band + reduced hero-title size live in office.css (.office-hero--legal),
   so pages loading only office.css (e.g. the Newsletter) share the same size. */
.legal { padding-top: var(--space-7); }

/* Kontakt: help-center CTA button (centred, black — like live). */
.legal__cta { text-align: center; margin-top: var(--space-6); }
.legal__cta-btn { display: inline-block; background: linear-gradient(135deg, #1B67E6 0%, #00ACFF 100%);
    color: #fff; padding: 16px 34px; border-radius: 2px; font-family: var(--font-button);
    font-size: 15px; font-weight: 600; letter-spacing: .04em; text-decoration: none; }
.legal__cta-btn:hover { background: #1B67E6; color: #fff; }

/* Über uns: body text left, Excire logo (with subline) right (like live). */
.legal__container--split { max-width: 1080px; display: grid; grid-template-columns: 1fr 360px; gap: 56px; align-items: center; }
.legal__aside img { width: 100%; height: auto; }
@media (max-width: 900px) {
    .legal__container--split { grid-template-columns: 1fr; gap: 32px; }
    .legal__aside { max-width: 360px; }
}

/* Body typography — matched to the live legal pages (18px text, black,
   blue non-underlined links, headings 35/34/24). */
.legal__body { color: #000; }
.legal__body p, .legal__body li { font-size: 18px; line-height: 1.5; }
.legal__body p { margin-bottom: 14px; }
.legal__body h2 { font-size: 35px; font-weight: 700; line-height: 1.28; color: #000; margin: 28px 0 8px; }
.legal__body h3 { font-size: 34px; font-weight: 500; line-height: 1.2; color: #000; margin: 24px 0 16px; }
.legal__body h4 { font-size: 24px; font-weight: 500; line-height: 1.2; color: #000; margin: 20px 0 16px; }
/* Plain body links are blue and underline on hover — but NOT the buttons
   (.btn / .legal__cta-btn), which stay white with no underline. */
.legal__body a:not(.btn):not(.legal__cta-btn) { color: #1B67E6; text-decoration: none; }
.legal__body a:not(.btn):not(.legal__cta-btn):hover { text-decoration: underline; }
.legal__body a.btn, .legal__body a.btn:hover,
.legal__body a.legal__cta-btn, .legal__body a.legal__cta-btn:hover { color: #fff; text-decoration: none; }