/* Hausblick Immobilien – Demo-Website (fiktives Unternehmen)
   Farbwelt: Nachtblau × Champagner · Schriften: Fraunces (Display), Inter (UI), Fragment Mono (Etiketten)
   Innenmasse in rem (zoomstabil), Grid-Spalten mit minmax(0,1fr). */

@font-face{font-family:'Fraunces';font-style:normal;font-weight:300 500;font-display:swap;
  src:url('../solaris/schrift/6NU78FyLNQOQZAnv9bYEvDiIdE9Ea92uemAk_WBq8U_9v0c2Wa0KxC9TeA.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:'Inter';font-style:normal;font-weight:400 700;font-display:swap;
  src:url('../solaris/schrift/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa1ZL7.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:'Fragment Mono';font-style:normal;font-weight:400;font-display:swap;
  src:url('../obsidian/schrift/4iCr6K5wfMRRjxp0DA6-2CLnB4NHhg.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{
  --n950:#060D1D; --n900:#0A1530; --n850:#0E1C3B; --n800:#132447; --n700:#1C305C; --n600:#2A4476; --n400:#6B80AD;
  --c50:#FCF9F3; --c100:#F6F0E4; --c150:#F1E8D7; --c200:#EADCC2; --c300:#DFC9A0; --c400:#CDB07D; --c500:#B4955F; --c600:#7E6233; --c700:#6B5129;
  --ink:#0A1530; --ink2:#46526B; --ink3:#5F6A80;
  --txt-d:#F6F0E4; --mute-d:#A9B4CB;
  --ok:#2C7656; --ok-d:#8AD3B0; --err:#A8322D; --neg:#A94C30;
  --line-l:rgba(10,21,48,.11); --line-l2:rgba(10,21,48,.2); --line-d:rgba(223,201,160,.16); --line-d2:rgba(223,201,160,.3);
  --f-d:'Fraunces','Iowan Old Style','Palatino Linotype',Georgia,serif;
  --f-u:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;
  --f-m:'Fragment Mono',ui-monospace,'Cascadia Mono',Consolas,monospace;
  --ease:cubic-bezier(.2,.7,.2,1);
  --hdr:4.5rem; --g:1.25rem;
}
@media (min-width:48rem){:root{--g:2.5rem}}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;overflow-x:clip;background:var(--n950)}
body{margin:0;min-width:20rem;overflow-x:clip;background:var(--n950);color:var(--txt-d);font:400 1rem/1.55 var(--f-u);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
html:not(.ready) body{opacity:0;animation:fbShow 0s 2.5s forwards}
@keyframes fbShow{to{opacity:1}}
html.ready body{opacity:1;transition:opacity .4s ease}
svg{display:block}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer;background:none;border:0;padding:0;-webkit-tap-highlight-color:transparent}
a{color:inherit}
h1,h2,h3,p,ul,ol{margin:0}
ul,ol{padding:0;list-style:none}
::selection{background:rgba(223,201,160,.38);color:inherit}
:focus-visible{outline:2px solid var(--c300);outline-offset:3px}
.on-light :focus-visible,.funnel :focus-visible{outline-color:var(--n600)}
.sprite{position:absolute;width:0;height:0;overflow:hidden}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
.ic{width:1.25rem;height:1.25rem;flex:none;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.wrap{width:min(75rem,calc(100% - 2*var(--g)));margin-inline:auto}
.skip{position:fixed;left:1rem;top:-5rem;z-index:100;background:var(--c300);color:var(--n950);padding:.75rem 1rem;border-radius:.5rem;font-weight:600;text-decoration:none;transition:top .2s}
.skip:not(:focus){opacity:0;pointer-events:none}
.skip:focus{top:1rem}

/* Bewegung: Host-Pause und statischer Modus */
.paused *,.paused *::before,.paused *::after{animation-play-state:paused!important}
/* Ausserhalb des Sichtfelds: Deko-Animationen von Hero und Board anhalten */
.hero-off .hero *,.hero-off .hero *::before,.hero-off .hero *::after,.board-off .board *,.board-off .board *::before,.board-off .board *::after{animation-play-state:paused!important}
.static *,.static *::before,.static *::after{animation-duration:1ms!important;animation-delay:0s!important;animation-iteration-count:1!important;transition-duration:1ms!important;transition-delay:0s!important}

/* ---------- Buttons & Formelemente ---------- */
.btn{--bh:3rem;display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:var(--bh);padding:0 1.375rem;border-radius:999px;border:1px solid transparent;font:600 .9375rem/1.1 var(--f-u);letter-spacing:.005em;text-decoration:none;cursor:pointer;text-align:center;transition:transform .22s var(--ease),background-color .2s,box-shadow .25s,border-color .2s,color .2s}
.btn .ic{width:1.125rem;height:1.125rem}
.btn .ic-arrow{transition:transform .28s var(--ease)}
.btn:hover .ic-arrow{transform:translateX(.1875rem)}
.btn-champ{background:linear-gradient(180deg,#EBDAB8 0%,#D6BC8C 100%);color:var(--n950);box-shadow:0 .5rem 1.25rem -.5rem rgba(214,188,140,.55),inset 0 1px 0 rgba(255,255,255,.55)}
.btn-champ:hover{transform:translateY(-1px);box-shadow:0 .875rem 1.75rem -.5rem rgba(214,188,140,.7),inset 0 1px 0 rgba(255,255,255,.65)}
.btn-navy{background:var(--n900);color:var(--c50);box-shadow:0 .75rem 1.5rem -.875rem rgba(10,21,48,.7)}
.btn-navy:hover{background:var(--n700);transform:translateY(-1px)}
.btn-ghost{background:rgba(223,201,160,.05);color:var(--c100);border-color:rgba(223,201,160,.34)}
.btn-ghost:hover{border-color:var(--c300);background:rgba(223,201,160,.1)}
.btn-s{--bh:2.5rem;padding:0 1.125rem;font-size:.875rem}
.btn-block{width:100%}
.btn[disabled]{opacity:.38;cursor:not-allowed;transform:none!important;box-shadow:none}
.btn-link{display:inline-flex;align-items:center;gap:.375rem;color:var(--ink2);font:500 .875rem/1.2 var(--f-u);padding:.5rem .25rem;border-radius:.375rem;transition:color .2s}
.btn-link:hover{color:var(--ink)}
.btn-link .ic{width:1rem;height:1rem}
.chip{display:inline-flex;align-items:center;justify-content:center;min-height:2.25rem;padding:0 .875rem;border-radius:999px;border:1px solid var(--line-l2);background:#fff;color:var(--ink);font:500 .8125rem/1 var(--f-u);font-variant-numeric:tabular-nums;transition:border-color .2s,background-color .2s,color .2s,transform .2s var(--ease)}
.chip:hover{border-color:var(--c500);transform:translateY(-1px)}
.chip.is-sel{background:var(--n900);border-color:var(--n900);color:var(--c100)}
.fld{display:flex;flex-direction:column;gap:.375rem;min-width:0}
.fld-l{font:600 .75rem/1.2 var(--f-u);letter-spacing:.02em;color:var(--ink2)}
.fld-l i{font-style:normal;font-weight:400;color:var(--ink3)}
.inp{width:100%;height:2.875rem;padding:0 .875rem;border-radius:.75rem;border:1px solid var(--line-l2);background:#fff;color:var(--ink);font:500 .9375rem/1 var(--f-u);transition:border-color .2s,box-shadow .2s}
.inp::placeholder{color:#6E778A;font-weight:400}
.inp:hover{border-color:rgba(10,21,48,.34)}
.inp:focus{outline:none;border-color:var(--n600);box-shadow:0 0 0 .1875rem rgba(42,68,118,.16)}
.inp.bad{border-color:var(--err);box-shadow:0 0 0 .1875rem rgba(168,50,45,.12)}
.fld-e{font:500 .75rem/1.3 var(--f-u);color:var(--err);min-height:0}
.fld-e:empty{display:none}

/* ---------- Header ---------- */
.hdr{position:fixed;inset:0 0 auto;z-index:50;height:var(--hdr);border-bottom:1px solid transparent;transition:background-color .35s,box-shadow .35s,border-color .35s}
.hdr.solid{background:rgba(6,13,29,.84);-webkit-backdrop-filter:blur(14px) saturate(1.3);backdrop-filter:blur(14px) saturate(1.3);border-bottom-color:rgba(223,201,160,.12);box-shadow:0 .75rem 2rem -1.25rem rgba(0,0,0,.6)}
.hdr-in{height:100%;display:flex;align-items:center;gap:2rem}
.logo{display:inline-flex;align-items:center;gap:.75rem;color:var(--c50);text-decoration:none;flex:none}
.logo-mark{width:2.25rem;height:2.25rem;fill:none;stroke:var(--c300);stroke-width:1.6;stroke-linejoin:round}
.logo-mark .lp{fill:var(--c300);stroke:none}
.logo-word{display:flex;flex-direction:column;gap:.3rem;font:400 1.375rem/1 var(--f-d);letter-spacing:-.01em}
.logo-word small{font:400 .5625rem/1 var(--f-m);letter-spacing:.32em;text-transform:uppercase;color:var(--c300)}
.nav{display:flex;gap:1.75rem;margin-left:auto}
.nav a{position:relative;padding:.5rem 0;color:rgba(246,240,228,.74);text-decoration:none;font-size:.875rem;font-weight:500;transition:color .2s}
.nav a::after{content:"";position:absolute;left:0;right:0;bottom:.25rem;height:1px;background:var(--c300);transform:scaleX(0);transform-origin:left;transition:transform .35s var(--ease)}
.nav a:hover,.nav a.on{color:var(--c50)}
.nav a:hover::after,.nav a.on::after{transform:scaleX(1)}
.hdr-act{display:flex;align-items:center;gap:1.25rem}
.hdr-tel{display:inline-flex;align-items:center;gap:.5rem;font:500 .8125rem/1 var(--f-u);color:rgba(246,240,228,.72);font-variant-numeric:tabular-nums;white-space:nowrap}
.hdr-tel .ic{width:1rem;height:1rem;color:var(--c300)}
@media (max-width:63.99rem){.nav{display:none}.hdr-act{margin-left:auto}}
@media (max-width:47.99rem){:root{--hdr:4rem}.hdr-tel{display:none}.logo-word{font-size:1.25rem}.logo-mark{width:2rem;height:2rem}.hdr .btn-s{--bh:2.375rem;padding:0 .9375rem;font-size:.8125rem}}

/* ---------- Hero ---------- */
.hero{position:relative;isolation:isolate;overflow:hidden;padding:calc(var(--hdr) + 2.25rem) 0 0;min-height:clamp(46rem,100vh,60rem);
  background:radial-gradient(52rem 30rem at 84% -4%,rgba(223,201,160,.15),transparent 62%),radial-gradient(44rem 26rem at 6% 96%,rgba(66,92,146,.32),transparent 70%),linear-gradient(180deg,#050B19 0%,#0A1530 52%,#0E1C3B 100%)}
.hero-sky{position:absolute;inset:0;z-index:-1;pointer-events:none;
  background-image:repeating-linear-gradient(30deg,rgba(223,201,160,.07) 0 1px,transparent 1px 2.75rem),repeating-linear-gradient(150deg,rgba(223,201,160,.07) 0 1px,transparent 1px 2.75rem);
  -webkit-mask-image:radial-gradient(64rem 36rem at 28% 34%,#000 0%,transparent 72%);mask-image:radial-gradient(64rem 36rem at 28% 34%,#000 0%,transparent 72%)}
.hero-moon{position:absolute;z-index:-1;right:12%;top:7.5rem;width:9rem;height:9rem;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle at 38% 36%,rgba(250,238,212,.55),rgba(223,201,160,.18) 46%,rgba(223,201,160,0) 70%);filter:blur(.5px);opacity:.55}
.hero-grid{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,31rem);gap:3.5rem;align-items:start}
.hero-copy{padding-top:2.5rem}
.eyebrow{display:inline-flex;align-items:center;gap:.625rem;margin-bottom:1.625rem;padding:.4375rem .875rem .4375rem .75rem;border-radius:999px;border:1px solid rgba(223,201,160,.26);background:rgba(223,201,160,.06);font:400 .75rem/1.25 var(--f-m);letter-spacing:.04em;color:var(--c200)}
.pulse{position:relative;width:.5rem;height:.5rem;flex:none;border-radius:50%;background:var(--ok-d)}
.pulse::after{content:"";position:absolute;inset:0;border-radius:50%;border:1px solid var(--ok-d);animation:pulse 2.6s ease-out infinite}
@keyframes pulse{from{transform:scale(1);opacity:.9}to{transform:scale(3.2);opacity:0}}
.display{font-family:var(--f-d);font-weight:300;letter-spacing:-.028em;line-height:1.02}
.hero h1{font-size:4.5rem;color:var(--c50);font-variation-settings:"opsz" 144}
.hero h1 em{position:relative;font-style:normal;color:var(--c300);white-space:nowrap}
.hero h1 em::after{content:"";position:absolute;left:-.02em;right:.04em;bottom:-.1em;height:.2em;transform-origin:left;animation:swash 1.2s .6s var(--ease) both;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 14' preserveAspectRatio='none'%3E%3Cpath d='M3 10C52 3 128 2 197 7' fill='none' stroke='%23CDB07D' stroke-width='2.4' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat center/100% 100%}
@keyframes swash{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.hero-lead{max-width:33rem;margin:1.5rem 0 2rem;font-size:1.125rem;line-height:1.62;color:rgba(246,240,228,.78)}
.hero-alt{display:flex;align-items:center;flex-wrap:wrap;gap:.875rem 1.25rem}
.hero-alt .btn .ic{color:var(--c300)}
.hero-tel{font-size:.875rem;color:rgba(246,240,228,.62)}
.hero-tel b{color:var(--c100);font-weight:600;font-variant-numeric:tabular-nums;margin-left:.25rem}
.town{position:absolute;left:0;right:0;bottom:0;z-index:1;aspect-ratio:var(--ar,1600 / 330);max-height:22rem;pointer-events:none}
.town-svg{width:100%;height:100%;overflow:visible}
@media (max-width:63.99rem){
  .hero{min-height:0;padding-bottom:0}
  .hero-grid{grid-template-columns:minmax(0,1fr);gap:2rem}
  .hero-copy{padding-top:1rem}
  .funnel{max-width:34rem;width:100%}
  .town{position:relative;margin-top:-3.5rem;max-height:none}
}
@media (max-width:47.99rem){
  .hero{padding-top:calc(var(--hdr) + 1.5rem)}
  .hero-copy{padding-top:.25rem}
  .hero h1{font-size:2.75rem;line-height:1.04}
  .eyebrow{font-size:.6875rem;margin-bottom:1.125rem}
  .hero-lead{font-size:1rem;margin:1rem 0 1.25rem}
  .hero-alt{display:none}
  .hero-moon{display:none}
  .town{margin-top:-3rem}
  .town .pin-label{display:none}
}
@media (min-width:48rem) and (max-width:63.99rem){.hero h1{font-size:3.75rem}}

/* Stadt (SVG, Klassen kommen aus index.js) */
.town polygon{stroke:rgba(223,201,160,.17);stroke-width:.6;stroke-linejoin:round}
.town .wr{fill:#14244A}.town .wl{fill:#1E3263}.town .wt{fill:#2C4579}
.town .gab{fill:#16284F}
.town .rb{fill:#28406F}.town .rf{fill:#33508A}.town .rv{fill:#1A2D56}.town .rv2{fill:#22396A}
.town .cr{fill:#14244A}.town .cl{fill:#22386B}.town .ct{fill:#2D477D}
.town .kr,.town .kl,.town .kt{fill:#2A4174}
.town .rail{fill:rgba(223,201,160,.12);stroke:rgba(223,201,160,.38)}
.town .canopy{fill:#3A5590}
.town .door{fill:#E7C88E;stroke:none}
.town .w{fill:#20335E;stroke:none}
.town .w.on{animation:winOn 1.6s var(--d,0s) ease both}
/* Fernseh-Flackern per JS-Takt (Klassenwechsel alle 1-2,5 s) statt Endlos-Animation: spart Dauer-Neuberechnung des SVG */
.town .w.tv{animation:winOn 1.6s var(--d,0s) ease backwards;fill:#EFD5A1}
.town .w.tv.f1{fill:#AFC2EE}.town .w.tv.f2{fill:#D9E3FF}
@keyframes winOn{0%{fill:#20335E}55%{fill:#FFEBC2}100%{fill:#EFD5A1}}
.town .far{opacity:.5}
.town .far .wr{fill:#0F1C3C}.town .far .wl{fill:#14254B}.town .far .wt{fill:#1B2F5C}
.town .far polygon{stroke:rgba(223,201,160,.1)}
.town .bld.fill{opacity:.9}
.town .bld{transition:filter .5s}
.town .bld.hint{filter:drop-shadow(0 0 .375rem rgba(239,213,161,.28))}
.town .bld.sel{filter:drop-shadow(0 0 .75rem rgba(239,213,161,.5))}
.town .bld.sel .w{animation:none;fill:#FFE6B6}
.town .bld.sel .w.fl{fill:#FFFFFF}
.town .bld.sel polygon{stroke:rgba(239,213,161,.5)}
.town .plot{fill:#173443;stroke:rgba(223,201,160,.25)}
.town .plotline{fill:none;stroke:#DFC9A0;stroke-width:1.1;stroke-dasharray:4 4;opacity:.7}
.town .bld.sel .plot{fill:#1E4253}
.town .stake{fill:#DFC9A0;stroke:none}
.town .post{fill:#7D6A4A;stroke:none}
.town .sign{fill:#EAD9B6;stroke:#0A1530;stroke-width:.6}
.town .sign-l{fill:#0A1530;stroke:none;opacity:.7}
.town .trunk{fill:#2B2A33;stroke:none}
.town .crown{fill:#173A49;stroke:rgba(223,201,160,.12);stroke-width:.6}
.town .crown-h{fill:#21515F;opacity:.85}
.town .tg-l{stroke:rgba(223,201,160,.07);stroke-width:.7;fill:none}
.town .horizon{stroke:rgba(223,201,160,.22);stroke-width:1}
.town .street{fill:#081127}
.town .street-m{stroke:rgba(223,201,160,.2);stroke-width:1.2;stroke-dasharray:14 16}
.town .lamp-post{stroke:#33456E;stroke-width:1.6}
.town .lamp-head{fill:#FFE3B0}
.town .lamp-pool{fill:rgba(255,227,176,.05)}
.town .pin{opacity:0;transition:transform .8s var(--ease),opacity .4s}
.town .pin.show{opacity:1}
.town .pin-drop.go{animation:pinDrop .75s var(--ease) both}
@keyframes pinDrop{0%{transform:translateY(-22px);opacity:0}55%{transform:translateY(2px);opacity:1}75%{transform:translateY(-4px)}100%{transform:none}}
.town .pin-body{fill:url(#pinG);stroke:#0A1530;stroke-width:1.2}
.town .pin-house{fill:#0A1530;stroke:none}
.town .pin-shadow{fill:rgba(0,0,0,.45);stroke:none}
.town .pin-label rect{fill:rgba(6,13,29,.9);stroke:rgba(223,201,160,.55);stroke-width:1}
.town .pin-label text{fill:#F6F0E4;font:600 13px var(--f-u);letter-spacing:.01em}

/* ---------- Funnel ---------- */
.funnel{position:relative;display:flex;flex-direction:column;min-height:35rem;padding:1.375rem 1.625rem 1.125rem;border-radius:1.5rem;background:var(--c50);color:var(--ink);
  box-shadow:0 2.5rem 5rem -1.5rem rgba(2,6,16,.75),0 0 0 1px rgba(223,201,160,.4),inset 0 1px 0 #fff}
.funnel::before{content:"";position:absolute;inset:-1px;border-radius:inherit;pointer-events:none;padding:1px;background:linear-gradient(160deg,rgba(239,213,161,.9),rgba(239,213,161,0) 38%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0)}
.f-top{display:flex;align-items:center;gap:.75rem;min-height:2.25rem}
.f-back{display:inline-flex;align-items:center;gap:.25rem;margin-left:-.5rem;padding:.375rem .625rem .375rem .375rem;border-radius:999px;font:500 .8125rem/1 var(--f-u);color:var(--ink2);transition:background-color .2s,color .2s}
.f-back:hover{background:var(--c150);color:var(--ink)}
.f-back .ic{width:1rem;height:1rem}
.f-back.is-hidden{display:none}
.f-count{white-space:nowrap;font:400 .75rem/1 var(--f-m);letter-spacing:.06em;text-transform:uppercase;color:var(--c700)}
.f-time{white-space:nowrap;margin-left:auto;display:inline-flex;align-items:center;gap:.375rem;font:500 .75rem/1 var(--f-u);color:var(--ink3)}
.f-time .ic{width:.9375rem;height:.9375rem}
.f-prog{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:.375rem;margin:.75rem 0 1.375rem}
.f-prog i{height:.25rem;border-radius:1rem;background:rgba(10,21,48,.09);overflow:hidden;position:relative}
.f-prog i::after{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(90deg,var(--c500),var(--c400));transform:scaleX(0);transform-origin:left;transition:transform .6s var(--ease)}
.f-prog i.done::after{transform:scaleX(1)}
.f-prog i.cur::after{transform:scaleX(.42)}
.f-prog.full i::after{background:linear-gradient(90deg,var(--ok),#4FA27F)}
.f-stage{display:flex;flex-direction:column;flex:1;min-height:0}
.f-stage.enter{animation:stIn .5s var(--ease) both}
.f-stage.enter.back{animation-name:stInB}
@keyframes stIn{from{opacity:0;transform:translateX(1.25rem)}to{opacity:1;transform:none}}
@keyframes stInB{from{opacity:0;transform:translateX(-1.25rem)}to{opacity:1;transform:none}}
.f-q{font:400 1.75rem/1.14 var(--f-d);letter-spacing:-.02em;color:var(--ink);margin-bottom:1.25rem;outline:none}
.f-q-s{font-size:1.5rem;margin-bottom:.75rem}
.f-pre{display:inline-flex;align-self:flex-start;align-items:center;gap:.375rem;margin:-.5rem 0 1rem;padding:.3125rem .75rem .3125rem .5rem;border-radius:999px;background:var(--c150);font:500 .75rem/1.2 var(--f-u);color:var(--c700)}
.f-pre .ic{width:.9375rem;height:.9375rem}
.f-foot{display:flex;align-items:center;justify-content:center;gap:.5rem;margin-top:1rem;padding-top:.875rem;border-top:1px solid var(--line-l);font:500 .75rem/1.3 var(--f-u);color:var(--ink3);text-align:center}
.f-foot .ic{width:.9375rem;height:.9375rem;color:var(--c600)}
.f-next{margin-top:auto}

.f-tiles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem}
.tile{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:.125rem;padding:.875rem .875rem 1rem;border-radius:1rem;border:1px solid var(--line-l);background:#fff;text-align:left;
  box-shadow:0 1px 0 rgba(10,21,48,.03);transition:transform .25s var(--ease),border-color .2s,box-shadow .25s,background-color .2s}
.tile:hover{transform:translateY(-2px);border-color:var(--c400);box-shadow:0 .875rem 1.75rem -1rem rgba(10,21,48,.35)}
.tile-ic{display:flex;align-items:flex-end;justify-content:center;width:100%;height:5.75rem;margin-bottom:.625rem;border-radius:.625rem;
  background:radial-gradient(80% 70% at 50% 100%,rgba(223,201,160,.32),rgba(223,201,160,0) 70%),linear-gradient(180deg,#F7F1E4,#F2EADA);padding:.625rem .5rem .5rem}
.tile-ic svg{width:100%;height:100%}
.tile-t{font:600 .9375rem/1.25 var(--f-u);color:var(--ink)}
.tile-s{font:400 .75rem/1.35 var(--f-u);color:var(--ink3)}
.tile-ck{position:absolute;top:.625rem;right:.625rem;display:grid;place-items:center;width:1.5rem;height:1.5rem;border-radius:50%;background:var(--n900);color:var(--c200);transform:scale(.4);opacity:0;transition:transform .3s var(--ease),opacity .2s}
.tile-ck .ic{width:.875rem;height:.875rem;stroke-width:2.4}
.tile.is-sel{border-color:var(--n900);box-shadow:0 0 0 1px var(--n900),0 1rem 2rem -1.25rem rgba(10,21,48,.5)}
.tile.is-sel .tile-ck{transform:none;opacity:1}
.tile.hint{border-color:var(--c400);box-shadow:0 0 0 .25rem rgba(223,201,160,.32)}
.tile.hint .tile-ic{background:radial-gradient(80% 70% at 50% 100%,rgba(223,201,160,.55),rgba(223,201,160,0) 72%),linear-gradient(180deg,#F7F1E4,#F0E5CF)}
.ticon polygon,.ticon circle{stroke:#0A1530;stroke-width:1.15;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.ticon .wr,.ticon .gab{fill:#E2D0AC}.ticon .wl{fill:#FFFDF8}.ticon .wt{fill:#F1E6CF}
.ticon .rb{fill:#B39461}.ticon .rf{fill:#CDB07D}.ticon .rv,.ticon .rv2{fill:#8F703F}
.ticon .cr{fill:#E2D0AC}.ticon .cl{fill:#FFFDF8}.ticon .ct{fill:#F1E6CF}
.ticon .kr,.ticon .kl,.ticon .kt{fill:#E9DBBE}
.ticon .rail{fill:rgba(10,21,48,.06)}
.ticon .canopy{fill:#CDB07D}
.ticon .w{fill:#1C305C;stroke:none}
.ticon .door{fill:#0A1530;stroke:none}
.ticon .plot{fill:#E4EBDD}
.ticon .plotline{fill:none;stroke:#8F703F;stroke-dasharray:3 3}
.ticon .stake,.ticon .post{fill:#0A1530;stroke:none}
.ticon .sign{fill:#CDB07D}
.ticon .sign-l{fill:#0A1530;stroke:none}
.ticon .trunk{fill:#0A1530;stroke:none}
.ticon .crown{fill:#9DBBA6}
.ticon .crown-h{fill:#C3D8C6;stroke:none}

.f-area{display:flex;flex-direction:column;gap:.75rem;margin-bottom:1.25rem}
.f-big{display:flex;align-items:baseline;gap:.375rem;font:300 3.75rem/1 var(--f-d);letter-spacing:-.03em;color:var(--ink);font-variant-numeric:lining-nums tabular-nums}
.f-big small{font:500 1.125rem/1 var(--f-u);letter-spacing:0;color:var(--ink3)}
.range{-webkit-appearance:none;appearance:none;width:100%;height:2rem;margin:0;background:transparent;cursor:pointer}
.range:focus{outline:none}
.range::-webkit-slider-runnable-track{height:.375rem;border-radius:1rem;background:linear-gradient(90deg,var(--c500) 0,var(--c400) var(--p),rgba(10,21,48,.12) var(--p))}
.range::-moz-range-track{height:.375rem;border-radius:1rem;background:rgba(10,21,48,.12)}
.range::-moz-range-progress{height:.375rem;border-radius:1rem;background:var(--c400)}
.range::-webkit-slider-thumb{-webkit-appearance:none;width:1.625rem;height:1.625rem;margin-top:-.625rem;border-radius:50%;background:var(--n900);border:.1875rem solid var(--c300);box-shadow:0 .25rem .875rem rgba(10,21,48,.4);transition:transform .2s var(--ease)}
.range::-moz-range-thumb{width:1.25rem;height:1.25rem;border-radius:50%;background:var(--n900);border:.1875rem solid var(--c300)}
.range:hover::-webkit-slider-thumb{transform:scale(1.08)}
.range:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 .3125rem rgba(42,68,118,.25),0 .25rem .875rem rgba(10,21,48,.4)}
.f-scale{display:flex;justify-content:space-between;gap:.5rem;margin-top:-.375rem;font:400 .6875rem/1.2 var(--f-m);color:var(--ink3)}
.f-scale span:nth-child(2){color:var(--c700);text-align:center}
.f-scale span:first-child,.f-scale span:last-child{white-space:nowrap}
.f-chips{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.25rem}
.f-area-top{display:flex;align-items:center;justify-content:space-between;gap:1rem}
.f-rooms{margin-top:.5rem;font:500 .8125rem/1.3 var(--f-u);color:var(--c700)}
.f-plate{width:9.5rem;height:auto;flex:none;overflow:visible}
.plate{transform:scale(var(--s,.6));transform-box:fill-box;transform-origin:50% 45%;transition:transform .45s var(--ease)}
.pl-t{fill:#F3E9D5;stroke:#0A1530;stroke-width:1.2;vector-effect:non-scaling-stroke;stroke-linejoin:round}
.pl-l{fill:#CDB07D;stroke:#0A1530;stroke-width:1.2;vector-effect:non-scaling-stroke}
.pl-r{fill:#B4955F;stroke:#0A1530;stroke-width:1.2;vector-effect:non-scaling-stroke}
.pl-g{fill:none;stroke:rgba(10,21,48,.18);stroke-width:1;vector-effect:non-scaling-stroke}

.f-opts{display:flex;flex-direction:column;gap:.5rem}
.opt{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:.875rem;min-height:3.5rem;padding:.5rem 1rem;border-radius:.875rem;border:1px solid var(--line-l);background:#fff;text-align:left;transition:border-color .2s,transform .22s var(--ease),box-shadow .25s,background-color .2s}
.opt:hover{border-color:var(--c400);transform:translateX(.1875rem);box-shadow:0 .75rem 1.5rem -1.25rem rgba(10,21,48,.4)}
.opt-rd{width:1.125rem;height:1.125rem;border-radius:50%;border:1.5px solid rgba(10,21,48,.3);position:relative;transition:border-color .2s}
.opt-rd::after{content:"";position:absolute;inset:.1875rem;border-radius:50%;background:var(--n900);transform:scale(0);transition:transform .25s var(--ease)}
.opt-m{display:flex;flex-direction:column;gap:.0625rem;min-width:0}
.opt-m b{font:600 .9375rem/1.25 var(--f-u);color:var(--ink)}
.opt-m small{font:400 .75rem/1.3 var(--f-u);color:var(--ink3)}
.opt-yr{font:400 .6875rem/1 var(--f-m);color:var(--c600);letter-spacing:.08em}
.meter{display:flex;gap:.1875rem;align-items:flex-end;height:1rem}
.meter i{width:.3125rem;border-radius:1px;background:rgba(10,21,48,.12)}
.meter i:nth-child(1){height:35%}.meter i:nth-child(2){height:55%}.meter i:nth-child(3){height:78%}.meter i:nth-child(4){height:100%}
.meter i.on{background:var(--c500)}
.opt.is-sel{border-color:var(--n900);box-shadow:0 0 0 1px var(--n900);background:#FFFDF8}
.opt.is-sel .opt-rd{border-color:var(--n900)}
.opt.is-sel .opt-rd::after{transform:scale(1)}

.f-loc{display:flex;flex-direction:column;flex:1}
.inp-plz{height:3.25rem;font:500 1.375rem/1 var(--f-u);letter-spacing:.14em;font-variant-numeric:tabular-nums}
.f-msg{display:flex;align-items:center;gap:.375rem;min-height:1.5rem;margin-top:.375rem;font:500 .75rem/1.3 var(--f-u);color:var(--ink3)}
.f-msg .ic{width:1rem;height:1rem}
.f-msg.ok{color:var(--ok)}
.f-msg.err{color:var(--err)}
.f-or{display:flex;align-items:center;gap:.75rem;margin:.5rem 0 .625rem;font:400 .6875rem/1 var(--f-m);letter-spacing:.08em;text-transform:uppercase;color:var(--ink3)}
.f-or::before,.f-or::after{content:"";flex:1;height:1px;background:var(--line-l)}
.f-dists{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.4375rem;margin-bottom:1.25rem}
.chip-d{justify-content:flex-start;border-radius:.625rem;padding:0 .75rem;min-height:2.375rem}

.f-calc{display:flex;flex-direction:column;align-items:center;justify-content:center;flex:1;text-align:center;padding:1rem 0}
.calc-ring{position:relative;display:grid;place-items:center;width:4.5rem;height:4.5rem;margin-bottom:1.25rem;color:var(--n900)}
.calc-ring svg:not(.ic){position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg)}
.calc-ring .ic{width:1.5rem;height:1.5rem}
.cr-bg{fill:none;stroke:rgba(10,21,48,.08);stroke-width:3}
.cr-fg{fill:none;stroke:var(--c500);stroke-width:3;stroke-linecap:round;stroke-dasharray:176;stroke-dashoffset:176;animation:ring 1.9s var(--ease) forwards}
@keyframes ring{to{stroke-dashoffset:0}}
.calc-list{display:flex;flex-direction:column;gap:.625rem;margin-top:.25rem;text-align:left}
.calc-list li{display:flex;align-items:center;gap:.625rem;font:500 .875rem/1.3 var(--f-u);color:rgba(10,21,48,.38);transition:color .3s}
.cl-ic{display:grid;place-items:center;width:1.375rem;height:1.375rem;border-radius:50%;border:1.5px solid rgba(10,21,48,.15);color:transparent;transition:all .3s}
.cl-ic .ic{width:.8125rem;height:.8125rem;stroke-width:2.6}
.calc-list li.run{color:var(--ink)}
.calc-list li.run .cl-ic{border-color:var(--c500);border-top-color:transparent;animation:spin .7s linear infinite}
.calc-list li.ok{color:var(--ink)}
.calc-list li.ok .cl-ic{border-color:var(--ok);background:var(--ok);color:#fff}
@keyframes spin{to{transform:rotate(360deg)}}

.f-res{display:flex;flex-direction:column;flex:1}
.res-top{display:flex;align-items:center;justify-content:space-between;gap:.75rem;margin-bottom:.875rem}
.badge-demo{display:inline-flex;align-items:center;gap:.375rem;padding:.3125rem .625rem .3125rem .5rem;border-radius:.375rem;background:#FBEFD9;border:1px solid #E7D1A6;font:400 .6875rem/1 var(--f-m);letter-spacing:.08em;text-transform:uppercase;color:var(--c700)}
.badge-demo .ic{width:.875rem;height:.875rem}
.res-obj{font:500 .75rem/1.2 var(--f-u);color:var(--ink3);text-align:right}
.res-l{font:600 .75rem/1.2 var(--f-u);letter-spacing:.04em;text-transform:uppercase;color:var(--ink2)}
.res-v{margin:.375rem 0 1rem;font:300 2.625rem/1.05 var(--f-d);letter-spacing:-.03em;color:var(--ink);font-variant-numeric:lining-nums tabular-nums;white-space:nowrap}
.res-v.long{font-size:2.125rem}
.res-v .dash{margin:0 .18em;color:var(--c500)}
.res-v .cur{margin-left:.12em;font-size:.72em}
.res-v .cur:first-child{margin:0 .06em 0 0}
.res-bar{position:relative;height:.625rem;border-radius:1rem;background:linear-gradient(90deg,rgba(10,21,48,.06),rgba(10,21,48,.12) 50%,rgba(10,21,48,.06))}
.rb-band{position:absolute;left:22%;right:22%;top:0;bottom:0;border-radius:1rem;background:linear-gradient(90deg,var(--c400),var(--c300) 50%,var(--c400));transform-origin:center;animation:band .9s .15s var(--ease) both}
.rb-mid{position:absolute;left:50%;top:-.3125rem;width:.125rem;height:1.25rem;margin-left:-.0625rem;border-radius:1px;background:var(--n900)}
@keyframes band{from{transform:scaleX(.1);opacity:0}to{transform:none;opacity:1}}
.res-ends{display:flex;justify-content:space-between;align-items:baseline;gap:.5rem;margin:.5rem 0 1rem;font:400 .6875rem/1.2 var(--f-m);color:var(--ink3)}
.res-ends span:first-child{padding-left:18%}
.res-ends span:last-child{padding-right:18%}
.res-ends b{font:600 .8125rem/1.2 var(--f-u);color:var(--ink);white-space:nowrap}
.res-f{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.5rem;margin-bottom:.875rem}
.res-f li{display:flex;flex-direction:column;gap:.125rem;padding:.5rem .625rem;border-radius:.625rem;background:var(--c100);border:1px solid var(--line-l);min-width:0}
.res-f span{font:500 .6875rem/1.2 var(--f-u);color:var(--ink3)}
.res-f b{font:600 .8125rem/1.25 var(--f-u);color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.res-f li.pos b{color:var(--ok)}
.res-f li.neg b{color:var(--neg)}
.res-note{font:400 .75rem/1.45 var(--f-u);color:var(--ink2);margin-bottom:1rem}
.res-cta{margin-top:auto;display:flex;flex-direction:column;align-items:center;gap:.25rem}

.f-sum{display:flex;align-items:center;gap:.5rem;margin-bottom:1rem;padding:.625rem .75rem;border-radius:.75rem;background:var(--c100);border:1px solid var(--line-l);font:500 .8125rem/1.3 var(--f-u);color:var(--ink2)}
.f-sum .ic{width:1rem;height:1rem;color:var(--c600)}
.f-sum span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.f-sum b{color:var(--ink);font-weight:600;white-space:nowrap}
.f-form{display:flex;flex-direction:column;gap:.75rem;flex:1}
.fld-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem}
.ck{display:grid;grid-template-columns:auto minmax(0,1fr);gap:.625rem;align-items:start;cursor:pointer;font:400 .78125rem/1.45 var(--f-u);color:var(--ink2)}
.ck input{position:absolute;opacity:0;width:1px;height:1px}
.ck-b{display:grid;place-items:center;width:1.25rem;height:1.25rem;margin-top:.0625rem;border-radius:.375rem;border:1.5px solid rgba(10,21,48,.3);background:#fff;color:transparent;transition:all .2s}
.ck-b .ic{width:.875rem;height:.875rem;stroke-width:2.6}
.ck input:checked+.ck-b{background:var(--n900);border-color:var(--n900);color:var(--c200)}
.ck input:focus-visible+.ck-b{outline:2px solid var(--n600);outline-offset:2px}
.f-form .btn{margin-top:auto}
.f-demo{display:flex;align-items:center;justify-content:center;gap:.375rem;font:500 .6875rem/1.3 var(--f-u);color:var(--ink3);text-align:center}
.f-demo .ic{width:.875rem;height:.875rem}

.f-done{display:flex;flex-direction:column;flex:1}
.done-ck svg{width:3.25rem;height:3.25rem;margin-bottom:.875rem}
.dc-c{fill:rgba(44,118,86,.08);stroke:var(--ok);stroke-width:2;stroke-dasharray:151;stroke-dashoffset:151;animation:draw .7s var(--ease) forwards}
.dc-p{fill:none;stroke:var(--ok);stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:36;stroke-dashoffset:36;animation:draw .45s .45s var(--ease) forwards}
@keyframes draw{to{stroke-dashoffset:0}}
.f-done .f-q{margin-bottom:.5rem}
.done-t{font-size:.9375rem;line-height:1.5;color:var(--ink2);margin-bottom:1rem}
.done-l{display:flex;flex-direction:column;gap:.5rem;margin-bottom:1.25rem}
.done-l li{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:.625rem;padding:.5625rem .75rem;border-radius:.75rem;background:#fff;border:1px solid var(--line-l);font:500 .8125rem/1.3 var(--f-u);color:var(--ink)}
.done-l li span:nth-child(2){overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.done-l em{font:400 .6875rem/1 var(--f-m);font-style:normal;color:var(--ink3);white-space:nowrap}
.dl-ic{display:grid;place-items:center;width:1.375rem;height:1.375rem;border-radius:50%;background:var(--ok);color:#fff}
.dl-ic .ic{width:.8125rem;height:.8125rem;stroke-width:2.6}
.done-l li.plan .dl-ic{background:var(--c150);color:var(--c700)}
.done-links{display:flex;flex-wrap:wrap;justify-content:center;gap:.25rem 1rem;margin-top:.5rem}
.f-done .btn-navy{margin-top:auto}

@media (max-width:47.99rem){
  .funnel{padding:1.125rem 1.125rem 1rem;border-radius:1.25rem;min-height:0}
  .f-q{font-size:1.5rem}
  .f-tiles{gap:.5rem}
  .tile{padding:.625rem .625rem .75rem}
  .tile-ic{height:4.75rem}
  .res-v{font-size:1.875rem;white-space:normal}
  .res-v.long{font-size:1.5rem}
  .res-ends{flex-wrap:wrap}
  .res-ends b{order:-1;flex-basis:100%;text-align:center;margin-bottom:.25rem}
  .res-ends span:first-child,.res-ends span:last-child{padding:0}
  .res-f b{white-space:normal}
  .fld-row{grid-template-columns:minmax(0,1fr)}
  .f-plate{width:7.5rem}
  .f-big{font-size:3.25rem}
  .f-scale span:nth-child(2){display:none}
  .f-chips{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.375rem}
  .f-chips .chip{padding:0 .25rem;white-space:nowrap}
  .f-chips .chip:nth-child(5){display:none}
  .f-sum{flex-wrap:wrap;row-gap:.25rem}
  .f-sum span{white-space:normal}
  .done-l li span:nth-child(2){white-space:normal;overflow-wrap:anywhere}
}

/* ---------- Sektionen allgemein ---------- */
.sec{position:relative;padding:6rem 0}
.sec-light{background:var(--c100);color:var(--ink)}
.sec-dark{background:linear-gradient(180deg,#0E1C3B 0%,#0A1530 100%)}
.sec-deep{background:radial-gradient(50rem 30rem at 85% 20%,rgba(42,68,118,.35),transparent 70%),var(--n950)}
.sec-head{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:2rem 4rem;align-items:end;margin-bottom:3rem}
.kicker{display:inline-flex;align-items:center;gap:.625rem;margin-bottom:1rem;font:400 .75rem/1 var(--f-m);letter-spacing:.16em;text-transform:uppercase;color:var(--c400)}
.kicker::before{content:"";width:1.75rem;height:1px;background:currentColor}
.sec-light .kicker{color:var(--c600)}
.sec h2.display{font-size:3.25rem;outline:none}
.sec-light h2.display{color:var(--ink)}
.sec-lead{font-size:1.0625rem;line-height:1.65;color:var(--mute-d);max-width:34rem}
.sec-light .sec-lead{color:var(--ink2)}
.sec-head-r{display:flex;flex-direction:column;align-items:flex-start;gap:1.5rem}
.rv{opacity:0;transform:translateY(1.5rem);transition:opacity .9s var(--ease),transform .9s var(--ease);transition-delay:calc(var(--i,0) * 90ms)}
.rv.in{opacity:1;transform:none}
@media (max-width:63.99rem){.sec{padding:5rem 0}.sec-head{grid-template-columns:minmax(0,1fr);gap:1.25rem;margin-bottom:2.5rem}.sec h2.display{font-size:2.5rem}}
@media (max-width:47.99rem){.sec{padding:4rem 0}.sec h2.display{font-size:2.125rem;line-height:1.06}.sec-lead{font-size:1rem}}

/* ---------- Ablauf ---------- */
.steps{position:relative;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:1rem;counter-reset:s}
.steps::before{content:"";position:absolute;left:1.5rem;right:1.5rem;top:2.375rem;height:1px;background:linear-gradient(90deg,var(--c400),rgba(205,176,125,.25));transform-origin:left;transform:scaleX(0);transition:transform 1.6s .2s var(--ease)}
.steps.in::before,.steps:has(.step.in)::before{transform:scaleX(1)}
.step{position:relative;display:flex;flex-direction:column;padding:1.25rem 1.25rem 1.375rem;border-radius:1.125rem;background:#fff;border:1px solid var(--line-l);box-shadow:0 1px 0 rgba(10,21,48,.03);transition:opacity .9s var(--ease),transform .5s var(--ease),box-shadow .4s,border-color .3s}
.step:hover{transform:translateY(-.25rem);border-color:var(--c400);box-shadow:0 1.5rem 2.5rem -1.75rem rgba(10,21,48,.4)}
.step-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:1.5rem}
.step-n{display:grid;place-items:center;width:2.25rem;height:2.25rem;border-radius:50%;background:var(--n900);color:var(--c200);font:400 .75rem/1 var(--f-m);letter-spacing:.04em;box-shadow:0 0 0 .375rem var(--c100)}
.step-ic{display:grid;place-items:center;width:2.75rem;height:2.75rem;border-radius:.875rem;background:var(--c150);color:var(--c700)}
.step-ic .ic{width:1.375rem;height:1.375rem}
.step h3{font:400 1.25rem/1.2 var(--f-d);letter-spacing:-.01em;color:var(--ink);margin-bottom:.5rem}
.step p{font-size:.875rem;line-height:1.55;color:var(--ink2);margin-bottom:1.25rem}
.step-c{margin-top:auto;display:inline-flex;align-self:flex-start;align-items:center;gap:.375rem;padding:.3125rem .625rem;border-radius:999px;background:var(--c100);border:1px solid var(--line-l);font:400 .6875rem/1 var(--f-m);letter-spacing:.04em;color:var(--c700)}
.step-c .ic{width:.875rem;height:.875rem}
.step-hi{background:linear-gradient(170deg,var(--n800),var(--n900));border-color:var(--n900);box-shadow:0 1.5rem 3rem -1.75rem rgba(10,21,48,.8)}
.step-hi .step-n{background:var(--c300);color:var(--n950)}
.step-hi .step-ic{background:rgba(223,201,160,.14);color:var(--c300)}
.step-hi h3{color:var(--c50)}
.step-hi p{color:var(--mute-d)}
.step-hi .step-c{background:rgba(223,201,160,.1);border-color:var(--line-d2);color:var(--c200)}
.step-go{display:inline-flex;align-items:center;gap:.375rem;margin-top:.875rem;font:600 .8125rem/1.2 var(--f-u);color:var(--c300);text-decoration:none}
.step-go .ic{width:1rem;height:1rem;transition:transform .28s var(--ease)}
.step-go:hover .ic{transform:translateX(.1875rem)}
.step-hi:hover{border-color:var(--c400)}
.steps-bar{display:none}
/* Tablet/Handy: Karten als Wisch-Leiste mit Anschnitt (statt 5 x Volltext untereinander) */
@media (max-width:63.99rem){
  .steps{display:flex;gap:.75rem;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-padding-inline:var(--g);
    margin-inline:calc(-1 * var(--g));padding:.25rem var(--g) 1.5rem;scrollbar-width:none}
  .steps::-webkit-scrollbar{display:none}
  .steps::before{display:none}
  .steps:focus-visible{outline-offset:-2px;border-radius:1.25rem}
  .step{flex:0 0 min(17.5rem,78%);scroll-snap-align:start}
  .step:hover{transform:none}
  .step-top{margin-bottom:1.125rem}
  .step p{margin-bottom:1rem}
  .steps-bar{display:block;position:relative;height:2px;margin:-.25rem auto 0;width:6rem;border-radius:2px;background:rgba(10,21,48,.1);overflow:hidden}
  .steps-bar i{position:absolute;top:0;bottom:0;left:var(--sl,0%);width:var(--sw,30%);border-radius:inherit;background:var(--c500)}
}

/* ---------- Karte ---------- */
.map-wrap{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,1fr);gap:1.5rem;align-items:stretch}
.map{position:relative;padding:.75rem;border-radius:1.5rem;background:linear-gradient(160deg,rgba(223,201,160,.1),rgba(223,201,160,.02));border:1px solid var(--line-d)}
.map-svg{width:100%;height:auto}
.m-base{fill:#0A1530}
.m-river{fill:none;stroke:#0E2A4C;stroke-width:26;stroke-linecap:round}
.m-river-l{fill:none;stroke:rgba(150,190,235,.28);stroke-width:1.2;stroke-dasharray:3 9}
.m-water{fill:#0E2A4C;stroke:rgba(150,190,235,.22);stroke-width:1}
.m-pier{stroke:rgba(223,201,160,.4);stroke-width:2}
.m-d{fill:#162950;stroke:rgba(223,201,160,.24);stroke-width:1;cursor:pointer;transition:fill .3s,stroke .3s;outline:none}
.m-d:hover,.m-d.hov{fill:#1E3566}
.m-d.sel{fill:#24407A;stroke:#DFC9A0;stroke-width:1.8;filter:drop-shadow(0 0 10px rgba(223,201,160,.28))}
.m-d:focus-visible{stroke:#fff;stroke-width:2.2}
.m-deco{pointer-events:none}
.m-park{fill:#163B44;stroke:rgba(138,211,176,.18)}
.m-tree{fill:#1F5257}
.m-bridge{stroke:#2A4476;stroke-width:7;stroke-linecap:round}
.m-road{fill:none;stroke:rgba(223,201,160,.09);stroke-width:2;stroke-dasharray:1 0}
.mh-a{fill:#2C4579}.mh-b{fill:#21376A}.mh-c{fill:#3A5590}
.m-lab{font:600 10.5px var(--f-u);letter-spacing:.14em;text-transform:uppercase;fill:rgba(234,220,194,.66);text-anchor:middle;paint-order:stroke;stroke:#0E1C3B;stroke-width:3px;transition:fill .3s}
.m-lab.on{fill:#FCF3DF}
.m-riverlab{font:400 10px var(--f-m);letter-spacing:.3em;text-transform:uppercase;fill:rgba(150,180,228,.62)}
.m-pin{transition:transform .7s var(--ease)}
.m-pin-in.go{animation:pinDrop .7s var(--ease) both}
.m-pin-b{fill:url(#mapPinG);stroke:#0A1530;stroke-width:1.2}
.m-pin-c{fill:#0A1530}
.m-pin .pin-shadow{fill:rgba(0,0,0,.45)}
.map-info{position:relative;display:flex;flex-direction:column;padding:2rem;border-radius:1.5rem;background:linear-gradient(180deg,rgba(28,48,92,.55),rgba(14,28,59,.55));border:1px solid var(--line-d)}
.mi{display:flex;flex-direction:column;flex:1}
.mi.swap{animation:miIn .45s var(--ease) both}
@keyframes miIn{from{opacity:0;transform:translateY(.5rem)}to{opacity:1;transform:none}}
.mi-k{font:400 .6875rem/1 var(--f-m);letter-spacing:.14em;text-transform:uppercase;color:var(--c400);margin-bottom:.75rem}
.mi-h{font:300 2.625rem/1.02 var(--f-d);letter-spacing:-.025em;color:var(--c50);margin-bottom:.75rem}
.mi-d{font-size:.9375rem;line-height:1.55;color:var(--mute-d);margin-bottom:1.5rem;min-height:2.9rem}
.mi-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.5rem;margin-bottom:1rem}
.mi-stats div{display:flex;flex-direction:column;gap:.375rem;padding:.75rem;border-radius:.875rem;background:rgba(6,13,29,.45);border:1px solid var(--line-d)}
.mi-stats span{font:500 .6875rem/1.25 var(--f-u);color:var(--mute-d)}
.mi-stats b{display:flex;align-items:center;gap:.25rem;font:500 1.0625rem/1 var(--f-u);color:var(--c50);font-variant-numeric:tabular-nums;white-space:nowrap}
.mi-stats b.up{color:var(--ok-d)}
.mi-stats b .ic{width:1rem;height:1rem}
.mi-spark{width:100%;height:auto;margin-bottom:1rem}
.sp-l{fill:none;stroke:#DFC9A0;stroke-width:1.8;stroke-linejoin:round;stroke-linecap:round}
.sp-d{fill:#0A1530;stroke:#DFC9A0;stroke-width:2}
.mi-tags{display:flex;flex-wrap:wrap;gap:.375rem;margin-bottom:1.5rem}
.mi-tags li{padding:.375rem .75rem;border-radius:999px;border:1px solid var(--line-d2);font:500 .75rem/1 var(--f-u);color:var(--c200)}
.mi .btn{margin-top:auto}
.mi-note{display:flex;align-items:center;gap:.375rem;margin-top:.875rem;font:400 .6875rem/1.3 var(--f-m);color:rgba(169,180,203,.8)}
.mi-note .ic{width:.875rem;height:.875rem}
.map-chips{display:none}
@media (max-width:63.99rem){
  .map-wrap{grid-template-columns:minmax(0,1fr)}
  .map-chips{display:flex;gap:.5rem;overflow-x:auto;overscroll-behavior-x:contain;padding:.25rem var(--g) .75rem;margin:1rem calc(-1 * var(--g)) .5rem;scroll-padding-inline:var(--g);scrollbar-width:none}
  .map-chips::-webkit-scrollbar{display:none}
  .chip-m{flex:none;background:rgba(223,201,160,.06);border-color:var(--line-d2);color:var(--c100)}
  .chip-m.is-sel{background:var(--c300);border-color:var(--c300);color:var(--n950)}
  .map-info{padding:1.5rem}
  .mi-h{font-size:2.25rem}
}
@media (max-width:47.99rem){.map{padding:.375rem;border-radius:1.125rem}.m-lab{font-size:16px;letter-spacing:.05em;stroke-width:4px}.m-riverlab{display:none}.mi-stats b{font-size:.9375rem}.mi-stats div{padding:.625rem}}

/* ---------- Terminbuchung ---------- */
.booker{border-radius:1.75rem;background:#fff;border:1px solid var(--line-l);box-shadow:0 2.5rem 5rem -3rem rgba(10,21,48,.45);overflow:hidden}
.bk{display:grid;grid-template-columns:17rem minmax(0,1fr)}
.bk-side{display:flex;flex-direction:column;gap:1rem;padding:1.75rem;background:linear-gradient(180deg,var(--n900),var(--n850));color:var(--txt-d)}
.adv{display:flex;align-items:center;gap:.875rem;padding-bottom:1.25rem;border-bottom:1px solid var(--line-d)}
.adv .adv-av{display:grid;place-items:center;width:3.25rem;height:3.25rem;flex:none;border-radius:50%;background:radial-gradient(circle at 35% 30%,#F3E3C2,#C9A86F);color:var(--n950);font:500 1.0625rem/1 var(--f-d);box-shadow:0 0 0 .25rem rgba(223,201,160,.15)}
.adv b{display:block;font:600 1rem/1.3 var(--f-u)}
.adv span{display:block;font:400 .8125rem/1.3 var(--f-u);color:var(--mute-d)}
.bk-l{font:400 .6875rem/1 var(--f-m);letter-spacing:.14em;text-transform:uppercase;color:var(--c400);margin-top:.25rem}
.seg{display:flex;flex-direction:column;gap:.375rem}
.seg button{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:.75rem;padding:.6875rem .875rem;border-radius:.875rem;border:1px solid var(--line-d);background:rgba(223,201,160,.03);text-align:left;transition:border-color .2s,background-color .2s}
.seg button:hover{border-color:var(--line-d2)}
.seg button .ic{width:1.125rem;height:1.125rem;color:var(--c300)}
.seg span{font:600 .875rem/1.2 var(--f-u)}
.seg small{font:400 .6875rem/1 var(--f-m);color:var(--mute-d)}
.seg button[aria-pressed="true"]{border-color:var(--c300);background:rgba(223,201,160,.12);box-shadow:inset 0 0 0 1px var(--c300)}
.bk-info{display:flex;flex-direction:column;gap:.5rem;margin-top:auto;padding-top:1rem}
.bk-info li{display:flex;align-items:center;gap:.5rem;font:400 .8125rem/1.3 var(--f-u);color:var(--mute-d)}
.bk-info .ic{width:1rem;height:1rem;color:var(--ok-d)}
.bk-main{min-width:0;padding:1.75rem}
.bk-main.enter{animation:stIn .5s var(--ease) both}
.bk-pick{display:grid;grid-template-columns:minmax(0,1fr) 15.5rem;gap:2rem}
.cal-h{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem}
.cal-h b{font:400 1.375rem/1 var(--f-d);color:var(--ink);letter-spacing:-.01em}
.cal-nav{display:grid;place-items:center;width:2.25rem;height:2.25rem;border-radius:50%;border:1px solid var(--line-l2);color:var(--ink);transition:background-color .2s,border-color .2s}
.cal-nav:hover:not([disabled]){background:var(--c100);border-color:var(--ink)}
.cal-nav[disabled]{opacity:.3;cursor:default}
.cal-nav .ic{width:1rem;height:1rem}
.cal-w,.cal-g{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:.3125rem}
.cal-w{margin-bottom:.375rem}
.cal-w span{text-align:center;font:400 .6875rem/1 var(--f-m);letter-spacing:.08em;text-transform:uppercase;color:var(--ink3);padding:.375rem 0}
.cd{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.25rem;height:3rem;border-radius:.75rem;font:500 .9375rem/1 var(--f-u);font-variant-numeric:tabular-nums;color:var(--ink);transition:background-color .2s,color .2s,transform .2s var(--ease)}
.cd.cd-x{pointer-events:none;background:none}
button.cd:not([disabled]){background:var(--c100)}
.cd:not([disabled]):not(.cd-x):hover{background:var(--c200);transform:translateY(-1px)}
.cd[disabled]{color:rgba(10,21,48,.28);cursor:default}
.cd.st-full span{text-decoration:line-through;text-decoration-color:rgba(10,21,48,.25)}
.cd.today::after{content:"";position:absolute;inset:.1875rem;border-radius:.625rem;border:1px dashed rgba(10,21,48,.25);pointer-events:none}
.dots{display:flex;gap:.1875rem;height:.25rem}
.dots i{width:.25rem;height:.25rem;border-radius:50%;background:var(--ok)}
.cd.st-few .dots i{background:var(--c500)}
.cd.is-sel{background:var(--n900)!important;color:var(--c100);box-shadow:0 .75rem 1.25rem -.75rem rgba(10,21,48,.7)}
.cd.is-sel .dots i{background:var(--c300)}
.cal-leg{display:flex;gap:1.25rem;margin-top:.875rem;font:400 .6875rem/1 var(--f-m);color:var(--ink3)}
.cal-leg span{display:inline-flex;align-items:center;gap:.375rem}
.cal-leg i{display:inline-flex;gap:.1875rem}
.cal-leg i i{width:.3125rem;height:.3125rem;border-radius:50%;background:var(--ok)}
.cal-leg .lg1 i{background:var(--c500)}
.slots{display:flex;flex-direction:column;padding-left:2rem;border-left:1px solid var(--line-l)}
.slots-h{font:400 .6875rem/1 var(--f-m);letter-spacing:.14em;text-transform:uppercase;color:var(--c600);margin-bottom:.625rem}
.slots-d{font:400 1.25rem/1.2 var(--f-d);color:var(--ink);margin-bottom:1rem;min-height:3rem}
.slots-e{font-size:.875rem;color:var(--ink2);margin-bottom:1rem}
.slots-g{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem;margin-bottom:1.25rem}
.sl{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.125rem;height:3rem;border-radius:.75rem;border:1px solid var(--line-l2);font:600 .9375rem/1 var(--f-u);font-variant-numeric:tabular-nums;color:var(--ink);transition:border-color .2s,background-color .2s,transform .2s var(--ease)}
.sl:not([disabled]):hover{border-color:var(--n900);transform:translateY(-1px)}
.sl[disabled]{border-style:dashed;color:rgba(10,21,48,.3);cursor:default;font-weight:500}
.sl small{font:400 .625rem/1 var(--f-m);letter-spacing:.06em;text-transform:uppercase}
.sl.is-sel{background:var(--n900);border-color:var(--n900);color:var(--c100)}
.slots .btn{margin-top:auto}
.slots-sum{display:flex;align-items:flex-start;gap:.5rem;margin:auto 0 .75rem;padding:.625rem .75rem;border-radius:.75rem;background:var(--c100);border:1px solid var(--line-l);font:500 .8125rem/1.4 var(--f-u);color:var(--ink2)}
.slots-sum .ic{width:1rem;height:1rem;margin-top:.0625rem;color:var(--c600)}
.slots-sum b{display:block;font-weight:600;color:var(--ink)}
.slots-sum+.btn{margin-top:0}
.bk-form{display:flex;flex-direction:column;gap:1.5rem;max-width:40rem}
.bk-sum{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:1rem;padding:1rem 1.25rem;border-radius:1rem;background:var(--c100);border:1px solid var(--line-l)}
.bk-sum-ic{display:grid;place-items:center;width:3rem;height:3rem;border-radius:.875rem;background:var(--n900);color:var(--c300)}
.bk-sum-k{font:400 .6875rem/1 var(--f-m);letter-spacing:.14em;text-transform:uppercase;color:var(--c600);margin-bottom:.375rem}
.bk-sum-v{font:400 1.25rem/1.2 var(--f-d);color:var(--ink)}
.bk-sum-s{font-size:.8125rem;color:var(--ink2);margin-top:.25rem}
.bk-f{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}
.bk-f .fld:first-child{grid-column:1 / -1}
.bk-f .btn{grid-column:1 / -1;justify-self:start;margin-top:.25rem}
.bk-f .f-demo{grid-column:1 / -1;justify-content:flex-start}
.bk-done{display:grid;grid-template-columns:auto minmax(0,1fr);gap:2rem;align-items:start}
.bk-ticket{display:flex;flex-direction:column;align-items:center;width:8.5rem;padding:1.25rem 1rem;border-radius:1.25rem;background:var(--n900);color:var(--c100);box-shadow:0 1.5rem 3rem -1.5rem rgba(10,21,48,.7);position:relative}
.bk-ticket::after{content:"";position:absolute;left:1rem;right:1rem;bottom:2.875rem;border-top:1px dashed rgba(223,201,160,.35)}
.tk-m{font:400 .75rem/1 var(--f-m);letter-spacing:.18em;text-transform:uppercase;color:var(--c300)}
.tk-d{font:300 4rem/1 var(--f-d);margin:.375rem 0 1.25rem}
.tk-t{font:600 .9375rem/1 var(--f-u);font-variant-numeric:tabular-nums}
.bk-done-c h3{font:400 2rem/1.1 var(--f-d);color:var(--ink);margin-bottom:.5rem;outline:none}
.bk-done-c .done-ck svg{width:2.75rem;height:2.75rem;margin-bottom:.75rem}
.bk-done-t{color:var(--ink2);margin-bottom:.75rem}
.bk-done-w{display:flex;align-items:center;gap:.5rem;font:600 .875rem/1.4 var(--f-u);color:var(--ink);margin-bottom:1rem}
.bk-done-w .ic{width:1.125rem;height:1.125rem;color:var(--c600)}
.bk-done .done-l{max-width:28rem}
.bk-done .done-links{justify-content:flex-start;align-items:center;gap:.5rem 1.25rem}
@media (max-width:63.99rem){
  .bk{grid-template-columns:minmax(0,1fr)}
  .bk-side{padding:1.25rem}
  .adv{padding-bottom:1rem}
  .seg{flex-direction:row}
  .seg button{grid-template-columns:minmax(0,1fr);justify-items:center;text-align:center;gap:.25rem;flex:1;padding:.625rem .375rem}
  .bk-info{display:none}
  .bk-main{padding:1.25rem}
  .bk-pick{grid-template-columns:minmax(0,1fr);gap:1.5rem}
  .slots{padding-left:0;border-left:0;border-top:1px solid var(--line-l);padding-top:1.25rem}
  .slots-g{grid-template-columns:repeat(3,minmax(0,1fr))}
  .slots-d{min-height:0}
  .bk-done{grid-template-columns:minmax(0,1fr);gap:1.25rem}
  .bk-ticket{flex-direction:row;width:auto;gap:1rem;justify-content:flex-start;padding:1rem 1.25rem}
  .bk-ticket::after{display:none}
  .tk-d{font-size:2.5rem;margin:0}
}
@media (max-width:47.99rem){
  .booker{border-radius:1.25rem}
  .cd{height:2.625rem;border-radius:.625rem;font-size:.875rem}
  .cal-w,.cal-g{gap:.25rem}
  .bk-f{grid-template-columns:minmax(0,1fr)}
  .bk-f .btn{justify-self:stretch}
  .bk-sum{grid-template-columns:auto minmax(0,1fr);padding:.875rem}
  .bk-sum .btn-link{grid-column:1 / -1;justify-self:start;padding-left:0}
  .bk-sum-ic{width:2.5rem;height:2.5rem}
  .bk-sum-v{font-size:1.0625rem}
}

/* ---------- CRM / Board ---------- */
.crm-grid{display:grid;grid-template-columns:minmax(0,25rem) minmax(0,1fr);gap:3.25rem;align-items:start}
.crm-copy h2.display{font-size:2.875rem;margin-bottom:1.25rem}
.flow-h{margin:2.25rem 0 1rem;font:400 .6875rem/1 var(--f-m);letter-spacing:.14em;text-transform:uppercase;color:var(--c400)}
.flow{position:relative;display:flex;flex-direction:column;gap:.25rem}
.flow::before{content:"";position:absolute;left:.6875rem;top:1rem;bottom:1rem;width:1px;background:linear-gradient(180deg,var(--line-d2),rgba(223,201,160,.06))}
.fl{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:.875rem;padding:.5rem 0}
.fl-dot{position:relative;z-index:1;display:grid;place-items:center;width:1.375rem;height:1.375rem;border-radius:50%;background:var(--n950);border:1.5px solid var(--line-d2);color:var(--n950);transition:all .4s var(--ease)}
.fl-dot .ic{width:.8125rem;height:.8125rem;stroke-width:2.6}
.fl-m b{display:block;font:500 .9375rem/1.3 var(--f-u);color:var(--c100)}
.fl-m span{display:block;font:400 .75rem/1.3 var(--f-m);color:var(--mute-d);margin-top:.125rem}
.fl-st{font:400 .6875rem/1 var(--f-m);font-style:normal;padding:.3125rem .5rem;border-radius:999px;border:1px solid var(--line-d2);color:var(--c200);white-space:nowrap}
.fl.st-done .fl-dot{background:var(--ok-d);border-color:var(--ok-d)}
.fl.st-done .fl-st{border-color:rgba(138,211,176,.4);color:var(--ok-d)}
.fl.st-run .fl-dot{border-color:var(--c300);border-top-color:transparent;animation:spin .9s linear infinite}
.fl.st-skip{opacity:.5}
.fl.st-skip .fl-m b{text-decoration:line-through;text-decoration-color:rgba(246,240,228,.4)}
.crm-try{display:flex;flex-direction:column;align-items:flex-start;gap:1rem;margin-top:2rem;padding:1.25rem;border-radius:1rem;border:1px dashed var(--line-d2);background:rgba(223,201,160,.04)}
.crm-try p{font-size:.875rem;line-height:1.5;color:var(--mute-d)}
.board{border-radius:1.5rem;background:linear-gradient(180deg,#101F40,#0B1631);border:1px solid var(--line-d);box-shadow:0 3rem 6rem -3rem rgba(0,0,0,.8),inset 0 1px 0 rgba(223,201,160,.1);overflow:hidden}
.bd-top{display:flex;align-items:center;gap:.75rem;padding:1rem 1.25rem;border-bottom:1px solid var(--line-d)}
.bd-logo svg{width:1.5rem;height:1.5rem;fill:none;stroke:var(--c300);stroke-width:1.8;stroke-linejoin:round}
.bd-logo .lp{fill:var(--c300);stroke:none}
.bd-top b{font:600 .9375rem/1 var(--f-u);color:var(--c50)}
.bd-live{display:inline-flex;align-items:center;gap:.375rem;font:400 .6875rem/1 var(--f-m);color:var(--ok-d);text-transform:uppercase;letter-spacing:.1em}
.bd-live i{position:relative;width:.4375rem;height:.4375rem;border-radius:50%;background:var(--ok-d)}
.bd-live i::after{content:"";position:absolute;inset:0;border-radius:50%;border:1px solid var(--ok-d);animation:pulse 2.2s ease-out infinite}
.bd-tag{margin-left:auto;padding:.3125rem .5rem;border-radius:.375rem;border:1px solid var(--line-d2);font:400 .625rem/1 var(--f-m);letter-spacing:.1em;text-transform:uppercase;color:var(--c300)}
.bd-kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.75rem;padding:1rem 1.25rem}
.kpi{position:relative;display:flex;flex-direction:column;gap:.375rem;padding:.875rem 1rem;border-radius:.875rem;background:rgba(6,13,29,.5);border:1px solid var(--line-d);overflow:hidden}
.kpi-l{font:500 .6875rem/1.2 var(--f-u);color:var(--mute-d)}
.kpi b{font:300 1.875rem/1 var(--f-d);color:var(--c50);font-variant-numeric:lining-nums tabular-nums;display:inline-block;transform-origin:left center}
.kpi b.bump{animation:bump .6s var(--ease)}
@keyframes bump{0%{color:var(--c300);transform:scale(1.12)}100%{color:var(--c50);transform:none}}
.kpi-bars{position:absolute;right:.875rem;bottom:.875rem;display:flex;align-items:flex-end;gap:.1875rem;height:1.75rem}
.kpi-bars i{width:.3125rem;border-radius:1px;background:rgba(223,201,160,.3);transition:height .5s var(--ease)}
.kpi-bars i.now{background:var(--c300)}
.bd-cols{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.5rem;padding:0 1.25rem 1.25rem;outline:none}
.bd-cols:focus-visible{outline:2px solid var(--c300);outline-offset:-2px}
.col{display:flex;flex-direction:column;min-width:0;padding:.4375rem;border-radius:.875rem;background:rgba(6,13,29,.35);border:1px solid rgba(223,201,160,.07)}
.col header{display:flex;align-items:center;justify-content:space-between;padding:.25rem .375rem .625rem}
.col header span{font:600 .75rem/1 var(--f-u);color:var(--c100);display:inline-flex;align-items:center;gap:.375rem}
.col header span::before{content:"";width:.4375rem;height:.4375rem;border-radius:50%;background:var(--cc,#6B80AD)}
.col-new{--cc:#DFC9A0}.col-con{--cc:#8FA6D8}.col-app{--cc:#8AD3B0}.col-won{--cc:#C7B4F0}
.col header b{font:400 .6875rem/1 var(--f-m);color:var(--mute-d);padding:.25rem .4375rem;border-radius:999px;background:rgba(223,201,160,.08);font-variant-numeric:tabular-nums}
.col-list{display:flex;flex-direction:column;gap:.4375rem;height:25.5rem;overflow:hidden}
.col-more{font:400 .625rem/1 var(--f-m);color:rgba(169,180,203,.7);text-align:center;padding-top:.5rem;min-height:1.125rem}
.card{position:relative;padding:.625rem .5625rem;border-radius:.75rem;background:#152A52;border:1px solid rgba(223,201,160,.1);box-shadow:0 .5rem 1rem -.75rem rgba(0,0,0,.6)}
.card-h{display:flex;align-items:center;gap:.4375rem;margin-bottom:.4375rem;min-width:0}
.av{display:grid;place-items:center;width:1.375rem;height:1.375rem;flex:none;border-radius:50%;background:#2A4476;color:var(--c100);font:600 .5625rem/1 var(--f-u);letter-spacing:.02em}
.card-h b{flex:1;min-width:0;font:600 .75rem/1.2 var(--f-u);color:var(--c50);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.src{display:grid;place-items:center;width:1.25rem;height:1.25rem;flex:none;border-radius:.375rem;background:rgba(223,201,160,.12);color:var(--c300)}
.src .ic{width:.75rem;height:.75rem;stroke-width:2}
.src-book{background:rgba(138,211,176,.14);color:var(--ok-d)}
.card-o{font:400 .6875rem/1.35 var(--f-u);color:#C4CCDD;margin-bottom:.5rem}
.card-o span{display:block;color:var(--mute-d)}
.card-f{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.25rem .375rem;min-width:0;padding-top:.4375rem;border-top:1px solid rgba(223,201,160,.08)}
.card-f time{font:400 .5625rem/1 var(--f-m);color:var(--mute-d);white-space:nowrap}
.card-v{font:600 .6875rem/1 var(--f-u);color:var(--c300);font-variant-numeric:tabular-nums;white-space:nowrap}
.card-w{display:inline-flex;align-items:center;gap:.3125rem;font:600 .6875rem/1 var(--f-u);color:var(--ok-d);white-space:nowrap;min-width:0;overflow:hidden;text-overflow:ellipsis}
.card-w .ic{width:.8125rem;height:.8125rem;flex:none}
.card.me{background:linear-gradient(160deg,#2A3F6E,#1A2F5C);border-color:var(--c300);box-shadow:0 0 0 1px rgba(223,201,160,.4),0 0 1.5rem -.25rem rgba(223,201,160,.4)}
.card.me .av{background:var(--c300);color:var(--n950)}
@media (max-width:63.99rem){.crm-grid{grid-template-columns:minmax(0,1fr);gap:2.5rem}.crm-copy h2.display{font-size:2.5rem}}
@media (max-width:47.99rem){
  .crm-copy h2.display{font-size:2.125rem}
  .board{border-radius:1.125rem;margin-inline:calc(-1 * var(--g) + .5rem)}
  .bd-top{padding:.875rem 1rem}
  .bd-kpis{grid-template-columns:repeat(3,minmax(0,1fr));gap:.5rem;padding:.875rem 1rem}
  .kpi{padding:.625rem .625rem}
  .kpi b{font-size:1.5rem}
  .kpi-bars{display:none}
  .bd-cols{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;padding:0 1rem 1rem;scrollbar-width:thin;scrollbar-color:rgba(223,201,160,.3) transparent}
  .col{flex:0 0 13.5rem;scroll-snap-align:start}
}

/* ---------- Footer ---------- */
.ftr{background:var(--n950);border-top:1px solid var(--line-d);color:var(--mute-d)}
.ft-cta{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:2rem;padding:3.5rem 0 3rem;border-bottom:1px solid var(--line-d)}
.ft-cta h2{font:300 2.75rem/1.05 var(--f-d);letter-spacing:-.025em;color:var(--c50);margin-bottom:.75rem}
.ft-cta p{color:var(--mute-d)}
.ft-cta-b{display:flex;gap:.75rem;flex-wrap:wrap}
.ft-grid{display:grid;grid-template-columns:minmax(0,1.4fr) repeat(3,minmax(0,1fr));gap:2rem;padding:2.5rem 0}
.ft-grid h3{font:400 .6875rem/1 var(--f-m);letter-spacing:.14em;text-transform:uppercase;color:var(--c400);margin-bottom:1rem}
.ft-grid p,.ft-grid li{font-size:.875rem;line-height:1.7}
.ft-about{max-width:20rem;margin-top:1rem}
.ft-grid .logo{pointer-events:none}
.ft-link{color:var(--c100);text-decoration:underline;text-decoration-color:rgba(223,201,160,.35);text-underline-offset:.2em;font-size:.875rem;transition:text-decoration-color .2s}
.ft-link:hover{text-decoration-color:var(--c300)}
.ft-bottom{display:flex;justify-content:space-between;gap:1rem 2rem;flex-wrap:wrap;padding:1.5rem 0 2rem;border-top:1px solid var(--line-d);font:400 .75rem/1.5 var(--f-u);color:rgba(169,180,203,.75)}
.ft-fict{max-width:44rem}
@media (max-width:63.99rem){.ft-cta{grid-template-columns:minmax(0,1fr)}.ft-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.ft-grid>div:first-child{grid-column:1 / -1}}
@media (max-width:47.99rem){.ft-cta{padding:3rem 0 2.5rem}.ft-cta h2{font-size:2rem}.ft-cta-b{flex-direction:column}.ft-cta-b .btn{width:100%}.ft-grid{padding:2.25rem 0;gap:1.75rem 1rem}.ftr{padding-bottom:4.5rem}}

/* ---------- Mobile CTA-Leiste, Toast, Dialog ---------- */
.mbar{position:fixed;left:.75rem;right:.75rem;bottom:.75rem;z-index:40;display:none;gap:.5rem;padding:.5rem;border-radius:999px;background:rgba(6,13,29,.88);border:1px solid var(--line-d2);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 1rem 2rem -1rem rgba(0,0,0,.7);transform:translateY(150%);visibility:hidden;transition:transform .45s var(--ease),visibility 0s .45s}
.mbar .btn{flex:1;--bh:2.75rem;font-size:.875rem;padding:0 .75rem}
.mbar .btn-ghost{flex:0 0 auto;padding:0 1.25rem}
.mbar.show{transform:none;visibility:visible;transition:transform .45s var(--ease),visibility 0s}
@media (max-width:47.99rem){.mbar{display:flex}}
.toast{position:fixed;left:auto;right:1.5rem;bottom:1.5rem;z-index:60;display:flex;align-items:center;gap:.75rem;padding:.625rem .625rem .625rem 1rem;border-radius:999px;background:var(--c50);color:var(--ink);box-shadow:0 1.5rem 3rem -1rem rgba(0,0,0,.55),0 0 0 1px rgba(223,201,160,.6);
  transform:translateY(180%);opacity:0;transition:transform .5s var(--ease),opacity .3s;max-width:calc(100% - 1.5rem)}
.toast.show{transform:none;opacity:1}
.toast-ic{display:grid;place-items:center;width:1.75rem;height:1.75rem;flex:none;border-radius:50%;background:var(--ok);color:#fff}
.toast-ic .ic{width:1rem;height:1rem;stroke-width:2.4}
.toast-t{font:600 .875rem/1.3 var(--f-u)}
.toast .btn{--bh:2.25rem;font-size:.8125rem;padding:0 .875rem}
@media (max-width:47.99rem){.toast{bottom:5.25rem;left:.75rem;right:.75rem;transform:translateY(220%);border-radius:1rem}.toast.show{transform:none}.toast-t{flex:1;font-size:.8125rem}}
.dlg{max-width:30rem;width:calc(100% - 2rem);padding:2rem;border:0;border-radius:1.25rem;background:var(--c50);color:var(--ink);box-shadow:0 2rem 5rem -1rem rgba(0,0,0,.6)}
.dlg::backdrop{background:rgba(6,13,29,.7);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
.dlg h2{font:400 1.75rem/1.1 var(--f-d);margin-bottom:.75rem}
.dlg p{color:var(--ink2);line-height:1.6;margin-bottom:1.5rem}