/* ==========================
BETA IMPERMEABILIZZAZIONI
STYLE.CSS
========================== */

*{
margin:0;
padding:0;
box-sizing:border-box;
}

body{
font-family:Arial, Helvetica, sans-serif;
background:#ffffff;
color:#333;
line-height:1.6;
}

header{
background:#ff7a00;
color:#fff;
display:flex;
justify-content:space-between;
align-items:center;
padding:20px 8%;
position:sticky;
top:0;
z-index:999;
}

.logo h1{
font-size:40px;
font-weight:bold;
}

.logo h2{
font-size:22px;
}

.logo p{
font-size:14px;
}

nav ul{
display:flex;
list-style:none;
}

nav ul li{
margin-left:25px;
}

nav ul li a{
color:white;
text-decoration:none;
font-weight:bold;
transition:.3s;
}

nav ul li a:hover{
color:#222;
}

.hero{
display:flex;
align-items:center;
justify-content:space-between;
padding:70px 8%;
background:#f5f5f5;
}

.hero-text{
width:50%;
}

.hero-text h2{
font-size:46px;
color:#ff7a00;
margin-bottom:20px;
}

.hero-text p{
font-size:20px;
margin-bottom:30px;
}

.hero-image{
width:45%;
}

.hero-image img{
width:100%;
border-radius:15px;
box-shadow:0 10px 25px rgba(0,0,0,.2);
}

.bottoni{
display:flex;
gap:15px;
flex-wrap:wrap;
}

.btn{
padding:15px 28px;
text-decoration:none;
color:#fff;
border-radius:8px;
font-weight:bold;
transition:.3s;
}

.telefono{
background:#ff7a00;
}

.whatsapp{
background:#25D366;
}

.email{
background:#0066cc;
}

.btn:hover{
transform:translateY(-3px);
}
/* ==========================
SERVIZI
========================== */

.servizi{
padding:80px 8%;
background:#fff;
}

.servizi h2{
text-align:center;
color:#ff7a00;
font-size:38px;
margin-bottom:40px;
}

.servizi-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
gap:30px;
}

.box{
background:#f8f8f8;
padding:30px;
border-radius:15px;
text-align:center;
transition:.3s;
box-shadow:0 5px 15px rgba(0,0,0,.1);
}

.box:hover{
transform:translateY(-8px);
}

.box i{
font-size:45px;
color:#ff7a00;
margin-bottom:15px;
}

.box h3{
margin-bottom:15px;
}

/* ==========================
DOVE LAVORIAMO
========================== */

.zone{
background:#ff7a00;
color:#fff;
text-align:center;
padding:70px 8%;
}

.zone h2{
font-size:36px;
margin-bottom:20px;
}

.zone ul{
list-style:none;
margin-top:25px;
}

.zone li{
padding:8px;
font-size:20px;
}

/* ==========================
GALLERIA
========================== */

.galleria{
padding:80px 8%;
}

.galleria h2{
text-align:center;
color:#ff7a00;
font-size:38px;
margin-bottom:35px;
}

.gallery{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
gap:20px;
}

.gallery img{
width:100%;
border-radius:12px;
box-shadow:0 5px 15px rgba(0,0,0,.15);
transition:.3s;
}

.gallery img:hover{
transform:scale(1.03);
}

/* ==========================
CONTATTI
========================== */

.contatti{
background:#f5f5
nav ul li a.active{
color:#222;
border-bottom:3px solid white;
padding-bottom:5px;
}

.gallery img.zoom{
transform:scale(1.15);
transition:0.3s;
cursor:zoom-out;
}