@font-face {
  font-family: 'Cormorant Garamond';
  src: url('../fonts/CormorantGaramond.ttf') format('truetype');
  font-weight: 400 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Cormorant Garamond';
  src: url('../fonts/CormorantGaramond-Italic.ttf') format('truetype');
  font-weight: 400 700;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'Inter';
  src: url('../fonts/Inter.ttf') format('truetype');
  font-weight: 300 700;
  font-style: normal;
  font-display: swap;
}

:root {
  --gold: #c5a46e;
  --gold-light: #d4b88a;
  --gold-dark: #c4ad7a;
  --red-matte: #a84848;
  /* Alle Preise in dunkelblauer Schrift */
  --price-color: #0a2f6b;
  --bg-deep: #0a0b10;
  --bg-card: #14151c;
  --bg-elevated: #11131a;
  --border: #2a2c36;
  --text-primary: #f1e9df;
  --text-secondary: #d1c7b8;
  --text-muted: #c4b494;
  --text-subtle: #c4ad7a;
  --glass-panel-bg: rgba(10, 11, 16, 0.3);
  --glass-title-bg: rgba(10, 11, 16, 0.3);
  --hero-option-bg: rgba(10, 11, 16, 0.3);
  --hero-option-color: var(--text-primary);
  /* Scroll-to-top: Anthrazit + Gold wie BMH-Herzlogo */
  --scroll-top-bg: linear-gradient(160deg, #3a3c40 0%, #26282c 48%, #1a1c1f 100%);
  --scroll-top-bg-solid: #26282c;
  --scroll-top-border: #c8a25e;
  --scroll-top-label-color: #d4b06a;
  --scroll-top-hover-bg: linear-gradient(160deg, #4a4638 0%, #2e2a22 50%, #1f1c18 100%);
  --scroll-top-hover-border: #e0c992;
  --scroll-top-hover-label: #f0d9a0;
  --konfig-option-bg: rgba(20, 21, 28, 0.3);
  --konfig-surface-bg: rgba(20, 21, 28, 0.3);
  --konfig-dropdown-bg: rgba(14, 15, 20, 0.3);
  --icon-tile-bg: #1f212b;
}

.skip-link {
  position: absolute;
  left: 0.75rem;
  top: 0.75rem;
  z-index: 2147483647;
  padding: 0.55rem 0.95rem;
  background: #c5a46e;
  color: #0a0b10;
  font-weight: 600;
  border-radius: 0.55rem;
  transform: translateY(-180%);
  text-decoration: none;
}
.skip-link:focus,
.skip-link:focus-visible {
  transform: none;
  outline: 2px solid #f1e9df;
  outline-offset: 3px;
}

.text-\[\#a88f5f\] {
  color: var(--text-subtle);
}
html[data-theme="light"] .text-\[\#a88f5f\] {
  color: #5c4a24;
}

.form-consent {
  display: grid;
  gap: 0.7rem;
  margin: 0.25rem 0 1.1rem;
}
.form-consent__item {
  display: flex;
  align-items: flex-start;
  gap: 0.65rem;
  font-size: 0.88rem;
  line-height: 1.5;
  color: var(--text-secondary);
  cursor: pointer;
}
.form-consent__item input {
  margin-top: 0.2rem;
  flex: 0 0 auto;
  width: 1.05rem;
  height: 1.05rem;
  padding: 0;
  accent-color: var(--gold);
}
.impressum-page .form-consent__item input[type="checkbox"] {
  width: 1.05rem;
  height: 1.05rem;
  padding: 0;
}
.form-consent__item a {
  color: var(--gold);
  text-decoration: underline;
  text-underline-offset: 2px;
}

*, *::before, *::after {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  color-scheme: dark;
}

/* Mittlere Maustaste: Ziehen zum Scrollen */
html.is-middle-mouse-scrolling {
  scroll-behavior: auto !important;
}

html.is-middle-mouse-scrolling,
html.is-middle-mouse-scrolling body {
  cursor: grabbing !important;
  user-select: none !important;
}

html.is-middle-mouse-scrolling * {
  cursor: grabbing !important;
}

body {
  margin: 0;
  font-family: 'Inter', system-ui, sans-serif;
  background-color: var(--bg-deep);
  color: var(--text-secondary);
  line-height: 1.6;
}

/* Site-wide background: klares, helles Hero-Foto auf allen Seiten */
body::before {
  content: '';
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background-image: image-set(
    url('../images/sections/hero-atmosphere.webp') type('image/webp'),
    url('../images/sections/hero-atmosphere.jpg') type('image/jpeg')
  );
  background-position: center 40%;
  background-size: cover;
  background-repeat: no-repeat;
  filter: saturate(1.22) brightness(1.12) contrast(1.12);
  transform: scale(1.02);
  transform-origin: center center;
}

/* Nur leichter Schleier — Foto bleibt klar sichtbar */
body::after {
  content: '';
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background: linear-gradient(
      180deg,
      rgba(8, 10, 16, 0.1) 0%,
      rgba(8, 10, 16, 0.16) 40%,
      rgba(8, 10, 16, 0.32) 75%,
      rgba(8, 10, 16, 0.48) 100%
    ),
    radial-gradient(
      ellipse 90% 70% at 50% 35%,
      transparent 0%,
      rgba(8, 10, 16, 0.12) 100%
    );
}

.content-wrapper {
  position: relative;
  z-index: 1;
  overflow-x: hidden;
}

/* Sicherstellen: Footer-Zeile (Datenschutz/AGB) endet oberhalb des Docks */
body:has(#fixed-bottom-dock) .content-wrapper {
  padding-bottom: 2rem;
}

.heading-serif {
  font-family: 'Cormorant Garamond', Georgia, 'Times New Roman', serif;
}

/* Hero-Telefonzeile: Nummer und Label zwingend gleiche Serif */
.hero-consultation-phone.heading-serif,
.hero-consultation-phone .heading-serif,
.hero-consultation-phone .hero-phone-copy,
.hero-consultation-phone .hero-phone-availability {
  font-family: 'Cormorant Garamond', Georgia, 'Times New Roman', serif !important;
}

.script-font {
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-style: italic;
  font-weight: 500;
}

.gold { color: var(--gold); }
.gold-bg { background-color: var(--gold); }

.navbar-inner {
  width: 100%;
  max-width: 1720px;
  margin-inline: auto;
  padding-inline: clamp(1rem, 2vw, 1.75rem);
}

.navbar-row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 1rem 1.25rem;
  --navbar-edge-inset: 1.5rem;
  --navbar-edge-end: 0.15rem;
  --navbar-tools-reserve: 7.5rem;
  padding-inline: var(--navbar-edge-inset) calc(var(--navbar-tools-reserve) + var(--navbar-edge-end));
  position: relative;
}

.navbar-row:not(:has(.navbar-center-strip)) {
  grid-template-columns: auto 1fr;
}

.navbar-row.navbar-row--phone {
  grid-template-columns: auto minmax(0, 1fr);
  padding-inline: var(--navbar-edge-inset) calc(7.25rem + max(var(--navbar-edge-end), env(safe-area-inset-right, 0px)));
}

.navbar-row--phone .navbar-tools {
  position: absolute;
  top: 50%;
  right: max(0.75rem, env(safe-area-inset-right, 0px));
  transform: translateY(-50%);
  z-index: 6;
}

.navbar-tagline {
  margin: 0;
  padding: 0 0.75rem;
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: clamp(0.95rem, 1.6vw, 1.35rem);
  font-weight: 600;
  font-style: italic;
  color: var(--gold);
  letter-spacing: 0.02em;
  white-space: nowrap;
  min-width: 0;
  z-index: 3;
  align-self: center;
}

@media (max-width: 820px) {
  .navbar-tagline {
    display: none;
  }
}

.navbar-phone {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  z-index: 4;
  pointer-events: none;
}

.navbar-phone > * {
  pointer-events: auto;
}

#soforthilfe-side.navbar-sofort-phone,
#soforthilfe-side.navbar-sofort-phone.is-side-hidden {
  position: relative;
  left: auto;
  right: auto;
  top: auto;
  inset: auto;
  transform: none !important;
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  gap: 0.55rem;
  width: auto;
  min-width: 0;
  max-width: 100%;
  min-height: 2.7rem;
  padding: 0.38rem 1.05rem 0.38rem 0.55rem;
  border-radius: 999px;
  border: 1px solid rgba(140, 220, 255, 0.55);
  background-color: #0d2840;
  background-image:
    linear-gradient(
      105deg,
      rgba(8, 22, 36, 0.55) 0%,
      rgba(18, 56, 88, 0.28) 48%,
      rgba(8, 22, 36, 0.5) 100%
    ),
    url("../images/bg-side-digital.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  color: #fff;
  font-size: 0.95rem;
  font-weight: 600;
  letter-spacing: 0.01em;
  line-height: 1.2;
  text-decoration: none;
  text-shadow: none;
  box-shadow:
    0 2px 12px rgba(20, 90, 140, 0.32),
    inset 0 0 0 1px rgba(160, 230, 255, 0.16);
  z-index: 3;
  cursor: pointer;
}

#soforthilfe-side.navbar-sofort-phone:hover,
#soforthilfe-side.navbar-sofort-phone:focus-visible {
  background-color: #113450;
  border-color: rgba(160, 230, 255, 0.75);
  color: #fff;
  box-shadow:
    0 4px 16px rgba(30, 120, 180, 0.42),
    inset 0 0 0 1px rgba(180, 235, 255, 0.22);
}

#soforthilfe-side.navbar-sofort-phone .sofort-side-icon {
  width: 1.7rem;
  height: 1.7rem;
  min-width: 1.7rem;
  min-height: 1.7rem;
  padding: 0.28rem;
  border-radius: 50%;
  background: rgba(140, 220, 255, 0.2);
  color: #fff !important;
}

#soforthilfe-side.navbar-sofort-phone .sofort-side-label {
  -webkit-text-stroke: 0;
  text-shadow: none;
  gap: 0.45rem;
  align-items: center;
  color: #fff;
}

#soforthilfe-side.navbar-sofort-phone .sofort-phone-copy,
#soforthilfe-side.navbar-sofort-phone .sofort-label-only {
  font-size: 1em;
  font-weight: 700;
  letter-spacing: 0.03em;
  opacity: 1;
}

#soforthilfe-side.navbar-sofort-phone .sofort-phone-copy {
  font-variant-numeric: tabular-nums;
}

.navbar-brand {
  justify-self: start;
  display: flex;
  align-items: center;
  grid-column: 1;
  flex-shrink: 0;
  min-width: 0;
}

body:has(.theme-toggle-wrap--corner) .navbar-brand {
  margin-inline-start: -0.35rem;
}

.navbar-center-strip {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 2rem;
  flex-wrap: nowrap;
  grid-column: 2;
  justify-self: stretch;
  min-width: 0;
  max-width: 100%;
  width: 100%;
  padding-inline: 0.5rem;
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: none;
  -ms-overflow-style: none;
  isolation: isolate;
}

.navbar-center-strip::-webkit-scrollbar {
  display: none;
}

.navbar-tools {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  position: absolute;
  right: max(var(--navbar-edge-end), env(safe-area-inset-right, 0px));
  top: 50%;
  transform: translateY(-50%);
  flex-shrink: 0;
  z-index: 2;
}

.navbar-mobile-btn {
  flex-shrink: 0;
}

.bmh-hp {
  position: absolute !important;
  left: -10000px !important;
  width: 1px;
  height: 1px;
  overflow: hidden;
  opacity: 0;
}

.lang-switcher {
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-start;
  gap: 0.25rem;
  padding: 0.2rem 0.3rem;
  border-radius: 9999px;
  border: 1px solid rgba(197, 164, 110, 0.4);
  background: rgba(20, 21, 28, 0.45);
  flex-shrink: 0;
  white-space: nowrap;
}

.lang-flag {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 1.4rem;
  padding: 0;
  border: 1px solid transparent;
  border-radius: 0.35rem;
  background: transparent;
  cursor: pointer;
  opacity: 0.55;
  transition: opacity 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}

.lang-flag:hover,
.lang-flag:focus-visible {
  opacity: 0.95;
  outline: none;
}

.lang-flag.is-active {
  opacity: 1;
  border-color: rgba(197, 164, 110, 0.65);
  box-shadow: 0 0 0 1px rgba(197, 164, 110, 0.28);
}

.lang-flag-svg {
  width: 1.4rem;
  height: 0.93rem;
  border-radius: 0.15rem;
  display: block;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.1);
}

.lang-switcher--fixed {
  position: fixed;
  top: max(0.75rem, env(safe-area-inset-top, 0px));
  right: max(0.75rem, env(safe-area-inset-right, 0px));
  z-index: 40;
}

@media (max-width: 639px) {
  .lang-switcher {
    gap: 0.18rem;
    padding: 0.12rem 0.2rem;
  }

  .lang-flag {
    width: 1.7rem;
    height: 1.2rem;
  }

  .lang-flag-svg {
    width: 1.2rem;
    height: 0.8rem;
  }
}

/* ── Hamburger-Menü (alle Geräte, oben rechts) ── */
.site-menu-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  min-height: 2.65rem;
  padding: 0.45rem 0.85rem 0.45rem 0.75rem;
  border-radius: 9999px;
  border: 1px solid rgba(200, 162, 94, 0.65);
  background: linear-gradient(160deg, #3a3c40 0%, #26282c 48%, #1a1c1f 100%);
  color: #d4b06a;
  cursor: pointer;
  flex-shrink: 0;
  box-shadow:
    0 6px 18px rgba(0, 0, 0, 0.35),
    inset 0 1px 0 rgba(232, 200, 120, 0.16);
  transition: border-color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease, color 0.2s ease;
}

.site-menu-btn:hover,
.site-menu-btn:focus-visible {
  border-color: #e0c992;
  color: #f0d9a0;
  transform: translateY(-1px);
  outline: none;
  box-shadow:
    0 8px 22px rgba(0, 0, 0, 0.4),
    0 0 0 1px rgba(200, 162, 94, 0.2),
    inset 0 1px 0 rgba(240, 217, 160, 0.22);
}

.site-menu-btn-bars {
  display: inline-flex;
  flex-direction: column;
  justify-content: center;
  gap: 4px;
  width: 1.15rem;
}

.site-menu-btn-bars span {
  display: block;
  height: 2px;
  width: 100%;
  border-radius: 2px;
  background: currentColor;
  transition: transform 0.25s ease, opacity 0.2s ease;
  transform-origin: center;
}

.site-menu-btn.is-open .site-menu-btn-bars span:nth-child(1) {
  transform: translateY(6px) rotate(45deg);
}

.site-menu-btn.is-open .site-menu-btn-bars span:nth-child(2) {
  opacity: 0;
}

.site-menu-btn.is-open .site-menu-btn-bars span:nth-child(3) {
  transform: translateY(-6px) rotate(-45deg);
}

.site-menu-btn-label {
  font-size: 0.8rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

@media (max-width: 420px) {
  .site-menu-btn-label {
    display: none;
  }
  .site-menu-btn {
    padding: 0.55rem;
    min-width: 2.65rem;
    justify-content: center;
  }
}

.site-menu {
  position: fixed;
  inset: 0;
  z-index: 2147483000;
  pointer-events: none;
}

.site-menu.is-open {
  pointer-events: auto;
}

.site-menu-backdrop {
  position: absolute;
  inset: 0;
  border: 0;
  padding: 0;
  margin: 0;
  background: rgba(6, 7, 10, 0.55);
  opacity: 0;
  cursor: pointer;
  transition: opacity 0.28s ease;
}

.site-menu.is-open .site-menu-backdrop {
  opacity: 1;
}

.site-menu-panel {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: min(22rem, 92vw);
  display: flex;
  flex-direction: column;
  background: rgba(14, 15, 20, 0.94);
  backdrop-filter: blur(16px) saturate(1.08);
  -webkit-backdrop-filter: blur(16px) saturate(1.08);
  border-left: 1px solid rgba(200, 162, 94, 0.28);
  box-shadow: -12px 0 40px rgba(0, 0, 0, 0.45);
  transform: translateX(104%);
  transition: transform 0.3s cubic-bezier(0.22, 1, 0.36, 1);
  padding:
    max(1rem, env(safe-area-inset-top, 0px))
    max(1rem, env(safe-area-inset-right, 0px))
    max(1.25rem, env(safe-area-inset-bottom, 0px))
    1.15rem;
}

.site-menu.is-open .site-menu-panel {
  transform: translateX(0);
}

.site-menu-panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 1rem;
  padding-bottom: 0.85rem;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.site-menu-heading {
  margin: 0;
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-size: 1.55rem;
  font-weight: 600;
  color: var(--gold, #c5a46e);
  letter-spacing: 0.03em;
}

.site-menu-close {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.4rem;
  height: 2.4rem;
  border-radius: 9999px;
  border: 1px solid rgba(200, 162, 94, 0.45);
  background: rgba(10, 11, 16, 0.45);
  color: #d4b06a;
  cursor: pointer;
  transition: border-color 0.2s ease, color 0.2s ease, background 0.2s ease;
}

.site-menu-close:hover,
.site-menu-close:focus-visible {
  border-color: #e0c992;
  color: #f0d9a0;
  background: rgba(30, 28, 22, 0.7);
  outline: none;
}

.site-menu-nav {
  display: flex;
  flex-direction: column;
  gap: 0.7rem;
  overflow-y: auto;
  flex: 1 1 auto;
  min-height: 0;
  padding-right: 0.15rem;
  /* Abstand zur Telefonnummer im Fuß — kein Eintrag wird verdeckt */
  padding-bottom: 1.25rem;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}

.site-menu-link {
  display: block;
  padding: 0.95rem 0.9rem;
  border-radius: 0.75rem;
  color: #f1e9df;
  text-decoration: none;
  font-size: 1.02rem;
  font-weight: 500;
  letter-spacing: 0.01em;
  transition: background 0.18s ease, color 0.18s ease;
}

.site-menu-link:hover,
.site-menu-link:focus-visible {
  background: rgba(197, 164, 110, 0.12);
  color: #f0d9a0;
  outline: none;
}

.site-menu-link--static {
  color: #a88f5f;
  cursor: default;
}

.site-menu-link--static:hover {
  background: transparent;
  color: #a88f5f;
}

.site-menu-foot {
  flex-shrink: 0;
  margin-top: 0.35rem;
  padding-top: 1.35rem;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.7rem;
  text-align: center;
  background: inherit;
}

.site-menu-phone {
  color: #d4b06a !important;
  font-weight: 600;
  font-size: 1.05rem;
  text-decoration: none;
  letter-spacing: 0.02em;
  padding: 0.45rem 0.75rem;
  min-height: 2.75rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.site-menu-phone:hover {
  color: #f0d9a0 !important;
}

html.site-menu-open,
html.site-menu-open body {
  overflow: hidden;
}

html[data-theme="light"] .site-menu-btn {
  background: linear-gradient(160deg, #3a3c40 0%, #26282c 48%, #1a1c1f 100%);
  color: #d4b06a;
  border-color: rgba(200, 162, 94, 0.7);
}

html[data-theme="light"] .lang-switcher {
  background: rgba(255, 255, 255, 0.42);
  border-color: rgba(154, 125, 74, 0.45);
}

html[data-theme="light"] .site-menu-panel {
  background: rgba(255, 252, 247, 0.96);
  border-left-color: rgba(154, 125, 74, 0.35);
}

html[data-theme="light"] .site-menu-heading {
  color: #8a6a38;
}

html[data-theme="light"] .site-menu-link {
  color: #2a241c;
}

html[data-theme="light"] .site-menu-link:hover,
html[data-theme="light"] .site-menu-link:focus-visible {
  background: rgba(154, 125, 74, 0.12);
  color: #6b5328;
}

html[data-theme="light"] .site-menu-link--static {
  color: #8a6a38;
}

html[data-theme="light"] .site-menu-close {
  background: rgba(255, 255, 255, 0.55);
  color: #8a6a38;
  border-color: rgba(154, 125, 74, 0.4);
}

html[data-theme="light"] .site-menu-backdrop {
  background: rgba(40, 32, 20, 0.35);
}

html[data-theme="light"] .site-menu-phone {
  color: #8a6a38 !important;
}

.navbar-brand-link {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  min-width: 0;
  flex-shrink: 0;
}

.nav-phone {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.8rem;
  font-weight: 500;
  color: var(--text-secondary);
  text-decoration: none;
  letter-spacing: 0.02em;
  white-space: nowrap;
  transition: color 0.2s ease;
}

.navbar-center-strip .nav-phone {
  border-inline-end: 1px solid var(--border);
  padding-inline-end: 0.75rem;
}

.nav-phone-label {
  color: var(--gold);
  font-weight: 600;
}

.konfig-header .nav-phone {
  border-left: none;
  padding-left: 0;
}

.nav-phone:hover {
  color: var(--gold);
}

@media (min-width: 640px) {
  .nav-phone {
    font-size: 0.875rem;
  }
}

.navbar-links {
  display: none;
  align-items: center;
  gap: 2rem;
  white-space: nowrap;
}

@media (min-width: 768px) {
  .navbar-links {
    display: flex;
  }
}

@media (max-width: 767px) {
  .navbar-center-strip {
    gap: 0;
    padding-inline: 0.25rem;
  }

  .navbar-row {
    gap: 0.5rem 0.75rem;
    --navbar-tools-reserve: 16.5rem;
  }
}

@media (min-width: 768px) and (max-width: 1099px) {
  .nav-bmh {
    display: none;
  }

  .navbar-center-strip {
    flex-wrap: wrap;
    justify-content: center;
    align-content: center;
    row-gap: 0.3rem;
    column-gap: 0.75rem;
    overflow-x: visible;
    overflow-y: visible;
    padding-inline: 0.25rem;
  }

  .navbar-links {
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.5rem 0.85rem;
    max-width: 100%;
  }

  .navbar-center-strip,
  .navbar-links {
    font-size: 0.875rem; /* eine Stufe größer */
  }

  .navbar-center-strip .hamburg-tag {
    flex: 0 0 100%;
    width: 100%;
    text-align: center;
    border-inline-start: none;
    padding-inline-start: 0;
    margin-top: 0.05rem;
  }

  .hamburg-tag {
    font-size: clamp(1rem, 1.8vw, 1.35rem);
  }
}

@media (min-width: 1100px) and (max-width: 1599px) {
  .nav-bmh {
    display: none;
  }

  .navbar-center-strip {
    gap: 1rem;
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    justify-content: center;
    scroll-padding-inline: 0.5rem;
  }

  .navbar-links {
    gap: 1.1rem;
    flex-wrap: nowrap;
  }

  .navbar-center-strip,
  .navbar-links {
    font-size: 1rem; /* eine Stufe größer */
  }

  .navbar-center-strip .hamburg-tag {
    flex-shrink: 0;
  }
}

@media (min-width: 1600px) {
  .navbar-center-strip {
    justify-content: center;
    scroll-padding-inline: 0.5rem;
    gap: 1.5rem;
  }

  .navbar-links {
    gap: 1.75rem;
  }
}

.nav-link,
.nav-link-static {
  font-size: 1em; /* folgt Navbar (eine Stufe größer als zuvor) */
  transition: color 0.2s ease;
}
.nav-link:hover { color: var(--gold); }

.nav-link-static,
.mobile-nav-link-static {
  cursor: default;
}

.mobile-nav-link,
.mobile-nav-link-static {
  font-size: 1.125rem; /* eine Stufe größer */
}


html[dir="rtl"] .form-pflicht-hinweis,
html[dir="rtl"] .fragebogen-legend,
html[dir="rtl"] .checkliste-detail-body,
html[dir="rtl"] .faq-answer {
  text-align: right;
}

html[dir="rtl"] .termin-day,
html[dir="rtl"] .termin-slot {
  direction: rtl;
}

html[dir="rtl"] .scroll-to-top {
  left: 1.25rem;
  right: auto;
}

.card-dark {
  background-color: var(--bg-card);
  border: 1px solid var(--border);
  transition: all 0.3s ease;
}
.card-dark:hover {
  border-color: var(--gold);
  transform: translateY(-2px);
}

.luxury-divider {
  height: 1px;
  background: linear-gradient(to right, transparent, var(--gold), transparent);
  opacity: 0.35;
}

.divider-with-heart {
  display: flex;
  align-items: center;
  gap: 1rem;
  max-width: 280px;
  margin: 0 auto;
}
.divider-with-heart::before,
.divider-with-heart::after {
  content: '';
  flex: 1;
  height: 1px;
  background: linear-gradient(to right, transparent, var(--gold));
}
.divider-with-heart::after {
  background: linear-gradient(to left, transparent, var(--gold));
}
.divider-heart {
  color: var(--gold);
  font-size: 0.65rem;
}

@keyframes goldPulse {
  0%, 100% {
    text-shadow: 0 0 4px var(--gold), 0 0 10px rgba(197, 164, 110, 0.4);
  }
  50% {
    text-shadow: 0 0 12px var(--gold), 0 0 24px rgba(197, 164, 110, 0.6);
  }
}

@keyframes redGlow {
  0%, 100% {
    text-shadow:
      0 0 6px #ff4444,
      0 0 14px rgba(255, 68, 68, 0.7),
      0 0 28px rgba(255, 40, 40, 0.45);
  }
  50% {
    text-shadow:
      0 0 10px #ff5555,
      0 0 22px rgba(255, 80, 80, 0.9),
      0 0 40px rgba(255, 50, 50, 0.65),
      0 0 60px rgba(255, 30, 30, 0.35);
  }
}

.sofort-glow {
  color: #000;
  font-size: 1.1rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-shadow: none;
  animation: none;
}

@media (min-width: 768px) {
  .sofort-glow {
    font-size: 1.35rem;
  }
}

.accordion-content {
  max-height: 0;
  overflow: hidden;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  visibility: hidden;
  transition: max-height 0.35s ease-out, padding-bottom 0.25s ease-out, visibility 0s linear 0.35s;
}

.ratgeber-item-btn.is-open + .accordion-content,
.ratgeber-item.is-open > .accordion-content {
  padding-bottom: 1.5rem !important;
  visibility: visible;
  transition-delay: 0s;
}

/* Ratgeber — Fragen für Angehörige */
.ratgeber-title {
  display: inline-block !important;
  width: auto !important;
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding: 0.65rem 1.25rem !important;
  border-radius: 0.9rem !important;
  background: rgba(10, 11, 16, 0.3) !important;
  backdrop-filter: blur(8px) saturate(1.05) !important;
  -webkit-backdrop-filter: blur(8px) saturate(1.05) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.18) !important;
}

html[data-theme="light"] .ratgeber-title {
  background: rgba(255, 252, 247, 0.3) !important;
  border-color: rgba(255, 255, 255, 0.55) !important;
  box-shadow: 0 4px 16px rgba(40, 32, 20, 0.1) !important;
}

/* Ratgeber-Untertitel: transparentes Glas */
.ratgeber-subtitle {
  display: inline-block;
  width: fit-content;
  max-width: 100%;
  padding: 0.75rem 1.25rem;
  border-radius: 0.9rem;
  background: rgba(10, 11, 16, 0.3);
  backdrop-filter: blur(7px) saturate(1.05);
  -webkit-backdrop-filter: blur(7px) saturate(1.05);
  border: 1px solid rgba(255, 255, 255, 0.06);
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.12);
}

html[data-theme="light"] .ratgeber-subtitle {
  background: rgba(255, 252, 247, 0.3);
  border-color: rgba(255, 255, 255, 0.45);
  box-shadow: 0 4px 16px rgba(40, 32, 20, 0.08);
}

.ratgeber-item.card-dark {
  background: rgba(10, 11, 16, 0.3) !important;
  backdrop-filter: blur(8px) saturate(1.05);
  -webkit-backdrop-filter: blur(8px) saturate(1.05);
  border: 1px solid rgba(255, 255, 255, 0.1);
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.16);
}

html[data-theme="light"] .ratgeber-item.card-dark {
  background: rgba(255, 252, 247, 0.3) !important;
  border-color: rgba(255, 255, 255, 0.55);
  box-shadow: 0 4px 16px rgba(40, 32, 20, 0.1);
}

.ratgeber-item-btn {
  background: transparent;
  border: none;
  cursor: pointer;
  font: inherit;
}

.ratgeber-item-btn.is-open > svg.ui-icon {
  transform: rotate(180deg);
}

.ratgeber-item-btn > svg.ui-icon {
  transition: transform 0.25s ease;
}

.ratgeber-answer {
  overflow: hidden;
  max-height: 0;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  visibility: hidden;
  transition: max-height 0.35s ease-out, padding-bottom 0.25s ease-out, visibility 0s linear 0.35s;
  /* gleiche Schriftfarbe wie Öffnungszeiten (Mo–Fr) */
  color: #f5efe6 !important;
}

.ratgeber-item-btn.is-open + .ratgeber-answer,
.ratgeber-item.is-open > .ratgeber-answer {
  padding-bottom: 1.5rem !important;
  visibility: visible;
  transition-delay: 0s;
}

.ratgeber-answer p {
  margin: 0;
  color: inherit;
}

.ratgeber-answer strong {
  color: #f5efe6;
  font-weight: 600;
}

.ratgeber-answer p + p {
  margin-top: 0.85rem;
}

.ratgeber-link {
  color: var(--gold, #c5a46e);
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 3px;
  transition: color 0.2s ease;
}

.ratgeber-link:hover {
  color: var(--gold-light, #d4b88a);
}

html[data-theme="light"] .ratgeber-answer {
  color: #2a241c !important;
}

html[data-theme="light"] .ratgeber-answer strong {
  color: #2a241c;
}

.ratgeber-disclaimer {
  display: block;
  padding: 0.75rem 1.25rem;
  border-radius: 0.9rem;
  background: rgba(10, 11, 16, 0.3);
  backdrop-filter: blur(7px) saturate(1.05);
  -webkit-backdrop-filter: blur(7px) saturate(1.05);
  border: 1px solid rgba(255, 255, 255, 0.06);
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.12);
  color: #000 !important;
  opacity: 1;
}

html[data-theme="light"] .ratgeber-disclaimer {
  background: rgba(255, 252, 247, 0.3);
  border-color: rgba(255, 255, 255, 0.45);
  box-shadow: 0 4px 16px rgba(40, 32, 20, 0.08);
  color: #000 !important;
}

.logo-shadow {
  filter: drop-shadow(0 20px 40px rgba(0, 0, 0, 0.5));
}

/* Action-Buttons (Termin anfragen, Absenden, …): Goldbarren-Optik */
.gold-button {
  background: linear-gradient(
      155deg,
      #f7e7b0 0%,
      #e6c86a 14%,
      #d4af37 32%,
      #c5a46e 48%,
      #e8d48b 58%,
      #a67c2d 78%,
      #c9a227 92%,
      #f0df9a 100%
    );
  color: #1a1206;
  border: 1px solid rgba(255, 230, 150, 0.55);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.55),
    inset 0 -2px 0 rgba(90, 60, 10, 0.28),
    0 4px 16px rgba(120, 90, 20, 0.38);
  text-shadow: 0 1px 0 rgba(255, 245, 200, 0.4);
  font-weight: 700;
  transition: filter 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
}
.gold-button:hover {
  filter: brightness(1.06) saturate(1.05);
  transform: translateY(-1px);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.6),
    inset 0 -2px 0 rgba(90, 60, 10, 0.22),
    0 6px 20px rgba(140, 105, 25, 0.45);
}
.gold-button:active {
  transform: translateY(0);
  filter: brightness(0.98);
}
.gold-button:disabled {
  opacity: 0.65;
  cursor: not-allowed;
  transform: none;
  filter: grayscale(0.15);
}

.outline-gold {
  border: 1px solid var(--gold);
  color: var(--gold);
  transition: all 0.2s ease;
}
.outline-gold:hover {
  background-color: var(--gold);
  color: var(--bg-deep);
}

/* Oberste Zeile (Navbar / „Für Hamburg.“): einheitlich alpha 0.5 */
#navbar,
#navbar.nav-scrolled {
  background-color: rgba(10, 11, 16, 0.5) !important;
  background: rgba(10, 11, 16, 0.5) !important;
  backdrop-filter: blur(14px) saturate(1.05);
  -webkit-backdrop-filter: blur(14px) saturate(1.05);
}

#mobile-menu {
  background-color: rgba(10, 11, 16, 0.5) !important;
  background: rgba(10, 11, 16, 0.5) !important;
  backdrop-filter: blur(14px) saturate(1.05);
  -webkit-backdrop-filter: blur(14px) saturate(1.05);
}

.nav-scrolled {
  background-color: rgba(10, 11, 16, 0.5) !important;
  backdrop-filter: blur(14px);
}

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

/* Vorsorge: 5 Schritte minimal transparent (Glas) */
.vorsorge-page .vorsorge-steps > .card-dark,
.vorsorge-page .vorsorge-steps > li.card-dark {
  background: rgba(10, 11, 16, 0.3) !important;
  backdrop-filter: blur(8px) saturate(1.05);
  -webkit-backdrop-filter: blur(8px) saturate(1.05);
  border: 1px solid rgba(255, 255, 255, 0.1);
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.16);
}

.vorsorge-page .vorsorge-steps > .card-dark:hover,
.vorsorge-page .vorsorge-steps > li.card-dark:hover {
  border-color: rgba(197, 164, 110, 0.45);
  transform: translateY(-2px);
}

/* BESTATTUNGSVORSORGE + Seitentitel — minimal transparent (Glas) */
.vorsorge-page main .text-center > [data-i18n="vorsorge.page.eyebrow"],
.vorsorge-page main .text-center > [data-i18n="vorsorge.page.title"],
.vorsorge-page main .text-center > h1 {
  display: block !important;
  width: fit-content !important;
  max-width: 100%;
  margin-left: auto !important;
  margin-right: auto !important;
  padding: 0.65rem 1.25rem !important;
  border-radius: 0.9rem !important;
  background: rgba(10, 11, 16, 0.3) !important;
  background-color: rgba(10, 11, 16, 0.3) !important;
  backdrop-filter: blur(8px) saturate(1.05) !important;
  -webkit-backdrop-filter: blur(8px) saturate(1.05) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.16) !important;
}

.vorsorge-page main .text-center > [data-i18n="vorsorge.page.eyebrow"] {
  margin-bottom: 0.65rem !important;
}

.vorsorge-page main .text-center > [data-i18n="vorsorge.page.title"],
.vorsorge-page main .text-center > h1 {
  margin-top: 0.35rem !important;
}

html[data-theme="light"] .vorsorge-page .vorsorge-steps > .card-dark,
html[data-theme="light"] .vorsorge-page .vorsorge-steps > li.card-dark {
  background: rgba(255, 252, 247, 0.3) !important;
  border-color: rgba(255, 255, 255, 0.55);
  box-shadow: 0 4px 16px rgba(40, 32, 20, 0.1);
}

html[data-theme="light"] .vorsorge-page main .text-center > [data-i18n="vorsorge.page.eyebrow"],
html[data-theme="light"] .vorsorge-page main .text-center > [data-i18n="vorsorge.page.title"],
html[data-theme="light"] .vorsorge-page main .text-center > h1 {
  background: rgba(255, 252, 247, 0.3) !important;
  background-color: rgba(255, 252, 247, 0.3) !important;
  border-color: rgba(255, 255, 255, 0.55) !important;
  box-shadow: 0 4px 14px rgba(40, 32, 20, 0.1) !important;
}

.step-number {
  background-color: var(--gold);
  color: var(--bg-deep);
  width: 38px;
  height: 38px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
  font-weight: 600;
  font-size: 0.95rem;
}

.nav-logo-text {
  font-family: 'Cormorant Garamond', Georgia, serif;
  letter-spacing: 0.5px;
}

input, textarea, select {
  background-color: var(--bg-card);
  border: 1px solid var(--border);
  color: var(--text-secondary);
}
input:focus, textarea:focus, select:focus {
  border-color: var(--gold);
  outline: none;
  box-shadow: 0 0 0 1px var(--gold);
}

input[type="date"],
input[type="time"],
input[type="datetime-local"],
input[type="month"] {
  color-scheme: inherit;
  color: var(--text-secondary);
}

input[type="date"]::-webkit-datetime-edit,
input[type="date"]::-webkit-datetime-edit-fields-wrapper,
input[type="date"]::-webkit-datetime-edit-text,
input[type="date"]::-webkit-datetime-edit-year-field,
input[type="date"]::-webkit-datetime-edit-month-field,
input[type="date"]::-webkit-datetime-edit-day-field,
input[type="time"]::-webkit-datetime-edit,
input[type="time"]::-webkit-datetime-edit-hour-field,
input[type="time"]::-webkit-datetime-edit-minute-field {
  color: var(--text-secondary);
}

input[type="date"]::-webkit-calendar-picker-indicator,
input[type="time"]::-webkit-calendar-picker-indicator {
  cursor: pointer;
  opacity: 0.85;
  filter: invert(1) brightness(1.35);
}

html[data-theme="light"] input[type="date"]::-webkit-calendar-picker-indicator,
html[data-theme="light"] input[type="time"]::-webkit-calendar-picker-indicator {
  filter: none;
}

.testimonial-card {
  background-color: var(--bg-card);
  border: 1px solid var(--border);
}

.team-member-card {
  position: relative;
  /* Karussell-Karten: minimal transparent (Glas) */
  background: rgba(10, 11, 16, 0.3);
  backdrop-filter: blur(8px) saturate(1.05);
  -webkit-backdrop-filter: blur(8px) saturate(1.05);
  border: 1px solid rgba(255, 255, 255, 0.1);
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.16);
  transition: border-color 0.25s ease, box-shadow 0.25s ease;
  overflow: visible;
}

.team-member-card:hover,
.team-member-card:focus-within {
  border-color: rgba(197, 164, 110, 0.45);
}

.team-member-portrait {
  position: relative;
  width: 9rem;
  height: 9rem;
  border-radius: 9999px;
  overflow: hidden;
  cursor: pointer;
  border: 2px solid rgba(197, 164, 110, 0.45);
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.35);
  outline: none;
}

.team-member-portrait:focus-visible {
  box-shadow: 0 0 0 2px #0a0b10, 0 0 0 4px var(--gold);
}

.team-member-portrait-visual {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--gold);
  background: linear-gradient(145deg, #1f212b 0%, #14161e 100%);
  transition: transform 0.3s ease;
}

.team-member-portrait-visual img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 18%;
  display: block;
}

.team-member-portrait-visual img.team-portrait--full-head {
  object-fit: contain;
  object-position: center center;
}

.team-member-portrait-overlay {
  position: absolute;
  inset: 0;
  background: rgba(8, 9, 14, 0.14);
  opacity: 0;
  transition: opacity 0.22s ease;
  pointer-events: none;
}

.team-member-caption {
  position: absolute;
  left: 50%;
  top: calc(100% - 0.15rem);
  transform: translateX(-50%) translateY(0.2rem);
  width: max-content;
  max-width: 13.5rem;
  padding: 0.55rem 0.95rem 0.6rem;
  border-radius: 0.85rem;
  background: rgba(8, 9, 14, 0.96);
  border: 1px solid rgba(232, 212, 168, 0.5);
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.5);
  text-align: center;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  z-index: 6;
  transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s ease;
}

.team-member-name {
  color: #ffffff;
  font-size: 1.05rem;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 0.01em;
  white-space: nowrap;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.65);
}

.team-member-role {
  margin-top: 0.18rem;
  color: #f3ddb0;
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.05em;
}

.team-member-card:hover .team-member-portrait-overlay,
.team-member-portrait:hover .team-member-portrait-overlay,
.team-member-portrait:focus-visible .team-member-portrait-overlay {
  opacity: 1;
}

.team-member-card:hover .team-member-caption,
.team-member-portrait:hover ~ .team-member-caption,
.team-member-portrait:focus-visible ~ .team-member-caption {
  opacity: 1;
  visibility: visible;
  transform: translateX(-50%) translateY(0);
}

.team-member-portrait:hover .team-member-portrait-visual,
.team-member-portrait:focus-visible .team-member-portrait-visual {
  transform: scale(1.02);
}

html[data-theme="light"] .team-member-caption {
  background: rgba(255, 252, 247, 0.97);
  border-color: rgba(154, 125, 74, 0.45);
  box-shadow: 0 10px 24px rgba(40, 32, 20, 0.18);
}

html[data-theme="light"] .team-member-name {
  color: #1a140c;
  text-shadow: none;
}

html[data-theme="light"] .team-member-role {
  color: #8a6c3c;
}

/* Bottom padding for fixed bar */
main, footer, section {
  scroll-margin-top: 80px;
}

body {
  padding-bottom: 80px;
}

/* Startseite: Bottom-Dock verdeckt sonst Datenschutz/AGB/Impressum.
   Genug Luft, damit die Zeile beim Scroll-Ende vollständig über dem Dock liegt
   (ohne zusätzliches Mausrad-Drehen). */
body:has(#fixed-bottom-dock) {
  padding-bottom: 12rem;
}

body:has(#fixed-bottom-dock) footer {
  padding-bottom: 2.5rem;
}

body:has(#fixed-bottom-dock) .footer-bottom {
  padding-bottom: 0.5rem;
  margin-bottom: 0.25rem;
}

@media (max-width: 640px) {
  body:has(#fixed-bottom-dock) {
    padding-bottom: 14rem;
  }
}

/*
 * Teams-CTA: gleiches Erscheinungsbild wie „Trauerfall digital in 4 Min melden“,
 * aber fix unten rechts (Konfigurator / Angebot).
 */
.teams-plan-fixed.sofort-side-fixed {
  --side-peek: 0;
  left: auto;
  right: 1.25rem;
  top: auto;
  bottom: 1.25rem;
  transform: none;
  z-index: 2147483644;
  text-decoration: none;
  cursor: pointer;
}

.teams-plan-fixed.sofort-side-fixed:hover,
.teams-plan-fixed.sofort-side-fixed:focus-visible {
  transform: translateY(-2px);
  z-index: 2147483645;
  outline: none;
}

html[dir="rtl"] .teams-plan-fixed.sofort-side-fixed {
  left: 1.25rem;
  right: auto;
}

/* Scroll-to-top über dem Teams-Button */
body:has(.teams-plan-fixed) .scroll-to-top,
body:has(.teams-plan-fixed) .scroll-to-top--nav {
  bottom: 5.75rem !important;
}

html[dir="rtl"] body:has(.teams-plan-fixed) .scroll-to-top,
html[dir="rtl"] body:has(.teams-plan-fixed) .scroll-to-top--nav {
  left: 1.25rem !important;
  right: auto !important;
}

@media (max-width: 640px) {
  .teams-plan-fixed.sofort-side-fixed {
    right: 1rem;
    bottom: 1rem;
    --sofort-side-width: min(19.5rem, calc(100vw - 2rem));
    width: var(--sofort-side-width) !important;
    min-width: 0 !important;
    max-width: calc(100vw - 2rem) !important;
    font-size: 0.8rem !important;
    white-space: normal;
    line-height: 1.25;
    padding: 0.55rem 0.75rem;
  }

  html[dir="rtl"] .teams-plan-fixed.sofort-side-fixed {
    left: 1rem;
    right: auto;
  }

  body:has(.teams-plan-fixed) .scroll-to-top,
  body:has(.teams-plan-fixed) .scroll-to-top--nav {
    bottom: 6.5rem !important;
  }
}

/* Scroll to top — fix am Viewport, unten rechts; Farben wie BMH-Herzlogo */
body > #scroll-to-top.scroll-to-top,
#scroll-to-top.scroll-to-top {
  position: fixed !important;
  inset: auto 1.25rem 1.25rem auto !important;
  right: 1.25rem !important;
  bottom: 1.25rem !important;
  left: auto !important;
  top: auto !important;
  z-index: 2147483647 !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 0.55rem;
  min-height: 3rem;
  width: auto;
  max-width: calc(100vw - 2.5rem);
  padding: 0.65rem 1rem 0.65rem 1.15rem;
  margin: 0 !important;
  border: 1px solid var(--scroll-top-border, #c8a25e);
  border-radius: 9999px;
  background: var(--scroll-top-bg-solid, #26282c) !important;
  background-image: var(--scroll-top-bg) !important;
  color: var(--scroll-top-label-color, #d4b06a);
  font-size: 0.85rem;
  font-weight: 600;
  line-height: 1;
  letter-spacing: 0.02em;
  white-space: nowrap;
  cursor: pointer;
  box-shadow:
    0 8px 24px rgba(0, 0, 0, 0.45),
    inset 0 1px 0 rgba(232, 200, 120, 0.18);
  transition: transform 0.2s ease, border-color 0.2s ease, background 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;
  pointer-events: auto !important;
}

/* Über dem unteren Dock (Startseite) */
body:has(#fixed-bottom-dock) #scroll-to-top.scroll-to-top,
#scroll-to-top.scroll-to-top.scroll-to-top--above-dock {
  bottom: 5.75rem !important;
}

/* Über dem Teams-CTA unten rechts */
body:has(.teams-plan-fixed) #scroll-to-top.scroll-to-top {
  bottom: 5.75rem !important;
}

body:has(#fixed-bottom-dock):has(.teams-plan-fixed) #scroll-to-top.scroll-to-top {
  bottom: 9.5rem !important;
}

@media (max-width: 640px) {
  body > #scroll-to-top.scroll-to-top,
  #scroll-to-top.scroll-to-top {
    right: 1rem !important;
    bottom: 1rem !important;
    min-height: 2.75rem;
    padding: 0.55rem 0.85rem;
    font-size: 0.8rem;
  }

  body:has(#fixed-bottom-dock) #scroll-to-top.scroll-to-top,
  #scroll-to-top.scroll-to-top.scroll-to-top--above-dock {
    bottom: 7.25rem !important;
  }

  body:has(.teams-plan-fixed) #scroll-to-top.scroll-to-top {
    bottom: 6.5rem !important;
  }
}

html[dir="rtl"] #scroll-to-top.scroll-to-top {
  left: 1.25rem !important;
  right: auto !important;
}

.scroll-to-top-label {
  color: var(--scroll-top-label-color, #d4b06a);
  font-family: 'Inter', system-ui, sans-serif;
  transition: color 0.2s ease;
}

.scroll-to-top-icon {
  flex-shrink: 0;
  font-size: 0.95rem;
  color: inherit;
  stroke: currentColor;
}

#scroll-to-top.scroll-to-top:hover,
#scroll-to-top.scroll-to-top:focus-visible {
  transform: translateY(-2px);
  border-color: var(--scroll-top-hover-border, #e0c992);
  background: #2e2a22 !important;
  background-image: var(--scroll-top-hover-bg) !important;
  color: var(--scroll-top-hover-label, #f0d9a0);
  box-shadow:
    0 10px 28px rgba(0, 0, 0, 0.5),
    0 0 0 1px rgba(200, 162, 94, 0.25),
    inset 0 1px 0 rgba(240, 217, 160, 0.28);
  outline: none;
}

#scroll-to-top.scroll-to-top:hover .scroll-to-top-label,
#scroll-to-top.scroll-to-top:focus-visible .scroll-to-top-label {
  color: var(--scroll-top-hover-label, #f0d9a0);
}

/* Fixed bottom dock — Soforthilfe, never scrolls */
.fixed-bottom-dock {
  position: fixed !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  z-index: 2147483646 !important;
  pointer-events: none;
  transform: none !important;
}

/* Unterste Zeile (Dock mit Checkliste Trauerfall): alpha 0.5 — wie Navbar */
.sofort-bar {
  position: relative;
  pointer-events: auto;
  background-color: rgba(10, 11, 16, 0.5) !important;
  background: rgba(10, 11, 16, 0.5) !important;
  backdrop-filter: blur(14px) saturate(1.05);
  -webkit-backdrop-filter: blur(14px) saturate(1.05);
  border-top: 1px solid rgba(255, 60, 60, 0.35);
  padding: 0.85rem 1rem;
}

.sofort-bar-inner {
  width: 100%;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 1rem 1.5rem;
}

.hamburg-tag {
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-style: italic;
  font-size: clamp(1.25rem, 2.4vw, 1.75rem);
  font-weight: 500;
  color: var(--gold);
  letter-spacing: 0.03em;
  white-space: nowrap;
}

.navbar-center-strip .hamburg-tag {
  border-inline-start: 1px solid var(--border);
  padding-inline-start: 0.75rem;
}

.sofort-side-fixed {
  --sofort-side-width: 19.5rem;
  --sofort-side-min-height: 3.35rem;
  --sofort-side-stack-gap: 0.65rem;
  --side-peek: 0;
  position: fixed;
  left: 0;
  top: 50%;
  transform: translateY(-50%) translateX(calc(var(--side-peek) * -100%));
  z-index: 100;
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  box-sizing: border-box;
  border-radius: 0.75rem;
  text-align: center;
  white-space: nowrap;
  width: var(--sofort-side-width);
  min-width: var(--sofort-side-width);
  max-width: var(--sofort-side-width);
  min-height: var(--sofort-side-min-height);
  line-height: 1.3;
  transition: transform 0.65s cubic-bezier(0.22, 1, 0.36, 1);
}

.sofort-side-fixed.is-side-hidden {
  transition: none;
}

.sofort-side-fixed.is-side-revealing {
  transition: transform 0.65s cubic-bezier(0.22, 1, 0.36, 1);
}

.sofort-side-fixed.is-peeking {
  --side-peek: 0.5;
}

.sofort-side-fixed.is-peeking:hover,
.sofort-side-fixed.is-peeking:focus-visible {
  --side-peek: 0;
  z-index: 110;
}

.sofort-side-fixed--right {
  left: auto;
  right: 0;
  text-align: center;
  transform: translateY(-50%) translateX(calc(var(--side-peek) * 100%));
}

#trauerfall-digital {
  left: 0;
  right: auto;
  inset-inline-start: 0;
  inset-inline-end: auto;
  top: 50%;
  transform: translateY(-50%) translateX(calc(var(--side-peek) * -100%));
}

#soforthilfe-side .sofort-digital-only {
  display: none !important;
}

#soforthilfe-side {
  left: auto;
  right: 0;
  inset-inline-start: auto;
  inset-inline-end: 0;
  top: 50%;
  transform: translateY(-50%) translateX(calc(var(--side-peek) * 100%));
  cursor: pointer;
}

/* Side panels: full-bleed digital / phone backgrounds */
.sofort-side--digital,
.sofort-side--phone {
  overflow: hidden;
  isolation: isolate;
  gap: 0.55rem;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  color: #fff;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.55);
}

/* Schmale schwarze Textumrandung: „040 300 9 300 77“ + „24/7 erreichbar“ */
#soforthilfe-side.sofort-side--phone .sofort-side-label,
#angebot-beratung-phone.sofort-side--phone .sofort-side-label,
.sterbefall-soforthilfe-fixed.sofort-side--phone .sofort-side-label {
  -webkit-text-stroke: 0.45px #000;
  paint-order: stroke fill;
  text-shadow:
    0 0 0.5px #000,
    0 1px 2px rgba(0, 0, 0, 0.55);
}

.sofort-side-icon {
  position: relative;
  z-index: 1;
  display: block;
  flex-shrink: 0;
  width: 1.15em;
  height: 1.15em;
  min-width: 1.15em;
  min-height: 1.15em;
  font-size: 1.05em;
  line-height: 1;
  opacity: 1;
  color: #fff !important;
  fill: none;
  stroke: currentColor;
  filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.45));
  pointer-events: none;
}

/* Font-Awesome-Fallback, falls noch <i> verwendet wird */
i.sofort-side-icon {
  width: auto;
  height: auto;
  min-width: 0;
  min-height: 0;
  font-family: "Font Awesome 6 Free", "Font Awesome 6 Pro", FontAwesome, sans-serif !important;
  font-weight: 900 !important;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
}

.sofort-side-label {
  position: relative;
  z-index: 1;
  display: inline-flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 0.35rem;
  min-width: 0;
}

#trauerfall-digital.is-side-hidden {
  transform: translateY(-50%) translateX(-100%);
}

#soforthilfe-side.is-side-hidden {
  transform: translateY(-50%) translateX(100%);
}

@media (prefers-reduced-motion: reduce) {
  .sofort-side-fixed {
    transition: none;
  }

  #trauerfall-digital.is-side-hidden,
  #soforthilfe-side.is-side-hidden {
    transform: translateY(-50%) translateX(0);
  }
}

.dock-contact-link {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.875rem;
  white-space: nowrap;
  padding: 0.5rem 1rem;
  border-radius: 9999px;
}

.sofort-bar-link {
  text-decoration: none;
  text-align: center;
  white-space: nowrap;
  padding: 0.65rem 1.15rem;
  background-color: #fff;
  color: #000;
  border: 1px solid rgba(0, 0, 0, 0.12);
  border-radius: 0.75rem;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
  transition: border-color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease;
  animation: none;
}

.sofort-bar-link:hover {
  border-color: rgba(0, 0, 0, 0.25);
  background-color: #f7f7f7;
  color: #000;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.12);
}

.sofort-bar-static {
  cursor: default;
  text-decoration: none;
}

.sofort-bar-static:hover {
  cursor: default;
}

.sofort-side-fixed.sofort-bar-link {
  white-space: nowrap;
  overflow: visible;
  padding-inline: 1rem;
}

/* Full-button thematic backgrounds (cover entire surface) */
#trauerfall-digital.sofort-side--digital,
.teams-plan-fixed.sofort-side--digital {
  background-color: #0d2840;
  background-image:
    linear-gradient(
      105deg,
      rgba(8, 22, 36, 0.72) 0%,
      rgba(12, 36, 56, 0.55) 48%,
      rgba(8, 22, 36, 0.68) 100%
    ),
    url("../images/bg-side-digital.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  border-color: rgba(110, 200, 255, 0.45);
  color: #fff;
  box-shadow:
    0 2px 14px rgba(20, 90, 140, 0.35),
    inset 0 0 0 1px rgba(140, 220, 255, 0.12);
}

#trauerfall-digital.sofort-side--digital:hover,
#trauerfall-digital.sofort-side--digital:focus-visible,
.teams-plan-fixed.sofort-side--digital:hover,
.teams-plan-fixed.sofort-side--digital:focus-visible {
  background-color: #113450;
  background-image:
    linear-gradient(
      105deg,
      rgba(8, 22, 36, 0.58) 0%,
      rgba(12, 36, 56, 0.4) 48%,
      rgba(8, 22, 36, 0.55) 100%
    ),
    url("../images/bg-side-digital.svg");
  border-color: rgba(140, 220, 255, 0.65);
  color: #fff;
  box-shadow:
    0 4px 18px rgba(30, 120, 180, 0.45),
    inset 0 0 0 1px rgba(160, 230, 255, 0.2);
}

/* Telefonleiste „24/7 erreichbar“ + Nummer: Transparenz alpha 0.10 */
#soforthilfe-side.sofort-side--phone,
#angebot-beratung-phone.sofort-side--phone,
.sterbefall-soforthilfe-fixed.sofort-side--phone {
  background-color: rgba(13, 40, 64, 0.10);
  background-image:
    linear-gradient(
      105deg,
      rgba(8, 22, 36, 0.10) 0%,
      rgba(12, 36, 56, 0.10) 48%,
      rgba(8, 22, 36, 0.10) 100%
    ),
    url("../images/bg-side-digital.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  backdrop-filter: blur(8px) saturate(1.05);
  -webkit-backdrop-filter: blur(8px) saturate(1.05);
  border-color: rgba(110, 200, 255, 0.45);
  color: #fff;
  box-shadow:
    0 2px 14px rgba(20, 90, 140, 0.2),
    inset 0 0 0 1px rgba(140, 220, 255, 0.12);
}

#soforthilfe-side.sofort-side--phone:hover,
#soforthilfe-side.sofort-side--phone:focus-visible,
#angebot-beratung-phone.sofort-side--phone:hover,
#angebot-beratung-phone.sofort-side--phone:focus-visible,
.sterbefall-soforthilfe-fixed.sofort-side--phone:hover,
.sterbefall-soforthilfe-fixed.sofort-side--phone:focus-visible {
  background-color: rgba(17, 52, 80, 0.16);
  background-image:
    linear-gradient(
      105deg,
      rgba(8, 22, 36, 0.14) 0%,
      rgba(12, 36, 56, 0.12) 48%,
      rgba(8, 22, 36, 0.14) 100%
    ),
    url("../images/bg-side-digital.svg");
  border-color: rgba(140, 220, 255, 0.65);
  color: #fff;
  box-shadow:
    0 4px 18px rgba(30, 120, 180, 0.28),
    inset 0 0 0 1px rgba(160, 230, 255, 0.2);
}

#trauerfall-digital.sofort-side--digital.sofort-glow,
.teams-plan-fixed.sofort-side--digital.sofort-glow,
#soforthilfe-side.sofort-side--phone.sofort-glow,
#angebot-beratung-phone.sofort-side--phone.sofort-glow,
.sterbefall-soforthilfe-fixed.sofort-side--phone.sofort-glow {
  color: #fff;
}

#trauerfall-digital.sofort-side--digital .sofort-side-icon,
.teams-plan-fixed.sofort-side--digital .sofort-side-icon,
#soforthilfe-side.sofort-side--phone .sofort-side-icon,
#angebot-beratung-phone.sofort-side--phone .sofort-side-icon,
#angebot-beratung-phone.sofort-side--phone .fa-phone,
.sterbefall-soforthilfe-fixed.sofort-side--phone .sofort-side-icon,
.sterbefall-soforthilfe-fixed.sofort-side--phone .fa-phone {
  color: #fff;
}

@media (max-width: 900px) {
  .sofort-side-fixed {
    --sofort-side-max: calc(100vw - 1.5rem);
    width: min(var(--sofort-side-width), var(--sofort-side-max)) !important;
    min-width: 0 !important;
    max-width: var(--sofort-side-max) !important;
    font-size: 0.8rem !important;
    letter-spacing: 0.03em;
    padding: 0.55rem 0.65rem;
  }
}

#soforthilfe-side:focus-visible {
  outline: 2px solid rgba(197, 164, 110, 0.85);
  outline-offset: 2px;
}

.sofort-phone-copy,
.hero-phone-copy {
  /* Gesamte Nummer als eine Einheit (inkl. letzter „7“) markierbar */
  user-select: all;
  -webkit-user-select: all;
  -moz-user-select: all;
  cursor: pointer;
  white-space: nowrap;
  flex-shrink: 0;
}

/* 24h Soforthilfe — fixed bottom left on all main pages */
.sterbefall-soforthilfe-fixed {
  position: fixed;
  left: 1.25rem;
  bottom: 1.25rem;
  z-index: 2147483644;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  cursor: pointer;
}

body:has(#sterbefall-soforthilfe-phone) #soforthilfe-side {
  display: none !important;
}

body:has(#fixed-bottom-dock) #sterbefall-soforthilfe-phone {
  bottom: 5.75rem;
}

@media (max-width: 640px) {
  .sterbefall-soforthilfe-fixed {
    left: 1rem;
    bottom: 1rem;
    font-size: 0.8rem;
    gap: 0.4rem;
    padding: 0.6rem 0.9rem;
  }

  body:has(#fixed-bottom-dock) #sterbefall-soforthilfe-phone {
    bottom: 7rem;
  }
}

.sterbefall-soforthilfe-fixed:focus-visible {
  outline: 2px solid rgba(197, 164, 110, 0.85);
  outline-offset: 2px;
}

html[data-theme="light"] .sterbefall-soforthilfe-fixed {
  background-color: #000;
  color: #fff;
  border-color: rgba(255, 255, 255, 0.22);
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.28);
}

.hero-consultation-phone {
  cursor: pointer;
}

@media (min-width: 768px) {
  .sofort-bar {
    padding: 1.1rem 1.25rem;
  }

  .sofort-bar-link {
    padding: 0.75rem 1.35rem;
  }

  .sofort-side-fixed {
    --sofort-side-width: 23.25rem;
  }

  .sofort-side-fixed.sofort-bar-link {
    padding-inline: 1.15rem;
  }
}

@media (max-width: 1024px) {
  .dock-contact-link {
    font-size: 0.8rem;
    padding-left: 0.85rem !important;
    padding-right: 0.85rem !important;
  }
}

@media (max-width: 767px) {
  .sofort-side-fixed {
    --sofort-side-width: 19.5rem;
    --sofort-side-min-height: 3.1rem;
    font-size: 0.85rem !important;
    letter-spacing: 0.035em;
    padding: 0.6rem 0.75rem;
  }

  .dock-contact-link span {
    font-size: 0.72rem;
  }
}

@media (max-width: 480px) {
  .sofort-bar-link:not(.sofort-side-fixed) {
    white-space: normal;
  }

  body {
    padding-bottom: 130px;
  }

  body:has(#fixed-bottom-dock) {
    padding-bottom: 15rem;
  }
}



.logo-nav {
  width: 56px;
  height: auto;
  aspect-ratio: 960 / 833;
  object-fit: contain;
  display: block;
  flex-shrink: 0;
  opacity: 1;
  visibility: visible;
  image-rendering: -webkit-optimize-contrast;
}

.logo-shadow {
  /* soft depth + faint gold so Herzrand auf dunklem Grund klar lesbar bleibt */
  filter:
    drop-shadow(0 0 0.5px rgba(197, 164, 110, 0.55))
    drop-shadow(0 2px 10px rgba(0, 0, 0, 0.4));
}

/* Markenlogo (Hero / Auszeichnet): immer sichtbar */
img.logo-nav,
img[src*="logo.svg"],
img[src*="logo-nav.svg"],
img[src*="logo-hero.png"],
img[src*="logo-hero.webp"],
img[src*="logo-nav.png"],
img[src*="logo-nav.webp"],
img[src*="logo-md.png"],
img[src*="logo-md.webp"],
img[src*="logo.png"],
img[src*="logo.webp"],
.auszeichnet-visual-logo {
  opacity: 1 !important;
  visibility: visible !important;
  max-width: 100%;
  height: auto;
  object-fit: contain;
}

/* FA-Icons: keine font-family-Überschreibung (bricht sonst die Glyphs).
   CSP erlaubt Webfonts von cdnjs; zusätzlich nutzen wir SVG-Fallbacks. */
.fa-solid,
.fa-regular,
.fa-brands,
i[class*="fa-"] {
  display: inline-block;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  opacity: 1;
  visibility: visible;
}

/* SVG-UI-Icons siteweit */
.theme-toggle-icon,
.sofort-side-icon,
.scroll-to-top-icon,
.maps-logo,
.ui-icon,
.auszeichnet-item-svg {
  opacity: 1 !important;
  visibility: visible !important;
  display: block;
  flex-shrink: 0;
}

.ui-icon {
  color: inherit;
}

.scroll-to-top-icon.ui-icon,
i.scroll-to-top-icon {
  display: inline-block;
}

.maps-logo {
  font-size: 1.35rem;
  color: var(--gold);
  line-height: 1;
}

/* Kontakt-Header: ein Glasblock — Titel oben, Intro darunter */
.kontakt-section-header {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  width: fit-content;
  max-width: min(40rem, 100%);
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 2.5rem;
  padding: 1rem 1.5rem 1.15rem;
  border-radius: 0.9rem;
  background: rgba(10, 11, 16, 0.3);
  backdrop-filter: blur(8px) saturate(1.05);
  -webkit-backdrop-filter: blur(8px) saturate(1.05);
  border: 1px solid rgba(255, 255, 255, 0.1);
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.18);
}

.kontakt-section-title {
  display: block !important;
  width: 100% !important;
  max-width: 100%;
  margin: 0 !important;
  padding: 0 !important;
  background: none !important;
  border: none !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

.kontakt-section-intro {
  display: block;
  width: 100%;
  max-width: 100%;
  margin: 0.65rem 0 0;
  padding: 0;
  background: none;
  border: none;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  /* Schriftfarbe wie Öffnungszeiten (Mo–Fr) */
  color: #f5efe6 !important;
  font-weight: 500;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.35);
}

html[data-theme="light"] .kontakt-section-header {
  background: rgba(255, 252, 247, 0.3);
  border-color: rgba(255, 255, 255, 0.55);
  box-shadow: 0 4px 16px rgba(40, 32, 20, 0.1);
}

html[data-theme="light"] .kontakt-section-intro {
  color: #2a241c !important;
  text-shadow: none;
}

/* Adresse | Kundenparkplätze: gleiche Zeilenhöhen (Labels, Texte, Bilder) */
.kontakt-location-row {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2.5rem;
  align-items: stretch;
}

@media (min-width: 768px) {
  .kontakt-location-row {
    grid-template-columns: 1fr 1fr;
    gap: 2.5rem 3.5rem;
  }
}

.kontakt-location-block {
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  height: 100%;
  min-height: 0;
}

.kontakt-location-label {
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-size: clamp(1.65rem, 3.5vw, 2.25rem);
  font-weight: 600;
  color: var(--gold);
  letter-spacing: 0.03em;
  line-height: 1.2;
  margin-bottom: 1rem;
  text-align: center;
  display: inline-block;
  max-width: 100%;
  padding: 0.55rem 1.15rem;
  border-radius: 0.9rem;
  background: rgba(10, 11, 16, 0.3);
  backdrop-filter: blur(7px) saturate(1.05);
  -webkit-backdrop-filter: blur(7px) saturate(1.05);
  border: 1px solid rgba(255, 255, 255, 0.06);
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.12);
  flex-shrink: 0;
}

/* Textbereich füllt die Mitte → Karten/Bilder starten auf einer Linie */
.kontakt-location-body {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  width: 100%;
  min-height: 0;
  margin-bottom: 1rem;
}

.kontakt-location-address {
  justify-content: center;
  text-align: left;
  display: inline-flex;
  max-width: 100%;
  padding: 0.65rem 1.15rem;
  border-radius: 0.9rem;
  background: rgba(10, 11, 16, 0.3);
  backdrop-filter: blur(7px) saturate(1.05);
  -webkit-backdrop-filter: blur(7px) saturate(1.05);
  border: 1px solid rgba(255, 255, 255, 0.06);
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.12);
}

.kontakt-location-text {
  max-width: 36rem;
  margin-inline: auto;
  text-align: center;
  line-height: 1.55;
  padding: 0.65rem 1.15rem;
  border-radius: 0.9rem;
  background: rgba(10, 11, 16, 0.3);
  backdrop-filter: blur(7px) saturate(1.05);
  -webkit-backdrop-filter: blur(7px) saturate(1.05);
  border: 1px solid rgba(255, 255, 255, 0.06);
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.12);
}

/* Kontakt-Details unter den beiden Karten: Glas + hohe Lesbarkeit */
.kontakt-details {
  font-size: 1.05rem;
  line-height: 1.55;
}

/* Gleiche Transparenz/Glas wie .footer-tagline („Weil Abschied auch Liebe ist“) */
.kontakt-details > div {
  padding: 1.1rem 1.25rem;
  border-radius: 0.9rem;
  background: rgba(10, 11, 16, 0.3);
  backdrop-filter: blur(7px) saturate(1.05);
  -webkit-backdrop-filter: blur(7px) saturate(1.05);
  border: 1px solid rgba(255, 255, 255, 0.06);
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.12);
}

/* Überschriften: Büro & Beratung, E-Mail, Öffnungszeiten */
.kontakt-details > div > div:first-child {
  color: #e8d5a8 !important;
  font-size: 0.95rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.06em !important;
  margin-bottom: 0.45rem !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.45);
}

/* Werte: Telefon, E-Mail, Öffnungszeiten-Text */
.kontakt-details > div > a,
.kontakt-details > div > div:not(:first-child) {
  color: #f5efe6 !important;
  font-size: 1.05rem !important;
  font-weight: 500;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.35);
}

.kontakt-details > div > a:hover {
  color: #f0d9a0 !important;
}

.kontakt-details > div > p {
  color: #e0d2bc !important;
  font-size: 0.92rem !important;
  font-weight: 400;
  margin-top: 0.4rem !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
}

html[data-theme="light"] .kontakt-location-label,
html[data-theme="light"] .kontakt-location-address,
html[data-theme="light"] .kontakt-location-text {
  background: rgba(255, 252, 247, 0.3);
  border-color: rgba(255, 255, 255, 0.45);
  box-shadow: 0 4px 16px rgba(40, 32, 20, 0.08);
}

html[data-theme="light"] .kontakt-details > div {
  background: rgba(255, 252, 247, 0.3);
  border-color: rgba(255, 255, 255, 0.45);
  box-shadow: 0 4px 16px rgba(40, 32, 20, 0.08);
}

html[data-theme="light"] .kontakt-details > div > div:first-child {
  color: #8a6a38 !important;
  text-shadow: none;
}

html[data-theme="light"] .kontakt-details > div > a,
html[data-theme="light"] .kontakt-details > div > div:not(:first-child) {
  color: #2a241c !important;
  text-shadow: none;
}

html[data-theme="light"] .kontakt-details > div > a:hover {
  color: #9a7d4a !important;
}

html[data-theme="light"] .kontakt-details > div > p {
  color: #5c4f3c !important;
  text-shadow: none;
}

.kontakt-map,
.kontakt-parking-map {
  overflow: hidden;
  margin: 0;
  border-radius: 1rem;
  border: 1px solid #2a2c36;
  background: #14151c;
  aspect-ratio: 16 / 10;
  width: 100%;
  max-width: 100%;
  flex-shrink: 0;
  /* Am unteren Rand der Spalte → beide Medien auf gleicher Höhe */
  margin-top: auto;
}

.kontakt-map {
  position: relative;
}

.kontakt-map iframe {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
}

.kontakt-map-consent {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.85rem;
  padding: 1.25rem;
  text-align: center;
  background-color: #0a0b10;
  background-image:
    linear-gradient(180deg, rgba(10, 11, 16, 0.55), rgba(10, 11, 16, 0.82)),
    image-set(
      url('../images/sections/hero-atmosphere.webp') type('image/webp'),
      url('../images/sections/hero-atmosphere.jpg') type('image/jpeg')
    );
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}

html[data-theme="light"] .kontakt-map-consent {
  background-color: #f7f3ec;
  background-image:
    linear-gradient(180deg, rgba(247, 243, 236, 0.72), rgba(247, 243, 236, 0.9)),
    image-set(
      url('../images/sections/hero-atmosphere.webp') type('image/webp'),
      url('../images/sections/hero-atmosphere.jpg') type('image/jpeg')
    );
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}

.kontakt-map-consent[hidden] {
  display: none;
}

.kontakt-map-consent__text {
  margin: 0;
  max-width: 22rem;
  color: var(--text-secondary, #d1c7b8);
  font-size: 0.92rem;
  line-height: 1.45;
}

html[data-theme="light"] .kontakt-map-consent__text {
  color: #4a4034;
}

.kontakt-map-consent__btn,
.bmh-cookie-banner__btn {
  appearance: none;
  cursor: pointer;
  border-radius: 999px;
  font: inherit;
  font-weight: 600;
  font-size: 0.85rem;
  letter-spacing: 0.02em;
  padding: 0.65rem 1.1rem;
  -webkit-tap-highlight-color: transparent;
  border: 1px solid rgba(197, 164, 110, 0.7);
  background: transparent;
  color: var(--text-primary, #f1e9df);
}

.kontakt-map-consent__btn:focus-visible,
.bmh-cookie-banner__btn:focus-visible {
  outline: 2px solid #c5a46e;
  outline-offset: 2px;
}

.kontakt-map-consent__btn {
  border: 1px solid #c5a46e;
  background: linear-gradient(160deg, #c5a46e, #a8894a);
  color: #0a0b10;
}

.bmh-cookie-banner__btn--gold,
.bmh-cookie-banner__btn--ghost {
  border: 1px solid rgba(197, 164, 110, 0.7);
  background: transparent;
  color: var(--text-primary, #f1e9df);
}

html[data-theme="light"] .bmh-cookie-banner__btn {
  color: #3a3228;
  border-color: rgba(154, 125, 74, 0.55);
}

.bmh-cookie-backdrop {
  position: fixed;
  inset: 0;
  z-index: 2147483646;
  background: rgba(6, 7, 10, 0.55);
}

html.bmh-cookie-open,
html.bmh-cookie-open body {
  overflow: hidden;
}

.bmh-cookie-backdrop[hidden],
.bmh-cookie-banner[hidden] {
  display: none !important;
}

.bmh-cookie-banner {
  position: fixed;
  left: 50%;
  top: 50%;
  right: auto;
  bottom: auto;
  transform: translate(-50%, -50%);
  z-index: 2147483647 !important;
  width: min(28.5rem, calc(100vw - 2rem));
  max-width: calc(100vw - 2rem);
  margin: 0;
  padding: 1.25rem 1.35rem 1.15rem;
  border-radius: 1.1rem;
  border: 1px solid rgba(197, 164, 110, 0.45);
  background: rgba(14, 15, 20, 0.98);
  box-shadow: 0 18px 50px rgba(0, 0, 0, 0.5);
  color: var(--text-secondary, #d1c7b8);
}

html[data-theme="light"] .bmh-cookie-banner {
  background: rgba(255, 252, 247, 0.98);
  color: #3a3228;
  border-color: rgba(154, 125, 74, 0.4);
}

body.m-body .bmh-cookie-backdrop {
  display: block;
}

body.m-body .bmh-cookie-banner {
  top: auto;
  left: 0.75rem;
  right: 0.75rem;
  width: auto;
  max-width: none;
  transform: none;
  bottom: calc(var(--m-dock-h, 4.5rem) + env(safe-area-inset-bottom, 0px) + 0.55rem);
}

.bmh-cookie-banner__title {
  margin: 0 0 0.35rem;
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: 1.15rem;
  font-weight: 600;
  color: #c5a46e;
}

.bmh-cookie-banner__text {
  margin: 0 0 0.85rem;
  font-size: 0.82rem;
  line-height: 1.45;
}

.bmh-cookie-banner__link {
  color: #c5a46e;
  text-underline-offset: 2px;
}

.bmh-cookie-banner__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  justify-content: stretch;
}
.bmh-cookie-banner__actions .bmh-cookie-banner__btn {
  flex: 1 1 8rem;
}
.bmh-cookie-banner__panel {
  margin: 0 0 0.85rem;
  padding: 0.75rem 0.85rem;
  border: 1px solid rgba(197, 164, 110, 0.28);
  border-radius: 0.85rem;
}
.bmh-cookie-banner__settings-title {
  margin: 0 0 0.5rem;
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--gold, #c5a46e);
}
.bmh-cookie-banner__check {
  display: flex;
  align-items: flex-start;
  gap: 0.55rem;
  margin: 0 0 0.7rem;
  font-size: 0.84rem;
  line-height: 1.4;
  cursor: pointer;
}
.bmh-cookie-banner__check input {
  margin-top: 0.15rem;
  accent-color: var(--gold, #c5a46e);
}

@media (max-width: 640px) {
  .bmh-cookie-banner__actions {
    flex-direction: column;
  }
  .bmh-cookie-banner__btn {
    width: 100%;
  }
}

.kontakt-parking-map img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.hero-brand {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: min(380px, 88vw);
  margin-top: 0.2rem;
  overflow: visible;
}

header {
  overflow: visible;
}

.logo-hero {
  width: 100%;
  height: auto;
  aspect-ratio: 960 / 833;
  object-fit: contain;
  /* high-res master is downscaled in CSS → crisp on retina */
  image-rendering: auto;
}

/* Hero-Herz: knapper Schatten, kein matschiger Halo um den Goldrand */
.logo-hero.logo-shadow {
  filter:
    drop-shadow(0 0 0.4px rgba(197, 164, 110, 0.5))
    drop-shadow(0 3px 12px rgba(0, 0, 0, 0.28));
}

.hero-brand picture {
  display: block;
  width: 100%;
}

@media (min-width: 768px) {
  .hero-brand {
    width: min(460px, 50vw);
  }
}

.hero-with-photo {
  overflow: hidden;
  /* Hintergrundfoto kommt site-weit über body::before — im Hero kein zweites Bild */
  background: transparent;
}

/* Legacy-Markup: Hero-Foto ausblenden, da global gesetzt */
.hero-photo-bg {
  display: none !important;
}

.hero-photo-overlay {
  display: none !important;
}

.hero-layout {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  min-height: calc(100dvh - 5rem);
  text-align: center;
  padding: clamp(0rem, 1.5vh, 0.75rem) 1.5rem 6rem;
}

/* Bestattungen (Kosten): Karten minimal unscharf hinterlegt */
.leistungen-card {
  display: flex;
  flex-direction: column;
  height: 100%;
  padding: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.leistungen-card-photo {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 10;
  overflow: hidden;
  background: var(--icon-tile-bg, #1f212b);
  border-radius: 1.5rem 1.5rem 0 0;
}

.leistungen-card-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
  transition: transform 0.45s ease;
}

.leistungen-card:hover .leistungen-card-photo img {
  transform: scale(1.04);
}

.leistungen-card-body {
  display: flex;
  flex-direction: column;
  flex: 1;
  padding: 1.5rem 1.35rem !important;
  border-radius: 0 0 1.5rem 1.5rem;
  background: rgba(10, 11, 16, 0.3);
  backdrop-filter: blur(7px) saturate(1.05);
  -webkit-backdrop-filter: blur(7px) saturate(1.05);
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-top: none;
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.12);
}

html[data-theme="light"] .leistungen-card-body {
  background: rgba(255, 252, 247, 0.3);
  border-color: rgba(255, 255, 255, 0.45);
  box-shadow: 0 4px 16px rgba(40, 32, 20, 0.08);
}

.leistungen-card-body .konfigurator-btn {
  margin-top: auto;
}

/* Abschnittstitel „Bestattungen (Kosten)“ — leicht transparent (Glas) */
#leistungen .leistungen-title,
.leistungen-title,
#leistungen h2.leistungen-title,
#leistungen > .text-center > h2,
h2.leistungen-title {
  display: inline-block !important;
  width: fit-content !important;
  max-width: 100%;
  margin-left: auto !important;
  margin-right: auto !important;
  padding: 0.7rem 1.4rem !important;
  border-radius: 0.9rem !important;
  background: rgba(10, 11, 16, 0.3) !important;
  background-color: rgba(10, 11, 16, 0.3) !important;
  backdrop-filter: blur(7px) saturate(1.05) !important;
  -webkit-backdrop-filter: blur(7px) saturate(1.05) !important;
  border: 1px solid rgba(255, 255, 255, 0.06) !important;
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.12) !important;
}

html[data-theme="light"] #leistungen .leistungen-title,
html[data-theme="light"] .leistungen-title,
html[data-theme="light"] #leistungen h2.leistungen-title,
html[data-theme="light"] #leistungen > .text-center > h2,
html[data-theme="light"] h2.leistungen-title {
  background: rgba(255, 252, 247, 0.3) !important;
  background-color: rgba(255, 252, 247, 0.3) !important;
  border-color: rgba(255, 255, 255, 0.45) !important;
  box-shadow: 0 4px 16px rgba(40, 32, 20, 0.08) !important;
}

/* Abschnittstitel „Wie wir Sie begleiten“ — minimal transparent (Glas) */
#ablauf [data-i18n="ablauf.title"],
#ablauf .text-center > h2 {
  display: inline-block !important;
  width: fit-content !important;
  max-width: 100%;
  margin-left: auto !important;
  margin-right: auto !important;
  padding: 0.7rem 1.4rem !important;
  border-radius: 0.9rem !important;
  background: rgba(10, 11, 16, 0.3) !important;
  background-color: rgba(10, 11, 16, 0.3) !important;
  backdrop-filter: blur(7px) saturate(1.05) !important;
  -webkit-backdrop-filter: blur(7px) saturate(1.05) !important;
  border: 1px solid rgba(255, 255, 255, 0.06) !important;
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.12) !important;
}

html[data-theme="light"] #ablauf [data-i18n="ablauf.title"],
html[data-theme="light"] #ablauf .text-center > h2 {
  background: rgba(255, 252, 247, 0.3) !important;
  background-color: rgba(255, 252, 247, 0.3) !important;
  border-color: rgba(255, 255, 255, 0.45) !important;
  box-shadow: 0 4px 16px rgba(40, 32, 20, 0.08) !important;
}

/* Ablauf-Karten: Beschreibungen unter den Fotos minimal unscharf hinterlegt */
.ablauf-card {
  background: transparent !important;
  box-shadow: none !important;
  border: none !important;
  display: flex;
  flex-direction: column;
  height: 100%;
}

/* Textbereich: gleicher Glas-Hintergrund & gleiche Höhe bei allen Schritten (01–04) */
.ablauf-card > div:not(.ablauf-card-photo) {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  padding: 1.5rem 1.35rem !important;
  margin: 0;
  border-radius: 0 0 1.5rem 1.5rem;
  background: rgba(10, 11, 16, 0.3) !important;
  background-color: rgba(10, 11, 16, 0.3) !important;
  backdrop-filter: blur(7px) saturate(1.05);
  -webkit-backdrop-filter: blur(7px) saturate(1.05);
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-top: none;
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.12);
}

html[data-theme="light"] .ablauf-card > div:not(.ablauf-card-photo) {
  background: rgba(255, 252, 247, 0.3) !important;
  background-color: rgba(255, 252, 247, 0.3) !important;
  border-color: rgba(255, 255, 255, 0.45);
  box-shadow: 0 4px 16px rgba(40, 32, 20, 0.08);
}

.ablauf-card-photo {
  width: 100%;
  aspect-ratio: 16 / 10;
  overflow: hidden;
  background: #f3ebe0;
  border-radius: 1.5rem 1.5rem 0 0;
}

.ablauf-card-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
  /* Warme, einladende Darstellung — wenig Dämpfung, leichter Soft-Look */
  filter: saturate(1.05) brightness(1.03) contrast(0.98);
  transition: transform 0.5s ease, filter 0.4s ease;
}

.ablauf-card:hover .ablauf-card-photo img {
  transform: scale(1.04);
  filter: saturate(1.08) brightness(1.05) contrast(0.98);
}

html[data-theme="light"] .ablauf-card-photo img {
  filter: saturate(1.06) brightness(1.04) contrast(0.99);
}

@media (min-width: 768px) {
  .hero-brand {
    margin-top: 0.35rem;
  }
}

.logo-section {
  width: min(520px, 92vw);
  height: auto;
}

.team-title-row {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: clamp(0.85rem, 3vw, 2rem);
  flex-wrap: nowrap;
  margin: 0 auto 0.75rem;
  width: fit-content;
  max-width: 100%;
  padding: 0.65rem 1.25rem;
  border-radius: 0.9rem;
  /* Titelzeile — minimal transparent (Glas) */
  background: rgba(10, 11, 16, 0.3);
  backdrop-filter: blur(7px) saturate(1.05);
  -webkit-backdrop-filter: blur(7px) saturate(1.05);
  border: 1px solid rgba(255, 255, 255, 0.06);
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.12);
}

.team-title-word {
  line-height: 1;
}

#unser-team .team-header-logo {
  width: clamp(6.5rem, 22vw, 11rem);
  max-width: none;
  margin: 0;
  display: block;
  flex-shrink: 0;
}

html[data-theme="light"] .team-title-row {
  background: rgba(255, 252, 247, 0.3);
  border-color: rgba(255, 255, 255, 0.45);
  box-shadow: 0 4px 16px rgba(40, 32, 20, 0.08);
}

#unser-team .team-intro {
  font-size: clamp(1.125rem, 2.4vw, 1.375rem);
  line-height: 1.75;
  max-width: 42rem;
  margin: 0 auto;
  padding: 0.65rem 1.15rem;
  border-radius: 0.9rem;
  background: rgba(10, 11, 16, 0.3);
  backdrop-filter: blur(7px) saturate(1.05);
  -webkit-backdrop-filter: blur(7px) saturate(1.05);
  border: 1px solid rgba(255, 255, 255, 0.06);
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.12);
}

html[data-theme="light"] #unser-team .team-intro {
  background: rgba(255, 252, 247, 0.3);
  border-color: rgba(255, 255, 255, 0.45);
  box-shadow: 0 4px 16px rgba(40, 32, 20, 0.08);
}

/* Team-Karussell: eine ruhige Bühne statt mehrerer Glasflächen */
#unser-team > .team-stage,
#unser-team > .card-dark.team-stage {
  position: relative;
  background: rgba(10, 11, 16, 0.22) !important;
  backdrop-filter: blur(10px) saturate(1.05);
  -webkit-backdrop-filter: blur(10px) saturate(1.05);
  border: 1px solid rgba(197, 164, 110, 0.18);
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.18);
  overflow: visible;
  padding: 1.25rem 1.25rem 1.7rem;
}

#unser-team > .card-dark.team-stage:hover {
  border-color: rgba(197, 164, 110, 0.28);
  transform: none;
}

#unser-team .team-carousel {
  overflow: visible;
}

html[data-theme="light"] #unser-team > .card-dark.team-stage {
  background: rgba(255, 252, 247, 0.28) !important;
  border-color: rgba(197, 164, 110, 0.28);
  box-shadow: 0 6px 20px rgba(40, 32, 20, 0.1);
}

html[data-theme="light"] .team-member-card {
  background: transparent;
  border-color: transparent;
  box-shadow: none;
}

.team-carousel {
  position: relative;
  margin-top: 0;
  padding: 0 3.5rem;
  border-top: none;
  outline: none;
  cursor: grab;
  touch-action: pan-y;
  user-select: none;
}

.team-carousel.is-dragging {
  cursor: grabbing;
}

.team-carousel:focus-visible {
  box-shadow: 0 0 0 2px #0a0b10, 0 0 0 4px rgba(197, 164, 110, 0.55);
  border-radius: 1rem;
}

.team-carousel-viewport {
  perspective: 1200px;
  height: 28rem;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: visible;
}

@media (min-width: 768px) {
  .team-carousel-viewport {
    height: 34rem;
  }
}

.team-carousel-track {
  position: relative;
  width: 0;
  height: 0;
  transform-style: preserve-3d;
}

.team-carousel-item {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 16.25rem;
  margin-left: -8.125rem;
  /* Portrait vertikal mittig im Viewport halten */
  margin-top: -8.35rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.55rem;
  transform-style: preserve-3d;
  will-change: transform, opacity;
  overflow: visible;
  /* backface-visibility: hidden clippt den Titel über den Fotos — weglassen */
}

.team-carousel-badge {
  margin: 0;
  font-size: 0.6rem;
  letter-spacing: 0.12em;
  font-weight: 600;
  color: #c5a46e;
  text-transform: uppercase;
  text-align: center;
  white-space: nowrap;
  /* Titel über den Mitarbeiterfotos — immer sichtbar */
  display: block;
  position: relative;
  z-index: 2;
  flex-shrink: 0;
  max-width: 11rem;
  overflow: visible;
  padding: 0.4rem 0.7rem;
  border-radius: 9999px;
  background: rgba(10, 11, 16, 0.3);
  backdrop-filter: blur(8px) saturate(1.05);
  -webkit-backdrop-filter: blur(8px) saturate(1.05);
  border: 1px solid rgba(255, 255, 255, 0.12);
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.2);
  /* 3D-Karussell: Text lesbar halten */
  transform: translateZ(1px);
  backface-visibility: visible;
}

html[data-theme="light"] .team-carousel-badge {
  background: rgba(255, 252, 247, 0.3);
  border-color: rgba(255, 255, 255, 0.55);
  box-shadow: 0 4px 12px rgba(40, 32, 20, 0.1);
}

.team-carousel-item .team-member-card {
  position: relative;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  overflow: visible;
  background: transparent;
  border: none;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  padding: 0;
}

.team-carousel-item .team-member-portrait {
  width: 12.75rem;
  height: 12.75rem;
  cursor: grab;
  touch-action: none;
}

@media (min-width: 768px) {
  .team-carousel-item {
    width: 17.5rem;
    margin-left: -8.75rem;
    margin-top: -9.15rem;
  }

  .team-carousel-item .team-member-portrait {
    width: 14.5rem;
    height: 14.5rem;
    border-width: 2.5px;
  }
}

.team-carousel-item .team-member-portrait-visual img {
  -webkit-user-drag: none;
  user-select: none;
  pointer-events: none;
}

.team-carousel.is-dragging .team-member-portrait {
  cursor: grabbing;
}

.team-carousel.is-dragging .team-member-caption {
  opacity: 0 !important;
  visibility: hidden !important;
}

.team-carousel-item.is-front .team-carousel-badge {
  opacity: 1;
  background: rgba(10, 11, 16, 0.3);
  border-color: rgba(197, 164, 110, 0.4);
  color: #d4b88a;
}

.team-carousel-item.is-front .team-member-portrait {
  border-color: rgba(212, 184, 138, 0.95);
  box-shadow: 0 16px 36px rgba(0, 0, 0, 0.4), 0 0 0 4px rgba(197, 164, 110, 0.18);
}

@media (hover: hover) and (pointer: fine) {
  .team-carousel-item.is-front .team-member-caption {
    opacity: 1;
    visibility: visible;
    transform: translateX(-50%) translateY(0);
  }
}

.team-carousel-nav {
  display: none;
  position: absolute;
  top: 46%;
  z-index: 8;
  width: 2.85rem;
  height: 2.85rem;
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
  border: 1px solid rgba(197, 164, 110, 0.5);
  background: rgba(10, 11, 16, 0.62);
  color: #ead7b0;
  cursor: pointer;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.28);
  transition: border-color 0.2s ease, background 0.2s ease, color 0.2s ease, transform 0.2s ease;
}

.team-carousel-nav--prev {
  left: 0.35rem;
}

.team-carousel-nav--next {
  right: 0.35rem;
}

.team-carousel-nav:hover,
.team-carousel-nav:focus-visible {
  border-color: #e0c992;
  background: rgba(10, 11, 16, 0.86);
  color: #fff8ea;
  outline: none;
}

.team-carousel-nav:active {
  transform: scale(0.96);
}

@media (min-width: 768px) {
  .team-carousel-nav {
    display: flex;
  }
}

html[data-theme="light"] .team-carousel-nav {
  background: rgba(255, 252, 247, 0.82);
  border-color: rgba(154, 125, 74, 0.45);
  color: #7a6234;
}

html[data-theme="light"] .team-carousel-nav:hover,
html[data-theme="light"] .team-carousel-nav:focus-visible {
  background: rgba(255, 252, 247, 0.96);
  color: #1a140c;
}

.team-carousel-hint {
  display: none;
  margin: 0.15rem auto 0;
  max-width: 28rem;
  text-align: center;
  font-size: 0.82rem;
  line-height: 1.45;
  color: #cbb48a;
}

@media (min-width: 768px) {
  .team-carousel-hint {
    display: block;
  }
}

html[data-theme="light"] .team-carousel-hint {
  color: #8a6c3c;
}

.team-ki-hint {
  position: absolute;
  right: 0.85rem;
  bottom: 0.4rem;
  margin: 0;
  font-size: 0.65rem;
  font-weight: 400;
  letter-spacing: 0.03em;
  line-height: 1.2;
  color: #c5a46e;
  opacity: 0.88;
  pointer-events: none;
  z-index: 3;
  white-space: nowrap;
}

html[data-theme="light"] .team-carousel-item.is-front .team-carousel-badge {
  background: rgba(255, 252, 247, 0.3);
  border-color: rgba(197, 164, 110, 0.45);
  color: #9a7d4a;
}

.logo-footer {
  width: clamp(7.5rem, 20vw, 12rem);
  height: auto;
  flex-shrink: 0;
}

/* Logo + Tagline zentriert in der Footer-Zeile */
.footer-brand-row {
  width: 100%;
  justify-content: center;
  text-align: center;
}

/* Mehr Abstand zwischen Tagline-Zeile und Datenschutz/AGB/Impressum */
.footer-brand-legal-gap {
  margin-top: 5.5rem !important;
  margin-bottom: 5.5rem !important;
}

#footer-legal.footer-bottom {
  margin-top: 1rem;
  padding-top: 1rem;
}

.footer-bottom {
  position: relative;
  z-index: 1;
  width: 100%;
}

/* Sentinel vor der Rechtszeile */
.footer-scroll-gate {
  height: 0;
  width: 100%;
  margin: 0;
  padding: 0;
  pointer-events: none;
  overflow: hidden;
}

.footer-legal-slot {
  overflow: visible;
}

html.footer-scroll-waiting,
html.footer-scroll-waiting body {
  overscroll-behavior-y: none;
}

.footer-bottom__impressum {
  position: static;
  margin-left: auto;
  text-align: right;
}

.footer-legal-link {
  position: static;
  color: inherit;
  text-decoration: none;
}

/* Legacy: altes fixiertes Impressum */
#impressum-link,
.fixed-bottom-dock__impressum {
  display: none !important;
}

.footer-tagline {
  color: #a88f5f;
  font-size: clamp(1.15rem, 2.2vw, 1.5rem);
  font-weight: 600;
  letter-spacing: 0.02em;
  line-height: 1.3;
  display: inline-block;
  max-width: 100%;
  padding: 0.55rem 1.1rem;
  border-radius: 0.9rem;
  background: rgba(10, 11, 16, 0.3);
  backdrop-filter: blur(7px) saturate(1.05);
  -webkit-backdrop-filter: blur(7px) saturate(1.05);
  border: 1px solid rgba(255, 255, 255, 0.06);
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.12);
}

/* Footer: Adresse + Telefon — minimal transparent (Glas) */
.footer-contact {
  padding: 0.55rem 1.1rem;
  border-radius: 0.9rem;
  background: rgba(10, 11, 16, 0.3);
  backdrop-filter: blur(7px) saturate(1.05);
  -webkit-backdrop-filter: blur(7px) saturate(1.05);
  border: 1px solid rgba(255, 255, 255, 0.06);
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.12);
}

html[data-theme="light"] .footer-tagline,
html[data-theme="light"] .footer-contact {
  background: rgba(255, 252, 247, 0.3);
  border-color: rgba(255, 255, 255, 0.45);
  box-shadow: 0 4px 16px rgba(40, 32, 20, 0.08);
}

.logo-contact {
  width: 180px;
  height: auto;
}

.hero-tagline {
  font-size: clamp(2rem, 5vw, 3.2rem);
  line-height: 1.15;
  letter-spacing: -0.5px;
}

.hero-below-logo {
  margin-top: 0.75rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
}

.bmh-title {
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-size: clamp(2.5rem, 6vw, 3.5rem);
  font-weight: 600;
  letter-spacing: 0.35em;
  padding-left: 0.35em;
  width: 100%;
  text-align: center;
  color: var(--gold);
  margin-top: -1.1rem;
  margin-bottom: 0;
  text-shadow:
    0 1px 2px rgba(0, 0, 0, 0.35),
    0 4px 18px rgba(0, 0, 0, 0.28);
}

.hero-tagline-script {
  color: var(--gold);
  font-size: clamp(1.45rem, 3.8vw, 1.9rem);
  margin-bottom: 1.25rem;
  letter-spacing: 0.02em;
}

@media (min-width: 768px) {
  .bmh-title {
    margin-top: -1.35rem;
  }

  .hero-tagline-script {
    margin-bottom: 1.5rem;
  }
}

.nav-bmh {
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-size: 1.5rem;
  font-weight: 600;
  color: var(--gold);
  letter-spacing: 0.28em;
  line-height: 1;
}

@media (min-width: 640px) {
  .nav-bmh {
    font-size: 1.85rem;
  }
}

@media (min-width: 768px) {
  .nav-bmh {
    font-size: 2.25rem;
  }
}

.nav-contact-link {
  color: var(--gold);
  border: 1px solid var(--gold);
  text-decoration: none;
}

.nav-contact-link:hover {
  background-color: var(--gold);
  color: var(--bg-deep);
}

.hero-welcome {
  font-family: 'Cormorant Garamond', Georgia, serif;
  /* eine Stufe größer */
  font-size: clamp(1.4rem, 3.1vw, 1.7rem);
  font-weight: 700;
  color: #f1e9df;
  text-align: center;
  margin: 0 0 0.65rem;
  letter-spacing: 0.01em;
  line-height: 1.4;
  max-width: min(40rem, 94vw);
  text-shadow:
    0 1px 2px rgba(0, 0, 0, 0.45),
    0 3px 14px rgba(0, 0, 0, 0.35);
}

/* Ortszeile über dem Herz-Logo — dezent, lesbar */
.hero-seo-label {
  margin: 0 0 0.15rem;
  font-size: 0.8rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #c5a46e;
  text-align: center;
  text-shadow: none;
}

html[data-theme="light"] .hero-seo-label {
  color: #8a6a38;
  text-shadow: none;
}

.hero-help-panel {
  display: block;
  width: fit-content;
  max-width: min(980px, 96vw);
  margin: 0 auto 0.45rem;
  padding: 0.15rem 0.35rem 0.2rem;
  border-radius: 0;
  background: none;
  background-color: transparent;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  border: none;
  box-shadow: none;
  text-align: center;
}

.hero-help-question {
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-size: 25px;
  font-weight: 700;
  color: #f8f3ea;
  text-align: center;
  margin: 0;
  letter-spacing: 0.02em;
  line-height: 1.3;
  width: auto;
  max-width: none;
  padding: 0;
  background: none;
  border: none;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  -webkit-text-stroke: 0.65px #c5a46e;
  paint-order: stroke fill;
  text-shadow: none;
}

/* Gleiche Schriftart und -größe wie die Hero-Überschrift */
.hero-help-sub {
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-size: 25px;
  font-weight: 700;
  color: #f8f3ea;
  text-align: center;
  margin: 0.35rem 0 0;
  letter-spacing: 0.02em;
  line-height: 1.3;
  width: auto;
  max-width: none;
  padding: 0;
  background: none;
  border: none;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  -webkit-text-stroke: 0.65px #c5a46e;
  paint-order: stroke fill;
  text-shadow: none;
}

.hero-consultation-phone {
  display: block;
  width: fit-content;
  max-width: min(980px, 96vw);
  margin: 0 auto 0.3rem;
  padding: 0.55rem 1.2rem 0.25rem;
  /* Gesamte Zeile: gleiche Serif wie Hero-Frage (gilt für Nummer + „immer erreichbar“) */
  font-family: 'Cormorant Garamond', Georgia, 'Times New Roman', serif !important;
  font-size: clamp(1.75rem, 4.2vw, 2.25rem);
  font-weight: 700;
  font-variant-numeric: lining-nums;
  color: #fff;
  text-align: center;
  letter-spacing: 0.02em;
  line-height: 1.4;
  position: static;
  border-radius: 0;
  /* Desktop: keine Fläche — Hintergrundbild bleibt sichtbar */
  background: none;
  background-color: transparent;
  background-image: none;
  border: none;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  -webkit-text-stroke: 0;
  paint-order: stroke fill;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.35);
}

html[data-theme="light"] .hero-welcome {
  color: #2a241c;
  text-shadow:
    0 1px 0 rgba(255, 255, 255, 0.7),
    0 2px 10px rgba(248, 245, 239, 0.85);
}

html[data-theme="light"] .hero-help-panel {
  background: none;
  background-color: transparent;
  border: none;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

html[data-theme="light"] .hero-help-question,
html[data-theme="light"] .hero-help-sub {
  color: #1a1612;
  background: none;
  border: none;
  box-shadow: none;
  -webkit-text-stroke: 0.65px #c5a46e;
  paint-order: stroke fill;
  text-shadow: none;
}

html[data-theme="light"] .hero-consultation-phone {
  color: #1a1612;
  background: none;
  background-color: transparent;
  background-image: none;
  border: none;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  -webkit-text-stroke: 0;
  text-shadow: 0 1px 2px rgba(255, 255, 255, 0.45);
}

html[data-theme="light"] .bmh-title {
  text-shadow:
    0 1px 0 rgba(255, 255, 255, 0.55),
    0 2px 12px rgba(197, 164, 110, 0.35);
}

/* Nummer + „immer erreichbar“: erben die gleiche Schrift vom Parent */
.hero-consultation-phone .hero-phone-copy,
.hero-consultation-phone .hero-phone-availability,
.hero-consultation-phone span,
.hero-consultation-phone a {
  font-family: inherit !important;
  font-size: inherit !important;
  font-weight: inherit !important;
  font-style: inherit !important;
  letter-spacing: inherit !important;
  font-variant-numeric: inherit !important;
  color: #fff !important;
  -webkit-text-stroke: 0 !important;
  paint-order: stroke fill;
  text-shadow: none;
}

.hero-consultation-phone .hero-phone-availability {
  margin-inline-start: 0.35em;
}

.hero-consultation-phone .hero-phone-copy {
  margin-inline-end: 0;
  user-select: all;
  -webkit-user-select: all;
  -moz-user-select: all;
  cursor: text;
  white-space: nowrap;
  text-decoration: none;
  color: #fff;
}

/* Smartphone: Nummer als Anruf-Link (ein Tipp → Wählfeld) */
@media (hover: none) and (pointer: coarse) {
  .hero-consultation-phone .hero-phone-copy,
  .sofort-phone-copy {
    user-select: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    cursor: pointer;
    touch-action: manipulation;
  }

  a.hero-phone-copy,
  a.site-tel-link,
  a[href^="tel:"] {
    -webkit-touch-callout: default;
    -webkit-tap-highlight-color: rgba(197, 164, 110, 0.28);
  }
}

.hero-consultation-phone .hero-phone-copy:hover {
  color: #fff;
}

html[data-theme="light"] .hero-consultation-phone .hero-phone-copy,
html[data-theme="light"] .hero-consultation-phone .hero-phone-availability,
html[data-theme="light"] .hero-consultation-phone span,
html[data-theme="light"] .hero-consultation-phone a {
  color: #1a1612 !important;
  -webkit-text-stroke: 0 !important;
  paint-order: stroke fill;
  text-shadow: none;
}

html[data-theme="light"] .hero-consultation-phone .hero-phone-copy:hover {
  color: #1a1612 !important;
}

/* Was BMH auszeichnet — einheitliche Glasfelder, klar geordnet */
.auszeichnet-section {
  --auszeichnet-glass-bg: rgba(10, 11, 16, 0.3);
  --auszeichnet-title-bg: rgba(10, 11, 16, 0.3);
  --auszeichnet-glass-border: rgba(255, 255, 255, 0.1);
  --auszeichnet-glass-shadow: 0 4px 16px rgba(0, 0, 0, 0.14);
  --auszeichnet-glass-blur: blur(8px) saturate(1.05);
}

.auszeichnet-brand {
  display: block;
  width: fit-content;
  max-width: 100%;
  margin: 0 auto 1.75rem;
  padding: 0;
  border: 0;
  border-radius: 0;
  text-align: center;
  font-size: clamp(1.85rem, 4.2vw, 2.85rem);
  font-weight: 600;
  letter-spacing: 0.02em;
  line-height: 1.15;
  color: #000;
  background: none;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  -webkit-text-stroke: 1.15px #c5a46e;
  text-stroke: 1.15px #c5a46e;
  paint-order: stroke fill;
}

.hero-below-logo .auszeichnet-brand {
  margin-top: 1.1rem;
  margin-bottom: 0;
  font-size: clamp(1.55rem, 3.4vw, 2.25rem);
}

.hero-below-logo .auszeichnet-tagline {
  margin: 0.35rem 0 0;
  font-size: clamp(1.05rem, 2.2vw, 1.45rem);
  font-weight: 600;
  font-style: italic;
  color: var(--gold);
  letter-spacing: 0.03em;
  text-align: center;
  border: 0;
  box-shadow: none;
  -webkit-text-stroke: 0;
  text-stroke: 0;
  text-shadow: none;
  paint-order: fill;
}

/* Gerader, sichtbarer Bindestrich — Cormorant-Glyphe steht schräg */
.auszeichnet-brand .brand-hyphen {
  display: inline-block;
  width: 0.48em;
  height: 0.12em;
  margin: 0 0.1em 0.08em;
  vertical-align: 0.22em;
  background: #c5a46e;
  box-shadow: 0 0 0 1px #000;
  overflow: hidden;
  color: transparent;
  -webkit-text-stroke: 0;
  text-stroke: 0;
  line-height: 0;
}

.home-teasers {
  max-width: 72rem;
  margin: 0 auto;
  padding: 1.25rem 1.5rem 2.5rem;
}

.home-teaser-grid {
  display: grid;
  gap: 1.1rem;
  grid-template-columns: 1fr;
}

@media (min-width: 700px) {
  .home-teaser-grid {
    grid-template-columns: 1fr 1fr;
  }
}

.home-teaser {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  text-decoration: none;
  color: inherit;
  min-height: 100%;
  transition: transform 0.25s ease, border-color 0.25s ease, background-color 0.25s ease;
}

.home-teaser.card-dark {
  background-color: rgba(10, 11, 16, 0.32);
  backdrop-filter: blur(8px) saturate(1.05);
  -webkit-backdrop-filter: blur(8px) saturate(1.05);
  border-color: rgba(255, 255, 255, 0.1);
}

.home-teaser:hover {
  transform: translateY(-2px);
}

.home-teaser--wide {
  grid-column: 1 / -1;
}

.home-teaser img {
  display: block;
  width: 100%;
  height: 10.5rem;
  object-fit: cover;
}

.home-teaser--logo {
  overflow: hidden;
}

.home-teaser--logo picture {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 10.5rem;
  background: transparent;
}

.home-teaser--logo img {
  width: auto;
  height: 8.6rem;
  object-fit: contain;
}

.home-teaser-body {
  padding: 1.25rem 1.4rem 1.45rem;
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
  flex: 1;
}

.home-teaser-title {
  margin: 0;
  font-size: 1.55rem;
  font-weight: 600;
  color: #f1e9df;
}

.home-teaser-lead {
  margin: 0;
  color: #b8a78a;
  line-height: 1.5;
  flex: 1;
}

.home-teaser-cta,
.home-teaser [data-i18n="ratgeber.teaser_cta"],
.home-teaser [data-i18n="home.teaser_cta"] {
  color: #0d2840;
  font-size: 0.85rem;
  font-weight: 600;
  letter-spacing: 0.04em;
}

html[data-theme="light"] .home-teaser-cta,
html[data-theme="light"] .home-teaser [data-i18n="ratgeber.teaser_cta"] {
  color: #0d2840;
}

html[data-theme="light"] .home-teaser-title {
  color: #2a241c;
}

html[data-theme="light"] .home-teaser-lead {
  color: #5c5348;
}

html[data-theme="light"] .home-teaser.card-dark {
  background-color: rgba(255, 252, 247, 0.38);
  border-color: rgba(40, 32, 20, 0.12);
}

html[data-theme="light"] .auszeichnet-section {
  --auszeichnet-glass-bg: rgba(255, 252, 247, 0.3);
  --auszeichnet-title-bg: rgba(255, 252, 247, 0.3);
  --auszeichnet-glass-border: rgba(255, 255, 255, 0.55);
  --auszeichnet-glass-shadow: 0 4px 14px rgba(40, 32, 20, 0.1);
}

.auszeichnet-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.75rem;
  align-items: stretch;
}

@media (min-width: 900px) {
  .auszeichnet-grid {
    grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);
    gap: 2rem;
    align-items: start;
  }
}

/* Linke Visual-Karte */
.auszeichnet-visual {
  min-height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 2rem 1.75rem !important;
  border-radius: 1.25rem !important;
  background: var(--auszeichnet-glass-bg) !important;
  backdrop-filter: var(--auszeichnet-glass-blur);
  -webkit-backdrop-filter: var(--auszeichnet-glass-blur);
  border: 1px solid var(--auszeichnet-glass-border) !important;
  box-shadow: var(--auszeichnet-glass-shadow) !important;
}

.auszeichnet-visual-logo {
  width: clamp(8rem, 28vw, 12.5rem);
  height: auto;
}

/* „Für Hamburg & Umgebung“ — Gold, nie Schwarz */
.auszeichnet-visual-tagline {
  color: var(--gold, #c5a46e) !important;
  font-size: 0.875rem;
  font-weight: 600;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  text-shadow: none;
}

html[data-theme="light"] .auszeichnet-visual-tagline {
  color: #8a6a38 !important;
}

/* Rechte Spalte: Titel + Liste */
.auszeichnet-content {
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
  min-width: 0;
}

/* Überschrift als eigenes Glasfeld */
#auszeichnet h2[data-i18n="auszeichnet.title"],
.auszeichnet-content > h2.heading-serif {
  display: block;
  width: fit-content;
  max-width: 100%;
  margin: 0 0 0.35rem;
  padding: 0.6rem 1.15rem;
  border-radius: 0.9rem;
  background: var(--auszeichnet-title-bg);
  backdrop-filter: var(--auszeichnet-glass-blur);
  -webkit-backdrop-filter: var(--auszeichnet-glass-blur);
  border: 1px solid var(--auszeichnet-glass-border);
  box-shadow: var(--auszeichnet-glass-shadow);
}

/* Jeder Punkt = ein gemeinsames Glasfeld (Icon + Text) */
.auszeichnet-item {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 0.9rem 1.1rem;
  align-items: start;
  margin: 0;
  padding: 1rem 1.1rem;
  border: 1px solid var(--auszeichnet-glass-border);
  border-radius: 1rem;
  background: var(--auszeichnet-glass-bg);
  backdrop-filter: var(--auszeichnet-glass-blur);
  -webkit-backdrop-filter: var(--auszeichnet-glass-blur);
  box-shadow: var(--auszeichnet-glass-shadow);
}

.auszeichnet-item:last-child {
  margin-bottom: 0;
}

/* Keine doppelten Glasflächen innerhalb der Karte */
.auszeichnet-item > div:not(.auszeichnet-item-icon) {
  padding: 0;
  border: none;
  border-radius: 0;
  background: transparent;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  box-shadow: none;
  min-width: 0;
}

.auszeichnet-item-icon {
  width: 2.65rem;
  height: 2.65rem;
  border-radius: 0.8rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(197, 164, 110, 0.14);
  border: 1px solid rgba(197, 164, 110, 0.28);
  box-shadow: none;
  color: var(--gold);
  font-size: 1.05rem;
  flex-shrink: 0;
  margin-top: 0.1rem;
}

.auszeichnet-item-svg,
.auszeichnet-item-icon svg {
  display: block;
  width: 1.35rem;
  height: 1.35rem;
  color: inherit;
  flex-shrink: 0;
}

.ui-icon--info,
.ui-icon--art {
  display: block;
  color: var(--gold);
  flex-shrink: 0;
}

.auszeichnet-item-title {
  font-size: 1.12rem;
  font-weight: 600;
  color: var(--text-primary);
  margin: 0 0 0.4rem;
  line-height: 1.3;
}

.auszeichnet-item-text {
  margin: 0;
  /* gleiche Farbe wie Öffnungszeiten-Werte (Mo–Fr …) */
  color: #f5efe6;
  line-height: 1.65;
  font-size: 0.95rem;
}

/* Fließtext-Beschreibungen auf Karten-Ebene (Auszeichnet, Ablauf, Leistungen) */
#ablauf .ablauf-card p,
#leistungen .leistungen-card-body > p,
#leistungen .leistungen-features,
#auszeichnet [data-i18n="auszeichnet.visual_desc"] {
  color: #f5efe6 !important;
}

html[data-theme="light"] .auszeichnet-item-text,
html[data-theme="light"] #ablauf .ablauf-card p,
html[data-theme="light"] #leistungen .leistungen-card-body > p,
html[data-theme="light"] #leistungen .leistungen-features,
html[data-theme="light"] #auszeichnet [data-i18n="auszeichnet.visual_desc"] {
  color: #2a241c !important;
}

html[data-theme="light"] .auszeichnet-item-icon {
  background: rgba(154, 125, 74, 0.12);
  border-color: rgba(154, 125, 74, 0.28);
}

/* Leistungen-Untertitel: minimal unscharf hinterlegt, schwarze Schrift */
.leistungen-subtitle {
  padding: 0.65rem 1.15rem;
  border-radius: 0.9rem;
  background: rgba(10, 11, 16, 0.3);
  backdrop-filter: blur(7px) saturate(1.05);
  -webkit-backdrop-filter: blur(7px) saturate(1.05);
  border: 1px solid rgba(255, 255, 255, 0.06);
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.12);
  color: #000 !important;
}

html[data-theme="light"] .leistungen-subtitle {
  background: rgba(255, 252, 247, 0.3);
  border-color: rgba(255, 255, 255, 0.45);
  box-shadow: 0 4px 16px rgba(40, 32, 20, 0.08);
  color: #000 !important;
}

.hero-options {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.65rem;
  width: 100%;
  max-width: min(980px, 96vw);
  margin-top: 0;
}

.hero-option,
a.hero-option,
.hero-options > a.hero-option {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 4.5rem;
  padding: 0.85rem 1rem;
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 1rem;
  /* Leicht transparent (Glas) — wie .leistungen-subtitle */
  background: rgba(10, 11, 16, 0.3);
  background-color: rgba(10, 11, 16, 0.3);
  color: var(--hero-option-color);
  font-size: clamp(0.9rem, 1.85vw, 1.1rem);
  font-weight: 500;
  text-align: center;
  text-decoration: none;
  white-space: nowrap;
  transition: border-color 0.25s ease, color 0.25s ease, transform 0.25s ease, box-shadow 0.25s ease, background-color 0.25s ease;
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.12);
  backdrop-filter: blur(7px) saturate(1.05);
  -webkit-backdrop-filter: blur(7px) saturate(1.05);
}

@media (min-width: 640px) {
  .hero-option {
    padding: 0.95rem 1.15rem;
  }
}

.hero-option:hover {
  border-color: rgba(197, 164, 110, 0.45);
  color: var(--gold);
  transform: translateY(-2px);
  background: rgba(10, 11, 16, 0.3);
  background-color: rgba(10, 11, 16, 0.3);
  box-shadow:
    0 8px 24px rgba(0, 0, 0, 0.2),
    0 0 0 1px rgba(197, 164, 110, 0.2);
}

.hero-option-wide {
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.4em;
  white-space: normal;
}

.hero-option-wide > span:first-child {
  white-space: nowrap;
  transition: color 0.25s ease;
}

.hero-option-wide:hover > span:first-child {
  color: var(--gold);
}

.hero-option-sub {
  display: none;
  font-size: 0.85em;
  font-weight: 400;
  letter-spacing: 0.01em;
  line-height: inherit;
}

.hero-option-wide .hero-option-sub {
  display: inline;
  white-space: nowrap;
}

/* Untere Zeile bleibt beim Hover unverändert */
.hero-option-wide:hover .hero-option-sub {
  color: var(--gold);
}

/* Candle — fixed top right */
.candle-scene {
  position: fixed;
  top: 5.25rem;
  right: 1.25rem;
  transform: scale(0.55);
  transform-origin: top right;
  z-index: 100;
  pointer-events: none;
  opacity: 0.88;
}

.candle-unit {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.candle {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  z-index: 2;
}

.candle-reflect-surface {
  width: 120px;
  height: 3px;
  margin-top: 2px;
  background: linear-gradient(90deg, transparent, rgba(200, 190, 170, 0.25), rgba(255, 220, 160, 0.35), rgba(200, 190, 170, 0.25), transparent);
  border-radius: 50%;
  filter: blur(0.5px);
}

.candle-reflect {
  position: relative;
  width: 120px;
  height: 130px;
  margin-top: -1px;
  overflow: hidden;
  -webkit-mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.55) 0%, transparent 88%);
  mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.55) 0%, transparent 88%);
}

.candle-reflect-flip {
  transform: scaleY(-1);
  opacity: 0.45;
  filter: blur(1.2px);
  margin-top: -6px;
}

.candle-glow--reflect {
  opacity: 0.5;
}

.candle-flame--reflect {
  opacity: 0.5 !important;
}

.candle-body-reflect {
  width: 38px;
  height: 70px;
  margin: 8px auto 0;
  background: linear-gradient(180deg, rgba(200, 184, 152, 0.18) 0%, transparent 100%);
  border-radius: 3px;
  transform: scaleY(-1);
  filter: blur(1px);
}

.candle-flame-wrap {
  position: relative;
  width: 48px;
  height: 72px;
  transform-origin: 50% 88%;
  animation: windSway 3.8s ease-in-out infinite;
}

.candle-glow {
  position: absolute;
  bottom: 4px;
  left: 50%;
  width: 90px;
  height: 90px;
  margin-left: -45px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255, 168, 72, 0.22) 0%, rgba(255, 120, 40, 0.08) 45%, transparent 70%);
  animation: glowPulse 2.6s ease-in-out infinite;
}

.candle-flame {
  position: absolute;
  bottom: 6px;
  left: 50%;
  transform-origin: 50% 92%;
  border-radius: 50% 50% 50% 50% / 60% 60% 40% 40%;
}

.candle-flame-outer {
  width: 26px;
  height: 52px;
  margin-left: -13px;
  background: linear-gradient(to top, #e85a20 0%, #f5a030 45%, #ffe08a 85%, transparent 100%);
  opacity: 0.75;
  filter: blur(1px);
  animation: flameFlickerOuter 1.4s ease-in-out infinite;
}

.candle-flame-mid {
  width: 18px;
  height: 40px;
  margin-left: -9px;
  background: linear-gradient(to top, #ff7020 0%, #ffc040 55%, #fff0a0 100%);
  opacity: 0.9;
  animation: flameFlickerMid 1.1s ease-in-out infinite;
}

.candle-flame-inner {
  width: 10px;
  height: 24px;
  margin-left: -5px;
  background: linear-gradient(to top, #fff8c8 0%, #fffde8 100%);
  opacity: 0.95;
  animation: flameFlickerInner 0.85s ease-in-out infinite;
}

.candle-wick {
  width: 3px;
  height: 10px;
  background: linear-gradient(to bottom, #1a1a1a, #3a3028);
  border-radius: 1px;
  margin-top: -2px;
}

.candle-body {
  width: 38px;
  height: 110px;
  background: linear-gradient(90deg, #c8b898 0%, #e8dcc0 35%, #d4c4a4 65%, #b0a080 100%);
  border-radius: 3px 3px 6px 6px;
  box-shadow:
    inset -4px 0 8px rgba(0, 0, 0, 0.15),
    inset 4px 0 6px rgba(255, 255, 255, 0.08),
    0 4px 16px rgba(0, 0, 0, 0.35);
}

.candle-base {
  width: 52px;
  height: 8px;
  margin-top: -1px;
  background: linear-gradient(90deg, #8a7a60, #b8a888, #8a7a60);
  border-radius: 2px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

@keyframes windSway {
  0%, 100% {
    transform: rotate(-4deg) translateX(-2px);
  }
  25% {
    transform: rotate(5deg) translateX(3px) skewX(-3deg);
  }
  50% {
    transform: rotate(-2deg) translateX(-4px) skewX(2deg);
  }
  75% {
    transform: rotate(6deg) translateX(2px) skewX(-4deg);
  }
}

@keyframes flameFlickerOuter {
  0%, 100% {
    transform: scale(1, 1) rotate(0deg);
    opacity: 0.72;
  }
  30% {
    transform: scale(0.92, 1.08) rotate(-6deg);
    opacity: 0.85;
  }
  60% {
    transform: scale(1.06, 0.94) rotate(5deg);
    opacity: 0.65;
  }
  80% {
    transform: scale(0.96, 1.05) rotate(-3deg);
    opacity: 0.78;
  }
}

@keyframes flameFlickerMid {
  0%, 100% {
    transform: scale(1, 1) rotate(0deg) translateX(0);
    opacity: 0.88;
  }
  20% {
    transform: scale(1.05, 0.92) rotate(4deg) translateX(2px);
    opacity: 0.95;
  }
  45% {
    transform: scale(0.9, 1.1) rotate(-7deg) translateX(-3px);
    opacity: 0.8;
  }
  70% {
    transform: scale(1.08, 0.88) rotate(6deg) translateX(1px);
    opacity: 0.92;
  }
}

@keyframes flameFlickerInner {
  0%, 100% {
    transform: scale(1, 1) rotate(0deg);
    opacity: 0.92;
  }
  35% {
    transform: scale(0.88, 1.12) rotate(-5deg);
    opacity: 1;
  }
  55% {
    transform: scale(1.1, 0.9) rotate(4deg);
    opacity: 0.85;
  }
  85% {
    transform: scale(0.95, 1.06) rotate(-2deg);
    opacity: 0.98;
  }
}

@keyframes glowPulse {
  0%, 100% {
    opacity: 0.7;
    transform: scale(1);
  }
  50% {
    opacity: 1;
    transform: scale(1.08);
  }
}

@media (max-width: 1024px) {
  .candle-scene {
    top: 5rem;
    right: 0.75rem;
    transform: scale(0.45);
    opacity: 0.6;
  }

}

@media (max-width: 768px) {
  .candle-scene {
    top: 4.5rem;
    right: 0.5rem;
    transform: scale(0.38);
    opacity: 0.5;
  }
}

/* Termin calendar — Institut */
.termin-toggle-btn,
.checkliste-toggle-btn,
.angebot-toggle-btn {
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
  color: inherit;
  transition: opacity 0.2s ease;
}

.termin-toggle-btn:hover .termin-toggle-hint,
.checkliste-toggle-btn:hover .checkliste-toggle-hint,
.angebot-toggle-btn:hover .angebot-toggle-hint {
  color: #c5a46e;
}

/* Chevron-SVG drehen statt FA class-swap */
.faq-item button.is-open > svg.ui-icon,
svg.ui-icon.is-open {
  transform: rotate(180deg);
}

svg.ui-icon {
  transition: transform 0.3s ease;
}

.termin-toggle-btn[aria-expanded="true"] #termin-toggle-icon,
.checkliste-toggle-btn[aria-expanded="true"] #checkliste-toggle-icon,
.angebot-toggle-btn[aria-expanded="true"] #angebot-toggle-icon,
.sterbefall-toggle-btn[aria-expanded="true"] #sterbefall-toggle-icon {
  transform: rotate(180deg);
}

.termin-panel,
.checkliste-panel,
.angebot-panel {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.4s ease-out;
}

.termin-page,
.angebot-page,
.vorsorge-page,
.sterbefall-page,
.konfig-page {
  background-color: var(--bg-deep);
}

.termin-panel--standalone,
.angebot-panel--standalone {
  max-height: none !important;
  overflow: visible;
}

#termin-form {
  padding-bottom: 0.25rem;
}

#termin-submit {
  position: relative;
  z-index: 2;
}

.termin-calendar-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 1.25rem;
}

.termin-week-label {
  font-weight: 600;
  color: var(--text-primary);
  font-size: 1.125rem;
  text-align: center;
}

.termin-nav-btn {
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 9999px;
  border: 1px solid var(--border);
  background: var(--bg-elevated);
  color: var(--gold);
  cursor: pointer;
  transition: all 0.2s ease;
}

.termin-nav-btn:hover {
  border-color: var(--gold);
  background-color: rgba(197, 164, 110, 0.1);
}

.termin-days {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 0.4rem;
  margin-bottom: 1.5rem;
}

.termin-day {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 0.65rem 0.25rem;
  border-radius: 0.75rem;
  border: 1px solid var(--border);
  background: var(--bg-elevated);
  cursor: pointer;
  transition: all 0.2s ease;
  min-width: 0;
}

.termin-day:hover:not(:disabled):not(.termin-day--past) {
  border-color: var(--gold);
}

.termin-day--selected {
  border-color: var(--gold);
  background-color: rgba(197, 164, 110, 0.12);
}

.termin-day--past {
  opacity: 0.35;
  cursor: not-allowed;
}

.termin-day-name {
  font-size: 0.75rem;
  color: var(--text-subtle);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.termin-day-num {
  font-size: 1.25rem;
  font-weight: 600;
  color: var(--text-primary);
  margin-top: 0.15rem;
}

.termin-day-month {
  font-size: 0.75rem;
  color: var(--text-muted);
  margin-top: 0.1rem;
}

.termin-times {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(5.5rem, 1fr));
  gap: 0.45rem;
}

.termin-times-section--24h .termin-times {
  max-height: 15rem;
  overflow-y: auto;
  padding-right: 0.35rem;
  scrollbar-width: thin;
  scrollbar-color: rgba(197, 164, 110, 0.45) transparent;
}

.termin-time {
  padding: 0.55rem 0.4rem;
  border-radius: 0.6rem;
  border: 1px solid var(--border);
  background: var(--bg-elevated);
  color: var(--text-secondary);
  font-size: 1rem;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s ease;
  text-align: center;
}

.termin-time:hover:not(:disabled) {
  border-color: var(--gold);
  color: var(--gold);
}

.termin-time--selected {
  border-color: var(--gold);
  background-color: rgba(197, 164, 110, 0.15);
  color: var(--gold);
}

.termin-time:disabled {
  opacity: 0.3;
  cursor: not-allowed;
}

.termin-time--booked:disabled {
  opacity: 0.55;
  border-color: rgba(197, 164, 110, 0.35);
  color: var(--gold-dark);
  text-decoration: line-through;
  text-decoration-color: rgba(197, 164, 110, 0.55);
}

.termin-summary {
  padding: 0.85rem 1rem;
  border-radius: 0.75rem;
  background: rgba(197, 164, 110, 0.08);
  border: 1px solid rgba(197, 164, 110, 0.25);
  color: var(--text-secondary);
  font-size: 1rem;
}

/* Höflicher Hinweis: Tab-Inaktivitäts-Timeout */
.form-timeout-hint {
  margin: 0.65rem 0 0;
  font-size: 0.8rem;
  line-height: 1.45;
  color: var(--gold-dark, #a88f5f);
}

.form-timeout-hint--inline {
  margin: 0 0 1.1rem;
}

/* Tab-Inaktivität: Datenschutz-Timeout der Formulare */
.form-timeout-notice,
.termin-timeout-notice {
  display: flex;
  align-items: flex-start;
  gap: 0.85rem;
  padding: 1rem 1.1rem;
  border-radius: 1rem;
  background: rgba(197, 164, 110, 0.1);
  border: 1px solid rgba(197, 164, 110, 0.4);
  color: var(--text-secondary);
}

.form-timeout-notice.hidden,
.termin-timeout-notice.hidden {
  display: none;
}

.form-timeout-notice__icon,
.termin-timeout-notice__icon {
  flex-shrink: 0;
  width: 2.25rem;
  height: 2.25rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: rgba(197, 164, 110, 0.18);
  color: var(--gold, #c5a46e);
  font-size: 1rem;
}

.form-timeout-notice__body,
.termin-timeout-notice__body {
  flex: 1;
  min-width: 0;
}

.form-timeout-notice__message,
.termin-timeout-notice__message {
  margin: 0 0 0.75rem;
  font-size: 0.925rem;
  line-height: 1.45;
  color: var(--text-primary, #f1e9df);
}

.form-timeout-notice__btn,
.termin-timeout-notice__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.55rem 1rem;
  border-radius: 0.75rem;
  border: 1px solid rgba(197, 164, 110, 0.45);
  background: rgba(197, 164, 110, 0.16);
  color: var(--gold, #c5a46e);
  font-size: 0.85rem;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.15s ease, border-color 0.15s ease;
}

.form-timeout-notice__btn:hover,
.form-timeout-notice__btn:focus-visible,
.termin-timeout-notice__btn:hover,
.termin-timeout-notice__btn:focus-visible {
  background: rgba(197, 164, 110, 0.28);
  border-color: rgba(197, 164, 110, 0.7);
  outline: none;
}

html[data-theme="light"] .form-timeout-notice,
html[data-theme="light"] .termin-timeout-notice {
  background: rgba(180, 140, 60, 0.08);
  border-color: rgba(160, 120, 50, 0.35);
}

html[data-theme="light"] .form-timeout-notice__message,
html[data-theme="light"] .termin-timeout-notice__message {
  color: #3a3228;
}

html[data-theme="light"] .form-timeout-hint {
  color: #6b5a42;
}

.angebot-intro-field .form-timeout-hint,
html[data-theme="light"] .angebot-intro-field .form-timeout-hint {
  color: #000;
}

/* Angebot: Titel / Eyebrow als eigene Glasfelder */
#angebot .angebot-toggle-btn [data-i18n="angebot.title"],
.angebot-page main > .text-center > [data-i18n="angebot.page.eyebrow"],
.angebot-page main > .text-center > [data-i18n="angebot.title"] {
  display: block;
  width: fit-content;
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding: 0.55rem 1.1rem;
  border-radius: 0.9rem;
  background: rgba(10, 11, 16, 0.3);
  backdrop-filter: blur(8px) saturate(1.05);
  -webkit-backdrop-filter: blur(8px) saturate(1.05);
  border: 1px solid rgba(255, 255, 255, 0.1);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.16);
}

/* Intro + Pflicht + Timeout: ein gemeinsames Feld (Angebot + Konfigurator) */
#angebot .angebot-toggle-btn .angebot-intro-field,
.angebot-page main > .text-center > .angebot-intro-field,
.konfig-page .konfig-page-intro > .angebot-intro-field {
  display: block;
  width: fit-content;
  max-width: min(42rem, 100%);
  margin-left: auto;
  margin-right: auto;
  padding: 0.85rem 1.15rem;
  border-radius: 0.9rem;
  background: rgba(10, 11, 16, 0.3);
  backdrop-filter: blur(8px) saturate(1.05);
  -webkit-backdrop-filter: blur(8px) saturate(1.05);
  border: 1px solid rgba(255, 255, 255, 0.1);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.16);
  text-align: center;
}

.angebot-intro-field__text {
  margin: 0;
  color: #000;
  line-height: 1.5;
}

.angebot-intro-field__text + .angebot-intro-field__text {
  margin-top: 0.65rem;
}

.angebot-intro-field__text--sm {
  font-size: 0.875rem;
}

/* form-timeout-hint innerhalb des gemeinsamen Feldes: kein Extra-Abstand/kein eigener Kasten */
.angebot-intro-field .form-timeout-hint {
  margin: 0;
}

.angebot-intro-field .form-timeout-hint + .form-timeout-hint,
.angebot-intro-field__text + .angebot-intro-field__text.form-timeout-hint {
  margin-top: 0.65rem;
}

html[data-theme="light"] #angebot .angebot-toggle-btn [data-i18n="angebot.title"],
html[data-theme="light"] .angebot-page main > .text-center > [data-i18n="angebot.page.eyebrow"],
html[data-theme="light"] .angebot-page main > .text-center > [data-i18n="angebot.title"],
html[data-theme="light"] #angebot .angebot-toggle-btn .angebot-intro-field,
html[data-theme="light"] .angebot-page main > .text-center > .angebot-intro-field,
html[data-theme="light"] .konfig-page .konfig-page-intro > .angebot-intro-field {
  background: rgba(255, 252, 247, 0.3);
  border-color: rgba(255, 255, 255, 0.55);
  box-shadow: 0 4px 14px rgba(40, 32, 20, 0.1);
}

html[data-theme="light"] .angebot-intro-field__text {
  color: #000;
}

/* Termin (Beratung im Institut): Titel + Kalender minimal transparent (Glas) */
.termin-page main > .text-center > [data-i18n="termin.page.eyebrow"],
.termin-page main > .text-center > #termin-title,
.termin-page main > .text-center > #termin-subtitle {
  display: block;
  width: fit-content;
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding: 0.55rem 1.1rem;
  border-radius: 0.9rem;
  background: rgba(10, 11, 16, 0.3);
  backdrop-filter: blur(8px) saturate(1.05);
  -webkit-backdrop-filter: blur(8px) saturate(1.05);
  border: 1px solid rgba(255, 255, 255, 0.1);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.16);
}

.termin-page main > .text-center > #termin-subtitle {
  padding: 0.55rem 1rem;
}

html[data-theme="light"] .termin-page main > .text-center > [data-i18n="termin.page.eyebrow"],
html[data-theme="light"] .termin-page main > .text-center > #termin-title,
html[data-theme="light"] .termin-page main > .text-center > #termin-subtitle {
  background: rgba(255, 252, 247, 0.3);
  border-color: rgba(255, 255, 255, 0.55);
  box-shadow: 0 4px 14px rgba(40, 32, 20, 0.1);
}

.termin-page #termin-panel > .card-dark {
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.termin-page #termin-panel > .card-dark:hover {
  border-color: transparent !important;
  transform: none;
}

.termin-page .termin-calendar {
  padding: 1.35rem 1.35rem 1.5rem;
  border-radius: 1.25rem;
  background: rgba(10, 11, 16, 0.3) !important;
  backdrop-filter: blur(8px) saturate(1.05);
  -webkit-backdrop-filter: blur(8px) saturate(1.05);
  border: 1px solid rgba(255, 255, 255, 0.1);
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.16);
}

@media (min-width: 768px) {
  .termin-page .termin-calendar {
    padding: 1.6rem 1.75rem 1.75rem;
  }
}

.termin-page .termin-calendar .termin-nav-btn,
.termin-page .termin-calendar .termin-day,
.termin-page .termin-calendar .termin-time {
  background: rgba(10, 11, 16, 0.3);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  border-color: rgba(255, 255, 255, 0.06);
}

.termin-page .termin-calendar .termin-day--selected,
.termin-page .termin-calendar .termin-time--selected {
  background: rgba(197, 164, 110, 0.14);
  border-color: rgba(197, 164, 110, 0.45);
}

.termin-page #termin-form {
  margin-top: 1.5rem;
  padding: 1.35rem 1.35rem 1.5rem;
  border-radius: 1.25rem;
  border-top: none !important;
  background: rgba(10, 11, 16, 0.3) !important;
  backdrop-filter: blur(8px) saturate(1.05);
  -webkit-backdrop-filter: blur(8px) saturate(1.05);
  border: 1px solid rgba(255, 255, 255, 0.1);
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.16);
}

@media (min-width: 768px) {
  .termin-page #termin-form {
    padding: 1.6rem 1.75rem 1.75rem;
  }
}

html[data-theme="light"] .termin-page .termin-calendar,
html[data-theme="light"] .termin-page #termin-form {
  background: rgba(255, 252, 247, 0.3) !important;
  border-color: rgba(255, 255, 255, 0.55);
  box-shadow: 0 4px 16px rgba(40, 32, 20, 0.1);
}

html[data-theme="light"] .termin-page .termin-calendar .termin-nav-btn,
html[data-theme="light"] .termin-page .termin-calendar .termin-day,
html[data-theme="light"] .termin-page .termin-calendar .termin-time {
  background: rgba(255, 252, 247, 0.3);
  border-color: rgba(217, 207, 192, 0.65);
}

@media (max-width: 520px) {
  .termin-days {
    grid-template-columns: repeat(4, 1fr);
  }
}

/* Bestattungsfragebogen */
.fragebogen-section {
  display: flex;
  flex-direction: column;
  min-width: 0;
  border: none;
  padding: 0;
  margin: 0;
}

/* Angebot zusenden lassen: Abschnitte 1–6 minimal transparent (Glas) */
#angebot-form.card-dark {
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* One section per page (Wizard) */
#angebot-form.angebot-form--wizard {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

#angebot-form.angebot-form--wizard .fragebogen-section[hidden],
#angebot-form.angebot-form--wizard .angebot-wizard-captcha[hidden],
#angebot-form.angebot-form--wizard #angebot-submit[hidden] {
  display: none !important;
}

#angebot-form.angebot-form--wizard .fragebogen-section.is-angebot-step-active {
  display: flex;
}

/* Fortschritt: immer rechts am Viewport (viewport-fixed, nicht im Formularfluss) */
.angebot-wizard-progress,
body .angebot-wizard-progress,
#konfig-form .angebot-wizard-progress,
#angebot-form .angebot-wizard-progress {
  position: fixed !important;
  top: 50% !important;
  right: calc(0.7rem + env(safe-area-inset-right, 0px)) !important;
  left: auto !important;
  bottom: auto !important;
  transform: translateY(-50%) !important;
  inset-inline-start: auto !important;
  inset-inline-end: calc(0.7rem + env(safe-area-inset-right, 0px)) !important;
  z-index: 200 !important;
  display: none;
  flex-direction: column;
  align-items: center;
  gap: 0.75rem;
  margin: 0 !important;
  padding: 1rem 0.75rem 0.9rem;
  width: auto;
  min-width: 4.1rem;
  max-width: min(5.5rem, calc(100vw - 1rem));
  border-radius: 1.25rem;
  background: rgba(10, 11, 16, 0.5);
  backdrop-filter: blur(14px) saturate(1.1);
  -webkit-backdrop-filter: blur(14px) saturate(1.1);
  border: 1.5px solid rgba(197, 164, 110, 0.65);
  box-shadow:
    0 10px 36px rgba(0, 0, 0, 0.45),
    0 0 0 1px rgba(255, 255, 255, 0.06),
    0 0 24px rgba(197, 164, 110, 0.18);
  pointer-events: auto;
  user-select: none;
}

/* Angebot / Konfigurator: Kapitelüberschriften in der Fortschrittsübersicht (rechts) */
.angebot-wizard-progress--with-titles,
body > .angebot-wizard-progress.angebot-wizard-progress--with-titles,
.konfig-wizard-progress.angebot-wizard-progress--with-titles,
body > .konfig-wizard-progress.angebot-wizard-progress--with-titles {
  align-items: stretch;
  /* Breiter, damit Abschnittsnamen (z. B. Erdbestattung) lesbar bleiben */
  min-width: min(18.5rem, calc(100vw - 1.25rem));
  max-width: min(22rem, calc(100vw - 1rem));
  width: min(22rem, calc(100vw - 1rem));
  max-height: min(86vh, 42rem);
  overflow-x: hidden;
  overflow-y: auto;
  padding: 0.9rem 0.85rem 0.9rem;
  gap: 0.55rem;
  scrollbar-width: thin;
}

.angebot-wizard-progress-heading {
  display: block !important;
  margin: 0.1rem 0 0.35rem;
  padding: 0;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #c5a46e;
  text-align: center;
  line-height: 1.2;
  white-space: nowrap;
  visibility: visible !important;
  opacity: 1 !important;
}

/* Service-Kapitel im Angebots-Wizard (ein Kapitel pro Fortschrittsschritt) */
.angebot-service-chapter[hidden] {
  display: none !important;
}

.angebot-service-chapter {
  margin: 0;
}

body.angebot-wizard-progress-visible .angebot-wizard-progress {
  display: flex !important;
}

/* Am document.body angehängt: sicher viewport-fixed */
body > .angebot-wizard-progress {
  position: fixed !important;
  right: calc(0.7rem + env(safe-area-inset-right, 0px)) !important;
  left: auto !important;
}

/* Gesamtpreis permanent links (neben Fortschritt rechts) — nur Summe, keine Positionen */
.konfig-total-rail,
body > .konfig-total-rail,
.angebot-total-rail,
body > .angebot-total-rail {
  position: fixed !important;
  top: 50% !important;
  left: calc(0.55rem + env(safe-area-inset-left, 0px)) !important;
  right: auto !important;
  bottom: auto !important;
  transform: translateY(-50%) !important;
  inset-inline-start: calc(0.55rem + env(safe-area-inset-left, 0px)) !important;
  inset-inline-end: auto !important;
  z-index: 200 !important;
  display: none;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  margin: 0 !important;
  padding: 0.9rem 1rem 1rem;
  width: auto;
  min-width: 7.5rem;
  max-width: min(11rem, calc(100vw - 5.25rem));
  max-height: none;
  border-radius: 1.25rem;
  background: rgba(10, 11, 16, 0.5);
  backdrop-filter: blur(14px) saturate(1.1);
  -webkit-backdrop-filter: blur(14px) saturate(1.1);
  border: 1.5px solid rgba(197, 164, 110, 0.65);
  box-shadow:
    0 10px 36px rgba(0, 0, 0, 0.45),
    0 0 0 1px rgba(255, 255, 255, 0.06),
    0 0 24px rgba(197, 164, 110, 0.18);
  pointer-events: none;
  user-select: none;
  text-align: center;
}

/* Nur Gesamtpreis: Auswahl-Liste ausblenden */
.konfig-total-rail--total-only .konfig-total-rail-selection-label,
.konfig-total-rail--total-only .konfig-total-rail-items,
.konfig-total-rail--total-only #konfig-total-rail-items,
.angebot-total-rail .konfig-total-rail-selection-label,
.angebot-total-rail .konfig-total-rail-items {
  display: none !important;
}

body.konfig-total-rail-visible .konfig-total-rail,
body.konfig-total-rail-visible > .konfig-total-rail {
  display: flex !important;
}

.konfig-total-rail[hidden] {
  display: none !important;
}

.konfig-total-rail-selection-label {
  margin: 0;
  font-size: 1.08rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  line-height: 1.25;
  color: rgba(245, 230, 200, 0.92);
  text-align: center;
}

.konfig-total-rail-items {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  overflow-y: auto;
  overscroll-behavior: contain;
  max-height: min(48vh, 18rem);
  scrollbar-width: thin;
  min-height: 0;
}

.konfig-total-rail-item {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.08rem;
  padding: 0.28rem 0.15rem;
  border-bottom: 1px solid rgba(255, 255, 255, 0.07);
}

.konfig-total-rail-item:last-child {
  border-bottom: none;
}

.konfig-total-rail-item-label {
  font-size: 0.92rem;
  line-height: 1.25;
  color: rgba(241, 233, 223, 0.94);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  word-break: break-word;
}

.konfig-total-rail-item-price {
  font-size: 0.92rem;
  font-weight: 700;
  color: var(--price-color);
  font-variant-numeric: tabular-nums;
}

.konfig-total-rail-item--empty {
  font-size: 0.92rem;
  color: rgba(245, 230, 200, 0.55);
  font-style: italic;
  border-bottom: none;
}

.konfig-total-rail-foot {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.2rem;
  margin-top: 0.15rem;
  padding-top: 0.55rem;
  border-top: 1px solid rgba(197, 164, 110, 0.35);
  text-align: center;
}

.konfig-total-rail--total-only .konfig-total-rail-foot,
.angebot-total-rail .konfig-total-rail-foot {
  margin-top: 0;
  padding-top: 0;
  border-top: none;
}

.konfig-total-rail-label {
  margin: 0;
  font-size: 0.92rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  line-height: 1.2;
  color: rgba(245, 230, 200, 0.88);
}

.konfig-total-rail-value {
  margin: 0;
  font-size: 1.75rem;
  font-weight: 700;
  line-height: 1.1;
  color: var(--price-color);
  font-variant-numeric: tabular-nums;
  word-break: break-word;
  letter-spacing: -0.01em;
}

.konfig-total-rail--total-only,
.angebot-total-rail {
  gap: 0.3rem;
  padding: 0.95rem 1.1rem 1.05rem;
}

html[data-theme="light"] .konfig-total-rail,
html[data-theme="light"] body > .konfig-total-rail,
html[data-theme="light"] .angebot-total-rail,
html[data-theme="light"] body > .angebot-total-rail {
  background: rgba(255, 252, 247, 0.5);
  border-color: rgba(197, 164, 110, 0.7);
  box-shadow: 0 10px 28px rgba(40, 32, 20, 0.16);
}

body.angebot-total-rail-visible .angebot-total-rail,
body.angebot-total-rail-visible > .angebot-total-rail {
  display: flex !important;
}

/* Fixierter Gesamtpreis links, vertikal mittig: nicht anzeigen.
   In der Mobil-Kopfzeile bleibt die Summe. */
body.angebot-page > .angebot-total-rail,
body.angebot-total-rail-visible > .angebot-total-rail,
body.konfig-page > .konfig-total-rail,
body.konfig-total-rail-visible > .konfig-total-rail,
body.konfig-total-rail-visible .konfig-total-rail {
  display: none !important;
}

html[data-theme="light"] .konfig-total-rail-selection-label,
html[data-theme="light"] .konfig-total-rail-label {
  color: rgba(92, 74, 40, 0.72);
}

html[data-theme="light"] .konfig-total-rail-item-label {
  color: #3d3830;
}

html[data-theme="light"] .konfig-total-rail-item {
  border-bottom-color: rgba(40, 32, 20, 0.1);
}

html[data-theme="light"] .konfig-total-rail-item-price,
html[data-theme="light"] .konfig-total-rail-value {
  color: var(--price-color);
}

html[data-theme="light"] .konfig-total-rail-foot {
  border-top-color: rgba(197, 164, 110, 0.4);
}

@media (max-width: 900px) {
  .konfig-total-rail,
  body > .konfig-total-rail {
    left: calc(0.3rem + env(safe-area-inset-left, 0px)) !important;
    inset-inline-start: calc(0.3rem + env(safe-area-inset-left, 0px)) !important;
    padding: 0.65rem 0.55rem 0.7rem;
    width: min(9.25rem, calc(100vw - 4.75rem));
    min-width: 7.25rem;
    max-width: min(9.75rem, calc(100vw - 4.5rem));
    max-height: min(72vh, 28rem);
  }

  .konfig-total-rail-selection-label {
    font-size: 0.98rem;
  }

  .konfig-total-rail-label {
    font-size: 0.84rem;
  }

  .konfig-total-rail-item-label,
  .konfig-total-rail-item-price {
    font-size: 0.84rem;
  }

  .konfig-total-rail-value {
    font-size: 1.45rem;
  }

  .konfig-total-rail-items {
    max-height: min(40vh, 14rem);
  }
}

/* Bestattungskonfigurator: Anordnung wie „Angebot zusenden lassen“ */
#konfig-form.card-dark {
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

#konfig-form.card-dark:hover {
  border-color: transparent !important;
  transform: none;
}

#konfig-form.konfig-form--wizard {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

#konfig-form .konfig-steps {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  min-width: 0;
}

/* Abschnitte = gleiche Glas-Karten wie Angebot */
#konfig-form .fragebogen-section.konfig-section,
#konfig-form .konfig-wizard-step {
  display: flex;
  flex-direction: column;
  padding: 1.35rem 1.35rem 1.5rem;
  border-radius: 1.25rem;
  background: rgba(10, 11, 16, 0.3) !important;
  /* blur erst nach erstem Paint — spart teure Filter beim Start */
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  border: 1px solid rgba(255, 255, 255, 0.1);
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.16);
  min-inline-size: 0;
  max-width: 100%;
  overflow-x: clip;
  box-sizing: border-box;
}

/* Blur erst wenn die Seite „fertig“ wirkt — 1. Schritt bleibt sofort lesbar */
body.konfig-page.angebot-wizard-progress-visible #konfig-form .fragebogen-section.konfig-section,
body.konfig-page.angebot-wizard-progress-visible #konfig-form .konfig-wizard-step {
  backdrop-filter: blur(8px) saturate(1.05);
  -webkit-backdrop-filter: blur(8px) saturate(1.05);
}

/* Kein Logo-Header: etwas Luft oben für Theme-Toggle */
.konfig-main--no-header {
  padding-top: 1.75rem;
}

.konfig-step-skeleton .fragebogen-sub {
  color: #a88f5f;
  margin: 0;
}

@media (min-width: 768px) {
  #konfig-form .fragebogen-section.konfig-section,
  #konfig-form .konfig-wizard-step {
    padding: 1.6rem 1.75rem 1.75rem;
  }
}

#konfig-form .fragebogen-section.konfig-section[hidden],
#konfig-form .konfig-wizard-step[hidden],
#konfig-form.konfig-form--wizard .konfig-section[hidden] {
  display: none !important;
}

#konfig-form .fragebogen-section.konfig-section.is-konfig-step-active,
#konfig-form .fragebogen-section.konfig-section.is-angebot-step-active,
#konfig-form .konfig-wizard-step.is-konfig-step-active {
  display: flex;
}

#konfig-form .fragebogen-legend.konfig-legend {
  display: block;
  float: none;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  margin: 0 0 1rem;
  padding: 0;
  border: none;
  position: static;
  background: transparent;
  font-family: var(--font-serif, Georgia, "Times New Roman", serif);
  font-size: 1.35rem;
  font-weight: 600;
  color: var(--text-primary, #f1e9df);
}

#konfig-form .fragebogen-sub {
  margin: -0.25rem 0 1rem;
  color: var(--text-muted, #b8a78a);
  font-size: 0.95rem;
  line-height: 1.5;
}

#konfig-form .fragebogen-section > *,
#konfig-form .konfig-options,
#konfig-form .fragebogen-checks,
#konfig-form .fragebogen-check,
#konfig-form .konfig-option {
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

/* Options-Zeilen exakt wie Angebot */
#konfig-form .fragebogen-checks,
#konfig-form .konfig-options {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
}

/* Hygiene unter Bestattungsart (Schritt 1) */
#konfig-form .konfig-bestattungsart-hygiene {
  margin-top: 0.35rem;
  padding-top: 1rem;
  border-top: 1px solid rgba(197, 164, 110, 0.22);
}

#konfig-form .konfig-bestattungsart-hygiene .konfig-subgroup-title {
  margin: 0 0 0.65rem;
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--text-primary, #f1e9df);
}

#konfig-form .fragebogen-check,
#konfig-form .konfig-option.fragebogen-check {
  background: rgba(10, 11, 16, 0.3);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  border-color: rgba(255, 255, 255, 0.06);
}

#konfig-form .fragebogen-check:has(input:checked),
#konfig-form .konfig-option.fragebogen-check:has(input:checked) {
  background: rgba(197, 164, 110, 0.22);
  border-color: var(--gold, #c5a46e);
  box-shadow: 0 0 0 1px rgba(197, 164, 110, 0.35), 0 4px 14px rgba(197, 164, 110, 0.12);
}

.konfig-wizard-footer {
  margin-top: 0.25rem;
  margin-bottom: 0;
}

/* Fortschritt: bei vielen Schritten kompakter + scrollbar (Titel bleiben lesbar) */
.konfig-wizard-progress.konfig-wizard-progress--dense,
.konfig-wizard-progress.angebot-wizard-progress--with-titles.konfig-wizard-progress--dense,
body > .konfig-wizard-progress.konfig-wizard-progress--dense {
  max-height: min(82vh, 40rem);
  overflow-y: auto;
  overscroll-behavior: contain;
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
  gap: 0.4rem;
  scrollbar-width: thin;
  /* Auch im Dense-Modus breit genug für Abschnittsnamen */
  min-width: min(18.5rem, calc(100vw - 1.25rem));
  max-width: min(22rem, calc(100vw - 1rem));
  width: min(22rem, calc(100vw - 1rem));
}

/* Nur reine Zahlen-Kreise verkleinern — nicht die Titel-Zeilen */
.konfig-wizard-progress.konfig-wizard-progress--dense .angebot-wizard-step:not(:has(.angebot-wizard-step-title)) {
  width: 1.7rem;
  height: 1.7rem;
  font-size: 0.78rem;
}

.konfig-wizard-progress.konfig-wizard-progress--dense .angebot-wizard-steps {
  gap: 0.3rem;
}

.konfig-wizard-progress.konfig-wizard-progress--dense .angebot-wizard-step:has(.angebot-wizard-step-title),
.konfig-wizard-progress.angebot-wizard-progress--with-titles.konfig-wizard-progress--dense .angebot-wizard-step {
  width: 100%;
  height: auto;
  min-height: 2.35rem;
  font-size: inherit;
}

/* Preisübersicht unter dem Formular (wie Abschlussblock im Angebot) */
#konfig-total-card.konfig-total-card {
  background: rgba(10, 11, 16, 0.3) !important;
  backdrop-filter: blur(8px) saturate(1.05);
  -webkit-backdrop-filter: blur(8px) saturate(1.05);
  border: 1px solid rgba(255, 255, 255, 0.1);
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.16);
}

html[data-theme="light"] #konfig-form .fragebogen-section.konfig-section,
html[data-theme="light"] #konfig-form .konfig-wizard-step {
  background: rgba(255, 252, 247, 0.3) !important;
  border-color: rgba(255, 255, 255, 0.55);
  box-shadow: 0 4px 16px rgba(40, 32, 20, 0.1);
}

html[data-theme="light"] #konfig-form .fragebogen-legend.konfig-legend {
  color: #1e1b18;
}

html[data-theme="light"] #konfig-form .fragebogen-check,
html[data-theme="light"] #konfig-form .konfig-option.fragebogen-check {
  background: rgba(255, 252, 247, 0.3);
  border-color: rgba(217, 207, 192, 0.65);
}

html[data-theme="light"] #konfig-form .fragebogen-check:has(input:checked),
html[data-theme="light"] #konfig-form .konfig-option.fragebogen-check:has(input:checked) {
  background: rgba(197, 164, 110, 0.18);
  border-color: var(--gold, #c5a46e);
}

html[data-theme="light"] #konfig-total-card.konfig-total-card {
  background: rgba(255, 252, 247, 0.3) !important;
  border-color: rgba(255, 255, 255, 0.55);
}

.angebot-wizard-step-label {
  margin: 0;
  font-size: 0.95rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  line-height: 1.15;
  color: #f5e6c8;
  text-align: center;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.45);
  white-space: nowrap;
}

.angebot-wizard-steps {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.45rem;
}

.angebot-wizard-progress--with-titles .angebot-wizard-steps {
  align-items: stretch;
  width: 100%;
  gap: 0.35rem;
}

.angebot-wizard-progress--with-titles .angebot-wizard-steps > li {
  width: 100%;
}

.angebot-wizard-step {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2.15rem;
  height: 2.15rem;
  padding: 0;
  border-radius: 9999px;
  border: 2px solid rgba(197, 164, 110, 0.4);
  background: rgba(20, 21, 28, 0.85);
  color: rgba(245, 230, 200, 0.55);
  font-size: 0.95rem;
  font-weight: 800;
  line-height: 1;
  font-family: inherit;
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.25);
  cursor: pointer;
  transition:
    background 0.2s ease,
    border-color 0.2s ease,
    color 0.2s ease,
    box-shadow 0.2s ease,
    transform 0.2s ease;
}

/* Mit Kapitelüberschrift: feste Zahlenspalte + Titel (sauber ausgerichtet) */
.angebot-wizard-step:has(.angebot-wizard-step-title),
.angebot-wizard-progress--with-titles .angebot-wizard-step {
  display: grid;
  grid-template-columns: 1.75rem minmax(0, 1fr);
  column-gap: 0.55rem;
  row-gap: 0;
  align-items: center;
  width: 100%;
  height: auto;
  min-height: 2.45rem;
  justify-content: stretch;
  padding: 0.4rem 0.5rem 0.4rem 0.4rem;
  border-radius: 0.75rem;
  text-align: left;
  transform: none;
}

.angebot-wizard-step-num {
  grid-column: 1;
  grid-row: 1;
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.75rem;
  height: 1.75rem;
  margin: 0;
  padding: 0;
  border-radius: 9999px;
  border: 1.5px solid rgba(197, 164, 110, 0.45);
  background: rgba(10, 11, 16, 0.45);
  font-size: 0.82rem;
  font-weight: 800;
  line-height: 1;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0;
  text-align: center;
  transform: none !important;
}

.angebot-wizard-step-title {
  grid-column: 2;
  grid-row: 1;
  min-width: 0;
  display: block;
  font-size: 0.84rem;
  font-weight: 600;
  line-height: 1.35;
  letter-spacing: 0.01em;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
  hyphens: auto;
  color: inherit;
  padding: 0;
  margin: 0;
  transform: none !important;
}

.angebot-wizard-step:hover {
  border-color: rgba(224, 201, 146, 0.85);
  color: #f5e6c8;
  transform: none;
}

.angebot-wizard-step.is-no-jump,
.angebot-wizard-step:disabled {
  cursor: not-allowed;
  opacity: 0.5;
  pointer-events: none;
}

.angebot-wizard-step.is-no-jump:hover,
.angebot-wizard-step:disabled:hover {
  border-color: inherit;
  color: inherit;
  background: inherit;
}

.angebot-wizard-progress--with-titles .angebot-wizard-step:hover {
  background: rgba(197, 164, 110, 0.16);
}

.angebot-wizard-step:focus-visible {
  outline: 2px solid rgba(224, 201, 146, 0.9);
  outline-offset: 2px;
}

.angebot-wizard-step span {
  display: block;
}

.angebot-wizard-step:not(:has(.angebot-wizard-step-title)) span {
  transform: translateY(0.5px);
}

.angebot-wizard-step.is-done {
  border-color: rgba(197, 164, 110, 0.85);
  background: rgba(197, 164, 110, 0.28);
  color: #f5e6c8;
}

.angebot-wizard-step.is-done .angebot-wizard-step-num {
  border-color: rgba(197, 164, 110, 0.75);
  background: rgba(197, 164, 110, 0.35);
}

.angebot-wizard-step.is-active {
  border-color: #e0c992;
  background: linear-gradient(160deg, #e0c992 0%, #c5a46e 100%);
  color: #1a1610;
  transform: none;
  box-shadow:
    0 0 0 2px rgba(197, 164, 110, 0.28),
    0 4px 14px rgba(197, 164, 110, 0.35);
}

.angebot-wizard-progress--with-titles .angebot-wizard-step.is-active {
  transform: none;
}

.angebot-wizard-step.is-active .angebot-wizard-step-num {
  border-color: rgba(26, 22, 16, 0.35);
  background: rgba(255, 255, 255, 0.4);
  color: #1a1610;
}

.angebot-wizard-footer {
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
  margin-top: 0.25rem;
}

.angebot-wizard-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  align-items: stretch;
}

.angebot-wizard-btn {
  flex: 1 1 8rem;
  min-height: 3.1rem;
  padding: 0.85rem 1.1rem;
  border-radius: 1rem;
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: 0.03em;
  cursor: pointer;
  transition: transform 0.15s ease, opacity 0.15s ease, border-color 0.15s ease, background 0.15s ease;
}

.angebot-wizard-btn--back,
.angebot-wizard-btn--next {
  flex: 1 1 9rem;
  min-width: 8.5rem;
}

.angebot-wizard-btn--back {
  border: 1px solid rgba(197, 164, 110, 0.55);
  background: rgba(10, 11, 16, 0.45);
  color: var(--gold-light, #c5a46e);
}

.angebot-wizard-btn--back:hover:not(:disabled) {
  border-color: rgba(197, 164, 110, 0.85);
  background: rgba(197, 164, 110, 0.14);
}

.angebot-wizard-btn--back:disabled,
.angebot-wizard-btn--next:disabled {
  opacity: 0.4;
  cursor: not-allowed;
  transform: none;
}

.angebot-wizard-btn--next.is-blocked,
.angebot-wizard-btn--next.is-blocked:hover {
  opacity: 0.4;
  cursor: not-allowed;
  transform: none;
}

.angebot-wizard-btn--submit {
  flex: 1 1 100%;
  min-width: 100%;
}

html[data-theme="light"] .angebot-wizard-progress {
  background: rgba(255, 252, 247, 0.5);
  border-color: rgba(197, 164, 110, 0.7);
  box-shadow: 0 10px 28px rgba(40, 32, 20, 0.16);
}

html[data-theme="light"] .angebot-wizard-progress-heading {
  color: rgba(154, 125, 74, 0.95);
}

html[data-theme="light"] .angebot-wizard-step-num {
  background: rgba(255, 255, 255, 0.7);
  border-color: rgba(154, 125, 74, 0.4);
}

html[data-theme="light"] .angebot-wizard-step-label {
  color: #5c4a28;
  text-shadow: none;
}

html[data-theme="light"] .angebot-wizard-step {
  background: rgba(255, 252, 247, 0.95);
  border-color: rgba(197, 164, 110, 0.5);
  color: rgba(92, 74, 40, 0.55);
}

html[data-theme="light"] .angebot-wizard-step:hover {
  color: #5c4a28;
}

html[data-theme="light"] .angebot-wizard-step.is-done {
  background: rgba(197, 164, 110, 0.22);
  color: #5c4a28;
}

html[data-theme="light"] .angebot-wizard-step.is-active {
  color: #1a1610;
}

html[data-theme="light"] .angebot-wizard-btn--back {
  background: rgba(255, 252, 247, 0.55);
  color: var(--gold);
}

/* Auf schmalen Screens: kompakter, weiterhin rechts am Viewport */
@media (max-width: 900px) {
  .angebot-wizard-progress,
  body .angebot-wizard-progress,
  body > .angebot-wizard-progress,
  #konfig-form .angebot-wizard-progress,
  #angebot-form .angebot-wizard-progress {
    right: calc(0.35rem + env(safe-area-inset-right, 0px)) !important;
    left: auto !important;
    inset-inline-end: calc(0.35rem + env(safe-area-inset-right, 0px)) !important;
    inset-inline-start: auto !important;
    padding: 0.75rem 0.55rem 0.7rem;
    min-width: 3.5rem;
    gap: 0.55rem;
  }

  .angebot-wizard-progress--with-titles,
  body > .angebot-wizard-progress.angebot-wizard-progress--with-titles,
  .konfig-wizard-progress.angebot-wizard-progress--with-titles,
  body > .konfig-wizard-progress.angebot-wizard-progress--with-titles {
    min-width: min(15.5rem, calc(100vw - 0.75rem));
    max-width: min(18.5rem, calc(100vw - 0.6rem));
    width: min(18.5rem, calc(100vw - 0.6rem));
    padding: 0.7rem 0.65rem 0.75rem;
  }

  .angebot-wizard-step {
    width: 1.85rem;
    height: 1.85rem;
    font-size: 0.85rem;
  }

  .angebot-wizard-progress--with-titles .angebot-wizard-step {
    width: 100%;
    height: auto;
    min-height: 2.25rem;
    grid-template-columns: 1.6rem minmax(0, 1fr);
    column-gap: 0.5rem;
  }

  .angebot-wizard-progress--with-titles .angebot-wizard-step-num {
    width: 1.6rem;
    height: 1.6rem;
    font-size: 0.78rem;
  }

  .angebot-wizard-step-title {
    font-size: 0.78rem;
  }

  .angebot-wizard-step-label {
    font-size: 0.82rem;
  }

  .angebot-wizard-steps {
    gap: 0.35rem;
  }
}

/* Sehr schmal: Titel bleiben sichtbar, Panel scrollbar */
@media (max-width: 520px) {
  .angebot-wizard-progress--with-titles,
  body > .angebot-wizard-progress.angebot-wizard-progress--with-titles {
    top: auto !important;
    bottom: calc(5.5rem + env(safe-area-inset-bottom, 0px)) !important;
    transform: none !important;
    max-height: min(42vh, 18rem);
    right: calc(0.35rem + env(safe-area-inset-right, 0px)) !important;
  }
}



#angebot-form.card-dark:hover {
  border-color: transparent !important;
  transform: none;
}

#angebot-form .fragebogen-section {
  display: flex;
  flex-direction: column;
  padding: 1.35rem 1.35rem 1.5rem;
  border-radius: 1.25rem;
  background: rgba(10, 11, 16, 0.3) !important;
  backdrop-filter: blur(8px) saturate(1.05);
  -webkit-backdrop-filter: blur(8px) saturate(1.05);
  border: 1px solid rgba(255, 255, 255, 0.1);
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.16);
  min-inline-size: 0;
  max-width: 100%;
  overflow-x: clip;
  box-sizing: border-box;
}

#angebot-form .fragebogen-section > *,
#angebot-form .angebot-leistungen,
#angebot-form .angebot-leistung-group,
#angebot-form .fragebogen-checks,
#angebot-form .fragebogen-check {
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

@media (min-width: 768px) {
  #angebot-form .fragebogen-section {
    padding: 1.6rem 1.75rem 1.75rem;
  }
}

#angebot-form .fragebogen-section > .fragebogen-legend {
  display: block;
  float: none;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  margin: 0 0 1rem;
  padding: 0;
  border: none;
  position: static;
  background: transparent;
  color: var(--price-color);
}

#angebot-form .fragebogen-legend[data-i18n="angebot.section1"] {
  color: #fff !important;
  background: none;
  display: block;
  width: 100%;
  max-width: 100%;
  padding: 0;
  text-shadow: 0 1px 8px rgba(0, 0, 0, 0.55);
}

#angebot-form .fragebogen-legend,
#angebot-form .angebot-subgroup-title,
#angebot-form .angebot-leistung-title,
#angebot-form .angebot-catering-title,
#angebot-form .product-option-category {
  color: var(--price-color);
}

#angebot-form .fragebogen-check {
  background: rgba(10, 11, 16, 0.3);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  border-color: rgba(255, 255, 255, 0.06);
}

#angebot-form .fragebogen-check:has(input:checked) {
  background: rgba(197, 164, 110, 0.22);
  border-color: var(--gold, #c5a46e);
  box-shadow: 0 0 0 1px rgba(197, 164, 110, 0.35), 0 4px 14px rgba(197, 164, 110, 0.12);
}

#angebot-success.card-dark {
  background: rgba(10, 11, 16, 0.3) !important;
  backdrop-filter: blur(8px) saturate(1.05);
  -webkit-backdrop-filter: blur(8px) saturate(1.05);
  border: 1px solid rgba(255, 255, 255, 0.1);
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.16);
}

html[data-theme="light"] #angebot-form .fragebogen-section,
html[data-theme="light"] #angebot-success.card-dark {
  background: rgba(255, 252, 247, 0.3) !important;
  border-color: rgba(255, 255, 255, 0.55);
  box-shadow: 0 4px 16px rgba(40, 32, 20, 0.1);
}

html[data-theme="light"] #angebot-form .fragebogen-check {
  background: rgba(255, 252, 247, 0.3);
  border-color: rgba(217, 207, 192, 0.65);
}

/* Light: Checked-Zustand muss spezieller sein als die allgemeine Light-Regel */
html[data-theme="light"] #angebot-form .fragebogen-check:has(input:checked) {
  background: rgba(197, 164, 110, 0.28);
  border-color: #9a7d4a;
  box-shadow: 0 0 0 1px rgba(154, 125, 74, 0.45), 0 4px 14px rgba(154, 125, 74, 0.14);
}

/* Trauerfall digital melden: Abschnitte 1–5 + Titel minimal transparent (Glas) */
.sterbefall-page #sterbefall-form.card-dark {
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.sterbefall-page #sterbefall-form.card-dark:hover {
  border-color: transparent !important;
  transform: none;
}

/* Abschnitte 1–5: Überschriften (h3) liegen vollständig im Glas-Hintergrund */
.sterbefall-page #sterbefall-form fieldset.fragebogen-section {
  display: flex;
  flex-direction: column;
  padding: 1.35rem 1.35rem 1.5rem;
  border-radius: 1.25rem;
  background: rgba(10, 11, 16, 0.3) !important;
  backdrop-filter: blur(8px) saturate(1.05);
  -webkit-backdrop-filter: blur(8px) saturate(1.05);
  border: 1px solid rgba(255, 255, 255, 0.1);
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.16);
  min-inline-size: 0;
}

@media (min-width: 768px) {
  .sterbefall-page #sterbefall-form fieldset.fragebogen-section {
    padding: 1.6rem 1.75rem 1.75rem;
  }
}

.sterbefall-page #sterbefall-form fieldset.fragebogen-section > .fragebogen-legend {
  display: block;
  float: none;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  margin: 0 0 1rem;
  padding: 0;
  border: none;
  position: static;
  /* Überschrift teilt denselben Glas-Hintergrund wie der Abschnitt */
  background: transparent;
}

.sterbefall-page #sterbefall-success.card-dark {
  background: rgba(10, 11, 16, 0.3) !important;
  backdrop-filter: blur(8px) saturate(1.05);
  -webkit-backdrop-filter: blur(8px) saturate(1.05);
  border: 1px solid rgba(255, 255, 255, 0.1);
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.16);
}

.sterbefall-page main > .text-center > h1,
.sterbefall-page main > .text-center > p {
  display: block;
  width: fit-content;
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding: 0.55rem 1.1rem;
  border-radius: 0.9rem;
  background: rgba(10, 11, 16, 0.3);
  backdrop-filter: blur(8px) saturate(1.05);
  -webkit-backdrop-filter: blur(8px) saturate(1.05);
  border: 1px solid rgba(255, 255, 255, 0.1);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.16);
}

.sterbefall-page main > .text-center > p {
  padding: 0.55rem 1rem;
}

.sterbefall-page #sterbefall-form .fragebogen-check {
  background: rgba(10, 11, 16, 0.3);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  border-color: rgba(255, 255, 255, 0.06);
}

.sterbefall-page #sterbefall-form .fragebogen-check:has(input:checked) {
  background: rgba(197, 164, 110, 0.22);
  border-color: var(--gold, #c5a46e);
  box-shadow: 0 0 0 1px rgba(197, 164, 110, 0.35), 0 4px 14px rgba(197, 164, 110, 0.12);
}

html[data-theme="light"] .sterbefall-page #sterbefall-form .fragebogen-section,
html[data-theme="light"] .sterbefall-page #sterbefall-success.card-dark {
  background: rgba(255, 252, 247, 0.3) !important;
  border-color: rgba(255, 255, 255, 0.55);
  box-shadow: 0 4px 16px rgba(40, 32, 20, 0.1);
}

html[data-theme="light"] .sterbefall-page main > .text-center > h1,
html[data-theme="light"] .sterbefall-page main > .text-center > p {
  background: rgba(255, 252, 247, 0.3);
  border-color: rgba(255, 255, 255, 0.55);
  box-shadow: 0 4px 14px rgba(40, 32, 20, 0.1);
}

html[data-theme="light"] .sterbefall-page #sterbefall-form .fragebogen-check {
  background: rgba(255, 252, 247, 0.3);
  border-color: rgba(217, 207, 192, 0.65);
}

html[data-theme="light"] .sterbefall-page #sterbefall-form .fragebogen-check:has(input:checked) {
  background: rgba(197, 164, 110, 0.28);
  border-color: #9a7d4a;
  box-shadow: 0 0 0 1px rgba(154, 125, 74, 0.45), 0 4px 14px rgba(154, 125, 74, 0.14);
}

.fragebogen-legend {
  display: block;
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-size: 1.5rem;
  font-weight: 600;
  color: var(--gold);
  margin: 0 0 1rem;
  padding: 0;
  width: 100%;
  float: none;
}

.fragebogen-sub {
  font-size: 1rem;
  color: var(--text-muted);
  margin-bottom: 0.75rem;
}

.pflicht-label::after {
  content: " *";
  color: var(--gold);
}

.form-pflicht-hinweis {
  font-size: 0.875rem;
  color: var(--text-subtle);
  margin-bottom: 1.25rem;
}

.fragebogen-label {
  display: block;
  font-size: 1rem;
  color: var(--text-subtle);
  margin-bottom: 0.4rem;
}

.fragebogen-checks {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
}

.fragebogen-check {
  display: flex;
  align-items: flex-start;
  gap: 0.65rem;
  padding: 0.75rem 1rem;
  border: 1px solid var(--border);
  border-radius: 0.75rem;
  background: var(--bg-elevated);
  color: var(--text-secondary);
  font-size: 1rem;
  line-height: 1.45;
  cursor: pointer;
  transition: border-color 0.2s ease, background-color 0.2s ease;
}

.fragebogen-check-content {
  flex: 1;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  min-width: 0;
}

.fragebogen-check-content--with-scope {
  flex-direction: column;
  align-items: stretch;
  gap: 0.4rem;
}

.fragebogen-leistungsumfang-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
}

.fragebogen-leistungsumfang-toggle {
  appearance: none;
  background: none;
  border: none;
  padding: 0.05rem 0;
  margin: 0;
  color: var(--gold, #c5a46e);
  font-size: 0.98rem;
  font-weight: 700;
  letter-spacing: 0.01em;
  text-decoration: underline;
  text-underline-offset: 0.18em;
  cursor: pointer;
  text-align: left;
  line-height: 1.35;
}

.fragebogen-leistungsumfang-toggle:hover,
.fragebogen-leistungsumfang-toggle:focus-visible {
  color: #e0c98a;
}

.fragebogen-leistungsumfang-toggle:focus-visible {
  outline: 2px solid var(--gold, #c5a46e);
  outline-offset: 3px;
}

.fragebogen-leistungsumfang-list {
  list-style: none;
  margin: 0.1rem 0 0;
  padding: 0.55rem 0 0;
  border-top: 1px solid var(--border);
  display: none;
  flex-direction: column;
  gap: 0.38rem;
}

.fragebogen-leistungsumfang-list--open {
  display: flex;
  width: 100%;
}

.fragebogen-leistungsumfang-list[hidden] {
  display: none;
}

.fragebogen-leistungsumfang-item {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 1rem;
  font-size: 0.9rem;
  color: var(--text-secondary);
  line-height: 1.4;
}

.fragebogen-leistungsumfang-name {
  min-width: 0;
}

.fragebogen-leistungsumfang-price {
  flex-shrink: 0;
  font-weight: 600;
  color: var(--price-color);
  white-space: nowrap;
}

html[data-theme="light"] .fragebogen-leistungsumfang-toggle {
  color: #8a6d2e;
}

html[data-theme="light"] .fragebogen-leistungsumfang-toggle:hover,
html[data-theme="light"] .fragebogen-leistungsumfang-toggle:focus-visible {
  color: #6e541f;
}

.fragebogen-check-label {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

.fragebogen-check-hint {
  display: block;
  margin-top: 0.25rem;
  font-size: 0.875rem;
  line-height: 1.4;
}

.fragebogen-check-hint--notice {
  display: block;
  margin-top: 0.4rem;
  padding-top: 0.15rem;
  font-size: 0.86rem;
  font-weight: 500;
  line-height: 1.4;
  color: var(--gold, #c5a46e);
}

.fragebogen-check-hint--beliebt {
  display: inline-block;
  margin-top: 0.2rem;
  padding: 0;
  border-radius: 0;
  background: none;
  color: #c9b45c;
  font-size: 0.75rem;
  font-weight: 500;
  letter-spacing: 0.01em;
  line-height: 1.3;
  box-shadow: none;
  animation: none;
}

html[data-theme="light"] .fragebogen-check-hint--beliebt {
  background: none;
  color: #b59a28;
}

.fragebogen-check-hint--ki-bundle[hidden],
.konfig-option-hint--ki-bundle[hidden] {
  display: none !important;
}

.fragebogen-check-price--discounted,
.konfig-option-price--discounted {
  color: var(--price-color);
  font-weight: 700;
}

.fragebogen-check-price--exclusive {
  font-style: italic;
}

.fragebogen-check-price--included,
.konfig-option-price--included {
  font-style: italic;
  font-weight: 600;
  font-size: 0.9rem;
  color: var(--gold, #c5a46e);
  white-space: normal;
  max-width: 9.5rem;
  text-align: right;
  line-height: 1.3;
}

.fragebogen-check-price {
  color: var(--price-color);
  font-size: 1rem;
  font-weight: 600;
  white-space: nowrap;
  flex-shrink: 0;
}

/* Preis + Mengenrabatt (animierte Videos) untereinander */
.fragebogen-check-price-wrap,
.konfig-option-price-wrap {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: flex-start;
  gap: 0.15rem;
  flex-shrink: 0;
  min-width: 0;
  text-align: right;
}

.fragebogen-ki-video-discount,
.konfig-ki-video-discount {
  display: block;
  font-size: 0.78rem;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: 0.01em;
  color: #c5a46e;
  white-space: nowrap;
}

.fragebogen-ki-video-discount[hidden],
.konfig-ki-video-discount[hidden] {
  display: none !important;
}

html[data-theme="light"] .fragebogen-ki-video-discount,
html[data-theme="light"] .konfig-ki-video-discount {
  color: #8a6a38;
}

.fragebogen-check:hover {
  border-color: rgba(197, 164, 110, 0.45);
}

.fragebogen-check:has(input:checked) {
  border-color: var(--gold);
  background-color: rgba(197, 164, 110, 0.16);
  box-shadow: 0 0 0 1px rgba(197, 164, 110, 0.28);
}

.fragebogen-check--locked {
  cursor: default;
  opacity: 0.92;
}

.fragebogen-check--locked:hover {
  border-color: var(--border);
}

.fragebogen-check--locked input {
  cursor: not-allowed;
}

.fragebogen-check input[type="checkbox"],
.fragebogen-check input[type="radio"] {
  margin-top: 0.2rem;
  accent-color: var(--gold);
  flex-shrink: 0;
}

/* Särge-Abschnitt: gut sichtbar, auch bei Feuer/Wald/See neben Urnen */
.angebot-sarge-group {
  margin-bottom: 1.25rem;
  padding-bottom: 0.5rem;
  border-bottom: 1px solid rgba(197, 164, 110, 0.2);
}

.angebot-sarge-group .fragebogen-check {
  cursor: pointer;
}

.angebot-sarge-disclaimer {
  margin: 0 0 0.9rem;
  max-width: 42rem;
}

.sarg-kachel-grid,
#konfig-form .konfig-options.sarg-kachel-grid,
#konfig-form .fragebogen-checks.sarg-kachel-grid {
  --sarg-kachel-gap: 0.85rem;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--sarg-kachel-gap);
  align-items: stretch;
}

.sarg-kachel--solo {
  grid-column: 1 / -1;
  width: calc((100% - (2 * var(--sarg-kachel-gap))) / 3);
  justify-self: center;
}

.sarg-kachel {
  min-width: 0;
  display: flex;
  flex-direction: column;
}

.sarg-kachel .fragebogen-check {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  grid-template-areas:
    "media media"
    "radio title"
    "colors colors";
  align-items: start;
  gap: 0.45rem 0.5rem;
  height: 100%;
  padding: 0.55rem;
}

.sarg-kachel .product-option-stack {
  display: contents;
}

.sarg-kachel .product-option-media {
  grid-area: media;
  padding-left: 0;
  margin-top: 0;
}

.sarg-kachel .fragebogen-check > input {
  grid-area: radio;
  margin-top: 0.2rem;
}

.sarg-kachel .fragebogen-check-content {
  grid-area: title;
  align-items: center;
}

.sarg-kachel .product-option-variants {
  grid-area: colors;
  padding-left: 0;
  margin-top: 0;
}

.sarg-kachel .product-option-album {
  display: block;
}

.sarg-kachel .product-option-album__item,
.sarg-kachel .product-option-album__item--loop {
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  background: transparent;
}

.sarg-kachel .product-option-album__item img,
.sarg-kachel .product-option-album__preview-poster,
.sarg-kachel .product-option-album__preview-video {
  object-fit: contain;
  background: transparent;
}

.sarg-kachel .product-option-album__item--loop .product-option-album__play {
  display: none;
}

.sarg-kachel .product-option-variants__label {
  letter-spacing: 0.04em;
}

.sarg-kachel .product-option-variant {
  font-size: 0.74rem;
  padding: 0.18rem 0.45rem;
}

.urne-kachel-grid,
#konfig-form .konfig-options.urne-kachel-grid,
#konfig-form .fragebogen-checks.urne-kachel-grid {
  --sarg-kachel-gap: 0.85rem;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--sarg-kachel-gap);
  align-items: stretch;
}

.urne-kachel-grid > .product-option-category,
.urne-kachel-grid > .fragebogen-check,
.urne-kachel-grid > .konfig-option {
  grid-column: 1 / -1;
}

.urne-kachel.sarg-kachel .product-option-album__item,
.urne-kachel.sarg-kachel .product-option-album__item--loop {
  aspect-ratio: 1 / 1;
}

.product-option-category {
  margin: 1.1rem 0 0.4rem;
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-size: 1.08rem;
  font-weight: 600;
  color: var(--gold, #c5a46e);
}

.product-option-category:first-child {
  margin-top: 0.2rem;
}

.fragebogen-check--inline {
  flex-wrap: wrap;
  align-items: center;
}

.fragebogen-check--with-media,
.konfig-option--with-media {
  flex-wrap: wrap;
  align-items: flex-start;
}

.product-option-media {
  flex-basis: 100%;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  margin-top: 0.5rem;
  margin-left: 0;
  padding-left: 1.85rem;
  box-sizing: border-box;
}

.fragebogen-check--ki-video,
.konfig-option--ki-video {
  max-width: 100%;
  min-width: 0;
  /* overflow-y sichtbar lassen, damit Medien-Untertitel nicht abgeschnitten werden */
  overflow-x: hidden;
  overflow-y: visible;
}

/* Gesamte Position „animierte Videos“ klickbar (nicht nur Checkbox) */
.konfig-option--selectable,
.fragebogen-check--selectable {
  cursor: pointer;
}

.konfig-option--selectable:hover {
  border-color: rgba(197, 164, 110, 0.4);
}

.konfig-option--selectable:focus-visible,
.fragebogen-check--selectable:focus-visible {
  outline: 2px solid rgba(197, 164, 110, 0.75);
  outline-offset: 2px;
}

.fragebogen-check--ki-video .angebot-ki-video-body,
.konfig-option--ki-video .konfig-ki-video-body {
  flex: 1 1 100%;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0.65rem;
  margin-top: 0.5rem;
  margin-left: 0;
  padding-left: 1.85rem;
  box-sizing: border-box;
}

.fragebogen-check--ki-video .angebot-ki-video-media .product-option-media,
.konfig-option--ki-video .konfig-ki-video-media .product-option-media {
  flex-basis: auto;
  width: 100%;
  max-width: 100%;
  margin: 0;
  padding-left: 0;
}

.fragebogen-check--ki-video .angebot-ki-video-sidebar,
.konfig-option--ki-video .konfig-ki-video-sidebar {
  display: flex;
  align-items: center;
  align-self: flex-start;
  min-width: 0;
  max-width: 100%;
}

.angebot-ki-video-duration,
.konfig-ki-video-duration {
  flex-shrink: 0;
  white-space: nowrap;
  color: var(--text-subtle);
  font-size: 0.9em;
  font-variant-numeric: tabular-nums;
  min-width: 3.25rem;
}

.fragebogen-check--ki-video .angebot-ki-video-media,
.konfig-option--ki-video .konfig-ki-video-media {
  align-self: stretch;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow: visible;
  box-sizing: border-box;
}

.konfig-option--ki-bundled {
  opacity: 0.92;
}

.konfig-option--ki-bundled .konfig-input {
  cursor: not-allowed;
}

.product-option-media--with-disclaimer {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  gap: 0.85rem;
}

.product-option-media--with-disclaimer .product-option-album {
  flex: 0 0 auto;
  width: auto;
}

.product-option-media__disclaimer {
  flex: 1 1 11rem;
  min-width: 0;
  margin: 0;
  font-size: 0.78rem;
  line-height: 1.4;
  color: var(--price-color, #0a2f6b);
}

html[data-theme="light"] .product-option-media__disclaimer {
  color: var(--price-color, #0a2f6b);
}

.fragebogen-check--with-media > .product-option-media,
.konfig-option--with-media > .product-option-media,
.fragebogen-check--with-media > .product-option-stack,
.konfig-option--with-media > .product-option-stack {
  order: 20;
}

.fragebogen-check--with-media > .product-option-variants,
.konfig-option--with-media > .product-option-variants {
  order: 30;
}

.product-option-stack {
  flex-basis: 100%;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0.55rem;
  margin-top: 0.5rem;
  padding-left: 1.85rem;
  box-sizing: border-box;
}

.product-option-stack > .product-option-media,
.product-option-stack > .product-option-variants {
  flex-basis: auto;
  width: 100%;
  margin-top: 0;
  padding-left: 0;
  order: unset;
}

.product-option-variants {
  flex-basis: 100%;
  width: 100%;
  margin-top: 0.55rem;
  padding-left: 1.85rem;
  box-sizing: border-box;
}

.product-option-variants__label {
  display: block;
  margin-bottom: 0.35rem;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text-subtle);
}

.product-option-variants__list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
}

.diamant-material-bar {
  position: sticky;
  top: 0.75rem;
  z-index: 8;
  margin: 0.85rem 0 1.15rem;
  padding: 0.9rem 1rem 0.95rem;
  border-radius: 1.15rem;
  border: 1.5px solid rgba(197, 164, 110, 0.65);
  background: rgba(14, 15, 22, 0.88);
  backdrop-filter: blur(12px) saturate(1.1);
  -webkit-backdrop-filter: blur(12px) saturate(1.1);
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.28);
}

.diamant-material-bar__label {
  margin: 0 0 0.45rem;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text-subtle);
}

.diamant-material-bar__list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
}

.diamant-material-bar__option {
  pointer-events: auto;
  cursor: pointer;
}

.diamant-material-bar__legend {
  margin: 0.7rem 0 0;
  font-size: 0.88rem;
  line-height: 1.4;
  color: rgba(241, 233, 223, 0.88);
}

html[data-theme="light"] .diamant-material-bar {
  background: rgba(255, 252, 247, 0.94);
  border-color: rgba(197, 164, 110, 0.7);
  box-shadow: 0 8px 22px rgba(40, 32, 20, 0.12);
}

html[data-theme="light"] .diamant-material-bar__legend {
  color: rgba(50, 42, 32, 0.82);
}

#angebot-form.is-diamant-marble .diamant-material-bar,
#konfig-form.is-diamant-marble .diamant-material-bar,
body.bmh-diamant-marble .diamant-material-bar {
  border-color: rgba(197, 164, 110, 0.8);
}

.product-option-variant {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.28rem 0.6rem 0.28rem 0.32rem;
  border: 1px solid var(--border);
  border-radius: 9999px;
  background: transparent;
  color: var(--text-secondary);
  cursor: pointer;
  font-size: 0.82rem;
  line-height: 1.2;
}

.product-option-variant:not(:has(.product-option-variant__swatch)) {
  padding-left: 0.6rem;
}

.konfig-custom-ct-input {
  display: block;
  margin-top: 0.35rem;
  width: 8.5rem;
  max-width: 100%;
}

.product-option-variant:hover,
.product-option-variant:focus-visible {
  border-color: var(--gold);
  outline: none;
}

.product-option-variant.is-selected {
  border-color: var(--gold);
  color: var(--text-primary);
  box-shadow: 0 0 0 1px var(--gold);
}

.product-option-variant__swatch {
  width: 0.95rem;
  height: 0.95rem;
  border-radius: 9999px;
  background-color: var(--variant-swatch, #ccc);
  border: 1px solid rgba(255, 255, 255, 0.28);
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.2);
  flex-shrink: 0;
}

.product-option-variant__swatch--photo {
  width: 1.85rem;
  height: 1.85rem;
  border-radius: 0.35rem;
  background-color: #f3efe6;
  background-size: cover;
  background-position: center 28%;
  box-shadow: none;
}

.product-option-album {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
  align-items: flex-start;
}

.product-option-album__figure {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.3rem;
  margin: 0;
  width: 5.25rem;
  max-width: 5.25rem;
  flex: 0 0 auto;
}

.product-option-album__figure .product-option-album__item {
  width: 4.5rem;
  height: 4.5rem;
}

.product-option-album__item-caption {
  display: block;
  margin: 0;
  padding: 0 0.15rem;
  width: 100%;
  font-size: 0.68rem;
  font-weight: 600;
  line-height: 1.3;
  text-align: center;
  color: var(--gold-light, #c5a46e);
  letter-spacing: 0.01em;
  /* Immer sichtbar — nicht erst nach Klick auf die Datei */
  visibility: visible;
  opacity: 1;
  overflow: visible;
  hyphens: auto;
  -webkit-hyphens: auto;
}

.konfig-option--with-media .product-option-media {
  margin-left: 0;
  margin-top: 0.65rem;
}

.product-option-album__caption-block {
  display: block;
  margin-top: 0.4rem;
  font-size: 0.75rem;
  line-height: 1.4;
  color: #000;
}

.product-option-album__caption-intro {
  display: inline;
  color: #000;
  letter-spacing: 0.01em;
}

.konfig-option--ki-video .product-option-album__caption-block,
.fragebogen-check--ki-video .product-option-album__caption-block {
  margin-top: 0.65rem;
  font-size: 1.02rem;
  line-height: 1.55;
}

.konfig-option--ki-video .product-option-album__caption-intro,
.fragebogen-check--ki-video .product-option-album__caption-intro {
  display: block;
}

.product-option-album__caption {
  display: inline;
  margin-top: 0;
  font-size: inherit;
  color: #000;
  letter-spacing: 0.04em;
}

.product-option-album__caption-hint {
  display: inline;
  margin-left: 0.15rem;
  font-size: inherit;
  color: #000;
  letter-spacing: 0.01em;
}

html[data-theme="light"] .product-option-album__caption-intro,
html[data-theme="light"] .product-option-album__caption,
html[data-theme="light"] .product-option-album__caption-hint,
html[data-theme="light"] .product-option-album__caption-block {
  color: #000;
}

.fragebogen-check--ki-bundled {
  opacity: 0.92;
}

.fragebogen-check--ki-bundled input[type="checkbox"] {
  cursor: not-allowed;
}

.product-option-album__item {
  position: relative;
  flex: 0 0 auto;
  width: 4.5rem;
  height: 4.5rem;
  padding: 0;
  border: 1px solid var(--border);
  border-radius: 0.5rem;
  overflow: hidden;
  background: #000;
  cursor: zoom-in;
  transition: border-color 0.2s ease, transform 0.2s ease;
}

.product-option-album__item:hover,
.product-option-album__item:focus-visible {
  border-color: var(--gold);
  outline: none;
  transform: translateY(-1px);
}

.product-option-album__item img,
.product-option-album__preview-poster,
.product-option-album__preview-video {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  background: rgba(20, 21, 28, 0.3);
  content-visibility: auto;
}

/* Poster bleibt sichtbar, bis das Video wirklich abspielt (sonst oft schwarzer Frame) */
.product-option-album__item--video-muted .product-option-album__preview-poster {
  position: absolute;
  inset: 0;
  z-index: 1;
  background: transparent;
}

.product-option-album__item--video-muted .product-option-album__preview-video {
  position: absolute;
  inset: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  background: transparent;
  opacity: 0;
  pointer-events: none;
}

.product-option-album__item--video-muted.is-playing .product-option-album__preview-video {
  z-index: 2;
  opacity: 1;
}

.urne-kachel .product-option-album__item--video-muted.is-playing .product-option-album__preview-poster {
  opacity: 0;
  visibility: hidden;
}

/* Leere Vorschau ohne Poster: dezenter Platzhalter statt reinem Schwarz */
.product-option-album__item--video-muted .product-option-album__preview-video:not([src]):not([poster]) {
  background: linear-gradient(145deg, rgba(197, 164, 110, 0.18), rgba(40, 42, 52, 0.3));
}

.product-option-album__item--video-muted .product-option-album__play {
  z-index: 2;
  opacity: 0.85;
}

.product-option-album__play {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 1.35rem;
  background: rgba(0, 0, 0, 0.28);
  pointer-events: none;
}

.product-option-album__play svg {
  display: block;
  width: 1.45rem;
  height: 1.45rem;
  filter: drop-shadow(0 1px 3px rgba(0, 0, 0, 0.55));
}

/* Kein zusätzliches FA-/Text-Zeichen über reinen Foto-Thumbnails */
.product-option-album__item:not(.product-option-album__item--video-muted) .product-option-album__play {
  display: none;
}

.product-media-lightbox {
  padding: 0;
  border: none;
  width: min(94vw, 58rem);
  max-width: none;
  max-height: none;
  background: transparent;
  overflow: visible;
}

.product-media-lightbox::backdrop {
  background: rgba(4, 5, 10, 0.3);
}

.product-media-lightbox__stage {
  position: relative;
  padding: 3rem 3.25rem 0.65rem;
}

.product-media-lightbox__img,
.product-media-lightbox__video {
  display: block;
  width: 100%;
  max-height: calc(100vh - 11rem);
  margin: 0 auto;
  border-radius: 0.75rem;
  background: #000;
}

.product-media-lightbox__img[hidden],
.product-media-lightbox__video[hidden] {
  display: none !important;
}

.product-media-lightbox__img {
  object-fit: contain;
}

.product-media-lightbox__video {
  object-fit: contain;
}

.product-media-lightbox__video::-webkit-media-controls-fullscreen-button,
.product-option-album__preview-video::-webkit-media-controls-fullscreen-button,
.product-media-lightbox video::-webkit-media-controls-fullscreen-button {
  display: none !important;
}

.product-media-lightbox__caption {
  display: block;
  width: fit-content;
  max-width: min(92%, 36rem);
  margin: 0.55rem auto 0.35rem;
  padding: 0.45rem 1rem;
  text-align: center;
  font-size: 0.95rem;
  font-weight: 600;
  line-height: 1.35;
  color: #f3e6c8;
  letter-spacing: 0.02em;
  background: rgba(10, 11, 16, 0.82);
  border: 1px solid rgba(197, 164, 110, 0.4);
  border-radius: 9999px;
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.35);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

.product-media-lightbox__caption[hidden],
.product-media-lightbox--no-file-legend .product-media-lightbox__caption,
.product-media-lightbox__thumbs[hidden],
.product-media-lightbox--no-file-legend .product-media-lightbox__thumbs {
  display: none !important;
}

.product-media-lightbox__close,
.product-media-lightbox__nav {
  position: absolute;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.5rem;
  height: 2.5rem;
  border: 1px solid rgba(197, 164, 110, 0.45);
  border-radius: 9999px;
  background: rgba(10, 11, 16, 0.3);
  color: var(--gold);
  cursor: pointer;
  transition: border-color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
  z-index: 2;
}

/* Vor/Zurück: deutlich größer und kontrastreicher (animierte Videos) */
.product-media-lightbox__nav[hidden] {
  display: none !important;
}

.product-media-lightbox__nav {
  width: 3.35rem;
  height: 3.35rem;
  min-width: 3.35rem;
  min-height: 3.35rem;
  border: 2.5px solid #e0c992;
  background: rgba(12, 13, 18, 0.92);
  color: #f0d9a0;
  box-shadow:
    0 0 0 2px rgba(0, 0, 0, 0.55),
    0 6px 22px rgba(0, 0, 0, 0.55),
    0 0 18px rgba(197, 164, 110, 0.45);
}

.product-media-lightbox__nav .ui-icon,
.product-media-lightbox__nav svg {
  width: 1.55rem !important;
  height: 1.55rem !important;
  stroke-width: 2.75;
  filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.65));
}

.product-media-lightbox__close {
  top: 0.65rem;
  right: 0.65rem;
}

.product-media-lightbox__nav--prev {
  top: 50%;
  left: 0.55rem;
  transform: translateY(-50%);
}

.product-media-lightbox__nav--next {
  top: 50%;
  right: 0.55rem;
  transform: translateY(-50%);
}

.product-media-lightbox__close:hover,
.product-media-lightbox__close:focus-visible,
.product-media-lightbox__nav:hover,
.product-media-lightbox__nav:focus-visible {
  border-color: #f0d9a0;
  background: rgba(30, 28, 22, 0.96);
  outline: none;
}

.product-media-lightbox__nav:hover,
.product-media-lightbox__nav:focus-visible {
  color: #fff6df;
  box-shadow:
    0 0 0 2px rgba(0, 0, 0, 0.6),
    0 8px 28px rgba(0, 0, 0, 0.6),
    0 0 28px rgba(224, 201, 146, 0.65);
}

.product-media-lightbox__nav--prev:hover,
.product-media-lightbox__nav--prev:focus-visible {
  transform: translateY(-50%) scale(1.06);
}

.product-media-lightbox__nav--next:hover,
.product-media-lightbox__nav--next:focus-visible {
  transform: translateY(-50%) scale(1.06);
}

html[data-theme="light"] .product-media-lightbox__nav {
  border-color: #8a6a38;
  background: rgba(255, 252, 247, 0.96);
  color: #5c4524;
  box-shadow:
    0 0 0 2px rgba(255, 255, 255, 0.7),
    0 6px 20px rgba(40, 32, 20, 0.28),
    0 0 14px rgba(197, 164, 110, 0.35);
}

html[data-theme="light"] .product-media-lightbox__nav:hover,
html[data-theme="light"] .product-media-lightbox__nav:focus-visible {
  border-color: #6b5328;
  background: #fff;
  color: #3a2e18;
}

.product-media-lightbox__counter {
  text-align: center;
  color: var(--text-secondary);
  font-size: 0.875rem;
  margin-bottom: 0.75rem;
}

.product-media-lightbox__thumbs {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.65rem 0.55rem;
  max-width: 36rem;
  margin: 0 auto;
  padding: 0 1rem 1.15rem;
}

.product-media-lightbox__thumb-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.28rem;
  width: 4.35rem;
}

.product-media-lightbox__thumb-caption {
  display: block;
  width: 100%;
  font-size: 0.68rem;
  font-weight: 600;
  line-height: 1.25;
  text-align: center;
  color: #f3e6c8;
  letter-spacing: 0.01em;
}

.product-media-lightbox__thumb {
  position: relative;
  width: 3.5rem;
  height: 3.5rem;
  padding: 0;
  border: 1px solid rgba(197, 164, 110, 0.25);
  border-radius: 0.45rem;
  overflow: hidden;
  background: #000;
  cursor: pointer;
}

.product-media-lightbox__thumb.is-active {
  border-color: var(--gold);
  box-shadow: 0 0 0 1px rgba(197, 164, 110, 0.35);
}

.product-media-lightbox__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.product-media-lightbox__thumb-play {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 1rem;
  background: rgba(0, 0, 0, 0.35);
  pointer-events: none;
}

.fragebogen-inline-input {
  flex: 1;
  min-width: 8rem;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 0.5rem;
  padding: 0.4rem 0.65rem;
  color: var(--text-secondary);
  font-size: 1rem;
}

.fragebogen-inline-input:focus {
  border-color: var(--gold);
  outline: none;
}

.angebot-leistung-group + .angebot-leistung-group {
  margin-top: 1.5rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--border);
}

.angebot-leistung-heading {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 0.75rem;
}

.angebot-leistung-photo {
  width: 100%;
  aspect-ratio: 16 / 10;
  overflow: hidden;
  border-radius: 1rem;
  margin: 0 0 0.9rem;
  background: #1f212b;
}

.angebot-leistung-photo img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.angebot-leistung-group--premium .angebot-leistung-photo {
  box-shadow: inset 0 0 0 1px rgba(212, 175, 55, 0.35);
}

.angebot-leistung-title {
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-size: 1.25rem;
  font-weight: 600;
  color: var(--text-primary);
  margin: 0;
}

#leistungen {
  position: relative;
  z-index: 2;
}

.angebot-leistung-info {
  position: relative;
  z-index: 150;
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.65rem;
  height: 1.65rem;
  padding: 0;
  border: 1px solid rgba(197, 164, 110, 0.4);
  border-radius: 9999px;
  background: rgba(197, 164, 110, 0.12);
  color: var(--gold);
  font-size: 1rem;
  line-height: 1;
  cursor: pointer;
  pointer-events: auto;
  transition: color 0.2s, transform 0.2s;
}

.angebot-leistung-info:hover,
.angebot-leistung-info:focus-visible {
  color: #e0c992;
  transform: scale(1.05);
  outline: none;
}

.angebot-leistung-info:focus-visible {
  box-shadow: 0 0 0 2px rgba(197, 164, 110, 0.45);
}

body.angebot-art-info-open {
  overflow: hidden;
}

.angebot-leistung-info-dialog,
.angebot-leistung-info-popup {
  position: relative;
  width: min(24rem, calc(100vw - 2rem));
  max-width: calc(100vw - 2rem);
  max-height: min(20rem, 70vh);
  overflow-y: auto;
  margin: auto;
  padding: 0.9rem 1rem;
  padding-top: 2.35rem;
  border-radius: 0.85rem;
  border: 1px solid var(--border);
  background: #1f212b;
  color: #fff;
  font-family: 'Inter', system-ui, sans-serif;
  font-size: 0.875rem;
  font-weight: 400;
  line-height: 1.45;
  text-align: left;
  box-shadow: 0 18px 48px rgba(0, 0, 0, 0.45);
}

.angebot-leistung-info-dialog::backdrop {
  background: rgba(10, 11, 15, 0.45);
  cursor: pointer;
}

.angebot-leistung-info-close {
  position: absolute;
  top: 0.45rem;
  right: 0.45rem;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  padding: 0;
  border: 1px solid rgba(197, 164, 110, 0.35);
  border-radius: 9999px;
  background: rgba(197, 164, 110, 0.12);
  color: var(--gold, #c5a46e);
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: background 0.15s ease, color 0.15s ease, transform 0.12s ease;
}

.angebot-leistung-info-close:hover,
.angebot-leistung-info-close:focus-visible {
  background: rgba(197, 164, 110, 0.28);
  color: #e0c992;
  outline: none;
  transform: scale(1.05);
}

.angebot-leistung-info-close:focus-visible {
  box-shadow: 0 0 0 2px rgba(197, 164, 110, 0.45);
}

.angebot-leistung-info-body {
  min-width: 0;
}

.angebot-leistung-info-dialog p,
.angebot-leistung-info-popup p {
  margin: 0 0 0.55rem;
  color: #fff;
}

.angebot-leistung-info-dialog p:last-child,
.angebot-leistung-info-popup p:last-child {
  margin-bottom: 0;
}

.angebot-leistung-info-dialog strong,
.angebot-leistung-info-popup strong {
  display: block;
  margin-top: 0.45rem;
  margin-bottom: 0.2rem;
  color: #fff;
  font-size: 0.875rem;
}

.angebot-leistung-info-dialog li,
.angebot-leistung-info-popup li {
  color: #fff;
}

.angebot-leistung-info-dialog ul,
.angebot-leistung-info-popup ul {
  margin: 0;
  padding-left: 1.05rem;
}

.angebot-leistung-info-dialog li + li,
.angebot-leistung-info-popup li + li {
  margin-top: 0.2rem;
}

.angebot-leistung-info-popup[hidden] {
  display: none;
}

.leistungen-features {
  padding-left: 0.15rem;
}

.leistungen-features li::marker {
  color: var(--gold);
}

#leistungen .grid > article {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  height: 100%;
  pointer-events: auto;
}

#leistungen .konfigurator-btn {
  margin-top: auto;
  align-self: flex-start;
}

.angebot-floral-group {
  margin-top: 0.25rem;
}

.angebot-floral-group--hidden,
.angebot-urnen-group--hidden,
.angebot-sarge-group--hidden {
  display: none;
}

.angebot-floral-title {
  margin: 0 0 0.55rem;
  padding: 0 0.25rem;
  color: var(--text-secondary);
  font-size: 1rem;
  font-weight: 500;
}

.angebot-floral-subtitle {
  margin: -0.25rem 0 0.55rem;
  padding: 0 0.25rem;
  color: var(--text-muted);
  font-size: 0.875rem;
}

.angebot-floral-checks {
  margin-left: 0.35rem;
  padding-left: 0.75rem;
  border-left: 1px solid var(--border);
}

.angebot-catering-group {
  margin-top: 0.25rem;
}

.angebot-catering-title {
  margin: 0 0 0.35rem;
  padding: 0 0.25rem;
  color: var(--text-secondary);
  font-size: 1rem;
  font-weight: 500;
}

.angebot-catering-hint {
  margin: 0 0 0.55rem;
  padding: 0 0.25rem;
  font-size: 0.875rem;
  line-height: 1.45;
}

.angebot-catering-checks {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
  margin-left: 0.35rem;
  padding-left: 0.75rem;
  border-left: 1px solid var(--border);
}

.angebot-catering-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem 1.25rem;
}

.angebot-catering-price {
  margin-left: auto;
}

.angebot-catering-check {
  flex: 1 1 12rem;
  margin: 0;
}

.angebot-catering-person {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: var(--text-subtle);
  font-size: 1rem;
}

.angebot-catering-person-input,
.konfig-catering-person-input {
  width: 5rem;
  border-radius: 0.75rem;
  border: 1px solid var(--border);
  background: var(--konfig-surface-bg);
  color: var(--text-secondary);
  font-size: 1rem;
  padding: 0.45rem 0.65rem;
}

.konfig-catering-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
  width: 100%;
}

/* Trauerkarte: ganze Glaszeile klickbar */
.konfig-trauerkarte-gestaltung,
.konfig-trauerkarte-karten {
  cursor: pointer;
  display: flex;
  width: 100%;
  box-sizing: border-box;
}

.konfig-trauerkarte-gestaltung .konfig-catering-row,
.konfig-trauerkarte-karten .konfig-catering-row {
  width: 100%;
}

.angebot-trauerkarte-group .angebot-catering-check {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  width: 100%;
  cursor: pointer;
}

.angebot-trauerkarte-group .angebot-catering-row {
  width: 100%;
}

.konfig-catering-person {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  flex-shrink: 0;
}

.konfig-catering-person-label {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: var(--text-subtle);
  font-size: 0.875rem;
  margin: 0;
}

.konfig-route-body {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.konfig-route-label {
  display: block;
  color: var(--text-subtle);
  font-size: 0.875rem;
  margin-bottom: 0.45rem;
}

.konfig-route-input {
  display: block;
  width: 100%;
  margin-top: 0.35rem;
  border-radius: 1rem;
  border: 1px solid var(--border);
  background: var(--konfig-surface-bg);
  color: var(--text-secondary);
  font-size: 1rem;
  padding: 0.85rem 1rem;
}

.konfig-route-input:focus {
  outline: none;
  border-color: rgba(197, 164, 110, 0.55);
}

.konfig-route-summary {
  margin-top: 0.25rem;
  padding: 1rem 1.1rem;
  border-radius: 1rem;
  border: 1px solid var(--border);
  background: rgba(197, 164, 110, 0.05);
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.konfig-route-stat {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 1rem;
}

.konfig-route-stat--price .konfig-route-stat-value {
  color: var(--price-color);
  font-size: 1.5rem;
  font-weight: 600;
}

.konfig-route-stat-label {
  color: var(--text-subtle);
  font-size: 1rem;
}

.konfig-route-stat-value {
  color: var(--text-secondary);
  font-size: 1.125rem;
  font-weight: 500;
  text-align: right;
}

.konfig-route-hint {
  margin: 0.15rem 0 0;
  color: var(--text-subtle);
  font-size: 0.875rem;
  line-height: 1.45;
}

.konfig-route-hint--error {
  color: #ff8a8a;
}

.konfig-city-combobox {
  position: relative;
}

.konfig-city-input {
  margin-top: 0.35rem;
}

.konfig-city-dropdown {
  position: absolute;
  z-index: 30;
  top: calc(100% + 0.35rem);
  left: 0;
  right: 0;
  max-height: 16rem;
  overflow-y: auto;
  margin: 0;
  padding: 0.35rem 0;
  list-style: none;
  border-radius: 1rem;
  border: 1px solid var(--border);
  background: var(--konfig-dropdown-bg);
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.35);
}

.konfig-city-option {
  padding: 0.65rem 1rem;
  color: var(--text-secondary);
  font-size: 1rem;
  cursor: pointer;
}

.konfig-city-option:hover,
.konfig-city-option--active {
  background: rgba(197, 164, 110, 0.12);
  color: var(--text-primary);
}

.konfig-options--nested {
  margin-left: 0.25rem;
  padding-left: 0.75rem;
  border-left: 1px solid var(--border);
}

.konfig-ergaenzungen {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.konfig-subgroup-title {
  margin: 0 0 0.75rem;
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-size: 1.25rem;
  font-weight: 600;
  color: var(--gold);
}

.konfig-subgroup-subtitle {
  margin: -0.35rem 0 0.75rem;
  color: var(--text-muted);
  font-size: 1rem;
}

.angebot-subgroup-title {
  margin: 0.75rem 0 0.55rem;
  padding: 0 0.25rem;
  color: var(--gold);
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-size: 1.125rem;
  font-weight: 600;
}

.angebot-checkbox-subgroup + .fragebogen-check,
.angebot-checkbox-subgroup + .angebot-floral-group,
.angebot-checkbox-subgroup + .angebot-catering-group,
.angebot-checkbox-subgroup + .angebot-checkbox-subgroup {
  margin-top: 1rem;
}

.angebot-checkbox-subgroup-checks {
  padding-left: 0.75rem;
  border-left: 1px solid rgba(197, 164, 110, 0.35);
}

/* Checkliste Trauerfall — Download */
#checkliste {
  scroll-margin-bottom: 7rem;
}

.checkliste-download.card-dark:hover,
.checkliste-overview .card-dark:hover {
  transform: translateY(-2px);
}

.checkliste-overview {
  align-items: stretch;
}

.checkliste-part-card {
  display: flex;
  flex-direction: column;
  height: 100%;
  width: 100%;
  border: 1px solid transparent;
  cursor: pointer;
  font: inherit;
  color: inherit;
  transition: border-color 0.2s ease, transform 0.2s ease, background-color 0.2s ease;
}

.checkliste-part-card:hover {
  border-color: rgba(197, 164, 110, 0.45);
  transform: translateY(-2px);
}

.checkliste-part-card.is-active {
  border-color: var(--gold);
  background-color: rgba(197, 164, 110, 0.08);
}

.checkliste-part-card.is-active .checkliste-part-icon {
  transform: rotate(180deg);
}

.checkliste-part-icon {
  transition: transform 0.25s ease;
}

.checkliste-part-hint {
  margin-top: auto;
  padding-top: 0.65rem;
}

.checkliste-part-detail.hidden {
  display: none;
}

.checkliste-detail-close {
  flex-shrink: 0;
  width: 2rem;
  height: 2rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
  border: 1px solid var(--border);
  background: var(--bg-elevated);
  color: var(--text-subtle);
  cursor: pointer;
  transition: border-color 0.2s ease, color 0.2s ease;
}

.checkliste-detail-close:hover {
  border-color: var(--gold);
  color: var(--gold);
}

.checkliste-detail-body ul,
.checkliste-detail-body ol {
  margin: 0.75rem 0 0;
  padding-left: 1.15rem;
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
}

.checkliste-detail-body li strong {
  color: var(--text-primary);
  font-weight: 600;
}

.checkliste-detail-body p + ul,
.checkliste-detail-body p + ol {
  margin-top: 0.5rem;
}

.checkliste-detail-body p strong {
  display: block;
  color: var(--gold);
  font-size: 0.82rem;
  letter-spacing: 0.02em;
  margin-top: 0.85rem;
}

.checkliste-detail-body p:first-of-type strong {
  margin-top: 0;
}

.checkliste-overview .card-dark,
.checkliste-part-card.card-dark {
  padding: 0.85rem 0.75rem;
}

@media (min-width: 768px) {
  .checkliste-overview .card-dark,
  .checkliste-part-card.card-dark {
    padding: 1rem 1.25rem;
  }
}

.checkliste-overview .card-dark h3 {
  font-size: 0.9rem;
  line-height: 1.35;
}

.checkliste-overview .card-dark p {
  font-size: 0.75rem;
  line-height: 1.4;
}

@media (min-width: 768px) {
  .checkliste-overview .card-dark h3 {
    font-size: 1rem;
  }

  .checkliste-overview .card-dark p {
    font-size: 0.875rem;
  }
}

.checkliste-privacy-hint {
  padding: 0.85rem 1rem;
  border-radius: 0.75rem;
  border: 1px solid rgba(197, 164, 110, 0.25);
  background: rgba(197, 164, 110, 0.06);
}

/* Bestattungskonfigurator */
.konfig-page .konfig-section {
  content-visibility: auto;
  contain-intrinsic-size: auto 320px;
}

.konfig-page .konfig-total-card {
  content-visibility: visible;
}

/* Konfigurator: Eyebrow + Titel hinterlegt; Untertitel+Timeout teilen ein gemeinsames Intro-Feld */
.konfig-page .konfig-page-eyebrow,
.konfig-page .konfig-page-title,
.konfig-page main .text-center > [data-i18n="konfig.page.eyebrow"],
.konfig-page main .text-center > #konfig-title {
  display: inline-block;
  max-width: 100%;
  padding: 0.55rem 1.1rem;
  border-radius: 0.9rem;
  background: rgba(10, 11, 16, 0.3) !important;
  backdrop-filter: blur(8px) saturate(1.05);
  -webkit-backdrop-filter: blur(8px) saturate(1.05);
  border: 1px solid rgba(255, 255, 255, 0.1);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.16);
}

/* Keine zweite/eigene Kasten-Hinterlegung für Untertitel oder Timeout-Hinweis */
.konfig-page .konfig-page-intro .angebot-intro-field #konfig-subtitle,
.konfig-page .konfig-page-intro .angebot-intro-field #konfig-timeout-hint,
.konfig-page .konfig-page-intro .angebot-intro-field .konfig-page-subtitle,
.konfig-page .konfig-page-intro .angebot-intro-field .form-timeout-hint {
  display: block;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  padding: 0 !important;
  margin-left: 0;
  margin-right: 0;
  max-width: none;
}

.konfig-page .konfig-section.card-dark,
.konfig-page .konfig-total-card.card-dark {
  background: rgba(10, 11, 16, 0.3) !important;
  backdrop-filter: blur(8px) saturate(1.05);
  -webkit-backdrop-filter: blur(8px) saturate(1.05);
  border: 1px solid rgba(255, 255, 255, 0.1);
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.16);
}

.konfig-page .konfig-option,
.konfig-page .fragebogen-check {
  background: rgba(10, 11, 16, 0.3);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  border: 1px solid rgba(255, 255, 255, 0.06);
}

.konfig-page .konfig-option:has(input:checked),
.konfig-page .fragebogen-check:has(input:checked) {
  background: rgba(197, 164, 110, 0.22);
  border-color: var(--gold, #c5a46e);
  box-shadow: 0 0 0 1px rgba(197, 164, 110, 0.35), 0 4px 14px rgba(197, 164, 110, 0.12);
}

.konfig-page .konfig-legend,
.konfig-page .konfig-subgroup-title,
.konfig-page .konfig-route-label,
.konfig-page .konfig-field-label {
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.35);
}

.konfig-page .konfig-header .text-sm,
.konfig-page .nav-phone {
  padding: 0.35rem 0.7rem;
  border-radius: 9999px;
  background: rgba(10, 11, 16, 0.3);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border: 1px solid rgba(255, 255, 255, 0.08);
}

html[data-theme="light"] .konfig-page .konfig-page-eyebrow,
html[data-theme="light"] .konfig-page .konfig-page-title,
html[data-theme="light"] .konfig-page main .text-center > [data-i18n="konfig.page.eyebrow"],
html[data-theme="light"] .konfig-page main .text-center > #konfig-title {
  background: rgba(255, 252, 247, 0.3) !important;
  border-color: rgba(255, 255, 255, 0.55);
  box-shadow: 0 4px 14px rgba(40, 32, 20, 0.1);
}

html[data-theme="light"] .konfig-page .konfig-section.card-dark,
html[data-theme="light"] .konfig-page .konfig-total-card.card-dark {
  background: rgba(255, 252, 247, 0.3) !important;
  border-color: rgba(255, 255, 255, 0.55);
  box-shadow: 0 4px 16px rgba(40, 32, 20, 0.1);
}

html[data-theme="light"] .konfig-page .konfig-option {
  background: rgba(255, 252, 247, 0.3);
  border-color: rgba(217, 207, 192, 0.65);
}

html[data-theme="light"] .konfig-page .konfig-header .text-sm,
html[data-theme="light"] .konfig-page .nav-phone {
  background: rgba(255, 252, 247, 0.3);
  border-color: rgba(255, 255, 255, 0.55);
}

.konfig-main--wide {
  max-width: 80rem;
}

.konfig-art-picker {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.25rem;
}

@media (min-width: 768px) {
  .konfig-art-picker {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 1024px) {
  .konfig-art-picker {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

.konfig-art-card {
  display: block;
  color: inherit;
  transition: border-color 0.25s ease, transform 0.25s ease;
}

.konfig-art-card:hover {
  border-color: var(--gold);
  transform: translateY(-2px);
}

.bestattungsart-heading {
  display: flex;
  align-items: center;
  gap: 0.85rem;
  margin-bottom: 0.75rem;
  flex-wrap: wrap;
}

.bestattungsart-heading .bestattungsart-info,
.bestattungsart-heading .angebot-leistung-info {
  margin-inline-start: 0.1rem;
}

.bestattungsart-icon {
  width: 2.25rem;
  height: 2.25rem;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 1rem;
  background-color: var(--icon-tile-bg);
  color: var(--gold);
}

.bestattungsart-icon .ui-icon--art {
  width: 1.35rem;
  height: 1.35rem;
}

.bestattungsart-title {
  font-size: 1.5rem;
  font-weight: 600;
  letter-spacing: -0.02em;
  line-height: 1.2;
  color: var(--text-primary);
  margin: 0;
}

.konfig-art-card-desc {
  font-size: 1rem;
  line-height: 1.6;
  color: var(--text-muted);
}

.konfigurator-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  margin-top: 1.5rem;
  padding: 0.7rem 1.25rem;
  border-radius: 9999px;
  border: 1px solid rgba(197, 164, 110, 0.45);
  /* Fläche transparent mit Alpha 0,8 (Glas) */
  background: rgba(10, 11, 16, 0.8);
  background-color: rgba(10, 11, 16, 0.8);
  backdrop-filter: blur(7px) saturate(1.05);
  -webkit-backdrop-filter: blur(7px) saturate(1.05);
  color: var(--gold);
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-decoration: none;
  transition: background 0.2s, border-color 0.2s, color 0.2s;
}

html[data-theme="light"] .konfigurator-btn {
  background: rgba(255, 252, 247, 0.8);
  background-color: rgba(255, 252, 247, 0.8);
}

.konfigurator-btn:hover {
  background: rgba(197, 164, 110, 0.22);
  border-color: var(--gold);
  color: var(--gold-light);
}

html[data-theme="light"] .konfigurator-btn:hover {
  background: rgba(197, 164, 110, 0.28);
}

.konfigurator-btn--prominent {
  margin-top: 0;
  padding: 0.9rem 1.75rem;
  font-size: 1rem;
}

.konfig-legend {
  width: 100%;
  padding: 0;
  color: var(--text-primary);
}

/* Fallback, wenn Position ohne fragebogen-check gerendert wird */
.konfig-option:not(.fragebogen-check) {
  display: block;
  padding: 0.85rem 1rem;
  border-radius: 1rem;
  border: 1px solid var(--border);
  background: var(--konfig-option-bg);
  cursor: pointer;
  transition: border-color 0.2s, background 0.2s;
}

.konfig-option:not(.fragebogen-check):has(input:checked) {
  border-color: rgba(197, 164, 110, 0.45);
  background: rgba(197, 164, 110, 0.06);
}

/* Mit fragebogen-check: Angebot-Layout (flex, content | preis) */
.konfig-option.fragebogen-check {
  display: flex;
  align-items: flex-start;
  gap: 0.65rem;
  padding: 0.75rem 1rem;
  border-radius: 0.75rem;
}

.konfig-option--locked {
  cursor: default;
  opacity: 0.92;
}

.konfig-option--locked .konfig-input {
  cursor: not-allowed;
}

.konfig-option-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
}

.konfig-option-main {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  min-width: 0;
}

.konfig-input {
  margin-top: 0.2rem;
  accent-color: var(--gold);
  flex-shrink: 0;
}

.konfig-option-label {
  display: block;
  color: var(--text-secondary);
  font-size: 1rem;
  line-height: 1.45;
}

.konfig-option-hint {
  display: block;
  margin-top: 0.35rem;
  color: var(--text-subtle);
  font-size: 0.875rem;
  line-height: 1.4;
}

.konfig-option-price {
  color: var(--price-color);
  font-size: 1rem;
  font-weight: 600;
  white-space: nowrap;
  flex-shrink: 0;
}

.konfig-breakdown-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.konfig-breakdown-item {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  font-size: 1rem;
  color: var(--text-muted);
}

.konfig-breakdown-label {
  flex: 1;
  min-width: 0;
}

.konfig-breakdown-price {
  color: var(--price-color);
  font-weight: 500;
  white-space: nowrap;
}

/* Gesamtpreis (große Summe) und alle Preisangaben dunkelblau */
#konfig-total,
.konfig-total-card #konfig-total {
  color: var(--price-color) !important;
}

.konfig-breakdown-empty {
  color: var(--text-subtle);
  font-size: 1rem;
}

.konfig-exclusive-wrap {
  margin-top: 1.25rem;
  padding-top: 1rem;
  border-top: 1px dashed var(--border);
}

.konfig-exclusive-heading {
  color: var(--text-subtle);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  margin-bottom: 0.5rem;
}

.konfig-breakdown-list--exclusive .konfig-breakdown-item {
  font-size: 0.9375rem;
}

.konfig-total-divider {
  height: 1px;
  background: linear-gradient(to right, transparent, var(--border), transparent);
}

.konfig-submit-body {
  display: flex;
  flex-direction: column;
}

/* ── Safety Captcha ───────────────────────────────────────────────────────── */

.bmh-safety-captcha-host,
.konfig-captcha-host {
  margin: 1.25rem 0 0.5rem;
}

.bmh-safety-captcha-host:has(.bmh-safety-captcha--silent),
.konfig-captcha-host:has(.bmh-safety-captcha--silent) {
  margin: 0;
}

.bmh-safety-captcha {
  padding: 1rem 1.15rem;
  border: 1px solid rgba(197, 164, 110, 0.35);
  border-radius: 1rem;
  /* Transparenter Hintergrund alpha 0.25 */
  background: rgba(10, 11, 16, 0.25);
  backdrop-filter: blur(8px) saturate(1.05);
  -webkit-backdrop-filter: blur(8px) saturate(1.05);
}

html[data-theme="light"] .bmh-safety-captcha {
  background: rgba(255, 252, 247, 0.25);
  border-color: rgba(197, 164, 110, 0.4);
}

.bmh-safety-captcha--silent,
.sterbefall-page #sterbefall-form .bmh-safety-captcha--silent,
html[data-theme="light"] .bmh-safety-captcha--silent,
html[data-theme="light"] .sterbefall-page #sterbefall-form .bmh-safety-captcha--silent {
  padding: 0;
  border: 0;
  background: transparent !important;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  box-shadow: none;
}

/* Trauerfall digital melden: Sicherheitsprüfung wie Abschnitte 1–5 (Glas) */
.sterbefall-page #sterbefall-form .bmh-safety-captcha-host {
  margin-top: 0;
}

.sterbefall-page #sterbefall-form .bmh-safety-captcha {
  padding: 1.35rem 1.35rem 1.5rem;
  border-radius: 1.25rem;
  background: rgba(10, 11, 16, 0.25) !important;
  backdrop-filter: blur(8px) saturate(1.05);
  -webkit-backdrop-filter: blur(8px) saturate(1.05);
  border: 1px solid rgba(255, 255, 255, 0.1);
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.16);
}

.sterbefall-page #sterbefall-form .bmh-safety-captcha__label {
  color: #000 !important;
}

@media (min-width: 768px) {
  .sterbefall-page #sterbefall-form .bmh-safety-captcha {
    padding: 1.6rem 1.75rem 1.75rem;
  }
}

html[data-theme="light"] .sterbefall-page #sterbefall-form .bmh-safety-captcha {
  background: rgba(255, 252, 247, 0.25) !important;
  border-color: rgba(255, 255, 255, 0.55);
  box-shadow: 0 4px 16px rgba(40, 32, 20, 0.1);
}

/* Bestätigungshinweis unter dem Absende-Button — Glas */
.form-email-confirm-note,
#sterbefall-form [data-i18n="sterbefall.submit_note"],
.sterbefall-page #sterbefall-form [data-i18n="sterbefall.submit_note"] {
  display: block;
  width: fit-content;
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding: 0.65rem 1.15rem;
  border-radius: 0.9rem;
  color: #000;
  background: rgba(255, 252, 247, 0.92);
  backdrop-filter: blur(8px) saturate(1.05);
  -webkit-backdrop-filter: blur(8px) saturate(1.05);
  border: 1px solid rgba(0, 0, 0, 0.12);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.16);
}

html[data-theme="light"] .form-email-confirm-note,
html[data-theme="light"] #sterbefall-form [data-i18n="sterbefall.submit_note"],
html[data-theme="light"] .sterbefall-page #sterbefall-form [data-i18n="sterbefall.submit_note"] {
  color: #000;
  background: rgba(255, 252, 247, 0.3);
  border-color: rgba(255, 255, 255, 0.55);
  box-shadow: 0 4px 14px rgba(40, 32, 20, 0.1);
}

.bmh-safety-captcha__label {
  display: block;
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--text, #f1e9df);
  margin-bottom: 0.35rem;
}

.bmh-safety-captcha__hint {
  margin: 0 0 0.75rem;
  font-size: 0.82rem;
  color: var(--text-muted, #a88f5f);
  line-height: 1.4;
}

.bmh-safety-captcha__row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.65rem;
}

.bmh-safety-captcha__question {
  font-weight: 600;
  color: #000;
  min-width: 7rem;
}

.bmh-safety-captcha__input {
  flex: 1 1 7rem;
  min-width: 6rem;
  max-width: 10rem;
  border-radius: 0.85rem !important;
  padding: 0.7rem 0.9rem !important;
  font-size: 0.95rem !important;
  text-align: center;
}

.bmh-safety-captcha__refresh {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.6rem;
  height: 2.6rem;
  flex-shrink: 0;
  border-radius: 0.85rem;
  border: 1px solid rgba(197, 164, 110, 0.45);
  background: rgba(197, 164, 110, 0.1);
  color: var(--gold, #c5a46e);
  cursor: pointer;
  transition: background 0.15s, border-color 0.15s, color 0.15s;
}

.bmh-safety-captcha__refresh-icon {
  display: block;
  width: 1.15rem;
  height: 1.15rem;
  color: inherit;
  pointer-events: none;
}

.bmh-safety-captcha__refresh:hover {
  background: rgba(197, 164, 110, 0.2);
  border-color: rgba(197, 164, 110, 0.75);
  color: var(--gold-light, #d4b88a);
}

.bmh-safety-captcha__refresh:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.konfig-field {
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
}

.konfig-field-label {
  color: var(--text-muted);
  font-size: 0.875rem;
  font-weight: 600;
  letter-spacing: 0.03em;
}

.konfig-field-input,
.konfig-field-textarea {
  width: 100%;
}

.konfig-field-textarea {
  min-height: 7rem;
  resize: vertical;
  line-height: 1.5;
}

.konfig-submit-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1rem;
}

@media (min-width: 640px) {
  .konfig-submit-grid {
    grid-template-columns: 1fr 1fr;
  }
}

.konfig-submit-actions {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  padding-top: 0.25rem;
}

@media (min-width: 640px) {
  .konfig-submit-actions {
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
  }
}

.konfig-submit-status {
  min-height: 1.25rem;
  font-size: 1rem;
  color: var(--text-subtle);
}

.konfig-submit-status--loading {
  color: var(--text-muted);
}

.konfig-submit-status--success {
  color: #8fbc8f;
}

.konfig-contact-thanks {
  text-align: center;
  padding: 1.25rem 0.5rem 0.25rem;
}

.konfig-contact-thanks__title {
  margin: 0 0 1rem;
  font-size: 2.15rem;
  color: #c5a46e;
}

.konfig-contact-thanks__lead {
  margin: 0 auto 1.75rem;
  max-width: 36rem;
  font-size: 1.08rem;
  line-height: 1.65;
  color: #f1e9df;
}

html[data-theme="light"] .konfig-contact-thanks__lead {
  color: #3a342c;
}

body.bmh-diamant-contact-only .angebot-wizard-progress,
body.bmh-diamant-contact-only .konfig-wizard-progress,
body.bmh-diamant-contact-only #konfig-wizard-footer,
body.bmh-diamant-contact-only #konfig-total-rail,
body.bmh-diamant-contact-only #konfig-total-card {
  display: none !important;
}

.konfig-submit-status--error {
  color: #e8a0a0;
}

input.bmh-field-invalid,
textarea.bmh-field-invalid,
select.bmh-field-invalid {
  outline: 2px solid #ff5555;
  outline-offset: 2px;
  border-color: #ff5555 !important;
}

.bmh-field-error {
  margin: 0.375rem 0 0;
  font-size: 0.875rem;
  line-height: 1.45;
  color: #ff5555;
}

/* Pflichtfeld-Hinweis: 3 Sekunden blau hinterlegt */
.bmh-field-focus-highlight,
input.bmh-field-focus-highlight,
select.bmh-field-focus-highlight,
textarea.bmh-field-focus-highlight,
label.bmh-field-focus-highlight,
.fragebogen-check.bmh-field-focus-highlight,
.angebot-service-chapter.bmh-field-focus-highlight,
.angebot-checkbox-subgroup.bmh-field-focus-highlight {
  background-color: rgba(59, 130, 246, 0.32) !important;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.55) !important;
  border-color: #3b82f6 !important;
  transition:
    background-color 0.2s ease,
    box-shadow 0.2s ease,
    border-color 0.2s ease;
}

html[data-theme="light"] .bmh-field-focus-highlight,
html[data-theme="light"] input.bmh-field-focus-highlight,
html[data-theme="light"] select.bmh-field-focus-highlight,
html[data-theme="light"] textarea.bmh-field-focus-highlight,
html[data-theme="light"] label.bmh-field-focus-highlight {
  background-color: rgba(59, 130, 246, 0.22) !important;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.4) !important;
}

/* Theme toggle */
.theme-toggle-wrap {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  margin: 0;
  padding: 0;
  border: none;
  background: none;
  font: inherit;
  color: inherit;
  cursor: pointer;
  text-align: left;
  -webkit-tap-highlight-color: transparent;
}

.theme-toggle-wrap:focus-visible {
  outline: none;
}

.theme-toggle-wrap:focus-visible .theme-toggle-face {
  border-color: rgba(197, 164, 110, 0.55);
  box-shadow: 0 0 0 1px rgba(197, 164, 110, 0.25);
}

.theme-toggle-wrap:hover .theme-toggle-face,
.theme-toggle-wrap:focus-visible .theme-toggle-face {
  color: var(--gold-light);
  border-color: rgba(197, 164, 110, 0.55);
}

.theme-toggle-wrap--corner {
  position: fixed;
  /* etwas tiefer in der transparenten Navbar-Leiste */
  top: calc(1.15rem + env(safe-area-inset-top, 0px));
  left: calc(0.65rem + env(safe-area-inset-left, 0px));
  z-index: 120;
  /* für animierte Strahlen hinter dem Button */
  isolation: isolate;
}

.theme-toggle-face {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.25rem;
  height: 2.25rem;
  padding: 0;
  border: 1px solid var(--border);
  border-radius: 9999px;
  background: rgba(20, 21, 28, 0.3);
  color: var(--gold);
  flex-shrink: 0;
  transition: color 0.2s ease, border-color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease;
}

.theme-toggle-icon {
  display: block;
  width: 1.05rem;
  height: 1.05rem;
  flex-shrink: 0;
  font-size: 0.95rem;
  line-height: 1;
  color: inherit;
  pointer-events: none;
  overflow: visible;
}

/* Sonnenkern + Strahlen (Hell/Dunkel-Toggle) */
.theme-toggle-icon--to-light .sun-core {
  transform-origin: 12px 12px;
  animation: sunCorePulse 3.2s ease-in-out infinite;
}

.theme-toggle-icon--to-light .sun-rays {
  transform-origin: 12px 12px;
  animation: sunRaysSpin 14s linear infinite;
}

.theme-toggle-icon--to-light .sun-rays path {
  stroke-linecap: round;
  animation: sunRayGlow 2.4s ease-in-out infinite;
}

.theme-toggle-icon--to-light .sun-rays path:nth-child(odd) {
  animation-delay: 0.35s;
}

.theme-toggle-icon--to-light .sun-rays path:nth-child(even) {
  animation-delay: 1.1s;
}

/* Dezente Sonnenstrahlen hinter dem Toggle (sichtbar im Hellmodus) */
.theme-toggle-wrap--corner::before {
  content: '';
  position: absolute;
  left: 50%;
  top: 50%;
  width: 3.6rem;
  height: 3.6rem;
  margin: -1.8rem 0 0 -1.8rem;
  border-radius: 50%;
  pointer-events: none;
  z-index: -1;
  opacity: 0;
  background: conic-gradient(
    from 0deg,
    transparent 0deg 12deg,
    rgba(212, 175, 55, 0.22) 12deg 18deg,
    transparent 18deg 42deg,
    rgba(232, 212, 139, 0.18) 42deg 48deg,
    transparent 48deg 72deg,
    rgba(212, 175, 55, 0.2) 72deg 78deg,
    transparent 78deg 102deg,
    rgba(232, 212, 139, 0.16) 102deg 108deg,
    transparent 108deg 132deg,
    rgba(212, 175, 55, 0.2) 132deg 138deg,
    transparent 138deg 162deg,
    rgba(232, 212, 139, 0.18) 162deg 168deg,
    transparent 168deg 192deg,
    rgba(212, 175, 55, 0.2) 192deg 198deg,
    transparent 198deg 222deg,
    rgba(232, 212, 139, 0.16) 222deg 228deg,
    transparent 228deg 252deg,
    rgba(212, 175, 55, 0.2) 252deg 258deg,
    transparent 258deg 282deg,
    rgba(232, 212, 139, 0.18) 282deg 288deg,
    transparent 288deg 312deg,
    rgba(212, 175, 55, 0.2) 312deg 318deg,
    transparent 318deg 342deg,
    rgba(232, 212, 139, 0.16) 342deg 348deg,
    transparent 348deg 360deg
  );
  filter: blur(0.2px);
  transition: opacity 0.35s ease;
}

html[data-theme="light"] .theme-toggle-wrap--corner::before {
  opacity: 1;
  animation: sunRaysSpin 22s linear infinite;
}

.theme-toggle-wrap--corner:hover::before {
  opacity: 1;
  filter: blur(0);
}

@keyframes sunRaysSpin {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

@keyframes sunCorePulse {
  0%, 100% { transform: scale(1); opacity: 1; }
  50% { transform: scale(1.08); opacity: 0.92; }
}

@keyframes sunRayGlow {
  0%, 100% { opacity: 0.72; stroke-width: 1.85; }
  50% { opacity: 1; stroke-width: 2.25; }
}

@media (prefers-reduced-motion: reduce) {
  .theme-toggle-icon--to-light .sun-core,
  .theme-toggle-icon--to-light .sun-rays,
  .theme-toggle-icon--to-light .sun-rays path,
  html[data-theme="light"] .theme-toggle-wrap--corner::before {
    animation: none !important;
  }
}

.theme-toggle-icon--to-dark {
  display: none !important;
}

.theme-toggle-wrap.is-light .theme-toggle-icon--to-light {
  display: none !important;
}

.theme-toggle-wrap.is-light .theme-toggle-icon--to-dark {
  display: block !important;
}

.theme-toggle-label {
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.03em;
  color: var(--text-secondary);
  white-space: nowrap;
  user-select: none;
  transition: color 0.2s ease;
}

.theme-toggle-wrap:hover .theme-toggle-label,
.theme-toggle-wrap:focus-visible .theme-toggle-label {
  color: var(--gold-light);
}

body:has(.theme-toggle-wrap--corner) {
  --theme-toggle-reserve: 10.5rem;
  --theme-toggle-reserve-nav: 8.5rem;
}

body:has(.theme-toggle-wrap--corner) .navbar-row {
  padding-left: calc(0.3rem + var(--theme-toggle-reserve-nav) + env(safe-area-inset-left, 0px));
  padding-right: calc(var(--navbar-tools-reserve, 9.5rem) + max(var(--navbar-edge-end), env(safe-area-inset-right, 0px)));
}

body:has(.theme-toggle-wrap--corner) .konfig-header > div {
  padding-left: calc(1.5rem + var(--theme-toggle-reserve) + env(safe-area-inset-left, 0px));
}

.konfig-header > div {
  position: relative;
  flex-wrap: wrap;
  row-gap: 0.75rem;
  min-width: 0;
  --navbar-edge-end: 0.15rem;
  padding-inline-end: calc(var(--navbar-tools-reserve, 9.5rem) + var(--navbar-edge-end)) !important;
}


.konfig-header .lang-switcher {
  position: absolute;
  right: calc((100vw - 100%) / -2 + max(0.75rem, env(safe-area-inset-right, 0px)));
  top: 50%;
  transform: translateY(-50%);
  z-index: 2;
  margin-left: 0;
}

.konfig-header > div > a:first-child {
  min-width: 0;
  flex: 1 1 auto;
  max-width: calc(100% - 11rem);
}

.konfig-header > div > :last-child {
  flex-shrink: 0;
  margin-left: auto;
}

.konfig-header .nav-phone {
  flex-shrink: 0;
}

@media (max-width: 767px) {
  body:has(.theme-toggle-wrap--corner) {
    --theme-toggle-reserve: 3.75rem;
    --theme-toggle-reserve-nav: 3rem;
  }

  body:has(.theme-toggle-wrap--corner) .navbar-row {
    padding-left: calc(0.2rem + var(--theme-toggle-reserve-nav) + env(safe-area-inset-left, 0px));
  }

  body:has(.theme-toggle-wrap--corner) .navbar-brand {
    margin-inline-start: -0.2rem;
  }

  .theme-toggle-wrap--corner .theme-toggle-label {
    display: none;
  }

  .konfig-header > div > a:first-child {
    max-width: calc(100% - 8.5rem);
  }
}

@media (max-width: 520px) {
  .konfig-header > div > a:first-child span {
    display: none !important;
  }

  .konfig-header .nav-phone-label {
    display: none;
  }
}

.konfig-header-left {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  min-width: 0;
}

/* Schrift +1 Stufe: Terminvereinbarung & Konfiguratoren */
.termin-page .text-xs,
#termin .text-xs,
.konfig-page .text-xs,
.angebot-page .text-xs,
.vorsorge-page .text-xs,
.sterbefall-page .text-xs {
  font-size: 0.875rem !important;
  line-height: 1.25rem !important;
}

.termin-page .text-sm,
#termin .text-sm,
.konfig-page .text-sm,
.angebot-page .text-sm,
.vorsorge-page .text-sm,
.sterbefall-page .text-sm {
  font-size: 1rem !important;
  line-height: 1.5rem !important;
}

.termin-page .text-xl,
#termin .text-xl,
.konfig-page .text-xl,
.angebot-page .text-xl,
.sterbefall-page .text-xl {
  font-size: 1.5rem !important;
  line-height: 2rem !important;
}

.termin-page .text-4xl,
#termin .text-4xl,
.konfig-page .text-4xl,
.angebot-page .text-4xl,
.sterbefall-page .text-4xl {
  font-size: 3rem !important;
  line-height: 1 !important;
}

.termin-page .text-5xl,
#termin .text-5xl,
.konfig-page .text-5xl,
.angebot-page .text-5xl,
.sterbefall-page .text-5xl {
  font-size: 3.75rem !important;
  line-height: 1 !important;
}

.termin-page .konfig-header .text-sm,
.konfig-page .konfig-header .text-sm,
/* Angebot + Termin: Herz-Logo oben mittig, Sprache rechts */
.angebot-page .konfig-header.angebot-header > .angebot-header-inner,
.angebot-page .angebot-header-inner,
.termin-page .konfig-header.termin-header > .termin-header-inner,
.termin-page .termin-header-inner {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 3.25rem;
  /* Kein asymmetrisches Tools-Padding — Logo bleibt optisch mittig */
  padding-inline-end: 1.5rem !important;
  padding-inline-start: 1.5rem !important;
}

.angebot-page .angebot-header-logo,
.termin-page .termin-header-logo {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
  z-index: 1;
}

.angebot-page .angebot-header-logo .logo-nav,
.termin-page .termin-header-logo .logo-nav {
  display: block;
}

.angebot-page .angebot-header-lang,
.angebot-page .konfig-header .angebot-header-lang,
.termin-page .termin-header-lang,
.termin-page .konfig-header .termin-header-lang {
  position: absolute;
  right: max(1.5rem, env(safe-area-inset-right, 0px));
  left: auto;
  top: 50%;
  transform: translateY(-50%);
  z-index: 2;
  margin-left: 0;
}

.angebot-page .konfig-header .text-sm,
.sterbefall-page .konfig-header .text-sm {
  font-size: 1rem !important;
  line-height: 1.5rem !important;
}

.termin-page #termin-subtitle,
#termin #termin-subtitle,
.konfig-page #konfig-subtitle,
.angebot-page main > p.mt-2,
.sterbefall-page main > p.mt-2 {
  font-size: 1.125rem;
  line-height: 1.75rem;
}

/* Light mode */
html[data-theme="light"] {
  color-scheme: light;
  --bg-deep: #f5f0e8;
  --bg-card: #ffffff;
  --bg-elevated: #faf7f2;
  --border: #d9cfc0;
  --text-primary: #1e1b18;
  --text-secondary: #3d3830;
  --text-muted: #5c5348;
  --text-subtle: #8a7a62;
  --gold: #9a7d4a;
  --gold-light: #b8965e;
  --gold-dark: #7a6338;
  --glass-panel-bg: rgba(255, 252, 247, 0.3);
  --glass-title-bg: rgba(255, 252, 247, 0.3);
  --hero-option-bg: rgba(255, 252, 247, 0.3);
  --hero-option-color: #1e1b18;
  --scroll-top-bg: rgba(255, 255, 255, 0.3);
  --scroll-top-label-color: #3d3830;
  --scroll-top-hover-bg: rgba(255, 255, 255, 1);
  --konfig-option-bg: rgba(255, 255, 255, 0.3);
  --konfig-surface-bg: rgba(255, 255, 255, 0.3);
  --konfig-dropdown-bg: rgba(255, 255, 255, 0.3);
  --icon-tile-bg: #f0ebe3;
}

html[data-theme="light"] body::before {
  filter: saturate(1.18) brightness(1.14) contrast(1.1);
}

html[data-theme="light"] body::after {
  background: linear-gradient(
      180deg,
      rgba(248, 245, 239, 0.12) 0%,
      rgba(248, 245, 239, 0.2) 40%,
      rgba(248, 245, 239, 0.38) 75%,
      rgba(248, 245, 239, 0.52) 100%
    ),
    radial-gradient(
      ellipse 90% 70% at 50% 35%,
      transparent 0%,
      rgba(248, 245, 239, 0.12) 100%
    );
}

html[data-theme="light"] #navbar,
html[data-theme="light"] #navbar.nav-scrolled,
html[data-theme="light"] .nav-scrolled {
  background-color: rgba(255, 252, 247, 0.5) !important;
  background: rgba(255, 252, 247, 0.5) !important;
}

html[data-theme="light"] #mobile-menu {
  background-color: rgba(255, 252, 247, 0.5) !important;
  background: rgba(255, 252, 247, 0.5) !important;
}

html[data-theme="light"] .theme-toggle-face {
  background: rgba(255, 255, 255, 0.3);
}

html[data-theme="light"] .sofort-bar {
  background-color: rgba(255, 252, 247, 0.5) !important;
  background: rgba(255, 252, 247, 0.5) !important;
  border-top-color: rgba(168, 72, 72, 0.28);
}

html[data-theme="light"] #soforthilfe-side:not(.sofort-side--phone):not(.sofort-side--digital),
html[data-theme="light"] #trauerfall-digital:not(.sofort-side--digital),
html[data-theme="light"] .sofort-side-fixed.sofort-bar-link:not(.sofort-side--digital):not(.sofort-side--phone) {
  background-color: #000;
  color: #fff;
  border-color: rgba(255, 255, 255, 0.22);
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.28);
}

html[data-theme="light"] #trauerfall-digital:not(.sofort-side--digital):hover,
html[data-theme="light"] #trauerfall-digital:not(.sofort-side--digital):focus-visible,
html[data-theme="light"] .sofort-side-fixed.sofort-bar-link:not(.sofort-bar-static):not(.sofort-side--digital):not(.sofort-side--phone):hover,
html[data-theme="light"] .sofort-side-fixed.sofort-bar-link:not(.sofort-bar-static):not(.sofort-side--digital):not(.sofort-side--phone):focus-visible {
  background-color: #141414;
  color: #fff;
  border-color: rgba(255, 255, 255, 0.35);
}

html[data-theme="light"] #soforthilfe-side:not(.sofort-side--phone).sofort-glow,
html[data-theme="light"] #trauerfall-digital:not(.sofort-side--digital).sofort-glow,
html[data-theme="light"] .sofort-side-fixed.sofort-glow:not(.sofort-side--digital):not(.sofort-side--phone) {
  color: #fff;
}

/* Same full backgrounds in light theme (thematic art stays dark for contrast) */
html[data-theme="light"] #trauerfall-digital.sofort-side--digital,
html[data-theme="light"] .teams-plan-fixed.sofort-side--digital {
  background-color: #0d2840;
  background-image:
    linear-gradient(
      105deg,
      rgba(8, 22, 36, 0.72) 0%,
      rgba(12, 36, 56, 0.55) 48%,
      rgba(8, 22, 36, 0.68) 100%
    ),
    url("../images/bg-side-digital.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  color: #fff;
  border-color: rgba(110, 200, 255, 0.45);
  box-shadow:
    0 2px 14px rgba(20, 90, 140, 0.28),
    inset 0 0 0 1px rgba(140, 220, 255, 0.12);
}

html[data-theme="light"] #trauerfall-digital.sofort-side--digital:hover,
html[data-theme="light"] #trauerfall-digital.sofort-side--digital:focus-visible,
html[data-theme="light"] .teams-plan-fixed.sofort-side--digital:hover,
html[data-theme="light"] .teams-plan-fixed.sofort-side--digital:focus-visible {
  background-color: #113450;
  color: #fff;
  border-color: rgba(140, 220, 255, 0.65);
}

html[data-theme="light"] #soforthilfe-side.sofort-side--phone,
html[data-theme="light"] #angebot-beratung-phone.sofort-side--phone,
html[data-theme="light"] .sterbefall-soforthilfe-fixed.sofort-side--phone {
  background-color: #0d2840;
  background-image:
    linear-gradient(
      105deg,
      rgba(8, 22, 36, 0.72) 0%,
      rgba(12, 36, 56, 0.55) 48%,
      rgba(8, 22, 36, 0.68) 100%
    ),
    url("../images/bg-side-digital.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  color: #fff;
  border-color: rgba(110, 200, 255, 0.45);
  box-shadow:
    0 2px 14px rgba(20, 90, 140, 0.28),
    inset 0 0 0 1px rgba(140, 220, 255, 0.12);
}

html[data-theme="light"] #soforthilfe-side.sofort-side--phone:hover,
html[data-theme="light"] #soforthilfe-side.sofort-side--phone:focus-visible,
html[data-theme="light"] #angebot-beratung-phone.sofort-side--phone:hover,
html[data-theme="light"] #angebot-beratung-phone.sofort-side--phone:focus-visible,
html[data-theme="light"] .sterbefall-soforthilfe-fixed.sofort-side--phone:hover,
html[data-theme="light"] .sterbefall-soforthilfe-fixed.sofort-side--phone:focus-visible {
  background-color: #113450;
  color: #fff;
  border-color: rgba(140, 220, 255, 0.65);
}

html[data-theme="light"] #trauerfall-digital.sofort-side--digital.sofort-glow,
html[data-theme="light"] .teams-plan-fixed.sofort-side--digital.sofort-glow,
html[data-theme="light"] #soforthilfe-side.sofort-side--phone.sofort-glow,
html[data-theme="light"] #angebot-beratung-phone.sofort-side--phone.sofort-glow,
html[data-theme="light"] .sterbefall-soforthilfe-fixed.sofort-side--phone.sofort-glow {
  color: #fff;
}

/* Phone theme wins over generic light fixed-phone style */
html[data-theme="light"] .sterbefall-soforthilfe-fixed.sofort-side--phone {
  background-color: #0d2840;
  color: #fff;
}

html[data-theme="light"] .team-member-portrait {
  background-color: var(--bg-elevated);
}

html[data-theme="light"] .logo-shadow {
  filter: drop-shadow(0 12px 28px rgba(0, 0, 0, 0.18));
}

html[data-theme="light"] [class*="f1e9df"] {
  color: var(--text-primary) !important;
}

html[data-theme="light"] [class*="d1c7b8"] {
  color: var(--text-secondary) !important;
}

html[data-theme="light"] [class*="b8a78a"] {
  color: var(--text-muted) !important;
}

html[data-theme="light"] [class*="a88f5f"] {
  color: var(--text-subtle) !important;
}

html[data-theme="light"] [class*="0a0b10"] {
  background-color: rgba(245, 240, 232, 0.3) !important;
}

html[data-theme="light"] [class*="2a2c36"] {
  border-color: var(--border) !important;
}

html[data-theme="light"] [class*="14151c"] {
  background-color: var(--bg-card) !important;
}

html[data-theme="light"] [class*="1f212b"] {
  background-color: var(--icon-tile-bg) !important;
}

html[data-theme="light"] .konfig-city-dropdown {
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.12);
}

html[data-theme="light"] .hero-option,
html[data-theme="light"] a.hero-option,
html[data-theme="light"] .hero-options > a.hero-option {
  background: rgba(255, 252, 247, 0.3);
  background-color: rgba(255, 252, 247, 0.3);
  border-color: rgba(255, 255, 255, 0.45);
  box-shadow: 0 4px 16px rgba(40, 32, 20, 0.08);
  backdrop-filter: blur(7px) saturate(1.05);
  -webkit-backdrop-filter: blur(7px) saturate(1.05);
}

html[data-theme="light"] .hero-option,
html[data-theme="light"] .hero-option > span:first-child {
  color: var(--hero-option-color) !important;
}

html[data-theme="light"] .hero-option:hover {
  color: var(--gold) !important;
  background: rgba(255, 252, 247, 0.3);
  background-color: rgba(255, 252, 247, 0.3);
}

/* Obere Zeile muss sich auch im Hellmodus verfärben */
html[data-theme="light"] .hero-option-wide:hover > span:first-child {
  color: var(--gold) !important;
}

/* Untere Zeile bleibt gold, verfärbt sich nicht weiter */
html[data-theme="light"] .hero-option:hover .hero-option-sub {
  color: var(--gold) !important;
}

html[data-theme="light"] .scroll-to-top {
  background: #26282c !important;
  background-image: linear-gradient(160deg, #3a3c40 0%, #26282c 48%, #1a1c1f 100%) !important;
  color: #d4b06a !important;
  border-color: #c8a25e !important;
  box-shadow:
    0 8px 24px rgba(40, 32, 20, 0.22),
    inset 0 1px 0 rgba(232, 200, 120, 0.2);
}

html[data-theme="light"] .scroll-to-top-label {
  color: #d4b06a !important;
}

html[data-theme="light"] .scroll-to-top:hover,
html[data-theme="light"] .scroll-to-top:focus-visible {
  background: #2e2a22 !important;
  background-image: linear-gradient(160deg, #4a4638 0%, #2e2a22 50%, #1f1c18 100%) !important;
  color: #f0d9a0 !important;
  border-color: #e0c992 !important;
}

html[data-theme="light"] .scroll-to-top:hover .scroll-to-top-label,
html[data-theme="light"] .scroll-to-top:focus-visible .scroll-to-top-label {
  color: #f0d9a0 !important;
}

html[data-theme="light"] .termin-calendar .termin-week-label,
html[data-theme="light"] .termin-calendar .termin-day-name,
html[data-theme="light"] .termin-calendar .termin-day-num,
html[data-theme="light"] .termin-calendar .termin-day-month,
html[data-theme="light"] .termin-calendar .termin-time:not(:hover):not(.termin-time--selected),
html[data-theme="light"] .termin-calendar .termin-summary,
html[data-theme="light"] .termin-calendar #termin-selected-day-label {
  color: #000 !important;
}

html[data-theme="light"] .termin-calendar .termin-time--booked:disabled {
  color: #4a4a4a !important;
}

html[data-theme="light"] .termin-calendar .termin-day,
html[data-theme="light"] .termin-calendar .termin-time {
  background: rgba(255, 255, 255, 0.3);
}




/* Ratgeber-Untertitel: exakt gleiche Schriftfarbe wie Öffnungszeiten-Werte (Mo–Fr) */
#ratgeber .ratgeber-subtitle,
p.ratgeber-subtitle {
  color: #f5efe6 !important;
  font-weight: 500;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.35);
}

html[data-theme="light"] #ratgeber .ratgeber-subtitle,
html[data-theme="light"] p.ratgeber-subtitle {
  color: #2a241c !important;
  text-shadow: none;
}

/* ── Diamantenbestattung / Premiumbereich ─────────────────────────── */
.leistungen-diamant-desc,
html[data-theme="light"] .leistungen-diamant-desc,
html[data-theme="dark"] .leistungen-diamant-desc,
[data-i18n="leistungen.diamantenbestattung.desc"] {
  color: #000 !important;
}

.leistungen-card--premium {
  position: relative;
  isolation: isolate;
}

.leistungen-card--premium .leistungen-card-photo {
  box-shadow: inset 0 0 0 1px rgba(212, 175, 55, 0.28);
}

.leistungen-card--premium .leistungen-card-body {
  border-color: rgba(212, 175, 55, 0.28);
  background:
    linear-gradient(180deg, rgba(212, 175, 55, 0.08), rgba(10, 11, 16, 0.28) 42%),
    rgba(10, 11, 16, 0.38);
}

html[data-theme="light"] .leistungen-card--premium .leistungen-card-body {
  border-color: rgba(166, 124, 45, 0.35);
  background:
    linear-gradient(180deg, rgba(232, 212, 139, 0.35), rgba(255, 252, 247, 0.42) 48%),
    rgba(255, 252, 247, 0.42);
}

.konfigurator-btn--premium {
  justify-content: center;
  width: 100%;
  padding: 0.85rem 1.35rem;
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.12rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  text-transform: none;
  color: #111;
  text-shadow: none;
  border: 1px solid rgba(197, 164, 110, 0.55);
  background-color: #f4f1ec;
  background-image:
    linear-gradient(180deg, rgba(255, 255, 255, 0.28) 0%, rgba(255, 252, 247, 0.38) 100%),
    url('../images/sections/btn-diamantenbestattung.jpg');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.45),
    0 4px 16px rgba(40, 32, 20, 0.16);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

.konfigurator-btn--premium:hover {
  filter: brightness(1.05);
  color: #000;
  border-color: rgba(166, 124, 45, 0.7);
}

html[data-theme="light"] .konfigurator-btn--premium {
  color: #111;
}

html[data-theme="light"] .konfigurator-btn--premium:hover {
  color: #000;
}

.angebot-leistung-group--premium {
  padding: 1.1rem 1.15rem 1.2rem;
  border-radius: 1.35rem;
  border: 1px solid rgba(197, 164, 110, 0.55);
  background-color: #f4f1ec;
  background-image:
    linear-gradient(180deg, rgba(255, 255, 255, 0.18) 0%, rgba(255, 252, 247, 0.28) 100%),
    url('../images/sections/btn-diamantenbestattung.jpg');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  box-shadow: 0 8px 28px rgba(40, 32, 20, 0.12);
}

html[data-theme="light"] .angebot-leistung-group--premium {
  border-color: rgba(166, 124, 45, 0.45);
}

.angebot-leistung-group--premium.is-premium-locked > :not(.angebot-leistung-heading):not(.angebot-leistung-photo):not(.bmh-premium-enter) {
  display: none;
}

.angebot-leistung-group--premium .angebot-leistung-title {
  letter-spacing: 0.04em;
  background: none;
  -webkit-background-clip: unset;
  background-clip: unset;
  color: #fff !important;
  text-shadow: 0 1px 8px rgba(0, 0, 0, 0.55);
}

.angebot-leistung-group--premium .bmh-premium-enter.bmh-premium-cta {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0.65rem 0 0.15rem;
  width: 100%;
  min-height: 3.15rem;
  padding: 0.85rem 1.35rem;
  overflow: hidden;
  border-radius: 999px;
}

.angebot-leistung-group--premium .bmh-premium-enter-label {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.35rem 1rem;
  font-size: 1.12rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #4a3610;
  text-shadow:
    0 1px 0 rgba(255, 255, 255, 0.9),
    0 2px 10px rgba(255, 255, 255, 0.55);
  background: none;
  pointer-events: none;
}

.angebot-leistung-group--premium .fragebogen-check,
.angebot-leistung-group--premium .fragebogen-check-content,
.angebot-leistung-group--premium .angebot-subgroup-title,
.angebot-leistung-group--premium .fragebogen-sub,
.angebot-leistung-group--premium p {
  color: #fff;
  text-shadow: 0 1px 8px rgba(0, 0, 0, 0.55);
}

.angebot-leistung-group--premium .bmh-diamant-weiter,
body.bmh-diamant-marble .angebot-wizard-btn.angebot-wizard-btn--next:not(.angebot-wizard-btn--confirm-email),
body.bmh-diamant-marble #konfig-wizard-next.angebot-wizard-btn--next,
#angebot-form.is-diamant-marble .angebot-wizard-btn.angebot-wizard-btn--next:not(.angebot-wizard-btn--confirm-email),
#konfig-form.is-diamant-marble #konfig-wizard-next.angebot-wizard-btn--next {
  display: flex;
  box-sizing: border-box;
  width: 100%;
  min-height: 3.6rem;
  margin: 0;
  padding: 0.9rem 1rem;
  border-radius: 0.75rem;
  align-items: center;
  justify-content: center;
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.55rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #f7e7b0;
  text-shadow: 0 1px 10px rgba(0, 0, 0, 0.85);
  border: 2px solid #d4af37;
  background-color: #0a0a0c;
  background-image:
    linear-gradient(180deg, rgba(0, 0, 0, 0.18) 0%, rgba(0, 0, 0, 0.32) 100%),
    url('../images/sections/btn-diamant-weiter.jpg');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  box-shadow:
    inset 0 1px 0 rgba(247, 231, 176, 0.35),
    0 0 0 1px rgba(197, 164, 110, 0.35),
    0 6px 18px rgba(0, 0, 0, 0.28);
  filter: none;
}

.angebot-leistung-group--premium .bmh-diamant-weiter {
  display: none;
}

.angebot-leistung-group--premium .bmh-diamant-weiter:hover,
body.bmh-diamant-marble .angebot-wizard-btn.angebot-wizard-btn--next:not(.angebot-wizard-btn--confirm-email):hover:not(:disabled),
body.bmh-diamant-marble #konfig-wizard-next.angebot-wizard-btn--next:hover:not(:disabled),
#angebot-form.is-diamant-marble .angebot-wizard-btn.angebot-wizard-btn--next:not(.angebot-wizard-btn--confirm-email):hover:not(:disabled),
#konfig-form.is-diamant-marble #konfig-wizard-next.angebot-wizard-btn--next:hover:not(:disabled) {
  filter: brightness(1.08);
  color: #fff6d8;
  border-color: #e8d48b;
  transform: none;
  box-shadow:
    inset 0 1px 0 rgba(247, 231, 176, 0.35),
    0 0 0 1px rgba(197, 164, 110, 0.35),
    0 6px 18px rgba(0, 0, 0, 0.28);
}

.angebot-leistung-group--premium:has(input[data-is-paket="true"]:checked):has(input[data-exclusive-group="diamant_wahl"]:checked) .bmh-diamant-weiter {
  display: flex;
}

body.bmh-premium-open {
  overflow: hidden;
}

.bmh-premium-overlay {
  position: fixed;
  inset: 0;
  z-index: 12000;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 1.25rem;
  background:
    radial-gradient(ellipse at 50% 28%, rgba(42, 34, 20, 0.55), transparent 48%),
    rgba(5, 5, 7, 0.86);
  backdrop-filter: blur(14px) saturate(1.05);
  -webkit-backdrop-filter: blur(14px) saturate(1.05);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.28s ease;
}

.bmh-premium-overlay.is-visible {
  display: flex;
  opacity: 1;
  pointer-events: auto;
}

.bmh-premium-overlay[hidden] {
  display: none !important;
  pointer-events: none !important;
  opacity: 0 !important;
}

.bmh-premium-sparkle {
  pointer-events: none;
  position: absolute;
  inset: 0;
  background-image:
    radial-gradient(1px 1px at 12% 22%, rgba(247, 231, 176, 0.7), transparent 2px),
    radial-gradient(1.5px 1.5px at 78% 18%, rgba(232, 212, 139, 0.55), transparent 2.5px),
    radial-gradient(1px 1px at 64% 72%, rgba(255, 255, 255, 0.45), transparent 2px),
    radial-gradient(1px 1px at 28% 78%, rgba(212, 175, 55, 0.5), transparent 2px),
    radial-gradient(1.2px 1.2px at 88% 58%, rgba(247, 231, 176, 0.4), transparent 2px);
  opacity: 0.7;
}

.bmh-premium-stage {
  position: relative;
  width: min(40rem, 100%);
}

.bmh-premium-frame {
  padding: 1px;
  border-radius: 1.6rem;
  background: linear-gradient(160deg, rgba(247, 231, 176, 0.85), rgba(166, 124, 45, 0.45) 42%, rgba(247, 231, 176, 0.7));
  box-shadow:
    0 24px 80px rgba(0, 0, 0, 0.45),
    0 0 40px rgba(212, 175, 55, 0.12);
}

.bmh-premium-frame-inner {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: clamp(2rem, 5vw, 3.25rem) clamp(1.4rem, 4vw, 2.75rem) 2.4rem;
  border-radius: calc(1.6rem - 1px);
  background:
    radial-gradient(ellipse at 50% 0%, rgba(70, 54, 24, 0.45), transparent 52%),
    linear-gradient(180deg, #14110c 0%, #0b0b0f 100%);
  color: #f1e9df;
}

html[data-theme="light"] .bmh-premium-frame-inner {
  background:
    radial-gradient(ellipse at 50% 0%, rgba(247, 231, 176, 0.45), transparent 55%),
    linear-gradient(180deg, #fffaf1 0%, #f4ead8 100%);
  color: #2a241c;
}

.bmh-premium-close {
  position: absolute;
  top: 0.85rem;
  right: 0.85rem;
  width: 2.4rem;
  height: 2.4rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  border: 1px solid rgba(212, 175, 55, 0.35);
  background: transparent;
  color: var(--gold-light, #d4b88a);
  cursor: pointer;
}

.bmh-premium-close:hover {
  background: rgba(212, 175, 55, 0.12);
}

.bmh-premium-eyebrow {
  margin: 0 0 1.1rem;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.42em;
  text-transform: uppercase;
  color: #d4af37;
}

.bmh-premium-jewel {
  color: #e8d48b;
  margin-bottom: 1.15rem;
  filter: drop-shadow(0 0 12px rgba(232, 212, 139, 0.45));
}

.bmh-premium-jewel-svg {
  display: block;
}

.bmh-premium-title {
  margin: 0 0 1rem;
  max-width: 18ch;
  font-size: clamp(1.85rem, 4.2vw, 2.55rem);
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: 0.01em;
  background: linear-gradient(118deg, #f7e7b0 0%, #d4af37 46%, #f0df9a 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

html[data-theme="light"] .bmh-premium-title {
  background: linear-gradient(118deg, #8a6a22 0%, #c5a46e 50%, #6e5418 100%);
  -webkit-background-clip: text;
  background-clip: text;
}

.bmh-premium-email {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0.75rem;
  width: min(100%, 24rem);
  margin: 0 auto 0.25rem;
  text-align: left;
}

.bmh-premium-email-label {
  font-size: 0.92rem;
  letter-spacing: 0.04em;
  color: #f3e6c8;
}

.bmh-premium-email-input {
  width: 100%;
  min-height: 3rem;
  padding: 0.75rem 1rem;
  border-radius: 0.9rem;
  border: 1px solid rgba(197, 164, 110, 0.55);
  background: rgba(12, 10, 8, 0.45);
  color: #f7f1e6;
  font: inherit;
}

.bmh-premium-email-trap {
  position: absolute;
  left: -10000px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

.bmh-premium-email-status {
  min-height: 1.3em;
  margin: 0;
  font-size: 0.92rem;
  line-height: 1.45;
}

.bmh-premium-email-status.is-error {
  color: #e8a0a0;
}

.bmh-premium-email-status.is-success {
  color: #f3e6c8;
}

html[data-theme="light"] .bmh-premium-email-label,
html[data-theme="light"] .bmh-premium-email-status.is-success {
  color: #3a342c;
}

html[data-theme="light"] .bmh-premium-email-input {
  background: rgba(255, 255, 255, 0.72);
  color: #2a241c;
}

.bmh-premium-lead {
  margin: 0 0 1.75rem;
  max-width: 36rem;
  font-size: 1.02rem;
  line-height: 1.7;
  color: #d1c7b8;
}

html[data-theme="light"] .bmh-premium-lead {
  color: #4a4034;
}

.bmh-premium-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.65rem;
  min-height: 3.15rem;
  padding: 0.9rem 1.9rem;
  border-radius: 999px;
  border: 1px solid rgba(247, 231, 176, 0.5);
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.12rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #f7e7b0;
  text-shadow: 0 1px 10px rgba(0, 0, 0, 0.85);
  background-color: #0a0a0c;
  background-image:
    linear-gradient(180deg, rgba(0, 0, 0, 0.22) 0%, rgba(0, 0, 0, 0.38) 100%),
    url('../images/sections/btn-diamantenbestattung.jpg');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  box-shadow:
    inset 0 1px 0 rgba(255, 245, 210, 0.22),
    0 8px 24px rgba(0, 0, 0, 0.4);
  cursor: pointer;
  transition: transform 0.2s ease, box-shadow 0.2s ease, filter 0.2s ease;
}

.bmh-premium-cta:hover {
  filter: brightness(1.08);
  transform: translateY(-1px);
  color: #fff6d8;
  box-shadow:
    inset 0 1px 0 rgba(255, 245, 210, 0.3),
    0 10px 28px rgba(0, 0, 0, 0.48);
}

.bmh-premium-cta:active {
  transform: translateY(0);
  filter: brightness(0.98);
}

@media (max-width: 640px) {
  .bmh-premium-frame-inner {
    padding: 2.1rem 1.2rem 1.8rem;
  }

  .bmh-premium-cta {
    width: 100%;
    letter-spacing: 0.08em;
  }
}

/* Premium-Tab Diamantenbestattung: nur dort der Diamant als Seitenhintergrund */
body.konfig-page.bmh-diamant-marble::before {
  background: url('../images/sections/art-diamantenbestattung.jpg?v=3') center / cover no-repeat;
  filter: saturate(1.06) brightness(0.88) contrast(1.04);
}

body.konfig-page.bmh-diamant-marble::after {
  background: linear-gradient(
      180deg,
      rgba(8, 10, 16, 0.28) 0%,
      rgba(8, 10, 16, 0.42) 48%,
      rgba(8, 10, 16, 0.58) 100%
    ),
    radial-gradient(
      ellipse 90% 70% at 50% 35%,
      transparent 0%,
      rgba(8, 10, 16, 0.18) 100%
    );
}

/* Formularflächen bleiben klar — Diamant nur als Tab-Hintergrund, nicht auf den Karten */
body.konfig-page.bmh-diamant-marble #konfig-form .fragebogen-section,
body.konfig-page.bmh-diamant-marble #konfig-form .konfig-wizard-step,
body.konfig-page.bmh-diamant-marble #konfig-total-card.konfig-total-card,
#konfig-form.is-diamant-marble .fragebogen-section,
#konfig-form.is-diamant-marble .konfig-wizard-step {
  background-image: none !important;
  background-color: rgba(10, 11, 16, 0.86) !important;
}

/* Diamant: Überschriften weiß auf dem Foto */
body.konfig-page.bmh-diamant-marble #konfig-title,
body.konfig-page.bmh-diamant-marble #konfig-form .fragebogen-legend,
body.konfig-page.bmh-diamant-marble #konfig-form .konfig-legend,
html[data-theme="light"] body.konfig-page.bmh-diamant-marble #konfig-form .fragebogen-legend.konfig-legend {
  color: #fff !important;
  text-shadow: 0 1px 8px rgba(0, 0, 0, 0.55) !important;
  background: transparent !important;
  display: block;
  width: 100%;
  max-width: 100%;
  padding: 0;
  border-radius: 0;
}

body.konfig-page.bmh-diamant-marble #konfig-form .konfig-field-label,
body.konfig-page.bmh-diamant-marble #konfig-form .fragebogen-label,
body.konfig-page.bmh-diamant-marble #konfig-form .pflicht-label {
  color: #f1e9df !important;
}

body.konfig-page.bmh-diamant-marble #konfig-subtitle,
body.konfig-page.bmh-diamant-marble #konfig-timeout-hint,
body.konfig-page.bmh-diamant-marble #konfig-form .fragebogen-sub,
body.konfig-page.bmh-diamant-marble #konfig-form .konfig-route-hint,
body.konfig-page.bmh-diamant-marble #konfig-form .form-email-confirm-note,
body.konfig-page.bmh-diamant-marble #konfig-form .konfig-submit-status,
body.konfig-page.bmh-diamant-marble .konfig-page-intro .angebot-intro-field__text,
body.konfig-page.bmh-diamant-marble .konfig-contact-thanks__lead {
  color: #eadcc8 !important;
}

body.konfig-page.bmh-diamant-marble .konfig-page-intro > .angebot-intro-field,
body.konfig-page.bmh-diamant-marble #konfig-title {
  background: rgba(10, 11, 16, 0.82) !important;
}

html[data-theme="light"] body.konfig-page.bmh-diamant-marble #konfig-form .fragebogen-section,
html[data-theme="light"] body.konfig-page.bmh-diamant-marble #konfig-form .konfig-wizard-step {
  background-color: rgba(18, 16, 12, 0.88) !important;
}

html[data-theme="light"] body.konfig-page.bmh-diamant-marble #konfig-title,
html[data-theme="light"] body.konfig-page.bmh-diamant-marble #konfig-form .fragebogen-legend,
html[data-theme="light"] body.konfig-page.bmh-diamant-marble #konfig-form .konfig-legend,
html[data-theme="light"] body.konfig-page.bmh-diamant-marble #konfig-form .konfig-field-label,
html[data-theme="light"] body.konfig-page.bmh-diamant-marble #konfig-form .fragebogen-label {
  color: #f7efe4 !important;
}

body.konfig-page.bmh-diamant-marble #konfig-total-card.konfig-total-card {
  background-image: none !important;
}

.angebot-wizard-btn--confirm-email {
  flex: 1 1 100%;
  min-width: 100%;
  white-space: normal;
  line-height: 1.35;
  font-size: 0.98rem;
  letter-spacing: 0.01em;
  text-transform: none;
  padding: 0.95rem 1.1rem;
}

.angebot-wizard-nav:has(.angebot-wizard-btn--confirm-email) {
  flex-direction: column;
}

.angebot-wizard-nav:has(.angebot-wizard-btn--confirm-email) .angebot-wizard-btn--back {
  display: none;
}

/* Goldenes Premium-Schild: bleibt in allen Wizard-Abschnitten oben links */
.bmh-premium-shield {
  position: fixed;
  top: calc(4.35rem + env(safe-area-inset-top, 0px));
  left: calc(0.65rem + env(safe-area-inset-left, 0px));
  z-index: 180;
  display: none;
  width: 13.5rem;
  pointer-events: none;
  filter: drop-shadow(0 10px 18px rgba(40, 28, 6, 0.38));
}

body.angebot-page .bmh-premium-shield,
body.konfig-page .bmh-premium-shield {
  top: calc(5.35rem + env(safe-area-inset-top, 0px));
}

body.bmh-diamant-marble .bmh-premium-shield {
  display: block;
}

.fragebogen-check.is-diamant-kind-disabled,
.konfig-option.is-diamant-kind-disabled {
  opacity: 0.42;
  pointer-events: none;
}

.bmh-premium-shield-plate {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  width: 100%;
  min-height: 0;
  padding: 0.95rem 1rem 1.05rem;
  box-sizing: border-box;
  text-align: center;
  color: #0a2548;
  background:
    radial-gradient(ellipse at 50% 12%, rgba(255, 248, 220, 0.5), transparent 48%),
    linear-gradient(165deg, #f7e7b0 0%, #e6c86a 16%, #d4af37 42%, #a67c2d 78%, #f0df9a 100%);
  clip-path: none;
  border-radius: 0;
  border: 1px solid rgba(166, 124, 45, 0.55);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.62),
    inset 0 -2px 0 rgba(90, 60, 10, 0.28);
}

.bmh-premium-shield-mark {
  display: block;
  color: #0a2548;
  filter: drop-shadow(0 1px 0 rgba(255, 245, 200, 0.45));
}

.bmh-premium-shield-text {
  margin: 0;
  max-width: none;
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-size: 1.18rem;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: 0.04em;
  color: #0a2548;
  text-shadow: 0 1px 0 rgba(255, 245, 200, 0.35);
}

@media (max-width: 1200px) {
  .bmh-premium-shield {
    width: 11.6rem;
  }

  .bmh-premium-shield-plate {
    min-height: 0;
    padding: 0.8rem 0.85rem 0.9rem;
  }

  .bmh-premium-shield-text {
    font-size: 1.08rem;
  }
}

/* Trauerredner */
.trauerredner-title {
  display: inline-block;
  width: fit-content;
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding: 0.7rem 1.4rem;
  border-radius: 0.9rem;
  background: rgba(10, 11, 16, 0.3);
  backdrop-filter: blur(7px) saturate(1.05);
  -webkit-backdrop-filter: blur(7px) saturate(1.05);
  border: 1px solid rgba(255, 255, 255, 0.06);
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.12);
}

html[data-theme="light"] .trauerredner-title {
  background: rgba(255, 252, 247, 0.3);
  border-color: rgba(255, 255, 255, 0.45);
  color: #2a241c;
}

.trauerredner-intro {
  color: #b8a78a;
  font-size: 1.05rem;
  padding: 0.7rem 1.4rem;
  border-radius: 0.9rem;
  background: rgba(10, 11, 16, 0.3);
  backdrop-filter: blur(7px) saturate(1.05);
  -webkit-backdrop-filter: blur(7px) saturate(1.05);
  border: 1px solid rgba(255, 255, 255, 0.06);
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.12);
}

html[data-theme="light"] .trauerredner-intro {
  color: #5c5348;
  background: rgba(255, 252, 247, 0.3);
  border-color: rgba(255, 255, 255, 0.45);
  box-shadow: 0 4px 16px rgba(40, 32, 20, 0.08);
}

.trauerredner-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.35rem;
  align-items: stretch;
}

@media (min-width: 860px) {
  .trauerredner-grid {
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
  }
}

.trauerredner-card {
  display: flex;
  flex-direction: column;
  min-height: 100%;
  background-color: rgba(10, 11, 16, 0.32);
  backdrop-filter: blur(8px) saturate(1.05);
  -webkit-backdrop-filter: blur(8px) saturate(1.05);
  border-color: rgba(255, 255, 255, 0.1);
}

html[data-theme="light"] .trauerredner-card.card-dark {
  background-color: rgba(255, 252, 247, 0.38);
  border-color: rgba(40, 32, 20, 0.12);
}

.trauerredner-photo {
  position: relative;
  width: 100%;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  background: #1f212b;
}

.trauerredner-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 18%;
  display: block;
}

.trauerredner-photo--poster {
  background: #000;
}

.trauerredner-photo--poster img {
  object-fit: contain;
  object-position: center;
}

.trauerredner-body {
  display: flex;
  flex-direction: column;
  flex: 1;
  padding: 1.55rem 1.45rem 1.6rem;
}

.trauerredner-role {
  margin: 0 0 0.35rem;
  color: var(--gold, #c5a46e);
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

html[data-theme="light"] .trauerredner-role {
  color: #8a6a38;
}

.trauerredner-name {
  margin: 0 0 0.85rem;
  font-size: 2rem;
  font-weight: 600;
  color: #f1e9df;
  letter-spacing: -0.02em;
}

html[data-theme="light"] .trauerredner-name {
  color: #2a241c;
}

.trauerredner-text {
  margin: 0;
  color: #b8a78a;
  line-height: 1.65;
  flex: 1;
}

html[data-theme="light"] .trauerredner-text {
  color: #5c5348;
}

.trauerredner-quote {
  margin: 1.15rem 0 0;
  padding: 0.85rem 0 0.15rem 1rem;
  border-left: 2px solid rgba(197, 164, 110, 0.55);
}

.trauerredner-quote p {
  margin: 0;
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: 1.12rem;
  font-style: italic;
  line-height: 1.45;
  color: #e6d7c2;
}

html[data-theme="light"] .trauerredner-quote p {
  color: #3a332a;
}

.trauerredner-link {
  margin-top: 1.25rem;
  align-self: flex-start;
}

.trauerredner-note {
  margin: 2rem auto 0;
  max-width: 42rem;
  text-align: center;
  color: #b8a78a;
  line-height: 1.6;
}

html[data-theme="light"] .trauerredner-note {
  color: #5c5348;
}