/* The code is one full-width surface, faint at rest and readable near the pointer. */
.systems{position:relative;isolation:isolate;overflow:hidden;min-height:690px;padding-block:clamp(112px,11vw,156px);background:#0d0d10}
.systems-canvas{position:absolute;inset:0;width:100%;height:100%;max-width:none;pointer-events:none;-webkit-mask-image:linear-gradient(180deg,transparent 0%,#000 15%,#000 84%,transparent 100%);mask-image:linear-gradient(180deg,transparent 0%,#000 15%,#000 84%,transparent 100%)}
.systems-vignette{position:absolute;inset:0;z-index:0;pointer-events:none;background:linear-gradient(90deg,rgba(13,13,16,.24),rgba(13,13,16,.12) 38%,rgba(13,13,16,.08) 68%,rgba(13,13,16,.1))}
.systems-inner{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.86fr);gap:clamp(55px,9vw,150px);align-items:center}
.systems-copy{position:relative;isolation:isolate;max-width:650px}
.systems-copy::before{content:"";position:absolute;inset:-38px -45px;z-index:-1;pointer-events:none;background:radial-gradient(ellipse 100% 120% at 50% 50%,rgba(13,13,16,.58) 0 48%,rgba(13,13,16,.28) 78%,transparent 100%)}
.systems h2{font-family:var(--f-display,Fraunces,Georgia,serif);font-size:clamp(42px,5.2vw,72px);font-weight:500;line-height:1.08;letter-spacing:-.035em;text-wrap:balance;text-shadow:0 2px 15px #0d0d10}
.systems-copy>p{max-width:58ch;margin-top:27px;color:#f0eae3;font-size:clamp(15px,1.25vw,18px);line-height:1.72;text-shadow:0 2px 10px #0d0d10}
.systems-action{margin-top:34px}
.systems-offers{min-width:0;padding:10px 0 10px clamp(20px,3.5vw,46px);border-left:1px solid rgba(242,237,228,.38);background:linear-gradient(90deg,rgba(13,13,16,.5),rgba(13,13,16,.32))}
.systems-list{list-style:none;margin:0;padding:0}
.systems-list li{min-width:0;padding:22px 0;border-top:1px solid rgba(242,237,228,.25)}
.systems-list li:first-child{border-top:0}
.systems-list strong{display:block;font-family:var(--f-display,Fraunces,Georgia,serif);font-size:clamp(26px,2.35vw,35px);font-weight:500;line-height:1.2;text-shadow:0 2px 9px #0d0d10}
.systems-list span{display:block;max-width:42ch;margin-top:9px;color:#eee8e1;font-size:14px;line-height:1.64;text-shadow:0 2px 8px #0d0d10}
html[lang^=de] .systems+.process{border-top:0;background:linear-gradient(180deg,#0d0d10 0%,#16161a 110px,#16161a 100%)}
@media(max-width:960px){.systems{min-height:0}.systems-inner{grid-template-columns:1fr;gap:62px}.systems-copy{max-width:720px}.systems-offers{max-width:760px}.systems-vignette{background:linear-gradient(90deg,rgba(13,13,16,.28),rgba(13,13,16,.16))}}
@media(max-width:650px){
 .systems{padding-block:78px 90px}
 .systems-inner{gap:38px}
 .systems h2{font-size:clamp(40px,10vw,57px)}
 .systems-copy>p{font-size:15px}
 .systems-offers{padding-left:20px}
 .systems-list li{padding:18px 0}
 .systems-list strong{font-size:27px}
 .systems-list span{font-size:13px}
 .systems-vignette{background:linear-gradient(90deg,rgba(13,13,16,.36),rgba(13,13,16,.24))}
}
@media(prefers-reduced-motion:reduce){.systems-canvas{animation:none!important;transform:none!important}}
