

@font-face { font-family: "Source Sans 3"; font-style: normal; font-weight: 400; font-display: swap; src: url("/assets/fonts/SourceSans3-400.woff2") format("woff2"); }
@font-face { font-family: "Source Sans 3"; font-style: italic; font-weight: 400; font-display: swap; src: url("/assets/fonts/SourceSans3-400-italic.woff2") format("woff2"); }
@font-face { font-family: "Source Sans 3"; font-style: normal; font-weight: 600; font-display: swap; src: url("/assets/fonts/SourceSans3-600.woff2") format("woff2"); }
@font-face { font-family: "Source Sans 3"; font-style: normal; font-weight: 700; font-display: swap; src: url("/assets/fonts/SourceSans3-700.woff2") format("woff2"); }

* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
  -webkit-text-size-adjust: 100%;
}

body {
  font-family: var(--font-sans);
  font-size: var(--text-md);
  line-height: var(--leading-body);
  color: var(--ink);
  background: var(--paper);

}

a {
  color: var(--turquoise-dark);
}

a:hover {
  color: var(--ink);
}

:focus-visible {
  outline: 3px solid var(--focus);
  outline-offset: 3px;
  border-radius: 4px;
}

img,
picture {
  max-width: 100%;
  display: block;
}

.wrap {
  max-width: var(--max-width);
  margin: 0 auto;
  padding: 0 var(--gutter);
}

h1,
h2,
h3 {
  font-weight: 600;
  line-height: var(--leading-snug);
  letter-spacing: var(--tracking-display);
}

h1 {

  hyphens: auto;
  overflow-wrap: break-word;
  font-size: var(--text-2xl);
  line-height: var(--leading-tight);
}

h2 {
  font-size: var(--text-xl);
  margin-bottom: var(--space-sm);
}

h3 {
  font-size: var(--text-lg);
  margin-bottom: var(--space-xs);
}

p {
  margin: 0 0 10px;
}

p:last-child {
  margin-bottom: 0;
}

.label {
  font-size: var(--text-xs);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--turquoise-dark);
  font-weight: 600;
  margin-bottom: 8px;
}

.muted {
  color: var(--ink-3);
}

.platzhalter {
  font-style: italic;
  color: var(--ink-3);
  border: 1px dashed var(--turquoise-dark);
  border-radius: var(--radius-sm);
  padding: var(--space-2xs) var(--space-sm);
  display: inline-block;
}

.site-header {
  position: sticky;
  top: 0;
  z-index: 20;
  background: color-mix(in oklab, var(--paper) 94%, transparent);
  border-bottom: 2px solid var(--turquoise);
}

.site-header .wrap {
  display: flex;
  align-items: center;
  gap: 20px;
  height: var(--header-h);
}

.site-header .logo img {
  height: 40px;
  width: auto;
}

.site-header nav {
  position: relative;
}

.menu-liste {
  list-style: none;
  margin: 0;
  padding: 0;
}

.menu-liste a {
  text-decoration: none;
  color: var(--ink);
  font-weight: 600;
}

.menu-liste a:hover,
.menu-liste a:focus-visible {
  color: var(--turquoise-dark);
}

.untermenu {
  list-style: none;
  margin: 0;
  padding: 0;
}

.untermenu-knopf {
  background: none;
  border: 0;
  font: inherit;
  color: var(--ink);
  padding: 0 2px 0 6px;
  cursor: pointer;
  line-height: 1;
}

.burger-knopf {
  display: none;
  width: 44px;
  height: 44px;
  margin-left: 12px;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: var(--paper);
  cursor: pointer;
  position: relative;
}

.burger-knopf span,
.burger-knopf span::before,
.burger-knopf span::after {
  display: block;
  width: 20px;
  height: 2px;
  background: var(--ink);
  position: absolute;
  left: 11px;
  content: "";
}

.burger-knopf span {
  top: 21px;
}

.burger-knopf span::before {
  top: -6px;
  left: 0;
}

.burger-knopf span::after {
  top: 6px;
  left: 0;
}

@media (max-width: 759px) {
  .site-header nav {
    position: static;
    margin-left: auto;
    order: 3;
  }

  .burger-knopf {
    display: inline-block;
  }

  .menu-liste {
    display: none;
    position: absolute;
    left: 0;
    right: 0;
    top: var(--header-h);
    background: var(--paper);
    border-bottom: 2px solid var(--turquoise);
    padding: 12px 20px 16px;
    flex-direction: column;
    gap: 12px;
  }

  .site-header nav.offen .menu-liste {
    display: flex;
  }

  .untermenu-knopf {
    display: none;
  }

  .untermenu {
    padding: 8px 0 0 14px;
    display: grid;
    gap: 8px;
  }

  .untermenu a {
    font-weight: 500;
  }
}

.site-header .tel {
  margin-left: auto;
  font-weight: 700;
  text-decoration: none;
  white-space: nowrap;
}

@media (min-width: 760px) {
  .site-header nav {
    margin-left: auto;
    margin-right: auto;
    font-size: var(--text-sm);
  }

  .site-header .tel {
    margin-left: 0;
  }

  .menu-liste {
    display: flex;
    gap: 22px;
    align-items: center;
  }

  .nur-mobil {
    display: none;
  }

  .hat-untermenu {
    position: relative;
  }

  .untermenu {
    display: none;
    position: absolute;
    top: 100%;
    left: -12px;
    min-width: 280px;
    background: var(--paper);
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    box-shadow: var(--shadow-tile);
    padding: 14px 0 8px;
  }

  .hat-untermenu:hover .untermenu,
  .hat-untermenu:focus-within .untermenu,
  .hat-untermenu.offen .untermenu {
    display: block;
  }

  .untermenu a {
    display: block;
    padding: 8px 16px;
    font-weight: 500;
  }

  .untermenu a:hover,
  .untermenu a:focus-visible {
    background: var(--surface);
  }
}

.btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border-radius: var(--radius-sm);
  padding: 0.875rem 1.25rem;
  font-family: inherit;
  font-size: var(--text-md);
  font-weight: 600;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
  border: 1.5px solid transparent;
  transition: background 0.15s, transform 0.08s;
}

.btn:active {
  transform: translateY(1px);
}

.btn-call {
  background: var(--turquoise-dark);
  color: var(--on-accent);
}

.btn-call:hover,
.btn-call:focus-visible {
  background: var(--turquoise-deep);
  color: var(--on-accent);
}

.btn-outline {
  background: transparent;
  color: var(--ink);
  border-color: var(--ink-2);
}

.btn-outline:hover,
.btn-outline:focus-visible {
  background: var(--surface);
  color: var(--ink);
}

.callbar {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 20;
  display: flex;
  height: 60px;
}

.callbar a {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--paper);
  color: var(--turquoise-dark);
  border-top: 2px solid var(--turquoise);
  font-weight: 700;
  font-size: var(--text-md);
  text-decoration: none;
}

@media (min-width: 760px) {
  .callbar {
    display: none;
  }
}

.hero {
  padding: 32px 0 36px;
  display: grid;
  gap: 24px;
}

.erster-screen {
  display: flex;
  flex-direction: column;
  min-height: calc(100svh - 74px);
}

.erster-screen .hero {
  flex: 1 0 auto;
  align-content: start;
}

.erster-screen .aktuell-zeile {
  margin-top: auto;
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
}

.rundgang-ziel iframe {
  display: block;
  width: 100%;
  height: 420px;
  max-width: 100%;
  border: 0;
  margin-top: 12px;
}

.hero h1 {
  margin-top: 8px;
}

.hero .lead {
  margin-top: var(--space-md);
  font-size: var(--text-lg);
  color: var(--ink-2);
}

.hero .facts {
  margin-top: 20px;
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  align-items: center;
}

[id] {
  scroll-margin-top: 84px;
}

.aktuell {
  display: grid;

  grid-template-columns: 1fr auto;
  gap: 28px;
  align-items: center;
  margin-bottom: 8px;
  padding: 20px 24px;
  background: var(--paper);
  border: 1px solid var(--turquoise);
  border-radius: var(--radius);
}

.aktuell .label {
  margin-bottom: 4px;
}

.aktuell h3 {
  margin: 0;
  font-size: var(--text-lg);
}

.aktuell a {
  font-weight: 700;
  color: var(--turquoise-dark);
}

@media (max-width: 760px) {
  .aktuell {
    grid-template-columns: 1fr;
    gap: 10px;
  }
}

.hero .photo {
  border-radius: var(--radius);
  overflow: hidden;
  border: 1px solid var(--line);
}

.hero .photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 60% 40%;
}

@media (min-width: 760px) {
  .hero {
    grid-template-columns: 1fr 1.2fr;
    align-items: center;
    padding: 72px 0 64px;
  }

  .hero h1 {
    font-size: var(--text-4xl);
  }

  .hero .photo {
    aspect-ratio: 5 / 4;
  }
}

.erster-screen .hero.hero-overlay {
  position: relative;
  isolation: isolate;
  display: block;
  padding: 0;
  min-height: 560px;
  overflow: hidden;

  border-radius: var(--radius);

  margin-top: 1.5rem;
  margin-bottom: 1.5rem;
}

@media (min-width: 760px) {
  .hero-overlay__text h1 .zeile {
    white-space: nowrap;
  }
}

@media (max-width: 759px) {
  .hero-overlay__text br.nur-breit {
    display: none;
  }
}

.hero.hero-overlay picture {
  position: absolute;
  inset: 0;
  z-index: -2;
}

.hero.hero-overlay picture img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 60% 40%;
}

.hero.hero-overlay::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    linear-gradient(90deg, rgba(11, 79, 90, .88) 0%, rgba(11, 79, 90, .62) 38%, rgba(11, 79, 90, .08) 70%),
    linear-gradient(0deg, rgba(11, 79, 90, .55) 0%, rgba(11, 79, 90, 0) 55%);
}

.hero-overlay__text {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  min-height: inherit;
  max-width: 620px;
  padding: 2rem var(--gutter);
  color: #fff;
}

.hero-overlay__text .label {
  color: #CDE8EC;
}

.hero-overlay__text h1 {
  color: #fff;
}

.hero-overlay__text .lead {
  color: #E4F3F5;
}

.hero-overlay__text .muted {
  color: #CDE8EC;
}

.hero-overlay__text .btn-call {
  background: var(--paper);
  color: var(--turquoise-deep);
}

@media (min-width: 760px) {
  .erster-screen .hero.hero-overlay {
    min-height: 640px;
    display: flex;
    align-items: flex-end;
    grid-template-columns: none;
  }

  .hero.hero-overlay h1 {
    font-size: var(--text-4xl);
  }

  .hero-overlay__text {
    padding: 3rem 2.5rem;
  }
}

.section {
  padding: 36px 0;
}

.section-head {
  margin-bottom: 18px;
}

.bento {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
}

.tile {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 20px;
}

.tile h3 {
  color: var(--ink);
}

.tile p {
  font-size: var(--text-sm);
  color: var(--ink-2);
}

.tile-accent {
  background: var(--surface-2);
  color: var(--ink);
  border: 2px solid var(--turquoise);
}

.tile-accent a {
  color: var(--ink);
}

.tile-accent .big {
  font-size: var(--text-xl);
  font-weight: 700;
  margin: 6px 0;
}

.tile-dark {
  background: var(--turquoise-deep);
  color: var(--on-accent);
  border-color: transparent;
}

.tile-dark h3,
.tile-dark .muted {
  color: var(--paper);
}

.tile-news {
  background: var(--paper);
  border: 2px dashed var(--turquoise-dark);
}

@media (min-width: 620px) {
  .bento {
    grid-template-columns: repeat(2, 1fr);
  }

  .bento .span-2 {
    grid-column: span 2;
  }
}

@media (min-width: 900px) {
  .bento {
    grid-template-columns: repeat(4, 1fr);
  }

  .bento .span-2 {
    grid-column: span 2;
  }

  .bento .span-4 {
    grid-column: span 4;
  }
}

table.zeiten {
  width: 100%;
  border-collapse: collapse;
  font-size: var(--text-sm);
  margin-top: var(--space-xs);
}

table.zeiten td {
  padding: 7px 0;
  border-top: 1px solid var(--line);
}

table.zeiten td:last-child {
  text-align: right;
}

table.zeiten tr.heute-zeile td {
  font-weight: 700;
  color: var(--turquoise-dark);
}

.textpage {
  padding: 32px 0 48px;
  max-width: 760px;
}

.textpage h1 {
  margin-bottom: 18px;
}

.textpage h2 {
  margin-top: 28px;
}

.textpage p,
.textpage li {
  font-size: var(--text-md);
}

.textpage ul {
  padding-left: 20px;
  margin-bottom: 10px;
}

.page-head {
  padding: 28px 0 24px;
}

.breadcrumb {
  font-size: var(--text-sm);
  color: var(--ink-2);
  margin-bottom: 14px;
}

.breadcrumb a {
  color: var(--turquoise-dark);
}

.hinweis-entwurf {
  margin-top: 14px;
  padding: 10px 14px;
  background: var(--note);
  color: var(--note-ink);
  border: 1px solid var(--note-line);
  border-radius: var(--radius-sm);
  font-size: var(--text-sm);
}

a.tile-link {
  display: flex;
  flex-direction: column;
  text-decoration: none;
  color: inherit;
}

a.tile-link {
  transition: transform 0.15s, box-shadow 0.15s;
}

a.tile-link:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-tile);
  border-color: var(--turquoise);
  color: inherit;
}

a.tile-link:focus-visible {
  border-color: var(--turquoise);
}

a.tile-link .mehr {
  margin-top: auto;
  padding-top: 10px;
  font-size: var(--text-sm);
  font-weight: 700;
  color: var(--turquoise-dark);
}

.schritte {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 14px;
  counter-reset: schritt;
}

.schritte li {
  position: relative;
  padding: 16px 20px 16px 64px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
}

.schritte li::before {
  counter-increment: schritt;
  content: counter(schritt);
  position: absolute;
  left: 20px;
  top: 16px;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: var(--surface-2);
  color: var(--turquoise-deep);
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
}

.schritte h3 {
  margin: 0 0 4px;
  font-size: var(--text-md);
}

details {
  border-top: 1px solid var(--line);
  padding: 8px 0;
}

details summary {
  cursor: pointer;
  font-weight: 600;
}

details summary .platzhalter {
  display: inline;
}

@media (min-width: 900px) {
  .bento .span-4 {
    grid-column: span 4;
  }

  .schritte {
    grid-template-columns: repeat(2, 1fr);
  }
}

.hinweis-ruhig {
  margin: 0 0 36px;
  color: var(--ink-2);
}

.team-einleitung {
  max-width: 62ch;
}

.team-karten {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
  margin-top: 16px;
}

.arzt-foto {
  aspect-ratio: 4 / 5;
  background: var(--surface-2);
  border-radius: var(--radius);
  display: flex;
  align-items: center;
  justify-content: center;
}

.arzt h3 {
  margin: 12px 0 2px;
  font-size: var(--text-lg);
}

.arzt p {
  margin: 0;
  color: var(--ink-2);
  font-size: var(--text-sm);
}

.team-praxis {
  margin: 18px 0 0;
  padding-top: 14px;
  border-top: 1px solid var(--line);
  color: var(--ink-2);
  font-size: var(--text-sm);
}

@media (max-width: 760px) {
  .team-karten {
    grid-template-columns: 1fr;
  }
}

.prozess {
  grid-template-columns: 1fr;
}

@media (min-width: 900px) {
  .prozess {
    grid-template-columns: repeat(3, 1fr);
  }
}

.prozess .tile {
  position: relative;
  overflow: hidden;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 0 0 var(--radius) var(--radius);
}

.prozess .tile::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: var(--turquoise);
}

.schritt-nr {
  font-size: var(--text-xs);
  font-weight: 700;
  color: var(--turquoise-dark);
  margin-bottom: 6px;
}

.tile-solo {
  background: var(--surface-2);
  border: 2px solid var(--turquoise);
}

.tile-solo h3 {
  font-size: var(--text-xl);
  line-height: 1.2;
}

.tile-solo .label {
  margin-bottom: 10px;
}

@media (min-width: 900px) {
  .leistungen-raster {
    grid-auto-rows: 1fr;
  }

  .leistungen-raster .kachel-schwerpunkt { grid-column: 1 / span 2; grid-row: 1 / span 3; }
  .leistungen-raster #allgemeine-zahnheilkunde { grid-column: 1 / span 2; grid-row: 4 / span 3; }
  .leistungen-raster #implantatversorgungen { grid-column: 3 / span 2; grid-row: 1 / span 2; }
  .leistungen-raster #aesthetische-zahnheilkunde { grid-column: 3; grid-row: 3 / span 2; }
  .leistungen-raster #vollkeramik { grid-column: 4; grid-row: 3 / span 2; }
  .leistungen-raster #parodontologie { grid-column: 3; grid-row: 5 / span 2; }
  .leistungen-raster #zahnerhalt-endodontie { grid-column: 4; grid-row: 5 / span 2; }

  .leistungen-raster .kachel-schwerpunkt h3 { font-size: var(--text-3xl); }
  .leistungen-raster #allgemeine-zahnheilkunde h3 { font-size: var(--text-2xl); line-height: 1.2; }
  .leistungen-raster .kachel-schwerpunkt p,
  .leistungen-raster #allgemeine-zahnheilkunde p { font-size: var(--text-lg); }

  .leistungen-raster #implantatversorgungen h3 { font-size: var(--text-xl); line-height: 1.2; }
  .leistungen-raster #implantatversorgungen p { font-size: var(--text-md); }
}

.aussen {
  margin: 14px 0 0;
  font-size: var(--text-sm);
  color: var(--ink-2);
}

.aussen a {
  color: var(--turquoise-dark);
  font-weight: 700;
}

.rundgang-ziel iframe {
  width: 100%;
  height: 360px;
  border: 0;
  border-radius: var(--radius);
  margin-top: 12px;
}

.foto-platzhalter {
  min-height: 220px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 20px;
  background: var(--surface);
  border: 1px dashed var(--line);
  border-radius: var(--radius);
  color: var(--ink-2);
  font-style: italic;
}

.tile-dark a,
.tile-dark p {
  color: var(--paper);
}

.termin-big {
  font-size: var(--text-xl);
  font-weight: 700;
  margin: 6px 0;
}

.leistung-kopf {
  display: grid;
  gap: 24px;
  align-items: center;
}

.leistung-kopf .page-head {
  padding-bottom: 0;
}

.leistung-kopf .foto-platzhalter {
  min-height: 200px;
  margin: 0;
}

@media (min-width: 760px) {
  .leistung-kopf {
    grid-template-columns: 1.3fr 1fr;
  }

  .leistung-kopf .foto-platzhalter {
    min-height: 260px;
  }
}

.leistung-raster .span-4 {
  grid-column: 1 / -1;
}

@media (min-width: 620px) {
  .leistung-raster .ablauf {
    grid-column: span 2;
  }
}

.foto-klein {
  min-height: 110px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 12px;
  background: var(--paper);
  border: 1px dashed var(--line);
  border-radius: var(--radius);
  font-style: italic;
}

@media (min-width: 900px) {
  .leistung-raster .worum {
    grid-row: span 2;
  }

  .leistung-raster .ablauf {
    grid-column: span 3;
  }
}

.site-header .menu-liste a,
.site-header .untermenu-knopf {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
}

.site-header .untermenu-knopf {
  min-width: 44px;
  justify-content: center;
}

.site-header .tel {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
}

@media (max-width: 359px) {
  .hero .label {
    font-size: 11px;
    letter-spacing: 0.02em;
  }
}

.breadcrumb a {
  display: inline-block;
  min-height: 24px;
  line-height: 24px;
}

.leistung-kopf {
  align-items: start;
}

.leistung-kopf .page-head {
  padding: 20px 0 0;
}

.leistung-kopf .foto-platzhalter {
  margin-top: 20px;
  min-height: 200px;
}

@media (min-width: 760px) {
  .leistung-kopf .foto-platzhalter {
    min-height: 220px;
  }
}

.leistung-raster {
  gap: 16px;
  margin-top: 28px;
}

section:has(> .leistung-raster) {
  padding-bottom: 28px;
}

.site-header .logo {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
}

.tile p a,
.tile .big a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
}

details summary {
  min-height: 44px;
  display: flex;
  align-items: center;
}

[data-rundgang-start] {
  min-height: 44px;
}

.tile p[data-rundgang-text] a {
  display: inline;
  min-height: 0;
  padding: 10px 0;
}

.breadcrumb a {
  display: inline-block;
  min-height: 44px;
  padding: 10px 0;
  margin: -10px 0;
  line-height: 24px;
}

.section-flush {
  padding-top: 0;
}

.hero-eine-spalte {
  grid-template-columns: 1fr;
  padding-bottom: 0;
}

.section-nah {
  padding-top: var(--space-sm);
}

.klein {
  font-size: var(--text-xs);
}

.abstand-oben {
  margin-top: var(--space-sm);
}

.foto-kachel {
  margin-bottom: var(--space-sm);
  border-radius: var(--radius-sm);
  overflow: hidden;
}

.foto-kachel img {
  width: 100%;
  height: auto;
}

.arzt-foto {
  overflow: hidden;
}

.arzt-foto img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 25%;
}

.arzt-foto.pos-mitte img {
  object-position: 50% 30%;
}

.rundgang-ziel iframe {
  aspect-ratio: 4 / 3;
  height: auto;
}

@media (prefers-reduced-motion: reduce) {
  * {
    transition: none !important;
  }
}

[hidden] {
  display: none !important;
}

.arzt-foto picture,
.hero .photo picture {
  width: 100%;
  height: 100%;
}

.site-header .untermenu-knopf {
  font-family: system-ui, sans-serif;
  font-size: var(--text-sm);
}

.tile .profil-liste {
  list-style: none;
  margin: var(--space-xs) 0 0;
  padding: 0;
}

.tile .profil-liste a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
}

a.tile-link:not([href]) {
  pointer-events: none;
}

.tile .stellen-liste {
  margin: var(--space-xs) 0 var(--space-sm);
  padding-left: 1.25em;
}

.tile .stellen-liste li {
  margin-bottom: var(--space-2xs);
  font-size: var(--text-sm);
  color: var(--ink-2);
}

.kontakt-raster {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
}

.kontakt-erreichen {
  display: grid;
  grid-template-columns: 1fr;
  row-gap: var(--space-md);
}

.kontakt-erreichen > div + div {
  border-top: 1px solid var(--turquoise);
  padding-top: var(--space-md);
}

.kontakt-erreichen .big {
  font-size: var(--text-lg);
  font-weight: 700;
  margin: 6px 0 0;
}

.kontakt-erreichen .adresse {
  font-size: var(--text-lg);
  line-height: var(--leading-snug);
  color: var(--ink);
  margin: 6px 0 0;
}

.tile .kontakt-erreichen .adresse a,
.kontakt-erreichen .adresse a {
  display: inline-block;
  min-height: 44px;
  font-weight: 600;
}

.kontakt-zeiten .notdienst-teil {
  margin-top: var(--space-md);
  padding-top: 14px;
  border-top: 1px solid var(--line);
}

.kontakt-zeiten .notdienst-teil h3 {
  font-size: var(--text-md);
  margin: 0 0 4px;
}

.kontakt-zeiten .notdienst-teil p a {
  display: inline;
  min-height: 0;
}

.kontakt-rundgang picture img {
  aspect-ratio: 16 / 9;
  object-fit: cover;
  width: 100%;
  height: auto;
  border-radius: var(--radius-sm);
  margin: 0 0 14px;
}

.bewertungen {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px 28px;
}

.bewertungen p {
  margin: 0;
}

.bewertungen h3 {
  flex-basis: 100%;
  margin: 0;
}

.tile.bewertungen .profil-liste {
  display: flex;
  flex-wrap: wrap;
  gap: 0 24px;
  margin: 0;
}

.tile.bewertungen .profil-liste a {
  font-weight: 600;
}

@media (min-width: 620px) {
  .kontakt-erreichen {
    grid-template-columns: 1fr 1fr;
    column-gap: 24px;
  }

  .kontakt-erreichen > div + div {
    border-top: 0;
    padding-top: 0;
    border-left: 1px solid var(--turquoise);
    padding-left: 24px;
  }
}

@media (min-width: 900px) {
  .kontakt-raster {
    grid-template-columns: 1fr 1fr;
    grid-template-areas:
      "erreichen rundgang"
      "zeiten    rundgang";
  }

  .kontakt-erreichen { grid-area: erreichen; }
  .kontakt-zeiten    { grid-area: zeiten; }
  .kontakt-rundgang  { grid-area: rundgang; }
}

.zeit-am-stueck {
  white-space: nowrap;
}

.kontakt-erreichen .big,
.kontakt-erreichen .big a,
.tile .kontakt-erreichen .adresse a,
.kontakt-erreichen .adresse a {
  font-weight: 400;
  text-decoration: none;
}

.kontakt-erreichen .big a:hover,
.kontakt-erreichen .big a:focus-visible,
.kontakt-erreichen .adresse a:hover,
.kontakt-erreichen .adresse a:focus-visible {
  text-decoration: underline;
}

.site-footer {
  background: var(--turquoise-deep);
  color: #DCEDF0;
  margin-top: 40px;
  padding: 22px 0;
  font-size: var(--text-sm);
}

.site-footer .wrap {
  display: grid;
  gap: 18px;
}

.site-footer h2 {
  font-size: var(--text-sm);
  margin: 0 0 6px;
  color: var(--on-accent);
}

.site-footer p {
  margin: 0 0 6px;
}

.site-footer a {
  color: var(--on-accent);
  line-height: 24px;
}

.site-footer .fuss-reihe a,
.site-footer a[href^="tel:"],
.site-footer a[href^="mailto:"] {
  display: inline-block;
  min-height: 24px;
}

.site-footer a:hover {
  color: #DCEDF0;
}

.site-footer .fuss-klein {
  font-size: var(--text-xs);
  color: #B9D6DB;
}

.site-footer ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.site-footer .fuss-reihe {
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 8px;
}

.site-footer .fuss-reihe li {
  white-space: nowrap;
}

.site-footer .fuss-reihe li:not(:last-child)::after {
  content: "·";
  padding: 0 8px;
  color: #B9D6DB;
}

@media (min-width: 760px) {
  .site-footer .wrap {
    grid-template-columns: 1.1fr 1.2fr 1fr;
  }
}

@media (max-width: 759px) {
  .site-footer {
    padding-bottom: calc(22px + 72px);
  }
}
