*, *::before, *::after { box-sizing: border-box; }
            html { scroll-behavior: smooth; }

            body {
                overflow-x: hidden;
                font-family: "Lexend Deca", sans-serif;
                background: transparent;
                transition: background-color 0.4s ease, color 0.4s ease;
            }

            .site-container {
                width: 100%;
                max-width: 1280px;
                margin: 0 auto;
                padding: 0 2rem;
            }
            @media (min-width: 768px) { .site-container { padding: 0 4rem; } }
            @media (min-width: 1024px) { .site-container { padding: 0 5rem; } }

            /* ANIMACJE TŁA */
            body::before {
                content: "";
                position: fixed;
                inset: 0;
                z-index: -10;
                background: radial-gradient(ellipse 80% 60% at 20% 30%, #fff5f0 0%, #f4f6f8 50%, #e8edf2 100%);
                animation: bgPulse 12s ease-in-out infinite alternate;
                transition: background 0.4s ease;
            }
            [data-theme="dark"] body::before {
                background: radial-gradient(ellipse 80% 60% at 20% 30%, #120a05 0%, #0d1017 50%, #090b10 100%);
            }
            @keyframes bgPulse {
                0% { background-position: 0% 0%; }
                100% { background-position: 100% 100%; }
            }

            body::after {
                content: "";
                position: fixed;
                inset: 0;
                z-index: -9;
                pointer-events: none;
                opacity: 0.025;
                background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
            }

            /* NAVBAR I MENU */
            #navbar {
                position: fixed;
                top: 0; left: 0; right: 0;
                z-index: 100;
                transition: all 0.4s ease;
                padding: 1.25rem 0;
            }
            #navbar.scrolled {
                background: oklch(var(--b1) / 0.7);
                backdrop-filter: blur(20px);
                -webkit-backdrop-filter: blur(20px);
                border-bottom: 1px solid oklch(var(--bc) / 0.06);
                padding: 0.75rem 0;
                box-shadow: 0 8px 32px rgba(0, 0, 0, 0.08);
            }

            #mobile-menu {
                position: fixed;
                inset: 0;
                z-index: 99;
                background: oklch(var(--b1) / 0.97);
                backdrop-filter: blur(20px);
                display: flex;
                flex-direction: column;
                align-items: center;
                justify-content: center;
                gap: 2rem;
                transform: translateX(100%);
                transition: transform 0.4s cubic-bezier(0.77, 0, 0.175, 1);
            }
            #mobile-menu.open { transform: translateX(0); }
            #mobile-menu a {
                font-family: "Bebas Neue", sans-serif;
                font-size: 2.5rem;
                letter-spacing: 0.05em;
                color: var(--bc);
                transition: color 0.2s;
                display: flex;
                align-items: center;
                gap: 1rem;
            }
            #mobile-menu a:hover { color: #ff7538; }

            .hamburger {
                width: 24px; height: 18px;
                position: relative; cursor: pointer;
                display: flex; flex-direction: column; justify-content: space-between;
            }
            .hamburger span {
                display: block; height: 2px; background: currentColor;
                border-radius: 2px; transition: all 0.3s ease; transform-origin: center;
            }
            .hamburger.active span:nth-child(1) { transform: translateY(8px) rotate(45deg); }
            .hamburger.active span:nth-child(2) { opacity: 0; transform: scaleX(0); }
            .hamburger.active span:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }

            /* HERO */
            #hero {
                position: relative;
                min-height: 100vh;
                overflow: hidden;
                display: flex;
                align-items: center;
                background: transparent;
            }

            .hero-grid-pattern {
                position: absolute;
                inset: 0;
                z-index: 1;
                pointer-events: none;
                opacity: 0.035;
                background-image: 
                    linear-gradient(currentColor 1px, transparent 1px),
                    linear-gradient(90deg, currentColor 1px, transparent 1px);
                background-size: 60px 60px;
                color: oklch(var(--bc));
            }

            @keyframes glowPulse {
                0%, 100% { opacity: 0.5; transform: translateY(-50%) scale(1); }
                50% { opacity: 0.8; transform: translateY(-50%) scale(1.1); }
            }

            /* CURSOR */
            #cursor-dot {
                position: fixed; z-index: 9999; pointer-events: none;
                width: 8px; height: 8px; border-radius: 50%;
                background: #ff7538; transform: translate(-50%, -50%);
                transition: opacity 0.3s; mix-blend-mode: multiply;
            }
            [data-theme="dark"] #cursor-dot { mix-blend-mode: screen; }
            #cursor-ring {
                position: fixed; z-index: 9998; pointer-events: none;
                width: 40px; height: 40px; border-radius: 50%;
                border: 1.5px solid rgba(255, 117, 56, 0.5);
                transform: translate(-50%, -50%);
                transition: width 0.3s, height 0.3s, border-color 0.3s;
            }

            /* BUTTONS */
            .btn-primary {
                display: inline-flex; align-items: center; gap: 0.5rem;
                background: #ff7538; color: #fff; padding: 0.85rem 2rem;
                border-radius: 999px; font-weight: 700; font-size: 0.85rem;
                letter-spacing: 0.05em; text-transform: uppercase;
                box-shadow: 0 12px 30px rgba(255, 117, 56, 0.35);
                transition: all 0.3s ease; border: none;
            }
            .btn-primary:hover {
                transform: translateY(-3px) scale(1.02);
                box-shadow: 0 20px 40px rgba(255, 117, 56, 0.45);
            }

            /* CARDS & SHINE EFFECT */
            .card-glass {
                position: relative;
                overflow: hidden;
                background: oklch(var(--b1) / 0.7);
                backdrop-filter: blur(12px);
                border: 1px solid oklch(var(--bc) / 0.07);
                border-radius: 1.75rem;
                transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275), box-shadow 0.4s ease;
            }
            
            .card-glass::after {
                display: none;
            }

            .card-glass:hover {
                transform: none;
                box-shadow: none;
            }

            /* ANIMACJA PASKÓW POSTĘPU */
            @keyframes fillBar {
                from { width: 0%; }
            }
            .animate-fill {
                animation: fillBar 1.5s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards;
                animation-delay: 0.5s;
            }

            /* ANIMACJA NUMERÓW PROCESU */
            .process-num {
                transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
                display: inline-block;
            }
            .reveal:hover .process-num {
                transform: translateY(-10px) scale(1.1);
                color: #ff7538;
                opacity: 0.9;
            }

            .section-badge {
                display: inline-flex; align-items: center; gap: 0.5rem;
                background: rgba(255, 117, 56, 0.1); color: #ff7538;
                padding: 0.35rem 1rem; border-radius: 999px;
                font-size: 0.7rem; font-weight: 800; letter-spacing: 0.15em;
                text-transform: uppercase; border: 1px solid rgba(255, 117, 56, 0.25);
            }

            .ticker-track {
                display: flex; gap: 3rem; width: max-content;
                animation: ticker 25s linear infinite;
            }
            @keyframes ticker {
                0% { transform: translateX(0); }
                100% { transform: translateX(-50%); }
            }
            .ticker-item {
                display: flex; align-items: center; gap: 0.75rem;
                font-size: 0.8rem; font-weight: 700; opacity: 0.55; text-transform: uppercase;
            }
            .ticker-dot { width: 5px; height: 5px; border-radius: 50%; background: #ff7538; }

            .testimonial-wrap { overflow: hidden; width: 100%; padding: 1rem 0; }
            .testimonial-track {
                display: flex; gap: 2rem; width: max-content;
                animation: scrollTestimonials 30s linear infinite;
            }
            .testimonial-track:hover { animation-play-state: paused; }
            @keyframes scrollTestimonials {
                0% { transform: translateX(0); }
                100% { transform: translateX(calc(-50% - 1rem)); }
            }

            .reveal { opacity: 0; transform: translateY(40px); transition: opacity 0.7s ease, transform 0.7s cubic-bezier(0.175, 0.885, 0.32, 1.275); }
            .reveal.visible { opacity: 1; transform: translateY(0); }
            
            @keyframes hFloat {
                0%, 100% { transform: translateY(0); }
                50% { transform: translateY(-12px); }
            }
            
            /* Przejścia wartości kalkulatora */
            #calc-result {
                transition: color 0.3s ease, transform 0.15s ease, opacity 0.15s ease;
            }

            /* SCROLL MARGIN - sekcje nie chowają się pod navbar */
            #uslugi, #cennik, #kalkulator, #zespol, #proces, #galeria, #opinie, #faq, #kontakt {
                scroll-margin-top: 80px;
            }

            /* CUSTOM SCROLLBAR */
            ::-webkit-scrollbar { width: 8px; }
            ::-webkit-scrollbar-track { background: transparent; }
            ::-webkit-scrollbar-thumb {
                background: rgba(255, 117, 56, 0.3);
                border-radius: 999px;
            }
            ::-webkit-scrollbar-thumb:hover { background: rgba(255, 117, 56, 0.5); }
            [data-theme="dark"] ::-webkit-scrollbar-thumb { background: rgba(255, 117, 56, 0.25); }
            [data-theme="dark"] ::-webkit-scrollbar-thumb:hover { background: rgba(255, 117, 56, 0.45); }
            * { scrollbar-width: thin; scrollbar-color: rgba(255, 117, 56, 0.3) transparent; }

            /* IKONA USŁUGI - kontener SVG */
            .service-icon {
                width: 4rem; height: 4rem;
                display: flex; align-items: center; justify-content: center;
                background: rgba(255, 117, 56, 0.1);
                border: 1px solid rgba(255, 117, 56, 0.2);
                border-radius: 1rem;
                color: #ff7538;
                margin-bottom: 2rem;
                transition: all 0.3s ease;
            }
            .service-icon svg { width: 2rem; height: 2rem; }
            .card-glass:hover .service-icon {
                background: rgba(255, 117, 56, 0.15);
                transform: scale(1.05);
            }

            /* ETYKIETA NAJPOPULARNIEJSZY na karcie cennika */
            .popular-badge {
                position: absolute;
                top: 12px; right: 12px;
                background: #ff7538; color: #fff;
                font-size: 0.6rem; font-weight: 800;
                letter-spacing: 0.1em; text-transform: uppercase;
                padding: 0.25rem 0.75rem;
                border-radius: 999px;
                z-index: 5;
            }

            /* KROKI PROCESU - linia łącząca */
            .process-step { position: relative; }
            .process-step::after {
                content: "";
                position: absolute;
                top: 2.5rem; right: -1.5rem;
                width: calc(100% - 6rem);
                height: 2px;
                background: linear-gradient(90deg, rgba(255, 117, 56, 0.2), rgba(255, 117, 56, 0.05));
                display: none;
            }
            @media (min-width: 768px) {
                .process-step::after { display: block; }
                .process-step:last-child::after { display: none; }
            }

            /* AVATAR W OPINII */
            .testimonial-avatar {
                width: 2.5rem; height: 2.5rem;
                border-radius: 50%;
                display: flex; align-items: center; justify-content: center;
                font-weight: 800; font-size: 0.7rem;
                flex-shrink: 0;
                object-fit: cover;
                overflow: hidden;
            }
            .testimonial-avatar img {
                width: 100%; height: 100%;
                object-fit: cover;
                border-radius: 50%;
            }

            /* HERO MOBILE STATS */
            .hero-mobile-stats {
                display: flex; gap: 1.5rem; margin-top: 2rem;
            }
            @media (min-width: 1024px) {
                .hero-mobile-stats { display: none; }
            }
            .hero-stat-card {
                flex: 1;
                background: oklch(var(--b1) / 0.7);
                backdrop-filter: blur(12px);
                border: 1px solid oklch(var(--bc) / 0.07);
                border-radius: 1rem;
                padding: 1.25rem;
                text-align: center;
            }
            .hero-stat-card .stat-number {
                font-family: "Bebas Neue", sans-serif;
                font-size: 2rem; color: #ff7538;
            }
            .hero-stat-card .stat-label {
                font-size: 0.6rem; font-weight: 800;
                text-transform: uppercase; letter-spacing: 0.1em;
                opacity: 0.5; margin-top: 0.25rem;
            }

            /* SCROLL TO TOP BUTTON */
            #scroll-top {
                position: fixed;
                bottom: 1.5rem; right: 1.5rem;
                z-index: 90;
                width: 3rem; height: 3rem;
                border-radius: 50%;
                background: #ff7538;
                color: #fff;
                display: flex; align-items: center; justify-content: center;
                box-shadow: 0 8px 24px rgba(255, 117, 56, 0.4);
                cursor: pointer;
                border: none;
                opacity: 0; transform: translateY(20px);
                transition: opacity 0.3s ease, transform 0.3s ease;
                pointer-events: none;
            }
            #scroll-top.visible {
                opacity: 1; transform: translateY(0);
                pointer-events: auto;
            }
            #scroll-top:hover {
                transform: translateY(-3px) scale(1.05);
                box-shadow: 0 12px 32px rgba(255, 117, 56, 0.5);
            }
            #scroll-top svg { width: 1.25rem; height: 1.25rem; }

            footer li a:hover div {
                opacity: 1;
                transform: translateX(0);
            }

            /* PRELOADER */
            #preloader {
                position: fixed; inset: 0; z-index: 99999;
                background: oklch(var(--b1));
                display: flex; align-items: center; justify-content: center;
                transition: opacity 0.5s ease;
            }
            [data-theme="dark"] #preloader { background: #0d1017; }
            .preloader-inner {
                display: flex; flex-direction: column; align-items: center;
            }
            .preloader-bar {
                width: 120px; height: 3px;
                background: oklch(var(--bc) / 0.1);
                border-radius: 999px; overflow: hidden;
            }
            .preloader-fill {
                width: 40%; height: 100%;
                background: #ff7538; border-radius: 999px;
                animation: preloaderSlide 1.2s ease-in-out infinite;
            }
            @keyframes preloaderSlide {
                0% { transform: translateX(-100%); }
                100% { transform: translateX(350%); }
            }

            /* GALLERY HOVER OVERLAY */
            .gallery-card { position: relative; }
            .gallery-overlay {
                position: absolute; inset: 0;
                background: linear-gradient(to top, rgba(0,0,0,0.85) 0%, rgba(0,0,0,0.3) 50%, transparent 100%);
                display: flex; flex-direction: column; justify-content: flex-end;
                padding: 1.5rem;
                opacity: 0; transition: opacity 0.4s ease;
                pointer-events: none;
            }
            .gallery-card:hover .gallery-overlay { opacity: 1; }
            .gallery-overlay .gallery-tag {
                display: inline-block; width: fit-content;
                background: #ff7538; color: #fff;
                font-size: 0.6rem; font-weight: 800;
                letter-spacing: 0.1em; text-transform: uppercase;
                padding: 0.2rem 0.6rem; border-radius: 999px;
                margin-bottom: 0.5rem;
            }
            .gallery-overlay h4 { color: #fff; }
            .gallery-overlay p { color: rgba(255,255,255,0.6); }

            /* TEAM CARDS */
            .team-card { text-align: center; }
            .team-avatar {
                width: 5rem; height: 5rem;
                border-radius: 50%; overflow: hidden;
                border: 3px solid rgba(255, 117, 56, 0.3);
                box-shadow: 0 8px 24px rgba(255, 117, 56, 0.15);
            }
            .team-avatar img {
                width: 100%; height: 100%; object-fit: cover;
            }
            .team-role {
                font-size: 0.7rem; font-weight: 700;
                color: #ff7538; text-transform: uppercase;
                letter-spacing: 0.1em;
            }

            /* COOKIE BANNER */
            #cookie-banner {
                position: fixed; bottom: 0; inset-x: 0;
                z-index: 95;
                background: oklch(var(--b1) / 0.95);
                backdrop-filter: blur(16px);
                -webkit-backdrop-filter: blur(16px);
                border-top: 1px solid oklch(var(--bc) / 0.1);
                box-shadow: 0 -4px 24px rgba(0,0,0,0.1);
                transition: opacity 0.4s ease, transform 0.4s ease;
            }
            .cookie-inner {
                max-width: 1280px; margin: 0 auto; padding: 0 2rem;
                display: flex; align-items: center; gap: 1.5rem;
                padding-top: 1.25rem; padding-bottom: 1.25rem;
            }
            @media (max-width: 640px) {
                .cookie-inner { flex-direction: column; text-align: center; gap: 1rem; }
            }

            /* NAVBAR ACTIVE STATE */
            .nav-active {
                color: #ff7538 !important;
                opacity: 1 !important;
            }