* {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }

        body {
            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
            line-height: 1.6;
            color: #1a1a1a;
            overflow-x: hidden;
            background: #ffffff;
            max-width: 100vw;
        }

        * {
            max-width: 100%;
        }

        .header {
            background: linear-gradient(135deg, #fbbf24 0%, #f59e0b 100%);
            color: #1a1a1a;
            padding: 1rem 5%;
            position: sticky;
            top: 0;
            z-index: 1000;
            box-shadow: 0 4px 30px rgba(251, 191, 36, 0.3);
            backdrop-filter: blur(10px);
        }

        .nav-container {
            max-width: 1400px;
            margin: 0 auto;
            display: flex;
            justify-content: space-between;
            align-items: center;
        }

        .admin-header {
            background: linear-gradient(135deg, #ffc107 0%, #ff9800 100%);
            margin: 0;
            padding: 0.75rem 2rem;
            border-bottom: 2px solid rgba(0,0,0,0.1);
            border-top: 2px solid rgba(0,0,0,0.1);
        }

        .nav-link {
            color: #1a1a1a;
            font-weight: 600;
            padding: 0.5rem 1rem;
            border-radius: 8px;
            transition: all 0.3s;
        }

        .admin-header .nav-link:hover {
            background: rgba(0,0,0,0.1);
            transform: translateY(-2px);
        }

        .admin-header .nav-link:active {
            background: rgba(0,0,0,0.15);
        }

        .logo {
            font-size: 1.8rem;
            font-weight: 700;
            letter-spacing: -0.5px;
            background: linear-gradient(135deg, #1a1a1a 0%, #4a4a4a 100%);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            background-clip: text;
        }

        .logo a {
            text-decoration: none;
            background: linear-gradient(135deg, #1a1a1a 0%, #4a4a4a 100%);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            background-clip: text;
            transition: all 0.3s ease;
            display: inline-block;
        }

        .logo a:hover {
            background: linear-gradient(135deg, #2d2d2d 0%, #666 100%);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            background-clip: text;
            transform: translateY(-2px);
            filter: drop-shadow(0 4px 6px rgba(0,0,0,0.2));
        }

        .login-btn {
            background: #1a1a1a;
            color: #fbbf24;
            padding: 0.7rem 1.8rem;
            border-radius: 50px;
            text-decoration: none;
            font-weight: 600;
            transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
            box-shadow: 0 4px 15px rgba(0,0,0,0.2);
            position: relative;
            overflow: hidden;
            cursor: pointer;
        }


        .login-btn::before {
            content: '';
            position: absolute;
            top: 0;
            left: -100%;
            width: 100%;
            height: 100%;
            background: linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent);
            transition: left 0.5s;
        }

        .login-btn:hover::before {
            left: 100%;
        }

        .login-btn:hover {
            color: #ffffff;
            transform: translateY(-2px);
            box-shadow: 0 6px 25px rgba(251, 191, 36, 0.4);
        }

        .hero {
            background: linear-gradient(135deg, #fbbf24 0%, #f59e0b 50%, #d97706 100%);
            color: #1a1a1a;
            padding: 8rem 5% 6rem;
            position: relative;
            overflow: hidden;
        }

        .hero::before {
            content: '';
            position: absolute;
            top: -50%;
            right: -20%;
            width: 70%;
            height: 200%;
            background: radial-gradient(circle, rgba(255,255,255,0.1) 0%, transparent 70%);
            animation: rotate 20s linear infinite;
        }

        @keyframes rotate {
            from { transform: rotate(0deg); }
            to { transform: rotate(360deg); }
        }

        .hero::after {
            content: '';
            position: absolute;
            bottom: -5px;
            left: 0;
            right: 0;
            height: 100px;
            background: linear-gradient(to bottom right, transparent 49%, #ffffff 50%);
        }

        .hero-content {
            max-width: 1400px;
            margin: 0 auto;
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 4rem;
            align-items: center;
            position: relative;
            z-index: 1;
        }

        .hero-text h1 {
            font-size: 3.5rem;
            line-height: 1.2;
            margin-bottom: 1.5rem;
            font-weight: 800;
            animation: fadeInUp 0.8s cubic-bezier(0.4, 0, 0.2, 1);
            background: linear-gradient(135deg, #1a1a1a 0%, #4a4a4a 100%);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            background-clip: text;
        }

        .hero-text h1 .light {
            background: none;
            -webkit-background-clip: unset;
            background-clip: unset;
            animation: fadeInUp 2s cubic-bezier(0.4, 0, 0.2, 1);
            -webkit-text-fill-color: #ffffff;
            color: #ffffff;
        }

        @keyframes fadeInUp {
            from {
                opacity: 0;
                transform: translateY(30px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        .hero-text p {
            font-size: 1.3rem;
            margin-bottom: 2.5rem;
            color: #2d2d2d;
            line-height: 1.7;
            animation: fadeInUp 0.8s cubic-bezier(0.4, 0, 0.2, 1) 0.2s backwards;
        }

        .cta-btn {
            display: inline-block;
            background: #1a1a1a;
            color: #fbbf24;
            padding: 1rem 2.5rem;
            border-radius: 50px;
            text-decoration: none;
            font-weight: 700;
            font-size: 1.1rem;
            transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
            box-shadow: 0 10px 30px rgba(0,0,0,0.3);
            animation: fadeInUp 0.8s cubic-bezier(0.4, 0, 0.2, 1) 0.4s backwards;
            position: relative;
            overflow: hidden;
            cursor: pointer;
        }

        .cta-btn::before {
            content: '';
            position: absolute;
            top: 50%;
            left: 50%;
            width: 0;
            height: 0;
            border-radius: 50%;
            background: rgba(251, 191, 36, 0.2);
            transform: translate(-50%, -50%);
            transition: width 0.6s, height 0.6s;
        }

        .cta-btn:hover::before {
            width: 300px;
            height: 300px;
        }

        .cta-btn:hover {
            color: #ffffff;
            transform: translateY(-3px);
            box-shadow: 0 15px 40px rgba(251, 191, 36, 0.4);

        }

        .hero-image {
            position: relative;
            animation: fadeInRight 1s cubic-bezier(0.4, 0, 0.2, 1) 0.3s backwards;
        }

        @keyframes fadeInRight {
            from {
                opacity: 0;
                transform: translateX(50px);
            }
            to {
                opacity: 1;
                transform: translateX(0);
            }
        }

        .hero-image img {
            width: 100%;
            border-radius: 20px;
            box-shadow: 0 20px 60px rgba(0,0,0,0.2);
            transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
        }

        .hero-image:hover img {
            transform: scale(1.02) translateY(-5px);
        }

        .section {
            padding: 6rem 5%;
            max-width: 1400px;
            margin: 0 auto;
            position: relative;
        }

        .big-section {
            padding: 6rem 5%;
            max-width: 90vh;
            margin: 0 auto;
            position: relative;
        }

        .section:nth-child(even) {
            background: linear-gradient(to bottom, #fffbeb 0%, #ffffff 100%);
        }

        .section::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            height: 1px;
            background: linear-gradient(to right, transparent, #fbbf24, transparent);
        }

        .feature-grid {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 5rem;
            align-items: center;
            margin-bottom: 6rem;
            opacity: 0;
            transform: translateY(30px);
            animation: fadeInUp 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
        }

        .feature-grid:nth-child(even) {
            direction: rtl;
        }

        .feature-grid:nth-child(even) > * {
            direction: ltr;
        }

        .feature-content h2 {
            font-size: 2.5rem;
            background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            background-clip: text;
            margin-bottom: 1rem;
            font-weight: 800;
            position: relative;
            display: inline-block;
        }

        .feature-content h2::after {
            content: '';
            position: absolute;
            bottom: -10px;
            left: 0;
            width: 60px;
            height: 4px;
            background: linear-gradient(to right, #fbbf24, transparent);
            border-radius: 2px;
        }

        .feature-content p {
            font-size: 1.2rem;
            color: #555;
            line-height: 1.8;
            margin-top: 2rem;
        }

        .feature-image {
            position: relative;
            border-radius: 15px;
            overflow: hidden;
            box-shadow: 0 10px 40px rgba(251, 191, 36, 0.2);
            transition: all 0.6s cubic-bezier(0.4, 0, 0.2, 1);
        }

        .feature-image::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background: linear-gradient(135deg, rgba(251, 191, 36, 0.1), transparent);
            opacity: 0;
            transition: opacity 0.4s;
            z-index: 1;
        }

        .feature-image:hover::before {
            opacity: 1;
        }

        .feature-image:hover {
            transform: scale(1.03) translateY(-10px);
            box-shadow: 0 20px 60px rgba(251, 191, 36, 0.3);
        }

        .feature-image img {
            width: 100%;
            display: block;
            transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
        }

        .feature-image:hover img {
            transform: scale(1.05);
        }

        .custom-carousel {
            position: relative;
            max-width: 900px;
            margin: 3rem auto;
            border-radius: 15px;
            overflow: hidden;
            box-shadow: 0 10px 40px rgba(251, 191, 36, 0.2);
        }

        .custom-carousel-inner {
            display: flex;
            transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
        }

        .custom-carousel-item {
            min-width: 100%;
            display: flex;
            justify-content: center;
        }

        .custom-carousel-item img {
            width: 100%;
            display: block;
        }

        .custom-carousel-controls {
            position: absolute;
            top: 50%;
            width: 100%;
            display: flex;
            justify-content: space-between;
            transform: translateY(-50%);
            padding: 0 1rem;
        }

        .custom-carousel-btn {
            background: rgba(251, 191, 36, 0.95);
            color: #1a1a1a;
            border: none;
            width: 50px;
            height: 50px;
            border-radius: 50%;
            cursor: pointer;
            font-size: 1.5rem;
            transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
            box-shadow: 0 4px 15px rgba(0,0,0,0.2);
        }

        .custom-carousel-btn:hover {
            background: #f59e0b;
            transform: scale(1.15);
            box-shadow: 0 6px 25px rgba(251, 191, 36, 0.4);
        }

        .contact-section {
            background: linear-gradient(135deg, #fbbf24 0%, #f59e0b 50%, #d97706 100%);
            color: #1a1a1a;
            padding: 5rem 5%;
            text-align: center;
            position: relative;
            overflow: hidden;
        }

        .contact-section::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            height: 100px;
            background: linear-gradient(to top right, transparent 49%, #ffffff 50%);
        }

        .contact-content {
            max-width: 800px;
            margin: 0 auto;
            position: relative;
            z-index: 1;
        }

        .contact-content h2 {
            font-size: 2.8rem;
            margin-bottom: 1.5rem;
            font-weight: 800;
        }

        .contact-content p {
            font-size: 1.2rem;
            margin-bottom: 2rem;
            color: #2d2d2d;
        }

        .contact-wrapper {
            display: grid;
            grid-template-columns: 2fr 1fr;
            gap: 2rem;
            max-width: 1200px;
            margin: 2rem auto;
            align-items: start;
        }

        .contact-form-container {
            background: rgba(255,255,255,0.25);
            backdrop-filter: blur(10px);
            padding: 2.5rem;
            border-radius: 20px;
            border: 2px solid rgba(255,255,255,0.3);
            transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
        }

        .contact-form-container:hover {
            background: rgba(255,255,255,0.35);
            box-shadow: 0 15px 40px rgba(0,0,0,0.2);
            border-color: rgba(255,255,255,0.5);
        }

        .contact-card {
            background: rgba(255,255,255,0.25);
            backdrop-filter: blur(10px);
            padding: 2rem 1.5rem;
            border-radius: 20px;
            transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
            border: 2px solid rgba(255,255,255,0.3);
            text-align: center;
            height: fit-content;
            position: sticky;
            top: 100px;
        }

        .contact-card:hover {
            background: rgba(255,255,255,0.4);
            transform: translateY(-5px);
            box-shadow: 0 15px 40px rgba(0,0,0,0.2);
            border-color: rgba(255,255,255,0.6);
        }

        .contact-card h3 {
            font-size: 1.8rem;
            margin-bottom: 0.5rem;
        }

        .contact-card p {
            font-size: 1.1rem;
            margin-bottom: 1rem;
            color: #2d2d2d;
        }

        .phone-link {
            display: inline-block;
            background: #1a1a1a;
            color: #fbbf24;
            padding: 1rem 2rem;
            border-radius: 50px;
            text-decoration: none;
            font-weight: 700;
            font-size: 1.1rem;
            transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
            box-shadow: 0 10px 30px rgba(0,0,0,0.3);
            margin-top: 1rem;
            cursor: pointer;
        }

        .phone-link:hover {
            color: #ffffff;
            transform: translateY(-2px);
            box-shadow: 0 12px 35px rgba(251, 191, 36, 0.4);
            background: #2d2d2d;
        }

        .contact-form-container form {
            display: flex;
            flex-direction: column;
            gap: 1.5rem;
        }

        .input-group {
            display: flex;
            gap: 0.5rem;
            align-items: center;
            flex-wrap: wrap;
        }

        .input-group-text {
            display: block;
            padding: 0.5rem 1rem;
            background: rgba(255,255,255,0.5);
            border-radius: 8px;
            font-weight: 600;
            white-space: nowrap;
            font-size: 0.9rem;
            text-align: center;
        }

        .input-group input {
            flex: 1;
            min-width: 150px;
        }

        .form-submit-btn {
            display: inline-block;
            background: #1a1a1a;
            color: #fbbf24;
            padding: 1rem 2.5rem;
            border-radius: 50px;
            text-decoration: none;
            font-weight: 700;
            font-size: 1.1rem;
            transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
            box-shadow: 0 10px 30px rgba(0,0,0,0.3);
            border: none;
            cursor: pointer;
            width: 100%;
            text-align: center;
        }

        .form-submit-btn:hover {
            transform: translateY(-2px);
            box-shadow: 0 12px 35px rgba(251, 191, 36, 0.4);
            background: #2d2d2d;
        }

        .invalid-feedback {
            color: #dc2626;
            font-size: 0.875rem;
            margin-top: 0.25rem;
        }

        .honeypot-field {
            position: absolute;
            left: -9999px;
        }

        .testimonials-section {
            padding: 6rem 5%;
            background: linear-gradient(to bottom, #ffffff 0%, #fffbeb 100%);
            position: relative;
        }

        .testimonials-section::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            height: 1px;
            background: linear-gradient(to right, transparent, #fbbf24, transparent);
        }

        .testimonials-content {
            max-width: 1400px;
            margin: 0 auto;
            text-align: center;
        }

        .testimonials-content h2 {
            font-size: 2.8rem;
            background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            background-clip: text;
            margin-bottom: 3rem;
            font-weight: 800;
        }

        .testimonials-grid {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 2rem;
            margin-top: 3rem;
        }

        .testimonial-card {
            background: white;
            padding: 2rem;
            border-radius: 20px;
            box-shadow: 0 10px 40px rgba(251, 191, 36, 0.15);
            transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
            border: 2px solid transparent;
        }

        .testimonial-card:hover {
            transform: translateY(-10px);
            box-shadow: 0 20px 60px rgba(251, 191, 36, 0.25);
            border-color: #fbbf24;
        }

        .testimonial-stars {
            color: #fbbf24;
            font-size: 1.5rem;
            margin-bottom: 1rem;
        }

        .testimonial-text {
            font-size: 1.1rem;
            color: #555;
            line-height: 1.7;
            margin-bottom: 1.5rem;
            font-style: italic;
        }

        .testimonial-author {
            font-weight: 700;
            color: #1a1a1a;
            margin-bottom: 0.25rem;
        }

        .testimonial-company {
            color: #999;
            font-size: 0.9rem;
        }

        .footer {
            background: #1a1a1a;
            color: #999;
            padding: 3rem 5% 2rem;
        }

        .footer-content {
            max-width: 1400px;
            margin: 0 auto;
            display: grid;
            grid-template-columns: 2fr 1fr 1fr 1fr;
            gap: 3rem;
            margin-bottom: 2rem;
        }

        .footer-section h3 {
            color: #fbbf24;
            font-size: 1.2rem;
            margin-bottom: 1rem;
            font-weight: 700;
        }

        .footer-section p {
            line-height: 1.8;
            margin-bottom: 1.5rem;
        }

        .footer-links {
            padding: 0;
            margin: 0;
            list-style: none;
        }

        .footer-links li {
            margin-bottom: 0.75rem;
        }

        .footer-links a {
            color: #999;
            text-decoration: none;
            transition: all 0.3s ease;
            display: inline-block;
        }

        .footer-links a:hover {
            color: #fbbf24;
            transform: translateX(5px);
        }

        .social-links {
            display: flex;
            gap: 1rem;
            margin-top: 1rem;
        }

        .social-icon {
            width: 40px;
            height: 40px;
            background: rgba(251, 191, 36, 0.1);
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            color: #fbbf24;
            text-decoration: none;
            font-size: 1.2rem;
            transition: all 0.3s ease;
            border: 2px solid transparent;
        }

        .social-icon:hover {
            background: #fbbf24;
            color: #1a1a1a;
            transform: translateY(-3px);
            border-color: #fbbf24;
            box-shadow: 0 5px 15px rgba(251, 191, 36, 0.4);
        }

        .social-icon.coming-soon {
            background: rgba(255, 99, 71, 0.08);
            color: #ff6b6b;
            border-color: rgba(220, 53, 69, 0.3);
            cursor: not-allowed;
            opacity: 0.8;
        }

        .social-icon.coming-soon:hover {
            background: rgba(220, 53, 69, 0.15);
            color: #dc3545;
            transform: none; /* kein Hover-Hüpfen */
            box-shadow: none;
        }

        .footer-bottom {
            max-width: 1400px;
            margin: 2rem auto 0;
            padding-top: 2rem;
            border-top: 1px solid #333;
            text-align: center;
        }

        .footer-bottom a {
            color: #fbbf24;
            text-decoration: none;
            margin: 0 1rem;
            transition: all 0.3s ease;
        }

        .footer-bottom a:hover {
            color: #f59e0b;
            text-decoration: underline;
        }

        @media (max-width: 968px) {
            .header {
                padding: 0.8rem 3%;
            }

            .logo {
                font-size: 1.3rem;
            }

            .login-btn {
                padding: 0.5rem 1rem;
                font-size: 0.85rem;
                min-width: 100px;  /* Mindestbreite */
                max-width: 200px;  /* Optional maximale Breite */
                white-space: nowrap;
                text-overflow: ellipsis; /* Kürzt Text, wenn zu lang */
                overflow: hidden;
            }

            .hero {
                padding: 3rem 4% 2rem;
            }

            .hero-content, .feature-grid {
                grid-template-columns: 1fr;
                gap: 2rem;
            }

            .hero-text h1 {
                font-size: 1.75rem;
                line-height: 1.3;
                word-break: break-word;
                hyphens: auto;
            }

            .hero-text p {
                font-size: 1rem;
            }

            .cta-btn {
                padding: 0.85rem 1.8rem;
                font-size: 0.95rem;
            }

            .feature-content h2 {
                font-size: 1.6rem;
            }

            .feature-content p {
                font-size: 1rem;
            }

            .section {
                padding: 3rem 4%;
            }

            .contact-content h2 {
                font-size: 1.8rem;
            }

            .contact-content p {
                font-size: 1rem;
            }

            .testimonials-grid {
                grid-template-columns: 1fr;
                gap: 1.5rem;
            }

            .testimonial-card {
                padding: 1.5rem;
            }

            .footer-content {
                grid-template-columns: 1fr;
                gap: 2rem;
            }

            .social-links {
                justify-content: center;
            }

            .contact-wrapper {
                grid-template-columns: 1fr;
                gap: 1.5rem;
            }

            .contact-card {
                position: static;
                margin-top: 1rem;
            }

            .contact-form-container {
                padding: 1.5rem;
                margin: 1.5rem auto;
            }

            .contact-form-container h3 {
                font-size: 1.4rem !important;
            }

            .input-group {
                flex-direction: column;
                align-items: stretch;
            }

            .input-group-text {
                text-align: center;
            }

            .input-group input {
                min-width: 100%;
            }

            .form-submit-btn {
                padding: 0.9rem 2rem;
                font-size: 1rem;
            }

            .custom-carousel-controls {
                padding: 0 0.5rem;
            }

            .custom-carousel-btn {
                width: 40px;
                height: 40px;
                font-size: 1.2rem;
            }

            .hero::after {
                background: linear-gradient(to bottom, transparent 49%, #ffffff 50%);
            }

            .contact-section::before {
                background: linear-gradient(to top, transparent 49%, #ffffff 50%);
            }
        }

            .toast {
                border-radius: 12px;
                overflow: hidden;
                box-shadow: 0 10px 30px rgba(0,0,0,0.2);
                border: none;
                margin-bottom: 1rem;
                min-width: 300px;
            }

            .toast-header {
                font-weight: 700;
                padding: 0.75rem 1rem;
            }

            .toast-body {
                line-height: 1.6;
            }

                .modal-backdrop {
        background-color: rgba(0, 0, 0, 0.7);
        backdrop-filter: blur(5px);
    }

      /* Newsletter Section */
        .newsletter-section {
            background: linear-gradient(135deg, #fbbf24 0%, #f59e0b 50%, #d97706 100%);
            padding: 4rem 5%;
            margin: 0rem 0;
            text-align: center;
            position: relative;
            overflow: hidden;
        }

        .newsletter-section::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            height: 100px;
            background: linear-gradient(to top right, transparent 49%, #ffffff 50%);
        }

        .newsletter-content {
            max-width: 700px;
            margin: 0 auto;
            position: relative;
            z-index: 1;
        }

        .newsletter-content h2 {
            font-size: 2.5rem;
            margin-bottom: 1rem;
            color: #1a1a1a;
            font-weight: 800;
        }

        .newsletter-content p {
            font-size: 1.2rem;
            color: #2d2d2d;
            margin-bottom: 2rem;
        }

        .newsletter-form {
            display: flex;
            gap: 1rem;
            max-width: 500px;
            margin: 0 auto;
        }

        .newsletter-form input {
            flex: 1;
            padding: 1rem 1.5rem;
            border: 2px solid rgba(255,255,255,0.5);
            border-radius: 50px;
            background: rgba(255,255,255,0.9);
            font-size: 1rem;
            transition: all 0.3s;
        }

        .menu-dropdown {
            padding: 0.4rem 0.3rem;
            background:linear-gradient(135deg, #ffc107 0%, #ff9800 100%)
        }

        .newsletter-form input:focus {
            outline: none;
            border-color: #1a1a1a;
            background: white;
        }

        .newsletter-form button {
            background: #1a1a1a;
            color: #fbbf24;
            padding: 1rem 2rem;
            border: none;
            border-radius: 50px;
            font-weight: 700;
            cursor: pointer;
            transition: all 0.4s;
            white-space: nowrap;
        }

        .newsletter-form button:hover {
            color: #ffffff;
            transform: translateY(-2px);
            box-shadow: 0 8px 25px rgba(0,0,0,0.3);
        }

        .alert-success {
            padding: 1rem 1.8rem;
            border-radius: 50px;
            font-weight: 600;
            font-size: 1rem;

            background: #1a1a1a;
            color: #fbbf24;

            box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
            animation: fadeSlideIn 0.4s ease forwards,
                           fadeOut 0.4s ease 4s forwards;
            }

        /* kleine subtile Animation */
        @keyframes fadeSlideIn {
            from {
                opacity: 0;
                transform: translateY(8px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        @keyframes fadeOut {
            to {
                opacity: 0;
                transform: translateY(-5px);
            }
        }


        /* Dropdown Items */
.dd-item {
    display: flex; align-items: center; gap: 11px;
    padding: 9px 11px; border-radius: 8px;
    text-decoration: none; transition: background 0.15s;
}
.dd-item:hover { background: rgba(251,191,36,0.12); }
.dd-name { display: block; font-size: 13.5px; font-weight: 600; color: #f5f5f5; }
.dd-desc { display: block; font-size: 11px; color: rgba(255,255,255,0.38); }

/* Mobile */
.mobile-section { border-bottom: 1px solid rgba(255,255,255,0.06); }
.mobile-sec-btn {
    display: flex; align-items: center; justify-content: space-between;
    width: 100%; padding: 13px 4px;
    background: transparent; border: none;
    font-family: inherit; font-size: 15px; font-weight: 600;
    color: #f5f5f5; cursor: pointer;
}
.mobile-link {
    display: block; padding: 10px 12px; border-radius: 8px;
    color: rgba(255,255,255,0.75); text-decoration: none;
    font-size: 14px; transition: background 0.15s;
}
.mobile-link:hover { background: rgba(251,191,36,0.1); color: #fbbf24; }

/* Responsive breakpoint */
@media (max-width: 768px) {
    #desktop-nav { display: none !important; }
    #desktop-login { display: none !important; }
    #hamburger-btn { display: flex !important; }
}

/* ── Griff zum Sortieren der Positionen ───────────────────────────────────
   Nur an dieser Zelle laesst sich eine Position ziehen (Sortable "handle").
   Die Zeile enthaelt seit dem Bearbeiten Eingabefelder -- ohne Griff waere
   jeder Klick ins Feld ein Ziehversuch gewesen. */
.sortier-spalte { width: 28px; }

.sortier-griff {
    width: 28px;
    cursor: grab;
    color: #999;
    text-align: center;
    vertical-align: middle;
    user-select: none;
}

.sortier-griff:active {
    cursor: grabbing;
}

tr:hover > .sortier-griff {
    color: #fbbf24;
}

/* ── Cookie-Banner ist ein Hinweis, keine Wahl ────────────────────────────
   Die Seite setzt ausschliesslich technisch notwendige Cookies -- es gibt
   nichts, was man ablehnen koennte, und die Auswahl hatte auch nie eine
   Wirkung (postSelectionCallback ungesetzt, trackingAllowed() nirgends
   abgefragt). Zwei Knoepfe versprachen also eine Entscheidung, die es nicht
   gibt. Es bleibt der bestaetigende Knopf; die Bibliothek setzt damit das
   Cookie auf "false", was dem tatsaechlichen Zustand entspricht.
   Kommen spaeter Analyse- oder Werbe-Cookies dazu, muss diese Regel weg und
   die Auswahl echte Folgen bekommen.
   Der Selektor nimmt .modal-footer mit, weil cookie-consent.css mit
   ".cookie-consent-modal .btn { display: inline-flex }" gleich spezifisch ist
   und nach dieser Datei geladen wird. */
.cookie-consent-modal .modal-footer .btn-accept-all {
    display: none;
}

/* ── reCAPTCHA-Abzeichen ausblenden ───────────────────────────────────────
   Das schwebende Google-Abzeichen stand beim Erstbesuch neben dem
   Cookie-Banner. Google erlaubt das Ausblenden ausdruecklich, solange der
   Hinweis auf Datenschutzerklaerung und Nutzungsbedingungen im Ablauf
   sichtbar bleibt -- der steht jetzt im Cookie-Banner und unter dem
   Anfrageformular (.recaptcha-hinweis).
   visibility statt display: das Abzeichen ist der Anker fuer die
   Challenge-Einblendung, mit display:none verschwindet die mit. */
.grecaptcha-badge {
    visibility: hidden;
}

/* Der Hinweis ist Pflicht, solange das Abzeichen versteckt ist -- er soll aber
   nicht mit dem Formular um Aufmerksamkeit streiten. Klein und gedaempft, mit
   genug Kontrast zum amberfarbenen Grund, um lesbar zu bleiben.
   p.recaptcha-hinweis zusaetzlich zur blossen Klasse, weil ".contact-content p"
   in dieser Datei spezifischer ist (0,1,1) und den Hinweis sonst auf 1.2rem
   aufblaeht. */
.recaptcha-hinweis,
p.recaptcha-hinweis {
    display: block;
    font-size: 0.7rem;
    line-height: 1.35;
    color: rgba(0, 0, 0, 0.65);
    margin-top: 0.9rem;
    margin-bottom: 0;
}

.recaptcha-hinweis a,
p.recaptcha-hinweis a {
    color: inherit;
    text-decoration: underline;
}

/* ── Bootstrap 5.3: zwei Voreinstellungen zurueckgedreht ──────────────────
   Die dunklen Oberflaechen (Rechnungen, Angebote, Abrechnung) stylen
   Bootstrap-Bausteine ueber eigene Klassen und verlassen sich darauf, dass
   Bootstrap Hintergrund und Textfarbe nicht selbst setzt. Bis 5.0.2 war das
   so; 5.3 setzt beides fest und faerbt diese Seiten hell ein. */

/* Zellen hatten bis 5.0.2 "--bs-table-bg: transparent" und gar keine
   Farbangabe. Seit 5.3 sind das var(--bs-body-bg) (weiss) und
   var(--bs-emphasis-color) -- eine dunkle Tabelle wuerde damit weiss.
   .table-light/.table-warning setzen die Variablen auf ihrem eigenen
   Element und funktionieren unveraendert weiter. */
.table {
    --bs-table-bg: transparent;
    --bs-table-color: inherit;
}

/* Dieselbe Geschichte fuer die Container: 5.3 setzt dort
   color: var(--bs-body-color), vorher wurde geerbt. */
.card,
.modal-content,
.accordion-item {
    color: inherit;
}

/* Aufgeklappter Accordion-Kopf in Amber statt Bootstrap-Blau.
   Stand bis Bootstrap 5.0.2 als Aenderung direkt in der Vendor-Datei
   (.accordion-button:not(.collapsed)) -- und ging damit bei jedem Update
   verloren. Seit 5.2 gibt es dafuer Variablen, die Vendor-Dateien bleiben
   dadurch unangetastet. */
.accordion {
    --bs-accordion-active-color: #664d03;
    --bs-accordion-active-bg: #fff3cd;
}