/* ==========================================================================
   heloo · Stylesheet
   Basis: Corporate Design Manual v2.6
   Farben sind bewusst hart codiert. Wer sie ändern will, ändert sie hier und
   in design-tokens.json, sonst laufen App und Web auseinander.
   ========================================================================== */

@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;src:url('/static/fonts/inter-400.woff2') format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:500;font-display:swap;src:url('/static/fonts/inter-500.woff2') format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:700;font-display:swap;src:url('/static/fonts/inter-700.woff2') format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:800;font-display:swap;src:url('/static/fonts/inter-800.woff2') format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:900;font-display:swap;src:url('/static/fonts/inter-900.woff2') format('woff2')}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:400;font-display:swap;src:url('/static/fonts/jetbrains-400.woff2') format('woff2')}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:500;font-display:swap;src:url('/static/fonts/jetbrains-500.woff2') format('woff2')}

/* =====================================================================
   heloo Landingpage v2.0
   Basis: Corporate Design Manual v2.6

   AENDERUNGEN GEGENUEBER v1:
   - Sicherheit statt Preis als Leitargument im Hero
   - Jüngere Palette: Lime, Mint, Pink tragen die Akzente,
     Blau und Violett nur noch im Markenpunkt
   - Keine Aussagen zur Werbefreiheit mehr
   - Konkreter Wettbewerbsvergleich mit Stand und Quellenhinweis

   FUER DIE UMSETZUNG:
   - Jede Section trägt data-component. Das ist die Komponentengrenze.
   - Wiederholte Blöcke tragen data-item, sie werden zu Arrays.
   - Klassen BEM-nah: .block__element--modifier
   - Farben hart codiert (Projektregel). Im Build tokens.css nutzen.
   ===================================================================== */

*{margin:0;padding:0;box-sizing:border-box}
html{background:#04081A !important;color-scheme:dark;scroll-behavior:smooth}
body{background:#04081A !important;color:#ffffff;font-family:'Inter',system-ui,sans-serif;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
.bg-fix{position:fixed;inset:0;background:#04081A;z-index:-1;pointer-events:none}
::selection{background:#8B9BFF;color:#04081A}
a{color:inherit;text-decoration:none}
img,svg{display:block;max-width:100%}

.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip{position:absolute;left:-9999px;top:0;background:#C8FF3D;color:#04081A;padding:12px 18px;border-radius:0 0 10px 0;font-weight:700;font-size:14px;z-index:200}
.skip:focus{left:0}
.wrap{max-width:1180px;margin:0 auto;padding:0 clamp(20px,4vw,44px)}
.section{padding:clamp(80px,11vw,140px) 0;position:relative;background:#04081A}
.section--line{border-top:1px solid rgba(255,255,255,0.09)}

/* ---- Bausteine ---- */
.pt{display:inline-block;width:0.17em;height:0.17em;border-radius:50%;background:linear-gradient(135deg,#1A56FF 0%,#7B2FFF 100%);margin-left:0.08em;vertical-align:baseline}
/* Lebender Punkt: atmet 2.8 s, Farbzyklus 12 s. Nur Marketing, nie in der App. */
.pt--live{position:relative;animation:heloo-breathe 2.8s ease-in-out infinite}
.pt--live::before,.pt--live::after{content:"";position:absolute;inset:0;border-radius:50%}
.pt--live::before{background:linear-gradient(135deg,#7B2FFF 0%,#FF7AD9 100%);animation:heloo-hueA 12s ease-in-out infinite}
.pt--live::after{background:linear-gradient(135deg,#2FE6A8 0%,#C8FF3D 100%);animation:heloo-hueB 12s ease-in-out infinite}
@keyframes heloo-breathe{0%,100%{transform:scale(1)}50%{transform:scale(0.74)}}
@keyframes heloo-hueA{0%,25%{opacity:0}33%,58%{opacity:1}67%,100%{opacity:0}}
@keyframes heloo-hueB{0%,58%{opacity:0}67%,92%{opacity:1}100%{opacity:0}}

.wm{font-weight:900;letter-spacing:-0.05em;line-height:1;white-space:nowrap;color:#ffffff}
.label{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:11px;font-weight:500;letter-spacing:0.18em;text-transform:uppercase;color:#8B9BFF}
.eyebrow{display:flex;align-items:center;gap:13px;margin-bottom:22px}
.eyebrow::after{content:"";flex:1;height:1px;background:rgba(255,255,255,0.14);max-width:90px}
.h1{font-size:clamp(38px,6.6vw,78px);font-weight:900;letter-spacing:-0.042em;line-height:0.98;color:#ffffff}
.h2{font-size:clamp(30px,4.4vw,52px);font-weight:900;letter-spacing:-0.035em;line-height:1.03;color:#ffffff}
.lede{font-size:clamp(16px,1.9vw,19px);color:rgba(255,255,255,0.8);max-width:620px;margin-top:20px}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;border:none;cursor:pointer;
     font-family:inherit;font-weight:700;font-size:15px;line-height:1;padding:16px 26px;border-radius:12px;
     transition:transform 175ms cubic-bezier(0,0,.2,1),opacity 175ms cubic-bezier(0,0,.2,1)}
/* Primär-CTA in Lime mit Nacht-Schrift. Kontrast 15.9 : 1 */
.btn--primary{background:#C8FF3D;color:#04081A}
.btn--ghost{background:transparent;color:rgba(255,255,255,0.9);border:1px solid rgba(255,255,255,0.2)}
.btn:hover{opacity:.9}
.btn:active{transform:scale(.98)}
.btn:focus-visible{outline:2px solid #C8FF3D;outline-offset:3px}

/* =============== NAV =============== */
.nav{position:sticky;top:0;z-index:60;background:rgba(4,8,26,0.86);backdrop-filter:blur(18px);border-bottom:1px solid rgba(255,255,255,0.08)}
.nav__inner{display:flex;align-items:center;justify-content:space-between;height:68px}
.nav__brand{font-size:22px}
.nav__links{display:flex;gap:24px}
.nav__links a{font-size:14px;font-weight:500;color:rgba(255,255,255,0.66);transition:color .2s}
.nav__links a:hover{color:#ffffff}
.nav__cta{padding:11px 20px;font-size:14px}
@media(max-width:980px){.nav__links{display:none}}

/* =============== SPRACHUMSCHALTER =============== */
.lang{display:flex;gap:2px;align-items:center;background:#070D22;border:1px solid rgba(255,255,255,0.1);border-radius:10px;padding:3px}
.lang__btn{background:none;border:none;cursor:pointer;text-decoration:none;display:inline-block;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10px;
  letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,0.5);padding:6px 8px;border-radius:7px;transition:color .2s,background .2s}
.lang__btn:hover{color:#ffffff}
.lang__btn[aria-current="true"]{background:rgba(255,255,255,0.1);color:#ffffff;font-weight:600}
.nav__right{display:flex;align-items:center;gap:12px}
@media(max-width:560px){.lang__btn{padding:6px 6px;font-size:9px}.nav__cta{padding:11px 14px}}

/* =============== ZIELGRUPPEN-UMSCHALTER ===============
   Besucher wählen oben ihre Rolle. Der Hero wechselt Kicker, Headline,
   Einleitung, Kennzeichen und beide Aktionen. Alles andere bleibt gleich,
   damit die Seite eine Seite bleibt und nicht in zwei zerfällt. */
.aud{display:inline-flex;gap:3px;background:#070D22;border:1px solid rgba(255,255,255,0.11);border-radius:12px;padding:4px;margin-bottom:26px}
.aud__btn{background:none;border:none;cursor:pointer;font-family:inherit;font-size:13px;font-weight:600;
  color:rgba(255,255,255,0.55);padding:9px 18px;border-radius:9px;transition:color .2s,background .2s;white-space:nowrap}
.aud__btn:hover{color:#ffffff}
.aud__btn[aria-selected="true"]{background:#C8FF3D;color:#04081A;font-weight:700}
.aud__btn:focus-visible{outline:2px solid #C8FF3D;outline-offset:2px}

/* =============== HERO =============== */
.hero{position:relative;overflow:hidden;padding:clamp(66px,9vw,110px) 0 clamp(70px,9vw,110px)}
.hero__glow{position:absolute;width:1000px;height:1000px;border-radius:50%;top:-460px;right:-300px;pointer-events:none;
  background:radial-gradient(circle,rgba(47,230,168,0.14) 0%,rgba(200,255,61,0.06) 42%,rgba(4,8,26,0) 70%)}
.hero__grid{display:grid;grid-template-columns:minmax(0,1fr) 336px;gap:clamp(40px,6vw,76px);align-items:center;position:relative}
@media(max-width:980px){.hero__grid{grid-template-columns:1fr}}
.hero__h1 em{font-style:normal;color:#C8FF3D}
.hero__claim{font-size:clamp(21px,2.8vw,28px);font-weight:800;letter-spacing:-0.025em;color:#ffffff;margin-top:24px}
.hero__actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:34px}
.hero__meta{display:flex;gap:24px;flex-wrap:wrap;margin-top:30px}
.hero__meta span{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10.5px;letter-spacing:0.14em;color:rgba(255,255,255,0.62);text-transform:uppercase;display:flex;align-items:center;gap:8px}
.hero__meta span::before{content:"";width:7px;height:7px;border-radius:50%;background:#2FE6A8;flex-shrink:0}

/* Telefon */
.phone{width:100%;max-width:318px;margin:0 auto;aspect-ratio:9/18.6;background:#04081A;border:1px solid rgba(255,255,255,0.16);
       border-radius:38px;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 40px 90px rgba(0,0,0,.6)}
.phone__status{display:flex;justify-content:space-between;padding:14px 22px 4px;font-size:11px;font-weight:600}
.phone__status i{font-style:normal;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:9.5px;color:rgba(255,255,255,0.72);letter-spacing:.06em}
.phone__body{flex:1;display:flex;flex-direction:column;padding:0 16px;overflow:hidden}
.phone__head{display:flex;align-items:center;gap:10px;padding:11px 0;border-bottom:1px solid rgba(255,255,255,0.08)}
.phone__avatar{width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,#2FE6A8,#C8FF3D);display:flex;align-items:center;justify-content:center;font-weight:800;font-size:14px;color:#04081A;position:relative}
.phone__avatar i{position:absolute;right:0;bottom:0;width:10px;height:10px;border-radius:50%;background:#2FE6A8;border:2px solid #04081A}
.phone__name{font-size:14px;font-weight:700}
.phone__state{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:8.5px;letter-spacing:.12em;color:#2FE6A8;text-transform:uppercase}
.phone__e2e{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:8px;letter-spacing:.1em;color:#2FE6A8;text-align:center;padding:12px 14px;line-height:1.8}
.phone__msgs{flex:1;display:flex;flex-direction:column;gap:8px;justify-content:flex-end;padding-bottom:12px}
.bubble{padding:9px 14px;border-radius:20px;font-size:12.5px;line-height:1.42;max-width:80%}
.bubble--in{background:#0E1736;border-bottom-left-radius:6px;align-self:flex-start}
.bubble--out{background:#C8FF3D;color:#04081A;border-bottom-right-radius:6px;align-self:flex-end}
.bubble time{display:block;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:7.5px;opacity:.68;margin-top:4px;text-align:right}
.typing{display:inline-flex;gap:5px;background:#0E1736;border-radius:20px;border-bottom-left-radius:6px;padding:12px 15px;align-self:flex-start}
.typing i{width:6px;height:6px;border-radius:50%;background:linear-gradient(135deg,#2FE6A8,#C8FF3D);animation:ty 1.4s ease-in-out infinite}
.typing i:nth-child(2){animation-delay:.2s}
.typing i:nth-child(3){animation-delay:.4s}
@keyframes ty{0%,100%{transform:translateY(0);opacity:.5}50%{transform:translateY(-5px);opacity:1}}
.phone__input{display:flex;gap:8px;align-items:center;padding:8px 0 6px}
.phone__field{flex:1;background:#070D22;border:1px solid rgba(255,255,255,0.09);border-radius:20px;padding:9px 14px;font-size:12px;color:rgba(255,255,255,0.45)}
.phone__send{width:34px;height:34px;border-radius:50%;background:#C8FF3D;color:#04081A;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700;flex-shrink:0}
.phone__bar{width:104px;height:4px;border-radius:4px;background:rgba(255,255,255,0.28);margin:8px auto 12px}

/* =============== TRUST-LEISTE ===============
   Standards und Nachweise direkt unter dem Hero. Für Enterprise-Käufer
   der wichtigste Block der Seite, deshalb vor allen Produktargumenten. */
.trust{border-top:1px solid rgba(255,255,255,0.09);border-bottom:1px solid rgba(255,255,255,0.09);background:#060B1C;padding:26px 0}
.trust__inner{display:flex;flex-wrap:wrap;align-items:center;gap:14px 34px;justify-content:space-between}
.trust__lead{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,0.42)}
.trust__items{display:flex;flex-wrap:wrap;gap:12px 26px}
.trust__item{display:flex;align-items:center;gap:9px;font-size:12.5px;font-weight:600;color:rgba(255,255,255,0.82);white-space:nowrap}
.trust__item svg{width:15px;height:15px;flex-shrink:0}
.trust__item .tick{fill:none;stroke:#2FE6A8;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.trust__item--soon{color:rgba(255,255,255,0.52);font-weight:500}
.trust__item--soon .tick{stroke:rgba(255,255,255,0.34)}

/* =============== PROOF =============== */
.proof{border-top:1px solid rgba(255,255,255,0.09);border-bottom:1px solid rgba(255,255,255,0.09);background:#070D22}
.proof__inner{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:rgba(255,255,255,0.08)}
@media(max-width:860px){.proof__inner{grid-template-columns:repeat(2,1fr)}}
.proof__item{background:#070D22;padding:30px 26px}
.proof__value{font-size:25px;font-weight:900;letter-spacing:-0.03em;color:#ffffff}
.proof__key{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,0.62);margin-top:9px}

/* =============== ICON-SYSTEM ===============
   Eine Grammatik für alle Icons: geschlossene Außenform (Outline, 1.7 px,
   runde Kappen, 24er Raster) plus Knotenpunkte aus dem Marken-Punkt.
   Ein Knoten je Icon trägt die Akzentfarbe. Keine Fremdicons, keine Emoji. */
.ico{width:26px;height:26px;display:block}
.ico .frame{fill:none;stroke:rgba(255,255,255,0.52);stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.ico .link{stroke:rgba(255,255,255,0.3);stroke-width:1.3;stroke-linecap:round}
.ico .n{fill:rgba(255,255,255,0.88)}
.ico .a{fill:#2FE6A8}
.ent__icon .ico .a{fill:#8B9BFF}
.mod:hover .ico .frame,.ent__card:hover .ico .frame{stroke:rgba(255,255,255,0.72)}
.ico .frame,.ico .link{transition:stroke .2s}

/* =============== MODULE =============== */
.head{max-width:780px}
.mods{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:56px}
@media(max-width:980px){.mods{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.mods{grid-template-columns:1fr}}
.mod{background:#070D22;border:1px solid rgba(255,255,255,0.09);border-radius:18px;padding:32px 28px;transition:border-color .2s,transform .2s}
.mod:hover{border-color:rgba(139,155,255,0.4);transform:translateY(-2px)}
.mod--wide{grid-column:1/-1;display:grid;grid-template-columns:auto 1fr auto;gap:24px;align-items:center}
.mod--wide .mod__icon{margin-bottom:0}
.mod--wide .mod__title{margin-bottom:6px}
.mod--wide .mod__tag{margin-top:0}
@media(max-width:620px){.mod--wide{grid-template-columns:1fr;gap:14px}}
.mod__icon{width:46px;height:46px;border-radius:13px;background:#0E1736;border:1px solid rgba(255,255,255,0.1);display:flex;align-items:center;justify-content:center;margin-bottom:20px}
.mod__title{font-size:18px;font-weight:700;letter-spacing:-0.015em;margin-bottom:9px}
.mod__text{font-size:13.5px;color:rgba(255,255,255,0.7);line-height:1.6}
.mod__tag{display:inline-block;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:9px;letter-spacing:.14em;text-transform:uppercase;
  color:#2FE6A8;background:rgba(47,230,168,0.1);border:1px solid rgba(47,230,168,0.24);padding:4px 10px;border-radius:20px;margin-top:16px}

/* =============== SICHERHEIT =============== */
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(36px,5vw,72px);align-items:center}
@media(max-width:980px){.split{grid-template-columns:1fr}}
.facts{border:1px solid rgba(255,255,255,0.09);border-radius:18px;overflow:hidden;background:#070D22}
.fact{display:flex;justify-content:space-between;align-items:baseline;gap:20px;padding:18px 24px;border-bottom:1px solid rgba(255,255,255,0.07)}
.fact:last-child{border-bottom:none}
.fact__k{font-size:14px;font-weight:600;color:#ffffff}
.fact__v{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:11px;letter-spacing:.1em;color:#2FE6A8;text-align:right;white-space:nowrap}
.checks{list-style:none;margin-top:30px;display:grid;gap:13px}
.checks li{display:flex;gap:12px;align-items:flex-start;font-size:15px;color:rgba(255,255,255,0.84)}
.checks li::before{content:"";width:8px;height:8px;border-radius:50%;background:#2FE6A8;flex-shrink:0;margin-top:8px}

/* =============== STATEMENT =============== */
.statement{background:#C8FF3D;border-radius:24px;padding:clamp(44px,7vw,88px) clamp(28px,5vw,64px);color:#04081A}
.statement__text{font-size:clamp(30px,5vw,58px);font-weight:900;letter-spacing:-0.04em;line-height:1.0;max-width:900px}
.statement__foot{display:flex;justify-content:space-between;align-items:baseline;flex-wrap:wrap;gap:16px;margin-top:clamp(32px,5vw,56px)}
.statement__wm{font-size:24px;font-weight:900;letter-spacing:-0.05em;color:#04081A}
.statement__wm .pt{background:#04081A}
.statement__note{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:rgba(4,8,26,0.72)}

/* =============== VERGLEICH ===============
   Binär: erfüllt oder nicht. Keine Zwischentöne, keine Fußnoten in den Zellen.
   Die eigene Spalte ist durchgehend hervorgehoben und trägt die Summenzeile. */
.cmp{margin-top:52px;border:1px solid rgba(255,255,255,0.09);border-radius:18px;overflow:hidden}
.cmp__scroll{overflow-x:auto}
.cmp table{width:100%;border-collapse:collapse;min-width:760px}
.cmp th{padding:20px 14px;background:#070D22;border-bottom:1px solid rgba(255,255,255,0.1);
  font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10px;letter-spacing:.16em;text-transform:uppercase;
  color:rgba(255,255,255,0.58);font-weight:500;white-space:nowrap;text-align:center}
.cmp th:first-child{text-align:left;padding-left:20px}
.cmp th.is-own{color:#ffffff;background:#0E1736;font-weight:700;font-size:12px;letter-spacing:.1em;border-top:2px solid #C8FF3D}
.cmp td{padding:15px 14px;border-bottom:1px solid rgba(255,255,255,0.06);font-size:14px;
  color:rgba(255,255,255,0.72);background:#04081A;text-align:center}
.cmp td:first-child{color:#ffffff;font-weight:600;text-align:left;padding-left:20px;white-space:nowrap}
.cmp td.is-own{background:rgba(200,255,61,0.08);border-left:1px solid rgba(200,255,61,0.28);border-right:1px solid rgba(200,255,61,0.28)}
.mark{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:50%;font-size:13px;font-weight:700;line-height:1}
.mark--yes{background:rgba(47,230,168,0.14);color:#2FE6A8}
.mark--no{background:rgba(255,255,255,0.05);color:rgba(255,255,255,0.32)}
.is-own .mark--yes{background:#C8FF3D;color:#04081A}
.cmp tr.sum td{background:#070D22;border-top:1px solid rgba(255,255,255,0.12);border-bottom:none;
  font-family:'JetBrains Mono',ui-monospace,monospace;font-size:15px;font-weight:600;color:rgba(255,255,255,0.62);padding:20px 14px}
.cmp tr.sum td:first-child{font-family:'Inter',sans-serif;font-size:13.5px;color:rgba(255,255,255,0.7);letter-spacing:0}
.cmp tr.sum td.is-own{color:#C8FF3D;font-size:19px;font-weight:700;border-bottom:1px solid rgba(200,255,61,0.28)}
.cmp__src{padding:18px 20px 20px;background:#070D22;border-top:1px solid rgba(255,255,255,0.08);
  font-family:'JetBrains Mono',ui-monospace,monospace;font-size:9.5px;letter-spacing:.06em;color:rgba(255,255,255,0.5);line-height:2}

/* =============== PREIS =============== */
.plans{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:52px;align-items:stretch}
@media(max-width:900px){.plans{grid-template-columns:1fr}}
.plan{border:1px solid rgba(255,255,255,0.11);border-radius:24px;background:#070D22;padding:clamp(32px,4vw,48px);display:flex;flex-direction:column;position:relative;overflow:hidden}
.plan--lead{border-color:rgba(200,255,61,0.32)}
.plan--lead::before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,#C8FF3D,#2FE6A8,rgba(4,8,26,0))}
.plan__tag{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:#C8FF3D;margin-bottom:20px}
.plan--ent .plan__tag{color:#8B9BFF}
.plan__value{font-size:clamp(48px,7vw,74px);font-weight:900;letter-spacing:-0.045em;line-height:1;color:#ffffff}
.plan__value small{font-size:0.26em;font-weight:600;color:rgba(255,255,255,0.6);letter-spacing:0}
.plan__value--ask{font-size:clamp(29px,4vw,42px)}
.plan__sub{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,0.6);margin-top:18px}
.plan__list{list-style:none;display:grid;gap:12px;margin-top:28px;flex:1}
.plan__list li{display:flex;gap:12px;align-items:flex-start;font-size:14.5px;color:rgba(255,255,255,0.82);line-height:1.55}
.plan__list li::before{content:"";width:8px;height:8px;border-radius:50%;flex-shrink:0;margin-top:7px}
.plan--lead .plan__list li::before{background:#C8FF3D}
.plan--ent .plan__list li::before{background:#8B9BFF}
.plan .btn{margin-top:30px;width:100%}

/* =============== ENTERPRISE =============== */
.ent{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:52px}
@media(max-width:900px){.ent{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.ent{grid-template-columns:1fr}}
.ent__card{background:#070D22;border:1px solid rgba(255,255,255,0.09);border-radius:18px;padding:28px 26px;transition:border-color .2s,transform .2s}
.ent__card:hover{border-color:rgba(139,155,255,0.4);transform:translateY(-2px)}
.ent__card h3{font-size:17px;font-weight:700;letter-spacing:-0.015em;margin:16px 0 8px}
.ent__card p{font-size:13px;color:rgba(255,255,255,0.7);line-height:1.6}
.ent__icon{width:46px;height:46px;border-radius:13px;background:#0E1736;border:1px solid rgba(255,255,255,0.1);display:flex;align-items:center;justify-content:center}
.ent__cta{border:1px solid rgba(255,255,255,0.11);border-radius:20px;background:#070D22;padding:clamp(30px,4vw,44px);margin-top:16px;display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap}
.ent__cta div h3{font-size:20px;font-weight:700;letter-spacing:-0.02em;margin-bottom:8px}
.ent__cta div p{font-size:14px;color:rgba(255,255,255,0.7);max-width:560px}

/* =============== RISIKO =============== */
.risk{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:52px}
@media(max-width:900px){.risk{grid-template-columns:1fr}}
.risk__card{background:#070D22;border:1px solid rgba(255,255,255,0.09);border-radius:18px;padding:34px 28px;display:flex;flex-direction:column}
.risk__value{font-size:clamp(34px,4.4vw,46px);font-weight:900;letter-spacing:-0.04em;line-height:1;color:#FFB347}
.risk__label{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,0.62);margin-top:16px;line-height:1.9}
.risk__text{font-size:13.5px;color:rgba(255,255,255,0.72);line-height:1.65;margin-top:16px;flex:1}
.risk__src{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:9.5px;letter-spacing:.08em;color:rgba(255,255,255,0.45);margin-top:18px;padding-top:14px;border-top:1px solid rgba(255,255,255,0.08);line-height:1.8}

/* =============== FAQ =============== */
.faq{margin-top:52px;border:1px solid rgba(255,255,255,0.09);border-radius:18px;overflow:hidden;background:#070D22}
.faq details{border-bottom:1px solid rgba(255,255,255,0.07)}
.faq details:last-child{border-bottom:none}
.faq summary{cursor:pointer;list-style:none;padding:22px 26px;font-size:15.5px;font-weight:600;color:#ffffff;display:flex;justify-content:space-between;gap:20px;align-items:center}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-family:'JetBrains Mono',ui-monospace,monospace;font-size:17px;color:#8B9BFF;flex-shrink:0}
.faq details[open] summary::after{content:"–"}
.faq p{padding:0 26px 24px;font-size:14.5px;color:rgba(255,255,255,0.72);line-height:1.7;max-width:800px}

/* =============== CTA =============== */
.cta{text-align:center;position:relative;overflow:hidden}
.cta__glow{position:absolute;width:900px;height:900px;border-radius:50%;left:50%;transform:translateX(-50%);bottom:-570px;pointer-events:none;
  background:radial-gradient(circle,rgba(200,255,61,0.15) 0%,rgba(47,230,168,0.06) 45%,rgba(4,8,26,0) 70%)}
.cta__wm{font-size:clamp(52px,10vw,110px);position:relative}
.cta__actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:34px;position:relative}
.cta__hint{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,0.5);margin-top:20px;position:relative}

/* =============== FOOTER =============== */
.footer{border-top:1px solid rgba(255,255,255,0.09);padding:64px 0 44px;background:#04081A}
.footer__grid{display:grid;grid-template-columns:1.6fr repeat(3,1fr);gap:40px}
@media(max-width:860px){.footer__grid{grid-template-columns:1fr 1fr;gap:32px}}
.footer__col h4{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:#8B9BFF;margin-bottom:16px;font-weight:500}
.footer__col a{display:block;font-size:14px;color:rgba(255,255,255,0.66);padding:6px 0;transition:color .2s}
.footer__col a:hover{color:#ffffff}
.footer__brand .wm{font-size:26px;margin-bottom:14px}
.footer__brand p{font-size:13.5px;color:rgba(255,255,255,0.6);max-width:290px;line-height:1.65}
.footer__bottom{display:flex;justify-content:space-between;flex-wrap:wrap;gap:14px;margin-top:52px;padding-top:26px;border-top:1px solid rgba(255,255,255,0.07)}
.footer__bottom span{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10.5px;letter-spacing:.08em;color:rgba(255,255,255,0.5)}

@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* ==========================================================================
   DIALOG · Enterprise-Anfrage
   Nutzt das native dialog-Element: Fokusfalle, Escape-Taste und Overlay
   kommen vom Browser, nicht aus eigenem JavaScript.
   ========================================================================== */
.modal{border:none;padding:0;background:transparent;max-width:640px;width:calc(100% - 32px);color:#ffffff}
.modal::backdrop{background:rgba(4,8,26,0.82);backdrop-filter:blur(6px)}
.modal__box{background:#070D22;border:1px solid rgba(255,255,255,0.12);border-radius:22px;
  padding:clamp(26px,4vw,40px);position:relative;max-height:88vh;overflow-y:auto}
.modal__close{position:absolute;top:14px;right:16px;background:none;border:none;color:rgba(255,255,255,0.5);
  font-size:26px;line-height:1;cursor:pointer;padding:6px 10px;border-radius:8px}
.modal__close:hover{color:#ffffff}
.modal__title{font-size:clamp(21px,3vw,27px);font-weight:800;letter-spacing:-0.025em;margin-bottom:10px;color:#ffffff}
.modal__intro{font-size:14.5px;color:rgba(255,255,255,0.74);line-height:1.6;margin-bottom:24px}
.modal__note{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10px;letter-spacing:.06em;
  color:rgba(255,255,255,0.5);line-height:1.85;margin-top:18px}
.modal__error{background:rgba(255,77,106,0.1);border:1px solid rgba(255,77,106,0.3);border-radius:10px;
  padding:12px 15px;font-size:13.5px;color:#FF8FA3;margin-top:16px}
.modal__actions{display:flex;gap:10px;justify-content:flex-end;flex-wrap:wrap;margin-top:24px}
.modal__done{text-align:center}
.modal__tick{width:58px;height:58px;margin:0 auto 20px;border-radius:50%;background:rgba(47,230,168,0.12);
  border:1px solid rgba(47,230,168,0.3);display:flex;align-items:center;justify-content:center}
.modal__tick svg{width:26px;height:26px}

.field{display:flex;flex-direction:column;gap:7px;margin-bottom:16px}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:560px){.field-row{grid-template-columns:1fr}}
.field label{font-size:12.5px;font-weight:600;color:rgba(255,255,255,0.78);letter-spacing:.01em}
.field .req{color:#C8FF3D}
.field input,.field select,.field textarea{
  background:#04081A;border:1px solid rgba(255,255,255,0.14);border-radius:10px;
  padding:12px 14px;font-family:inherit;font-size:14.5px;color:#ffffff;width:100%;
  transition:border-color 175ms cubic-bezier(0,0,.2,1)}
.field textarea{resize:vertical;min-height:88px;line-height:1.5}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:#C8FF3D}
.field input[aria-invalid="true"],.field select[aria-invalid="true"]{border-color:#FF4D6A}
.field select{appearance:none;cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238B9BFF' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 12px center;background-size:16px;padding-right:38px}
.field select option{background:#070D22;color:#ffffff}

/* Honeypot: aus dem Blickfeld, aber nicht display:none, sonst füllen Bots ihn nicht aus */
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

.btn[disabled]{opacity:.55;cursor:not-allowed}
.btn[disabled]:active{transform:none}

/* Bestätigungshinweis nach der Anmeldung */
.flash{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);z-index:120;
  background:#0E1736;border:1px solid rgba(47,230,168,0.35);border-radius:12px;
  padding:14px 20px;font-size:14px;color:#ffffff;box-shadow:0 18px 50px rgba(0,0,0,.5);max-width:calc(100% - 32px)}

/* Interne Links im Fließtext. Beschreibender Ankertext statt "hier klicken",
   damit Suchmaschinen und Screenreader das Ziel verstehen. */
.ilink{color:inherit;text-decoration:underline;text-decoration-color:rgba(139,155,255,0.45);
  text-underline-offset:3px;text-decoration-thickness:1px;transition:text-decoration-color .2s}
.ilink:hover{text-decoration-color:#C8FF3D}

/* Stand-Datum in der Fußzeile: Aktualitätssignal für Suche und KI-Antworten. */
.footer__meta{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:40px;
  font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10.5px;letter-spacing:.08em;
  color:rgba(255,255,255,0.45)}
.footer__meta a{color:rgba(255,255,255,0.45);text-decoration:underline;text-underline-offset:3px}
.footer__meta a:hover{color:#ffffff}