/* ==========================================================================
   Legal pages (Datenschutz, AGB, Cookie-Richtlinie)
   raum-planer-online.de
   ========================================================================== */

.legal{padding:0 0 90px}
.legal .container{max-width:1000px}

.legal-head{margin:35px 0 40px}
.legal-head__title{margin-bottom:15px}
.legal-head__meta{display:inline-block;background:rgba(80,160,255,.12);color:#4fa0ff;font-size:15px;font-weight:600;line-height:1.5;padding:7px 16px;border-radius:10px;margin-bottom:0}

.legal-intro{font-size:19px;line-height:1.65;color:#4a5059;margin-bottom:10px}

.legal-toc{background:#f6f9fd;border:1px solid #e6edf6;border-radius:12px;padding:26px 30px;margin:0 0 50px}
.legal-toc__title{color:#222831;font-size:18px;font-weight:800;line-height:1.3;margin-bottom:16px}
.legal-toc__list{display:grid;grid-template-columns:1fr 1fr;gap:9px 30px;list-style:none;margin:0;padding:0;counter-reset:toc}
.legal-toc__list li{position:relative;padding-left:26px;font-size:16px;line-height:1.45;counter-increment:toc}
.legal-toc__list li::before{position:absolute;left:0;top:0;content:counter(toc) ".";color:#4fa0ff;font-weight:600}
.legal-toc__list a{color:#4a5059;text-decoration:none;border-bottom:1px solid transparent}
.legal-toc__list a:hover{color:#4fa0ff;border-bottom-color:rgba(79,160,255,.4)}

.legal-section{margin-bottom:46px;scroll-margin-top:100px}
.legal-section__title{position:relative;color:#222831;font-size:26px;font-weight:800;line-height:1.3;padding-top:26px;margin-bottom:20px;border-top:2px solid #e6edf6}
.legal-section__subtitle{color:#222831;font-size:20px;font-weight:800;line-height:1.35;margin:30px 0 12px}
.legal-section__minor{color:#4fa0ff;font-size:17px;font-weight:600;line-height:1.4;margin:22px 0 10px}
.legal-section__label{color:#909399;font-size:14px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;line-height:1.4;margin:20px 0 8px}

.legal p{font-size:17px;line-height:1.7;color:#4a5059;margin-bottom:16px}
.legal p:last-child{margin-bottom:0}
.legal strong{color:#222831;font-weight:600}
.legal em{font-style:italic}
.legal a:not(.button){color:#4fa0ff;text-decoration:none;border-bottom:1px solid rgba(79,160,255,.35);word-break:break-word}
.legal a:not(.button):hover{border-bottom-color:#4fa0ff}

.legal-list{margin:0 0 18px;padding:0;list-style:none}
.legal-list li{position:relative;font-size:17px;line-height:1.65;color:#4a5059;padding-left:26px;margin-bottom:10px}
.legal-list li::before{position:absolute;left:6px;top:11px;content:'';width:7px;height:7px;background:#4fa0ff;border-radius:50%}

.legal-list-ordered{margin:0 0 18px;padding:0;list-style:none;counter-reset:legal}
.legal-list-ordered li{position:relative;font-size:17px;line-height:1.65;color:#4a5059;padding-left:34px;margin-bottom:10px;counter-increment:legal}
.legal-list-ordered li::before{position:absolute;left:0;top:0;content:counter(legal) ".";color:#4fa0ff;font-weight:600;min-width:24px}

.legal-table-wrap{overflow-x:auto;margin:0 0 24px}
.legal-table{width:100%;min-width:520px;border-collapse:collapse;font-size:16px}
.legal-table th,.legal-table td{border:1px solid #e6edf6;padding:12px 14px;text-align:left;vertical-align:top;line-height:1.55;color:#4a5059}
.legal-table th{background:#f6f9fd;color:#222831;font-weight:600}

.legal-note{position:relative;background:#f6f9fd;border-left:4px solid #4fa0ff;border-radius:0 10px 10px 0;padding:20px 24px;margin:24px 0}
.legal-note p{margin-bottom:10px}
.legal-note p:last-child{margin-bottom:0}

.legal-cta{background:#f6f9fd;border:1px solid #e6edf6;border-radius:14px;padding:30px 34px;margin-top:50px;text-align:center}
.legal-cta__title{color:#222831;font-size:22px;font-weight:800;line-height:1.3;margin-bottom:12px}
.legal-cta p{margin-bottom:0}

.legal-updated{margin-top:40px;padding-top:20px;border-top:1px solid #e6edf6;color:#909399;font-size:15px;line-height:1.6}

@media (max-width:768px){
  .legal{padding:0 0 60px}
  .legal-head{margin:25px 0 30px}
  .legal-toc{padding:20px 22px;margin-bottom:36px}
  .legal-toc__list{grid-template-columns:1fr;gap:8px}
  .legal-section{margin-bottom:36px}
  .legal-section__title{font-size:22px;padding-top:20px;margin-bottom:16px}
  .legal-section__subtitle{font-size:18px}
  .legal p,.legal-list li,.legal-list-ordered li{font-size:16px}
  .legal-intro{font-size:17px}
  .legal-note{padding:16px 18px}
  .legal-cta{padding:24px 20px}
}