/* Linkship – Landing-Texte unter Rubrik- und Verzeichnisseiten + animierte Inhaltsgrafiken (0.2.7).
   Scope: .lsr-land (Textblock) und .lsr-fig (Grafik-Panel, auch in Beiträgen nutzbar). */

.lsr-land{max-width:800px;margin:0 auto;padding:clamp(40px,6vw,80px) 0 clamp(24px,4vw,56px);color:#334155;font-size:17.5px;line-height:1.72}
.lsr-land>*:first-child{margin-top:0}
.lsr-land h2{font-family:Outfit,system-ui,sans-serif;font-size:clamp(25px,3vw,33px);line-height:1.18;letter-spacing:-.015em;color:#0F172A;margin:2.1em 0 .6em}
.lsr-land h3{font-family:Outfit,system-ui,sans-serif;font-size:21px;line-height:1.3;color:#0F172A;margin:1.6em 0 .45em}
.lsr-land p{margin:0 0 1.05em}
.lsr-land a{color:#123C8F;text-decoration:underline;text-decoration-color:rgba(18,60,143,.35);text-underline-offset:3px;font-weight:600}
.lsr-land a:hover{text-decoration-color:#E8890C;color:#0B2A6B}
.lsr-land ul,.lsr-land ol{margin:0 0 1.2em;padding-left:1.35em}
.lsr-land li{margin:.35em 0}
.lsr-land ol>li::marker{color:#E8890C;font-weight:800}
.lsr-land ul>li::marker{color:#E8890C}
.lsr-land code{background:#F4F6FB;border:1px solid #E4E8F2;border-radius:6px;padding:.05em .35em;font-size:.88em}

.lsr-kurz{background:#F4F6FB;border:1px solid #E4E8F2;border-left:4px solid #123C8F;border-radius:14px;padding:20px 24px 8px;margin:1.6em 0 2em}
.lsr-kurz-h{font-family:Outfit,system-ui,sans-serif;font-weight:800;color:#0F172A;font-size:18px;margin:0 0 .5em!important}
.lsr-kurz ul{padding-left:1.2em}
.lsr-tipp{background:#FFF7EA;border:1px solid #FFD9A3;border-radius:14px;padding:18px 22px 4px;margin:1.6em 0}
.lsr-tipp strong{color:#9A5200}
.lsr-cta{position:relative;overflow:hidden;background:radial-gradient(120% 140% at 100% 0,#1D3B7A 0,#0B1220 60%);color:#C7D2E8;border-radius:20px;padding:28px 30px 14px;margin:2.4em 0}
.lsr-cta::after{content:"";position:absolute;right:-60px;top:-60px;width:200px;height:200px;border-radius:50%;background:radial-gradient(circle,rgba(255,180,84,.35),transparent 65%);animation:lsr-breathe 5s ease-in-out infinite}
.lsr-cta p{position:relative;z-index:1}
.lsr-cta-h{font-family:Outfit,system-ui,sans-serif;color:#fff;font-size:23px;font-weight:800;line-height:1.25;margin:0 0 .4em!important}
.lsr-land .lsr-cta a:not(.lsr-btn){color:#FFB454}
.lsr-land .lsr-btn,.lsr-btn{display:inline-flex;align-items:center;gap:8px;background:#FFB454;color:#0B1220!important;text-decoration:none!important;font-weight:800;border-radius:999px;padding:11px 22px;transition:transform .2s ease,background .2s ease}
.lsr-btn::after{content:"→";transition:transform .2s ease}
.lsr-btn:hover{background:#E8890C;transform:translateY(-1px)}
.lsr-btn:hover::after{transform:translateX(3px)}

.lsr-table-wrap{overflow-x:auto;margin:1.4em 0 1.8em;border:1px solid #E4E8F2;border-radius:14px}
.lsr-table{width:100%;border-collapse:collapse;font-size:15.5px;line-height:1.5;margin:0}
.lsr-table th{background:#0F172A;color:#fff;font-family:Outfit,system-ui,sans-serif;font-weight:700;text-align:left;padding:12px 14px;white-space:nowrap}
.lsr-table td{padding:11px 14px;border-top:1px solid #E4E8F2;vertical-align:top}
.lsr-table tbody tr:nth-child(even) td{background:#F8FAFD}
.lsr-table td:first-child{font-weight:700;color:#0F172A}

.lsr-faq{margin:1.2em 0 2em;border-top:1px solid #E4E8F2}
.lsr-faq details{border-bottom:1px solid #E4E8F2}
.lsr-faq summary{list-style:none;cursor:pointer;position:relative;padding:18px 44px 18px 0;font-family:Outfit,system-ui,sans-serif;font-weight:700;font-size:18.5px;color:#0F172A;line-height:1.35}
.lsr-faq summary::-webkit-details-marker{display:none}
.lsr-faq summary::after{content:"";position:absolute;right:6px;top:50%;width:22px;height:22px;margin-top:-11px;border-radius:50%;background:#F4F6FB url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 22'%3E%3Cpath d='M6 11h10M11 6v10' stroke='%23123C8F' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") center/22px no-repeat;transition:transform .25s ease}
.lsr-faq details[open] summary::after{transform:rotate(45deg);background-color:#FFF1DC}
.lsr-faq details>*:not(summary){margin:0 0 1em;padding-right:36px}

/* ---------------------------------------------------------- Grafik-Panel */
.lsr-fig{position:relative;margin:2.2em 0 2.4em;background:radial-gradient(130% 120% at 0 0,#15254A 0,#0B1220 55%);border-radius:22px;padding:22px 22px 16px;box-shadow:0 24px 60px -30px rgba(11,18,32,.55);overflow:hidden}
.lsr-fig::before{content:"";position:absolute;inset:0;border-radius:22px;padding:1px;background:linear-gradient(135deg,rgba(255,180,84,.55),rgba(61,123,255,.25) 40%,rgba(255,255,255,.04));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}
.lsr-fig-head{margin:0 0 10px}
.lsr-fig-kicker{display:inline-block;font-size:11.5px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#FFB454;margin-bottom:4px}
.lsr-fig .lsr-fig-title{font-family:Outfit,system-ui,sans-serif;font-weight:800;color:#fff;font-size:21px;line-height:1.25;margin:0!important}
.lsr-fig-body svg{display:block;width:100%;height:auto;overflow:visible}
.lsr-fig figcaption{color:#9FB0CF;font-size:14px;line-height:1.5;margin-top:12px;text-align:left}
.lsr-fig .lsr-svg text{font-kerning:normal}

/* Kennzahlen-Kacheln */
.lsr-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:14px;margin:6px 0 2px}
.lsr-stat{position:relative;background:linear-gradient(180deg,#172544,#0F1930);border:1px solid #26355A;border-radius:16px;padding:18px 16px 16px;overflow:hidden}
.lsr-stat-ring{position:absolute;right:-26px;top:-26px;width:84px;height:84px;border-radius:50%;border:2px solid rgba(255,180,84,.35);animation:lsr-breathe 4s ease-in-out infinite;animation-delay:calc(var(--i,0) * -.9s)}
.lsr-stat-v{font-family:Outfit,system-ui,sans-serif;font-weight:800;font-size:clamp(34px,4.4vw,46px);line-height:1;margin:0 0 8px!important;background:linear-gradient(135deg,#FFD08A,#FFB454 45%,#E8890C);-webkit-background-clip:text;background-clip:text;color:transparent}
.lsr-stat-t{color:#C7D2E8;font-size:14px;line-height:1.35;margin:0!important;font-weight:600}
.lsr-stats-src{color:#7F8FB0;font-size:12px;margin:10px 0 0!important}
@property --n{syntax:'<integer>';inherits:false;initial-value:0}
.lsr-js .lsr-fig .lsr-num{font-size:0}
.lsr-js .lsr-fig .lsr-num::after{font-size:clamp(34px,4.4vw,46px);counter-reset:n var(--n);content:counter(n);--n:var(--v)}
.lsr-js .lsr-fig.lsr-in .lsr-num::after{animation:lsr-count 1.8s cubic-bezier(.22,1,.36,1) both;animation-delay:calc(var(--i,0) * .12s)}
@keyframes lsr-count{from{--n:0}to{--n:var(--v)}}
.lsr-js .lsr-fig .lsr-stat{opacity:.001;transform:translateY(14px)}
.lsr-js .lsr-fig.lsr-in .lsr-stat{animation:lsr-rise .7s cubic-bezier(.22,1,.36,1) both;animation-delay:calc(var(--i,0) * .12s)}
@keyframes lsr-rise{to{opacity:1;transform:none}}
@keyframes lsr-breathe{0%,100%{opacity:.55;transform:scale(1)}50%{opacity:1;transform:scale(1.12)}}

/* Einblenden des ganzen Panels */
.lsr-js .lsr-fig .lsr-fig-body{opacity:.001;transform:translateY(16px);transition:opacity .7s ease,transform .8s cubic-bezier(.22,1,.36,1)}
.lsr-js .lsr-fig.lsr-in .lsr-fig-body{opacity:1;transform:none}

/* Schmale Bildschirme: breite Grafiken seitlich wischen statt unlesbar klein */
@media (max-width:640px){
  .lsr-land{font-size:16.5px}
  .lsr-fig{padding:18px 14px 12px;margin-left:-4px;margin-right:-4px}
  .lsr-fig:not(.lsr-fig--stats) .lsr-fig-body{overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;scrollbar-width:thin;overscroll-behavior-x:contain;padding-bottom:6px}
  .lsr-fig:not(.lsr-fig--stats) .lsr-fig-body svg{min-width:540px}
  .lsr-fig:not(.lsr-fig--stats) figcaption::before{content:"Seitlich wischen für die ganze Grafik · ";color:#FFB454}
  .lsr-stats{grid-template-columns:1fr 1fr}
  .lsr-faq summary{font-size:17px}
}
@media (prefers-reduced-motion:reduce){
  .lsr-cta::after,.lsr-stat-ring{animation:none}
  .lsr-js .lsr-fig .lsr-fig-body,.lsr-js .lsr-fig .lsr-stat{opacity:1;transform:none;transition:none;animation:none}
  .lsr-js .lsr-fig .lsr-num::after{animation:none}
}
/* In Beiträgen (z. B. Case Studies) ohne Abstand oben, Breite folgt der Beitragsspalte */
.single .lsr-land{padding-top:0;max-width:none}
