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


html {
scroll-behavior:smooth;
}


body {

font-family:Arial, Helvetica, sans-serif;

color:#30352d;

background:#faf9f5;

line-height:1.7;

}



h2 {

font-size:42px;

margin-bottom:35px;

}



header {

min-height:900px;

background:

linear-gradient(
rgba(0,0,0,.60),
rgba(0,0,0,.60)
),

url("images/header.png")

center 35% / cover no-repeat;


color:white;

}





nav {

width:90%;

max-width:1200px;

margin:auto;

padding:30px 0;

display:flex;

justify-content:space-between;

align-items:center;

}





.logo {

display:flex;

align-items:center;

gap:20px;

}



.logo img {

width:90px;

height:90px;

border-radius:50%;

}



.logo h1 {

font-size:30px;

line-height:1.2;

}



.logo span {

font-size:15px;

opacity:.85;

}





.menu a {

color:white;

text-decoration:none;

margin-left:30px;

}





.hero {

text-align:center;

max-width:900px;

margin:auto;

padding:180px 20px 150px;

}





.hero-logo {

width:150px;

height:150px;

border-radius:50%;

margin-bottom:30px;

}



.label {

text-transform:uppercase;

letter-spacing:4px;

font-size:14px;

}





.hero h2 {

font-size:60px;

margin:25px 0;

}



.hero p:not(.label) {

font-size:21px;

max-width:700px;

margin:auto;

}





.button {

display:inline-block;

margin-top:40px;

padding:16px 40px;

background:#526b42;

color:white;

text-decoration:none;

border-radius:5px;

}





section {

padding:100px 10%;

}





.tekst {

max-width:850px;

margin:auto;

text-align:center;

}





.intro {

text-align:center;

max-width:700px;

margin:0 auto 60px;

}





.werken {

max-width:1100px;

margin:auto;

}





.werken article {

display:grid;

grid-template-columns:1fr 1fr;

gap:50px;

align-items:center;

margin-bottom:90px;

}



.werken article:nth-child(even){

direction:rtl;

}



.werken article:nth-child(even) div {

direction:ltr;

}





.werken img {

width:100%;

height:350px;

object-fit:cover;

border-radius:10px;

}





.werken h3 {

font-size:32px;

color:#405533;

margin-bottom:20px;

}





.werken ul {

margin:20px;

}





.regio {

background:#e8e4d9;

text-align:center;

}





#contact {

text-align:center;

}





form {

max-width:600px;

margin:40px auto;

display:flex;

flex-direction:column;

gap:15px;

}





input,
textarea {

padding:16px;

font-size:16px;

border:1px solid #ccc;

border-radius:5px;

}





textarea {

height:160px;

}





button {

padding:16px;

background:#526b42;

color:white;

border:none;

border-radius:5px;

cursor:pointer;

}





#melding {

color:#526b42;

font-weight:bold;

}





footer {

background:#20251d;

color:white;

text-align:center;

padding:35px;

}





@media(max-width:800px){


nav {

flex-direction:column;

gap:20px;

}


.logo {

flex-direction:column;

text-align:center;

}


.hero-logo {

width:110px;

height:110px;

}


.hero h2 {

font-size:40px;

}


.menu a {

margin:0 10px;

}


.werken article {

display:block;

}


.werken img {

height:260px;

margin-bottom:25px;

}


section {

padding:70px 7%;

}


}