/* A calmer clinic visual system layered after the existing site stylesheet. */
:root {
  --clinic-ink: #142c3b;
  --clinic-muted: #4d6573;
  --clinic-accent: #0b7580;
  --clinic-page: #f5f8f9;
  --clinic-surface: #fff;
  --clinic-soft: #ebf3f5;
  --clinic-line: #d9e4e8;
}

body { background: var(--clinic-page); color: var(--clinic-ink); }
.bg-ivory { background-color: var(--clinic-page); }
.bg-paper, .bg-white { background-color: var(--clinic-surface); }
.bg-sand, .bg-blush { background-color: var(--clinic-soft); }
.border-line { border-color: var(--clinic-line); }
.text-muted, .lede { color: var(--clinic-muted); }
.text-gold, .accent { color: var(--clinic-accent); }

.display {
  font-family: 'Manrope', system-ui, sans-serif;
  font-style: normal;
  font-weight: 650;
  letter-spacing: -.045em;
  line-height: 1.16;
}
.display .accent { font-style: normal; font-weight: inherit; }
h1.display { font-size: clamp(2.35rem, 4.5vw, 4rem); }
h2.display { font-size: clamp(2rem, 3.3vw, 2.85rem); }
.lede { font-size: 1rem; font-weight: 400; line-height: 1.75; }
.eyebrow { letter-spacing: .16em; font-weight: 700; }

header#nav {
  background: rgba(255,255,255,.97);
  border-bottom-color: var(--clinic-line);
  box-shadow: 0 1px 0 rgba(20,44,59,.03);
}
header#nav .navlink { font-weight: 600; }
header#nav a.lang, header#nav .lang { font-weight: 700; }

main#top > section:first-child > .max-w-6xl {
  padding-top: clamp(3.25rem, 6vw, 5rem);
  padding-bottom: clamp(4rem, 7vw, 6rem);
}
main section[class~="py-24"] {
  padding-top: clamp(4.25rem, 7vw, 6rem);
  padding-bottom: clamp(4.25rem, 7vw, 6rem);
}
main .shadow-soft, main .shadow-lift {
  box-shadow: 0 14px 38px rgba(20,44,59,.08);
}
main .frame::after { box-shadow: inset 0 0 0 1px rgba(20,44,59,.09); }
main a.rounded-full, main button.rounded-full, header#nav a.rounded-full {
  border-radius: .9rem;
}

/* The original entrance blur delayed readable text on real screens. */
body .reveal, body .reveal.in {
  opacity: 1;
  transform: none;
  filter: none;
  transition: none;
}
body .lift:hover { transform: none; }

a:focus-visible, button:focus-visible, summary:focus-visible,
input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: 3px solid var(--clinic-accent);
  outline-offset: 3px;
}

@media (max-width: 767px) {
  header#nav > div { min-height: 68px; height: auto; padding-top: .7rem; padding-bottom: .7rem; }
  header#nav a[href*="#beratung"] { padding: .7rem .9rem; font-size: .8rem; }
  main#top > section:first-child > .max-w-6xl { padding-top: 2.75rem; }
  .display { letter-spacing: -.035em; }
}
