
:root{--green:#1f341f;--green2:#314d2d;--gold:#b89157;--cream:#fbf7ef;--text:#263022}
*{box-sizing:border-box}body{margin:0;font-family:Arial,Helvetica,sans-serif;background:var(--cream);color:var(--text);line-height:1.6}
h1,h2,h3{font-family:Georgia,'Times New Roman',serif;color:var(--green);line-height:1.15}h1{font-size:clamp(2.2rem,5vw,4.8rem)}h2{font-size:clamp(1.8rem,3vw,3rem)}
a{color:inherit}.topbar{background:var(--green);color:#fff;font-size:.9rem;display:flex;justify-content:space-between;gap:1rem;padding:.55rem 7vw}
header{display:flex;align-items:center;justify-content:space-between;background:#fff;padding:1rem 7vw;position:sticky;top:0;z-index:10;box-shadow:0 1px 10px #0001}
.logo img{width:170px;height:76px;object-fit:contain;object-position:left center}nav{display:flex;gap:1.2rem;flex-wrap:wrap;font-size:.9rem;text-transform:uppercase;letter-spacing:.05em}nav a{text-decoration:none}nav a:hover{color:var(--gold)}
.hero{min-height:72vh;background:linear-gradient(90deg,#0009,#0002),url('afbeeldingen/hero-giraffes.jpg') center/cover;display:flex;align-items:center;padding:7vw;color:#fff}
.hero h1,.hero p{color:#fff}.hero-content{max-width:760px}.eyebrow{text-transform:uppercase;letter-spacing:.22em;font-weight:bold;color:var(--gold);font-size:.85rem}
.btn{display:inline-block;padding:.95rem 1.4rem;border:1px solid var(--gold);text-decoration:none;text-transform:uppercase;letter-spacing:.06em;font-weight:bold;font-size:.85rem;border-radius:2px}.primary{background:var(--gold);color:#fff}.secondary{color:#fff;border-color:#fff}.hero-buttons{display:flex;gap:1rem;flex-wrap:wrap;margin-top:1.6rem}
section{padding:5rem 7vw}.split{display:grid;grid-template-columns:1.1fr .9fr;gap:3rem;align-items:center}.split img{width:100%;border-radius:6px;box-shadow:0 20px 50px #0002}
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:1.2rem}.cards article{background:#fff;padding:2rem;border-radius:8px;text-align:center;box-shadow:0 10px 25px #00000012}.cards span{font-size:2rem;color:var(--green)}
.dark-block{background:linear-gradient(90deg,#102010e8,#10201088),url('afbeeldingen/giraffes-weide.jpg') center/cover;color:#fff}.dark-block h2,.dark-block p{color:#fff}.dark-block div{max-width:620px}
.page-header{background:linear-gradient(90deg,#f8f1e5,#fff);text-align:center;padding-top:5rem;padding-bottom:4rem}.page-header p{font-size:1.2rem}
.content{max-width:1100px;margin:auto}.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}.gallery img,.wide-image{width:100%;border-radius:8px;box-shadow:0 12px 35px #0002}.gallery img{height:260px;object-fit:cover}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:3rem;max-width:1100px;margin:auto}form{background:#fff;padding:2rem;border-radius:8px;box-shadow:0 10px 25px #0001}input,textarea{width:100%;padding:1rem;margin-bottom:1rem;border:1px solid #ddd;border-radius:4px}textarea{height:160px}
footer{background:var(--green);color:#fff;display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:2rem;padding:3rem 7vw}footer img{width:170px;background:#fff;border-radius:4px;padding:.4rem}footer h3{color:#fff}
@media(max-width:900px){.topbar,header{display:block;text-align:center}.logo img{margin:auto}nav{justify-content:center}.split,.contact-grid,footer{grid-template-columns:1fr}.cards,.gallery{grid-template-columns:1fr 1fr}.hero{min-height:60vh}}
@media(max-width:560px){.cards,.gallery{grid-template-columns:1fr}.topbar{font-size:.78rem}section{padding:3rem 1.2rem}header{padding:1rem}.hero{padding:3rem 1.2rem}}
