/* =====================================================================
   Spanndecken Pro — legal.css (leg-)  ·  uses sd- tokens from main.css
   Impressum + Datenschutz
   ===================================================================== */

/* Hero */
.leg-hero{background:linear-gradient(160deg,var(--sd-panel),var(--sd-panel-2));padding:52px 0 46px;border-bottom:1px solid var(--sd-line)}
.leg-hero__container{max-width:900px;margin:0 auto;padding:0 24px}
.leg-hero__breadcrumb{display:flex;align-items:center;gap:9px;font-size:14px;color:var(--sd-muted);margin-bottom:18px}
.leg-hero__breadcrumb a{color:var(--sd-violet);font-weight:600}
.leg-hero__breadcrumb a:hover{text-decoration:underline}
.leg-hero__breadcrumb-sep{opacity:.5}
.leg-hero__title{font-size:clamp(28px,4vw,44px);color:var(--sd-ink);margin-bottom:12px}
.leg-hero__subtitle{color:var(--sd-muted);font-size:clamp(14.5px,1.5vw,16.5px);line-height:1.6}

/* Main */
.leg-main{padding:56px 0 84px}
.leg-main__container{max-width:900px;margin:0 auto;padding:0 24px}
.leg-content{display:flex;flex-direction:column;gap:44px}

/* Section */
.leg-section__title{font-size:clamp(21px,2.6vw,28px);color:var(--sd-ink);margin-bottom:20px;padding-bottom:12px;border-bottom:2px solid var(--sd-line)}

/* Cards */
.leg-card{background:var(--sd-surface);border:1px solid var(--sd-line);border-radius:var(--sd-r-lg);padding:26px 28px;margin-bottom:18px}
.leg-card:last-child{margin-bottom:0}
.leg-card__title{font-size:18px;color:var(--sd-ink);margin-bottom:14px}
.leg-card__body{color:var(--sd-text);font-size:15.5px;line-height:1.75}
.leg-card__body p{margin-bottom:12px}
.leg-card__body p:last-child{margin-bottom:0}
.leg-card__body strong{color:var(--sd-ink)}

/* Contact block */
.leg-contact{display:flex;flex-direction:column;gap:12px}
.leg-contact__item{display:flex;flex-wrap:wrap;gap:6px 12px}
.leg-contact__label{font-family:'Outfit',sans-serif;font-weight:700;color:var(--sd-ink);min-width:90px}
.leg-contact__value{color:var(--sd-text);overflow-wrap:anywhere}
a.leg-contact__value{color:var(--sd-violet);font-weight:600}
a.leg-contact__value:hover{text-decoration:underline}

/* Lists */
.leg-list{display:flex;flex-direction:column;gap:9px;margin-top:12px;padding-left:0}
.leg-list li{position:relative;padding-left:24px;color:var(--sd-text);font-size:15px;line-height:1.6}
.leg-list li::before{content:"";position:absolute;left:0;top:9px;width:8px;height:8px;border-radius:50%;background:var(--sd-grad)}
.leg-list--check li::before{content:"";left:0;top:3px;width:16px;height:16px;border-radius:0;background:var(--sd-violet);-webkit-mask:url("/assets/icons/check.svg") center/contain no-repeat;mask:url("/assets/icons/check.svg") center/contain no-repeat}

/* Highlight boxes */
.leg-highlight{background:linear-gradient(150deg,#2C2444,#1D1630);border-radius:var(--sd-r-lg);padding:28px 30px;color:rgba(255,255,255,.85);font-size:15.5px;line-height:1.75}
.leg-highlight__title{font-family:'Outfit',sans-serif;font-weight:700;font-size:18px;color:#fff;margin-bottom:10px}
.leg-highlight strong{color:#fff}
.leg-highlight--info{background:var(--sd-panel);color:var(--sd-text)}
.leg-highlight--info .leg-highlight__title{color:var(--sd-violet)}
.leg-highlight--info strong{color:var(--sd-ink)}

.leg-note{font-size:13.5px;color:var(--sd-muted);font-style:italic}
.leg-link{color:var(--sd-violet);font-weight:600;text-decoration:underline;overflow-wrap:anywhere}
.leg-link:hover{color:var(--sd-violet-deep)}

.leg-footer-note{margin-top:20px;padding:20px 24px;background:var(--sd-panel);border-radius:var(--sd-r);font-size:14px;color:var(--sd-muted)}
.leg-footer-note p{margin-bottom:6px}
.leg-footer-note p:last-child{margin-bottom:0}
.leg-footer-note strong{color:var(--sd-ink)}

/* Responsive */
@media (max-width:768px){
  .leg-hero{padding:42px 0 38px}
  .leg-hero__container,.leg-main__container{padding-left:20px;padding-right:20px}
  .leg-main{padding:44px 0 64px}
  .leg-content{gap:34px}
  .leg-card{padding:22px 20px}
  .leg-highlight{padding:22px 20px}
}
@media (max-width:480px){
  .leg-hero__container,.leg-main__container{padding-left:16px;padding-right:16px}
}
