/* Company Solution Blog — Artikel-Design [cs_artikel]
   Übernimmt Schriften, Farben, Buttons und Hervorhebungen der Website (siehe .csa-scope). */
/* Oxygen 6 / Breakdance: Code-, PHP- und Shortcode-Elemente sind Flex-Spalten — volle Breite erzwingen */
.bde-code-block:has(> .csa-scope), .oxy-php-code:has(> .csa-scope), .oxy-html-code:has(> .csa-scope),
.bde-shortcode:has(> .csa-scope), .oxy-shortcode:has(> .csa-scope){display:block; width:100%; max-width:none; text-align:initial;}
.csa-scope{width:100%;}
.csa-scope{
  /* STIL DER WEBSITE — Reihenfolge je Wert:
     1. Einstellung im Plugin (--csa-*, nur wenn „Farben selbst wählen")
     2. Tokens unserer Websites (base.css: --c-*, --font-*, --btn-radius)
     3. automatisch von der Seite abgelesen (--csa-auto-*, assets/cs-artikel.js)
     4. neutraler Standard */
  --ink:var(--csa-dunkel, var(--c-primary, var(--csa-auto-dunkel, #1f2937)));
  --ink-soft:color-mix(in srgb, var(--ink) 90%, #fff);
  --paper:#FFFFFF;
  --paper-dim:rgba(255,255,255,0.68);
  --pale:var(--c-bg-alt, color-mix(in srgb, var(--gold) 6%, #ffffff));
  --offwhite:var(--c-bg, #ffffff);
  --gold:var(--csa-akzent, var(--c-accent, var(--csa-auto-akzent, #2563eb)));
  --on-gold:var(--csa-auf-akzent, var(--c-on-accent, var(--csa-auto-auf-akzent, #ffffff)));
  --slate:var(--c-accent-text, var(--csa-auto-link, color-mix(in srgb, var(--gold) 75%, #000000)));
  --line:rgba(255,255,255,0.14);
  --line-ink:color-mix(in srgb, var(--slate) 16%, transparent);
  --shadow:0 40px 90px -40px color-mix(in srgb, var(--ink) 45%, transparent);
  --on-dark:var(--c-on-primary, #ffffff);
  --on-dark-strong:rgba(255,255,255,0.92);
  --on-dark-muted:rgba(255,255,255,0.80);
  --on-dark-soft:rgba(255,255,255,0.62);
  --on-dark-faint:rgba(255,255,255,0.45);
  --on-dark-accent:var(--gold);

  --on-light:var(--c-text, var(--csa-auto-text, #1f2937));
  --on-light-muted:var(--on-light);
  --on-light-soft:var(--c-text-muted, color-mix(in srgb, var(--on-light) 72%, #ffffff));
  --on-light-accent:var(--slate);

  --line-dark:rgba(255,255,255,0.14);
  --line-light:color-mix(in srgb, var(--slate) 16%, transparent);
  --ghost-dark:rgba(255,255,255,0.06);
  --ghost-light:color-mix(in srgb, var(--slate) 7%, transparent);

  --f-display:var(--font-head, var(--csa-auto-font-head, system-ui, sans-serif));
  --f-body:var(--font-body, var(--csa-auto-font-body, system-ui, sans-serif));
  --f-mono:var(--f-body);   /* kleine Kicker/Labels in der Textschrift der Website */
  --btn-r:var(--btn-radius, var(--csa-auto-btn-radius, 100px));
  --btn-font:var(--csa-auto-btn-font, var(--f-body));
  --btn-weight:var(--csa-auto-btn-weight, 600);
  --btn-case:var(--csa-auto-btn-case, none);
  --btn-spacing:var(--csa-auto-btn-spacing, .01em);
  --h-weight:var(--csa-auto-h-weight, 600);
  --h-case:var(--csa-auto-h-case, none);
  --h-spacing:var(--csa-auto-h-spacing, -0.01em);
  --fs-hero: clamp(28px, 5.4vw, 68px);
  --fs-h1: clamp(26px, 4.2vw, 44px);
  --fs-h2: clamp(24px, 3.6vw, 46px);
  --fs-h3: clamp(20px, 2.6vw, 30px);
  --fs-h4: clamp(17px, 1.9vw, 21px);
  --fs-h5: clamp(15px, 1.5vw, 17px);
  --fs-h6: clamp(14px, 1.3vw, 15px);
  --fs-section: clamp(22px, 2.8vw, 34px);
  --fs-card: clamp(16px, 1.7vw, 19px);
  --fs-lead: clamp(17px, 1.8vw, 20px);
  --fs-body: clamp(16px, 1.15vw, 17px);
  --fs-small: 14.5px;
  --fs-mono: 12px;
  --pad: clamp(18px, 3.6vw, 44px);
  --pad-m: clamp(16px, 4.4vw, 22px);
  --gap: clamp(28px, 4vw, 60px);
  font-family:var(--f-body);
  color:var(--on-light);
  background:var(--pale);
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
}
.csa-scope{overflow-x:clip; max-width:100%;}
.csa-scope *, .csa-scope *::before, .csa-scope *::after{box-sizing:border-box; min-width:0;}
.csa-scope p, .csa-scope li, .csa-scope h1, .csa-scope h2, .csa-scope h3, .csa-scope h4,
.csa-scope td, .csa-scope th, .csa-scope blockquote, .csa-scope span, .csa-scope div{
  overflow-wrap:anywhere; word-break:break-word;
}
.csa-scope a{overflow-wrap:anywhere;}
.csa-scope img, .csa-scope iframe, .csa-scope video, .csa-scope embed, .csa-scope object,
.csa-scope svg, .csa-scope pre, .csa-scope table{max-width:100%;}
.csa-scope pre{overflow-x:auto; white-space:pre-wrap;}
.csa-scope iframe{width:100%;}
.csa-scope, .csa-scope div, .csa-scope p, .csa-scope span, .csa-scope li, .csa-scope td, .csa-scope th,
.csa-scope a, .csa-scope button, .csa-scope input, .csa-scope blockquote, .csa-scope figcaption,
.csa-scope h1, .csa-scope h2, .csa-scope h3, .csa-scope h4{
  font-family:var(--f-body);
}
.csa-scope button, .csa-scope input{font-size:inherit; line-height:inherit;}
.csa-scope img{max-width:100%; display:block;}
.csa-scope a{color:inherit; text-decoration:none;}
.csa-scope h1, .csa-scope h2, .csa-scope h3, .csa-scope h4{font-family:var(--f-display); font-weight:var(--h-weight); letter-spacing:var(--h-spacing); text-transform:var(--h-case); margin:0; color:inherit;}
.csa-scope .csa-on-dark, .csa-scope .csa-on-dark h2, .csa-scope .csa-on-dark h3, .csa-scope .csa-on-dark h4{color:var(--on-dark);}
.csa-scope p{margin:0;}
.csa-scope ::selection{background:var(--gold); color:var(--on-gold);}
.csa-scope mark{background:color-mix(in srgb, var(--gold) 28%, transparent); color:inherit; padding:0 .15em; border-radius:3px;}
.csa-scope .csa-body a, .csa-scope .csa-intro a, .csa-scope .csa-visual-body a{color:var(--slate); text-decoration:underline; text-underline-offset:3px;}
.csa-scope .csa-body strong{color:var(--on-light);}
.csa-scope a:focus-visible, .csa-scope button:focus-visible{outline:2px solid var(--gold); outline-offset:3px;}
.csa-scope .csa-eyebrow{
  font-family:var(--f-mono); font-size:12px; letter-spacing:.16em; text-transform:uppercase;
  display:flex; align-items:center; gap:12px; font-weight:500;
}
.csa-scope .csa-cta-content h1,.csa-scope .csa-cta-content h2,.csa-scope .csa-cta-content h3,
.csa-scope .csa-cta-content h4,.csa-scope .csa-cta-content h5,.csa-scope .csa-cta-content h6{
  font-size:var(--fs-section); line-height:1.2; color:var(--on-dark);
}
.csa-scope .csa-cta-content h3,.csa-scope .csa-cta-content h4,
.csa-scope .csa-cta-content h5,.csa-scope .csa-cta-content h6{font-size:var(--fs-h4);}
.csa-scope .csa-rv{opacity:0; transform:translateY(34px); transition:opacity .95s cubic-bezier(.16,.84,.44,1), transform .95s cubic-bezier(.16,.84,.44,1);}
.csa-scope .csa-rv.is-in{opacity:1; transform:none;}
.csa-scope .csa-rv-1{transition-delay:.08s;}
.csa-scope .csa-rv-2{transition-delay:.16s;}
.csa-scope .csa-rv-3{transition-delay:.24s;}
@media(prefers-reduced-motion:reduce){
  .csa-scope .csa-rv{opacity:1; transform:none; transition:none;}
}
.csa-scope .csa-ghost{
  position:absolute; right:18px; bottom:-.16em; font-family:var(--f-display); font-weight:800;
  font-size:clamp(90px,14vw,190px); line-height:1; color:var(--ghost-dark);
  pointer-events:none; user-select:none; z-index:0;
}
.csa-scope .csa-ghost-ink{color:var(--ghost-light);}
.csa-scope .csa-eyebrow::before{content:''; width:30px; height:1px; background:currentColor; opacity:.6; flex:0 0 auto;}
.csa-scope .csa-eyebrow, .csa-scope .csa-btn, .csa-scope .csa-crumb, .csa-scope .csa-meta-role,
.csa-scope .csa-meta-tag, .csa-scope .csa-acc-n, .csa-scope .csa-bubble-name, .csa-scope .csa-step-tag,
.csa-scope .csa-reco-cat, .csa-scope .csa-reco-link, .csa-scope .csa-side-title, .csa-scope .csa-side-cat,
.csa-scope .csa-side-meta, .csa-scope .csa-side-n, .csa-scope .csa-tag, .csa-scope .csa-share-label,
.csa-scope .csa-share-btn, .csa-scope .csa-cta-role, .csa-scope .csa-cta-note, .csa-scope .csa-strip a,
.csa-scope .csa-side-expert-role, .csa-scope .csa-visual-body th, .csa-scope .csa-aio-sub,
.csa-scope .csa-quick-label, .csa-scope .csa-visual-head .csa-eyebrow{
  font-family:var(--f-mono);
}
.csa-scope .csa-btn{
  display:inline-flex; align-items:center; gap:10px; font-family:var(--btn-font); font-size:15px;
  letter-spacing:var(--btn-spacing); text-transform:var(--btn-case); padding:15px 26px; border-radius:var(--btn-r); font-weight:var(--btn-weight);
  transition:transform .4s cubic-bezier(.2,.8,.2,1), background .3s ease, color .3s ease, border-color .3s ease;
  border:0; cursor:pointer;
}
.csa-scope a.csa-btn-fill, .csa-scope button.csa-btn-fill, .csa-scope .csa-btn-fill{background:var(--gold); color:var(--on-gold);}
.csa-scope a.csa-btn-fill:hover, .csa-scope button.csa-btn-fill:hover, .csa-scope .csa-btn-fill:hover{background:var(--gold); color:var(--on-gold); filter:brightness(.92); transform:translateY(-3px);}
.csa-scope a.csa-btn-line, .csa-scope button.csa-btn-line, .csa-scope .csa-btn-line{border:1px solid rgba(255,255,255,0.45); color:var(--on-dark); background:transparent;}
.csa-scope a.csa-btn-line:hover, .csa-scope button.csa-btn-line:hover, .csa-scope .csa-btn-line:hover{border-color:var(--on-dark); color:var(--on-dark); background:rgba(255,255,255,.08); transform:translateY(-3px);}
.csa-scope a.csa-btn-ink, .csa-scope button.csa-btn-ink, .csa-scope .csa-btn-ink{border:1px solid color-mix(in srgb, var(--ink) 35%, transparent); color:var(--on-light); background:transparent;}
.csa-scope a.csa-btn-ink:hover, .csa-scope button.csa-btn-ink:hover, .csa-scope .csa-btn-ink:hover{border-color:var(--on-light); color:var(--on-light); transform:translateY(-3px);}

.csa-progress{
  position:fixed; top:0; left:0; right:0; z-index:99990; height:38px;
  display:flex; align-items:center; gap:14px; padding:0 clamp(12px,3vw,30px);
  background:color-mix(in srgb, var(--pale) 94%, transparent); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line-light);
  opacity:0; transform:translateY(-100%); pointer-events:none;
  transition:opacity .45s cubic-bezier(.2,.8,.2,1), transform .45s cubic-bezier(.2,.8,.2,1);
}
.csa-progress.is-on{opacity:1; transform:none;}
.csa-progress-label{
  font-family:var(--f-mono); font-size:11px; letter-spacing:.1em;
  text-transform:uppercase; color:var(--on-light-accent); white-space:nowrap; flex:0 0 auto;
}
.csa-pulse{position:relative; flex:1; height:26px; min-width:0;}
.csa-pulse svg{width:100%; height:100%; display:block; overflow:visible;}
.csa-pulse-bg{fill:none; stroke:var(--line-light); stroke-width:2px; stroke-linecap:round; stroke-linejoin:round;}
.csa-pulse-fill{
  fill:none; stroke:var(--gold); stroke-width:2.4px; stroke-linecap:round; stroke-linejoin:round;
  filter:drop-shadow(0 0 5px color-mix(in srgb, var(--gold) 70%, transparent));
}
.csa-pulse-dot{
  position:absolute; top:50%; width:9px; height:9px; margin:-4.5px 0 0 -4.5px; border-radius:50%;
  background:var(--gold); pointer-events:none; animation:csaBeat 1.15s ease-in-out infinite;
}
@keyframes csaBeat{
  0%{box-shadow:0 0 0 0 color-mix(in srgb, var(--gold) 55%, transparent);}
  70%{box-shadow:0 0 0 10px color-mix(in srgb, var(--gold) 0%, transparent);}
  100%{box-shadow:0 0 0 0 color-mix(in srgb, var(--gold) 0%, transparent);}
}
@media(max-width:640px){
  .csa-progress{height:32px; gap:10px;}
  .csa-progress-label{display:none;}
}
@media(prefers-reduced-motion:reduce){ .csa-pulse-dot{animation:none;} }

.csa-scope .csa-hero{
  position:relative; min-height:72vh; display:flex; flex-direction:column; justify-content:flex-end;
  background:var(--ink); color:var(--on-dark); overflow:hidden; padding:120px var(--pad) 56px;
}
.csa-scope .csa-hero-bg{position:absolute; inset:-5% 0; z-index:0; overflow:hidden; will-change:transform;}
.csa-scope .csa-hero-bg img{
  width:100%; height:100%; object-fit:cover; object-position:center 30%;
  transform:scale(1.18); transform-origin:center center; will-change:transform;
  animation:csaHeroZoom 26s cubic-bezier(.22,.61,.36,1) forwards;
}
@keyframes csaHeroZoom{ from{transform:scale(1.18);} to{transform:scale(1.02);} }

@media(prefers-reduced-motion:reduce){
  .csa-scope .csa-hero-bg img{animation:none; transform:scale(1.02);}
}
.csa-scope .csa-hero-bg::after{content:''; position:absolute; inset:0; background:linear-gradient(180deg, color-mix(in srgb, var(--ink) 62%, transparent) 0%, color-mix(in srgb, var(--ink) 34%, transparent) 32%, color-mix(in srgb, var(--ink) 92%, transparent) 100%);}
.csa-scope .csa-hero-bg::before{content:''; position:absolute; inset:0; z-index:1; background:linear-gradient(90deg, color-mix(in srgb, var(--ink) 68%, transparent) 0%, color-mix(in srgb, var(--ink) 12%, transparent) 46%, color-mix(in srgb, var(--ink) 0%, transparent) 62%, color-mix(in srgb, var(--ink) 50%, transparent) 100%);}
.csa-scope .csa-hero-inner{position:relative; z-index:2; max-width:1360px; margin:0 auto; width:100%;}
.csa-scope .csa-crumb{font-family:var(--f-mono); font-size:11.5px; letter-spacing:.06em; color:var(--on-dark-muted); margin-bottom:26px; display:flex; flex-wrap:wrap; gap:8px; align-items:center;}
.csa-scope .csa-crumb a:hover{color:var(--on-dark-accent);}
.csa-scope .csa-crumb-sep{opacity:.5;}
.csa-scope .csa-crumb-cur{color:var(--on-dark-accent);}
.csa-scope .csa-hero .csa-eyebrow{color:var(--on-dark-accent); margin-bottom:22px;}
.csa-scope .csa-hero h1{color:var(--paper) !important; font-size:var(--fs-hero); line-height:1.04; letter-spacing:-0.03em; font-weight:500; max-width:16ch;}
.csa-scope .csa-hero h1 em{font-style:normal; font-weight:300; color:var(--on-dark-accent);}
.csa-scope .csa-scroll-mark{
  position:absolute; right:var(--pad); top:52%; transform:translateY(-50%) rotate(90deg); transform-origin:right center;
  z-index:2; color:var(--on-dark-faint); font-family:var(--f-mono); font-size:11px; letter-spacing:.2em;
  display:flex; align-items:center; gap:12px; pointer-events:none;
}
.csa-scope .csa-scroll-mark::after{content:''; width:44px; height:1px; background:var(--on-dark-faint);}
@media(max-width:900px){ .csa-scope .csa-scroll-mark{display:none;} }
.csa-scope .csa-meta{display:flex; align-items:center; gap:18px; flex-wrap:wrap; margin-top:36px;}
.csa-scope .csa-meta-author{display:flex; align-items:center; gap:14px;}
.csa-scope .csa-meta-av{width:52px; height:52px; border-radius:50%; object-fit:cover; box-shadow:var(--shadow); flex:0 0 auto;}
.csa-scope .csa-meta-name{font-family:var(--f-display); font-weight:600; font-size:15px; color:var(--on-dark);}
.csa-scope .csa-meta-role{font-family:var(--f-mono); font-size:11px; letter-spacing:.05em; text-transform:uppercase; color:var(--on-dark-muted); margin-top:4px;}
.csa-scope .csa-meta-dot{width:4px; height:4px; border-radius:50%; background:var(--on-dark-faint);}
.csa-scope .csa-meta-tag{font-family:var(--f-mono); font-size:11.5px; letter-spacing:.05em; color:var(--on-dark-muted); display:flex; align-items:center; gap:8px;}
.csa-scope .csa-meta-tag svg{width:14px; height:14px; fill:var(--gold);}

@media(max-width:768px){
  .csa-scope .csa-hero{padding:90px var(--pad-m) 40px; min-height:0;}
  .csa-scope .csa-meta{gap:12px;}
  .csa-scope .csa-meta-dot{display:none;}
}

.csa-scope .csa-strip{background:var(--ink); display:grid; grid-template-columns:repeat(3,1fr);}
.csa-scope .csa-strip a{
  display:flex; align-items:center; justify-content:center; gap:12px; padding:22px 16px; text-align:center;
  font-family:var(--f-mono); font-size:13px; font-weight:600; transition:filter .3s ease;
}
.csa-scope .csa-strip a:hover{filter:brightness(1.08);}
.csa-scope .csa-strip a:nth-child(odd){background:var(--gold); color:var(--on-gold);}
.csa-scope .csa-strip a:nth-child(even){background:var(--slate); color:var(--on-dark);}
.csa-scope .csa-strip svg{width:18px; height:18px; fill:currentColor; flex:0 0 auto;}

@media(max-width:700px){ .csa-strip{grid-template-columns:1fr; gap:1px;} }

.csa-scope .csa-wrap{
  max-width:1360px; margin:0 auto; padding:90px var(--pad) 0; width:100%;
  display:grid; grid-template-columns:minmax(0,1fr) 340px; gap:var(--gap); align-items:start;
}
.csa-scope .csa-wrap > .csa-main{min-width:0; max-width:100%;}

@media(max-width:1080px){ .csa-wrap{grid-template-columns:1fr; gap:50px; padding:60px var(--pad-m) 0;} }

.csa-scope .csa-intro{
  font-family:var(--f-display); font-weight:500; font-size:var(--fs-lead); line-height:1.6;
  color:var(--on-light); padding-left:26px; border-left:3px solid var(--gold); margin-bottom:48px;
}
.csa-scope .csa-intro p{margin-bottom:14px;}
.csa-scope .csa-intro p:last-child{margin-bottom:0;}

.csa-scope .csa-aio{position:relative; overflow:hidden; background:var(--ink); color:var(--on-dark); border-radius:12px; padding:40px 38px; margin-bottom:52px; box-shadow:var(--shadow);}
.csa-scope .csa-aio > *{position:relative; z-index:1;}
.csa-scope .csa-aio-head{margin-bottom:26px;}
.csa-scope .csa-aio .csa-eyebrow{color:var(--on-dark-accent); margin-bottom:14px;}
.csa-scope .csa-aio-title{font-size:var(--fs-h3); font-weight:600; line-height:1.25; color:var(--on-dark);}
.csa-scope .csa-aio-sub{color:var(--on-dark-muted); font-size:14.5px; margin-top:8px;}
.csa-scope .csa-aio-items{display:grid; gap:1px; background:var(--line-dark); border-radius:8px; overflow:hidden;}
.csa-scope .csa-aio-item{background:var(--ink); display:flex; gap:14px; align-items:flex-start; padding:18px 20px;}
.csa-scope .csa-aio-item svg{flex:0 0 auto; width:16px; height:16px; fill:var(--gold); margin-top:4px;}
.csa-scope .csa-aio-item a{color:var(--on-dark-accent); overflow-wrap:anywhere;}
.csa-scope .csa-aio-item p{font-size:15px; color:var(--on-dark-strong); line-height:1.6;}

@media(max-width:640px){ .csa-aio{padding:30px 24px;} }

.csa-scope .csa-body{font-size:var(--fs-body); line-height:1.85; color:var(--on-light-muted); counter-reset:csasection;}
.csa-scope .csa-body h2{counter-increment:csasection; position:relative; padding-top:30px;}
.csa-scope .csa-body h2::before{
  content:counter(csasection,decimal-leading-zero); position:absolute; top:0; left:0;
  font-family:var(--f-mono); font-size:12px; font-weight:600; letter-spacing:.14em; color:var(--on-light-accent);
}
.csa-scope .csa-body h2::after{
  content:''; position:absolute; top:6px; left:34px; right:0; height:1px; background:var(--line-light);
}
.csa-scope .csa-body > *{margin-bottom:24px;}
.csa-scope .csa-body > *:last-child{margin-bottom:0;}
.csa-scope .csa-body h2{font-size:var(--fs-section); line-height:1.2; color:var(--on-light); margin-top:60px; margin-bottom:20px;}
.csa-scope .csa-body h3{font-size:var(--fs-h3); line-height:1.3; color:var(--on-light); margin-top:44px; margin-bottom:14px;}
.csa-scope .csa-body h4{font-size:var(--fs-h4); color:var(--on-light); margin-top:32px; margin-bottom:10px;}
.csa-scope .csa-body h1{font-size:var(--fs-h1); line-height:1.15; color:var(--on-light); margin-top:0; margin-bottom:20px;}
.csa-scope .csa-body h5{font-size:var(--fs-h5); color:var(--on-light); margin-top:28px; margin-bottom:8px;}
.csa-scope .csa-body h6{font-size:var(--fs-h6); color:var(--on-light); margin-top:24px; margin-bottom:8px;}
.csa-scope .csa-body h2:first-child, .csa-scope .csa-body h3:first-child{margin-top:0;}
.csa-scope .csa-body a{color:var(--on-light-accent); border-bottom:1px solid var(--line-light); transition:border-color .3s ease;}
.csa-scope .csa-body a:hover{border-color:var(--on-light-accent);}
.csa-scope .csa-body strong{font-weight:700; color:var(--on-light);}
.csa-scope .csa-body ul, .csa-scope .csa-body ol{padding-left:0; list-style:none;}
.csa-scope .csa-body ul li{position:relative; padding-left:30px; margin-bottom:12px;}
.csa-scope .csa-body ul li::before{content:''; position:absolute; left:6px; top:12px; width:7px; height:7px; border-radius:50%; background:var(--gold);}
.csa-scope .csa-body ol{counter-reset:csanum;}
.csa-scope .csa-body ol li{position:relative; padding-left:38px; margin-bottom:12px; counter-increment:csanum;}
.csa-scope .csa-body ol li::before{
  content:counter(csanum,decimal-leading-zero); position:absolute; left:0; top:2px;
  font-family:var(--f-mono); font-size:12.5px; font-weight:600; color:var(--on-light-accent);
}
.csa-scope .csa-body blockquote{
  margin:36px 0; padding:28px 32px; background:var(--offwhite); border-radius:10px; border-left:3px solid var(--gold);
  font-family:var(--f-display); font-size:var(--fs-lead); font-weight:500; line-height:1.6; color:var(--on-light);
}
.csa-scope .csa-body img{border-radius:10px; box-shadow:0 24px 50px -34px color-mix(in srgb, var(--ink) 40%, transparent);}
.csa-scope .csa-body figure{margin:36px 0;}
.csa-scope .csa-body figcaption{font-family:var(--f-mono); font-size:11.5px; letter-spacing:.05em; color:var(--on-light-accent); margin-top:12px;}
.csa-scope .csa-body table{width:100%; border-collapse:collapse; font-size:15px; background:var(--offwhite); border-radius:10px; display:block; overflow-x:auto; -webkit-overflow-scrolling:touch;}
.csa-scope .csa-body th, .csa-scope .csa-body td{padding:14px 18px; text-align:left; border-bottom:1px solid var(--line-light);}
.csa-scope .csa-body th{font-family:var(--f-mono); font-size:11.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--on-light-accent); font-weight:600;}
.csa-scope .csa-body hr{border:0; border-top:1px solid var(--line-light); margin:48px 0;}

.csa-scope .csa-steps{position:relative; overflow:hidden; background:var(--ink); color:var(--on-dark); border-radius:12px; padding:52px 44px; margin:64px 0;}
.csa-scope .csa-steps > *{position:relative; z-index:1;}
.csa-scope .csa-steps .csa-eyebrow{color:var(--on-dark-accent); margin-bottom:20px;}
.csa-scope .csa-steps h2{font-size:var(--fs-section); line-height:1.15; margin-bottom:16px; color:var(--on-dark);}
.csa-scope .csa-steps-intro{color:var(--on-dark-muted); font-size:16px; line-height:1.7; max-width:620px; margin-bottom:40px;}
.csa-scope .csa-steps-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line-dark); border-radius:8px; overflow:hidden;}
.csa-scope .csa-step{background:var(--ink); padding:32px 26px; transition:background .35s ease;}
.csa-scope .csa-step:hover{background:var(--ink-soft);}
.csa-scope .csa-step-n{font-family:var(--f-display); font-weight:600; font-size:34px; color:var(--on-dark-accent); line-height:1; display:block; margin-bottom:16px;}
.csa-scope .csa-step h3{font-size:var(--fs-h5); font-weight:600; margin-bottom:10px; line-height:1.35; color:var(--on-dark);}
.csa-scope .csa-step p{font-size:14px; color:var(--on-dark-muted); line-height:1.65; margin-bottom:18px;}
.csa-scope .csa-step-tag{font-family:var(--f-mono); font-size:10.5px; letter-spacing:.08em; text-transform:uppercase; color:var(--on-dark-accent); display:flex; align-items:center; gap:8px;}
.csa-scope .csa-step-tag::before{content:''; width:6px; height:6px; border-radius:50%; background:var(--gold); flex:0 0 auto;}

@media(max-width:860px){ .csa-steps{padding:34px 26px;} .csa-steps-grid{grid-template-columns:1fr;} }

.csa-scope .csa-cta{
  position:relative; overflow:hidden; background:var(--ink); color:var(--on-dark); border-radius:12px; border-top:4px solid var(--gold);
  padding:44px 44px 46px; margin:64px 0; box-shadow:var(--shadow);
}
.csa-scope .csa-cta > *{position:relative; z-index:1;}
.csa-scope .csa-cta-person{
  display:flex; align-items:center; gap:16px; padding-bottom:26px; margin-bottom:30px;
  border-bottom:1px solid var(--line);
}
.csa-scope .csa-cta-av{width:58px; height:58px; border-radius:50%; object-fit:cover; flex:0 0 58px; margin:0;}
.csa-scope .csa-cta-name{font-family:var(--f-display); font-weight:600; font-size:16px; color:var(--on-dark); line-height:1.3;}
.csa-scope .csa-cta-role{font-family:var(--f-mono); font-size:11px; letter-spacing:.05em; text-transform:uppercase; color:var(--on-dark-soft); margin-top:5px;}
.csa-scope .csa-cta-content{display:block;}
.csa-scope .csa-cta-content > *{margin-bottom:0;}
.csa-scope .csa-cta-content > * + *{margin-top:16px;}
.csa-scope .csa-cta-content > p + .csa-cta-btns,
.csa-scope .csa-cta-content > ul + .csa-cta-btns{margin-top:28px;}
.csa-scope .csa-cta-content .csa-eyebrow{color:var(--on-dark-accent); margin-bottom:18px;}
.csa-scope .csa-cta-h{
  color:var(--on-dark); font-family:var(--f-display); font-weight:600;
  font-size:var(--fs-section); line-height:1.2; letter-spacing:-0.01em; margin-bottom:16px; max-width:20ch;
}
.csa-scope .csa-cta-p{color:var(--on-dark-muted); font-size:var(--fs-body); line-height:1.75; margin-bottom:0; max-width:60ch;}
.csa-scope .csa-cta-btns{display:flex; gap:14px; flex-wrap:wrap; align-items:center; margin-top:28px;}
.csa-scope .csa-cta-note{
  margin-top:22px !important; font-family:var(--f-mono); font-size:11px; letter-spacing:.05em; text-transform:uppercase;
  color:var(--on-dark-soft); display:flex; align-items:center; gap:9px;
}
.csa-scope .csa-cta-note::before{content:''; width:7px; height:7px; border-radius:50%; background:var(--gold); flex:0 0 auto;}

@media(max-width:860px){
  .csa-scope .csa-cta{padding:30px 24px 32px;}
  .csa-scope .csa-cta-person{padding-bottom:20px; margin-bottom:24px;}
  .csa-scope .csa-cta-btns{gap:12px;}
  .csa-scope .csa-cta-btns .csa-btn{width:100%; justify-content:center;}
}

.csa-scope .csa-visual{margin:64px 0; background:var(--offwhite); border-radius:12px; overflow:hidden; box-shadow:0 30px 60px -38px color-mix(in srgb, var(--ink) 34%, transparent); border-top:4px solid var(--gold);}
.csa-scope .csa-visual-head{padding:34px 40px 0;}
.csa-scope .csa-visual-head .csa-eyebrow{color:var(--on-light-accent); margin-bottom:14px;}
.csa-scope .csa-visual-head h3{font-size:var(--fs-h3); font-weight:600; line-height:1.3; color:var(--on-light);}
.csa-scope .csa-visual-body{padding:26px 40px 38px; font-size:var(--fs-body); line-height:1.8; color:var(--on-light-muted);}
.csa-scope .csa-visual-body > *{margin-bottom:20px;}
.csa-scope .csa-visual-body > *:last-child{margin-bottom:0;}
.csa-scope .csa-visual-body h1,.csa-scope .csa-visual-body h2,.csa-scope .csa-visual-body h3,
.csa-scope .csa-visual-body h4,.csa-scope .csa-visual-body h5,.csa-scope .csa-visual-body h6{color:var(--on-light); line-height:1.3; margin:26px 0 12px;}
.csa-scope .csa-visual-body h1{font-size:var(--fs-h3);}
.csa-scope .csa-visual-body h2{font-size:var(--fs-h4);}
.csa-scope .csa-visual-body h3{font-size:var(--fs-h5);}
.csa-scope .csa-visual-body h4,.csa-scope .csa-visual-body h5,.csa-scope .csa-visual-body h6{font-size:var(--fs-h6);}
.csa-scope .csa-visual-body > *:first-child{margin-top:0;}
.csa-scope .csa-visual-body ul,.csa-scope .csa-visual-body ol{list-style:none; padding-left:0;}
.csa-scope .csa-visual-body ul li{position:relative; padding-left:30px; margin-bottom:12px;}
.csa-scope .csa-visual-body ul li::before{content:''; position:absolute; left:6px; top:11px; width:7px; height:7px; border-radius:50%; background:var(--gold);}
.csa-scope .csa-visual-body table{width:100%; border-collapse:collapse; font-size:15px; display:block; overflow-x:auto; -webkit-overflow-scrolling:touch;}
.csa-scope .csa-visual-body *{max-width:100%;}
.csa-scope .csa-visual-body [style*="width"]{max-width:100% !important;}
.csa-scope .csa-visual-body th,.csa-scope .csa-visual-body td{padding:13px 16px; text-align:left; border-bottom:1px solid var(--line-light);}
.csa-scope .csa-visual-body th{font-family:var(--f-mono); font-size:11.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--on-light-accent); font-weight:600;}
.csa-scope .csa-visual-body img{border-radius:8px;}

@media(max-width:640px){
  .csa-scope .csa-visual-head{padding:26px 24px 0;}
  .csa-scope .csa-visual-body{padding:20px 24px 30px;}
}

.csa-scope .csa-faq{margin:70px 0;}
.csa-scope .csa-faq-head{margin-bottom:36px;}
.csa-scope .csa-faq-head .csa-eyebrow{color:var(--on-light-accent); margin-bottom:20px;}
.csa-scope .csa-faq-head h2{font-size:var(--fs-section); line-height:1.15; margin-bottom:14px;}
.csa-scope .csa-faq-sub{font-size:var(--fs-body); color:var(--on-light-soft); line-height:1.7; max-width:640px;}
.csa-scope .csa-acc-item{border-top:1px solid var(--line-light);}
.csa-scope .csa-acc-item:last-child{border-bottom:1px solid var(--line-light);}
.csa-scope .csa-acc-btn{
  width:100%; text-align:left; background:none; border:0; cursor:pointer; padding:26px 0;
  display:grid; grid-template-columns:56px 1fr 28px; align-items:center; gap:18px;
  font-family:var(--f-display); font-size:var(--fs-h4); font-weight:400; color:var(--on-light); line-height:1.4;
}
.csa-scope .csa-acc-n{font-family:var(--f-mono); font-size:12.5px; color:var(--on-light-accent);}
.csa-scope .csa-acc-plus{width:26px; height:26px; position:relative;}
.csa-scope .csa-acc-plus::before, .csa-scope .csa-acc-plus::after{content:''; position:absolute; background:var(--ink); top:50%; left:50%; transform:translate(-50%,-50%);}
.csa-scope .csa-acc-plus::before{width:15px; height:1.5px;}
.csa-scope .csa-acc-plus::after{width:1.5px; height:15px; transition:transform .35s ease;}
.csa-scope .csa-acc-item.is-open .csa-acc-plus::after{transform:translate(-50%,-50%) rotate(90deg) scaleY(0);}
.csa-scope .csa-acc-panel{max-height:0; overflow:hidden; transition:max-height .5s ease;}
.csa-scope .csa-acc-inner{padding:0 0 30px 74px;}
.csa-scope .csa-answer{display:flex; gap:16px; align-items:flex-start;}
.csa-scope .csa-answer-av{width:44px; height:44px; border-radius:50%; object-fit:cover; flex:0 0 auto;}
.csa-scope .csa-bubble{background:var(--offwhite); border-radius:10px; padding:20px 24px; box-shadow:0 20px 44px -34px color-mix(in srgb, var(--ink) 35%, transparent);}
.csa-scope .csa-bubble-name{font-family:var(--f-mono); font-size:11px; letter-spacing:.05em; text-transform:uppercase; color:var(--on-light-accent); font-weight:600; margin-bottom:10px;}
.csa-scope .csa-bubble-text{font-size:var(--fs-small); line-height:1.75; color:var(--on-light-muted);}

@media(max-width:700px){
  .csa-scope .csa-acc-btn{grid-template-columns:28px 1fr 22px; font-size:16.5px; gap:12px;}
  .csa-scope .csa-acc-inner{padding-left:0;}
  .csa-scope .csa-answer-av{display:none;}
}

.csa-scope .csa-reco{margin:70px 0;}
.csa-scope .csa-reco .csa-eyebrow{color:var(--on-light-accent); margin-bottom:20px;}
.csa-scope .csa-reco h2{font-size:var(--fs-section); line-height:1.15; margin-bottom:10px;}
.csa-scope .csa-reco h2 em{font-style:normal; font-weight:300; color:var(--on-light-accent);}
.csa-scope .csa-reco-sub{font-size:16px; color:var(--on-light-soft); line-height:1.7; max-width:560px; margin-bottom:32px;}
.csa-scope .csa-reco-cards{display:grid; grid-template-columns:1fr 1fr; gap:24px;}
.csa-scope .csa-reco-card{
  background:var(--offwhite); border-radius:10px; overflow:hidden; display:block;
  box-shadow:0 24px 50px -34px color-mix(in srgb, var(--ink) 30%, transparent);
  transition:transform .4s cubic-bezier(.2,.8,.2,1), box-shadow .4s ease;
}
.csa-scope .csa-reco-card:hover{transform:translateY(-6px); box-shadow:0 32px 60px -28px color-mix(in srgb, var(--ink) 40%, transparent);}
.csa-scope .csa-reco-thumb{position:relative; aspect-ratio:16/10; overflow:hidden; background:var(--slate);}
.csa-scope .csa-reco-thumb::after{content:''; position:absolute; inset:0; background:linear-gradient(160deg, color-mix(in srgb, var(--ink) 5%, transparent), color-mix(in srgb, var(--ink) 55%, transparent));}
.csa-scope .csa-reco-thumb img{width:100%; height:100%; object-fit:cover; transform:scale(1.02); transition:transform .6s cubic-bezier(.2,.8,.2,1);}
.csa-scope .csa-reco-card:hover .csa-reco-thumb img{transform:scale(1.08);}
.csa-scope .csa-reco-body{padding:22px 24px 26px;}
.csa-scope .csa-reco-cat{font-family:var(--f-mono); font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:var(--on-light-accent); display:block; margin-bottom:10px;}
.csa-scope .csa-reco-title{font-family:var(--f-display); font-size:var(--fs-card); font-weight:600; line-height:1.35; margin-bottom:10px; color:var(--on-light);}
.csa-scope .csa-reco-desc{font-size:14px; color:var(--on-light-soft); line-height:1.6; margin-bottom:16px;}
.csa-scope .csa-reco-link{display:inline-flex; align-items:center; gap:7px; font-family:var(--f-mono); font-size:11.5px; letter-spacing:.05em; text-transform:uppercase; font-weight:600; color:var(--on-light);}
.csa-scope .csa-reco-link svg{width:11px; height:11px; fill:var(--ink); transition:transform .3s cubic-bezier(.2,.8,.2,1);}
.csa-scope .csa-reco-card:hover .csa-reco-link svg{transform:translateX(4px);}

@media(max-width:640px){ .csa-reco-cards{grid-template-columns:1fr;} }

.csa-scope .csa-share{border-top:1px solid var(--line-light); border-bottom:1px solid var(--line-light); padding:34px 0; margin:60px 0; display:flex; gap:30px; justify-content:space-between; flex-wrap:wrap; align-items:center;}
.csa-scope .csa-share-label{font-family:var(--f-mono); font-size:11.5px; letter-spacing:.08em; text-transform:uppercase; color:var(--on-light-accent); font-weight:600; margin-bottom:16px;}
.csa-scope .csa-share-btns{display:flex; gap:10px; flex-wrap:wrap;}
.csa-scope .csa-share-btn{
  display:inline-flex; align-items:center; gap:9px; padding:11px 18px; border-radius:100px;
  background:var(--offwhite); border:1px solid var(--line-light); cursor:pointer;
  font-family:var(--f-mono); font-size:12px; font-weight:600; color:var(--on-light);
  transition:background .3s ease, color .3s ease, transform .3s ease;
}
.csa-scope .csa-share-btn:hover{background:var(--ink); color:var(--on-dark); transform:translateY(-2px);}
.csa-scope .csa-share-btn svg{width:15px; height:15px; fill:currentColor;}
.csa-scope .csa-copy-done{opacity:0; transition:opacity .3s ease; color:var(--on-light-accent);}
.csa-scope .csa-copy-done.is-visible{opacity:1;}
.csa-scope .csa-follow-icons{display:flex; gap:10px;}
.csa-scope .csa-follow-icon{width:42px; height:42px; border-radius:50%; background:var(--ink); display:flex; align-items:center; justify-content:center; transition:background .3s ease, transform .3s ease;}
.csa-scope .csa-follow-icon:hover{background:var(--gold); transform:translateY(-3px);}
.csa-scope .csa-follow-icon svg{width:18px; height:18px; fill:var(--on-dark); transition:fill .3s ease;}
.csa-scope .csa-follow-icon:hover svg{fill:var(--ink);}

.csa-scope .csa-sidebar{display:flex; flex-direction:column; gap:26px; position:sticky; top:24px;}

@media(max-width:1080px){ .csa-sidebar{position:static;} }
.csa-scope .csa-side-card{background:var(--offwhite); border-radius:12px; overflow:hidden; box-shadow:0 24px 50px -36px color-mix(in srgb, var(--ink) 30%, transparent);}
.csa-scope .csa-side-expert{background:var(--ink); color:var(--on-dark); text-align:center; padding:36px 28px;}
.csa-scope .csa-side-expert img{width:88px; height:88px; border-radius:50%; object-fit:cover; margin:0 auto 16px; box-shadow:var(--shadow);}
.csa-scope .csa-side-expert-name{font-family:var(--f-display); font-weight:600; font-size:18px; color:var(--on-dark);}
.csa-scope .csa-side-expert-role{font-family:var(--f-mono); font-size:11px; letter-spacing:.05em; text-transform:uppercase; color:var(--on-dark-soft); margin-top:6px; margin-bottom:18px;}
.csa-scope .csa-side-expert p{font-size:14.5px; color:var(--on-dark-muted); line-height:1.65; margin-bottom:22px;}
.csa-scope .csa-side-head{padding:22px 24px 0;}
.csa-scope .csa-side-title{font-family:var(--f-mono); font-size:11.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--on-light-accent); font-weight:600;}
.csa-scope .csa-side-list{padding:16px 24px 24px;}
.csa-scope .csa-side-item{display:grid; grid-template-columns:28px 1fr; gap:14px; padding:16px 0; border-top:1px solid var(--line-light); align-items:start;}
.csa-scope .csa-side-item:first-child{border-top:0;}
.csa-scope .csa-side-n{font-family:var(--f-mono); font-size:12px; color:var(--on-dark-accent); font-weight:600; padding-top:2px;}
.csa-scope .csa-side-cat{font-family:var(--f-mono); font-size:10.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--on-light-accent); display:block; margin-bottom:6px;}
.csa-scope .csa-side-h{display:block;}
.csa-scope .csa-side-expert-name{font-size:var(--fs-card);}
.csa-scope .csa-side-meta{display:block;}
.csa-scope .csa-side-h{font-family:var(--f-display); font-size:15px; font-weight:600; line-height:1.4; color:var(--on-light); transition:color .3s ease;}
.csa-scope .csa-side-item:hover .csa-side-h{color:var(--on-light-accent);}
.csa-scope .csa-side-meta{font-family:var(--f-mono); font-size:10.5px; color:var(--on-light-accent); opacity:.8; margin-top:6px;}
.csa-scope .csa-tags{display:flex; flex-wrap:wrap; gap:8px; padding:16px 24px 24px;}
.csa-scope .csa-tag{
  font-family:var(--f-mono); font-size:11.5px; font-weight:600; padding:8px 15px; border-radius:100px;
  background:var(--pale); color:var(--on-light); transition:background .3s ease, color .3s ease;
}
.csa-scope .csa-tag:hover, .csa-scope .csa-tag.is-active{background:var(--ink); color:var(--on-dark);}

.csa-scope .csa-side-card.csa-toc{background:var(--ink); color:var(--on-dark); border-radius:12px; overflow:hidden;}
.csa-scope .csa-side-card.csa-toc .csa-side-head{padding:24px 24px 0;}
.csa-scope .csa-side-card.csa-toc .csa-side-title{color:var(--on-dark-accent);}
.csa-scope .csa-side-card.csa-toc .csa-toc-list{padding:16px 24px 26px; display:flex; flex-direction:column;}
.csa-scope .csa-side-card.csa-toc .csa-toc-link{
  display:grid; grid-template-columns:26px 1fr; gap:12px; align-items:start; padding:12px 0;
  border-top:1px solid var(--line); color:var(--on-dark-muted);
  font-size:var(--fs-small); line-height:1.45; transition:color .3s ease, padding-left .3s ease;
}
.csa-scope .csa-side-card.csa-toc .csa-toc-link:first-child{border-top:0;}
.csa-scope .csa-side-card.csa-toc .csa-toc-link span:first-child{
  font-family:var(--f-mono); font-size:11px; color:var(--on-dark-soft); padding-top:2px; transition:color .3s ease;
}
.csa-scope .csa-side-card.csa-toc .csa-toc-link:hover{color:var(--on-dark); padding-left:5px;}
.csa-scope .csa-side-card.csa-toc .csa-toc-link.is-active{color:var(--on-dark); font-weight:600;}
.csa-scope .csa-side-card.csa-toc .csa-toc-link.is-active span:first-child{color:var(--on-dark-accent);}

.csa-scope .csa-band{position:relative; overflow:hidden; background:var(--ink); color:var(--on-dark); padding:110px var(--pad); margin-top:90px;}
.csa-scope .csa-band-inner{position:relative; z-index:1;}
.csa-scope .csa-band-inner{max-width:760px; margin:0 auto; text-align:center;}
.csa-scope .csa-band .csa-eyebrow{color:var(--on-dark-accent); justify-content:center; margin-bottom:22px;}
.csa-scope .csa-band h2{font-size:var(--fs-section); line-height:1.1; margin-bottom:20px; color:var(--on-dark);}
.csa-scope .csa-band p{color:var(--on-dark-muted); font-size:var(--fs-lead); line-height:1.7; margin-bottom:34px;}
.csa-scope .csa-band-btns{display:flex; gap:20px; justify-content:center; flex-wrap:wrap;}

@media(max-width:768px){ .csa-band{padding:70px var(--pad-m);} }

@media(max-width:1440px){
  .csa-scope .csa-wrap{grid-template-columns:minmax(0,1fr) 320px; gap:var(--gap);}
}

@media(max-width:1200px){
  .csa-scope .csa-wrap{grid-template-columns:minmax(0,1fr) 290px;}
  .csa-scope .csa-steps{padding:40px 32px;}
  .csa-scope .csa-cta{padding:38px 34px 40px;}
  .csa-scope .csa-aio{padding:34px 30px;}
}

@media(max-width:1080px){
  .csa-scope .csa-wrap{grid-template-columns:1fr; gap:44px; padding:56px var(--pad) 0;}
  .csa-scope .csa-sidebar{position:static; display:grid; grid-template-columns:1fr 1fr; gap:20px; align-items:start;}
  .csa-scope .csa-side-expert{grid-column:1 / -1;}
}

@media(max-width:900px){
  .csa-scope .csa-hero{min-height:0; padding:96px var(--pad) 44px;}
  .csa-scope .csa-steps-grid{grid-template-columns:1fr;}
  .csa-scope .csa-reco-cards{grid-template-columns:1fr;}
  .csa-scope .csa-intro{padding-left:20px;}
}

@media(max-width:820px){
  .csa-scope .csa-sidebar{grid-template-columns:1fr;}
  .csa-scope .csa-strip{grid-template-columns:1fr;}
  .csa-scope .csa-strip a{justify-content:flex-start; padding:16px var(--pad-m); text-align:left;}
  .csa-scope .csa-share{flex-direction:column; align-items:flex-start; gap:26px;}
}

@media(max-width:680px){
  .csa-scope .csa-hero{padding:80px var(--pad-m) 34px;}
  .csa-scope .csa-hero h1{max-width:none;}
  .csa-scope .csa-crumb{font-size:10.5px; margin-bottom:18px;}
  .csa-scope .csa-meta{gap:14px; margin-top:26px; width:100%;}
  .csa-scope .csa-meta-dot{display:none;}
  .csa-scope .csa-meta-author{width:100%;}
  .csa-scope .csa-meta-av{width:44px; height:44px;}
  .csa-scope .csa-wrap{padding:44px var(--pad-m) 0; gap:36px;}
  .csa-scope .csa-aio{padding:26px 20px; margin-bottom:40px;}
  .csa-scope .csa-aio-item{padding:15px 16px;}
  .csa-scope .csa-steps{padding:28px 20px; margin:48px 0;}
  .csa-scope .csa-step{padding:26px 20px;}
  .csa-scope .csa-cta{padding:26px 20px 28px; margin:48px 0;}
  .csa-scope .csa-cta-av{width:48px; height:48px; flex:0 0 48px;}
  .csa-scope .csa-faq{margin:52px 0;}
  .csa-scope .csa-reco{margin:52px 0;}
  .csa-scope .csa-share{margin:44px 0; padding:26px 0;}
  .csa-scope .csa-body h2{margin-top:44px;}
  .csa-scope .csa-body blockquote{padding:22px 20px;}
  .csa-scope .csa-body table, .csa-scope .csa-visual-body table{font-size:14px;}
  .csa-scope .csa-body th, .csa-scope .csa-body td,
  .csa-scope .csa-visual-body th, .csa-scope .csa-visual-body td{padding:11px 13px;}
  .csa-scope .csa-band{padding:60px var(--pad-m);}
  .csa-scope .csa-band-btns{flex-direction:column; gap:12px;}
  .csa-scope .csa-band-btns .csa-btn{width:100%; justify-content:center;}
}

@media(max-width:480px){
  .csa-scope .csa-hero{padding:70px var(--pad-m) 30px;}
  .csa-scope .csa-body{line-height:1.8;}
  .csa-scope .csa-intro{padding-left:16px; margin-bottom:36px;}
  .csa-scope .csa-btn{padding:14px 22px; font-size:14px;}
  .csa-scope .csa-share-btns{gap:8px;}
  .csa-scope .csa-share-btn{padding:10px 14px; font-size:11.5px;}
  .csa-scope .csa-acc-btn{grid-template-columns:1fr 22px; gap:12px; padding:22px 0;}
  .csa-scope .csa-acc-n{display:none;}
  .csa-scope .csa-bubble{padding:16px 18px;}
  .csa-scope .csa-step-n{font-size:30px;}
  .csa-scope .csa-side-item{grid-template-columns:24px 1fr; gap:10px;}
  .csa-scope .csa-tags{padding:14px 18px 20px;}
  .csa-scope .csa-side-list{padding:12px 18px 20px;}
  .csa-scope .csa-side-head{padding:18px 18px 0;}
  .csa-scope .csa-side-expert{padding:28px 20px;}
  .csa-scope .csa-visual-head{padding:22px 18px 0;}
  .csa-scope .csa-visual-body{padding:18px 18px 26px;}
}

@media(max-width:380px){
  .csa-scope .csa-meta-tag{font-size:10.5px;}
  .csa-scope .csa-cta-btns .csa-btn,
  .csa-scope .csa-side-expert .csa-btn{width:100%; justify-content:center;}
}

@media(hover:none){
  .csa-scope .csa-reco-card:hover,
  .csa-scope .csa-share-btn:hover,
  .csa-scope .csa-btn:hover{transform:none;}
}

@media(prefers-reduced-motion:reduce){
  .csa-scope *{transition-duration:.01ms !important; animation-duration:.01ms !important;}
}

/* Buttons auf dunklen Flächen: ist der Akzent selbst dunkel, werden sie weiß (cs-stil.js) */
.csa-scope .csa-cta .csa-btn-fill, .csa-scope .csa-band .csa-btn-fill, .csa-scope .csa-side-expert .csa-btn-fill{
  background:var(--csa-fill-dunkel, var(--csa-auto-fill-dunkel, var(--gold))); color:var(--csa-fill-dunkel-text, var(--csa-auto-fill-dunkel-text, var(--on-gold)));
}