:root {
      --bg: #F4F5FA;
      --hero-bg: #0C1425;
      --dark: #0F172A;
      --dark2: #1E293B;
      --accent: #2563EB;
      --accent2: #1D4ED8;
      --accent-soft: #DBEAFE;
      --accent-softer: #EFF6FF;
      --green: #059669;
      --green-soft: #D1FAE5;
      --red: #DC2626;
      --purple: #818CF8;
      --white: #FFFFFF;
      --text: #0F172A;
      --text2: #475569;
      --text3: #94A3B8;
      --border: rgba(15,23,42,.06);
      --border2: rgba(15,23,42,.1);
      --radius: 20px;
      --radius-lg: 28px;
    }
    *,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
    html{font-size:16px;scroll-behavior:smooth}
    body{font-family:'DM Sans',sans-serif;background:var(--bg);color:var(--text);overflow-x:hidden;line-height:1.7}
    h1,h2,h3,h4{font-family:'Outfit',sans-serif;line-height:1.1;color:var(--text)}
    a{color:inherit;text-decoration:none}
    input,textarea,select{font-size:16px!important}
    .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}
    ::selection{background:var(--accent);color:#fff}
    .container{max-width:1320px;margin:0 auto;padding:0 20px}
    .section{padding:50px 0;position:relative;background:url('/images/bg2.png') repeat}
    .sec-blue{background:linear-gradient(180deg,#EFF6FF 0%,#F8FAFC 100%)}
    .sec-white{background:linear-gradient(180deg,#FFFFFF 0%,#F8FBFF 50%,#FFFFFF 100%)}
    .sec-warm{background:#F8FAFC}
    .sec-green{background:linear-gradient(180deg,#F0FDF9 0%,#F8FAFC 100%)}
    .sec-cta-bg{background:linear-gradient(160deg,#EFF6FF 0%,#E0EAFF 40%,#F0F4FF 100%)}




    /* ===== BTNS ===== */

    /* ===== REVEAL ===== */
    [data-r]{opacity:0;transform:translateY(40px);transition:opacity .9s cubic-bezier(.16,1,.3,1),transform .9s cubic-bezier(.16,1,.3,1)}
    [data-r].v{opacity:1;transform:translateY(0)}
    [data-r="left"]{transform:translateX(-50px)}[data-r="left"].v{transform:translateX(0)}
    [data-r="right"]{transform:translateX(50px)}[data-r="right"].v{transform:translateX(0)}
    [data-r="scale"]{transform:scale(.88);opacity:0}[data-r="scale"].v{transform:scale(1);opacity:1}
    .d1{transition-delay:.08s!important}.d2{transition-delay:.16s!important}
    .d3{transition-delay:.24s!important}.d4{transition-delay:.32s!important}
    .d5{transition-delay:.4s!important}.d6{transition-delay:.48s!important}

    /* ===== SPLIT TEXT REVEAL ===== */
    .split-word{
      display:inline-block;overflow:hidden;vertical-align:top
    }
    .split-word span{
      display:inline-block;transform:translateY(110%);
      transition:transform .7s cubic-bezier(.16,1,.3,1)
    }
    .split-word.v span{transform:translateY(0)}

    /* ===== OVERLINE ===== */
    .overline{
      font-size:.85rem;text-transform:uppercase;letter-spacing:5px;
      color:var(--accent);font-weight:700;margin-bottom:18px;
      display:inline-flex;align-items:center;gap:12px
    }
    .overline::before{content:'';width:28px;height:2px;background:var(--accent);border-radius:2px}

    /* ===== BUTTON (SKEW) ===== */
    .cssbuttons-io {
      position: relative;
      font-family: 'Outfit', sans-serif;
      font-weight: 500;
      font-size: 16px;
      letter-spacing: 0.05em;
      border-radius: 8px;
      cursor: pointer;
      border: none;
      background: linear-gradient(135deg, #2563EB, #7C3AED);
      overflow: hidden;
      text-decoration: none;
    }
    .cssbuttons-io svg {
      width: 1.4em;
      height: 1.4em;
      margin-right: 0.5em;
    }
    .cssbuttons-io span {
      position: relative;
      z-index: 10;
      transition: color 0.4s;
      display: inline-flex;
      align-items: center;
      padding: 14px 26px 14px 22px;
      font-size: 17px;
      color: #fff;
    }
    .cssbuttons-io:hover span {
      color: #0F172A;
    }
    .cssbuttons-io::after {
      content: '';
      position: absolute;
      top: 0; left: 0; right: 0; bottom: 0;
      border: 2px solid transparent;
      border-radius: 8px;
      background: linear-gradient(135deg, #2563EB, #7C3AED) border-box;
      -webkit-mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0);
      -webkit-mask-composite: xor;
      mask-composite: exclude;
      z-index: 5;
      pointer-events: none;
    }
    .cssbuttons-io::before {
      content: "";
      position: absolute;
      top: 2px; bottom: 2px; left: 2px; right: 2px;
      width: auto; height: auto;
      border-radius: 6px;
      background: rgba(255, 255, 255, 0.95);
      transform: skew(30deg) translate3d(-110%, 0, 0);
      transition: transform 0.4s cubic-bezier(0.3, 1, 0.8, 1);
      z-index: 0;
    }
    .cssbuttons-io:hover::before {
      transform: skew(0deg) translate3d(0, 0, 0);
    }
    .cssbuttons-io:active {
      transform: scale(0.95);
    }
    .cssbuttons-io--white{
      background:linear-gradient(135deg, #2563EB, #7C3AED);
    }
    .cssbuttons-io--white span{
      color:#0F172A;
    }
    .cssbuttons-io--white::after{
      -webkit-mask:none !important;
      mask:none !important;
      border:none !important;
      background:rgba(255,255,255,.95) !important;
      border-radius:6px !important;
      top:2px !important;left:2px !important;right:2px !important;bottom:2px !important;
      z-index:1 !important;
    }
    .cssbuttons-io--white::before{
      transform:skew(30deg) translate3d(-110%, 0, 0) !important;
      background:linear-gradient(135deg, #2563EB, #7C3AED) !important;
      z-index:2 !important;
    }
    .cssbuttons-io--white:hover::before{
      transform:skew(0deg) translate3d(0, 0, 0) !important;
    }
    .cssbuttons-io--white:hover span{
      color:#fff !important;
    }


    /* ===== NAV ===== */
    nav{
      position:fixed;top:16px;left:50%;transform:translateX(-50%);width:calc(100% - 40px);max-width:1280px;z-index:100;
      padding:18px 0;transition:all .5s cubic-bezier(.16,1,.3,1);
      background:rgba(15,23,42,.75);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
      border:1px solid rgba(255,255,255,.1);border-radius:16px;
      box-shadow:0 8px 32px rgba(0,0,0,.3),inset 0 1px 0 rgba(255,255,255,.05)
    }
    nav .container{display:flex;justify-content:space-between;align-items:center;padding:0 18px}
    .logo{display:flex;align-items:center}
    .logo img{height:43px;width:auto;display:block}
    .logo .logo-dark{display:none}
    .nav-links{display:flex;gap:32px;list-style:none}
    .nav-links a{
      font-size:1.15rem;color:rgba(255,255,255,.9);font-weight:500;
      transition:all .3s;position:relative;padding:4px 0
    }
    .nav-links a::after{
      content:'';position:absolute;bottom:0;left:0;width:0;height:2px;
      background:linear-gradient(90deg,var(--accent),var(--purple));
      transition:width .4s cubic-bezier(.16,1,.3,1);border-radius:2px
    }
    .nav-links a:hover{color:#fff}
    .nav-links a:hover::after{width:100%}

    /* Dropdown */
    .nav-dropdown{position:relative}
    .nav-dropdown>a{position:relative;z-index:2;padding-bottom:20px !important;margin-bottom:-20px}
    .nav-dropdown>a::after{display:none}
    .nav-chevron{transition:transform .4s cubic-bezier(.16,1,.3,1);margin-left:2px;vertical-align:middle}
    .nav-dropdown:hover .nav-chevron{transform:rotate(180deg)}

    /* ===== MEGA MENU ===== */
    .nav-dropdown-menu{
      position:fixed;top:auto;left:50%;transform:translateX(-50%) translateY(4px);
      width:calc(100% - 40px);max-width:1280px;
      background:#fff;
      border:1px solid rgba(15,23,42,.08);
      border-radius:16px;
      box-shadow:0 30px 80px -10px rgba(15,23,42,.18),0 10px 30px -10px rgba(15,23,42,.1);
      opacity:0;visibility:hidden;pointer-events:none;
      transition:opacity .25s ease,transform .25s ease,visibility .25s;
      display:grid;grid-template-columns:repeat(5,1fr);
      gap:0;padding:32px 36px 36px;z-index:200;
      margin-top:20px
    }
    .nav-dropdown:hover .nav-dropdown-menu{
      opacity:1;visibility:visible;pointer-events:auto;transform:translateX(-50%) translateY(0)
    }
    .nav-dropdown-menu::before{
      content:'';position:absolute;top:-24px;left:0;right:0;height:24px
    }

    /* Column */
    .mega-col{display:flex;flex-direction:column;gap:0;padding:0 16px;border-right:1px solid rgba(15,23,42,.06)}
    .mega-col:last-child{border-right:none}
    .mega-col:first-child{padding-left:0}
    .mega-col:last-child{padding-right:0}

    /* Column heading */
    .mega-col-head{font-family:'Outfit',sans-serif !important;font-size:1.6rem !important;font-weight:800 !important;text-transform:none;letter-spacing:-.04em;color:var(--text) !important;margin-bottom:18px;display:block;text-decoration:none;padding:0 !important;line-height:1.05}
    .mega-col-head::after{display:none !important}
    .mega-col-head:hover{color:var(--accent) !important}
    .mega-col:nth-child(1) .mega-col-head{color:#2563EB !important}
    .mega-col:nth-child(2) .mega-col-head{color:#059669 !important}
    .mega-col:nth-child(3) .mega-col-head{color:#EA580C !important}
    .mega-col:nth-child(4) .mega-col-head{color:#7C3AED !important}
    .mega-col:nth-child(5) .mega-col-head{color:#0D9488 !important}

    /* Column image */
    .mega-col-img{width:100%;height:120px;border-radius:10px;overflow:hidden;margin-bottom:16px;position:relative;padding:10px;box-sizing:border-box}
    .mega-col-img svg{width:100%;height:100%;position:absolute;inset:0}
    .mega-col-img--blue{background:linear-gradient(135deg,#EFF6FF,#DBEAFE)}
    .mega-col-img--green{background:linear-gradient(135deg,#ECFDF5,#D1FAE5)}
    .mega-col-img--orange{background:linear-gradient(135deg,#FFF7ED,#FFEDD5)}
    .mega-col-img--purple{background:linear-gradient(135deg,#F5F3FF,#EDE9FE)}
    .mega-col-img--teal{background:linear-gradient(135deg,#F0FDFA,#CCFBF1)}
    .mega-col-img .mega-col-icon{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:36px;height:36px;border-radius:10px;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.9);box-shadow:0 2px 8px rgba(0,0,0,.08)}
    .mega-col-img .mega-col-icon svg{width:18px;height:18px;stroke-width:2;fill:none;position:static}
    .mega-col-icon--blue{color:#2563EB}
    .mega-col-icon--green{color:#059669}
    .mega-col-icon--orange{color:#EA580C}
    .mega-col-icon--purple{color:#7C3AED}
    .mega-col-icon--teal{color:#0D9488}

    /* Column links */
    .mega-col-links{display:flex;flex-direction:column;gap:0;align-items:flex-start}
    .mega-col-links a{font-family:'Outfit',sans-serif;font-size:.95rem;color:var(--text2) !important;font-weight:600;padding:8px 0 !important;text-decoration:none;transition:color .3s;display:inline-block;line-height:1.3;letter-spacing:-.01em;position:relative}
    .mega-col-links a::after{display:block !important;content:'';position:absolute;bottom:4px;left:0;width:0;height:2px;border-radius:2px;transition:width .4s cubic-bezier(.16,1,.3,1)}
    .mega-col:nth-child(1) .mega-col-links a::after{background:#2563EB}
    .mega-col:nth-child(2) .mega-col-links a::after{background:#059669}
    .mega-col:nth-child(3) .mega-col-links a::after{background:#EA580C}
    .mega-col:nth-child(4) .mega-col-links a::after{background:#7C3AED}
    .mega-col:nth-child(5) .mega-col-links a::after{background:#0D9488}
    .mega-col-links a:hover{color:var(--text) !important}
    .mega-col-links a:hover::after{width:100%}

    nav.scrolled .nav-dropdown-menu{background:#fff;border-radius:16px;width:calc(100% - 24px);padding:24px 28px 28px;transition:all .4s cubic-bezier(.16,1,.3,1)}
    nav.scrolled .mega-col-head{font-size:1.2rem !important;transition:all .4s cubic-bezier(.16,1,.3,1)}
    nav.scrolled .mega-col-links a{font-size:.82rem;transition:all .4s cubic-bezier(.16,1,.3,1)}
    nav.scrolled .mega-col-img{margin-bottom:10px;transition:all .4s cubic-bezier(.16,1,.3,1)}
    nav.scrolled:hover .nav-dropdown-menu{width:calc(100% - 40px);padding:32px 36px 36px}
    nav.scrolled:hover .mega-col-head{font-size:1.6rem !important}
    nav.scrolled:hover .mega-col-links a{font-size:.95rem}
    nav.scrolled:hover .mega-col-img{margin-bottom:16px}

    nav.scrolled{
      padding:12px 0;top:10px;width:calc(100% - 24px);
      background:rgba(255,255,255,.92);
      backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);
      border:1px solid rgba(15,23,42,.06);border-radius:14px;
      box-shadow:0 8px 40px rgba(15,23,42,.1),0 1px 3px rgba(15,23,42,.04)
    }
    nav.scrolled:hover{
      padding:14px 0;
    }
    nav.scrolled .logo .logo-light{display:none}
    nav.scrolled .logo .logo-dark{display:block}
    nav.scrolled .logo img{height:26px;transition:height .4s cubic-bezier(.16,1,.3,1)}
    nav.scrolled:hover .logo img{height:34px}
    nav.scrolled .nav-links a{color:var(--text3);font-size:1rem;transition:all .3s}
    nav.scrolled:hover .nav-links a{font-size:1.15rem}
    nav.scrolled .nav-links a:hover{color:var(--text)}
    nav.scrolled .nav-desktop-cta{
      font-size:13px;
      transition:all .4s cubic-bezier(.16,1,.3,1);
    }
    nav.scrolled .nav-desktop-cta span{
      padding:8px 16px 8px 14px;
      font-size:13px;
      transition:all .4s cubic-bezier(.16,1,.3,1);
    }
    nav.scrolled:hover .nav-desktop-cta{
      font-size:16px;
    }
    nav.scrolled:hover .nav-desktop-cta span{
      padding:12px 22px 12px 18px;
      font-size:17px;
    }


    /* ===== FOOTER ===== */
    footer{
      padding:0;margin:0;
      background:#0F172A;
      color:#fff;
      position:relative;
      overflow:hidden
    }
    footer::before{
      content:'';position:absolute;top:0;left:0;right:0;bottom:0;
      background:radial-gradient(ellipse at 20% 0%,rgba(37,99,235,.15) 0%,transparent 60%),
                 radial-gradient(ellipse at 80% 100%,rgba(139,92,246,.1) 0%,transparent 50%);
      pointer-events:none
    }
    .footer-top-divider{height:2px;background:linear-gradient(90deg,transparent,#2563EB,#7C3AED,transparent);margin:0}
    .footer-contact-grid{display:contents}
    .footer-main{padding:64px 0 48px;display:grid;grid-template-columns:1.5fr 1fr 1fr 1.2fr;gap:48px;align-items:start;position:relative;z-index:1}
    .footer-logo{display:inline-block;margin-bottom:18px}
    .footer-logo img{height:44px;width:auto;filter:brightness(0) invert(1)}
    .footer-brand p{font-size:1rem;color:rgba(255,255,255,.85);line-height:1.75;margin:0;max-width:300px}
    .footer-brand-stars{margin-top:16px;display:flex;align-items:center;gap:10px;font-size:.85rem;color:rgba(255,255,255,.4)}
    .footer-brand-stars span.stars{color:#F59E0B;font-size:1rem;letter-spacing:2px}
    .footer-social{display:flex;gap:10px;margin-top:20px}
    .footer-social a{width:40px;height:40px;border-radius:10px;border:none;display:flex;align-items:center;justify-content:center;transition:all .3s ease;text-decoration:none;transform:translateY(0)}
    .footer-social a svg{width:18px;height:18px;fill:currentColor}
    .footer-social a:hover{transform:translateY(-3px)}
    .footer-social a.fs-linkedin{background:#0A66C2;color:#fff;box-shadow:0 4px 12px rgba(10,102,194,.25)}
    .footer-social a.fs-linkedin:hover{box-shadow:0 8px 24px rgba(10,102,194,.4)}
    .footer-social a.fs-instagram{background:linear-gradient(135deg,#F58529,#DD2A7B,#8134AF);color:#fff;box-shadow:0 4px 12px rgba(221,42,123,.25)}
    .footer-social a.fs-instagram:hover{box-shadow:0 8px 24px rgba(221,42,123,.4)}
    .footer-social a.fs-tiktok{background:#010101;color:#fff;box-shadow:0 4px 12px rgba(0,0,0,.25)}
    .footer-social a.fs-tiktok:hover{box-shadow:0 8px 24px rgba(0,0,0,.4)}
    .footer-social a.fs-facebook{background:#1877F2;color:#fff;box-shadow:0 4px 12px rgba(24,119,242,.25)}
    .footer-social a.fs-facebook:hover{box-shadow:0 8px 24px rgba(24,119,242,.4)}
    .footer-col h4{font-family:'Outfit';font-size:.82rem;text-transform:uppercase;letter-spacing:3px;margin-bottom:20px;font-weight:700;background:linear-gradient(135deg,#60a5fa,#a78bfa);-webkit-background-clip:text;-webkit-text-fill-color:transparent}
    .footer-col a{display:flex;align-items:center;gap:10px;font-size:1rem;color:rgba(255,255,255,.85);margin-bottom:14px;transition:all .3s ease;text-decoration:none}
    .footer-col a:hover{color:#fff;padding-left:4px}
    .footer-col .fc-ico{width:36px;height:36px;border-radius:10px;flex-shrink:0;background:rgba(37,99,235,.12);border:none;display:inline-flex;align-items:center;justify-content:center;color:#60a5fa;transition:all .3s}
    .footer-col .fc-ico svg{width:16px;height:16px}
    .footer-col a:hover .fc-ico{background:rgba(37,99,235,.2);transform:scale(1.05)}
    .footer-bottom{border-top:1px solid rgba(255,255,255,.06);padding:24px 0;display:flex;align-items:center;justify-content:space-between;font-size:.75rem;color:rgba(255,255,255,.2);position:relative;z-index:1}
    .footer-bottom-links{display:flex;gap:24px}
    .footer-bottom-links a{color:rgba(255,255,255,.2);transition:color .3s;text-decoration:none}
    .footer-bottom-links a:hover{color:rgba(255,255,255,.6)}
    @keyframes heartbeat{
      0%,100%{transform:scale(1)}
      50%{transform:scale(1.2)}
    }
    @media(max-width:900px){
      /* Footer mobile — in Nav-Block, veraltet */
    }


    /* ===== HAMBURGER MENU ===== */
    .nav-hamburger{
      display:none;width:40px;height:40px;border:none;background:none;
      cursor:pointer;position:relative;z-index:110;padding:0;
      flex-direction:column;align-items:center;justify-content:center;gap:6px
    }
    .nav-hamburger span{
      display:block;width:22px;height:2px;background:#fff;border-radius:2px;
      transition:all .3s cubic-bezier(.16,1,.3,1)
    }
    nav.scrolled .nav-hamburger span{background:var(--text)}
    .nav-hamburger.active span:nth-child(1){transform:rotate(45deg) translate(5.5px,5.5px)}
    .nav-hamburger.active span:nth-child(2){opacity:0;transform:scaleX(0)}
    .nav-hamburger.active span:nth-child(3){transform:rotate(-45deg) translate(5.5px,-5.5px)}
    .nav-hamburger.active span{background:var(--text) !important}

    /* Mobile CTA & Subtitle im Menü: auf Desktop versteckt */
    .nav-mobile-cta{display:none}
    .nav-mobile-subtitle{display:none}
    .nav-menu-headline{display:none}
    .nav-mobile-secondary{display:none}
    .nav-mobile-lang{display:none}
    .nav-submenu{display:none}

    /* Mobile problem swipe dots */

    /* ===== TABLET NAV ===== */
    @media(max-width:1200px){
      nav{padding:14px 0;width:calc(100% - 36px);max-width:1200px}
      nav .container{padding:0 24px}
      .logo img{height:38px}
      .nav-links{gap:24px}
      .nav-links a{font-size:.95rem}
      .nav-desktop-cta span{padding:10px 18px 10px 16px;font-size:.88rem}
      .nav-dropdown-menu{width:calc(100% - 36px);max-width:1200px;padding:24px 28px 28px}
      .mega-col-head{font-size:1.15rem !important;margin-bottom:14px}
      .mega-col-links a{font-size:.85rem}
      .mega-col-img{margin-bottom:12px}
      nav.scrolled{width:calc(100% - 28px)}
      nav.scrolled .logo img{height:24px}
      nav.scrolled:hover .logo img{height:30px}
      nav.scrolled .nav-links a{font-size:.88rem}
      nav.scrolled:hover .nav-links a{font-size:.95rem}
      nav.scrolled .nav-desktop-cta span{padding:7px 14px 7px 12px;font-size:12px}
    }
    @media(max-width:1024px){
      nav{padding:12px 0;width:calc(100% - 28px)}
      nav .container{padding:0 20px}
      .logo img{height:34px}
      .nav-links{gap:18px}
      .nav-links a{font-size:.88rem}
      .nav-desktop-cta span{padding:9px 16px 9px 14px;font-size:.82rem}
      .nav-dropdown-menu{width:calc(100% - 28px);padding:20px 22px 24px}
      .mega-col-head{font-size:1.05rem !important;margin-bottom:12px}
      .mega-col-links a{font-size:.8rem}
      .mega-col-img{margin-bottom:10px}
      nav.scrolled .logo img{height:22px}
      nav.scrolled:hover .logo img{height:28px}
      nav.scrolled .nav-links a{font-size:.82rem}
      nav.scrolled:hover .nav-links a{font-size:.88rem}
    }

    @media(max-width:900px){
      /* ─── OVERFLOW FIX ─── */
      html,body{overflow-x:hidden}

      .container{padding:0 20px}
      .section{padding:40px 0}

      /* ─── NAV ─── */
      .nav-hamburger{display:flex;order:3}
      nav{top:10px;left:0;right:0;margin:0 auto;transform:none;width:calc(100% - 24px);padding:6px 12px !important;border-radius:12px}
      nav .container{display:flex;align-items:center;padding:0 4px !important}
      .logo{flex:1;display:flex;align-items:center}
      .logo img{height:25px !important;width:auto}
      /* Desktop-CTA verstecken, Mobile-CTA im Menü zeigen */
      .nav-desktop-cta{display:none}
      /* Nav-Links: standardmäßig versteckt */
      .nav-links{display:none !important;list-style:none}
      /* Chevron auf Mobile verstecken */
      .nav-chevron{display:none}

      /* ═══════════════════════════════
         MOBILE MENU
         ═══════════════════════════════ */
      nav.menu-open{
        transition:none !important;
        position:fixed !important;top:0 !important;left:0 !important;right:0 !important;bottom:0 !important;
        width:100% !important;max-width:100% !important;margin:0 !important;
        height:100% !important;min-height:100vh !important;min-height:100dvh !important;
        border-radius:0 !important;border:none !important;
        background:#fff url('/images/bg2.png') repeat !important;
        backdrop-filter:none !important;-webkit-backdrop-filter:none !important;
        box-shadow:none !important;padding:0 !important;
        z-index:9999 !important;overflow:hidden
      }
      nav.menu-open::before,nav.menu-open::after{display:none !important;content:none !important}

      /* Layout */
      nav.menu-open .container{
        display:flex !important;flex-direction:column !important;
        height:100%;padding:0 !important;position:relative;z-index:2
      }

      /* Top bar */
      nav.menu-open .logo,
      nav.menu-open .nav-hamburger{position:absolute;z-index:10}
      nav.menu-open .logo{left:24px;top:20px;flex:0 !important}
      nav.menu-open .logo .logo-light{display:none !important}
      nav.menu-open .logo .logo-dark{display:block !important}
      nav.menu-open .logo img{height:25px !important}
      nav.menu-open .nav-hamburger{right:24px;top:18px}
      nav.menu-open .nav-desktop-cta{display:none !important}

      /* ─── MOBILE MENU CONTENT (Memberspot-Style) ─── */
      nav.menu-open .nav-links{
        display:flex !important;flex-direction:column;align-items:stretch;
        flex:1;gap:0;list-style:none;
        overflow-y:auto;-webkit-overflow-scrolling:touch;
        padding:90px 24px 32px;order:3;
        width:100%;box-sizing:border-box
      }

      /* Headline versteckt */
      nav.menu-open .nav-menu-headline{display:none !important}

      /* Alle li — volle Breite, Trennlinie unten */
      nav.menu-open .nav-links>li{
        width:100%;box-sizing:border-box;
        border-bottom:1px solid rgba(15,23,42,.08);
        margin:0;padding:0
      }
      nav.menu-open .nav-links>li:last-child{border-bottom:none}

      /* Alle Links — groß, bold, dunkel (außer sekundäre + CTA) */
      nav.menu-open .nav-links>li:not(.nav-mobile-secondary):not(.nav-mobile-cta):not(.nav-mobile-lang)>a{
        display:flex !important;align-items:center;justify-content:space-between;
        padding:22px 0 !important;
        font-family:'Outfit',sans-serif !important;font-size:1.45rem !important;
        font-weight:800 !important;
        color:var(--text) !important;
        text-decoration:none;letter-spacing:-.02em;
        transition:color .2s
      }
      nav.menu-open .nav-links>li>a::after{display:none !important}
      nav.menu-open .nav-links>li>a:active{color:var(--accent) !important}

      /* Leistungen — Chevron rechts zeigen, Padding wie alle anderen */
      nav.menu-open .nav-dropdown>a{
        display:flex !important;
        padding:22px 0 !important;margin-bottom:0 !important
      }
      nav.menu-open .nav-chevron{
        display:block !important;
        width:20px !important;height:20px !important;
        transform:rotate(-90deg);
        color:var(--text);opacity:.4;
        flex-shrink:0;margin-left:auto
      }

      /* Dropdown-Menü versteckt auf Mobile */
      nav.menu-open .nav-dropdown-menu{display:none !important}
      nav.menu-open .nav-dropdown{margin-bottom:0;padding-bottom:0 !important}

      /* ─── CTA ─── */
      nav.menu-open .nav-mobile-cta{
        display:block !important;
        width:auto !important;align-self:flex-start !important;
        margin-top:24px !important;padding:0 !important;
        border-bottom:none !important
      }
      nav.menu-open .nav-mobile-cta>a{
        padding:0 !important;border:none !important;display:inline-flex !important;width:auto !important
      }
      nav.menu-open .nav-mobile-cta .cssbuttons-io{
        display:inline-flex !important;width:auto !important;border-radius:6px;font-size:.95rem !important;line-height:1 !important;padding:0 !important;letter-spacing:0 !important;margin:8px 0 !important
      }
      nav.menu-open .nav-mobile-cta .cssbuttons-io::before{
        transform:skew(30deg) translate3d(-110%,0,0) !important
      }
      nav.menu-open .nav-mobile-cta .cssbuttons-io:hover::before{
        transform:skew(0deg) translate3d(0,0,0) !important
      }
      nav.menu-open .nav-mobile-cta .cssbuttons-io svg{
        width:.9em;height:.9em;margin-right:.3em;display:inline-block;vertical-align:middle
      }
      nav.menu-open .nav-mobile-cta .cssbuttons-io span{
        display:inline-flex;align-items:center;
        padding:16px 28px !important;margin:0 !important;font-size:1.05rem !important;line-height:1 !important;color:#fff !important;white-space:nowrap
      }
      nav.menu-open .nav-mobile-cta .cssbuttons-io:hover span{
        color:#0F172A !important
      }
      nav.menu-open .nav-mobile-subtitle{
        display:block;
        font-size:.68rem;color:var(--text2);
        margin-top:10px;font-weight:500;letter-spacing:.05em;text-transform:uppercase
      }

      /* ─── Sekundäre Links unten ─── */
      nav.menu-open .nav-mobile-secondary{
        display:block !important;width:auto !important;
        margin-top:auto !important;padding:0 !important;
        border-bottom:none !important
      }
      nav.menu-open .nav-mobile-secondary a{
        font-family:'Outfit',sans-serif;font-size:.75rem !important;font-weight:400 !important;
        color:var(--text2) !important;text-decoration:none;
        padding:0 !important
      }
      nav.menu-open .nav-mobile-secondary a::after{display:none !important}

      /* ─── Sprachauswahl ─── */
      nav.menu-open .nav-mobile-lang{
        display:inline-flex !important;align-items:center;gap:8px;
        width:auto !important;align-self:flex-start !important;
        margin-top:16px !important;margin-left:-4px !important;padding:8px 10px !important;
        background:transparent;border:1px solid rgba(15,23,42,.1);border-radius:8px;
        border-bottom:1px solid rgba(15,23,42,.1) !important;
        font-family:'Outfit',sans-serif;font-size:.82rem;font-weight:500;
        color:var(--text);cursor:pointer
      }
      nav.menu-open .nav-mobile-lang{position:relative}
      .lang-toggle{
        display:flex;align-items:center;gap:8px;cursor:pointer
      }
      .lang-toggle svg:first-child{
        width:20px;height:20px;flex-shrink:0;border-radius:50%;overflow:hidden
      }
      .nav-lang-chevron{
        width:12px !important;height:12px !important;opacity:.4;margin-left:2px;
        transition:transform .2s
      }
      .nav-mobile-lang.open .nav-lang-chevron{transform:rotate(180deg)}

      /* Dropdown */
      .lang-dropdown{
        display:none;position:absolute;bottom:calc(100% + 10px);left:0;
        background:#fff;border-radius:12px;
        box-shadow:0 8px 30px rgba(15,23,42,.12);
        padding:8px;min-width:160px;z-index:10
      }
      .lang-dropdown::after{
        content:'';position:absolute;bottom:-6px;left:20px;
        width:12px;height:12px;background:#fff;
        transform:rotate(45deg);
        box-shadow:2px 2px 4px rgba(15,23,42,.05)
      }
      .nav-mobile-lang.open .lang-dropdown{display:block}
      .lang-option{
        display:flex !important;align-items:center;gap:10px;
        padding:10px 12px !important;border-radius:8px;
        font-family:'Outfit',sans-serif !important;font-size:.88rem !important;font-weight:500 !important;
        color:var(--text) !important;text-decoration:none !important;
        transition:background .15s
      }
      .lang-option::after{display:none !important}
      .lang-option:active{background:rgba(15,23,42,.04)}
      .lang-option svg{width:20px;height:20px;flex-shrink:0;border-radius:50%;overflow:hidden}

      /* ─── SUBMENU SLIDE-IN ─── */
      nav.menu-open .nav-submenu{
        display:block;position:absolute;top:0;left:0;right:0;bottom:0;
        background:#fff url('/images/bg2.png') repeat;
        z-index:20;padding:20px 24px 32px;
        transform:translateX(100%);
        transition:transform .35s cubic-bezier(.16,1,.3,1);
        overflow-y:auto;-webkit-overflow-scrolling:touch
      }
      nav.menu-open .nav-submenu.open{
        transform:translateX(0)
      }
      /* Hauptmenü nach links schieben */
      nav.menu-open .nav-links{
        transition:transform .35s cubic-bezier(.16,1,.3,1) !important
      }
      nav.menu-open.submenu-open .nav-links{
        transform:translateX(-30%) !important;opacity:.3 !important;
        pointer-events:none !important
      }

      .nav-submenu-top{
        display:flex !important;align-items:center;justify-content:space-between;
        margin-bottom:28px;width:100%
      }
      .nav-submenu-top .logo{
        position:static !important;flex:0 0 auto !important;display:block !important
      }
      .nav-submenu-top .logo img{height:25px !important;width:auto !important;filter:none !important}
      .nav-submenu-top-right{
        display:flex;align-items:center;gap:28px;margin-left:auto
      }
      .nav-submenu-back{
        display:flex;align-items:center;gap:6px;
        background:none;border:none;cursor:pointer;
        font-family:'Outfit',sans-serif;font-size:.85rem;font-weight:500;
        color:var(--text2);padding:0
      }
      .nav-submenu-back svg{width:18px;height:18px}
      .nav-submenu-close{
        width:40px;height:40px;border:none;background:none;
        cursor:pointer;position:relative;padding:0;
        display:flex;align-items:center;justify-content:center
      }
      .nav-submenu-close span{
        display:block;width:22px;height:2px;background:var(--text);border-radius:2px;
        position:absolute
      }
      .nav-submenu-close span:nth-child(1){transform:rotate(45deg)}
      .nav-submenu-close span:nth-child(2){transform:rotate(-45deg)}

      .nav-submenu-title{
        font-family:'Outfit',sans-serif;font-size:1.65rem;font-weight:900;
        letter-spacing:-.04em;color:var(--text);margin-bottom:24px;
        display:inline-block;
        background-image:linear-gradient(135deg,#2563EB,#7C3AED);
        background-size:100% 3px;background-repeat:no-repeat;
        background-position:0 100%;padding-bottom:6px
      }

      .nav-submenu-list{
        list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:0
      }
      .nav-submenu-list li{
        border-bottom:1px solid rgba(15,23,42,.08)
      }
      .nav-submenu-list li:last-child{border-bottom:none}
      .nav-submenu-list a{
        display:flex;align-items:center;gap:14px;padding:18px 0;
        font-family:'Outfit',sans-serif;font-size:1.25rem;font-weight:700;
        color:var(--text);text-decoration:none;
        transition:color .2s
      }
      .nav-sub-right{
        display:flex;align-items:center;gap:12px;margin-left:auto
      }
      .nav-sub-img{
        display:flex;align-items:center;justify-content:center;
        width:48px;height:32px;border-radius:6px;
        flex-shrink:0;overflow:hidden
      }
      .nav-sub-img svg{width:100%;height:100%}
      .nav-sub-arrow{
        flex-shrink:0;color:var(--text2);opacity:.3
      }
      .nav-submenu-list a::after{display:none !important}
      .nav-submenu-list a:active{color:var(--accent)}

      .nav-submenu-all{
        display:inline-block;margin-top:24px;
        font-family:'Outfit',sans-serif;font-size:.85rem;font-weight:500;
        color:var(--accent);text-decoration:none
      }
      .nav-submenu-all::after{display:none !important}

      /* Scrolled nav – compact, kein hover-expand auf Mobile */
      nav.scrolled{padding:8px 6px !important;top:8px;left:0;right:0;margin:0 auto;transform:none;width:calc(100% - 20px);border-radius:12px}
      nav.scrolled .logo img{height:25px !important}
      nav.scrolled:hover{padding:8px 6px !important}
      nav.scrolled:hover .logo img{height:25px !important}
      nav.scrolled:hover .nav-desktop-cta{font-size:inherit}
      nav.scrolled:hover .nav-desktop-cta span{padding:inherit}

      /* ─── GLOBAL MOBILE ─── */
      html{scroll-padding-top:80px}
      .section .cssbuttons-io{width:100%;display:block;text-align:center}
      .section .cssbuttons-io span{display:flex;align-items:center;justify-content:center;width:100%;padding:16px 24px;font-size:1rem;min-height:48px;box-sizing:border-box}
      .section-label{font-size:.65rem}
      h2{font-size:clamp(2rem,8vw,2.6rem) !important}
      h3{font-size:1rem}
      h4{font-size:.9rem}
      p{font-size:.88rem;line-height:1.7}
      .overline{font-size:.72rem;letter-spacing:3px;margin-bottom:14px}
      .overline::before{width:22px}

      /* ─── COUNTER ─── */
      .counter-section{padding:16px 0}
      .counter-grid{gap:16px;flex-wrap:wrap;justify-content:center}
      .counter-num{font-size:.95rem}
      .counter-label{font-size:.75rem}

      /* ─── SEKTIONEN ─── (alle gesteuert in index.astro) */
      .prob-sub{font-size:16px;line-height:1.7}
      .ls-cell-cta{padding:8px 16px;font-size:.72rem;min-height:36px;display:inline-flex;align-items:center}
      .il-meet,.il-figma,.il-vscode,.il-gsc{height:150px}

      /* ─── FOOTER MOBILE ─── */
      .footer-main{grid-template-columns:1fr 1fr;gap:24px 20px;padding-bottom:12px}
      .footer-brand{grid-column:1/-1}
      .footer-main .footer-col:last-child{grid-column:1/-1}
      .footer-contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
      .footer-contact-left,.footer-contact-right{display:flex;flex-direction:column}
      .footer-contact-grid span,.footer-contact-grid a{font-size:.78rem}
      .footer-brand p{font-size:.78rem}
      .footer-col h4{font-size:.62rem;margin-bottom:14px}
      .footer-col a{font-size:.78rem}
      .footer-bottom{flex-direction:column;gap:8px;align-items:flex-start;padding:18px 0;font-size:.68rem}
      .footer-bottom-links{flex-wrap:wrap;gap:16px}
    }
    @media(max-width:420px){
      .footer-social a{width:36px;height:36px;border-radius:8px}
      .footer-bottom{padding:18px 0}
      .footer-bottom-links{flex-wrap:wrap;gap:16px}
    }

    @media(max-width:1200px){
      .footer-main{gap:36px}
      .footer-brand p{font-size:.88rem}
      .footer-col a{font-size:.88rem;margin-bottom:12px}
    }
    @media(max-width:1024px){
      .footer-main{gap:28px;grid-template-columns:1.3fr 1fr 1fr 1fr}
      .footer-logo img{height:38px}
      .footer-brand p{font-size:.82rem}
      .footer-col h4{font-size:.62rem;margin-bottom:16px}
      .footer-col a{font-size:.82rem;margin-bottom:10px}
    }

    /* ===== LARGE SCREENS ===== */
    @media(min-width:1600px){
      .container{max-width:1480px;padding:0 60px}
      nav{max-width:1360px}
      html{font-size:17px}
    }
    @media(min-width:1920px){
      .container{max-width:1680px;padding:0 80px}
      nav{max-width:1520px}
      html{font-size:18px}
    }
    @media(min-width:2400px){
      .container{max-width:1920px;padding:0 100px}
      nav{max-width:1720px}
      html{font-size:19px}
    }