/* HERO */

.services-hero{
padding-top:180px;
padding-bottom:120px;

text-align:center;

background:
linear-gradient(to right, rgba(255,255,255,.92), rgba(255,255,255,.85)),
url('/images/hero.jpg') center/cover;
}

.hero-content{
max-width:900px;
margin:auto;
}

.hero-content h1{
font-size:68px;
margin-bottom:30px;
}

.hero-content p{
font-size:24px;
color:#555;
}


/* INTRO */

.intro-section{
padding:120px 8%;
}


/* SERVICE BLOCKS */

.service-block{
padding:120px 8%;

display:grid;
grid-template-columns:1fr 1.2fr;

gap:70px;

align-items:center;
}

.alt{
grid-template-columns:1.2fr 1fr;
}

.service-text h2{
font-size:52px;
line-height:1.2;
margin-bottom:25px;
}

.service-text p{
font-size:22px;
color:#555;
}


/* IMAGE GRID */

.image-grid{
display:grid;

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

gap:25px;
}

.image-grid img{

width:100%;
height:auto;

object-fit:contain;

border-radius:24px;

background:white;

box-shadow:0 15px 40px rgba(0,0,0,.08);

transition:.5s;
}

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


/* INFO BOX */

.info-box{
max-width:900px;

margin:auto;

background:white;

padding:60px;

border-radius:30px;

box-shadow:0 20px 50px rgba(0,0,0,.08);

font-size:22px;

text-align:center;
}


/* MOBILE */

@media(max-width:992px){

.service-block,
.alt{
grid-template-columns:1fr;
}

}

@media(max-width:768px){

.hero-content h1{
font-size:46px;
}

.service-text h2{
font-size:38px;
}

.image-grid{
grid-template-columns:1fr;
}

}