/**
 * @file        section/datenschutz/datenschutz.css
 * @location    /section/datenschutz/datenschutz.css
 * @description Datenschutz — uses shared lgl__ legal layout. Prefix: dsg__
 *
 *              COLORS (COLOR-GUIDE.md — all ≥ 7:1):
 *                Intro BG:    surf #eef2f7  —  C5/surf 12.5:1 ✓
 *                Chapter BG:  C2 #ffffff    —  C5/C2   14.02:1 ✓
 *                H3:          C3/C2   8.49:1 ✓
 *                Links:       C3/C2   8.49:1 ✓
 *                Address BG:  surf    —  C5/surf 12.5:1 ✓
 *                Alert BG:    c3-lt   —  C5/c3lt 12.2:1 ✓
 *                List:        C5/C2  14.02:1 ✓
 *                Meta:        C6/C2   8.89:1 ✓
 *
 * @version     4.0.0
 * @changelog
 *   3.0.0  2026-03-19  Unified lgl__ layout.
 *   4.0.0  2026-03-19  Readability pass: spacing, font sizes, item separation.
 */

/* ── Body wrapper ─────────────────────────────────────────────────── */
.dsg__body {
    display:        flex;
    flex-direction: column;
    gap:            0;
}

/* ── Intro (legal reference note) ────────────────────────────────── */
.dsg__intro {
    padding:       var(--space-5) var(--space-7);
    background:    var(--color-surface);
    border-bottom: 2px solid var(--color-border);
}
/* C5/surf 12.5:1 ✓ */
.dsg__intro p {
    font-size:   var(--text-sm);
    color:       var(--color-ink);
    line-height: var(--leading-relaxed);
    margin:      0;
    font-style:  italic;
}

/* ── Chapter block (A–G) ──────────────────────────────────────────── */
.dsg__chapter {
    padding:       var(--space-8) var(--space-8);
    border-bottom: 1px solid var(--color-border);
    background:    var(--color-white);
}
.dsg__chapter:last-of-type {
    border-bottom:  none;
    border-radius:  0 0 var(--radius-sm) var(--radius-sm);
}

.dsg__chapter-intro {
    font-size:    var(--text-base);
    color:        var(--color-ink);
    line-height:  var(--leading-relaxed);
    margin:       calc(-1 * var(--space-2)) 0 var(--space-6);
}

/* ── Item (numbered sub-section) ─────────────────────────────────── */
.dsg__item {
    margin-bottom:  var(--space-7);
    padding-bottom: var(--space-7);
    border-bottom:  1px solid var(--color-border);
}
.dsg__item:last-of-type {
    border-bottom:  none;
    margin-bottom:  0;
    padding-bottom: 0;
}

/* Alert variant (Beschwerderecht) */
.dsg__item--alert {
    background:    var(--color-blue-lt);
    border:        1px solid var(--color-border);
    border-left:   3px solid var(--color-blue);
    border-radius: var(--radius-sm);
    padding:       var(--space-6);
    margin-bottom: 0;
}
/* C3/c3lt 7.4:1 ✓ */
.dsg__item--alert .dsg__h3 { color: var(--color-blue); }

/* ── Sub-heading h3 ───────────────────────────────────────────────── */
/* C3/C2 8.49:1 ✓ */
.dsg__h3 {
    font-size:      var(--text-lg);
    font-weight:    var(--weight-black);
    color:          var(--color-blue);
    margin:         0 0 var(--space-4);
    line-height:    var(--leading-snug);
}

/* ── Body text ────────────────────────────────────────────────────── */
/* C5/C2 14.02:1 ✓ */
.dsg__chapter p {
    font-size:   var(--text-base);
    color:       var(--color-ink);
    line-height: var(--leading-relaxed);
    margin:      0 0 var(--space-3);
}
.dsg__chapter p:last-child { margin-bottom: 0; }
.dsg__chapter p strong     { color: var(--color-navy); font-weight: var(--weight-bold); }

/* ── Links ────────────────────────────────────────────────────────── */
/* C3/C2 8.49:1 ✓ */
.dsg__link {
    color:                 var(--color-blue);
    font-weight:           var(--weight-bold);
    text-decoration:       underline;
    text-underline-offset: 3px;
}
.dsg__link:hover         { color: var(--color-navy); }
.dsg__link:focus-visible {
    outline:        2px solid var(--color-blue);
    outline-offset: 2px;
    border-radius:  2px;
}

/* ── Address block ────────────────────────────────────────────────── */
/* C5/surf 12.5:1 ✓ */
.dsg__address {
    font-style:    normal;
    font-size:     var(--text-base);
    color:         var(--color-ink);
    line-height:   2;
    background:    var(--color-surface);
    border:        1px solid var(--color-border);
    border-left:   3px solid var(--color-border);
    border-radius: var(--radius-sm);
    padding:       var(--space-5) var(--space-6);
    margin:        var(--space-4) 0 0;
    display:       block;
}
.dsg__address strong {
    color:          var(--color-navy);
    font-weight:    var(--weight-bold);
    display:        block;
    margin-bottom:  var(--space-1);
    font-size:      var(--text-base);
}

/* ── List ─────────────────────────────────────────────────────────── */
/* C5/C2 14.02:1 ✓ */
.dsg__list {
    margin:  var(--space-4) 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap:     var(--space-2);
    list-style: none;
}
.dsg__list li {
    display:     flex;
    align-items: flex-start;
    gap:         var(--space-3);
    font-size:   var(--text-base);
    color:       var(--color-ink);
    line-height: var(--leading-relaxed);
}
.dsg__list li::before {
    content:     '';
    display:     block;
    width:       6px;
    height:      6px;
    min-width:   6px;
    background:  var(--color-blue);
    border-radius: 50%;
    margin-top:  .5rem;
    flex-shrink: 0;
}
.dsg__list li strong {
    color:       var(--color-navy);
    font-weight: var(--weight-bold);
}

/* ── Footer links ─────────────────────────────────────────────────── */
.dsg__footer-links {
    display:         flex;
    justify-content: space-between;
    align-items:     center;
    padding:         var(--space-5) var(--space-7);
    border-top:      1px solid var(--color-border);
    background:      var(--color-surface);
    border-radius:   0 0 var(--radius-sm) var(--radius-sm);
    flex-wrap:       wrap;
    gap:             var(--space-3);
}
/* C3/surf 7.6:1 ✓ */
.dsg__footer-link {
    display:         inline-flex;
    align-items:     center;
    gap:             var(--space-2);
    color:           var(--color-blue);
    font-size:       var(--text-sm);
    font-weight:     var(--weight-bold);
    text-decoration: none;
}
.dsg__footer-link:hover         { color: var(--color-navy); }
.dsg__footer-link:focus-visible {
    outline:        2px solid var(--color-blue);
    outline-offset: 2px;
    border-radius:  2px;
}

/* ── Stand meta ───────────────────────────────────────────────────── */
/* C6/C2 8.89:1 ✓ */
.dsg__chapter-meta {
    font-size:  var(--text-sm);
    color:      var(--color-ink-soft);
    margin:     var(--space-5) 0 0;
    font-style: italic;
    padding-top: var(--space-4);
    border-top:  1px solid var(--color-border);
}

/* ── Responsive ───────────────────────────────────────────────────── */
@media (max-width: 900px) {
    .dsg__chapter { padding: var(--space-7) var(--space-6); }
}
@media (max-width: 600px) {
    .dsg__chapter       { padding: var(--space-6) var(--space-4); }
    .dsg__intro         { padding: var(--space-4); }
    .dsg__footer-links  { padding: var(--space-4); }
    .dsg__item          { margin-bottom: var(--space-6); padding-bottom: var(--space-6); }
}
