/*
 * Transparente Oberflächen, Tiefenwirkung und Lichtreflexe.
 */
/* Glas-Tokens und atmosphärischer Hintergrund */
body::before {
  content: '';
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: -1;
  opacity: .3;
  background-image: linear-gradient(rgba(49, 91, 75, .06) 1px, transparent 1px), linear-gradient(90deg, rgba(49, 91, 75, .06) 1px, transparent 1px);
  background-size: 52px 52px;
  mask-image: linear-gradient(to bottom, #000, transparent 78%);
}

/* Navigation und Logo */
.brand > span, .footer .brand > span, .business-page .brand > span {
  width: 42px;
  height: 42px;
  overflow: hidden;
  border-radius: 10px;
  background: #f5f2e9;
  box-shadow: inset 0 1px rgba(255, 255, 255, .22), 0 8px 18px rgba(34, 68, 54, .18);
}

.brand > span img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.button, .nav-cta {
  border-radius: 8px;
  transition: transform .25s, box-shadow .25s, background-color .25s;
}

.button:hover, .button:focus-visible, .nav-cta:hover, .nav-cta:focus-visible {
  transform: translateY(-2px);
  box-shadow: 0 14px 32px rgba(38, 66, 54, .18);
}

.button:focus-visible, .nav-cta:focus-visible {
  outline: 3px solid var(--ink);
  outline-offset: 3px;
}

/* Karten und interaktive Oberflächen */
.tile, .form-layout form {
  position: relative;
  overflow: hidden;
  border: 1px solid var(--glass-line);
  border-radius: var(--radius);
  background: linear-gradient(145deg, rgba(255, 255, 255, .76), rgba(255, 255, 255, .38));
  box-shadow: var(--glass-shadow);
  -webkit-backdrop-filter: blur(22px) saturate(135%);
  backdrop-filter: blur(22px) saturate(135%);
}

.tile::before {
  content: '';
  position: absolute;
  inset: 0 auto auto 0;
  width: 100%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .95), transparent);
}

/* Private-service and price cards share a stable surface over both sections. */
.services > .tile,
.price-grid > .tile {
  background: #f9fbf8;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

.tile:is(a, button):hover, .tile:focus-visible {
  transform: translateY(-4px);
  border-color: rgba(255, 255, 255, .96);
  box-shadow: var(--glass-shadow-hover);
}

.tile {
  transition: transform .25s, border-color .25s, box-shadow .25s;
}

.tile:focus-visible {
  outline: 3px solid var(--ink);
  outline-offset: 3px;
}

/* Transparente Abschnittshintergründe */
.home-proof, .bio-section, .page-content, .business-offers, .engagement-section, .form-section, .legal-content {
  border-top: 1px solid rgba(255, 255, 255, .66);
  border-bottom: 1px solid rgba(255, 255, 255, .5);
  background: rgba(231, 238, 233, .48);
  -webkit-backdrop-filter: blur(18px);
  backdrop-filter: blur(18px);
}

.mini-cta {
  background: linear-gradient(120deg, rgba(213, 228, 216, .88), rgba(239, 243, 235, .72));
}

.price-grid, .services, .business-grid, .engagement-grid, .credential-grid, .contact-ways {
  gap: var(--grid-gap);
}

/* Geschäftskunden-Farbwelt */
.business-page {
  background: radial-gradient(circle at 12% 12%, rgba(155, 188, 169, .5), transparent 31rem), radial-gradient(circle at 88% 55%, rgba(219, 232, 223, .7), transparent 35rem), #dce5df;
  background-attachment: fixed;
}

.business-page .nav {
  background: rgba(220, 229, 223, .68);
  border-color: rgba(255, 255, 255, .68);
}

.business-page .business-offers, .business-page .engagement-section {
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

.business-page .business-offers,
.business-page .mini-cta {
  background: #d2dfd6;
}

.business-page .engagement-section {
  background: #dce5df;
}

.business-page .business-card, .business-page .engagement-grid article {
  background: #f3f7f4;
  border-color: rgba(255, 255, 255, .7);
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

/* Formularelemente */
.form-layout input, .form-layout select, .form-layout textarea {
  border-color: #708578;
  border-radius: 7px;
  background: rgba(255, 255, 255, .54);
}

/* Responsive Layout und reduzierte Bewegung */
@media (max-width: 800px) {
  .nav {
    top: 8px;
    margin-top: 8px;
    padding: 0 14px;
  }
  .nav.open nav, .business-page .nav.open nav {
    top: calc(100% + 8px);
    left: 0;
    right: 0;
    border: 1px solid var(--glass-line);
    border-radius: 12px;
    background: var(--paper);
    box-shadow: var(--glass-shadow);
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }
  .business-page .nav.open nav {
    background: #dce5df;
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
  .tile, .button, .nav-cta {
    transition: none;
  }
  .tile:is(a, button):hover, .tile:focus-visible,
  .button:hover, .button:focus-visible,
  .nav-cta:hover, .nav-cta:focus-visible {
    transform: none;
  }
}