/* ========== ALGEMEEN ========== */
* { margin:0; padding:0; box-sizing:border-box; font-family:'Poppins',sans-serif; }
body {
  line-height:1.6;
  scroll-behavior:smooth;
  background: linear-gradient(to bottom, #000 0%, #000 45%, #d4af37 45%, #d4af37 100%);
  position: relative;
  overflow-x:hidden;
}

/* Shimmer overlay achtergrond */
body::before {
  content:"";
  position:absolute; top:0; left:0; width:100%; height:100%;
  background: linear-gradient(120deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.15) 50%, rgba(255,255,255,0) 100%);
  transform: translateX(-100%);
  animation: shimmer 5s infinite linear;
  pointer-events:none;
  z-index:0;
}
@keyframes shimmer { 0%{transform:translateX(-100%);} 100%{transform:translateX(100%);} }

/* ========== NAVBAR ========== */
.navbar {
  position: sticky; top:0; width:100%;
  background: rgba(0,0,0,0.85); box-shadow:0 2px 10px rgba(0,0,0,0.5);
  z-index:9999; transition: background 0.3s ease;
}
.navbar .container { display:flex; justify-content:space-between; align-items:center; max-width:1000px; margin:0 auto; padding:15px 20px; }
.navbar .logo { color:#d4af37; font-size:1.6rem; font-weight:700; }
.navbar .nav-links { display:flex; gap:25px; transition:all 0.3s ease; }
.navbar .nav-links a {
  color:#fff; text-decoration:none; font-weight:500; position:relative; padding:5px 0; transition:color 0.3s;
}
.navbar .nav-links a::after {
  content:""; position:absolute; bottom:0; left:0; width:0%; height:2px; background:#ffd700; transition:width 0.3s ease;
}
.navbar .nav-links a:hover::after,
.navbar .nav-links a.active::after { width:100%; }
.navbar .nav-links a:hover { color:#ffd700; }
.hamburger { display:none; font-size:2rem; color:#fff; cursor:pointer; transition: transform 0.3s ease; }
.hamburger:hover { transform: scale(1.1); }
.nav-links.active {
  display:flex; flex-direction:column; gap:15px; background:rgba(0,0,0,0.95);
  position:absolute; top:60px; right:20px; padding:20px; border-radius:12px;
  box-shadow:0 10px 25px rgba(0,0,0,0.6); opacity:0; animation:fadeIn 0.3s forwards;
}
@keyframes fadeIn { to { opacity:1; } }
@media (max-width:768px){ .nav-links { display:none; } .hamburger { display:block; } }

/* ========== HERO ========== */
.hero {
  position:relative; height:90vh; display:flex; align-items:center; justify-content:center; text-align:center;
  color:#d4af37; z-index:1; background-attachment:fixed; background-position:center; background-size:cover;
}
.hero .overlay { background:rgba(0,0,0,0.6); padding:50px 30px; border-radius:12px; max-width:500px; box-shadow:0 10px 30px rgba(0,0,0,0.4); z-index:1; }
.hero h1, .hero .subtitle { font-weight:700; }
.shimmer-text {
  background: linear-gradient(90deg, #d4af37 0%, #fff 50%, #d4af37 100%);
  background-size:200% auto; color:transparent; background-clip:text; -webkit-background-clip:text;
  animation:textShimmer 3s linear infinite;
}
@keyframes textShimmer { 0%{background-position:-200% center;} 100%{background-position:200% center;} }
.hero h1{font-size:3rem; margin-bottom:10px;}
.hero .subtitle{font-size:1.3rem; margin-bottom:5px;}
.hero .rating{font-size:1rem; margin-bottom:20px;}
.hero .cta{display:flex; flex-wrap:wrap; justify-content:center; gap:10px;}
.hero .btn{padding:12px 25px; border-radius:6px; font-weight:500; text-decoration:none; color:#000; background:linear-gradient(45deg,#d4af37,#ffd700); transition:0.3s; box-shadow:0 4px 12px rgba(0,0,0,0.4);}
.hero .btn:hover{background:linear-gradient(45deg,#ffd700,#d4af37); box-shadow:0 6px 20px rgba(0,0,0,0.6);}

/* ========== KAARTEN ========== */
.section{padding:60px 20px; max-width:1000px; margin:0 auto; text-align:center;}
.cards-container{display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:20px; margin-top:30px;}
.card{background:#000; color:#d4af37; padding:20px 25px; border-radius:12px; display:flex; justify-content:space-between; align-items:center; font-weight:500; transition:all 0.4s ease, transform 0.3s ease, box-shadow 0.3s ease; box-shadow:0 6px 15px rgba(0,0,0,0.3); position:relative; overflow:hidden;}
.card.highlight{border:2px solid #fff;}
.card:hover{transform:translateY(-5px); box-shadow:0 15px 30px rgba(0,0,0,0.6);}
.card::after{content:""; position:absolute; top:-50%; left:-50%; width:200%; height:200%; background:rgba(255,255,255,0.05); transform:rotate(25deg); opacity:0; transition:opacity 0.3s, transform 0.6s;}
.card:hover::after{opacity:1; transform:rotate(25deg) translateX(10px) translateY(10px);}
.service-name{font-weight:500;}
.service-price{font-weight:700;color:#fff;}

/* ========== MAP & FOOTER ========== */
.map-section iframe{width:100%; height:300px; border-radius:12px; margin:20px 0; box-shadow:0 6px 25px rgba(0,0,0,0.4);}
footer{padding:20px;text-align:center;color:#d4af37;font-size:0.9rem;}

/* ========== SCROLL ANIMATIES ========== */
.animate{opacity:0; transform:translateY(20px); transition:all 0.6s ease;}
.animate.visible{opacity:1; transform:translateY(0);}

/* ========== RESPONSIVE ========== */
@media (max-width:768px){.cards-container{grid-template-columns:1fr;gap:15px;}}
@media (max-width:480px){.hero h1{font-size:1.8rem;}.hero .cta{flex-direction:column; gap:12px;}}