/* Strona główna - pełna szerokość */

.site-home {
    width:100%;
}

.site-home section {
    width:100%;
}

.home-page {
    width:100%;
}

.home-page section {
    width:100%;
}

.hero {

position:relative;

min-height: calc(100vh - 120px);

display:flex;

align-items:center;

background-image:url('https://www.srv114797.seohost.com.pl/wp-content/themes/generatepress-child/assets/images/hero/don1.png');

background-size:cover;

background-position:center;

}



.hero-overlay{

position:absolute;

inset:0;

background:rgba(0,0,0,.45);

}



.hero-container{

position:relative;

z-index:2;

width:100%;

padding:80px;

}



.hero-content{

max-width:700px;

color:white;

}

.hero-content {

    animation: heroFade 1s ease;

}


@keyframes heroFade {

from {

    opacity:0;

    transform:translateY(30px);

}


to {

    opacity:1;

    transform:translateY(0);

}

}

.hero h1{

font-size:64px;

line-height:1.1;

margin-bottom:25px;

font-weight:700;

}



.hero p{

font-size:22px;

line-height:1.5;

margin-bottom:40px;

}



.hero-buttons{

display:flex;

gap:20px;

}



@media(max-width:768px){

.hero-container{

padding:40px 25px;

}	

.hero{

min-height:600px;

}


.hero h1{

font-size:38px;

}


.hero p{

font-size:18px;

}


.hero-buttons{

flex-direction:column;

}

}


/* .button {

display:inline-block;

padding:16px 40px;

background:#222;

color:#fff;

text-decoration:none;

border-radius:4px;

} */

.categories-section{

padding:var(--section-space) 0;

}


.section-heading{

text-align:center;

margin-bottom:60px;

}


.section-heading h2{

font-size:42px;

margin-bottom:15px;

}



.categories-grid{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:30px;

}



.category-card{

position:relative;

height:340px;

overflow:hidden;

border-radius:15px;

text-decoration:none;

}



.category-card img{

width:100%;

height:100%;

object-fit:cover;

transition:.5s;

}



.category-overlay{

position:absolute;

inset:0;

display:flex;

flex-direction:column;

justify-content:flex-end;

padding:35px;

background:linear-gradient(
transparent,
rgba(0,0,0,.7)
);

color:#fff;

}



.category-overlay h3{

font-size:28px;

margin:0 0 10px;

}



.category-overlay span{
font-size:14px;
transition: all .3s;

}

.category-overlay span:hover {
margin-left: 4px;
transition: all .3s;
}



.category-card:hover img{

transform:scale(1.08);

}



@media(max-width:1000px){

.categories-grid{

grid-template-columns:repeat(2,1fr);

}

}



@media(max-width:600px){

.categories-grid{

grid-template-columns:1fr;

}


.categories-section{

padding:60px 25px;

}

}

.features-section{

padding:var(--section-space) 0;

}


.features-grid{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:30px;

}


.feature{

text-align:center;

padding:35px 25px;

background:#fff;

border-radius:var(--radius);

box-shadow:var(--shadow);

}



.feature-icon{

font-size:45px;

margin-bottom:20px;

}



.feature h3{

font-size:22px;

color:var(--color-dark);

margin-bottom:15px;

}



.feature p{

color:var(--color-text);

}



@media(max-width:1000px){

.features-grid{

grid-template-columns:repeat(2,1fr);

}

}



@media(max-width:600px){

.features-grid{

grid-template-columns:1fr;

}

}


/* GeneratePress full width homepage */

body.home .site-content {
    padding: 0;
    width: 100%;
    max-width: 100%;
}


body.home .content-area {
    width: 100%;
}


body.home .site-main {
    margin: 0;
}


body.home .grid-container {
    max-width: 100%;
}

/* ==========================
   INSPIRATIONS
========================== */


.inspirations-section{

    padding:var(--section-space) 0;

}


.inspirations-grid{

    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:30px;

}


.inspiration-card{

    position:relative;

    height:420px;

    overflow:hidden;

    border-radius:var(--radius);

}


.inspiration-card img{

    width:100%;

    height:100%;

    object-fit:cover;

    transition:.5s;

}


.inspiration-card:hover img{

    transform:scale(1.08);

}



.inspiration-overlay{

    position:absolute;

    inset:0;

    display:flex;

    align-items:flex-end;

    padding:35px;

    background:linear-gradient(
        transparent,
        rgba(0,0,0,.7)
    );

}



.inspiration-overlay h3{

    color:#fff;

    font-size:28px;

    margin:0;

}



@media(max-width:1000px){

    .inspirations-grid{

        grid-template-columns:repeat(2,1fr);

    }

}



@media(max-width:600px){

    .inspirations-grid{

        grid-template-columns:1fr;

    }

}