/* =========================================================
   HOME LAYOUT — przeniesione z index.html
   Cel: czystszy HTML bez dużego bloku inline CSS
   ========================================================= */
header {
            position: relative;
            width: 100%;
            min-height: 100vh;
            height: 100vh;
            overflow: hidden;
            text-align: center;
            color: #fff;
            display: flex;
            align-items: center;
            justify-content: center;
            background:
                linear-gradient(rgba(0,0,0,0.72), rgba(0,0,0,0.72)),
                url('../img/header.png') center center / cover no-repeat;
        }

        header::before {
            content: "";
            position: absolute;
            inset: 0;
            backdrop-filter: blur(2px);
            pointer-events: none;
            z-index: 1;
        }

        header::after {
            content: "";
            position: absolute;
            inset: 0;
            background: radial-gradient(circle, transparent 35%, rgba(0,0,0,0.78));
            pointer-events: none;
            z-index: 1;
        }

        header .header-content {
            position: relative;
            z-index: 2;
            width: 100%;
            padding: 0 15px;
            text-align: center;
        }

        header .header-content .header-content-inner {
            margin: 0 auto;
            max-width: 950px;
        }

        header .header-content .header-content-inner h1 {
            margin-top: 0;
            margin-bottom: 30px;
            text-transform: uppercase;
            font-weight: 800;
            font-size: 60px;
            line-height: 1.1;
        }

        header .header-content .header-content-inner p {
            margin: 0 auto 28px auto;
            max-width: 820px;
            font-size: 20px;
            line-height: 1.6;
            color: rgba(255,255,255,.88);
        }

        header .btn {
            position: relative;
            z-index: 3;
        }

        #about,
        #portfolio,
        #contact {
            min-height: 100vh;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        #about .container,
        #portfolio .container,
        #contact .container,
        #about .row,
        #portfolio .row,
        #contact .row {
            width: 100%;
        }

        section {
            padding: 80px 20px;
        }

        .about-layout {
            display: flex;
            align-items: center;
            gap: 100px;
        }

        .about-text-wrap {
            flex: 1 1 100%;
        }

        .about-photo-wrap {
            flex: 0 0 360px;
            text-align: center;
        }

        .about-photo {
            width: 100%;
            max-width: 360px;
            border-radius: 8px;
            box-shadow: 0 20px 45px rgba(0,0,0,0.25);
            border: 1px solid rgba(255,255,255,0.35);
        }

        #about .section-heading,
        #about hr.light {
            text-align: center;
        }

        #about .text-faded {
            max-width: 780px;
            margin: 0 auto;
            text-align: left;
        }

        #about .text-faded p {
            text-align: justify;
			text-justify:inter-character;
            hyphens: auto;
            font-size: 18px;
            line-height: 1.8;
            margin: 0 0 20px 0;
            color: rgba(255,255,255,0.92);
        }

        #portfolio .portfolio-intro {
            margin-bottom: 30px;
        }

        #contact img.logo-main {
            margin: 0 auto 25px auto;
        }

        @media (max-width: 991px) {
            header {
                background-attachment: scroll;
            }

            header .header-content .header-content-inner h1 {
                font-size: 44px;
            }

            header .header-content .header-content-inner p {
                font-size: 18px;
            }

            .about-layout {
                flex-direction: column;
                gap: 35px;
            }

            .about-photo-wrap {
                flex: none;
                max-width: 320px;
                margin: 0 auto;
                order: -1;
            }
        }


        @media (max-width: 767px) {

            /* ABOUT SECTION */
            .about-layout{
                gap:10px;
                padding-left:10px;
                padding-right:10px;
            }

            .about-text-wrap{
                margin-left:0;
                margin-right:0;
                padding-left:0;
                padding-right:0;
            }

            .about-photo-wrap{
                margin-left:0;
                margin-right:0;
                padding-left:0;
                padding-right:0;
                width:100%;
                max-width:none;
            }

            .about-photo{
                width:calc(100% - 20px);
                margin:0 10px;
                display:block;
            }

            /* REMOVE WHITE LINE IN GALLERY */
            .portfolio-gallery,
            .portfolio-gallery-section,
            .gallery-main-row,
            .gallery-image-col,
            .gallery-desc-col{
                border:none;
                outline:none;
                box-shadow:none;
            }

            .gallery-main-row::before,
            .gallery-main-row::after,
            .portfolio-gallery::before,
            .portfolio-gallery::after{
                display:none;
                content:none;
            }
        }


/* FORCE PORTFOLIO CARDS RADIUS 8PX */
.portfolio-box,
.portfolio-item,
.portfolio-card,
.portfolio-box img,
.portfolio-item img,
.portfolio-card img,
#portfolio img,
#portfolio .portfolio-box,
#portfolio .portfolio-item,
#portfolio .portfolio-card,
.clients-portfolio img,
.clients-portfolio .portfolio-box,
.clients-portfolio .portfolio-item,
.clients-portfolio .portfolio-card {
    border-radius: 8px !important;
}


/* FORCE THUMBNAILS RADIUS 2PX */
.thumbnail,
.thumbnails img,
.gallery-thumb,
.gallery-thumbnails img,
.thumb,
.thumb img,
.portfolio-thumbnails img,
.portfolio-thumb img,
.swiper-slide img,
.gallery-nav img {
    border-radius: 2px !important;
}


/* FINAL GALLERY THUMB FIX */
.gallery-thumb,
.gallery-thumb img,
.gallery-thumbnails img,
.thumb,
.thumb img,
.swiper-slide,
.swiper-slide img,
.slick-slide img,
.portfolio-gallery-thumb,
.portfolio-gallery-thumb img {
    border-radius: 2px !important;
    overflow: hidden !important;
}

/* thin gray border same as gallery */
.gallery-thumb,
.thumb,
.swiper-slide,
.slick-slide,
.portfolio-gallery-thumb {
    border: 1px solid rgba(120,120,120,0.55) !important;
    box-shadow: none !important;
}

/* remove orange/red border */
.gallery-thumb.active,
.thumb.active,
.swiper-slide-active,
.slick-current,
.slick-active {
    border: 1px solid rgba(120,120,120,0.55) !important;
    box-shadow: none !important;
}


/* portfolio-btn-spacing-fix */
.hero-buttons,
.cta-buttons,
.about-buttons{
display:flex;
gap:24px;
flex-wrap:wrap;
}

@media(max-width:768px){
.hero-buttons,
.cta-buttons,
.about-buttons{
gap:14px;
}
}