: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}
    ::selection{background:var(--accent);color:#fff}
    .container{max-width:1320px;margin:0 auto;padding:0 10px}
    .section{padding:80px 0;position:relative;background:url('/images/bg2.png') center/cover no-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 ===== */
    .btn{
      display:inline-flex;align-items:center;gap:10px;
      padding:16px 36px;border-radius:12px;font-family:'Outfit';
      font-size:.9rem;font-weight:600;
      transition:all .45s cubic-bezier(.16,1,.3,1);
      border:none;cursor:pointer;position:relative;overflow:hidden;
      letter-spacing:.01em
    }
    .btn .btn-text{position:relative;z-index:2;display:flex;align-items:center;gap:10px}

    .btn-primary{
      background:var(--accent);color:#fff;
      box-shadow:0 4px 16px rgba(37,99,235,.3)
    }
    .btn-primary:hover{
      background:var(--accent2);transform:translateY(-2px);
      box-shadow:0 8px 24px rgba(37,99,235,.25)
    }
    .btn-glass{
      background:rgba(255,255,255,.07);color:rgba(255,255,255,.85);
      border:1px solid rgba(255,255,255,.12);backdrop-filter:blur(12px)
    }
    .btn-glass:hover{
      background:rgba(255,255,255,.15);color:#fff;
      transform:translateY(-2px)
    }
    .btn-soft{
      background:var(--accent-softer);color:var(--accent);
      border:1px solid var(--accent-soft)
    }
    .btn-soft:hover{
      background:var(--accent-soft);transform:translateY(-2px);
      box-shadow:0 6px 20px rgba(37,99,235,.1)
    }
    .btn .arrow{
      transition:transform .3s;display:inline-block
    }
    .btn:hover .arrow{transform:translateX(6px)}

    /* ===== 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);
      color: ghostwhite;
      overflow: hidden;
      text-decoration: none;
    }
    .cssbuttons-io svg {
      width: 1.2em;
      height: 1.2em;
      margin-right: 0.5em;
    }
    .cssbuttons-io span {
      position: relative;
      z-index: 10;
      transition: color 0.4s;
      display: inline-flex;
      align-items: center;
      padding: 12px 22px 12px 18px;
      color: #0F172A;
    }
    .cssbuttons-io:hover span {
      color: #fff;
    }
    .cssbuttons-io::before,
    .cssbuttons-io::after {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      z-index: 0;
    }
    .cssbuttons-io::before {
      content: "";
      background: rgba(255, 255, 255, 0.85);
      width: 120%;
      left: -10%;
      transform: skew(30deg);
      transition: transform 0.4s cubic-bezier(0.3, 1, 0.8, 1);
    }
    .cssbuttons-io:hover::before {
      transform: translate3d(100%, 0, 0);
    }
    .cssbuttons-io:active {
      transform: scale(0.95);
    }

    /* Outline-Variante für Hero */
    .cssbuttons-io--outline {
      background: transparent;
      border: 2px solid rgba(255,255,255,.5);
    }
    .cssbuttons-io--outline span {
      color: rgba(255,255,255,.85);
    }
    .cssbuttons-io--outline:hover span {
      color: #fff;
    }
    .cssbuttons-io--outline::before {
      background: linear-gradient(135deg, #2563EB, #7C3AED);
      transform: skew(30deg) translate3d(-100%, 0, 0);
    }
    .cssbuttons-io--outline:hover::before {
      transform: skew(30deg) translate3d(0, 0, 0);
    }
    .cssbuttons-io--outline:hover {
      border-color: transparent;
    }

    /* ===== NAV ===== */
    nav{
      position:fixed;top:16px;left:50%;transform:translateX(-50%);width:calc(100% - 48px);max-width:1300px;z-index:100;
      padding:14px 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 30px}
    .logo img{height:72px;width:auto}
    .logo .logo-dark{display:none}
    .nav-links{display:flex;gap:32px;list-style:none}
    .nav-links a{
      font-size:1.05rem;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%}
    nav .btn{padding:12px 28px;font-size:.88rem;border-radius:8px}

    /* 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% - 48px);max-width:1300px;
      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.3rem !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%;aspect-ratio:16/10;border-radius:10px;overflow:hidden;margin-bottom:16px;position:relative}
    .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}
    .mega-col-links a{font-family:'Outfit',sans-serif;font-size:.84rem;color:var(--text2) !important;font-weight:600;padding:7px 0 !important;text-decoration:none;transition:color .2s,padding-left .2s;display:block;line-height:1.3;letter-spacing:-.01em}
    .mega-col-links a::after{display:none !important}
    .mega-col-links a:hover{color:var(--text) !important;padding-left:6px}

    nav.scrolled .nav-dropdown-menu{background:#fff;border-radius:16px}

    nav.scrolled{
      padding:8px 0;top:10px;width:calc(100% - 32px);
      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 8px;
    }
    nav.scrolled .logo .logo-light{display:none}
    nav.scrolled .logo .logo-dark{display:block}
    nav.scrolled .logo img{height:48px;transition:height .4s cubic-bezier(.16,1,.3,1)}
    nav.scrolled:hover .logo img{height:72px}
    nav.scrolled .nav-links a{color:var(--text3);font-size:.95rem;transition:all .3s}
    nav.scrolled:hover .nav-links a{font-size:1.05rem}
    nav.scrolled .nav-links a:hover{color:var(--text)}
    nav.scrolled .cssbuttons-io{
      font-size:13px;
      transition:all .4s cubic-bezier(.16,1,.3,1);
    }
    nav.scrolled .cssbuttons-io span{
      color:#fff;
      padding:8px 16px 8px 14px;
      transition:all .4s cubic-bezier(.16,1,.3,1);
    }
    nav.scrolled .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
    }
    nav.scrolled .cssbuttons-io::before{
      top:2px;bottom:2px;left:2px;right:2px;
      width:auto;height:auto;
      border-radius:6px;
      transform:skew(30deg) translate3d(-110%,0,0)
    }
    nav.scrolled .cssbuttons-io:hover span{
      color:#0F172A;
    }
    nav.scrolled .cssbuttons-io:hover::before{
      transform:skew(0deg) translate3d(0,0,0)
    }
    nav.scrolled:hover .cssbuttons-io{
      font-size:16px;
    }
    nav.scrolled:hover .cssbuttons-io span{
      padding:12px 22px 12px 18px;
    }
    nav.scrolled .nav-btn{
      background:var(--accent)!important;color:#fff!important;
      border:none!important;box-shadow:0 4px 16px rgba(37,99,235,.25)!important
    }


    /* ===== 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:1px;
      background:linear-gradient(90deg,transparent,rgba(37,99,235,.4),rgba(139,92,246,.4),transparent);
      margin:0
    }
    .footer-cta-strip{
      text-align:center;padding:48px 0 0;position:relative;z-index:1
    }
    .footer-cta-strip p{
      font-size:1.1rem;color:rgba(255,255,255,.6);margin-bottom:20px;font-weight:500
    }
    .footer-cta-strip .btn{
      padding:14px 36px;font-size:.92rem
    }
    .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-brand{}
    .footer-logo{display:inline-block;margin-bottom:18px}
    .footer-logo img{height:72px;width:auto;filter:brightness(0) invert(1)}
    .footer-brand p{font-size:.85rem;color:rgba(255,255,255,.5);line-height:1.7;margin:0;max-width:300px}
    .footer-brand-stars{
      margin-top:16px;display:flex;align-items:center;gap:10px;
      font-size:.82rem;color:rgba(255,255,255,.4)
    }
    .footer-brand-stars span.stars{color:#F59E0B;font-size:.95rem;letter-spacing:2px}
    .footer-social{display:flex;gap:10px;margin-top:20px}
    .footer-social a{
      width:40px;height:40px;border-radius:10px;
      border:1px solid rgba(255,255,255,.1);
      background:rgba(255,255,255,.04);
      display:flex;align-items:center;justify-content:center;
      color:rgba(255,255,255,.5);
      transition:all .3s ease;text-decoration:none
    }
    .footer-social a svg{width:18px;height:18px;fill:currentColor}
    .footer-social a:hover{
      border-color:transparent;color:#fff;
      transform:translateY(-2px)
    }
    .footer-social a.fs-linkedin:hover{background:#0A66C2}
    .footer-social a.fs-instagram:hover{background:linear-gradient(135deg,#F58529,#DD2A7B,#8134AF)}
    .footer-social a.fs-whatsapp:hover{background:#25D366}
    .footer-social a.fs-facebook:hover{background:#1877F2}
    .footer-col h4{
      font-family:'Outfit';font-size:.7rem;text-transform:uppercase;
      letter-spacing:3px;color:rgba(255,255,255,.3);margin-bottom:20px;font-weight:600
    }
    .footer-col a{
      display:flex;align-items:center;gap:8px;
      font-size:.85rem;color:rgba(255,255,255,.5);
      margin-bottom:11px;transition:all .3s ease;text-decoration:none
    }
    .footer-col a:hover{color:#fff;padding-left:6px}
    .footer-col a svg{width:14px;height:14px;opacity:.4;flex-shrink:0}
    .footer-col a:hover svg{opacity:1}
    .footer-contact-item{
      display:flex;align-items:center;gap:12px;margin-bottom:14px
    }
    .footer-contact-icon{
      width:36px;height:36px;border-radius:10px;
      background:rgba(255,255,255,.06);
      border:1px solid rgba(255,255,255,.06);
      display:flex;align-items:center;justify-content:center;
      flex-shrink:0;transition:all .3s ease
    }
    .footer-contact-icon svg{width:16px;height:16px;stroke:rgba(255,255,255,.5);fill:none;stroke-width:1.5}
    .footer-contact-item:hover .footer-contact-icon{
      background:rgba(37,99,235,.15);border-color:rgba(37,99,235,.3)
    }
    .footer-contact-item:hover .footer-contact-icon svg{stroke:#2563EB}
    .footer-contact-item a,.footer-contact-item span{
      font-size:.85rem;color:rgba(255,255,255,.5);text-decoration:none;transition:color .3s
    }
    .footer-contact-item a:hover{color:#fff}
    .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)}
    .footer-bottom .footer-made{
      display:flex;align-items:center;gap:6px
    }
    .footer-bottom .footer-made span.heart{
      color:#EF4444;font-size:.85rem;animation:heartbeat 2s ease infinite
    }
    @keyframes heartbeat{
      0%,100%{transform:scale(1)}
      50%{transform:scale(1.2)}
    }
    @media(max-width:900px){
      .footer-main{grid-template-columns:1fr 1fr;gap:32px}
      .footer-brand{grid-column:1/-1}
      .footer-bottom{flex-direction:column;gap:10px;align-items:flex-start}
    }


    /* ===== 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:#fff !important}

    /* Mobile problem swipe dots */
    .prob-mobile-dots{display:none}


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

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

      /* ─── NAV ─── */
      .nav-hamburger{display:flex;order:3}
      nav{top:10px;width:calc(100% - 24px);padding:10px 6px !important;border-radius:14px}
      nav .container{display:flex;align-items:center}
      .logo{flex:1}
      .logo img{height:38px !important;width:auto}
      /* CTA-Button im Nav auf mobile verstecken – kommt ins Hamburger-Menü */
      nav>.container>.cssbuttons-io{display:none}
      .nav-links{
        position:fixed;top:0;left:0;right:0;bottom:0;
        background:rgba(10,11,15,.98);backdrop-filter:blur(30px);-webkit-backdrop-filter:blur(30px);
        flex-direction:column;align-items:center;justify-content:center;
        gap:0;z-index:105;
        opacity:0;pointer-events:none;transition:opacity .3s ease
      }
      .nav-links.open{opacity:1;pointer-events:auto}
      .nav-links li{width:100%;text-align:center}
      .nav-links a{
        display:block;padding:20px 0 !important;font-size:1.4rem !important;
        color:rgba(255,255,255,.85) !important;font-weight:600 !important;
        border-bottom:1px solid rgba(255,255,255,.06)
      }
      .nav-links a::after{display:none !important}
      .nav-links a:hover{color:#fff !important}
      nav.scrolled .nav-links a{color:rgba(255,255,255,.85) !important}
      .nav-dropdown-menu{position:static !important;transform:none !important;opacity:1 !important;visibility:visible !important;pointer-events:auto !important;background:transparent !important;border:none !important;box-shadow:none !important;padding:0 !important;width:auto !important;max-width:none !important;display:flex !important;flex-direction:column;gap:0;grid-template-columns:1fr !important;overflow:visible;border-radius:0 !important}
      .nav-dropdown-menu::before{display:none}
      .mega-col{border-right:none;padding:0}
      .mega-col-img{display:none}
      .mega-col-links{display:none}
      .mega-col-head{display:block;padding:12px 0;text-align:center;font-size:1rem !important;color:rgba(255,255,255,.55) !important;text-transform:none;letter-spacing:0;font-weight:600 !important}
      .mega-col-head:hover{color:#fff !important}
      /* Scrolled nav – compact */
      nav.scrolled{padding:8px 6px !important;top:8px;width:calc(100% - 20px);border-radius:12px}
      nav.scrolled .logo img{height:30px !important}
      nav.scrolled:hover{padding:8px 0}
      nav.scrolled:hover .logo img{height:30px !important}
      nav.scrolled:hover .nav-links a{font-size:1.4rem !important}

      /* ─── HERO ─── */
      .hero-new{padding:100px 0 56px}
      .hero-new::before,.hero-new::after{display:none}
      .hero-new .hero-row{flex-direction:column;gap:0}
      .hero-new .hero-col-left,.hero-new .hero-col-right{flex:0 0 100%;max-width:100%}
      .hero-new .hero-col-right{display:none}
      .hero-new h1{font-size:clamp(1.75rem,7vw,2.4rem);line-height:1.08;margin-bottom:16px}
      .hero-sub{font-size:15px !important;margin-bottom:28px !important;line-height:1.65 !important}
      .hero-badge-top{font-size:12px;padding:6px 14px;margin-bottom:20px}
      .hero-badge-top img{width:16px !important;height:16px !important}
      .hero-btns{flex-direction:column;gap:10px;align-items:stretch}
      .hero-btns .cssbuttons-io{width:100%;text-align:center;border-radius:8px}
      .hero-btns .cssbuttons-io span{justify-content:center;width:100%;padding:15px 20px;font-size:.88rem}
      .hero-btn-subtext{font-size:11px;max-width:100%;color:rgba(255,255,255,.3);line-height:1.5;margin-top:6px}
      /* Trust-Elemente untereinander */
      .hero-trust-strip{
        flex-direction:column;align-items:flex-start;
        gap:14px;margin-top:24px;padding-top:20px
      }
      .hero-trust-item{gap:10px}
      .hti-icon{width:36px;height:36px;border-radius:8px}
      .hti-text{font-size:13px}
      .hti-text strong{font-size:15px}

      /* ─── MARQUEE ─── */
      .marquee-wrap{padding:18px 0 24px}
      .marquee-label{font-size:.62rem;margin-bottom:16px;letter-spacing:2px}
      .marquee-logo{height:28px}

      /* ─── 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:.72rem}

      /* ─── PROBLEM ─── */
      .prob-hero h2{font-size:clamp(1.6rem,6vw,2.2rem) !important}
      .prob-split{grid-template-columns:1fr;gap:0}
      .pain-list{gap:0}
      .pain-item{padding:16px 14px;font-size:.88rem;margin:0;gap:12px}
      .pain-item::before{width:26px;height:26px;font-size:.8rem;border-radius:6px}
      /* Visuals: horizontal swipe */
      .prob-visual{
        height:auto;min-height:auto;
        display:flex;overflow-x:auto;overflow-y:hidden;
        scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;
        gap:12px;border:none;background:none;border-radius:0;
        margin:20px 0 0;padding:0 0 8px;
        scrollbar-width:none
      }
      .prob-visual::-webkit-scrollbar{display:none}
      .prob-screen{
        position:relative !important;opacity:1 !important;transform:none !important;
        pointer-events:auto !important;
        min-width:88%;max-width:88%;flex-shrink:0;
        scroll-snap-align:center;
        border-radius:16px;overflow:hidden;
        border:1px solid var(--border);
        height:280px
      }
      .prob-screen:first-child{margin-left:0}
      .prob-screen:last-child{margin-right:0}
      .prob-mobile-dots{
        display:flex;justify-content:center;gap:6px;margin-top:14px
      }
      .prob-mobile-dots span{
        width:6px;height:6px;border-radius:50%;
        background:var(--border2);transition:all .3s
      }
      .prob-mobile-dots span.active{background:var(--accent);width:20px;border-radius:3px}
      .prob-bottom{grid-template-columns:1fr;gap:24px}
      .prob-text{font-size:.88rem}
      .prob-highlight{padding:22px 24px;font-size:.88rem}
      .prob-cta{padding:22px 24px;font-size:.9rem}

      /* ─── BIG TEXT ─── */
      .big-text-section{padding:64px 20px 80px}
      .big-text{font-size:clamp(2.2rem,10vw,3.8rem) !important}

      /* ─── LEISTUNGEN ─── */
      .ls-bento{grid-template-columns:1fr;gap:8px}
      .ls-cell--1,.ls-cell--2,.ls-cell--3,.ls-cell--4,.ls-cell--5{grid-column:1;min-height:auto}
      .ls-cell{padding:20px 16px;border-radius:16px}
      .ls-cell--5{flex-direction:column;gap:16px}
      .ls-cell h3{font-size:1.05rem}
      .ls-cell-num{font-size:4rem}
      .ls-cell-desc{font-size:.8rem}
      .ls-cell-cta{padding:7px 14px;font-size:.65rem}
      .ls-cell-bottom{flex-direction:column;align-items:flex-start;gap:10px}
      .ls-mini-browser{width:100%}
      .ls-seo-num{font-size:2rem}
      .ls-tags{gap:4px}
      .ls-tag{font-size:.6rem;padding:3px 7px}

      /* ─── LÖSUNG ─── */
      .sol-split{grid-template-columns:1fr;gap:20px}
      .sol-visual{min-height:250px}
      .sol-step{padding:18px 20px;gap:14px}
      .sol-step-num{width:32px;height:32px;font-size:.78rem}
      .sol-step-content h4{font-size:.92rem}
      .sol-step-content p{font-size:.82rem}
      .sol-funnel{font-size:clamp(1rem,4.5vw,1.4rem)}
      .sol-result{padding:20px 22px;font-size:.88rem}
      .sol-result::before{left:22px;width:40px}
      .sol-intro{font-size:.9rem}

      /* ─── PROOF ─── */
      .proof-slide{grid-template-columns:1fr;gap:14px}
      .pc{padding:22px 20px}
      .pc blockquote{font-size:.88rem;padding-left:14px;line-height:1.7}
      .pc-company{font-size:.68rem}
      .pc-result{font-size:1.15rem}
      .google-bar{flex-wrap:wrap;gap:12px;padding:16px;border-radius:14px}
      .google-bar .stars{font-size:1.1rem}
      .google-bar .g-text{font-size:.85rem}
      .proof-btn{width:42px;height:42px;font-size:.95rem}

      /* ─── ABLAUF ─── */
      .ab-wrap{padding:56px 0;margin-top:48px}
      .ab-header{margin-bottom:36px}
      .ab-step{grid-template-columns:1fr;min-height:auto}
      .ab-step-info{padding:22px 20px 16px}
      .ab-step-visual{padding:0 20px 20px;border-left:none;border-top:1px solid rgba(255,255,255,.06)}
      .ab-step-num{font-size:1.4rem;margin-bottom:8px}
      .ab-step h3{font-size:.95rem}
      .ab-step p{font-size:.78rem;line-height:1.65}
      .ab-step-tag{font-size:.6rem;padding:4px 10px;margin-top:10px}
      .ab-step-screen{max-width:100%}
      .il-meet,.il-figma,.il-vscode,.il-gsc{height:150px}

      /* ─── FÜR WEN ─── */
      .fw-split{grid-template-columns:1fr;gap:24px}
      .fw-left{position:static}
      .fw-score{padding:16px 18px;gap:14px;flex-direction:row;text-align:left}
      .fw-score-ring{width:56px;height:56px;flex-shrink:0}
      .fw-score-num{font-size:1.1rem}
      .fw-score-text{font-size:.78rem}
      .fw-score-text strong{font-size:.85rem}
      .fw-match-text{font-size:.85rem}
      .fw-visual{margin-top:14px}
      .fw-vis-body{padding:16px}
      .fw-vis-row{gap:8px;margin-bottom:10px}
      .fw-vis-label{width:90px;font-size:.62rem}
      .fw-vis-val{width:44px;font-size:.62rem}
      .fw-vis-bar-wrap{height:5px}
      .fw-check{padding:14px 16px;gap:12px}
      .fw-check-box{width:24px;height:24px;border-radius:6px;font-size:.72rem}
      .fw-check-content h4{font-size:.85rem}
      .fw-check-content p{font-size:.75rem;line-height:1.5}
      .fw-check-tag{padding:3px 8px;font-size:.58rem}
      .fw-bottom{margin-top:32px}
      .fw-bottom-inner{padding:24px 20px}
      .fw-bottom h3{font-size:1.05rem}
      .fw-bottom-sub{font-size:.8rem}
      .fw-magnet-form{flex-direction:column;gap:10px}
      .fw-magnet-input{padding:13px 16px;font-size:.85rem;border-radius:10px}
      .fw-magnet-form .cssbuttons-io{width:100%}
      .fw-magnet-form .cssbuttons-io span{padding:13px 20px;font-size:.82rem;justify-content:center;width:100%}
      .fw-magnet-hint{flex-wrap:wrap;gap:10px;font-size:.65rem;margin-top:12px}

      /* ─── GUARANTEE ─── */
      .g-split{grid-template-columns:1fr;gap:24px}
      .g-badge-wrap{padding:36px 24px}
      .g-badge-hero{font-size:clamp(3.5rem,12vw,5rem)}
      .g-badge-title{font-size:.72rem;letter-spacing:.14em}
      .g-badge-sub{font-size:.75rem;max-width:240px}
      .g-badge-stats{gap:24px}
      .g-badge-stat .gbs-val{font-size:1rem}
      .g-badge-stat .gbs-lbl{font-size:.55rem}
      .g-card{padding:20px 18px;gap:14px}
      .g-icon{width:40px;height:40px;border-radius:10px}
      .g-icon svg{width:20px;height:20px}
      .g-card h3{font-size:.92rem}
      .g-card p{font-size:.8rem}
      .g-card-accent{font-size:3rem}
      .g-seal{padding:14px 18px;gap:10px}
      .g-seal-icon{width:32px;height:32px;font-size:.9rem}
      .g-seal-text{font-size:.82rem}

      /* ─── FAQ ─── */
      .faq-header{margin-bottom:40px}
      .faq-header h2{font-size:clamp(1.7rem,6vw,2.4rem) !important}
      .fq-row{grid-template-columns:44px 1fr 36px;padding:20px 0}
      .fq-index{font-size:.78rem}
      .fq-q{font-size:.9rem}
      .fq-toggle{width:36px;height:36px}
      .fq-toggle::before{width:14px}
      .fq-toggle::after{height:14px}
      .fq-a-content{padding:0 0 20px 44px;font-size:.82rem;max-width:100%}

      /* ─── WHY BENTO ─── */
      .why-bento{grid-template-columns:1fr;gap:10px;margin-top:36px}
      .wb-1,.wb-2,.wb-3,.wb-4,.wb-5{grid-column:1;grid-row:auto}
      .wb{padding:22px 20px}
      .wb h3{font-size:1rem}
      .wb p{font-size:.82rem}
      .wb-1 h3{font-size:1.05rem}
      .wb-1-visual{gap:10px;margin-top:16px}
      .wb-1-year{padding:10px 14px}
      .wb-1-year .wy-val{font-size:1.2rem}
      .wb-2 .wb-big-stat{font-size:2.4rem}
      .wb-5{flex-direction:column;gap:16px}
      .wb-5-slots{gap:4px}
      .wb-5-slot{width:28px;height:28px;font-size:.58rem}
      .wb-5-counter{width:100%;padding:16px}
      .wb-5-counter .wc-val{font-size:2rem}

      /* ─── CTA ─── */
      .cta-split{grid-template-columns:1fr;gap:32px}
      .cta-left h2{font-size:clamp(1.5rem,5.5vw,1.8rem)}
      .cta-left>p{font-size:.88rem;margin-bottom:24px}
      .cta-s{padding:16px 18px;gap:14px}
      .cta-s-icon{width:40px;height:40px;border-radius:10px;font-size:1.1rem}
      .cta-s-text h4{font-size:.85rem}
      .cta-s-text p{font-size:.72rem}
      .cta-form-card{padding:24px 20px}
      .cta-form-card::before{height:3px}
      .cta-form-card h3{font-size:1.05rem;margin-bottom:4px}
      .cta-form-card>p{font-size:.82rem;margin-bottom:22px}
      .cta-field label{font-size:.68rem}
      .cta-field input,.cta-field textarea{padding:13px 16px;font-size:.85rem;border-radius:10px}
      .cta-form-card .btn{padding:15px 24px;font-size:.9rem}
      .cta-form-trust{gap:12px;flex-wrap:wrap}
      .cta-form-trust span{font-size:.62rem}
      .cta-trust{font-size:.72rem}

      /* ─── FOOTER ─── */
      .footer-main{grid-template-columns:1fr 1fr;gap:28px}
      .footer-brand{grid-column:1/-1}
      .footer-brand p{font-size:.78rem}
      .footer-col h4{font-size:.62rem;margin-bottom:14px}
      .footer-col a,.footer-col p{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}

      /* ─── STICKY BAR ─── */

      /* ─── GLOBAL ─── */
      .overline{font-size:.72rem;letter-spacing:3px;margin-bottom:14px}
      .overline::before{width:22px}
      .section h2{font-size:clamp(1.6rem,6vw,2.2rem) !important}

      /* GA Dashboard */
      .ga-metrics{grid-template-columns:repeat(2,1fr);gap:6px}
      .ga-metric{padding:8px 10px}
      .ga-metric-label{font-size:.45rem}
      .ga-metric-val{font-size:.8rem}
      .ga-sidebar{width:34px;padding:10px 0;gap:8px}
      .ga-topbar{padding:8px 10px;margin-bottom:10px}
      .ga-topbar span:first-child{font-size:.65rem}
      .ga-bottom-label{font-size:.52rem;padding:6px 10px}
    }
