/* Herbst des Handelns — Designsystem
   Farben, Typo und Abstände stehen als Custom Properties in :root.
   Schrift: Neue Haas Grotesk (lizenzpflichtig) mit Fallback auf Inter.
   Icons: Lucide (ISC). Karte: eigene SVG-Ebenen. */

/* ================= tokens ================= */
:root{
  --ink:#12161B;
  --ink-soft:#2A3039;
  --graphite:#5A6470;
  --graphite-2:#8A939E;
  --hair:rgba(18,22,27,.10);
  --paper:#FFFFFF;
  --red:#CF0026;
  --yellow:#FFED00;
  --yellow-2:#F2DE00;

  --glass-bg:rgba(255,255,255,.55);
  --glass-br:rgba(255,255,255,.78);
  --glass-sh:0 26px 60px -36px rgba(18,26,38,.34);

  --display:"Neue Haas Grotesk Display Pro","NHaasGroteskDSPro","Helvetica Neue","Inter Tight",Inter,Helvetica,Arial,sans-serif;
  --text:"Neue Haas Grotesk Text Pro","NHaasGroteskTXPro","Helvetica Neue",Inter,Helvetica,Arial,sans-serif;

  --pad:clamp(20px,5vw,76px);
  --maxw:1300px;
  --ease:cubic-bezier(.16,1,.3,1);
  --r:22px;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;color:var(--ink);background:#EFF1F4;
  font-family:var(--text);font-size:17px;line-height:1.6;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;position:relative;
}
/* textured, light backdrop — the glass needs something to sit on */
body::before{
  content:"";position:fixed;inset:0;z-index:-3;pointer-events:none;
  background:
    radial-gradient(1020px 700px at 84% -10%, rgba(255,255,255,.85), transparent 62%),
    radial-gradient(880px 640px at 4% 8%, rgba(255,255,255,.55), transparent 60%),
    radial-gradient(1040px 760px at 104% 52%, rgba(126,136,152,.16), transparent 60%),
    radial-gradient(960px 740px at -8% 74%, rgba(108,118,134,.22), transparent 62%),
    radial-gradient(760px 520px at 52% 112%, rgba(126,136,152,.14), transparent 60%),
    linear-gradient(180deg,#F7F8FA 0%,#E7E9ED 100%);
}
body::after{
  content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;
  background-image:url("../img/grain.png");background-size:200px 200px;
  opacity:.5;mix-blend-mode:multiply;
}
img,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
:focus-visible{outline:2px solid var(--red);outline-offset:3px;border-radius:6px}

.wrap{width:100%;max-width:var(--maxw);margin:0 auto;padding-inline:var(--pad)}
.sect{position:relative;padding-block:clamp(54px,7vw,104px)}
section[id],header[id]{scroll-margin-top:110px}
#thread{scroll-margin-top:190px}
.sect--tight{padding-block:clamp(42px,5vw,74px)}

h1,h2,h3,.num{font-family:var(--display);font-weight:600;letter-spacing:-.028em;margin:0;text-wrap:balance}
h1{font-size:clamp(40px,7.4vw,92px);line-height:.97;letter-spacing:-.038em;font-weight:700}
h2{font-size:clamp(30px,4.3vw,58px);line-height:1.02}
h3{font-size:clamp(18px,1.5vw,22px);line-height:1.2;letter-spacing:-.022em}
p{margin:0}
.lede{font-size:clamp(17px,1.5vw,21px);line-height:1.5;color:var(--graphite);letter-spacing:-.012em}

.eyebrow{display:inline-flex;align-items:center;gap:12px;font-size:11.5px;font-weight:600;
  letter-spacing:.16em;text-transform:uppercase;color:var(--graphite)}
.slash{display:inline-flex;gap:3px;flex:0 0 auto}
.slash i{display:block;width:3px;height:13px;transform:skewX(-14deg);background:#fff;
  box-shadow:0 0 0 .5px rgba(18,22,27,.10)}
.slash i:last-child{background:var(--red);box-shadow:none}
.slash--light i{box-shadow:none}

mark{background:linear-gradient(var(--yellow),var(--yellow)) no-repeat;background-size:0% 100%;
  color:inherit;padding:.04em .14em;margin:0 -.06em;
  -webkit-box-decoration-break:clone;box-decoration-break:clone;
  transition:background-size 1s var(--ease) .1s}
.in mark,.typed mark{background-size:100% 100%}

.rv{opacity:0;transform:translate3d(0,22px,0);transition:opacity .85s var(--ease),transform .95s var(--ease);transition-delay:var(--d,0s)}
.rv.in{opacity:1;transform:none}

/* ================= glass ================= */
.glass{
  background:var(--glass-bg);
  border:1px solid var(--glass-br);
  border-radius:var(--r);
  -webkit-backdrop-filter:blur(24px) saturate(1.6);backdrop-filter:blur(24px) saturate(1.6);
  box-shadow:var(--glass-sh),inset 0 1px 0 rgba(255,255,255,.65);
}
.glass--dark{
  background:rgba(24,28,34,.52);border-color:rgba(255,255,255,.16);
  box-shadow:0 26px 60px -32px rgba(10,14,20,.6),inset 0 1px 0 rgba(255,255,255,.14);color:#fff;
}
.glass--yellow{
  background:linear-gradient(150deg,rgba(255,237,0,.86),rgba(240,222,0,.62));
  border-color:rgba(255,255,255,.62);color:var(--ink);
  box-shadow:0 30px 70px -34px rgba(150,110,0,.5),inset 0 1px 0 rgba(255,255,255,.7);
}

/* ================= nav ================= */
.nav{position:fixed;top:14px;left:0;right:0;z-index:60;padding-inline:var(--pad);pointer-events:none}
.nav__in{pointer-events:auto;max-width:var(--maxw);margin:0 auto;display:flex;align-items:center;
  justify-content:space-between;gap:18px;padding:9px 10px 9px 20px;border-radius:999px;
  background:rgba(22,26,32,.44);border:1px solid rgba(255,255,255,.16);
  -webkit-backdrop-filter:blur(22px) saturate(1.6);backdrop-filter:blur(22px) saturate(1.6);
  box-shadow:0 16px 44px -22px rgba(10,14,20,.55);
  transition:background .4s ease,box-shadow .4s ease}
.nav--stuck .nav__in{background:rgba(22,26,32,.62);box-shadow:0 18px 50px -24px rgba(10,14,20,.6)}
.nav__brand{display:flex;align-items:center;gap:12px;flex:0 0 auto}
.nav__brand .slash i{height:17px;width:3.5px}
.nav__brand .lbl{font-family:var(--display);font-weight:600;font-size:15px;letter-spacing:-.02em;color:#fff;white-space:nowrap}
.nav__links{display:flex;align-items:center;gap:2px}
.nav__links a{font-size:13.5px;font-weight:500;color:rgba(255,255,255,.8);padding:8px 13px;border-radius:999px;
  white-space:nowrap;transition:color .25s,background .25s}
.nav__links a:hover{color:#fff;background:rgba(255,255,255,.14)}
.nav__cta{flex:0 0 auto;display:inline-flex;align-items:center;gap:9px;font-size:13.5px;font-weight:600;color:#fff;
  padding:10px 18px;border-radius:999px;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.22);
  transition:background .25s,transform .25s var(--ease)}
.nav__cta:hover{background:rgba(255,255,255,.28);transform:translateY(-1px)}
@media (max-width:900px){.nav__links{display:none}}

/* ================= hero ================= */
.hero{position:relative;min-height:min(100svh,960px);display:flex;align-items:flex-end;overflow:hidden;background:#1A1F26}
.hero__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:64% 50%;z-index:0}
.hero__veil{position:absolute;inset:0;z-index:1;background:
  linear-gradient(180deg,rgba(10,13,17,.66) 0%,rgba(10,13,17,.16) 30%,rgba(10,13,17,.10) 52%,rgba(10,13,17,.58) 92%),
  linear-gradient(90deg,rgba(10,13,17,.74) 0%,rgba(10,13,17,.30) 48%,rgba(10,13,17,0) 74%)}
.hero__body{position:relative;z-index:2;width:100%;padding-top:200px;padding-bottom:clamp(40px,6vw,76px)}
.hero h1{color:#fff;max-width:17ch;letter-spacing:-.014em;line-height:1.01}
.hero__line{margin-top:22px;font-family:var(--display);font-weight:500;font-size:clamp(19px,2.4vw,34px);
  line-height:1.15;letter-spacing:-.004em;color:rgba(255,255,255,.74)}
.hero__row{margin-top:clamp(28px,3.4vw,44px);display:flex;flex-wrap:wrap;align-items:center;gap:22px 32px}
.hero__row p{color:rgba(255,255,255,.8);font-size:clamp(15px,1.2vw,17.5px);max-width:40ch;line-height:1.45}
.gbtn{display:inline-flex;align-items:center;gap:14px;padding:12px 14px 12px 24px;border-radius:999px;color:#fff;
  font-weight:600;font-size:15px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.24);
  -webkit-backdrop-filter:blur(18px) saturate(1.5);backdrop-filter:blur(18px) saturate(1.5);
  transition:background .3s,transform .3s var(--ease)}
.gbtn:hover{background:rgba(255,255,255,.24);transform:translateY(-2px)}
.gbtn .arw{display:grid;place-items:center;width:30px;height:30px;border-radius:999px;background:#fff;color:var(--ink)}
.gbtn svg{width:15px;height:15px}
.hero__cue{position:absolute;right:var(--pad);bottom:22px;z-index:2;
  font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,.5);
  display:flex;flex-direction:column;align-items:center;gap:8px}
.hero__cue i{display:block;width:1px;height:34px;background:linear-gradient(rgba(255,255,255,.5),transparent);
  animation:cue 2.6s var(--ease) infinite}
@keyframes cue{0%{transform:scaleY(.2);transform-origin:top;opacity:0}
  40%{transform:scaleY(1);opacity:1}100%{transform:scaleY(1);transform-origin:bottom;opacity:0}}
@media (max-width:860px){.hero__body{padding-top:150px}.hero__cue{display:none}}

/* ================= section heads ================= */
.head{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(22px,4vw,68px);align-items:end}
.head .lede{padding-bottom:8px}
.head h2{margin-top:14px}
@media (max-width:900px){.head{grid-template-columns:1fr;align-items:start}}

/* ================= arbeiten ================= */
.work{display:grid;grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr);gap:clamp(24px,3.4vw,56px);align-items:stretch}
.work__shot{position:relative;border-radius:calc(var(--r) + 6px);overflow:hidden;
  box-shadow:0 40px 80px -44px rgba(18,26,38,.55);background:#DDE1E6}
.work__shot img{width:100%;height:100%;object-fit:cover;aspect-ratio:3/4}
.work__tag{position:absolute;left:14px;bottom:14px;right:14px;display:flex;justify-content:space-between;
  align-items:center;gap:14px;padding:12px 16px;border-radius:14px}
.work__tag b{font-family:var(--display);font-size:13px;font-weight:600}
.work__tag span{font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.66)}
.work__body{display:flex;flex-direction:column;justify-content:center;gap:clamp(18px,2vw,26px);
  padding:clamp(26px,3vw,48px)}
.work__body h2 .u{position:relative;white-space:nowrap}
.work__body h2 .u::after{content:"";position:absolute;left:0;right:0;bottom:.06em;height:.14em;background:var(--yellow);
  z-index:-1;transform:scaleX(0);transform-origin:left;transition:transform .9s var(--ease) .25s}
.work__body.in h2 .u::after,.in .work__body h2 .u::after{transform:scaleX(1)}
.work__quote{font-family:var(--display);font-weight:600;font-size:clamp(19px,1.9vw,27px);line-height:1.2;
  letter-spacing:-.026em}
.work__facts{display:flex;flex-wrap:wrap;gap:10px;margin-top:4px}
.work__facts span{font-size:12.5px;padding:9px 14px;border-radius:999px;background:rgba(255,255,255,.6);
  border:1px solid rgba(255,255,255,.8);color:var(--ink-soft)}
@media (max-width:900px){.work{grid-template-columns:1fr}.work__shot img{aspect-ratio:4/5}}

/* ================= chat interview ================= */
.chat{max-width:900px;margin:clamp(34px,4vw,60px) auto 0}
.chat__head{display:flex;align-items:center;gap:14px;padding:14px 18px;border-radius:18px;margin-bottom:22px}
.chat__ava{width:42px;height:42px;border-radius:999px;background:var(--ink);display:grid;place-items:center;
  color:#fff;font-family:var(--display);font-weight:600;font-size:14px;letter-spacing:-.02em;flex:0 0 auto;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.2)}
.chat__who b{display:block;font-family:var(--display);font-size:15px;font-weight:600;letter-spacing:-.02em}
.chat__who span{display:block;font-size:11.5px;color:var(--graphite);letter-spacing:.02em}
.chat__meta{margin-left:auto;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--graphite-2)}
.thread{display:flex;flex-direction:column;gap:14px}
.msg{max-width:86%;padding:18px 22px;border-radius:20px;position:relative;opacity:0;
  transition:opacity 1.3s ease,transform 1.4s cubic-bezier(.16,1,.3,1)}
.msg--q{transform:translate(-16px,10px)}
.msg--a{transform:translate(16px,10px)}
.msg.shown{opacity:1;transform:translate(0,0)}
.msg--q{align-self:flex-start;border-bottom-left-radius:7px;background:rgba(255,255,255,.42);
  border:1px solid rgba(255,255,255,.66);max-width:min(78%,620px)}
.msg--a{align-self:flex-end;border-bottom-right-radius:7px;background:rgba(255,255,255,.66);
  border:1px solid rgba(255,255,255,.85)}
.msg--q,.msg--a{-webkit-backdrop-filter:blur(20px) saturate(1.5);backdrop-filter:blur(20px) saturate(1.5);
  box-shadow:0 18px 44px -30px rgba(18,26,38,.35)}
.msg__from{font-size:10.5px;font-weight:600;letter-spacing:.15em;text-transform:uppercase;margin-bottom:9px;
  display:flex;align-items:center;gap:8px}
.msg--q .msg__from{color:var(--red)}
.msg--a .msg__from{color:var(--graphite-2)}
.msg__txt{font-size:clamp(15.5px,1.25vw,18px);line-height:1.55;letter-spacing:-.01em;color:var(--ink-soft)}
.msg--a .msg__txt{color:var(--ink)}
.msg__txt p + p{margin-top:.8em}
.msg .w{opacity:0}
.msg.typed .w{opacity:1;transition:opacity 1.3s ease}
.chat__end{margin-top:22px;display:flex;justify-content:flex-end}
.chat__end .who{font-size:12px;color:var(--graphite);text-align:right}
.chat__end .who b{display:block;font-family:var(--display);font-size:14.5px;font-weight:600;color:var(--ink);letter-spacing:-.01em}
@media (max-width:700px){.msg{max-width:96%}.msg--q{max-width:94%}}

/* ================= tiles ================= */
.cards{margin-top:clamp(36px,4.5vw,64px);display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.card{padding:clamp(22px,2.2vw,30px);display:flex;flex-direction:column;gap:13px;min-height:216px;
  transition:transform .55s var(--ease),box-shadow .55s var(--ease)}
.card:hover{transform:translateY(-3px);box-shadow:0 34px 70px -38px rgba(18,26,38,.42),inset 0 1px 0 rgba(255,255,255,.7)}
.card .ico{width:36px;height:36px;color:var(--ink)}
.card .ico svg{width:36px;height:36px}
.card p{font-size:14.5px;line-height:1.5;color:var(--graphite)}
.card .tag{margin-top:auto;font-size:10.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--graphite-2)}
.card--link{position:relative}
.card--link .tag{color:rgba(18,22,27,.62)}
.card--link p{color:#34320A}
.card--link .go{margin-top:auto;display:inline-flex;align-items:center;gap:8px;font-size:12.5px;font-weight:600;
  color:var(--ink)}
.card--link .go svg{width:14px;height:14px}
.card--link:hover .go svg{transform:translateX(3px)}
.card--link .go svg{transition:transform .3s var(--ease)}
@media (max-width:1000px){.cards{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.cards{grid-template-columns:1fr}}

/* ================= phasen ================= */
.tl{margin-top:clamp(50px,6vw,86px);position:relative}
.tl__rail{position:absolute;left:0;top:40px;height:1px;background:rgba(18,22,27,.16)}
.tl__fill{position:absolute;left:0;top:0;height:100%;width:0;background:var(--red);transition:width .2s linear}
.tl__items{position:relative;display:grid;grid-template-columns:repeat(5,1fr);gap:20px}
.ph{position:relative;padding-right:18px}
.ph__disc{position:relative;width:80px;height:80px;display:grid;place-items:center;border-radius:50%;
  color:var(--graphite-2);
  background:rgba(255,255,255,.5);border:1px solid rgba(255,255,255,.8);
  -webkit-backdrop-filter:blur(18px) saturate(1.5);backdrop-filter:blur(18px) saturate(1.5);
  box-shadow:0 18px 40px -28px rgba(18,26,38,.4),inset 0 1px 0 rgba(255,255,255,.7);
  transition:color .6s var(--ease),transform .6s var(--ease),box-shadow .6s var(--ease)}
.ph__disc svg.ico{width:34px;height:34px}
.ph__ring{position:absolute;inset:-1px;transform:rotate(-90deg)}
.ph__ring circle{fill:none;stroke:var(--red);stroke-width:1.4;stroke-dasharray:246;stroke-dashoffset:246;
  transition:stroke-dashoffset 1.15s var(--ease)}
.ph.on .ph__disc{color:var(--ink);transform:translateY(-3px);box-shadow:0 26px 50px -28px rgba(18,26,38,.5),inset 0 1px 0 rgba(255,255,255,.8)}
.ph.on .ph__ring circle{stroke-dashoffset:0}
.ico path,.ico circle,.ico line,.ico polyline,.ico rect{stroke-dasharray:var(--len,130);stroke-dashoffset:var(--len,130);
  transition:stroke-dashoffset 1s var(--ease) .16s}
.ph.on .ico path,.ph.on .ico circle,.ph.on .ico line,.ph.on .ico polyline,.ph.on .ico rect{stroke-dashoffset:0}
.ph__month{margin-top:22px;font-size:11px;font-weight:600;letter-spacing:.15em;text-transform:uppercase;color:var(--red)}
.ph__t{margin-top:8px;font-family:var(--display);font-weight:600;font-size:clamp(17px,1.35vw,20px);letter-spacing:-.024em;line-height:1.15}
.ph__x{margin-top:9px;font-size:14px;line-height:1.48;color:var(--graphite);max-width:26ch}
@media (max-width:1000px){
  .tl__items{grid-template-columns:1fr;gap:32px}
  .tl__rail{top:0;bottom:0;width:1px;height:auto}
  .tl__fill{width:100%;height:0;transition:height .2s linear}
  .ph{padding-left:112px;padding-right:0;min-height:98px}
  .ph__disc{position:absolute;left:0;top:0}
  .ph__month{margin-top:2px}.ph__x{max-width:46ch}
}

/* ================= karte ================= */
.maplayout{margin-top:clamp(32px,4vw,56px);display:grid;grid-template-columns:minmax(0,1.65fr) minmax(272px,.9fr);
  gap:clamp(24px,3.2vw,52px);align-items:start}
.stage{position:relative;aspect-ratio:363/341;width:100%}
.stage svg.map{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.map .mesh{fill:none;stroke:rgba(30,40,54,.20);stroke-width:.2}
.map .bez{fill:none;stroke:rgba(30,40,54,.34);stroke-width:.32}
.map .edge{fill:none;stroke:var(--ink);stroke-width:.6;stroke-linejoin:round;
  stroke-dasharray:1900;stroke-dashoffset:1900;transition:stroke-dashoffset 2.8s var(--ease) .1s}
.stage.live .edge{stroke-dashoffset:0}
.map .city{fill:rgba(30,40,54,.42)}
.map .clabel{font-family:var(--text);font-size:5.2px;font-weight:500;fill:rgba(30,40,54,.5);letter-spacing:.02em}
.map .layer{opacity:0;transition:opacity 1.5s ease .45s}
.stage.live .layer{opacity:1}

.mk{position:absolute;left:var(--x);top:var(--y);width:14px;height:14px;transform:translate(-50%,-50%);z-index:3}
.mk__dot{position:absolute;inset:4.5px;border-radius:50%;background:var(--red);
  box-shadow:0 0 0 3px rgba(255,255,255,.85);transform:scale(0);transition:transform .7s var(--ease) var(--d)}
.stage.live .mk__dot{transform:scale(1)}
.mk__ping{position:absolute;inset:0;border-radius:50%;border:1px solid rgba(207,0,38,.65);opacity:0}
.stage.live .mk__ping{animation:ping 6s cubic-bezier(.22,.7,.3,1) infinite;animation-delay:var(--d)}
@keyframes ping{0%{transform:scale(.7);opacity:.5}70%{opacity:0}100%{transform:scale(3.1);opacity:0}}
.mk__chip{position:absolute;bottom:calc(100% + 13px);left:50%;
  transform:translate(calc(-50% + var(--cx,0px)),8px);display:flex;align-items:center;gap:9px;
  padding:6px 12px;border-radius:10px;white-space:nowrap;width:max-content;max-width:none;
  background:#fff;border:1px solid rgba(18,22,27,.10);
  box-shadow:0 10px 22px -14px rgba(18,26,38,.4);opacity:0;pointer-events:none;
  transition:opacity .8s var(--ease),transform .8s var(--ease),box-shadow .35s ease}
.stage.live .mk__chip{opacity:1;transform:translate(calc(-50% + var(--cx,0px)),0);transition-delay:calc(var(--d) + .6s)}
.mk__chip img{height:15px;width:auto;max-width:none;flex:0 0 auto;opacity:.95}
.mk__chip b{font-family:var(--display);font-size:11.5px;font-weight:600;letter-spacing:-.005em;
  color:var(--ink);flex:0 0 auto;line-height:1.1}
.mk__chip::after{content:"";position:absolute;top:100%;left:calc(50% - var(--cx,0px));width:1px;height:13px;
  background:rgba(18,22,27,.28);transform:translateX(-50%)}
.mk[aria-current="true"] .mk__chip{border-color:rgba(18,22,27,.55);box-shadow:0 14px 28px -14px rgba(18,26,38,.5)}
.mk__num{display:none;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-size:9.5px;font-weight:700;color:#fff}

.inv{display:flex;flex-direction:column;gap:12px}
.inv__item{width:100%;text-align:left;padding:20px 22px;
  transition:box-shadow .5s var(--ease),transform .5s var(--ease),border-color .4s}
.inv__item:hover,.inv__item[aria-current="true"]{transform:translateY(-2px);border-color:rgba(18,22,27,.4);
  box-shadow:0 30px 60px -34px rgba(18,26,38,.45),inset 0 1px 0 rgba(255,255,255,.7)}
.inv__top{display:flex;align-items:center;justify-content:space-between;gap:16px}
.inv__logo{height:22px;width:auto;flex:0 0 auto}
.inv__where{font-size:10.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--graphite-2);text-align:right}
.inv__what{margin-top:14px;font-family:var(--display);font-weight:600;font-size:17px;letter-spacing:-.022em}
.inv__facts{margin-top:12px;display:flex;flex-wrap:wrap;gap:6px}
.inv__facts span{font-size:11.5px;line-height:1;padding:7px 10px;border-radius:8px;background:rgba(255,255,255,.55);
  border:1px solid rgba(255,255,255,.8);color:var(--ink-soft)}
.inv__facts span.hl{background:var(--yellow);border-color:rgba(255,255,255,.6);font-weight:600;color:var(--ink)}
.inv__more{display:flex;align-items:center;gap:10px;padding:15px 22px;border-radius:16px;font-size:12.5px;
  color:var(--graphite-2);border:1px dashed rgba(18,22,27,.18)}
.inv__note{font-size:11px;line-height:1.45;color:var(--graphite-2)}
@media (max-width:1000px){
  .maplayout{grid-template-columns:1fr}
  .mk__chip{display:none}
  .mk{width:21px;height:21px}.mk__dot{inset:0}.mk__num{display:block}
}

/* ================= kinderland panel ================= */
.klpanel{display:block;padding:clamp(28px,3.4vw,52px);transition:transform .55s var(--ease),box-shadow .55s var(--ease)}
.klpanel:hover{transform:translateY(-3px);box-shadow:0 40px 84px -36px rgba(150,110,0,.55),inset 0 1px 0 rgba(255,255,255,.8)}
.klpanel__top{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.9fr);gap:clamp(22px,3vw,54px);align-items:end}
.klpanel h2{font-size:clamp(34px,5.2vw,70px);line-height:.98}
.klpanel .eyebrow{color:rgba(18,22,27,.6)}
.klpanel__txt{font-size:clamp(15.5px,1.3vw,18px);line-height:1.5;color:#34320A;max-width:46ch}
.klpanel__nums{margin-top:clamp(28px,3.4vw,46px);display:grid;grid-template-columns:repeat(4,1fr);
  border-top:1px solid rgba(18,22,27,.2)}
.klnum{padding:22px 20px 0;border-left:1px solid rgba(18,22,27,.2)}
.klnum:first-child{border-left:0;padding-left:0}
.klnum .num{display:block;font-size:clamp(22px,2.7vw,38px);line-height:1;letter-spacing:-.034em}
.klnum .cap{display:block;margin-top:9px;font-size:11.5px;line-height:1.4;color:#34320A;max-width:20ch}
.klpanel__go{margin-top:clamp(24px,3vw,40px);display:inline-flex;align-items:center;gap:12px;font-family:var(--display);
  font-weight:600;font-size:15px;padding:12px 14px 12px 22px;border-radius:999px;background:rgba(18,22,27,.9);color:#fff}
.klpanel__go .arw{display:grid;place-items:center;width:26px;height:26px;border-radius:999px;background:#fff;color:var(--ink)}
.klpanel__go svg{width:14px;height:14px}
.klpanel:hover .klpanel__go .arw{transform:translateX(3px)}
.klpanel__go .arw{transition:transform .3s var(--ease)}
@media (max-width:900px){.klpanel__top{grid-template-columns:1fr}
  .klpanel__nums{grid-template-columns:repeat(2,1fr)}
  .klnum{border-left:0;border-top:1px solid rgba(18,22,27,.16);padding-left:0;padding-right:14px}
  .klnum:first-child,.klnum:nth-child(2){border-top:0}}
@media (max-width:520px){.klpanel__nums{grid-template-columns:1fr}.klnum:nth-child(2){border-top:1px solid rgba(18,22,27,.16)}}

/* ================= footer ================= */
.foot{background:#23272C;color:rgba(255,255,255,.62);padding-block:clamp(52px,6vw,84px) 32px;margin-top:clamp(40px,5vw,80px)}
.foot__in{display:grid;grid-template-columns:auto 1fr;gap:clamp(24px,3vw,48px);align-items:center;
  padding-bottom:clamp(26px,3vw,40px);border-bottom:1px solid rgba(255,255,255,.14)}
.foot__sig img{height:clamp(58px,6vw,86px);width:auto}
.foot__nav{display:flex;flex-wrap:wrap;gap:10px 28px;font-size:14px;justify-content:flex-end}
.foot__nav a{color:rgba(255,255,255,.72)}
.foot__nav a:hover{color:#fff}
.foot__bot{margin-top:22px;display:flex;flex-wrap:wrap;gap:12px 28px;justify-content:space-between;
  font-size:11px;line-height:1.5;color:rgba(255,255,255,.45)}
.foot__bot span{max-width:64ch}
.foot__bot a{color:rgba(255,255,255,.72)}
.foot__bot a:hover{color:#fff}
@media (max-width:760px){.foot__in{grid-template-columns:1fr}.foot__nav{justify-content:flex-start}}


/* ---------- Standort: Kartenseite, Kacheln ---------- */
.mapside{display:flex;flex-direction:column;gap:14px}
.mapside__lead .mapside__k{display:block;font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  color:var(--graphite-2);margin-bottom:10px}
.mapside__lead p{font-size:15px;line-height:1.5;color:var(--graphite);max-width:34ch}
.mapfocus{padding:22px 24px;display:flex;flex-direction:column;gap:11px;min-height:186px;
  transition:box-shadow .4s ease}
.mapfocus__logo{height:26px;display:flex;align-items:center}
.mapfocus__logo img{height:100%;width:auto;max-width:170px;object-fit:contain}
.mapfocus__logo .txt{font-family:var(--display);font-weight:600;font-size:17px;letter-spacing:-.02em}
.mapfocus__place{font-size:10.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--red)}
.mapfocus__sum{font-family:var(--display);font-weight:600;font-size:clamp(21px,2.1vw,28px);
  letter-spacing:-.03em;line-height:1;font-variant-numeric:tabular-nums}
.mapfocus__txt{font-size:13.5px;line-height:1.48;color:var(--graphite);margin-top:auto}
.mapstat{padding:18px 22px;border-radius:18px;background:rgba(255,255,255,.42);
  border:1px solid rgba(255,255,255,.7);
  -webkit-backdrop-filter:blur(16px) saturate(1.4);backdrop-filter:blur(16px) saturate(1.4)}
.mapstat .num{display:block;font-family:var(--display);font-weight:600;font-size:clamp(18px,1.8vw,24px);
  letter-spacing:-.03em;line-height:1;font-variant-numeric:tabular-nums}
.mapstat .cap{display:block;margin-top:9px;font-size:11.5px;line-height:1.42;color:var(--graphite)}
.mapside{position:sticky;top:104px}
@media (max-width:1000px){.mapside{position:static}.mapfocus{min-height:0}}

.invgrid{margin-top:clamp(26px,3vw,44px);display:grid;grid-template-columns:repeat(auto-fill,minmax(232px,1fr));gap:14px}
.invtile{text-align:left;width:100%;padding:20px;border-radius:20px;background:rgba(255,255,255,.55);
  border:1px solid rgba(255,255,255,.8);
  -webkit-backdrop-filter:blur(20px) saturate(1.5);backdrop-filter:blur(20px) saturate(1.5);
  box-shadow:0 20px 46px -32px rgba(18,26,38,.3),inset 0 1px 0 rgba(255,255,255,.6);
  display:flex;flex-direction:column;gap:12px;
  transition:transform .45s var(--ease),box-shadow .45s var(--ease),border-color .35s}
.invtile:hover,.invtile[aria-current="true"]{transform:translateY(-3px);border-color:rgba(18,22,27,.35);
  box-shadow:0 30px 60px -32px rgba(18,26,38,.42),inset 0 1px 0 rgba(255,255,255,.7)}
.invtile__logo{height:24px;display:flex;align-items:center}
.invtile__logo img{height:100%;width:auto;max-width:150px;object-fit:contain}
.invtile__logo .txt{font-family:var(--display);font-weight:600;font-size:16px;letter-spacing:-.02em}
.invtile__sum{font-family:var(--display);font-weight:600;font-size:clamp(18px,1.7vw,22px);letter-spacing:-.028em;
  line-height:1.05;font-variant-numeric:tabular-nums}
.invtile__place{font-size:10.5px;font-weight:600;letter-spacing:.13em;text-transform:uppercase;color:var(--red)}
.invtile__txt{font-size:13.5px;line-height:1.45;color:var(--graphite);margin-top:auto}

/* ---------- Land investiert ---------- */
.landtop{margin-top:clamp(30px,3.6vw,50px);display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(0,.95fr) minmax(0,1.1fr);gap:16px}
.landcard{padding:clamp(22px,2.4vw,34px);display:flex;flex-direction:column;justify-content:center}
.landcard__num{display:block;font-family:var(--display);font-weight:700;letter-spacing:-.038em;line-height:.98;
  font-size:clamp(30px,3.6vw,50px);font-variant-numeric:tabular-nums}
.landcard--big .landcard__num{font-size:clamp(36px,4.6vw,66px)}
.landcard__cap{display:block;margin-top:12px;font-size:13.5px;line-height:1.45;color:var(--graphite);max-width:26ch}
.landclaim{font-family:var(--display);font-weight:600;font-size:clamp(18px,1.9vw,25px);line-height:1.18;
  letter-spacing:-.026em;color:var(--ink)}
@media (max-width:1000px){.landtop{grid-template-columns:1fr 1fr}
  .landcard--big{grid-column:1/-1}}
@media (max-width:620px){.landtop{grid-template-columns:1fr}}

/* ---------- Bereichsleiste mit App-Symbolen ---------- */
.fields{margin-top:clamp(34px,4vw,58px)}
.fields__head{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 22px;
  padding-bottom:16px;border-bottom:1px solid rgba(18,22,27,.12)}
.fields__k{font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--graphite-2)}
.fields__head p{font-size:14px;line-height:1.45;color:var(--graphite);max-width:52ch}
.fieldstrip{margin-top:16px;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px}
.field{position:relative;text-align:left;display:flex;flex-direction:column;gap:12px;padding:18px 16px 16px;
  border-radius:18px;background:rgba(255,255,255,.55);border:1px solid rgba(255,255,255,.8);
  -webkit-backdrop-filter:blur(20px) saturate(1.5);backdrop-filter:blur(20px) saturate(1.5);
  box-shadow:0 18px 40px -30px rgba(18,26,38,.3),inset 0 1px 0 rgba(255,255,255,.6);
  transition:transform .45s var(--ease),box-shadow .45s var(--ease),border-color .35s}
.field:hover{transform:translateY(-3px);border-color:rgba(18,22,27,.28);
  box-shadow:0 28px 54px -30px rgba(18,26,38,.4),inset 0 1px 0 rgba(255,255,255,.7)}
.appico{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;flex:0 0 auto;
  background:rgba(18,22,27,.92);color:#fff;
  box-shadow:0 8px 18px -10px rgba(18,26,38,.6),inset 0 1px 0 rgba(255,255,255,.18)}
.appico svg{width:21px;height:21px;stroke-width:1.7}
.field__t{font-family:var(--display);font-weight:600;font-size:15px;letter-spacing:-.02em;line-height:1.15}
.field__v{font-family:var(--display);font-weight:600;font-size:15.5px;letter-spacing:-.024em;
  font-variant-numeric:tabular-nums;color:var(--ink)}
.field__x{font-size:12.5px;line-height:1.4;color:var(--graphite);margin-top:auto}
.field--yellow{background:linear-gradient(150deg,rgba(255,237,0,.86),rgba(240,222,0,.62));
  border-color:rgba(255,255,255,.6)}
.field--yellow .field__x{color:#34320A}
.field--yellow .appico{background:var(--ink)}
.field--yellow .field__go{margin-top:8px;display:inline-flex;align-items:center;gap:7px;font-size:11.5px;
  font-weight:600;color:var(--ink)}
.field--yellow .field__go svg{width:13px;height:13px;transition:transform .3s var(--ease)}
.field--yellow:hover .field__go svg{transform:translateX(3px)}
@media (max-width:1180px){.fieldstrip{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:640px){.fieldstrip{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* ---------- Hebel 1 : 17 ---------- */
.lever{padding:clamp(26px,3.4vw,56px);display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);
  gap:clamp(26px,4vw,64px);align-items:center}
.lever h2{margin-top:14px}
.lever__txt{margin-top:18px;font-size:15.5px;line-height:1.5;color:var(--graphite);max-width:44ch}
.lever__viz{display:flex;flex-direction:column;gap:18px}
.lrow{display:grid;grid-template-columns:82px minmax(0,1fr) minmax(64px,auto);gap:16px;align-items:center}
.lrow__k{font-size:10.5px;font-weight:600;letter-spacing:.13em;text-transform:uppercase;color:var(--graphite-2)}
.lrow__track{height:14px;border-radius:99px;background:rgba(18,22,27,.09);overflow:hidden}
.lrow__bar{height:100%;border-radius:99px;width:0;transition:width 1.5s var(--ease) .1s}
.lrow--one .lrow__bar{background:rgba(18,22,27,.45)}
.lrow--many .lrow__bar{background:linear-gradient(90deg,var(--yellow),var(--red))}
.lrow__v{font-family:var(--display);font-weight:700;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.lrow--one .lrow__v{font-size:clamp(20px,2vw,26px)}
.lrow--many .lrow__v{font-size:clamp(34px,4.6vw,60px);line-height:1}
.lever.on .lrow__bar{width:var(--w)}
.lever__facts{margin-top:6px;display:grid;grid-template-columns:repeat(3,1fr);gap:0;
  border-top:1px solid rgba(18,22,27,.12)}
.lever__facts > div{padding:18px 16px 0;border-left:1px solid rgba(18,22,27,.12)}
.lever__facts > div:first-child{border-left:0;padding-left:0}
.lever__facts .num{display:block;font-family:var(--display);font-weight:600;font-size:clamp(16px,1.6vw,21px);
  letter-spacing:-.028em;line-height:1;font-variant-numeric:tabular-nums}
.lever__facts .cap{display:block;margin-top:8px;font-size:11px;line-height:1.4;color:var(--graphite)}
@media (max-width:960px){.lever{grid-template-columns:1fr}
  .lever__facts{grid-template-columns:1fr}
  .lever__facts > div{border-left:0;border-top:1px solid rgba(18,22,27,.12);padding-left:0;padding-bottom:16px}
  .lever__facts > div:first-child{border-top:0}}

/* ---------- Marker: nur der aktive zeigt sein Logo ---------- */
.mk__chip{opacity:0 !important;transform:translate(calc(-50% + var(--cx,0px)),6px) !important;
  transition:opacity .5s var(--ease),transform .5s var(--ease) !important}
.mk[aria-current="true"] .mk__chip{opacity:1 !important;transform:translate(calc(-50% + var(--cx,0px)),0) !important}
.mk__dot{transition:transform .5s var(--ease) var(--d),box-shadow .35s ease}
.mk[aria-current="true"] .mk__dot{box-shadow:0 0 0 4px rgba(255,255,255,.95),0 6px 16px -6px rgba(207,0,38,.7)}
.mk[aria-current="true"]{z-index:6}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important}
  .rv{opacity:1;transform:none}
  mark{background-size:100% 100%}
  .msg{opacity:1;transform:none}.msg .w{opacity:1}
  .stage .edge{stroke-dashoffset:0}.stage .layer{opacity:1}
  .mk__chip{opacity:1;transform:translate(calc(-50% + var(--cx,0px)),0)}.mk__dot{transform:scale(1)}
  .ico path,.ico circle,.ico line,.ico polyline,.ico rect{stroke-dashoffset:0}
  .work__body h2 .u::after{transform:scaleX(1)}
}