@font-face {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/assets/fonts/open-sans/open-sans-v34-latin-regular.woff2") format("woff2");
}
@font-face {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/assets/fonts/open-sans/open-sans-v34-latin-700.woff2") format("woff2");
}

/* Markenfarben auf Bootstrap-Tokens gelegt:
   primary = Lila, secondary = Gruen (30 % als secondary-bg-subtle),
   light = Creme, light-bg-subtle = dunkleres Creme (Vita-Box) */
:root {
  --font-hero: "Open Sans", sans-serif;
  --font-heading: "Open Sans", sans-serif;
  --font-body: "Open Sans", sans-serif;

  --bs-body-font-family: var(--font-body);
  --bs-body-font-size: clamp(0.85rem, 0.8rem + 0.2vw, 0.95rem);
  --bs-body-line-height: 1.5;

  --bs-primary: #a4175c;
  --bs-primary-rgb: 164, 23, 92;
  --bs-secondary: #9dc612;
  --bs-secondary-rgb: 157, 198, 18;
  --bs-secondary-bg-subtle: #e1eeb7;
  --ohm-on-lime: #8c1250;
  --ohm-green-text: #527000;
  --bs-form-invalid-color: #b02a37;
  --bs-form-invalid-border-color: #b02a37;
  --bs-light: #faf6eb;
  --bs-light-rgb: 250, 246, 235;
  --bs-light-bg-subtle: #f5edd8;
  --bs-secondary-bg: #e5e5e5;
  --bs-secondary-color: #595959;

  --bs-heading-color: var(--bs-primary);
  --bs-link-color: #a4175c;
  --bs-link-color-rgb: 164, 23, 92;
  --bs-link-hover-color: #527000;
  --bs-link-hover-color-rgb: 82, 112, 0;
}

a {
  text-decoration: none;
}

h1, h2, h3, h4, h5, h6,
.h1-heading, .h2-heading, .h3-heading, .h4-heading, .h5-heading,
.hero-heading {
  font-family: var(--font-heading);
  font-weight: 700;
  line-height: 1.4;
  text-wrap: balance;
}

h1 { font-size: clamp(1.15rem, 1rem + 0.7vw, 1.5rem); }
h2 { font-size: clamp(1.05rem, 0.95rem + 0.55vw, 1.375rem); }
h3 { font-size: clamp(1rem, 0.92rem + 0.35vw, 1.2rem); }
h4 { font-size: clamp(0.95rem, 0.9rem + 0.2vw, 1.05rem); }
h5 { font-size: clamp(0.9rem, 0.86rem + 0.15vw, 1rem); }

.h1-heading { font-size: clamp(1.15rem, 1rem + 0.7vw, 1.5rem); }
.h2-heading { font-size: clamp(1.05rem, 0.95rem + 0.55vw, 1.375rem); }
.h3-heading { font-size: clamp(1rem, 0.92rem + 0.35vw, 1.2rem); }
.h4-heading { font-size: clamp(0.95rem, 0.9rem + 0.2vw, 1.05rem); }
.h5-heading { font-size: clamp(0.9rem, 0.86rem + 0.15vw, 1rem); }

.hero-heading {
  font-family: var(--font-hero);
  font-size: clamp(1rem, 0.7rem + 1.2vw, 2rem);
  line-height: 1.3;
}

.lead {
  font-weight: 400;
  font-size: clamp(1.05rem, 1rem + 0.2vw, 1.2rem);
  line-height: 1.4;
  text-wrap: balance;
}

.logo { width: 150px; height: auto; }
@media (min-width: 768px) { .logo { width: 200px; } }
@media (min-width: 992px) { .logo { width: 230px; } }

.header-bg {
  background: linear-gradient(to bottom, #e0dde0 0%, #fefefe 86%, #fefefe 100%);
}

.header-pic,
.hero-slide {
  height: 200px;
  object-fit: cover;
}
.hero-slide { height: 450px; }
@media (min-width: 768px) {
  .header-pic { height: 300px; }
}
@media (min-width: 992px) {
  .header-pic { height: 400px; }
  .hero-slide { height: 780px; }
}

.bg-tooth {
  background: url("/assets/img/logo_zahnarzt_ohm_zahn.webp") center center no-repeat fixed;
  background-size: 800px auto;
}
@media (max-width: 767.98px) {
  .bg-tooth { background: none; }
}
@media (min-width: 992px) {
  .bg-tooth { background-size: 1200px auto; }
}

@media (min-width: 1400px) {
  .container { max-width: 1140px; }
}

.btn-primary {
  --bs-btn-bg: #a4175c;
  --bs-btn-border-color: #a4175c;
  --bs-btn-hover-bg: #9dc612;
  --bs-btn-hover-border-color: #9dc612;
  --bs-btn-hover-color: var(--ohm-on-lime);
  --bs-btn-active-bg: #9dc612;
  --bs-btn-active-border-color: #9dc612;
  --bs-btn-active-color: var(--ohm-on-lime);
  --bs-btn-disabled-bg: #a4175c;
  --bs-btn-disabled-border-color: #a4175c;
  --bs-btn-focus-shadow-rgb: 164, 23, 92;
  transition: background-color 0.3s ease, border-color 0.3s ease;
}
.btn-outline-primary {
  --bs-btn-color: #a4175c;
  --bs-btn-border-color: #a4175c;
  --bs-btn-hover-bg: #a4175c;
  --bs-btn-hover-border-color: #a4175c;
  --bs-btn-active-bg: #a4175c;
  --bs-btn-active-border-color: #a4175c;
  --bs-btn-focus-shadow-rgb: 164, 23, 92;
}

.navbar {
  --bs-navbar-color: #fff;
  --bs-navbar-hover-color: #fff;
  --bs-navbar-active-color: #fff;
  --bs-navbar-nav-link-padding-x: 0.75rem;
  --bs-navbar-padding-y: 0;
}
.navbar .nav-link {
  font-weight: 700;
  text-transform: uppercase;
  font-size: clamp(0.85rem, 0.7rem + 0.35vw, 1rem);
  letter-spacing: 0.125em;
  padding-top: 0.8rem;
  padding-bottom: 0.8rem;
  transition: background-color 0.7s ease;
}
.navbar .nav-link:hover,
.navbar .nav-link.active {
  background-color: var(--bs-primary);
}

.navbar {
  background-color: var(--bs-secondary);
  border-bottom: 5px solid var(--bs-primary);
}
.menu-btn { width: 60px; height: 60px; line-height: 1; }
.menu-close { width: 42px; height: 42px; }

@media (max-width: 767.98px) {
  .navbar {
    background: none;
    border: 0;
  }
  .navbar .offcanvas {
    width: 250px;
    background: url("/assets/img/bg_sidr_menu.webp") top left / 300px auto no-repeat var(--bs-secondary);
  }
  .navbar {
    --bs-navbar-color: var(--ohm-on-lime);
    --bs-navbar-hover-color: var(--ohm-on-lime);
    --bs-navbar-active-color: var(--ohm-on-lime);
  }
  .navbar .navbar-nav {
    --bs-nav-link-color: var(--ohm-on-lime);
    --bs-nav-link-hover-color: var(--ohm-on-lime);
  }
  .navbar .nav-link {
    color: var(--ohm-on-lime);
    padding: 0;
    line-height: 50px;
    border-top: 1px solid var(--bs-secondary);
  }
  .navbar .nav-link:hover,
  .navbar .nav-link.active {
    background-color: transparent;
  }
}

.accordion {
  --bs-accordion-bg: transparent;
  --bs-accordion-border-color: #ccc;
  --bs-accordion-btn-color: var(--bs-primary);
  --bs-accordion-btn-padding-x: 1rem;
  --bs-accordion-body-padding-x: 1rem;
  --bs-accordion-active-bg: transparent;
  --bs-accordion-active-color: var(--bs-primary);
  --bs-accordion-btn-focus-box-shadow: 0 0 0 0.2rem rgba(var(--bs-primary-rgb), 0.25);
}
.accordion-button {
  font-weight: 700;
}
.accordion-button:not(.collapsed) {
  box-shadow: none;
}

.form-control:focus::placeholder {
  color: transparent;
}
.form-control:focus {
  background-color: #f5f9e7;
  border-color: var(--bs-primary);
  box-shadow: none;
}

.back-to-top {
  width: 3.2rem;
  height: 3.2rem;
  font-size: 1.2rem;
  opacity: 0;
  visibility: hidden;
  transform: translateY(2rem);
  transition: opacity 0.3s ease, transform 0.4s cubic-bezier(0.23, 1, 0.32, 1), visibility 0s linear 0.4s, background-color 0.3s ease;
}
.back-to-top.is-visible {
  opacity: 1;
  visibility: visible;
  transform: none;
  transition: opacity 0.3s ease, transform 0.4s cubic-bezier(0.23, 1, 0.32, 1), visibility 0s, background-color 0.3s ease;
}
@media (prefers-reduced-motion: reduce) {
  .back-to-top { transform: none; transition: opacity 0.2s ease, visibility 0s linear 0.2s; }
  .back-to-top.is-visible { transition: opacity 0.2s ease, visibility 0s; }
}

:focus-visible {
  outline: 2px solid var(--bs-primary);
  outline-offset: 2px;
}

.accordion-button {
  font-size: inherit;
}

.carousel-caption a:hover {
  color: var(--bs-primary);
  text-decoration: underline;
}

.map-opt-in {
  min-height: 400px;
}

.btn-termin {
  border-radius: var(--bs-border-radius);
}
@media (min-width: 768px) {
  .btn-termin {
    border-radius: 0 0 var(--bs-border-radius) var(--bs-border-radius);
  }
}

.carousel-control-prev,
.carousel-control-next {
  width: 4rem;
  opacity: 1;
  color: var(--bs-primary);
  font-size: 2.5rem;
}
.carousel-control-prev .bi,
.carousel-control-next .bi {
  -webkit-text-stroke: 3px currentColor;
}
.carousel-control-prev:hover,
.carousel-control-next:hover {
  color: var(--bs-secondary);
}

.carousel-indicators [data-bs-target] {
  width: 12px;
  height: 12px;
  margin: 0 5px;
  border: 0;
  border-radius: 50%;
  background-color: #fff;
  opacity: 1;
}
.carousel-indicators .active {
  background-color: var(--bs-primary);
}

[data-toggle="doc-calendar"] iframe {
  min-height: 800px !important;
}

.icon-link > .bi {
  position: relative;
  top: -0.18em;
}

.icon-link.fw-bold > .bi {
  -webkit-text-stroke: 1px currentColor;
}

.accordion {
  --bs-accordion-btn-focus-box-shadow: none;
  --bs-accordion-btn-focus-border-color: transparent;
  margin-bottom: 3rem;
}
.accordion-flush > .accordion-item {
  margin-bottom: 0;
}
.accordion-button {
  padding-top: 0.8rem;
  padding-bottom: 0.8rem;
}

p + h3.h2-heading {
  margin-top: 3rem;
}

.accordion {
  --bs-accordion-btn-icon: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23a4175c' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'><path d='m2 5 6 6 6-6'/></svg>");
  --bs-accordion-btn-active-icon: var(--bs-accordion-btn-icon);
}

.accordion-button > span {
  transition: transform 0.35s cubic-bezier(0.34, 1.56, 0.64, 1);
}
.accordion-button:hover > span {
  transform: translateX(4px);
}
@media (prefers-reduced-motion: reduce) {
  .accordion-button > span { transition: none; }
}

.btn-outline-primary {
  --bs-btn-border-width: 2px;
}
.btn {
  --bs-btn-padding-x: 1.5rem;
  --bs-btn-padding-y: 0.75rem;
  --bs-btn-font-size: clamp(0.85rem, 0.8rem + 0.2vw, 0.95rem);
  --bs-btn-font-weight: 700;
  --bs-btn-focus-box-shadow: none;
  --bs-btn-active-shadow: none;
}
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.25rem;
}
.btn > .bi {
  line-height: 1;
  -webkit-text-stroke: 1px currentColor;
}

.caption {
  display: block;
  font-size: 0.875rem;
  margin-bottom: 1.5rem;
}

.back-to-top.back-to-top {
  margin: 1.5rem !important;
}
@media (min-width: 768px) {
  .back-to-top.back-to-top {
    margin: 2.5rem !important;
  }
}

.quick-actions {
  position: fixed;
  right: 1.5rem;
  bottom: 5.45rem;
  z-index: 1030;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}
.quick-actions .btn {
  width: 3.2rem;
  height: 3.2rem;
  font-size: 1.2rem;
}
@media (min-width: 768px) {
  .quick-actions {
    right: 2.5rem;
    bottom: 6.45rem;
  }
}

@keyframes page-fade-in {
  from { opacity: 0; }
  to { opacity: 1; }
}
body {
  animation: page-fade-in 0.9s ease-out;
}
@media (prefers-reduced-motion: reduce) {
  body { animation: none; }
}

.form-control {
  font-size: calc(var(--bs-body-font-size) * 0.9);
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
}

.carousel-caption .bg-secondary {
  color: var(--ohm-on-lime) !important;
}
.carousel-caption .bg-secondary a {
  color: inherit;
  text-decoration: underline;
}

.text-secondary {
  color: var(--ohm-green-text) !important;
}

.container {
  --bs-gutter-x: 2rem;
}

@media (max-width: 767.98px) {
  .container {
    --bs-gutter-x: 3rem;
  }
  section.py-5 {
    padding-top: 4rem !important;
    padding-bottom: 4rem !important;
  }
}

@media (max-width: 575.98px) {
  footer .nav {
    flex-direction: column;
    align-items: center;
  }
  footer .nav-link {
    padding-top: 0.65rem;
    padding-bottom: 0.65rem;
  }
}

.grecaptcha-badge { visibility: hidden; }

.form-check-input {
  width: 1.4em;
  height: 1.4em;
  margin-top: 0.1em;
  border: 2px solid var(--bs-primary);
}
.form-check-input:checked {
  background-color: var(--bs-primary);
  border-color: var(--bs-primary);
}
.form-check-input:focus {
  border-color: var(--bs-primary);
  box-shadow: 0 0 0 0.2rem rgba(var(--bs-primary-rgb), 0.25);
}
.form-check-input.is-invalid,
.was-validated .form-check-input:invalid {
  border-color: var(--bs-primary);
}
.form-check {
  padding-left: 2.2em;
}
.form-check .form-check-input {
  margin-left: -2.2em;
}
