:root{
  --ink:#0C1F1B;
  --green:#0B7A46;
  --paper:#F5F9FA;
  --white:#FFFFFF;
  --ink-08: rgba(12,31,27,0.08);
  --ink-12: rgba(12,31,27,0.14);
  --ink-45: rgba(12,31,27,0.5);
  --ink-68: rgba(12,31,27,0.7);
  --green-10: rgba(11,122,70,0.08);
  --green-16: rgba(11,122,70,0.14);
  --on-ink-70: rgba(245,249,250,0.72);
  --on-ink-45: rgba(245,249,250,0.48);
  --max:1000px;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--ink);
  color:var(--paper);
  font-family:'IBM Plex Sans', sans-serif;
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img,svg{display:block;max-width:100%;}
h1,h2,h3{
  font-family:'Fraunces', serif;
  font-weight:500;
  line-height:1.05;
  margin:0;
  letter-spacing:-0.01em;
}
.wrap{max-width:var(--max); margin:0 auto; padding:0 28px;}
a{color:inherit;}

.eyebrow{
  font-family:'IBM Plex Mono', monospace;
  font-size:12.5px;
  letter-spacing:0.16em;
  text-transform:uppercase;
  color:#7FCBA3;
  display:flex;
  align-items:center;
  gap:10px;
  justify-content:center;
}
.eyebrow::before, .eyebrow::after{
  content:"";
  width:22px;height:1px;
  background:#7FCBA3;
  display:inline-block;
}

/* ---------- BACKDROP CONTOUR ---------- */
.contour-bg{
  position:fixed; inset:0; z-index:0; opacity:0.16; pointer-events:none;
}

/* ---------- HEADER ---------- */
header{
  position:relative; z-index:2;
  padding:40px 0 0;
  text-align:center;
}
header img{height:46px; width:auto; margin:0 auto; filter: brightness(0) invert(1);}

/* ---------- HERO ---------- */
.hero{
  position:relative; z-index:2;
  padding:56px 0 20px;
  text-align:center;
}
.hero h1{
  font-size:clamp(36px, 6vw, 62px);
  max-width:780px;
  margin:26px auto 0;
}
.hero h1 em{
  font-style:italic;
  color:#7FCBA3;
}
.hero p.lead{
  max-width:520px;
  margin:22px auto 0;
  color:var(--on-ink-70);
  font-size:17px;
}

/* ---------- MOUNTAIN SIGNATURE ---------- */
.mountain-wrap{
  position:relative; z-index:2;
  max-width:920px; margin:56px auto 0; padding:0 28px;
}
.peak-label{
  font-family:'IBM Plex Mono', monospace;
  font-size:11px;
  letter-spacing:0.1em;
  fill:var(--on-ink-45);
}
.station-num{
  font-family:'IBM Plex Mono', monospace;
  font-size:13px;
  fill:var(--ink);
  font-weight:500;
}
.station-name{
  font-family:'IBM Plex Sans', sans-serif;
  font-size:13.5px;
  fill:var(--paper);
  font-weight:500;
}

/* ---------- NOTIFY FORM ---------- */
.notify{
  position:relative; z-index:2;
  max-width:460px; margin:52px auto 0; padding:0 28px;
  text-align:center;
}
.notify-row{
  display:flex; gap:10px; margin-top:20px;
}
.notify input[type=email]{
  flex:1;
  background:rgba(245,249,250,0.06);
  border:1px solid rgba(245,249,250,0.22);
  border-radius:2px;
  color:var(--paper);
  padding:14px 16px;
  font-family:'IBM Plex Sans', sans-serif;
  font-size:14.5px;
}
.notify input[type=email]::placeholder{color:var(--on-ink-45);}
.notify input[type=email]:focus{outline:2px solid var(--green); outline-offset:2px;}
.notify button{
  font-family:'IBM Plex Mono', monospace; font-size:13px; letter-spacing:0.02em;
  background:var(--green); color:var(--white); border:none;
  padding:0 22px; border-radius:2px; cursor:pointer; white-space:nowrap;
}
.notify button:hover{background:#0d9457;}
.notify button:disabled{opacity:0.6; cursor:not-allowed;}
.notify .fine{
  margin-top:14px; font-size:12.5px; color:var(--on-ink-45);
}
.notify .gdpr-note{
  margin-top:8px; font-size:13px; color:var(--on-ink-45); line-height:1.5;
}
.notify .form-status{
  margin-top:16px; font-size:14px; display:none;
  font-family:'IBM Plex Mono', monospace;
}
.notify .form-status.success{ display:block; color:#7FCBA3; }
.notify .form-status.error{ display:block; color:#FF8A80; }

/* ---------- DIENSTEN ---------- */
.diensten{
  position:relative; z-index:2;
  max-width:var(--max); margin:96px auto 0; padding:0 28px 0;
}
.diensten-head{ text-align:center; margin-bottom:48px; }
.diensten-head h2{
  font-size:clamp(26px, 3.4vw, 34px);
  margin-top:18px; color:var(--paper);
}
.diensten-grid{
  display:grid; grid-template-columns:repeat(4,1fr); gap:1px;
  background:rgba(245,249,250,0.12);
  border:1px solid rgba(245,249,250,0.12);
}
@media (max-width:900px){ .diensten-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:560px){ .diensten-grid{grid-template-columns:1fr;} }
.d-card{
  background:#0F241F;
  padding:30px 24px 32px;
}
.d-num{
  font-family:'IBM Plex Mono', monospace;
  font-size:12.5px; color:#7FCBA3; letter-spacing:0.06em;
}
.d-card h3{
  font-size:19px; margin-top:14px; color:var(--paper); font-weight:500;
}
.d-card p{
  margin-top:10px; font-size:13.8px; color:var(--on-ink-70); line-height:1.55;
}
.d-tag{
  display:inline-block; margin-top:14px;
  font-family:'IBM Plex Mono', monospace; font-size:11px;
  color:#7FCBA3; letter-spacing:0.05em;
  border:1px solid rgba(127,203,163,0.35);
  padding:3px 8px; border-radius:2px;
}

/* ---------- FOOTER ---------- */
footer{
  position:relative; z-index:2;
  margin-top:100px;
  padding:40px 0 46px;
  border-top:1px solid rgba(245,249,250,0.12);
  text-align:center;
  font-size:13px;
  color:var(--on-ink-45);
}
footer .contact{
  margin-top:14px; line-height:1.9;
}
footer .contact span{ margin:0 10px; }
footer .contact a{ color:inherit; text-decoration:underline; text-underline-offset:2px; }
footer .contact a:hover{ color:#7FCBA3; }

section{scroll-margin-top:20px;}