/* =========================================================
   client.base — One-Pager (Version Okt. 2026)
   Palette: Mint Primary × Deep Green Secondary × Limão Neon Akzent
   ========================================================= */

/* Lokal gehostete Schriften (SIL Open Font License, siehe assets/fonts/OFL-*.txt) */
@font-face{
  font-family:'Inter'; font-style:normal; font-weight:400 700; font-display:swap;
  src:url('../assets/fonts/inter-latin-ext.woff2') format('woff2');
  unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face{
  font-family:'Inter'; font-style:normal; font-weight:400 700; font-display:swap;
  src:url('../assets/fonts/inter-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face{
  font-family:'Space Grotesk'; font-style:normal; font-weight:500 700; font-display:swap;
  src:url('../assets/fonts/spacegrotesk-latin-ext.woff2') format('woff2');
  unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face{
  font-family:'Space Grotesk'; font-style:normal; font-weight:500 700; font-display:swap;
  src:url('../assets/fonts/spacegrotesk-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root{
  --mint:        #C3E8DD;
  --mint-end:    #A8DDD0;
  --mint-gradient: linear-gradient(45deg, var(--mint) 0%, var(--mint-end) 100%);
  --seafoam:     #E9F6F3;
  --base-light:  #F4F6F5;
  --white:       #FFFFFF;
  --deep-green:  #0B6158;
  --deep-green-dark: #084841;
  --lime:        #E6FF2A;

  --ink:         #0A2320;
  --ink-soft:    #3E5B56;
  --ink-faint:   #6E8985;

  --border:      rgba(11,97,88,0.14);

  --shadow-sm:   0 2px 8px rgba(8,72,65,0.06);
  --shadow-md:   0 12px 32px rgba(8,72,65,0.10);
  --shadow-lg:   0 24px 64px rgba(8,72,65,0.16);

  --radius-sm:   10px;
  --radius-md:   18px;
  --radius-lg:   28px;

  --font-head:   'Space Grotesk', 'Inter', sans-serif;
  --font-body:   'Inter', sans-serif;

  --ease:        cubic-bezier(.22,1,.36,1);
}

*, *::before, *::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0;
  font-family:var(--font-body);
  color:var(--ink);
  background:var(--base-light);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
ul{ list-style:none; margin:0; padding:0; }
button{ font-family:inherit; cursor:pointer; border:none; background:none; }
input{ font-family:inherit; }

.wrap{
  max-width:1180px;
  margin:0 auto;
  padding:0 28px;
}

h1,h2,h3,h4{
  font-family:var(--font-head);
  font-weight:600;
  line-height:1.12;
  margin:0;
  color:var(--deep-green-dark);
  letter-spacing:-0.01em;
}

::selection{ background:var(--lime); color:var(--deep-green-dark); }

/* ---------- Cursor glow (desktop only, subtle) ---------- */
.cursor-glow{
  position:fixed;
  top:0; left:0;
  width:420px; height:420px;
  margin-left:-210px; margin-top:-210px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(11,97,88,0.08) 0%, rgba(220,238,233,0) 70%);
  pointer-events:none;
  z-index:0;
  transform:translate(-1000px,-1000px);
  transition:transform .12s linear;
  will-change:transform;
}
@media (max-width:900px){ .cursor-glow{ display:none; } }

/* ---------- Scroll progress bar ---------- */
.progress-bar{
  position:fixed;
  top:0; left:0;
  height:3px;
  width:0%;
  background:linear-gradient(90deg, var(--deep-green), var(--lime));
  z-index:2000;
  transition:width .08s linear;
}

/* =========================================================
   HEADER
   ========================================================= */
.site-header{
  position:fixed;
  top:0; left:0; right:0;
  z-index:1000;
  padding:18px 0;
  transition:padding .3s var(--ease), background .3s var(--ease), box-shadow .3s var(--ease);
}
.site-header.is-scrolled{
  padding:10px 0;
  background:rgba(244,246,245,0.82);
  backdrop-filter:blur(14px) saturate(140%);
  -webkit-backdrop-filter:blur(14px) saturate(140%);
  box-shadow:0 1px 0 var(--border), var(--shadow-sm);
}
.header-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
}
.brand-logo{ height:26px; width:auto; transition:transform .25s var(--ease); }
.brand:hover .brand-logo{ transform:scale(1.03); }

.main-nav{
  display:flex;
  gap:8px;
  background:rgba(255,255,255,0.55);
  border:1px solid var(--border);
  padding:6px;
  border-radius:100px;
}
.main-nav a{
  white-space:nowrap;
  padding:9px 16px;
  border-radius:100px;
  font-size:14.5px;
  font-weight:500;
  color:var(--ink-soft);
  transition:background .25s var(--ease), color .25s var(--ease);
}
.main-nav a:hover{ color:var(--deep-green-dark); background:rgba(11,97,88,0.08); }
.main-nav a.is-active{ color:var(--deep-green-dark); background:var(--white); box-shadow:var(--shadow-sm); }

.header-actions{ display:flex; align-items:center; gap:14px; }

.nav-toggle{
  display:none;
  flex-direction:column;
  justify-content:center;
  gap:5px;
  width:38px; height:38px;
  border-radius:10px;
  background:var(--white);
  border:1px solid var(--border);
}
.nav-toggle span{
  display:block; height:2px; width:18px; margin:0 auto;
  background:var(--deep-green-dark);
  transition:transform .3s var(--ease), opacity .3s var(--ease);
}
.nav-toggle.is-open span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.nav-toggle.is-open span:nth-child(2){ opacity:0; }
.nav-toggle.is-open span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

/* =========================================================
   BUTTONS
   ========================================================= */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:14px 26px;
  border-radius:100px;
  font-weight:600;
  font-size:15px;
  transition:transform .25s var(--ease), box-shadow .25s var(--ease), background .25s var(--ease), color .25s var(--ease);
  white-space:nowrap;
}
.btn-sm{ padding:10px 20px; font-size:14px; }
.btn-lg{ padding:17px 34px; font-size:16px; width:100%; }

.btn-primary{
  background:var(--deep-green-dark);
  color:var(--white);
  box-shadow:0 6px 18px rgba(8,72,65,0.28);
}
.btn-primary:hover{ transform:translateY(-2px); box-shadow:0 10px 26px rgba(8,72,65,0.34); }

.btn-accent{
  background:var(--lime);
  color:var(--deep-green-dark);
  box-shadow:0 6px 18px rgba(230,255,42,0.35);
}
.btn-accent:hover{ transform:translateY(-2px); box-shadow:0 10px 28px rgba(230,255,42,0.45); }

.btn-ghost{
  background:transparent;
  color:var(--deep-green-dark);
}
.btn-ghost:hover{ transform:translateX(2px); }

.btn-outline{
  background:transparent;
  color:var(--deep-green-dark);
  border:1.5px solid var(--border);
  width:100%;
}
.btn-outline:hover{ border-color:var(--deep-green); background:rgba(11,97,88,0.06); }

/* =========================================================
   HERO
   ========================================================= */
.hero{
  position:relative;
  padding:170px 0 120px;
  overflow:hidden;
  background:linear-gradient(180deg, var(--seafoam) 0%, var(--mint) 55%, var(--base-light) 100%);
}
.hero-grid-lines{
  position:absolute; inset:0;
  background-image:
    linear-gradient(rgba(11,97,88,0.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(11,97,88,0.05) 1px, transparent 1px);
  background-size:64px 64px;
  mask-image:radial-gradient(ellipse 80% 60% at 50% 20%, black 40%, transparent 100%);
  pointer-events:none;
}
.hero-blob{
  position:absolute;
  border-radius:50%;
  filter:blur(60px);
  opacity:.55;
  pointer-events:none;
  animation:float 16s ease-in-out infinite;
}
.blob-1{
  width:520px; height:520px;
  top:-180px; right:-160px;
  background:radial-gradient(circle, rgba(11,97,88,0.35), transparent 70%);
}
.blob-2{
  width:380px; height:380px;
  bottom:-140px; left:-120px;
  background:radial-gradient(circle, rgba(230,255,42,0.45), transparent 70%);
  animation-delay:-8s;
}
@keyframes float{
  0%,100%{ transform:translate(0,0) scale(1); }
  50%{ transform:translate(20px,-30px) scale(1.06); }
}

.hero-inner{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:56px;
  align-items:center;
}

.eyebrow{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-size:13.5px;
  font-weight:600;
  letter-spacing:.02em;
  color:var(--deep-green);
  background:rgba(255,255,255,0.6);
  border:1px solid var(--border);
  padding:7px 14px 7px 10px;
  border-radius:100px;
  margin:0 0 22px;
}
.eyebrow-dot{
  width:8px; height:8px; border-radius:50%;
  background:var(--lime);
  box-shadow:0 0 0 4px rgba(230,255,42,0.3);
}

.hero h1{
  font-size:clamp(2.75rem, 5.25vw, 4.25rem);
  margin-bottom:12px;
}
.hero-subhead{
  font-family:var(--font-head);
  font-weight:600;
  font-size:clamp(1.05rem, 1.5vw, 1.3rem);
  color:var(--deep-green);
  margin:0 0 22px;
}
.text-underline{
  position:relative;
  white-space:nowrap;
}
.text-underline::after{
  content:'';
  position:absolute;
  left:0; right:0; bottom:2px;
  height:.32em;
  background:var(--lime);
  z-index:-1;
  border-radius:4px;
  transform:scaleX(0);
  transform-origin:left;
  animation:underline-grow 1s .5s var(--ease) forwards;
}
@keyframes underline-grow{ to{ transform:scaleX(1); } }

.text-mark-full{
  display:inline-block;
  background:var(--lime);
  color:var(--deep-green-dark);
  padding:0 8px;
  border-radius:6px;
  white-space:nowrap;
}

.hero-lead{
  font-size:17.5px;
  line-height:1.65;
  color:var(--ink-soft);
  max-width:520px;
  margin:0 0 34px;
}
.hero-actions{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-bottom:28px; }
.hero-trustline{
  display:flex; align-items:center; gap:10px;
  font-size:13.5px; color:var(--ink-faint); font-weight:500;
}
.dot-sep{ opacity:.5; }

/* --- Hero visual / signal card --- */
.hero-visual{ position:relative; min-width:300px; }

.signal-card{
  position:relative;
  background:var(--white);
  border-radius:var(--radius-lg);
  box-shadow:var(--shadow-lg);
  padding:22px;
  border:1px solid rgba(255,255,255,0.6);
  animation:card-in 1s var(--ease) both;
}
@keyframes card-in{
  from{ opacity:0; transform:translateY(24px) scale(.97); }
  to{ opacity:1; transform:translateY(0) scale(1); }
}

.signal-card-head{
  display:flex; align-items:center; justify-content:space-between;
  margin-bottom:16px;
}
.signal-card-title{ font-family:var(--font-head); font-weight:600; font-size:15px; color:var(--deep-green-dark); }
.signal-live{
  display:inline-flex; align-items:center; gap:6px;
  font-size:12px; font-weight:600; color:var(--deep-green);
  text-transform:uppercase; letter-spacing:.06em;
}
.live-dot{
  width:7px; height:7px; border-radius:50%; background:#2FBF71;
  box-shadow:0 0 0 0 rgba(47,191,113,.6);
  animation:pulse-dot 1.8s infinite;
}
@keyframes pulse-dot{
  0%{ box-shadow:0 0 0 0 rgba(47,191,113,.55); }
  70%{ box-shadow:0 0 0 8px rgba(47,191,113,0); }
  100%{ box-shadow:0 0 0 0 rgba(47,191,113,0); }
}

.signal-body{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:4px;
  min-width:0;
}
.signal-body .radar-wrap{ margin:8px auto -8px; flex:none; }
.signal-list{
  width:100%;
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:6px;
  padding-top:6px;
}
.signal-list-label{
  font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.05em;
  color:var(--ink-faint);
  margin-bottom:2px;
}
.signal-list-viewport{
  position:relative;
  height:184px;
  overflow:hidden;
}
.signal-list-row{
  position:absolute;
  left:0; right:0; top:0;
  height:40px;
  display:flex; align-items:center; justify-content:space-between; gap:8px;
  padding:6px 9px;
  border-radius:8px;
  background:var(--base-light);
  transition:transform .6s cubic-bezier(.4,0,.2,1), opacity .6s ease;
  will-change:transform, opacity;
}
.signal-list-row span:first-child{
  flex:1; min-width:0;
  font-size:10.5px; line-height:1.25; color:var(--ink-soft);
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.signal-list-count{
  flex:none;
  font-family:var(--font-head); font-weight:700; font-size:11px;
  color:var(--deep-green-dark);
  background:var(--mint-gradient);
  padding:2px 8px;
  border-radius:100px;
}

.radar-wrap{
  position:relative;
  width:220px; height:220px;
  margin:8px auto 16px;
}
.radar{
  position:absolute; inset:0;
  border-radius:50%;
  overflow:hidden;
  background:
    radial-gradient(circle at 50% 50%, rgba(11,97,88,0.07), transparent 70%),
    repeating-radial-gradient(circle at 50% 50%, rgba(11,97,88,0.16) 0, rgba(11,97,88,0.16) 1px, transparent 1px, transparent 27.5px);
  border:1px solid rgba(11,97,88,0.18);
}
.radar::before,
.radar::after{
  content:'';
  position:absolute;
  background:rgba(11,97,88,0.16);
}
.radar::before{ left:0; right:0; top:50%; height:1px; }
.radar::after{ top:0; bottom:0; left:50%; width:1px; }
.radar-sweep{
  position:absolute; inset:0;
  background:conic-gradient(from 0deg, rgba(230,255,42,.5), rgba(11,97,88,.16) 35deg, transparent 100deg);
  animation:radar-spin 6s linear infinite;
}
@keyframes radar-spin{ to{ transform:rotate(360deg); } }

.radar-core{
  position:absolute; top:50%; left:50%;
  width:10px; height:10px;
  transform:translate(-50%,-50%);
  border-radius:50%;
  background:var(--deep-green-dark);
  box-shadow:0 0 0 4px rgba(11,97,88,.15);
}

.radar-blip{ position:absolute; width:0; height:0; }
.radar-blip-dot{
  position:absolute; top:0; left:0;
  width:9px; height:9px;
  transform:translate(-50%,-50%);
  border-radius:50%;
  background:var(--deep-green);
  animation:radar-ping 6s infinite;
}
.radar-blip-label{
  position:absolute; top:0; left:12px;
  transform:translateY(-50%);
  font-size:11px; font-weight:600; white-space:nowrap;
  max-width:200px; overflow:hidden; text-overflow:ellipsis;
  color:var(--deep-green-dark);
  background:var(--white);
  padding:3px 9px;
  border-radius:100px;
  box-shadow:var(--shadow-sm);
}
.radar-blip.is-left .radar-blip-label{ left:auto; right:12px; }
@keyframes radar-ping{
  0%{ transform:translate(-50%,-50%) scale(1.7); box-shadow:0 0 0 10px rgba(11,97,88,0); }
  10%{ transform:translate(-50%,-50%) scale(1); box-shadow:0 0 0 0 rgba(11,97,88,.4); }
  100%{ transform:translate(-50%,-50%) scale(1); box-shadow:0 0 0 0 rgba(11,97,88,0); }
}

.signal-card-footer{
  display:flex; align-items:center; justify-content:space-between;
  margin-top:18px; padding-top:18px;
  border-top:1px dashed var(--border);
}
.score-badge{ display:flex; flex-direction:column; }
.score-num{ font-family:var(--font-head); font-size:28px; font-weight:700; color:var(--deep-green-dark); line-height:1; }
.score-label{ font-size:11.5px; color:var(--ink-faint); font-weight:500; margin-top:2px; }

.floater{
  position:absolute;
  display:flex; align-items:center; gap:8px;
  background:var(--white);
  border-radius:100px;
  padding:10px 16px;
  box-shadow:var(--shadow-md);
  font-size:12.5px; font-weight:600; color:var(--deep-green-dark);
  animation:float-bob 5s ease-in-out infinite;
}
.floater-icon{ color:var(--deep-green); }
.floater-1{ top:-34px; left:-24px; animation-delay:0s; }
.floater-2{ bottom:-24px; right:10px; animation-delay:-2.5s; }
@keyframes float-bob{
  0%,100%{ transform:translateY(0); }
  50%{ transform:translateY(-10px); }
}

.scroll-cue{
  position:absolute; bottom:28px; left:50%; transform:translateX(-50%);
  width:26px; height:42px; border-radius:100px;
  border:2px solid rgba(8,72,65,0.25);
  display:flex; justify-content:center; padding-top:7px;
}
.scroll-cue span{
  width:4px; height:8px; border-radius:4px; background:var(--deep-green);
  animation:scroll-cue-move 1.8s infinite;
}
@keyframes scroll-cue-move{
  0%{ opacity:1; transform:translateY(0); }
  100%{ opacity:0; transform:translateY(14px); }
}

/* =========================================================
   SECTION SHARED
   ========================================================= */
.section{ padding:110px 0; }
.section-tinted{ background:var(--seafoam); }
.section-dark{ background:var(--deep-green-dark); }

.section-head{ max-width:680px; margin:0 0 56px; }
.kicker{
  font-size:13px; font-weight:700; letter-spacing:.08em; text-transform:uppercase;
  color:var(--deep-green);
  margin:0 0 14px;
}
.kicker-on-dark{ color:var(--lime); }
.section-head h2{ font-size:clamp(2.125rem,3.75vw,3rem); margin-bottom:16px; }
.on-dark{ color:var(--white); }
.section-lead{ font-size:16.5px; line-height:1.65; color:var(--ink-soft); }
.on-dark-lead{ color:rgba(255,255,255,0.72); }
/* =========================================================
   COMPARE (direct side-by-side, no click)
   ========================================================= */
.compare-table{ display:flex; flex-direction:column; gap:14px; }
.compare-head{
  display:grid;
  grid-template-columns:1fr 44px 1fr;
  gap:16px;
  margin-bottom:2px;
}
.compare-head-label{
  font-family:var(--font-head); font-weight:700; font-size:13px;
  text-transform:uppercase; letter-spacing:.04em;
  white-space:nowrap;
}
.compare-head-neg{ color:var(--ink-faint); }
.compare-head-pos{ color:var(--deep-green); }
.compare-row{
  display:grid;
  grid-template-columns:1fr 44px 1fr;
  align-items:center;
  gap:16px;
}
.compare-cell{
  display:flex; align-items:flex-start; gap:12px;
  font-size:15px; line-height:1.5; color:var(--ink);
  background:var(--white);
  border:1px solid var(--border);
  border-radius:14px;
  padding:16px 18px;
}
.compare-cell-pos{
  background:var(--seafoam);
  border:1px solid var(--deep-green);
  box-shadow:var(--shadow-sm);
  font-weight:600;
  color:var(--deep-green-dark);
}
.compare-arrow{
  text-align:center;
  font-size:18px; font-weight:600;
  color:var(--ink-faint);
}
.check-icon{
  flex:none; width:24px; height:24px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-size:12px; font-weight:700;
  margin-top:1px;
}
.compare-cell-neg .check-icon{ background:rgba(220,80,80,0.12); color:#c04848; }
.compare-cell-pos .check-icon{ background:var(--mint-gradient); color:var(--deep-green-dark); }

/* =========================================================
   SCROLLYTELLING PROZESS
   ========================================================= */
.scrolly-progress{
  position:sticky;
  top:64px;
  z-index:20;
  background:rgba(244,246,245,0.9);
  backdrop-filter:blur(10px);
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
  padding:14px 0;
  margin-top:56px;
}
.scrolly-progress-inner{
  display:flex; align-items:center; gap:18px;
}
.scrolly-progress-label{
  font-family:var(--font-head); font-weight:600; font-size:13.5px;
  color:var(--deep-green-dark); white-space:nowrap;
}
.scrolly-progress-track{
  flex:1; height:4px; border-radius:100px;
  background:rgba(11,97,88,0.12);
  overflow:hidden;
}
.scrolly-progress-fill{
  height:100%; width:25%; border-radius:100px;
  background:linear-gradient(90deg, var(--deep-green), var(--lime));
  transition:width .3s var(--ease);
}

.scrolly-num{
  display:inline-block;
  font-family:var(--font-head); font-weight:700; font-size:13px;
  color:var(--deep-green);
  background:var(--mint-gradient);
  padding:4px 12px;
  border-radius:100px;
  margin-bottom:18px;
}

/* --- Path track --- */
.scrolly-track{
  position:relative;
  padding:40px 0 20px;
}
.scrolly-path-svg{
  position:absolute; top:0; left:0;
  width:100%; height:100%;
  pointer-events:none;
  z-index:1;
}
.scrolly-path-bg{ fill:none; stroke:rgba(11,97,88,0.4); stroke-width:4; stroke-linecap:round; }
.scrolly-path-fg{
  fill:none; stroke:var(--lime); stroke-width:4; stroke-linecap:round;
  filter:drop-shadow(0 0 6px rgba(230,255,42,.5));
}
.scrolly-marker{
  position:absolute; top:0; left:0;
  width:0; height:0;
  z-index:3;
  pointer-events:none;
  will-change:transform;
}
.scrolly-marker-dot{
  position:absolute; top:0; left:0;
  width:20px; height:20px; margin:-10px;
  border-radius:50%;
  background:var(--lime);
  box-shadow:0 0 0 6px rgba(230,255,42,.28), var(--shadow-lg);
}
.scrolly-marker-dot::after{
  content:'';
  position:absolute; inset:5px;
  border-radius:50%;
  background:var(--deep-green-dark);
}

.scrolly-node{
  position:absolute;
  width:14px; height:14px; margin:-7px;
  border-radius:50%;
  background:var(--white);
  border:3px solid var(--deep-green);
  z-index:1;
  opacity:0;
  pointer-events:none;
}
.scrolly-waypoint{ position:relative; z-index:2; min-height:58vh; display:flex; align-items:center; }
.scrolly-waypoint-inner{ width:100%; position:relative; z-index:0; }
.scrolly-content{
  position:relative;
  background:var(--white);
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  padding:32px 34px;
  max-width:440px;
  box-shadow:var(--shadow-md);
}
.scrolly-waypoint.is-left .scrolly-content{ margin-right:auto; }
.scrolly-waypoint.is-right .scrolly-content{ margin-left:auto; }

/* Decorative, großflächig + transparent visual in the free space opposite the card */
.scrolly-bg-visual{
  position:absolute;
  top:50%; right:0;
  width:460px; height:460px;
  transform:translateY(-50%);
  opacity:.22;
  z-index:-1;
  pointer-events:none;
}
.scrolly-waypoint.is-right .scrolly-bg-visual{
  right:auto; left:0;
  transform:translateY(-50%) scaleX(-1);
}
.bgv-bar,
.bgv-col{
  fill:var(--deep-green); transform-box:fill-box; transform-origin:left center;
  animation:bgv-fill .7s var(--ease) both;
  animation-play-state:paused;
}
.bgv-col{ fill:var(--lime); }
.scrolly-waypoint.is-active .bgv-bar,
.scrolly-waypoint.is-active .bgv-col{ animation-play-state:running; }
@keyframes bgv-fill{
  from{ transform:scaleX(0); }
  to{ transform:scaleX(1); }
}
.bgv-radar-ring{ fill:none; stroke:var(--deep-green); stroke-width:1.5; }
.bgv-radar-dot{ fill:var(--deep-green); }
.bgv-radar-sweep{ fill:var(--lime); transform-box:view-box; transform-origin:100px 100px; animation:bgv-spin 4s linear infinite; }
@keyframes bgv-spin{ to{ transform:rotate(360deg); } }
.bgv-node{ fill:var(--deep-green); }
.bgv-node-center{ fill:var(--lime); }
.bgv-link{
  stroke:var(--deep-green); stroke-width:1.5; stroke-dasharray:6 4;
  animation:bgv-dash 2.4s linear infinite;
}
@keyframes bgv-dash{ to{ stroke-dashoffset:-40; } }

.scrolly-content h3{ font-size:clamp(1.625rem,2.75vw,2.125rem); margin-bottom:10px; }
.scrolly-content > p{ font-size:15px; line-height:1.6; color:var(--ink-soft); margin:0 0 20px; }

.scrolly-items{
  display:flex;
  flex-direction:column;
  gap:12px;
}
.scrolly-item{
  display:flex;
  align-items:flex-start;
  gap:12px;
  padding:14px 16px;
  border-radius:12px;
  background:var(--base-light);
  opacity:.4;
  transform:translateX(-10px);
  transition:opacity .4s var(--ease), transform .4s var(--ease), background .4s var(--ease);
}
.scrolly-item-icon{
  flex:none;
  width:28px; height:28px;
  margin-top:1px;
  border-radius:8px;
  display:flex; align-items:center; justify-content:center;
  background:var(--mint-gradient);
  color:var(--deep-green-dark);
  font-size:13px;
}
.scrolly-waypoint.is-right .scrolly-item{ transform:translateX(10px); }
.scrolly-waypoint.is-active .scrolly-item{
  opacity:1;
  transform:translateX(0);
  background:var(--seafoam);
}
.scrolly-waypoint.is-active .scrolly-item:nth-child(1){ transition-delay:.05s; }
.scrolly-waypoint.is-active .scrolly-item:nth-child(2){ transition-delay:.15s; }
.scrolly-waypoint.is-active .scrolly-item:nth-child(3){ transition-delay:.25s; }
.scrolly-waypoint.is-active .scrolly-item:nth-child(4){ transition-delay:.35s; }
.scrolly-item h4{
  font-family:var(--font-head); font-weight:600; font-size:14.5px;
  color:var(--deep-green-dark); margin:0 0 4px;
}
.scrolly-item p{ font-size:13px; line-height:1.5; color:var(--ink-soft); margin:0; }

/* =========================================================
   PRICING
   ========================================================= */
.pricing-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:22px;
  align-items:stretch;
}
.price-card{
  position:relative;
  background:var(--white);
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  padding:34px 30px;
  display:flex; flex-direction:column;
  transition:transform .3s var(--ease), box-shadow .3s var(--ease);
}
.price-card:hover{ transform:translateY(-6px); box-shadow:var(--shadow-md); }
.price-card.is-featured{
  background:var(--deep-green-dark);
  border-color:var(--deep-green-dark);
  transform:scale(1.03);
  box-shadow:var(--shadow-lg);
}
.price-card.is-featured:hover{ transform:scale(1.03) translateY(-6px); }
.price-card.is-featured h3,
.price-card.is-featured .price-value,
.price-card.is-featured .price-desc{ color:var(--white); }
.price-card.is-featured .price-features li{ color:rgba(255,255,255,0.78); }
.price-card.is-featured .price-features li::before{ color:var(--lime); }

.price-badge{
  position:absolute; top:-13px; left:30px;
  background:var(--lime);
  color:var(--deep-green-dark);
  font-size:12px; font-weight:700;
  padding:6px 14px;
  border-radius:100px;
}
.price-card h3{ font-size:22.5px; margin-bottom:12px; }
.price-value{
  font-family:var(--font-head); font-weight:700;
  font-size:2.4rem; color:var(--deep-green-dark);
  margin:0 0 10px;
}
.price-value span{ font-size:14px; font-weight:500; color:var(--ink-faint); }
.price-card.is-featured .price-value span{ color:rgba(255,255,255,0.6); }
.price-desc{ font-size:14px; color:var(--ink-soft); margin:0 0 22px; min-height:38px; }
.price-plus{ font-size:13px; font-weight:700; color:var(--ink-faint); margin:0 0 10px; }
.price-card.is-featured .price-plus{ color:rgba(255,255,255,0.6); }
.price-features{ display:flex; flex-direction:column; gap:11px; margin-bottom:28px; flex:1; }
.price-features li{
  font-size:14px; color:var(--ink-soft);
  padding-left:22px; position:relative;
}
.price-features li::before{
  content:'✓';
  position:absolute; left:0; top:0;
  color:var(--deep-green); font-weight:700;
}

/* =========================================================
   CTA / KONTAKT
   ========================================================= */
.cta-section{
  position:relative;
  background:linear-gradient(160deg, var(--deep-green-dark) 0%, var(--deep-green) 100%);
  padding:110px 0;
  overflow:hidden;
}
.cta-blob{
  position:absolute;
  width:600px; height:600px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(230,255,42,0.18), transparent 70%);
  top:-260px; right:-160px;
  animation:float 18s ease-in-out infinite;
}
.cta-inner{ position:relative; z-index:1; text-align:center; max-width:640px; }
.cta-inner h2{ color:var(--white); font-size:clamp(2.25rem,4vw,3.25rem); margin-bottom:14px; }
.cta-inner > p{ color:rgba(255,255,255,0.75); font-size:16.5px; margin:0 0 40px; }

.cta-form{
  background:var(--white);
  border-radius:var(--radius-lg);
  padding:32px;
  box-shadow:var(--shadow-lg);
  text-align:left;
}
.form-row{ display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-bottom:14px; }
.cta-form input{
  width:100%;
  padding:14px 16px;
  border-radius:12px;
  border:1.5px solid var(--border);
  font-size:14.5px;
  color:var(--ink);
  background:var(--base-light);
  transition:border-color .25s var(--ease), background .25s var(--ease);
}
.cta-form input:focus{
  outline:none;
  border-color:var(--deep-green);
  background:var(--white);
}
.form-hint{ text-align:center; font-size:13px; color:var(--ink-faint); margin:14px 0 0; }

/* =========================================================
   FOOTER
   ========================================================= */
.site-footer{ background:var(--deep-green-dark); padding:70px 0 0; }
.footer-inner{
  display:grid;
  grid-template-columns:1.2fr 2fr;
  gap:60px;
  padding-bottom:50px;
  border-bottom:1px solid rgba(255,255,255,0.12);
}
.footer-logo{ height:24px; margin-bottom:16px; }
.footer-brand p{ font-size:14px; line-height:1.6; color:rgba(255,255,255,0.6); max-width:280px; }
.footer-cols{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.footer-col{ display:flex; flex-direction:column; gap:12px; }
.footer-col h4{ font-size:12.5px; text-transform:uppercase; letter-spacing:.06em; color:rgba(255,255,255,0.45); margin:0 0 4px; font-family:var(--font-body); font-weight:600; }
.footer-col a{ font-size:14.5px; color:rgba(255,255,255,0.78); transition:color .25s var(--ease); }
.footer-col a:hover{ color:var(--lime); }
.footer-bottom{ padding:22px 0; }
.footer-bottom p{ font-size:13px; color:rgba(255,255,255,0.45); margin:0; }

/* =========================================================
   SCROLL REVEAL
   ========================================================= */
[data-reveal]{
  opacity:0;
  transform:translateY(28px);
  transition:opacity .7s var(--ease), transform .7s var(--ease);
}
[data-reveal].is-visible{ opacity:1; transform:translateY(0); }
[data-reveal-delay="1"]{ transition-delay:.08s; }
[data-reveal-delay="2"]{ transition-delay:.16s; }
[data-reveal-delay="3"]{ transition-delay:.24s; }
[data-reveal-delay="4"]{ transition-delay:.32s; }

@media (prefers-reduced-motion: reduce){
  *{ animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important; scroll-behavior:auto !important; }
}

/* =========================================================
   RESPONSIVE
   ========================================================= */
@media (max-width:1080px){
}

@media (max-width:1180px) and (min-width:941px){
  .hero-inner{ grid-template-columns:1fr; }
  .hero-visual{ max-width:480px; margin:0 auto; }
}

@media (max-width:940px){
  .main-nav{ display:none; }
  .nav-toggle{ display:flex; }
  .hero-inner{ grid-template-columns:1fr; }
  .hero{ padding:150px 0 90px; }
  .footer-inner{ grid-template-columns:1fr; gap:36px; }
  .footer-cols{ grid-template-columns:repeat(3,1fr); }
  .pricing-grid{ grid-template-columns:1fr; max-width:420px; margin:0 auto; }
  .price-card.is-featured{ transform:none; order:-1; }
  .price-card.is-featured:hover{ transform:translateY(-6px); }

  /* Scrollytelling path: no path/marker/pinning on small screens — simple stacked list */
  .scrolly-progress{ top:0; }
  .scrolly-path-svg, .scrolly-marker, .scrolly-node{ display:none; }
  .scrolly-track{ padding:8px 0; }
  .scrolly-waypoint{ min-height:0; padding:20px 0; }
  .scrolly-content{ max-width:none; margin:0 !important; }
  .scrolly-item, .scrolly-item p{ opacity:1; transform:none; }
  .scrolly-bg-visual{ display:none; }
}

@media (max-width:640px){
  .wrap{ padding:0 20px; }
  .compare-head{ display:none; }
  .compare-row{ grid-template-columns:1fr; gap:8px; }
  .compare-arrow{ transform:rotate(90deg); }
  .footer-cols{ grid-template-columns:1fr; }
  .form-row{ grid-template-columns:1fr; }

  /* mobile nav drawer */
  .main-nav{
    display:flex;
    flex-direction:column;
    position:fixed;
    top:70px; right:20px; left:20px;
    background:var(--white);
    border-radius:var(--radius-md);
    box-shadow:var(--shadow-lg);
    padding:12px;
    border:1px solid var(--border);
    transform:translateY(-12px);
    opacity:0;
    pointer-events:none;
    transition:opacity .25s var(--ease), transform .25s var(--ease);
  }
  .main-nav.is-open{ opacity:1; transform:translateY(0); pointer-events:auto; }
  .main-nav a{ padding:13px 16px; text-align:left; border-radius:10px; }
  .header-actions .btn-primary{ display:none; }
}

/* =========================================================
   BAUSTEINE — Whitepaper-Visualisierungen (Okt. 2026)
   Gemeinsame Helfer
   ========================================================= */
section[id]{ scroll-margin-top:84px; }
.mark{
  background:linear-gradient(transparent 62%, var(--lime) 62%, var(--lime) 92%, transparent 92%);
  -webkit-box-decoration-break:clone; box-decoration-break:clone;
}
.lime-text{ color:var(--lime); }
.section-head.is-wide{ max-width:none; }
.section-head.is-wide .section-lead{ max-width:760px; }
.bk-mint{ background:linear-gradient(180deg, #E3F3EE 0%, #CDEBE2 100%); }
.bk-note{ font-size:12px; font-style:italic; color:var(--ink-faint); margin:16px 0 0; }
.on-dark-note{ color:rgba(255,255,255,0.55); }
.hero-note{ margin:42px 0 0; text-align:center; }
.form-hint a{ text-decoration:underline; }

@keyframes bk-in{
  from{ opacity:0; transform:translateY(14px) scale(.96); }
  to{ opacity:1; transform:translateY(0) scale(1); }
}
@keyframes bk-grow{ from{ width:0; } }
@keyframes bk-pulse{
  0%,100%{ box-shadow:0 0 0 0 rgba(11,97,88,.28); }
  50%{ box-shadow:0 0 0 7px rgba(11,97,88,0); }
}

/* ---------- 2 Leistungsspektrum ---------- */
.ls-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.ls-card{
  background:var(--white);
  border:1px solid var(--border);
  border-radius:var(--radius-md);
  padding:30px 26px;
}
.ls-card:hover{ box-shadow:var(--shadow-md); border-color:rgba(11,97,88,0.3); }
.ls-icon{
  width:46px; height:46px; border-radius:12px;
  display:flex; align-items:center; justify-content:center;
  background:var(--mint-gradient); color:var(--deep-green-dark);
  font-size:20px; margin-bottom:18px;
}
.ls-card h3{ font-size:19px; line-height:1.25; margin-bottom:10px; }
.ls-card p{ font-size:14.5px; line-height:1.55; color:var(--ink-soft); margin:0; }

/* ---------- 3 Sales Radar (Variante A) ---------- */
.rd-grid{ display:grid; grid-template-columns:1.05fr .95fr; gap:56px; align-items:center; }
.rd-visual{ min-width:0; }
.rd-copy{ min-width:0; }
.rd-copy h2{ font-size:clamp(2.125rem,3.75vw,3rem); margin-bottom:16px; }
.rd-radar{ position:relative; width:min(540px,100%); aspect-ratio:1; margin:0 auto; }
.rd-radar .radar{
  background:
    radial-gradient(circle at 50% 50%, rgba(255,255,255,.95), rgba(255,255,255,0) 72%),
    repeating-radial-gradient(circle closest-side at 50% 50%, rgba(11,97,88,.17) 0, rgba(11,97,88,.17) 1px, transparent 1px, transparent 25%);
}
.rd-radar .radar-core{ width:14px; height:14px; }
.rd-radar .radar-blip-dot{ width:14px; height:14px; }
.rd-radar .radar-blip-label{ left:20px; max-width:none; font-size:13px; padding:5px 13px; }
.rd-steps{ list-style:none; margin:30px 0 0; padding:0; }
.rd-steps li{
  display:grid; grid-template-columns:48px 1fr; gap:16px;
  padding:18px 0; border-top:1px solid var(--border);
}
.rd-steps li:first-child{ border-top:none; padding-top:0; }
.rd-step-no{
  width:48px; height:48px; border-radius:12px;
  background:var(--deep-green-dark); color:var(--white);
  font-family:var(--font-head); font-weight:700; font-size:20px;
  display:flex; align-items:center; justify-content:center;
}
.rd-steps h3{ font-size:19px; margin:0 0 4px; line-height:1.25; }
.rd-steps p{ margin:0; font-size:14.5px; line-height:1.5; color:var(--ink-soft); }
.rd-kpis{ display:flex; gap:12px 44px; flex-wrap:wrap; margin-top:26px; }
.rd-kpis b{
  display:block; font-family:var(--font-head);
  font-size:clamp(2rem,3.4vw,2.7rem); color:var(--deep-green-dark); line-height:1.05;
  font-variant-numeric:tabular-nums;
}
.rd-kpis span{ font-size:13px; color:var(--ink-soft); }

/* ---------- 4 Entscheider & Ansprache (Variante B) ---------- */
.ent-grid{ display:grid; grid-template-columns:.9fr 1.3fr; gap:30px; align-items:start; }
.ent-org{ min-width:0; }
.ent-company{
  display:flex; align-items:center; gap:14px;
  background:var(--deep-green-dark); color:var(--white);
  border-radius:var(--radius-md); padding:18px 20px;
}
.ent-av{
  flex:none; width:46px; height:46px; border-radius:12px;
  background:var(--mint); color:var(--deep-green-dark);
  display:flex; align-items:center; justify-content:center;
  font-family:var(--font-head); font-weight:700;
}
.ent-company b{ display:block; font-family:var(--font-head); font-size:16px; }
.ent-company small{ font-size:12.5px; opacity:.8; }
.ent-roles{
  margin:0 0 0 30px; padding:18px 0 0 24px;
  display:flex; flex-direction:column; gap:12px;
  border-left:2px solid rgba(11,97,88,.22);
}
.ent-role{
  position:relative; width:100%; text-align:left;
  display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:12px;
  background:var(--white); border:1px solid var(--border); border-radius:16px;
  padding:14px 16px;
  transition:border-color .25s var(--ease), box-shadow .25s var(--ease);
}
.ent-role::before{
  content:''; position:absolute; left:-26px; top:50%; width:24px; height:2px;
  background:rgba(11,97,88,.22);
}
.ent-role:hover{ border-color:rgba(11,97,88,.4); }
.ent-role.is-active{
  border:2px solid var(--deep-green); box-shadow:var(--shadow-md);
  padding:13px 15px;
}
.ent-ini{
  width:40px; height:40px; border-radius:50%;
  background:var(--mint); color:var(--deep-green-dark);
  display:flex; align-items:center; justify-content:center;
  font-family:var(--font-head); font-weight:700; font-size:13px;
}
.ent-role-text{ min-width:0; }
.ent-role-text b{ display:block; font-family:var(--font-head); font-size:15.5px; color:var(--deep-green-dark); }
.ent-role-text small{ font-size:12.5px; color:var(--ink-soft); }
.ent-chip{
  font-size:11px; font-weight:700; white-space:nowrap;
  padding:5px 11px; border-radius:100px;
  background:var(--seafoam); color:var(--deep-green); border:1px solid var(--border);
}
.ent-role.is-active .ent-chip{ background:var(--deep-green-dark); color:var(--white); border-color:transparent; }
.ent-more{
  position:relative;
  display:flex; align-items:center; gap:12px;
  border:1px dashed var(--border); border-radius:16px; padding:14px 16px;
  color:var(--ink-faint); background:rgba(255,255,255,.6);
}
.ent-more::before{
  content:''; position:absolute; left:-26px; top:50%; width:24px; height:2px;
  background:rgba(11,97,88,.22);
}
.ent-more-plus{
  width:40px; height:40px; border-radius:50%; background:var(--seafoam);
  display:flex; align-items:center; justify-content:center; font-weight:700;
}
.ent-more b{ display:block; font-family:var(--font-head); font-size:15px; }
.ent-more small{ font-size:12.5px; }

.ent-msgs{ min-width:0; }
.ent-msgs-head{
  display:flex; justify-content:space-between; align-items:center; gap:12px; flex-wrap:wrap;
  margin-bottom:14px;
}
.ent-msgs-title{ font-size:14px; color:var(--ink-soft); }
.ent-msgs-title b{ color:var(--deep-green-dark); }
.ent-badges{ display:flex; gap:8px; flex-wrap:wrap; }
.ent-badge{
  background:var(--deep-green-dark); color:var(--white);
  font-size:12px; font-weight:600; padding:6px 12px; border-radius:100px;
}
.ent-panel{ display:flex; flex-direction:column; gap:14px; }
.ent-panel[hidden]{ display:none; }
.ent-panel.is-active{ animation:bk-in .5s var(--ease); }
.msg{
  background:var(--white); border:1px solid var(--border); border-radius:16px;
  padding:16px 20px 18px; box-shadow:var(--shadow-sm);
  font-size:14px; line-height:1.55; color:var(--ink); min-width:0;
}
.msg p{ margin:12px 0 0; }
.msg mark{ background:#DCEEE9; padding:0 3px; border-radius:3px; color:inherit; }
.msg-top{
  display:flex; justify-content:space-between; align-items:center; gap:10px; flex-wrap:wrap;
  padding-bottom:10px; border-bottom:1px solid var(--border);
}
.msg-tag{ display:inline-flex; align-items:center; gap:7px; font-weight:700; font-size:12.5px; color:var(--deep-green-dark); }
.msg-meta{ font-size:11.5px; color:var(--ink-faint); }
.msg-in, .msg-at{
  display:inline-flex; align-items:center; justify-content:center;
  width:18px; height:18px; border-radius:4px;
  color:var(--white); font-size:11px; font-weight:700; font-family:var(--font-body);
}
.msg-in{ background:#0A66C2; }
.msg-at{ background:var(--deep-green); }
.msg-letter{ position:relative; padding-right:116px; }
.msg-qr{
  position:absolute; right:20px; bottom:18px; width:72px; height:72px; border-radius:6px;
  background:
    linear-gradient(90deg, var(--deep-green-dark) 0 50%, transparent 50% 100%) 0 0 / 12px 12px,
    linear-gradient(var(--deep-green-dark) 0 50%, transparent 50% 100%) 0 0 / 18px 18px;
  opacity:.9;
  -webkit-mask:linear-gradient(#000 0 0);
  mask:linear-gradient(#000 0 0);
}
.msg-pair{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.msg-subject{ font-size:12.5px; font-weight:600; margin-top:10px; color:var(--deep-green-dark); }
.msg-subject small{ color:var(--ink-faint); font-weight:500; margin-right:6px; }
.msg-subject + p{ margin-top:6px; }
.ent-points{
  display:flex; flex-wrap:wrap; gap:10px 30px; margin:28px 0 0;
  font-size:14.5px; font-weight:500; color:var(--ink-soft);
}
.ent-points li::before{ content:'✓'; color:var(--deep-green); font-weight:700; margin-right:8px; }

/* ---------- 5 Market Intelligence (Variante A) ---------- */
.mi-grid{ display:grid; grid-template-columns:1.3fr .7fr; gap:24px; align-items:start; }
.mi-dash{ background:#0F3D37; color:var(--white); border-radius:24px; padding:26px 28px; min-width:0; }
.mi-dash-head{ display:flex; justify-content:space-between; align-items:center; gap:12px; flex-wrap:wrap; }
.mi-dash h3{ color:var(--white); font-size:20px; }
.mi-chip{
  background:var(--mint); color:var(--deep-green-dark);
  font-size:12px; font-weight:700; padding:5px 12px; border-radius:100px;
}
.mi-chip.is-light{ background:var(--seafoam); border:1px solid var(--border); }
.mi-kpis{ display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin:20px 0; }
.mi-kpi{ background:rgba(255,255,255,.07); border-radius:14px; padding:16px; min-width:0; }
.mi-kpi b{
  display:block; font-family:var(--font-head);
  font-size:clamp(1.5rem,2.6vw,2.2rem); line-height:1.1;
  font-variant-numeric:tabular-nums;
}
.mi-kpi span{ display:block; font-size:12.5px; color:#B9D3CD; margin-top:4px; line-height:1.35; }
.mi-kpi em{ display:block; font-style:normal; font-size:12px; font-weight:700; color:#9FE0CF; margin-top:8px; }
.mi-heat-wrap{ overflow-x:auto; }
.mi-heat{ border-collapse:separate; border-spacing:5px; width:100%; min-width:400px; font-size:12.5px; }
.mi-heat th{ color:#B9D3CD; font-weight:500; text-align:left; padding:2px 4px; white-space:nowrap; }
.mi-heat thead th{ text-align:center; }
.mi-heat td{
  text-align:center; border-radius:8px; height:38px; font-weight:600;
  font-variant-numeric:tabular-nums;
  background:color-mix(in srgb, #E1F2EC calc(var(--l) * 100%), #2A7469);
  color:#fff;
}
.mi-heat td.is-hi{ color:#084841; }
.mi-kpi b span{ display:inline; font-size:inherit; color:inherit; margin:0; line-height:inherit; }
.is-visible .mi-heat td{ animation:bk-in .55s var(--ease) both; animation-delay:calc(var(--c) * .22s + .25s); }
.mi-note{ font-size:11.5px; font-style:italic; color:#9FBFB8; margin:12px 0 0; }
.mi-card{
  background:var(--white); border:1px solid var(--border); border-radius:22px;
  padding:22px 24px; box-shadow:var(--shadow-sm);
}
.mi-card + .mi-card{ margin-top:18px; }
.mi-card h3{ font-size:18px; }
.mi-card p{ font-size:14px; line-height:1.55; color:#CFE3DE; margin:8px 0 16px; }
.mi-card.is-dark{ background:var(--deep-green-dark); border-color:transparent; }
.mi-card.is-dark h3{ color:var(--white); }
.mi-trends{ list-style:none; margin:12px 0 0; padding:0; }
.mi-trends li{
  display:grid; grid-template-columns:26px 1fr; gap:12px;
  padding:12px 0; border-top:1px solid var(--border);
  font-size:13.5px; line-height:1.45; color:var(--ink);
}
.mi-trend-no{ font-family:var(--font-head); font-weight:700; font-size:18px; color:var(--deep-green); }

/* ---------- 6 Omni-Channel-Flow (Variante C) ---------- */
.oa-grid{ display:grid; grid-template-columns:.62fr 1.38fr; gap:20px; align-items:start; }
.oa-list{ display:flex; flex-direction:column; gap:12px; }
.oa-card{
  width:100%; text-align:left; color:var(--white);
  background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.14);
  border-radius:18px; padding:16px 18px;
  display:flex; flex-direction:column; gap:6px;
  transition:background .25s var(--ease), box-shadow .25s var(--ease);
}
.oa-card:hover{ background:rgba(255,255,255,.12); }
.oa-card.is-active{ background:var(--white); color:var(--deep-green-dark); border-color:var(--white); box-shadow:var(--shadow-lg); }
.oa-card-top{ display:flex; justify-content:space-between; align-items:center; gap:10px; }
.oa-card-top b{ font-family:var(--font-head); font-size:16px; }
.oa-card small{ font-size:12.5px; opacity:.8; }
.oa-pill{ flex:none; font-size:11.5px; font-weight:700; padding:5px 11px; border-radius:100px; white-space:nowrap; }
.oa-pill.is-dark{ background:rgba(255,255,255,.16); color:var(--white); }
.oa-pill.is-line{ border:1px solid rgba(255,255,255,.4); color:var(--white); }
.oa-pill.is-mint{ background:var(--mint); color:var(--deep-green-dark); }
.oa-card.is-active .oa-pill.is-dark{ background:var(--deep-green-dark); color:var(--white); }
.oa-card.is-active .oa-pill.is-line{ border-color:var(--deep-green); color:var(--deep-green); }
.oa-prog{ display:grid; grid-template-columns:repeat(3,1fr); gap:6px; margin-top:6px; }
.oa-prog i{ position:relative; display:block; height:6px; border-radius:100px; background:rgba(255,255,255,.18); overflow:hidden; }
.oa-prog i::after{
  content:''; position:absolute; left:0; top:0; bottom:0;
  width:calc(var(--p) * 100%); background:var(--mint-end); border-radius:100px;
}
.oa-card.is-active .oa-prog i{ background:#E4EEEB; }
.oa-card.is-active .oa-prog i::after{ background:var(--deep-green); }
.is-visible .oa-prog i::after{ animation:bk-grow 1s var(--ease) both; }

.oa-detail{ min-width:0; }
.oa-panel{
  background:var(--white); color:var(--ink);
  border-radius:24px; padding:24px 26px;
}
.oa-panel[hidden]{ display:none; }
.oa-panel.is-active{ animation:bk-in .5s var(--ease); }
.oa-panel-head{ display:flex; justify-content:space-between; align-items:center; gap:12px; flex-wrap:wrap; margin-bottom:18px; }
.oa-panel-head h3{ font-size:19px; }
.oa-live{
  font-size:12px; font-weight:600; padding:6px 12px; border-radius:100px;
  background:var(--seafoam); color:var(--deep-green); border:1px solid var(--border);
}
.oc-scroll{ overflow-x:auto; }
.oc-table{ min-width:560px; display:flex; flex-direction:column; gap:12px; }
.oc-row{
  display:grid; grid-template-columns:176px repeat(7, minmax(44px,1fr));
  gap:8px; align-items:center;
}
.oc-head span{ font-size:10.5px; font-weight:600; white-space:nowrap; color:var(--ink-soft); text-align:center; }
.oc-who{ display:flex; align-items:center; gap:12px; min-width:0; }
.oc-ini{
  flex:none; width:40px; height:40px; border-radius:50%;
  background:var(--mint); color:var(--deep-green-dark);
  display:flex; align-items:center; justify-content:center;
  font-family:var(--font-head); font-weight:700; font-size:13px;
}
.oc-who b{ display:block; font-family:var(--font-head); font-size:15px; color:var(--deep-green-dark); }
.oc-who small{ font-size:12px; color:var(--ink-soft); }
.oc{ height:38px; border-radius:10px; display:flex; align-items:center; justify-content:center; font-size:14px; font-weight:700; }
.oc.is-done{ background:var(--deep-green-dark); color:var(--white); }
.oc.is-now{ background:var(--white); border:2px solid var(--deep-green); box-shadow:0 0 0 4px rgba(11,97,88,.12); }
.oc.is-now i{ width:9px; height:9px; border-radius:50%; background:var(--deep-green-dark); animation:bk-pulse 1.8s infinite; }
.oc.is-plan{ background:#EEF2F1; }
.oc.is-skip{ border:1.5px dashed rgba(11,97,88,.32); }
.oc-note{ display:block; font-style:normal; font-size:11.5px; font-weight:600; color:var(--deep-green); line-height:1.3; margin-top:3px; }
.is-visible .oc.is-done{ animation:bk-in .5s var(--ease) both; }
.is-visible .oc:nth-child(2){ animation-delay:.10s; }
.is-visible .oc:nth-child(3){ animation-delay:.20s; }
.is-visible .oc:nth-child(4){ animation-delay:.30s; }
.is-visible .oc:nth-child(5){ animation-delay:.40s; }
.is-visible .oc:nth-child(6){ animation-delay:.50s; }
.is-visible .oc:nth-child(7){ animation-delay:.60s; }
.oa-boxes{ display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:18px; }
.oa-box{ border-radius:16px; padding:16px 18px; background:var(--seafoam); border:1px solid var(--border); }
.oa-box b{ display:block; font-size:14px; color:var(--deep-green-dark); }
.oa-box p{ margin:5px 0 0; font-size:13.5px; line-height:1.5; color:var(--ink-soft); }
.oa-box.is-dark{ background:var(--deep-green-dark); border-color:transparent; }
.oa-box.is-dark b{ color:var(--white); }
.oa-box.is-dark p{ color:#CFE3DE; }
.oa-detail .bk-note{ margin-top:14px; }

/* ---------- 7 Content-Plan (Variante A) ---------- */
.cp-grid{ display:grid; grid-template-columns:1.5fr .62fr; gap:22px; align-items:start; }
.cp-cal{
  background:var(--white); border:1px solid var(--border); border-radius:24px;
  padding:24px; box-shadow:var(--shadow-sm); min-width:0;
}
.cp-cal-head{ display:flex; justify-content:space-between; align-items:center; gap:14px; flex-wrap:wrap; margin-bottom:18px; }
.cp-cal-head h3{ font-size:20px; }
.cp-chips{ display:flex; gap:8px; flex-wrap:wrap; }
.cp-chip{
  display:inline-flex; align-items:center; gap:7px;
  font-size:12px; font-weight:600; padding:7px 13px; border-radius:100px;
  background:var(--seafoam); border:1px solid var(--border); color:var(--deep-green-dark);
}
.cp-chip.is-dark{ background:var(--deep-green-dark); color:var(--white); border-color:transparent; }
.cp-days, .cp-week{ display:grid; grid-template-columns:54px repeat(5, minmax(0,1fr)); gap:8px; }
.cp-days span{ text-align:center; font-size:11.5px; font-weight:700; letter-spacing:.06em; color:var(--ink-soft); }
.cp-week{ margin-top:8px; }
.cp-kw{
  display:flex; align-items:center; justify-content:center;
  background:var(--seafoam); border-radius:12px;
  font-size:12px; font-weight:700; color:var(--deep-green-dark);
}
.cp-cell{ background:#F2F6F5; border-radius:12px; padding:6px; min-height:104px; }
.cp-item{
  height:100%; border-left:3px solid #0A66C2; background:#E9F0FB;
  border-radius:8px; padding:8px 9px; font-size:11.5px; line-height:1.3;
}
.cp-item b{ display:block; font-weight:600; color:var(--deep-green-dark); margin-bottom:5px; }
.cp-item small{ font-size:11px; color:var(--ink-soft); }
.cp-item.is-ar{ border-left-color:var(--deep-green); background:#DCEEE9; }
.cp-item.is-ok small{ color:var(--deep-green); font-weight:600; }
.cp-item.is-wait small{ color:#8A6A00; font-weight:600; }
.is-visible .cp-item{ animation:bk-in .55s var(--ease) both; animation-delay:calc(var(--i) * .07s + .15s); }
.cp-side{ min-width:0; }
.cp-card{
  background:var(--white); border:1px solid var(--border); border-radius:22px;
  padding:20px; box-shadow:var(--shadow-sm);
}
.cp-card + .cp-card{ margin-top:18px; }
.cp-preview{ height:92px; border-radius:12px; background:linear-gradient(135deg,#A9DDCE,#0B6158); margin-bottom:14px; }
.cp-card h3{ font-size:18px; line-height:1.25; margin:12px 0 8px; }
.cp-card p{ margin:0; font-size:13.5px; line-height:1.5; color:var(--ink-soft); }
.cp-nums{ display:grid; grid-template-columns:1fr 1fr; gap:10px; margin:12px 0; }
.cp-nums div{ background:var(--seafoam); border-radius:14px; padding:14px; }
.cp-nums b{ display:block; font-family:var(--font-head); font-size:28px; color:var(--deep-green-dark); line-height:1.1; }
.cp-nums span{ font-size:12.5px; color:var(--ink-soft); }
.cp-checks{ font-size:13.5px; color:var(--ink-soft); }
.cp-checks li{ margin:6px 0; }
.cp-checks li::before{ content:'✓'; color:var(--deep-green); font-weight:700; margin-right:8px; }

/* ---------- 8 Qualität & Datenschutz (Variante B) ---------- */
.q-grid{ display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:center; }
.q-ring{ position:relative; width:min(540px,100%); aspect-ratio:1; margin:0 auto; }
.q-ring-line{ position:absolute; inset:0; width:100%; height:100%; }
.q-ring-line circle{
  fill:none; stroke:var(--deep-green); stroke-opacity:.55; stroke-width:3;
  stroke-dasharray:6 10; stroke-linecap:round;
  animation:q-dash 20s linear infinite;
}
@keyframes q-dash{ to{ stroke-dashoffset:-320; } }
.q-gate{
  position:absolute; width:34%;
  background:var(--white); border:1px solid var(--border); border-radius:18px;
  padding:14px 16px; box-shadow:var(--shadow-md);
}
.q-g1{ top:5%; left:33%; --n:0; }
.q-g2{ right:.5%; top:50%; transform:translateY(-50%); --n:1; }
.q-g3{ bottom:5%; left:33%; --n:2; }
.q-g4{ left:.5%; top:50%; transform:translateY(-50%); --n:3; }
.q-no{
  display:inline-block; background:var(--deep-green-dark); color:var(--white);
  font-family:var(--font-head); font-size:12px; font-weight:700;
  padding:4px 9px; border-radius:8px; margin-bottom:8px;
}
.q-gate b{ display:block; font-family:var(--font-head); font-size:15px; color:var(--deep-green-dark); line-height:1.2; }
.q-gate small{ display:block; margin-top:4px; font-size:12px; line-height:1.35; color:var(--ink-soft); }
.is-visible .q-gate{ animation:q-lit 8s ease-in-out infinite; animation-delay:calc(var(--n) * 2s); }
@keyframes q-lit{
  0%, 22%{ border-color:var(--deep-green); box-shadow:0 0 0 4px rgba(230,255,42,.55), var(--shadow-md); }
  28%, 100%{ border-color:var(--border); box-shadow:var(--shadow-md); }
}
.q-core{
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  width:32%; aspect-ratio:1; border-radius:50%;
  background:var(--deep-green-dark); color:var(--white);
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  text-align:center; padding:6%; box-shadow:var(--shadow-lg);
}
.q-core small{ font-size:11px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; opacity:.8; }
.q-core b{ font-family:var(--font-head); font-size:clamp(14px,1.9vw,19px); line-height:1.2; margin-top:6px; hyphens:manual; }
.q-copy{ min-width:0; }
.q-badges{ display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:24px; }
.q-badge{
  display:flex; gap:12px; align-items:flex-start;
  background:var(--white); border:1px solid var(--border); border-radius:16px; padding:14px 16px;
}
.q-badge-ic{
  flex:none; width:40px; height:40px; border-radius:12px;
  background:var(--seafoam); color:var(--deep-green-dark);
  display:flex; align-items:center; justify-content:center; font-weight:700; font-size:14px;
}
.q-badge b{ display:block; font-family:var(--font-head); font-size:15px; color:var(--deep-green-dark); line-height:1.2; }
.q-badge small{ font-size:12.5px; color:var(--ink-soft); line-height:1.4; }
.q-not{
  display:flex; flex-wrap:wrap; gap:10px 26px;
  margin:14px 0 0; padding:18px 22px;
  background:var(--deep-green-dark); border-radius:18px;
  color:var(--white); font-size:14px;
}
.q-not li::before{ content:'✕'; color:#F3A494; font-weight:700; margin-right:8px; }

/* ---------- 9 Ergebnis & Reporting (Variante B) ---------- */
.er-grid{ display:grid; grid-template-columns:.92fr 1.08fr; gap:28px; align-items:start; }
.er-funnel{ display:flex; flex-direction:column; align-items:center; gap:10px; min-width:0; }
.er-step{
  color:var(--white); text-align:center; padding:22px 18px 20px;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
}
.er-step b{ font-family:var(--font-head); font-size:clamp(2.4rem,4.2vw,3.2rem); line-height:1; font-variant-numeric:tabular-nums; }
.er-step span{ font-size:14px; opacity:.92; margin-top:6px; line-height:1.3; }
.er-s1{ width:100%; background:#3F8F84; clip-path:polygon(0 0,100% 0,92% 100%,8% 100%); }
.er-s2{ width:84%;  background:#2A7469; clip-path:polygon(0 0,100% 0,89.3% 100%,10.7% 100%); }
.er-s3{ width:66%;  background:#1A5C53; clip-path:polygon(0 0,100% 0,87.9% 100%,12.1% 100%); }
.er-s4{ width:50%;  background:#084841; clip-path:polygon(0 0,100% 0,88% 100%,12% 100%); }
.is-visible .er-step{ animation:er-fill .7s var(--ease) both; animation-delay:calc(var(--i) * .28s); }
@keyframes er-fill{
  from{ opacity:0; transform:translateY(-14px) scaleX(.92); }
  to{ opacity:1; transform:none; }
}
.er-funnel .bk-note{ text-align:center; }
.er-dash{
  background:var(--white); border:1px solid var(--border); border-radius:24px;
  padding:24px; box-shadow:var(--shadow-md); min-width:0;
}
.er-dash-head{ display:flex; justify-content:space-between; align-items:center; margin-bottom:16px; }
.er-dash-head h3{ font-size:20px; }
.er-kpis{ display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-bottom:22px; }
.er-kpis div{ background:var(--base-light); border-radius:14px; padding:14px 16px; }
.er-kpis b{ display:block; font-family:var(--font-head); font-size:30px; color:var(--deep-green-dark); line-height:1.1; }
.er-kpis span{ font-size:12.5px; color:var(--ink-soft); }
.er-row{ display:grid; grid-template-columns:150px 1fr 70px; gap:14px; align-items:center; margin-bottom:14px; }
.er-label{ font-size:13.5px; color:var(--ink); }
.er-track{ position:relative; height:12px; border-radius:100px; background:#EDF2F1; }
.er-fill{ position:absolute; left:0; top:2px; bottom:2px; width:var(--w); background:var(--deep-green-dark); border-radius:100px; }
.is-visible .er-fill{ animation:bk-grow 1s var(--ease) both; animation-delay:calc(var(--d) * .12s + .5s); }
.er-target{
  position:absolute; top:-4px; bottom:-4px;
  border:2px solid var(--deep-green); border-radius:8px; background:rgba(11,97,88,.1);
}
.er-state{ font-size:12.5px; font-weight:700; text-align:right; }
.er-state.is-ok{ color:var(--deep-green); }
.er-state.is-over{ color:var(--deep-green-dark); }
.er-state.is-low{ color:#9A6B00; }
.er-pilot{
  display:flex; align-items:center; gap:14px; flex-wrap:wrap;
  background:var(--deep-green-dark); color:var(--white);
  border-radius:14px; padding:14px 18px; margin-top:18px; font-size:13.5px;
}
.er-pilot-bar{ flex:1; min-width:80px; height:8px; background:rgba(255,255,255,.18); border-radius:100px; overflow:hidden; }
.er-pilot-bar i{ display:block; height:100%; width:var(--w); background:var(--mint); border-radius:100px; }
.is-visible .er-pilot-bar i{ animation:bk-grow 1.2s var(--ease) both; animation-delay:1.1s; }

/* ---------- 10 Termin-Wert-Rechner (Variante A) ---------- */
.rc-grid{ display:grid; grid-template-columns:.9fr 1.1fr; gap:22px; align-items:stretch; }
.rc-inputs{
  background:var(--white); border:1px solid var(--border); border-radius:24px;
  padding:26px 28px; min-width:0;
}
.rc-field{ margin-bottom:24px; }
.rc-field label{ display:flex; justify-content:space-between; align-items:baseline; gap:12px; font-size:14px; color:var(--ink-soft); }
.rc-field label b{ font-family:var(--font-head); font-size:17px; color:var(--deep-green-dark); white-space:nowrap; font-variant-numeric:tabular-nums; }
.rc-field input[type=range]{
  -webkit-appearance:none; appearance:none;
  display:block; width:100%; height:6px; margin:16px 0 0; padding:0; border-radius:100px; cursor:pointer;
  background:linear-gradient(90deg, var(--deep-green) var(--p,50%), #E4EEEB var(--p,50%));
}
.rc-field input[type=range]::-webkit-slider-thumb{
  -webkit-appearance:none; appearance:none;
  width:22px; height:22px; border-radius:50%;
  background:var(--white); border:3px solid var(--deep-green); box-shadow:var(--shadow-sm);
}
.rc-field input[type=range]::-moz-range-thumb{
  width:16px; height:16px; border-radius:50%;
  background:var(--white); border:3px solid var(--deep-green); box-shadow:var(--shadow-sm);
}
.rc-field input[type=range]:focus-visible{ outline:2px solid var(--deep-green); outline-offset:6px; }
.rc-out{
  background:var(--deep-green-dark); color:var(--white); border-radius:24px;
  padding:28px 30px; display:flex; flex-direction:column; gap:16px; min-width:0;
}
.rc-out-label{ font-size:14px; color:#CFE3DE; }
.rc-value-row{ display:flex; align-items:baseline; gap:18px; flex-wrap:wrap; }
.rc-value{ font-family:var(--font-head); font-size:clamp(2.8rem,5vw,4rem); line-height:1; font-variant-numeric:tabular-nums; }
.rc-formula{ font-size:13px; color:#CFE3DE; }
.rc-tiles{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.rc-tile{ background:rgba(255,255,255,.08); border-radius:16px; padding:16px 18px; }
.rc-tile b{ display:block; font-family:var(--font-head); font-size:24px; line-height:1.1; }
.rc-tile span{ font-size:13px; color:#CFE3DE; }
.rc-year b{ display:block; font-size:14px; margin-bottom:10px; }
.rc-bar{ display:grid; grid-template-columns:150px 1fr 120px; gap:12px; align-items:center; margin-bottom:10px; font-size:13px; }
.rc-bar i{ display:block; height:18px; border-radius:6px; width:var(--w); }
.rc-bar em{ font-style:normal; font-weight:700; text-align:right; white-space:nowrap; }
.rc-out .btn{ align-self:flex-start; }
.rc-foot{ font-size:11.5px; font-style:italic; color:#9FBFB8; margin:0; line-height:1.5; }

/* ---------- Responsive: Bausteine ---------- */
@media (max-width:1180px){
  .main-nav a{ padding:9px 12px; font-size:14px; }
  .header-actions .btn-sm{ padding:9px 16px; }
}
@media (max-width:1080px){
  .ls-grid{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:940px){
  .rd-grid, .ent-grid, .mi-grid, .oa-grid, .cp-grid, .q-grid, .er-grid, .rc-grid{ grid-template-columns:1fr; }
  .rd-grid{ gap:36px; }
  .q-grid{ gap:32px; }
  .oa-list{ flex-direction:row; overflow-x:auto; padding-bottom:6px; }
  .oa-card{ min-width:260px; }
  .msg-pair{ grid-template-columns:1fr; }
  .msg-letter{ padding-right:20px; }
  .msg-qr{ position:static; margin-top:14px; }
}
@media (max-width:560px){
  .cp-days{ display:none; }
  .cp-week{ display:block; margin-top:14px; }
  .cp-kw{ justify-content:flex-start; padding:8px 14px; margin-bottom:8px; }
  .cp-cell{ min-height:0; padding:0; background:none; margin-bottom:8px; }
  .cp-cell.is-empty{ display:none; }
  .cp-cell::before{
    content:attr(data-day); display:block; font-size:11px; font-weight:700;
    letter-spacing:.06em; color:var(--ink-soft); margin:0 0 4px 2px;
  }
  .cp-item b{ font-size:13px; }
}
@media (max-width:640px){
  .ls-grid{ grid-template-columns:1fr; }
  .mi-kpis{ grid-template-columns:1fr; }
  .mi-dash{ padding:22px 18px; }
  .oa-panel{ padding:20px 16px; }
  .oa-boxes{ grid-template-columns:1fr; }
  .er-kpis b{ font-size:24px; }
  .er-row{ grid-template-columns:104px 1fr 58px; gap:10px; }
  .er-step span{ font-size:12.5px; }
  .rc-tiles{ grid-template-columns:1fr; }
  .rc-bar{ grid-template-columns:96px 1fr 98px; font-size:12px; }
  .rc-inputs, .rc-out{ padding:22px 20px; }
  .q-badges{ grid-template-columns:1fr; }
  .rd-radar .radar-blip-label{ left:16px; font-size:10.5px; padding:3px 9px; }
  .rd-radar .rb-sig{ display:none; }
  .rd-radar .radar-blip-dot{ width:11px; height:11px; }
  .rd-kpis{ gap:12px 30px; }
}

/* ---------- Rechtliche Seiten (Platzhalter) ---------- */
.legal-page{ padding:140px 0 90px; background:var(--white,#fff); }
.legal-inner{ max-width:760px; }
.legal-inner h1{ font-size:clamp(32px,5vw,46px); margin:0 0 28px; }
.legal-inner h2{ font-size:20px; margin:34px 0 10px; }
.legal-inner p{ font-size:16px; line-height:1.7; color:var(--ink-soft); margin:0 0 12px; }
.legal-notice{ background:rgba(214,255,60,0.35); border:1px solid rgba(8,72,65,0.18); border-radius:var(--radius-md,14px); padding:14px 18px; margin:0 0 30px !important; color:var(--deep-green-dark,#084841) !important; }


@media (max-width:520px){
  .ent-role{ grid-template-columns:auto 1fr; }
  .ent-role .ent-chip{ grid-column:2; justify-self:start; }
  .ent-role-text b{ overflow-wrap:anywhere; }
}

/* ---------- Kennzahlen-Band ---------- */
.stats-band{ background:var(--deep-green-dark); padding:56px 0; }
.stats-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:32px; }
.stat{ display:flex; flex-direction:column; gap:6px; min-width:0; }
.stat-num{ font-family:var(--font-head); font-size:clamp(1.5rem,2.6vw,2.6rem); font-weight:700; color:var(--lime); line-height:1.1; overflow-wrap:break-word; }
.stat-label{ font-size:13.5px; color:rgba(255,255,255,0.72); line-height:1.5; max-width:220px; }
@media (max-width:940px){ .stats-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:640px){ .stats-grid{ gap:24px 20px; } .stats-band{ padding:44px 0; } }

/* ---------- Scrollytelling: vertikal kompakter ---------- */
.scrolly-section{ padding-top:80px; padding-bottom:64px; }
.scrolly-progress{ margin-top:32px; padding:10px 0; }
.scrolly-track{ padding:16px 0 8px; }
.scrolly-content{ padding:22px 26px; }
.scrolly-num{ margin-bottom:10px; }
.scrolly-content h3{ margin-bottom:6px; }
.scrolly-content > p{ margin:0 0 14px; line-height:1.5; }
.scrolly-items{ gap:7px; }
.scrolly-item{ align-items:center; padding:8px 12px; gap:10px; }
.scrolly-item-icon{ width:24px; height:24px; margin-top:0; font-size:12px; }
.scrolly-item h4{ margin:0; }
@media (min-width:941px){
  .scrolly-waypoint{ min-height:0; padding:14px 0; }
  .scrolly-bg-visual{ width:380px; height:380px; }
}
@media (max-width:940px){
  .scrolly-waypoint{ padding:8px 0; }
  .scrolly-section{ padding-top:64px; padding-bottom:48px; }
}

/* ---------- Vergleich: stärkerer Kontrast ---------- */
.compare-cell-neg{
  background:rgba(255,255,255,0.55);
  border:1px dashed rgba(110,137,133,0.45);
  color:var(--ink-faint);
}
.compare-cell-pos{
  background:var(--deep-green-dark);
  border:1px solid var(--deep-green-dark);
  color:var(--white);
  box-shadow:0 10px 26px rgba(8,72,65,0.22);
}
.compare-cell-pos .check-icon{ background:var(--lime); color:var(--deep-green-dark); }
.compare-cell-neg .check-icon{ background:rgba(220,80,80,0.1); color:#b25a5a; }
.compare-head-pos{ color:var(--deep-green-dark); }
.compare-arrow{ color:var(--deep-green); font-weight:700; }

.rd-copy h2{ font-size:clamp(1.75rem,2.9vw,2.375rem); line-height:1.2; }

.q-core-icon{ width:56%; height:auto; color:var(--white); }

/* ---------- Leistungsspektrum, invertiert (unter dem Hero) ---------- */
.ls-inverted{ background:linear-gradient(180deg, var(--deep-green) 0%, #09524A 100%); }
.ls-inverted .kicker{ color:var(--lime); }
.ls-inverted .section-head h2{ color:var(--white); }
.ls-inverted .section-lead{ color:rgba(255,255,255,0.78); }
.ls-inverted .mark{ background:linear-gradient(transparent 62%, rgba(230,255,42,.9) 62%, rgba(230,255,42,.9) 92%, transparent 92%); color:var(--white); }
.ls-inverted .ls-card{ background:rgba(255,255,255,0.07); border:1px solid rgba(255,255,255,0.16); }
.ls-inverted .ls-card:hover{ background:rgba(255,255,255,0.12); border-color:rgba(230,255,42,0.55); box-shadow:0 14px 34px rgba(0,0,0,0.18); }
.ls-inverted .ls-icon{ background:var(--lime); color:var(--deep-green-dark); }
.ls-inverted .ls-card h3{ color:var(--white); }
.ls-inverted .ls-card p{ color:rgba(255,255,255,0.76); }
.ls-inverted .mark{ background:none; color:var(--lime); }

.stats-band{ background:var(--deep-green); border-bottom:1px solid rgba(255,255,255,0.14); }

/* Leistungsspektrum (invertiert): kompakter */
.ls-inverted{ padding:64px 0; }
.ls-inverted .section-head{ margin-bottom:28px; }
.ls-inverted .ls-grid{ gap:14px; }
.ls-inverted .ls-card{
  display:grid; grid-template-columns:38px 1fr; column-gap:14px; row-gap:4px;
  align-items:start; padding:16px 18px;
}
.ls-inverted .ls-icon{ grid-row:1 / span 2; width:38px; height:38px; border-radius:10px; font-size:17px; margin:0; }
.ls-inverted .ls-card h3{ font-size:16px; line-height:1.25; margin:0; align-self:center; }
.ls-inverted .ls-card p{ font-size:13.5px; line-height:1.45; }
@media (max-width:760px){ .ls-inverted{ padding:48px 0; } }

/* Kennzahlen-Band: Mint, unter dem Sales Radar */
.stats-band{ background:linear-gradient(180deg, var(--mint) 0%, var(--mint-end) 100%); border-top:1px solid var(--border); border-bottom:0; }
.stats-band .stat-num{ color:var(--deep-green-dark); }
.stats-band .stat-label{ color:var(--ink-soft); }

/* Kennzahlen im Sales-Radar-Abschnitt */
#radar{ padding-bottom:64px; }
.rd-stats{ margin-top:40px; padding-top:30px; border-top:1px solid var(--border); }
.rd-stats .stat-num{ color:var(--deep-green-dark); }
.rd-stats .stat-label{ color:var(--ink-soft); }
.rd-stats .stat-num{
  align-self:flex-start;
  background:linear-gradient(transparent 62%, var(--lime) 62%, var(--lime) 92%, transparent 92%);
}
.rd-stats .stat:first-child .stat-num{ background:none; }
.rd-stats .stat-num{ background:none; }
.q-g1{ display:flex; align-items:center; justify-content:center; text-align:center; }
.q-g2{ display:flex; align-items:center; justify-content:center; text-align:center; }
.q-g3{ display:flex; align-items:center; justify-content:center; text-align:center; }
.q-g4{ display:flex; align-items:center; justify-content:center; text-align:center; }

.q-g1{ flex-direction:column; gap:6px; }
.q-ic{ width:28px; height:28px; color:var(--deep-green); }
.q-g2{ flex-direction:column; gap:6px; }
.q-g3{ flex-direction:column; gap:6px; }
.q-g4{ flex-direction:column; gap:6px; }
.ls-inverted .ls-card h3{ font-size:19px; line-height:1.2; font-weight:700; }
.ls-inverted .ls-card p{ font-size:12.5px; line-height:1.45; }

/* ---------- Responsive Skalierung der Visualisierungen ---------- */
/* [data-fit]: Designbreite in px; js/main.js setzt width + zoom, sobald der Platz kleiner ist (Proportionen bleiben erhalten). */
[data-fit]{ box-sizing:border-box; }

.ent-chip, .msg-meta, .oa-pill, .mi-note, .rc-foot{ font-size:12px; }

@media (max-width:640px){
  .hero h1{ font-size:clamp(34px,9.6vw,40px); line-height:1.1; }
  .section-head h2, .rd-copy h2, .cta-inner h2{ font-size:clamp(26px,7.6vw,32px); line-height:1.18; }
  .section-lead{ font-size:16px; line-height:1.55; }

  /* Zielaccount-Karten: 2x2 statt scrollendem Streifen */
  .oa-list{ display:grid; grid-template-columns:1fr 1fr; gap:10px; overflow:visible; padding-bottom:0; }
  .oa-card{ min-width:0; padding:12px; }
  .oa-card-top{ flex-wrap:wrap; gap:6px; }
  .oa-card-top b{ font-size:14px; }

  /* Kanalplan: kompaktes Raster, wird per data-fit proportional verkleinert */
  .oc-table{ min-width:0; }
  .oc-row{ grid-template-columns:120px repeat(7, minmax(34px,1fr)); gap:6px; }
  .oc-ini{ display:none; }
  .oc-who b{ font-size:12.5px; overflow-wrap:anywhere; hyphens:auto; }
  .oc-who small, .oc-note{ font-size:12px; }
  .oc-head span{ writing-mode:vertical-rl; transform:rotate(180deg); justify-self:center; height:72px; font-size:12px; }
}
@media (max-width:360px){
  .wrap{ padding:0 16px; }
}

/* =========================================================
   MOBILE v3 — kompakte, fluide Mobil-Ansicht (≤640px)
   - kein horizontales Scrollen, alle Maße skalieren mit der Bildschirmbreite
   - einheitliche Abstände/Radien, nichts ragt über den Rand oder überlappt
   - Prozess als vertikales Scrollytelling (Schienen-Fortschritt)
   Desktop/Tablet bleiben unberührt: alles gilt nur im Media-Query,
   Hilfselemente (Segmente, Sticky-CTA) sind sonst ausgeblendet.
   ========================================================= */
.m-seg, .m-sticky-cta{ display:none; }

@media (max-width:640px){
  :root{
    --m-side:clamp(16px, 5.2vw, 22px);
    --m-sec:clamp(40px, 12.8vw, 48px);
    --m-head:clamp(16px, 5.3vw, 20px);
    --m-gap:clamp(10px, 3.2vw, 14px);
    --m-pad:clamp(14px, 4.8vw, 18px);
    --m-pad-s:clamp(12px, 3.8vw, 14px);
    --m-r:20px; --m-r-s:14px; --m-r-xs:10px;
    --m-hdr:58px;
  }

  /* ---- Sicherheitsnetz gegen Überlauf ---- */
  html, body{ overflow-x:clip; }
  .wrap{ padding-left:var(--m-side); padding-right:var(--m-side); }
  main h1, main h2, main h3, main h4, main p, main li, main b, main em, main strong, main small, main span, main a, main button, main label, main td, main th{
    overflow-wrap:break-word; hyphens:auto;
  }
  .text-underline, .text-mark-full{ white-space:normal; }

  /* ---- Rhythmus: Section-Abstände & Kopfbereich ---- */
  main > section.section, main > section#radar{ padding:var(--m-sec) 0; }
  main > .hero{ padding:calc(var(--m-hdr) + 40px) 0 clamp(32px, 11vw, 48px); }
  main > .cta-section{ padding:var(--m-sec) 0 clamp(56px, 18vw, 72px); }
  main section.section .section-head{ margin-bottom:var(--m-head); }
  .kicker{ font-size:clamp(11.5px, 3.3vw, 12.5px); margin-bottom:10px; }
  .hero h1{ font-size:clamp(30px, 9.4vw, 40px); line-height:1.1; }
  .section-head h2, .rd-copy h2, .cta-inner h2{ font-size:clamp(24px, 7.4vw, 32px); line-height:1.18; margin-bottom:12px; }
  .section-lead{ font-size:clamp(15px, 4.2vw, 16px); line-height:1.55; }
  .site-footer{ padding-top:44px; }
  .footer-inner{ gap:28px; padding-bottom:28px; }
  .footer-cols{ grid-template-columns:1fr 1fr; gap:20px; }
  .footer-col:last-child{ grid-column:1 / -1; }

  /* ---- Container einheitlich: Radius 20 / Padding fluid ---- */
  .oa-panel, .cp-cal, .cp-card, .mi-dash, .mi-card, .er-dash, .rc-inputs, .rc-out,
  .price-card, .scrolly-content, .cta-form, .signal-card{ border-radius:var(--m-r); padding:var(--m-pad); }
  .q-not{ border-radius:var(--m-r); padding:var(--m-pad-s) var(--m-pad); }
  /* ---- Innere Elemente: Radius 14 / Padding fluid ---- */
  .msg, .oa-box, .q-badge, .rc-tile, .mi-kpi, .er-kpis div, .compare-cell,
  .ent-role, .ent-more, .ent-company, .oa-card, .er-pilot, .ls-inverted .ls-card{ border-radius:var(--m-r-s); padding:var(--m-pad-s); }
  .ent-role.is-active{ padding:calc(var(--m-pad-s) - 1px); }
  .cp-cell, .cp-item, .mi-heat td, .oc, .signal-list-row, .ent-av, .q-badge-ic{ border-radius:var(--m-r-xs); }
  .q-gate, .cta-form input{ border-radius:var(--m-r-s); }
  .signal-list-row{ border-radius:var(--m-r-xs); }

  /* ---- Typo ---- */
  .ls-card p, .rd-steps p, .cp-card p, .mi-card p, .price-desc, .oa-box p, .msg{ font-size:14px; line-height:1.5; }

  /* ---- Segment-Schalter (ohne Scrollen) ---- */
  .m-seg{
    display:flex; gap:4px; padding:4px; margin:0 0 var(--m-gap);
    background:rgba(11,97,88,.09); border-radius:999px;
  }
  .m-seg button{
    flex:1 1 0; min-width:0; min-height:40px; padding:6px 8px; border:0; border-radius:999px;
    background:none; font-size:clamp(12px, 3.5vw, 13.5px); font-weight:600; line-height:1.2; text-align:center;
    color:var(--deep-green-dark); cursor:pointer;
    transition:background .25s var(--ease), color .25s var(--ease);
  }
  .m-seg button.is-active{ background:var(--deep-green-dark); color:var(--white); }

  /* ---- Sticky-CTA ---- */
  .m-sticky-cta{
    position:fixed; left:0; right:0; bottom:0; z-index:60;
    display:flex; align-items:center; justify-content:center; gap:8px;
    min-height:52px; padding:12px var(--m-side) calc(12px + env(safe-area-inset-bottom)); border-radius:0;
    background:var(--lime); color:var(--deep-green-dark); font-weight:700; font-size:15px;
    box-shadow:0 -6px 20px rgba(8,72,65,.14);
    transform:translateY(110%); opacity:0; pointer-events:none;
    transition:transform .35s var(--ease), opacity .35s var(--ease);
  }
  .m-sticky-cta.is-shown{ transform:none; opacity:1; pointer-events:auto; }

  /* ---- Hero ---- */
  .hero-subhead{ font-size:clamp(1rem, 4.4vw, 1.1rem); margin-bottom:14px; }
  .hero-lead{ font-size:clamp(15px, 4.2vw, 16px); line-height:1.55; margin-bottom:22px; }
  .hero-actions{ margin-bottom:18px; }
  .hero-trustline{ flex-wrap:wrap; gap:6px 8px; font-size:12.5px; }
  .hero-trustline .dot-sep{ display:none; }
  .hero-trustline span:not(.dot-sep){ background:rgba(11,97,88,.08); border-radius:999px; padding:5px 11px; }
  .hero-visual{ display:flex; flex-wrap:wrap; gap:8px; margin-top:4px; min-width:0; }
  .hero-visual .signal-card{ width:100%; }
  .hero-visual .floater{ position:static; transform:none; animation:none; margin:0; max-width:100%; }
  .hero-visual .hero-note{ width:100%; margin:4px 0 0; }
  .signal-list-viewport{ height:140px; }
  .signal-body .radar-wrap{ zoom:.82; margin:8px auto 6px; }
  .signal-body .radar-blip-label{ font-size:12px; padding:2px 8px; }
  .signal-body .radar-blip:not(.is-left) .radar-blip-label{ left:8px; }
  .signal-body .radar-blip.is-left .radar-blip-label{ right:8px; }
  .signal-list-label{ font-size:11.5px; }
  .scroll-cue{ display:none; }
  .btn-sm{ min-height:44px; }

  /* ---- Leistungen (kompakte Liste) ---- */
  .ls-inverted .ls-grid{ grid-template-columns:1fr; gap:var(--m-gap); }

  /* ---- Prozess: vertikales Scrollytelling mit Schienen-Fortschritt ---- */
  .scrolly-progress{
    position:sticky; top:var(--m-hdr); z-index:20; margin-top:0; padding:8px 0;
    background:rgba(255,255,255,.94); -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px);
  }
  .scrolly-progress-inner{ gap:12px; }
  .scrolly-progress-label{ font-size:13px; }
  .scrolly-track{ position:relative; display:block; padding:var(--m-gap) 0 0; }
  .scrolly-track .scrolly-path-svg, .scrolly-track .scrolly-marker, .scrolly-track .scrolly-node,
  .scrolly-track .scrolly-bg-visual{ display:none; }
  .scrolly-waypoint{ position:relative; min-height:0; padding:0 0 var(--m-gap); display:block; }
  .scrolly-waypoint:last-child{ padding-bottom:0; }
  .scrolly-waypoint-inner.wrap{ padding-left:calc(var(--m-side) + 34px); }
  .scrolly-track::before, .scrolly-track::after{
    content:''; position:absolute; left:calc(var(--m-side) + 7px); width:4px; border-radius:4px; z-index:1;
    top:var(--m-rail-top, 0px);
  }
  .scrolly-track::before{ height:var(--m-rail-h, 0px); background:rgba(11,97,88,.16); }
  .scrolly-track::after{ height:var(--m-fill, 0px); background:linear-gradient(180deg, var(--deep-green), var(--lime)); }
  .scrolly-waypoint::before{
    content:''; position:absolute; z-index:2; left:var(--m-side); top:18px; width:18px; height:18px; box-sizing:border-box;
    border-radius:50%; background:var(--white); border:3px solid rgba(11,97,88,.35);
    transition:background .35s var(--ease), border-color .35s var(--ease), transform .35s var(--ease);
  }
  .scrolly-waypoint.is-active::before{ border-color:var(--deep-green); background:var(--lime); }
  .scrolly-waypoint.is-current::before{ transform:scale(1.2); animation:bk-pulse 1.8s infinite; }
  .scrolly-content{ max-width:none; width:100%; margin:0 !important; transition:opacity .4s var(--ease), box-shadow .4s var(--ease); }
  .scrolly-track[data-m-story] .scrolly-waypoint:not(.is-current) .scrolly-content{ opacity:.72; box-shadow:none; }
  .scrolly-content h3{ font-size:clamp(18px, 5.4vw, 20px); margin-bottom:6px; }
  .scrolly-content > p{ font-size:14px; margin-bottom:12px; }
  .scrolly-items{ display:grid; grid-template-columns:repeat(auto-fit, minmax(min(100%, 210px), 1fr)); gap:8px; }
  .scrolly-item > div{ min-width:0; }
  .scrolly-item{ padding:10px 12px; border-radius:var(--m-r-s); }
  .scrolly-waypoint:not(.is-active) .scrolly-item{ opacity:.35; transform:translateY(6px); }
  .scrolly-waypoint.is-active .scrolly-item{ opacity:1; transform:none; }
  .scrolly-item h4{ font-size:13.5px; line-height:1.3; }
  .scrolly-item-icon{ flex:none; }

  /* ---- Vergleich (Segment-Schalter) ---- */
  .compare-table{ gap:var(--m-gap); }
  .compare-row{ grid-template-columns:1fr; gap:0; }
  .compare-arrow{ display:none; }
  .compare-table[data-m-side="pos"] .compare-cell-neg,
  .compare-table[data-m-side="neg"] .compare-cell-pos{ display:none; }
  .compare-cell{ font-size:14px; line-height:1.45; }

  /* ---- Sales Radar ---- */
  .rd-grid{ gap:var(--m-head); }
  .rd-steps{ margin-top:18px; }
  .rd-steps li{ grid-template-columns:40px 1fr; gap:12px; padding:14px 0; }
  .rd-step-no{ width:40px; height:40px; font-size:17px; }
  .rd-steps h3{ font-size:16px; }
  .rd-stats{ margin-top:28px; padding-top:20px; gap:16px 12px; }
  .rd-stats .stat-num{ font-size:clamp(1.6rem, 8vw, 2rem); }
  .rd-stats .stat-label{ font-size:12.5px; max-width:none; }
  .rd-radar .radar-blip-label{ left:16px; font-size:clamp(10px, 2.9vw, 11px); padding:3px 8px; }
  .rd-radar .rb-sig{ display:none; }
  .rd-radar .radar-blip[style*="left:56%"] .radar-blip-label{ left:auto; right:16px; }
  .btn{ max-width:100%; white-space:normal; text-align:center; }
  .rc-out .btn{ align-self:stretch; }

  /* ---- Entscheider ---- */
  .ent-grid{ gap:var(--m-gap); }
  .ent-roles{ flex-direction:column; gap:8px; margin:10px 0 0; padding:0; border-left:0; overflow:visible; }
  .ent-role, .ent-more{ width:100%; min-width:0; }
  .ent-role{ grid-template-columns:auto minmax(0,1fr); gap:6px 10px; }
  .ent-role .ent-ini{ grid-row:1 / span 2; }
  .ent-role .ent-chip{ grid-column:2; justify-self:start; }
  .ent-role::before, .ent-more::before{ display:none; }
  .ent-chip{ font-size:11.5px; padding:4px 9px; }
  .ent-msgs-head{ margin-bottom:10px; }
  .ent-panel{ gap:10px; }
  .msg-letter{ padding-right:var(--m-pad-s); }
  .msg-pair{ grid-template-columns:1fr; gap:10px; }
  .ent-panel[data-m-ch="letter"] .msg-li, .ent-panel[data-m-ch="letter"] .msg-mail,
  .ent-panel[data-m-ch="li"] .msg-letter, .ent-panel[data-m-ch="li"] .msg-mail,
  .ent-panel[data-m-ch="mail"] .msg-letter, .ent-panel[data-m-ch="mail"] .msg-li{ display:none; }
  .ent-points{ display:grid; grid-template-columns:1fr 1fr; gap:8px 12px; margin-top:20px; font-size:13.5px; }

  /* ---- Omni-Channel-Flow ---- */
  .oa-grid{ gap:var(--m-gap); }
  .oa-list{ display:grid; grid-template-columns:1fr 1fr; gap:8px; overflow:visible; padding:0; }
  .oa-card{ min-width:0; padding:var(--m-pad-s) 12px; }
  .oa-card-top{ flex-wrap:wrap; gap:6px; }
  .oa-card-top b{ font-size:14px; }
  .oa-card small{ font-size:12px; }
  .oa-panel-head{ margin-bottom:12px; }
  .oa-panel-head h3{ font-size:16px; }
  .oa-boxes{ grid-template-columns:1fr; margin-top:12px; gap:8px; }
  .oc-scroll{ overflow:visible; }
  .oc-table{ min-width:0; }
  .oc-row{ grid-template-columns:120px repeat(7, minmax(34px,1fr)); gap:6px; }
  .oc-ini{ display:none; }
  .oc-who b{ font-size:12.5px; overflow-wrap:anywhere; }
  .oc-who small, .oc-note{ font-size:12px; }
  .oc-head span{ writing-mode:vertical-rl; transform:rotate(180deg); justify-self:center; height:72px; font-size:12px; }

  /* ---- Content-Plan (Wochen-Tabs) ---- */
  .cp-grid{ gap:var(--m-gap); }
  .cp-cal-head{ margin-bottom:12px; }
  .cp-cal-head h3{ font-size:17px; }
  .cp-chips{ gap:6px; }
  .cp-chip{ font-size:12px; padding:6px 10px; }
  .cp-days, .cp-kw{ display:none; }
  .cp-week{ display:block; margin-top:0; }
  .cp-cell{ min-height:0; padding:0; background:none; margin-bottom:8px; }
  .cp-cell.is-empty{ display:none; }
  .cp-cell::before{ content:attr(data-day); display:block; font-size:11.5px; font-weight:700; letter-spacing:.06em; color:var(--ink-soft); margin:0 0 4px 2px; }
  .cp-item b{ font-size:13px; }
  .cp-cal[data-m-weeks] .cp-week:not(.is-m-active){ display:none; }
  .cp-card + .cp-card{ margin-top:var(--m-gap); }
  .cp-nums b{ font-size:24px; }

  /* ---- Qualität ---- */
  .q-grid{ gap:var(--m-head); }
  .q-gate{ width:33%; padding:12px 10px; }
  .q-badges{ grid-template-columns:1fr 1fr; gap:var(--m-gap); margin-top:16px; }
  .q-badge{ flex-direction:column; gap:8px; }
  .q-badge b{ font-size:14px; }
  .q-badge small{ font-size:12px; }
  .q-badge-ic{ width:32px; height:32px; }
  .q-not{ gap:6px 16px; font-size:13px; margin-top:var(--m-gap); }

  /* ---- Ergebnisse ---- */
  .er-grid{ gap:var(--m-head); }
  .er-funnel{ gap:6px; }
  .er-step{ padding:14px 12px; }
  .er-step b{ font-size:clamp(1.7rem, 8vw, 2rem); }
  .er-dash-head{ margin-bottom:12px; }
  .er-kpis{ gap:8px; margin-bottom:16px; }
  .er-kpis b{ font-size:clamp(18px, 6vw, 22px); }
  .er-kpis span{ font-size:12px; }
  .er-row{ margin-bottom:12px; }

  /* ---- Market Intelligence ---- */
  .mi-grid{ gap:var(--m-gap); }
  .mi-kpis{ grid-template-columns:1fr; gap:8px; margin:14px 0; }
  .mi-kpi{ display:grid; grid-template-columns:minmax(76px, auto) minmax(0,1fr); column-gap:14px; align-items:center; }
  .mi-kpi b{ grid-row:1 / span 2; font-size:clamp(1.4rem, 7vw, 1.7rem); }
  .mi-kpi span{ margin-top:0; }
  .mi-kpi span, .mi-kpi em{ font-size:12px; }
  .mi-kpi em{ margin-top:2px; }
  .mi-heat-wrap{ overflow:visible; }
  .mi-card + .mi-card{ margin-top:var(--m-gap); }

  /* ---- Rechner ---- */
  .rc-grid{ gap:var(--m-gap); }
  .rc-field{ margin-bottom:16px; }
  .rc-out{ gap:12px; }
  .rc-value{ font-size:clamp(2.2rem, 11vw, 2.6rem); }
  .rc-tiles{ grid-template-columns:1fr 1fr; gap:8px; }
  .rc-tile b{ font-size:clamp(16px, 5.4vw, 20px); }
  .rc-bar{ grid-template-columns:minmax(0,1fr) auto; grid-template-areas:"label val" "bar bar"; gap:6px 10px; font-size:12.5px; margin-bottom:12px; }
  .rc-bar span{ grid-area:label; }
  .rc-bar em{ grid-area:val; white-space:nowrap; }
  .rc-bar i{ grid-area:bar; }

  /* ---- Preise (gestapelt, Full-Service zuerst) ---- */
  .pricing-grid{ max-width:none; gap:var(--m-gap); }
  .price-badge{ left:var(--m-pad); }
  .price-card h3{ font-size:20px; margin-bottom:8px; }
  .price-value{ font-size:clamp(1.7rem, 8.5vw, 2rem); }
  .price-desc{ min-height:0; margin-bottom:14px; }
  .price-features{ gap:9px; margin-bottom:20px; }

  /* ---- Kontakt ---- */
  .cta-inner > p{ margin-bottom:24px; }
  .cta-form input{ padding:13px 14px; }
}

/* =========================================================
   MOBILE v3 — Typografie-Hierarchie (≤640px)
   Ebene 1 Headline  >  Ebene 2 Subtext  >  Ebene 3 Text in Kästchen/Bausteinen
   Alle Größen fluid (clamp mit vw), Desktop/Tablet unberührt.
   ========================================================= */
@media (max-width:640px){
  :root{
    --t-h1:clamp(26px, 8vw, 32px);       /* Hero-Headline            375px ≈ 30 */
    --t-h2:clamp(20px, 6.1vw, 25px);     /* Abschnitts-Headlines     375px ≈ 23 */
    --t-lead:clamp(13.5px, 3.85vw, 15px);/* Subtext / Leads          375px ≈ 14.4 */
    --t-title:clamp(13.5px, 3.75vw, 14.5px);/* Titel in Bausteinen     375px ≈ 14.8 */
    --t-body:clamp(12.5px, 3.45vw, 13.5px);/* Text in Bausteinen     375px ≈ 12.9 */
    --t-meta:clamp(11.5px, 3.1vw, 12px); /* Meta, Chips, Notizen     375px ≈ 11.6 */
  }

  /* ---- Ebene 1: Headlines ---- */
  .hero h1{ font-size:var(--t-h1); line-height:1.12; margin-bottom:10px; }
  .section-head h2, .rd-copy h2, .cta-inner h2{ font-size:var(--t-h2); line-height:1.2; margin-bottom:10px; }

  /* ---- Ebene 2: Subtext ---- */
  .hero-subhead{ font-size:var(--t-lead); line-height:1.4; margin-bottom:10px; }
  .hero-lead, .section-lead, .cta-inner > p{ font-size:var(--t-lead); line-height:1.5; }
  .hero-lead{ margin-bottom:18px; }
  .eyebrow{ font-size:11.5px; }
  .kicker{ font-size:11px; letter-spacing:.07em; margin-bottom:8px; }
  .hero-trustline{ font-size:var(--t-meta); }
  .btn{ font-size:14px; padding:12px 20px; }
  .hero-actions{ margin-bottom:14px; }

  /* ---- Ebene 3: Titel in Bausteinen ---- */
  .ls-inverted .ls-card h3, .rd-steps h3, .scrolly-content h3, .oa-panel-head h3, .mi-dash h3, .mi-card h3,
  .er-dash-head h3, .cp-cal-head h3, .cp-card h3, .price-card h3, .ent-company b, .signal-card-title{
    font-size:var(--t-title); line-height:1.25;
  }
  .price-card h3{ margin-bottom:6px; }
  .scrolly-content h3{ margin-bottom:4px; }

  /* ---- Ebene 3: Text in Bausteinen ---- */
  .ls-inverted .ls-card p, .rd-steps p, .cp-card p, .mi-card p, .price-desc, .oa-box p, .msg, .compare-cell,
  .scrolly-content > p, .price-features li, .ent-points, .q-not, .mi-trends li, .cp-checks, .er-label,
  .rc-field label, .rc-formula, .rc-out-label, .q-badge small, .ent-company small, .rc-tile span,
  .er-kpis span, .mi-kpi span, .cp-nums span, .stat-label, .rd-stats .stat-label{
    font-size:var(--t-body); line-height:1.45;
  }
  .scrolly-item h4, .ent-role-text b, .q-badge b, .ent-more b, .oa-card-top b, .cp-item b, .mi-kpi em{
    font-size:var(--t-body); line-height:1.3;
  }
  .msg-top .msg-tag, .msg-subject{ font-size:var(--t-meta); }
  .ls-inverted .ls-card p{ margin-top:2px; }
  .ls-icon{ font-size:15px; }

  /* ---- Meta ---- */
  .msg-meta, .ent-role-text small, .oa-card small, .mi-note, .bk-note, .rc-foot, .cp-chip, .ent-chip, .oa-pill,
  .cp-item small, .oa-live, .mi-chip, .form-hint, .signal-list-label, .footer-bottom p{
    font-size:var(--t-meta);
  }
  .footer-brand p, .footer-col a{ font-size:var(--t-body); }
  .footer-col h4{ font-size:var(--t-meta); }

  /* ---- Große Zahlen / Kennzahlen: proportional zurücknehmen ---- */
  .rd-stats .stat-num{ font-size:clamp(19px, 5.9vw, 22px); }
  .er-step b{ font-size:clamp(1.3rem, 6vw, 1.5rem); }
  .er-step span{ font-size:var(--t-body); }
  .er-kpis b{ font-size:clamp(16px, 4.8vw, 19px); }
  .rc-value{ font-size:clamp(1.6rem, 7.6vw, 1.9rem); }
  .rc-tile b{ font-size:clamp(15px, 4.5vw, 17px); }
  .price-value{ font-size:clamp(1.35rem, 6.2vw, 1.55rem); }
  .price-value span{ font-size:var(--t-meta); }
  .mi-kpi b{ font-size:clamp(1.2rem, 5.7vw, 1.45rem); }
  .cp-nums b{ font-size:clamp(18px, 5.3vw, 21px); }
  .score-num{ font-size:clamp(19px, 5.6vw, 22px); }
  .score-label{ font-size:var(--t-meta); }
  .mi-trend-no{ font-size:15px; }
  .rd-step-no{ font-size:15px; width:36px; height:36px; }
  .rd-steps li{ grid-template-columns:36px 1fr; }
  .scrolly-num{ font-size:11.5px; }

  /* ---- Segmente / Tabs ---- */
  .m-seg button{ font-size:var(--t-body); }

  /* ---- Sticky-CTA ---- */
  .m-sticky-cta{ font-size:14px; min-height:48px; }
}

/* Mobile: Kicker 8px */
@media (max-width:640px){
  .kicker, .kicker-on-dark{ font-size:8px; letter-spacing:.08em; }
}


/* Preise: Setup-Fee unter dem Preis */
.price-setup{ font-size:12.5px; color:var(--ink-faint); margin:-4px 0 12px; }
@media (max-width:640px){ .price-setup{ font-size:var(--t-meta); margin:-2px 0 10px; } }
.price-card.is-featured .price-setup{ color:rgba(255,255,255,0.6); }

/* ---------- Kontaktformular: Barrierefreiheit, Spam-Schutz, Status ---------- */
.sr-only{ position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0; }
.hp-field{ position:absolute; left:-10000px; top:auto; width:1px; height:1px; overflow:hidden; }
.form-consent{ display:flex; align-items:flex-start; gap:10px; margin:2px 0 14px; font-size:13px; line-height:1.45; color:var(--ink-soft); cursor:pointer; }
.form-consent input{ flex:none; width:18px; height:18px; margin:2px 0 0; padding:0; accent-color:var(--deep-green); }
.form-consent a{ text-decoration:underline; color:var(--deep-green-dark); }
.turnstile-wrap{ margin:0 0 14px; min-height:0; max-width:100%; }
.form-status{ margin:14px 0 0; padding:12px 14px; border-radius:12px; font-size:14px; line-height:1.45; text-align:left; }
.form-status.is-info{ background:var(--seafoam); color:var(--deep-green-dark); }
.form-status.is-success{ background:var(--mint-gradient); color:var(--deep-green-dark); font-weight:600; }
.form-status.is-error{ background:#FCEDEA; color:#8A2D1E; }
.form-status a{ text-decoration:underline; color:inherit; font-weight:700; }
.cta-form.is-sent .form-row, .cta-form.is-sent .form-consent, .cta-form.is-sent .turnstile-wrap, .cta-form.is-sent .btn{ display:none; }
.cta-form.is-sent .form-status{ margin-top:0; }
.price-note{ margin:18px 0 0; text-align:center; font-size:13px; color:var(--ink-faint); }
@media (max-width:640px){
  .form-consent{ font-size:var(--t-meta); }
  .form-status{ font-size:var(--t-body); }
  .price-note{ font-size:var(--t-meta); margin-top:var(--m-gap); }
}