*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
    :root {
      --bg:      #ffffff;
      --bg2:     #f6f5ff;
      --bg3:     #eef0ff;
      --card:    #fafafe;
      --indigo:  #5b50e8;
      --indigo-d:#4538d4;
      --cyan:    #06b6d4;
      --coral:   #ff6b6b;
      --green:   #10b981;
      --amber:   #f59e0b;
      --text:    #1a1535;
      --text2:   #64607f;
      --text3:   #68649b;
      --grad:    linear-gradient(135deg, #5b50e8 0%, #06b6d4 100%);
      --hero-bg: linear-gradient(145deg, #1a1535 0%, #2d2375 45%, #5b50e8 100%);
      --radius:  18px;
      --shadow:  0 4px 24px rgba(91,80,232,.12);
      --shadow-lg:0 12px 48px rgba(91,80,232,.18);
      --tr:      .32s cubic-bezier(.4,0,.2,1);
    }
    html { scroll-behavior: smooth; font-size: 16px; }
    body { font-family:'Plus Jakarta Sans',system-ui,sans-serif; background:var(--bg); color:var(--text); line-height:1.7; overflow-x:hidden; }
    a { color:inherit; text-decoration:none; }
    ::-webkit-scrollbar { width:5px; }
    ::-webkit-scrollbar-track { background:var(--bg2); }
    ::-webkit-scrollbar-thumb { background:var(--indigo); border-radius:3px; }
    .grad-text { background:var(--grad); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }

    /* NAVBAR */
    .navbar { position:fixed; top:0; left:0; right:0; z-index:100; height:68px; padding:0 5%; display:flex; align-items:center; justify-content:space-between; background:rgba(255,255,255,.93); backdrop-filter:blur(20px); border-bottom:1px solid rgba(91,80,232,.08); }
    .navbar::after { content:''; position:absolute; left:0; right:0; top:100%; height:1px; box-shadow:0 4px 28px rgba(91,80,232,.1); opacity:0; transition:opacity var(--tr); pointer-events:none; }
    .navbar.scrolled::after { opacity:1; }
    .nav-logo-wrap { display:flex; align-items:center; text-decoration:none; }
    .nav-links { display:flex; gap:2rem; list-style:none; font-size:.87rem; font-weight:600; letter-spacing:.04em; }
    .nav-links a { color:var(--text2); transition:color var(--tr); position:relative; padding-bottom:3px; }
    .nav-links a::after { content:''; position:absolute; bottom:0; left:0; right:0; height:2px; background:var(--grad); border-radius:2px; transform:scaleX(0); transition:transform var(--tr); }
    .nav-links a:hover { color:var(--indigo); }
    .nav-links a:hover::after { transform:scaleX(1); }
    .nav-cta { padding:.6rem 1.5rem; background:var(--grad); border-radius:50px; font-size:.84rem; font-weight:700; color:#fff !important; box-shadow:0 4px 16px rgba(91,80,232,.3); transition:transform var(--tr),box-shadow var(--tr); display:inline-flex; align-items:center; line-height:1; }
    .nav-cta:hover { transform:translateY(-2px); box-shadow:0 8px 24px rgba(91,80,232,.4); }
    .nav-cta::after { display:none !important; }

    /* HERO */
    .hero { min-height:100vh; background:var(--hero-bg); display:flex; flex-direction:column; justify-content:center; padding:110px 8% 80px; position:relative; overflow:hidden; color:#fff; }
    .orb { position:absolute; border-radius:50%; filter:blur(90px); opacity:.18; pointer-events:none; animation:float 9s ease-in-out infinite; will-change:transform; }
    .orb-1 { width:560px; height:560px; background:#7c71f5; top:-120px; right:-60px; }
    .orb-2 { width:380px; height:380px; background:#06b6d4; bottom:-60px; left:25%; animation-delay:-3.5s; }
    .orb-3 { width:260px; height:260px; background:#ff6b6b; top:35%; left:-80px; animation-delay:-6s; }
    @keyframes float { 0%,100%{transform:translateY(0) scale(1)} 50%{transform:translateY(-26px) scale(1.04)} }
    .hero::before { content:''; position:absolute; inset:0; background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px); background-size:55px 55px; pointer-events:none; }
    .hero-badge { display:inline-flex; align-items:center; gap:.55rem; padding:.4rem 1.1rem; background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.2); border-radius:50px; font-size:.78rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:rgba(255,255,255,.9); margin-bottom:2rem; position:relative; z-index:1; animation:fadeUp .6s ease both; }
    .hero-badge .dot { width:7px; height:7px; border-radius:50%; background:#7ef8d4; box-shadow:0 0 8px #7ef8d4; animation:pulse 2.2s ease infinite; }
    @keyframes pulse { 0%,100%{opacity:1;transform:scale(1)} 50%{opacity:.4;transform:scale(1.5)} }
    .hero h1 { font-size:clamp(2.6rem,5.2vw,4.8rem); font-weight:800; line-height:1.1; letter-spacing:-.025em; overflow-wrap:break-word; hyphens:auto; max-width:740px; position:relative; z-index:1; animation:fadeUp .6s .12s ease both; color:#fff; }
    .hero h1 .accent { background:linear-gradient(90deg,#a5f3fc,#7ef8d4); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
    .hero-sub { margin-top:1.5rem; max-width:560px; font-size:1.1rem; line-height:1.78; color:rgba(255,255,255,.75); position:relative; z-index:1; animation:fadeUp .6s .24s ease both; }
    .hero-ctas { margin-top:2.4rem; display:flex; gap:1rem; flex-wrap:wrap; position:relative; z-index:1; animation:fadeUp .6s .36s ease both; }
    .btn-hero-primary { display:inline-flex; align-items:center; gap:.6rem; padding:.95rem 2rem; background:#fff; border-radius:50px; font-size:.97rem; font-weight:700; color:var(--indigo); box-shadow:0 6px 24px rgba(0,0,0,.2); transition:transform var(--tr),box-shadow var(--tr); }
    .btn-hero-primary:hover { transform:translateY(-3px); box-shadow:0 12px 36px rgba(0,0,0,.28); }
    .btn-hero-ghost { display:inline-flex; align-items:center; gap:.6rem; padding:.95rem 2rem; border:1.5px solid rgba(255,255,255,.35); border-radius:50px; font-size:.97rem; font-weight:600; color:rgba(255,255,255,.9); background:rgba(255,255,255,.08); transition:background var(--tr),border-color var(--tr),transform var(--tr); }
    .btn-hero-ghost:hover { background:rgba(255,255,255,.15); border-color:rgba(255,255,255,.6); transform:translateY(-2px); }
    .hero-stats { display:flex; gap:2.5rem; flex-wrap:wrap; margin-top:4rem; padding-top:2.2rem; border-top:1px solid rgba(255,255,255,.12); position:relative; z-index:1; animation:fadeUp .6s .48s ease both; }
    .stat-number { font-size:2rem; font-weight:800; background:linear-gradient(90deg,#a5f3fc,#7ef8d4); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
    .stat-label { font-size:.8rem; color:rgba(255,255,255,.55); margin-top:.15rem; }
    @keyframes fadeUp { from{opacity:0;transform:translateY(28px)} to{opacity:1;transform:translateY(0)} }

    /* SHARED */
    section { padding:96px 8%; }
    .section-eyebrow { display:inline-block; font-size:.74rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--indigo); margin-bottom:.9rem; }
    .section-title { font-size:clamp(1.9rem,3.2vw,2.8rem); font-weight:800; line-height:1.18; letter-spacing:-.02em; }
    .section-sub { margin-top:.9rem; color:var(--text2); font-size:1.02rem; line-height:1.75; max-width:520px; }
    .section-header { margin-bottom:3.5rem; }
    .btn-primary { display:inline-flex; align-items:center; gap:.55rem; padding:.9rem 2rem; background:var(--grad); border-radius:50px; font-size:.96rem; font-weight:700; color:#fff; box-shadow:0 5px 20px rgba(91,80,232,.3); transition:transform var(--tr),box-shadow var(--tr); }
    .btn-primary:hover { transform:translateY(-2px); box-shadow:0 10px 32px rgba(91,80,232,.42); }
    .btn-outline { display:inline-flex; align-items:center; gap:.55rem; padding:.9rem 2rem; border:1.5px solid var(--indigo); border-radius:50px; font-size:.96rem; font-weight:700; color:var(--indigo); transition:background var(--tr),color var(--tr); }
    .btn-outline:hover { background:var(--indigo); color:#fff; }

    /* LEISTUNGEN */
    .services { background:var(--bg); }
    .services-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(290px,1fr)); gap:1.4rem; }
    .card { background:var(--card); border:1.5px solid rgba(91,80,232,.1); border-radius:var(--radius); padding:2.2rem; transition:transform var(--tr),box-shadow var(--tr),border-color var(--tr); position:relative; overflow:hidden; }
    .card::before { content:''; position:absolute; top:0; left:0; width:100%; height:3px; background:var(--grad); opacity:0; transition:opacity var(--tr); }
    .card:hover { transform:translateY(-5px); box-shadow:var(--shadow-lg); border-color:rgba(91,80,232,.25); }
    .card:hover::before { opacity:1; }
    .card.featured { background:linear-gradient(145deg,#f0eeff 0%,#e8f7ff 100%); border-color:rgba(91,80,232,.25); }
    .card.featured::before { opacity:1; }
    .card-icon { width:52px; height:52px; border-radius:13px; display:flex; align-items:center; justify-content:center; font-size:1.5rem; margin-bottom:1.4rem; }
    .icon-indigo { background:rgba(91,80,232,.1); }
    .icon-cyan   { background:rgba(6,182,212,.1); }
    .icon-coral  { background:rgba(255,107,107,.1); }
    .icon-green  { background:rgba(16,185,129,.1); }
    .icon-amber  { background:rgba(245,158,11,.1); }
    .card-badge { display:inline-block; padding:.22rem .7rem; background:rgba(91,80,232,.08); border-radius:50px; font-size:.7rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--indigo); margin-bottom:.9rem; }
    .card h3 { font-size:1.18rem; font-weight:700; margin-bottom:.65rem; }
    .card p   { font-size:.93rem; color:var(--text2); line-height:1.7; }
    .card-list { list-style:none; margin-top:.9rem; display:flex; flex-direction:column; gap:.4rem; }
    .card-list li { font-size:.88rem; color:var(--text2); padding-left:1.2rem; position:relative; }
    .card-list li::before { content:'→'; position:absolute; left:0; color:var(--indigo); font-weight:700; }
    .card-link { display:inline-flex; align-items:center; gap:.4rem; margin-top:1.4rem; font-size:.86rem; font-weight:700; color:var(--indigo); transition:gap var(--tr); }
    .card:hover .card-link { gap:.65rem; }

    /* HIGHLIGHT */
    .highlight { background:var(--bg2); padding:70px 8%; overflow-x:hidden; }
    .highlight-box { background:var(--bg); border:1.5px solid rgba(91,80,232,.12); border-radius:24px; padding:4rem 5%; display:grid; grid-template-columns:1fr 1.1fr; gap:3.5rem; align-items:center; box-shadow:0 4px 32px rgba(91,80,232,.07); overflow:hidden; }
    .highlight-box > * { min-width:0; width:100%; }
    .highlight-box h2 { font-size:clamp(1.6rem,2.6vw,2.3rem); font-weight:800; margin-bottom:1rem; }
    .highlight-box p  { color:var(--text2); line-height:1.78; }
    .feat-list { display:flex; flex-direction:column; gap:.75rem; }
    .feat-item { display:flex; align-items:center; gap:1rem; padding:1rem 1.3rem; background:var(--bg2); border-radius:14px; border:1px solid rgba(91,80,232,.08); font-size:.9rem; color:var(--text2); transition:border-color var(--tr),background var(--tr),box-shadow var(--tr); overflow-wrap:break-word; word-break:break-word; min-width:0; max-width:100%; line-height:1.5; }
    .feat-item .feat-text { min-width:0; flex:1; }
    .feat-item:hover { border-color:rgba(91,80,232,.18); background:var(--bg3); box-shadow:0 2px 12px rgba(91,80,232,.06); }
    .feat-icon { width:42px; height:42px; border-radius:11px; display:flex; align-items:center; justify-content:center; font-size:1.25rem; flex-shrink:0; background:rgba(91,80,232,.07); }

    /* PROZESS */
    .process { background:var(--bg); }
    .steps-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:1.5rem; }
    .step { text-align:center; padding:2rem 1.4rem; background:var(--bg2); border-radius:var(--radius); border:1px solid rgba(91,80,232,.08); transition:transform var(--tr),box-shadow var(--tr); }
    .step:hover { transform:translateY(-4px); box-shadow:var(--shadow); }
    .step-num { width:52px; height:52px; border-radius:50%; background:var(--grad); color:#fff; font-size:1.1rem; font-weight:800; display:flex; align-items:center; justify-content:center; margin:0 auto 1.3rem; box-shadow:0 4px 16px rgba(91,80,232,.3); }
    .step h3 { font-size:1rem; font-weight:700; margin-bottom:.5rem; }
    .step p   { font-size:.88rem; color:var(--text2); line-height:1.65; }

    /* GEBÜHREN */
    .pricing { background:var(--bg2); }
    .pricing-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:1.5rem; align-items:start; }
    .price-card { background:var(--bg); border:1.5px solid rgba(91,80,232,.12); border-radius:22px; padding:2.2rem; transition:transform var(--tr),box-shadow var(--tr); position:relative; overflow:hidden; }
    .price-card:hover { transform:translateY(-5px); box-shadow:var(--shadow-lg); }
    .price-card.popular { border-color:var(--indigo); background:linear-gradient(145deg,#f0eeff,#eef8ff); }
    .popular-badge { position:absolute; top:1.2rem; right:1.2rem; background:var(--grad); color:#fff; font-size:.7rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; padding:.25rem .75rem; border-radius:50px; }
    .price-icon { width:48px; height:48px; border-radius:12px; background:rgba(91,80,232,.1); display:flex; align-items:center; justify-content:center; font-size:1.4rem; margin-bottom:1.2rem; }
    .price-card h3 { font-size:1.2rem; font-weight:700; margin-bottom:.4rem; }
    .price-card .price-desc { font-size:.9rem; color:var(--text2); margin-bottom:1.4rem; line-height:1.6; }
    .price-amount { font-size:1.8rem; font-weight:800; color:var(--indigo); margin-bottom:.2rem; }
    .price-amount span { font-size:.9rem; font-weight:500; color:var(--text2); }
    .price-note { font-size:.78rem; color:var(--text3); margin-bottom:1.4rem; }
    .price-features { list-style:none; display:flex; flex-direction:column; gap:.6rem; margin-bottom:1.8rem; }
    .price-features li { font-size:.88rem; color:var(--text2); display:flex; align-items:flex-start; gap:.7rem; }
    .price-features li::before { content:'✓'; flex-shrink:0; width:20px; height:20px; border-radius:50%; background:var(--grad); color:#fff; font-size:.65rem; font-weight:900; display:flex; align-items:center; justify-content:center; margin-top:1px; }

    /* ÜBER MICH */
    .about { background:var(--bg); }
    .about-inner { display:grid; grid-template-columns:1fr 1.25fr; gap:5rem; align-items:center; }
    .profile-card { background:var(--bg2); border:1.5px solid rgba(91,80,232,.1); border-radius:24px; padding:2.5rem; box-shadow:0 4px 32px rgba(91,80,232,.08); position:relative; overflow:hidden; }
    .profile-card::after { content:''; position:absolute; top:-60px; right:-60px; width:200px; height:200px; border-radius:50%; background:var(--indigo); opacity:.04; filter:blur(40px); }
    .avatar { width:76px; height:76px; border-radius:50%; background:var(--grad); display:flex; align-items:center; justify-content:center; font-family:'Lora',serif; font-size:1.8rem; font-weight:700; color:#fff; margin-bottom:1.3rem; box-shadow:0 6px 20px rgba(91,80,232,.3); }
    .profile-card h3  { font-size:1.2rem; font-weight:700; }
    .profile-role     { font-size:.87rem; color:var(--indigo); font-weight:600; margin:.25rem 0 1.1rem; }
    .profile-card > p { font-size:.91rem; color:var(--text2); line-height:1.75; }
    .skill-chips { display:flex; flex-wrap:wrap; gap:.6rem; margin-top:1.4rem; }
    .chip { padding:.3rem .85rem; border:1px solid rgba(91,80,232,.2); border-radius:50px; font-size:.76rem; font-weight:600; color:var(--indigo); background:rgba(91,80,232,.05); }
    .about-content .section-sub { max-width:100%; margin-bottom:1.8rem; }
    .benefit-list { list-style:none; display:flex; flex-direction:column; gap:.9rem; }
    .benefit-list li { display:flex; align-items:center; gap:1rem; padding:1rem 1.3rem; background:var(--bg2); border-radius:12px; border:1px solid rgba(91,80,232,.08); font-size:.94rem; color:var(--text2); transition:border-color var(--tr); }
    .benefit-list li:hover { border-color:rgba(91,80,232,.22); }
    .check { width:26px; height:26px; border-radius:50%; background:var(--grad); display:flex; align-items:center; justify-content:center; color:#fff; font-size:.72rem; font-weight:900; flex-shrink:0; }

    /* KONTAKT */
    .contact { background:var(--bg2); }
    .contact-inner { display:grid; grid-template-columns:1fr 1.2fr; gap:5rem; align-items:start; }
    .contact-info .section-sub { max-width:100%; margin-bottom:2rem; }
    .contact-methods { display:flex; flex-direction:column; gap:1rem; }
    .contact-method { display:flex; align-items:center; gap:1.1rem; padding:1.1rem 1.4rem; background:var(--bg); border-radius:14px; border:1px solid rgba(91,80,232,.08); transition:border-color var(--tr),transform var(--tr); }
    .contact-method:hover { border-color:rgba(91,80,232,.22); transform:translateX(4px); }
    .method-icon { width:42px; height:42px; background:rgba(91,80,232,.08); border-radius:10px; display:flex; align-items:center; justify-content:center; font-size:1.1rem; flex-shrink:0; }
    .method-label { font-size:.75rem; color:var(--text2); margin-bottom:.12rem; font-weight:500; }
    .method-value { font-size:.92rem; font-weight:700; color:var(--text); }
    .contact-form { background:var(--bg); border:1.5px solid rgba(91,80,232,.1); border-radius:24px; padding:2.4rem; box-shadow:0 4px 32px rgba(91,80,232,.07); }
    .contact-form h3 { font-size:1.25rem; font-weight:700; margin-bottom:.4rem; }
    .contact-form > p { font-size:.88rem; color:var(--text2); margin-bottom:1.8rem; }
    .form-row { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
    .form-group { margin-bottom:1.1rem; }
    .form-group label { display:block; font-size:.76rem; font-weight:700; letter-spacing:.07em; text-transform:uppercase; color:var(--text2); margin-bottom:.45rem; }
    .form-group input,.form-group textarea,.form-group select { width:100%; background:var(--bg2); border:1.5px solid rgba(91,80,232,.12); border-radius:10px; padding:.8rem 1rem; font-size:.93rem; color:var(--text); outline:none; font-family:inherit; transition:border-color var(--tr),box-shadow var(--tr); }
    .form-group input::placeholder,.form-group textarea::placeholder { color:var(--text3); }
    .form-group input:focus,.form-group textarea:focus,.form-group select:focus { border-color:var(--indigo); box-shadow:0 0 0 3px rgba(91,80,232,.1); background:#fff; }
    .form-group textarea { min-height:110px; resize:vertical; }
    .form-hint { font-size:.75rem; color:var(--text3); margin-top:1rem; }
    .btn-form { width:100%; padding:1rem; background:var(--grad); border:none; border-radius:12px; font-size:.97rem; font-weight:700; color:#fff; cursor:pointer; font-family:inherit; box-shadow:0 5px 20px rgba(91,80,232,.28); transition:opacity var(--tr),transform var(--tr); }
    .btn-form:hover { opacity:.9; transform:translateY(-2px); }

    /* NEWSLETTER */
    .newsletter { background:var(--bg); padding:60px 8%; }
    .newsletter-box { background:linear-gradient(135deg,#f0eeff 0%,#e8f7ff 100%); border:1.5px solid rgba(91,80,232,.15); border-radius:22px; padding:3rem 5%; display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:2rem; }
    .newsletter-box h3 { font-size:1.35rem; font-weight:700; margin-bottom:.4rem; }
    .newsletter-box p  { font-size:.93rem; color:var(--text2); }
    .nl-form { display:flex; gap:.75rem; flex-wrap:wrap; }
    .nl-form input { padding:.8rem 1.3rem; background:#fff; border:1.5px solid rgba(91,80,232,.2); border-radius:50px; font-size:.93rem; color:var(--text); outline:none; width:260px; font-family:inherit; transition:border-color var(--tr); }
    .nl-form input::placeholder { color:var(--text3); }
    .nl-form input:focus { border-color:var(--indigo); }
    .nl-form button { padding:.8rem 1.7rem; background:var(--grad); border:none; border-radius:50px; color:#fff; font-weight:700; font-size:.9rem; cursor:pointer; font-family:inherit; white-space:nowrap; box-shadow:0 4px 14px rgba(91,80,232,.28); transition:opacity var(--tr),transform var(--tr); }
    .nl-form button:hover { opacity:.9; transform:translateY(-1px); }

    /* FOOTER */
    footer { background:var(--text); color:rgba(255,255,255,.75); padding:56px 8% 28px; }
    .footer-top { display:grid; grid-template-columns:1.5fr 1fr 1fr; gap:3.5rem; margin-bottom:2.5rem; }
    .footer-brand p { font-size:.88rem; line-height:1.7; max-width:260px; margin-top:.9rem; }
    .footer-col h4 { font-size:.75rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:rgba(255,255,255,.55); margin-bottom:1.1rem; }
    .footer-col ul { list-style:none; display:flex; flex-direction:column; gap:.65rem; }
    .footer-col ul a { font-size:.88rem; transition:color var(--tr); }
    .footer-col ul a:hover { color:#fff; }
    .footer-bottom { border-top:1px solid rgba(255,255,255,.08); padding-top:1.4rem; display:flex; justify-content:space-between; flex-wrap:wrap; gap:1rem; font-size:.8rem; color:rgba(255,255,255,.55); }
    .footer-bottom a { color:rgba(255,255,255,.55); transition:color var(--tr); }
    .footer-bottom a:hover { color:rgba(255,255,255,.7); }

    /* REVEAL */
    .reveal { opacity:0; transform:translateY(32px); transition:opacity .65s ease,transform .65s ease; }
    .reveal.visible { opacity:1; transform:translateY(0); }

    /* RESPONSIVE */
    @media (max-width:960px) {
      .nav-links { display:none; }
      .about-inner,.contact-inner,.highlight-box { grid-template-columns:1fr; gap:2.5rem; }
      .footer-top { grid-template-columns:1fr 1fr; }
      .form-row { grid-template-columns:1fr; }
      section { padding:68px 6%; }
    }
    @media (max-width:600px) {
      .highlight { padding:40px 4% !important; }
      .highlight-box { padding:1.5rem !important; border-radius:16px; }
      .highlight-box > * { min-width:0; max-width:100%; overflow:hidden; }
      .hero { padding:100px 6% 60px; }
      .hero h1 { font-size:2.1rem; }
      .hero-stats { gap:1.4rem; }
      .footer-top { grid-template-columns:1fr; }
      .newsletter-box { flex-direction:column; }
      .nl-form { flex-direction:column; }
      .nl-form input { width:100%; }
      .pricing-grid { grid-template-columns:1fr; }
    }
  
    /* ===== ERSTGESPRÄCH CTA ===== */
    .erstgespraech-cta {
      margin-top: 3rem;
      background: linear-gradient(135deg, var(--indigo) 0%, #4338ca 100%);
      border-radius: 20px;
      overflow: hidden;
      position: relative;
    }
    .erstgespraech-cta::before {
      content: '';
      position: absolute; top: -60px; right: -60px;
      width: 260px; height: 260px; border-radius: 50%;
      background: rgba(255,255,255,.06); pointer-events: none;
    }
    .erstgespraech-inner {
      display: grid;
      grid-template-columns: auto 1fr auto;
      gap: 3rem; align-items: center;
      padding: 3rem 3.5rem;
    }
    .erstgespraech-badge {
      writing-mode: vertical-rl; text-orientation: mixed;
      transform: rotate(180deg);
      font-size: .72rem; font-weight: 700; letter-spacing: .18em;
      text-transform: uppercase; color: rgba(255,255,255,.55);
    }
    .erstgespraech-text h3 {
      font-size: 1.6rem; font-weight: 800;
      color: #fff; margin-bottom: .75rem; line-height: 1.2;
    }
    .erstgespraech-text p {
      font-size: .92rem; color: rgba(255,255,255,.75);
      line-height: 1.75; max-width: 540px;
    }
    .erstgespraech-list {
      list-style: none; margin-top: 1.2rem;
      display: flex; flex-wrap: wrap; gap: .5rem 1.5rem;
    }
    .erstgespraech-list li {
      font-size: .82rem; color: rgba(255,255,255,.7);
      display: flex; align-items: center; gap: .4rem;
    }
    .erstgespraech-list li::before { content: '✓'; color: #a5f3fc; font-weight: 700; }
    .erstgespraech-action { text-align: center; min-width: 170px; }
    .erstgespraech-price {
      font-size: 3.8rem; font-weight: 800; color: #fff;
      line-height: 1; letter-spacing: -.04em;
    }
    .erstgespraech-note {
      font-size: .75rem; color: rgba(255,255,255,.5);
      letter-spacing: .08em; text-transform: uppercase; margin-top: .3rem;
    }
    .erstgespraech-action .btn-cta-white {
      display: block; text-align: center; margin-top: 1.5rem;
      background: #fff; color: var(--indigo);
      font-size: .88rem; font-weight: 700; letter-spacing: .02em;
      text-decoration: none; padding: .85rem 1.6rem; border-radius: 10px;
      transition: background var(--tr), transform var(--tr); white-space: nowrap;
    }
    .erstgespraech-action .btn-cta-white:hover {
      background: rgba(255,255,255,.88); transform: translateY(-2px);
    }
    @media(max-width:900px) {
      .erstgespraech-inner { grid-template-columns: 1fr; gap: 1.5rem; padding: 2.5rem; }
      .erstgespraech-badge { writing-mode: horizontal-tb; transform: none; }
      .erstgespraech-action { text-align: left; }
      .erstgespraech-action .btn-cta-white { display: inline-flex; }
    }

  
    /* DATEV UO Grid responsive */
    .datev-uo-grid { display:grid; grid-template-columns:1fr 1fr; gap:.6rem; }
    @media (max-width:600px) {
      .datev-uo-grid { grid-template-columns:1fr; }
      .datev-uo-box { margin:0 !important; border-radius:14px !important; }
    }

    .faq-item summary::-webkit-details-marker { display:none; }
    .faq-item[open] .faq-icon { transform:rotate(180deg); }
    .faq-item summary:hover { background:var(--bg3); }
    @media(max-width:600px){ .faq-item summary, .faq-item div { padding-left:18px; padding-right:18px; } }

/* ===== Zusatzstile für Unterseiten (Breadcrumb, Content-Sektionen) ===== */
.breadcrumb { position:relative; z-index:1; font-size:.82rem; color:rgba(255,255,255,.55); margin-bottom:1.6rem; }
.breadcrumb a { color:rgba(255,255,255,.75); text-decoration:none; }
.breadcrumb a:hover { color:#fff; }
.content-section { max-width:1200px; margin:0 auto; padding:56px 8%; }
.content-section h2 { font-family:'Lora',serif; font-size:clamp(1.5rem,2.6vw,2rem); font-weight:700; color:var(--text); margin-bottom:1.2rem; letter-spacing:-.01em; }
.content-section h3 { font-size:1.1rem; font-weight:700; color:var(--text); margin:1.6rem 0 .5rem; }
.content-section p { color:var(--text2); line-height:1.8; font-size:.98rem; }
.content-section p + p { margin-top:1rem; }
.detail-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:1.4rem; margin-top:1.6rem; }
.detail-card { background:var(--card); border-radius:16px; padding:1.6rem 1.7rem; border:1px solid rgba(91,80,232,.09); }
.detail-card h3 { margin-top:0; font-size:1rem; }
.detail-card p { font-size:.9rem; }
.local-note { background:var(--bg2); border-radius:16px; padding:1.6rem 1.8rem; margin-top:1.6rem; font-size:.92rem; color:var(--text2); line-height:1.8; }
.local-note strong { color:var(--text); }
    /* ===== LEGAL MODALS ===== */
    .legal-modal {
      display: none; position: fixed; inset: 0; z-index: 9000;
      background: rgba(10,8,30,.7); backdrop-filter: blur(4px);
      overflow-y: auto; padding: 2rem 1rem;
    }
    .legal-modal.open { display: flex; align-items: flex-start; justify-content: center; }
    .legal-modal-inner {
      background: #fff; border-radius: 16px; padding: 2.5rem;
      max-width: 720px; width: 100%; position: relative;
      box-shadow: 0 24px 80px rgba(91,80,232,.18);
      margin: auto;
    }
    .legal-modal-inner h2 { font-size: 1.6rem; font-weight: 800; color: var(--indigo); margin-bottom: 1.5rem; }
    .legal-modal-inner h3 { font-size: 1.05rem; font-weight: 700; margin: 1.4rem 0 .5rem; color: #1a1535; }
    .legal-modal-inner p { font-size: .93rem; line-height: 1.7; color: #444; margin-bottom: .75rem; }
    .legal-modal-inner a { color: var(--indigo); }
    .modal-close {
      position: absolute; top: 1rem; right: 1rem;
      background: var(--bg3); border: none; border-radius: 50%;
      width: 36px; height: 36px; cursor: pointer; font-size: 1rem;
      color: #555; display: flex; align-items: center; justify-content: center;
    }
    .modal-close:hover { background: var(--indigo); color: #fff; }

    /* ===== COOKIE BANNER ===== */
    .cookie-banner {
      position: fixed; bottom: 0; left: 0; right: 0; z-index: 8000;
      background: #fff; border-top: 2px solid var(--bg3);
      box-shadow: 0 -8px 40px rgba(91,80,232,.12);
      padding: 1.5rem 2rem;
    }
    .cookie-banner-inner { max-width: 1200px; margin: 0 auto; }
    .cookie-text strong { font-size: 1rem; font-weight: 700; color: #1a1535; }
    .cookie-text p { font-size: .88rem; color: #555; margin: .3rem 0 1rem; }
    .cookie-text a { color: var(--indigo); text-decoration: underline; }
    .cookie-options { display: flex; gap: 2rem; flex-wrap: wrap; margin-bottom: 1rem; }
    .cookie-toggle { display: flex; align-items: center; gap: .5rem; font-size: .9rem; cursor: pointer; color: #333; }
    .cookie-toggle input { accent-color: var(--indigo); width: 16px; height: 16px; }
    .cookie-buttons { display: flex; gap: .75rem; flex-wrap: wrap; }
    .btn-cookie-reject {
      padding: .6rem 1.2rem; border: 1.5px solid #ddd; border-radius: 8px;
      background: transparent; cursor: pointer; font-size: .9rem; color: #555;
    }
    .btn-cookie-reject:hover { border-color: var(--indigo); color: var(--indigo); }
    .btn-cookie-save {
      padding: .6rem 1.2rem; border: 1.5px solid var(--indigo); border-radius: 8px;
      background: transparent; cursor: pointer; font-size: .9rem; color: var(--indigo); font-weight: 600;
    }
    .btn-cookie-save:hover { background: var(--bg3); }
    .btn-cookie-accept {
      padding: .6rem 1.4rem; border-radius: 8px; background: var(--indigo);
      color: #fff; border: none; cursor: pointer; font-size: .9rem; font-weight: 700;
    }
    .btn-cookie-accept:hover { background: #4a40d4; }

    /* ===== DARK MODE ===== */
    [data-theme="dark"] {
      --bg:    #07050f;
      --bg2:   #0e0b1c;
      --bg3:   #150f2a;
      --card:  #110c20;
      --text:  rgba(240,238,255,1);
      --text2: rgba(240,238,255,.65);
      --text3: rgba(240,238,255,.55);
      --shadow: 0 4px 24px rgba(0,0,0,.45);
      --hero-bg: linear-gradient(145deg,#07050f 0%,#0e0b1c 45%,#150f2a 100%);
    }
    /* Glassmorphism cards in dark mode */
    [data-theme="dark"] .card,
    [data-theme="dark"] .price-card { background:rgba(255,255,255,.05)!important; border:1px solid rgba(255,255,255,.08)!important; color:var(--text)!important; }
    [data-theme="dark"] .price-card.popular { background:linear-gradient(145deg,rgba(91,80,232,.25),rgba(6,182,212,.15))!important; border-color:rgba(91,80,232,.4)!important; }
    [data-theme="dark"] h1,[data-theme="dark"] h2,[data-theme="dark"] h3,
    [data-theme="dark"] h4,[data-theme="dark"] h5,[data-theme="dark"] p,
    [data-theme="dark"] li,[data-theme="dark"] span:not(.faq-icon):not(.dm-toggle),
    [data-theme="dark"] label { color:var(--text)!important; }
    [data-theme="dark"] .text-muted,[data-theme="dark"] .card p,
    [data-theme="dark"] [style*="color:var(--text2)"],
    [data-theme="dark"] [style*="color: var(--text2)"] { color:rgba(240,238,255,.65)!important; }
    [data-theme="dark"] .navbar { background:rgba(7,5,15,.95)!important; backdrop-filter:blur(20px)!important; border-bottom:1px solid rgba(91,80,232,.25)!important; }
    [data-theme="dark"] body { background:var(--bg)!important; }
    [data-theme="dark"] .card,
    [data-theme="dark"] .price-card { background:var(--card)!important; }
    [data-theme="dark"] .price-card.popular { background:linear-gradient(145deg,#1a1442,#111e30)!important; }
    [data-theme="dark"] .feat-item,
    [data-theme="dark"] .step,
    [data-theme="dark"] .highlight-box,
    [data-theme="dark"] .profile-card,
    [data-theme="dark"] .contact-method { background:var(--card)!important; }
    [data-theme="dark"] .faq-item { background:rgba(255,255,255,.04)!important; border:1px solid rgba(255,255,255,.08)!important; }
    [data-theme="dark"] .faq-item summary { color:rgba(240,238,255,1)!important; }
    [data-theme="dark"] .faq-item div { color:rgba(240,238,255,.65)!important; }
    [data-theme="dark"] .nav-link, [data-theme="dark"] .navbar a:not(.nav-cta) { color:rgba(240,238,255,.85)!important; }
    [data-theme="dark"] section:not(.hero):not(.kpi-bar) { background:var(--bg)!important; }
    [data-theme="dark"] #leistungen, [data-theme="dark"] #prozess, [data-theme="dark"] #preise, [data-theme="dark"] #ueber-mich, [data-theme="dark"] #kontakt, [data-theme="dark"] #geo-steckbrief { background:var(--bg)!important; }
    /* Geo-Steckbrief card fix */
    [data-theme="dark"] #geo-steckbrief > div > div,
    [data-theme="dark"] [style*="background:linear-gradient(135deg,#f0eeff"],
    [data-theme="dark"] [style*="background: linear-gradient(135deg,#f0eeff"] { background:rgba(91,80,232,.12)!important; border-color:rgba(91,80,232,.25)!important; }
    [data-theme="dark"] #geo-steckbrief p,
    [data-theme="dark"] #geo-steckbrief span,
    [data-theme="dark"] #geo-steckbrief div { color:var(--text2)!important; }
    [data-theme="dark"] #geo-steckbrief strong { color:var(--text)!important; }
    [data-theme="dark"] #geo-steckbrief [style*="color:var(--indigo)"],
    [data-theme="dark"] #geo-steckbrief [style*="color: var(--indigo)"] { color:#06b6d4!important; }
    /* Multi-step / quiz widget dark fix */
    [data-theme="dark"] .quiz-widget,
    [data-theme="dark"] [id*="quiz"], [data-theme="dark"] [id*="kontakt-wizard"],
    [data-theme="dark"] .contact-form, [data-theme="dark"] .step-form,
    [data-theme="dark"] [style*="background:#fff"][style*="border-radius"] { background:rgba(255,255,255,.05)!important; border-color:rgba(255,255,255,.08)!important; }
    [data-theme="dark"] input[type="radio"] + label,
    [data-theme="dark"] .option-label,
    [data-theme="dark"] [class*="option"] { background:rgba(255,255,255,.05)!important; border-color:rgba(255,255,255,.1)!important; color:var(--text)!important; }
    [data-theme="dark"] [class*="option"]:hover { background:rgba(91,80,232,.18)!important; border-color:rgba(91,80,232,.4)!important; }
    [data-theme="dark"] .faq-section { background:var(--bg2)!important; }
    [data-theme="dark"] .form-group input,
    [data-theme="dark"] .form-group textarea,
    [data-theme="dark"] .form-group select { background:var(--bg3)!important; border-color:rgba(91,80,232,.25)!important; color:var(--text)!important; }
    [data-theme="dark"] .kpi-bar { background:var(--bg2)!important; }
    [data-theme="dark"] .kpi-item { border-color:rgba(255,255,255,.07)!important; }
    [data-theme="dark"] .review-card-inner { background:var(--card)!important; }
    [data-theme="dark"] #bewertungen { background:var(--bg)!important; }
    [data-theme="dark"] .newsletter-box { background:linear-gradient(135deg,#130f2a,#0d1a24)!important; }
    [data-theme="dark"] footer { background:#030208!important; }
    /* Dark mode toggle button */
    .dm-toggle { width:36px;height:36px;border-radius:50%;background:rgba(91,80,232,.1);border:1.5px solid rgba(91,80,232,.22);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:transform .3s;font-size:.9rem;margin-left:.6rem;flex-shrink:0; }
    .dm-toggle:hover { background:rgba(91,80,232,.22);transform:scale(1.1); }
    [data-theme="dark"] .dm-toggle { background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.14); }

/* ===== Web Fonts (lokal gehostet, DSGVO-konform) ===== */
    @font-face {
      font-family: 'Plus Jakarta Sans';
      font-style: normal;
      font-weight: 400 800;
      font-display: swap;
      src: url('/fonts/plusjakartasans-latin-ext.woff2') format('woff2');
      unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
    }
    /* Plus Jakarta Sans – latin */
    @font-face {
      font-family: 'Plus Jakarta Sans';
      font-style: normal;
      font-weight: 400 800;
      font-display: swap;
      src: url('/fonts/plusjakartasans-latin.woff2') format('woff2');
      unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
    }
    /* Lora – latin-ext */
    @font-face {
      font-family: 'Lora';
      font-style: normal;
      font-weight: 600 700;
      font-display: swap;
      src: url('/fonts/lora-latin-ext.woff2') format('woff2');
      unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
    }
    /* Lora – latin */
    @font-face {
      font-family: 'Lora';
      font-style: normal;
      font-weight: 600 700;
      font-display: swap;
      src: url('/fonts/lora-latin.woff2') format('woff2');
      unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
    }