/* === DIENSTEN === */
.diensten-block { margin-bottom: 4rem; }

.diensten-block h3 {
  font-family: var(--mono);
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: .08em;
  margin-bottom: 1.5rem;
  padding-bottom: .75rem;
  border-bottom: 1px solid var(--border);
}

.diensten-block h3 span {
  margin-left: .75rem;
  font-size: 10px;
  padding: 2px 8px;
  border: 1px solid;
  vertical-align: middle;
  position: relative;
  top: -1px;
}

.diensten-block h3 .lbl-warm { color: var(--accent-warm); border-color: rgba(245,158,11,.3); }
.diensten-block h3 .lbl-teal { color: var(--accent);      border-color: rgba(0,200,160,.3); }
.diensten-block h3 .lbl-blue { color: var(--accent-blue);  border-color: rgba(59,130,246,.3); }

.dienst-row {
  display: grid;
  grid-template-columns: 200px 1fr auto;
  gap: 2rem;
  align-items: start;
  padding: 1.25rem 0;
  border-bottom: 1px solid var(--border);
}

.dienst-row:last-child { border-bottom: none; }

.dienst-name {
  font-family: var(--mono);
  font-size: 12px;
  color: var(--text);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
}

.dienst-desc {
  font-size: 13px;
  color: var(--text-muted);
  line-height: 1.7;
}

.dienst-badge {
  font-family: var(--mono);
  font-size: 9px;
  color: var(--text-dim);
  border: 1px solid var(--border);
  padding: 3px 10px;
  white-space: nowrap;
  text-transform: uppercase;
  letter-spacing: .08em;
}

@media (max-width: 768px) {
  .dienst-row { grid-template-columns: 1fr; }
  .dienst-badge { display: none; }
}