/* =========================================
.legal-styling — Dr. Peri legal pages
Wraps Impressum, Datenschutz, Zahlungsmethoden,
Widerrufsbelehrung, Versand, AGB
========================================= */

.legal-styling {
    /* Tokens (mirror drperi design system; safe fallbacks) */
    --ls-text: #475e76;
    --ls-heading: #2a3a4a;
    --ls-muted: rgba(71, 94, 118, 0.62);
    --ls-accent: #769cc1;
    --ls-soft: #f7f8fa;
    --ls-mid: #eef1f4;
    --ls-rule: rgba(71, 94, 118, 0.14);

    width: 100%;
    color: var(--ls-text);
    font-family: 'Montserrat', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: clamp(0.9375rem, 0.88rem + 0.27vw, 1rem);
    line-height: 1.72;
    font-weight: 400;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

.legal-styling>*:first-child {
    margin-top: 0;
}

.legal-styling>*:last-child {
    margin-bottom: 0;
}

/* === Headings — clean, aligned with site Montserrat scale === */
.legal-styling h1,
.legal-styling h2,
.legal-styling h3,
.legal-styling h4,
.legal-styling h5,
.legal-styling h6 {
    font-family: 'Montserrat', sans-serif;
    color: var(--ls-heading);
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: 0;
    text-transform: none;
    text-wrap: balance;
}

.legal-styling h1 {
    font-size: clamp(2rem, 1.3rem + 3.04vw, 3rem);
    line-height: 1.15;
    margin: 0 0 1em;
}

.legal-styling h2 {
    font-size: clamp(1.625rem, 1.13rem + 2.17vw, 2.25rem);
    margin: 2.8em 0 1em;
}

.legal-styling h3 {
    font-size: clamp(1.375rem, 1.05rem + 1.41vw, 1.75rem);
    margin: 2em 0 0.8em;
}

.legal-styling h4 {
    font-size: clamp(1.1875rem, 0.99rem + 0.87vw, 1.375rem);
    font-weight: 600;
    margin: 1.7em 0 0.6em;
}

/* === Body text =========================================== */
.legal-styling p {
    margin: 0 0 1.25em;
}

.legal-styling p.legal-lead,
.legal-styling p.subheadline {
    font-size: clamp(1.0625rem, 0.92rem + 0.65vw, 1.1875rem);
    line-height: 1.55;
}

.legal-styling p.legal-lead {
    color: var(--ls-muted);
    font-weight: 400;
    margin: 0 0 3em;
    max-width: 62ch;
}

.legal-styling p.subheadline {
    color: var(--ls-muted);
    margin: -1em 0 3em;
}

.legal-styling strong,
.legal-styling b {
    font-weight: 600;
    color: var(--ls-heading);
}

.legal-styling em,
.legal-styling i {
    font-style: italic;
}

/* === Links =============================================== */
.legal-styling a {
    color: var(--ls-text);
    text-decoration: underline;
    text-decoration-color: var(--ls-accent);
    text-decoration-thickness: 1px;
    text-underline-offset: 4px;
    transition: color .2s ease, text-decoration-color .2s ease;
    word-break: break-word;
}

.legal-styling a:hover,
.legal-styling a:focus-visible {
    color: var(--ls-heading);
    text-decoration-color: var(--ls-text);
    text-decoration-thickness: 2px;
}

/* === Lists =============================================== */
.legal-styling ul,
.legal-styling ol {
    margin: 0 0 1.5em;
    padding-left: 1.4em;
}

.legal-styling li {
    margin: 0 0 0.55em;
    padding-left: 0.25em;
}

.legal-styling li::marker {
    color: var(--ls-accent);
}

.legal-styling li>ul,
.legal-styling li>ol {
    margin: 0.55em 0 0.25em;
}

/* === Address / info blocks =============================== */
.legal-styling .legal-block {
    background: var(--ls-soft);
    border-left: 3px solid var(--ls-accent);
    padding: 1.4em 1.6em;
    border-radius: 0 10px 10px 0;
    margin: 0 0 1.8em;
}

.legal-styling .legal-block p {
    margin: 0 0 0.4em;
}

.legal-styling .legal-block p:last-child {
    margin-bottom: 0;
}

/* === Tables ============================================== */
.legal-styling table {
    width: 100%;
    border-collapse: collapse;
    margin: 0 0 1.8em;
    font-size: 0.95em;
    border: 1px solid var(--ls-rule);
    border-radius: 8px;
    overflow: hidden;
}

.legal-styling table th,
.legal-styling table td {
    text-align: left;
    padding: 0.85em 1.1em;
    border-bottom: 1px solid var(--ls-rule);
    vertical-align: top;
}

.legal-styling table th {
    background: var(--ls-soft);
    color: var(--ls-heading);
    font-weight: 600;
    letter-spacing: 0.02em;
}

.legal-styling table tr:last-child td {
    border-bottom: 0;
}

/* === Uppercase legal notice (Widerspruchsrecht etc.) ===== */
.legal-styling p.legal-uppercase {
    text-transform: uppercase;
    letter-spacing: 0.03em;
    font-size: 0.87em;
    line-height: 1.7;
    background: var(--ls-soft);
    border-radius: 10px;
    padding: 1.3em 1.5em;
    color: var(--ls-text);
}

/* === Closing meta line =================================== */
.legal-styling .legal-meta {
    margin-top: 3em;
    padding-top: 1.4em;
    border-top: 1px solid var(--ls-rule);
    color: var(--ls-muted);
    font-size: 0.875em;
    font-style: italic;
}

/* === Form lines (Muster-Widerrufsformular) =============== */
.legal-styling .legal-form-line {
    display: block;
    margin: 0.55em 0 1.2em;
    border-bottom: 1px solid var(--ls-rule);
    min-height: 1.4em;
}

/* === Responsive tightening =============================== */
@media (max-width: 640px) {
    .legal-styling h2 {
        margin-top: 2.2em;
    }

    .legal-styling .legal-block {
        padding: 1.1em 1.2em;
    }

    .legal-styling table th,
    .legal-styling table td {
        padding: 0.7em 0.85em;
    }
}