
*{margin:0;padding:0;box-sizing:border-box;font-family:'Montserrat',sans-serif;}
body{background:#f5f1ec;color:#222;overflow-x:hidden;}

.hero{
    position:relative;
    height:100vh;
    overflow:hidden;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
    color:white;
    background-color:#C44A2D;
}

.hero::before{
    content:"";
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background-image:url('images/page_1.jpg');
    background-repeat:no-repeat;
    background-position:center;
    background-size:contain;
    background-attachment:fixed;
    z-index:-1;
}

.overlay{
    background:rgba(0,0,0,0.6);
    padding:40px;
    border-radius:20px;
}

.hero h1{font-size:3rem;font-weight:800;}
.hero p{margin-top:15px;font-size:1.2rem;}

.section{
    padding:100px 10%;
}

.dark{
    background:#1b1b1b;
    color:white;
    text-align:center;
}

.image-section{
    display:flex;
    align-items:center;
    gap:50px;
    flex-wrap:wrap;
}

.image-section img{
    width:100%;
    max-width:500px;
    border-radius:20px;
    box-shadow:0 20px 40px rgba(0,0,0,0.2);
    transition:transform 0.5s ease;
}

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

.reverse{
    flex-direction:row-reverse;
}

.grid-section{text-align:center;}

.grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
    gap:40px;
    margin-top:50px;
}

.card{
    background:white;
    padding:40px;
    border-radius:20px;
    box-shadow:0 20px 40px rgba(0,0,0,0.08);
    transition:0.4s;
}

.card:hover{
    transform:translateY(-10px);
}

.parallax.small-parallax{
    height:60vh;
    background:url('images/page_17.jpg') center/cover fixed;
}

.footer{
    background:#111;
    color:white;
    text-align:center;
    padding:80px 10%;
}

@media(max-width:768px){
    .image-section{flex-direction:column;}
    .reverse{flex-direction:column;}
    .hero h1{font-size:2rem;}
}
