:root {
  --navy-950: #06272c;
  --navy-900: #082f35;
  --navy-800: #0c3b42;
  --teal-700: #0f6b68;
  --teal-600: #178078;
  --teal-500: #1d978c;
  --mint-200: #cfe9e3;
  --mint-100: #e9f5f2;
  --cream: #f8fbfa;
  --ink: #0b2b2f;
  --muted: #607377;
  --danger: #d82932;
  --danger-dark: #a8121a;
  --white: #ffffff;
  --border: rgba(8, 47, 53, .10);
  --shadow-sm: 0 10px 28px rgba(5, 39, 44, .07);
  --shadow-lg: 0 24px 70px rgba(5, 39, 44, .18);
  --radius: 1.25rem;
}

html { scroll-behavior: smooth; }
body {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  color: var(--ink);
  background: #fff;
  line-height: 1.6;
}

h1, h2, h3, .brand-name {
  font-family: Georgia, "Times New Roman", serif;
  letter-spacing: -.025em;
}

a { color: var(--teal-700); }
a:hover { color: var(--teal-500); }

.emergency-topbar {
  background: linear-gradient(90deg, var(--danger-dark), var(--danger), #ec3a42);
  font-size: .92rem;
  position: relative;
  z-index: 1032;
}

.premium-nav {
  background: rgba(6, 39, 44, .90);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border-bottom: 1px solid rgba(255,255,255,.08);
  transition: .25s ease;
}
.premium-nav.nav-scrolled {
  background: rgba(6, 39, 44, .98);
  box-shadow: 0 12px 30px rgba(0,0,0,.12);
}
.navbar-brand small { color: rgba(255,255,255,.68); }
.navbar-brand .brand-name { font-size: 1.1rem; line-height: 1; }
.brand-mark {
  width: 44px; height: 44px; border-radius: 50%;
  display: grid; place-items: center;
  border: 1px solid rgba(255,255,255,.2);
  background: rgba(255,255,255,.08);
  font-size: 1.25rem;
}
.nav-link { color: rgba(255,255,255,.78) !important; font-weight: 600; }
.nav-link:hover, .nav-link:focus { color: #fff !important; }
.nav-emergency { color: #ffb8bb !important; }

.btn-emergency {
  background: linear-gradient(135deg, #f04850, var(--danger));
  color: #fff;
  border: 0;
  box-shadow: 0 12px 28px rgba(216, 41, 50, .28);
  font-weight: 700;
}
.btn-emergency:hover { background: linear-gradient(135deg, #ff5d64, #c51d26); color: #fff; transform: translateY(-1px); }

.hero-section {
  color: #fff;
  background:
    radial-gradient(circle at 82% 25%, rgba(30,151,140,.32), transparent 26%),
    radial-gradient(circle at 75% 85%, rgba(207,233,227,.10), transparent 28%),
    linear-gradient(115deg, #06272c 0%, #0a3a40 58%, #0b4f53 100%);
}
.hero-content { z-index: 2; }
.min-vh-75 { min-height: 75vh; }
.eyebrow {
  display: inline-block;
  color: var(--teal-600);
  font-size: .76rem;
  letter-spacing: .18em;
  font-weight: 800;
  text-transform: uppercase;
}
.hero-section .eyebrow { color: #90d7ce; }
.hero-title { font-size: clamp(2.75rem, 6vw, 5.5rem); line-height: .98; max-width: 850px; }
.hero-lead { color: rgba(255,255,255,.78); max-width: 620px; }
.hero-trust { color: rgba(255,255,255,.86); }
.trust-item { display: flex; align-items: center; gap: .8rem; font-size: .92rem; }
.trust-item i { font-size: 1.55rem; color: #87d9cd; }

.hero-image-card { position: relative; padding: 1rem; border-radius: 2rem; }
.glass-card {
  background: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: var(--shadow-lg);
  backdrop-filter: blur(12px);
}
.hero-placeholder { min-height: 500px; border-radius: 1.4rem; }
.availability-badge {
  position: absolute; right: -24px; bottom: 46px;
  width: 132px; height: 132px; border-radius: 50%;
  background: radial-gradient(circle at 30% 30%, #f95159, #c81f28);
  color: #fff; display: flex; flex-direction: column; align-items: center; justify-content: center;
  text-align: center; box-shadow: 0 16px 34px rgba(216,41,50,.38); border: 5px solid rgba(255,255,255,.88);
}
.availability-badge strong { font-size: 2rem; line-height: 1; }
.availability-badge span { font-size: .72rem; }

.hero-orb { position: absolute; border-radius: 50%; filter: blur(1px); opacity: .35; }
.hero-orb-1 { width: 420px; height: 420px; right: -140px; top: -130px; background: #2b9188; }
.hero-orb-2 { width: 260px; height: 260px; left: 38%; bottom: -150px; background: #123f45; }

.quick-facts-section { background: #f8fbfa; border-bottom: 1px solid var(--border); }
.quick-card {
  display: flex; gap: 1rem; align-items: flex-start; background: #fff; padding: 1.15rem 1.2rem;
  border: 1px solid var(--border); border-radius: 1rem; box-shadow: var(--shadow-sm);
}
.quick-card p { color: var(--muted); font-size: .92rem; }
.quick-card-emergency { border-color: rgba(216,41,50,.15); }
.icon-circle {
  flex: 0 0 48px; width: 48px; height: 48px; border-radius: 50%; display: grid; place-items: center;
  background: var(--mint-100); color: var(--teal-700); font-size: 1.25rem;
}
.quick-card-emergency .icon-circle { background: #fdebed; color: var(--danger); }

.section { padding: clamp(4.5rem, 8vw, 7rem) 0; }
.section-soft { background: linear-gradient(180deg, #eef7f5, #f7fbfa); }
.section-heading h2 { font-size: clamp(2.2rem, 4vw, 3.6rem); margin: .35rem 0 0; }
.section-note { color: var(--muted); max-width: 520px; }

.service-card {
  display: flex; align-items: center; gap: 1rem; padding: 1.05rem 1.15rem; height: 100%;
  background: rgba(255,255,255,.9); border: 1px solid var(--border); border-radius: 1rem;
  box-shadow: 0 8px 18px rgba(5,39,44,.04); transition: .2s ease;
}
.service-card:hover { transform: translateY(-3px); box-shadow: 0 14px 28px rgba(5,39,44,.08); }
.service-card i { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 50%; background: var(--mint-100); color: var(--teal-700); font-size: 1.15rem; }
.service-card span { font-weight: 700; }

.content-card {
  background: #fff; border: 1px solid var(--border); border-radius: var(--radius); padding: clamp(1.4rem, 3vw, 2rem);
  box-shadow: var(--shadow-sm);
}
.content-card h2 { margin-top: .4rem; }
.info-line { display: flex; align-items: flex-start; gap: .85rem; margin-bottom: 1.2rem; color: var(--muted); }
.info-line i { color: var(--teal-700); font-size: 1.25rem; margin-top: .1rem; }

.image-placeholder {
  background:
    radial-gradient(circle at 80% 20%, rgba(51,139,132,.35), transparent 22%),
    radial-gradient(circle at 25% 80%, rgba(129,214,202,.22), transparent 22%),
    linear-gradient(135deg, #123f45, #0c2f34);
  color: rgba(255,255,255,.82); border-radius: 1rem; min-height: 240px; display: grid; place-items: center; text-align: center;
  border: 1px solid rgba(255,255,255,.10); overflow: hidden;
}
.image-placeholder > div, .image-placeholder { align-items: center; justify-items: center; }
.image-placeholder i { font-size: 2rem; margin-bottom: .65rem; display: block; }
.image-placeholder span { font-weight: 700; letter-spacing: .08em; font-size: .78rem; }
.image-placeholder small { color: rgba(255,255,255,.58); }

.emergency-section { background: #fff; }
.emergency-panel {
  background: linear-gradient(145deg, #fff, #fff9f9); border: 1px solid rgba(216,41,50,.20);
  border-left: 8px solid var(--danger); border-radius: 1.35rem; padding: clamp(1.25rem, 3vw, 2rem); box-shadow: 0 18px 44px rgba(168,18,26,.08);
}
.emergency-title { font-size: clamp(3rem, 6vw, 5rem); color: var(--danger); line-height: .9; }
.emergency-call-card {
  display: flex; align-items: center; gap: 1rem; padding: 1.25rem 1.35rem; border-radius: 1rem;
  background: linear-gradient(135deg, #ef3e47, #bd151e); color: #fff; box-shadow: 0 16px 36px rgba(216,41,50,.24);
}
.emergency-call-card:hover { color: #fff; transform: translateY(-2px); }
.emergency-call-card i { font-size: 1.75rem; }
.emergency-call-card strong { display: block; font-size: 1.65rem; line-height: 1.1; }
.emergency-call-card small { display: block; color: rgba(255,255,255,.78); }
.emergency-list-card, .mini-info-card { background: #fff; border: 1px solid var(--border); border-radius: 1rem; padding: 1.35rem; }
.emergency-list { list-style: none; padding: 0; margin: 1rem 0 0; }
.emergency-list li { padding: .55rem 0 .55rem 1.6rem; border-bottom: 1px solid var(--border); position: relative; }
.emergency-list li:last-child { border-bottom: 0; }
.emergency-list li::before { content: "+"; position: absolute; left: 0; top: .44rem; color: var(--danger); font-weight: 800; }
.mini-info-card { background: #eef8f5; }
.mini-info-card-warm { background: #fff4ed; }
.mini-info-card ul { padding-left: 1.2rem; margin-bottom: 0; }

.first-aid-steps { margin-top: 1.5rem; }
.first-aid-step { display: grid; grid-template-columns: 42px 1fr; gap: 1rem; padding: 1rem 0; border-bottom: 1px solid var(--border); }
.first-aid-step > span { width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; background: var(--mint-200); color: var(--teal-700); font-weight: 800; }
.callout-box { background: var(--mint-100); color: var(--ink); padding: 1rem; border-radius: .9rem; font-weight: 700; }
.text-teal { color: var(--teal-700); }

.site-footer { background: linear-gradient(120deg, #06272c, #0a353a); }
.site-footer .brand-mark { background: rgba(255,255,255,.08); }
.footer-emergency { display: grid; gap: .25rem; padding: 1rem 1.2rem; border-radius: 1rem; background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.1); }
.footer-emergency a { color: #fff; font-size: 1.5rem; font-weight: 800; text-decoration: none; }
.footer-emergency span { color: rgba(255,255,255,.62); font-size: .86rem; }
.footer-link { color: rgba(255,255,255,.7); text-decoration: none; }
.footer-link:hover { color: #fff; }
.footer-bottom {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: .8rem 1.5rem;
}
.footer-legal-links { text-align: right; }
.footer-credit {
  color: rgba(255,255,255,.46);
  white-space: nowrap;
  font-size: .78rem;
  letter-spacing: .01em;
}
.footer-credit a {
  color: rgba(169,224,216,.82);
  text-decoration: none;
  font-weight: 700;
  transition: color .2s ease, opacity .2s ease;
}
.footer-credit a:hover { color: #fff; }

.mobile-emergency-cta {
  position: fixed; left: 12px; right: 12px; bottom: 12px; z-index: 1045; display: flex; align-items: center; justify-content: center; gap: .9rem;
  background: linear-gradient(135deg, #f14951, #bf151e); color: #fff; text-decoration: none; border-radius: 999px; padding: .8rem 1rem;
  box-shadow: 0 16px 38px rgba(216,41,50,.40); border: 3px solid rgba(255,255,255,.86);
}
.mobile-emergency-cta:hover { color: #fff; }
.mobile-emergency-cta i { font-size: 1.4rem; }
.mobile-emergency-cta span { display: grid; line-height: 1.05; }
.mobile-emergency-cta small { color: rgba(255,255,255,.78); }

@media (max-width: 991.98px) {
  .premium-nav .navbar-collapse { padding: 1rem 0 .5rem; }
  .hero-title { font-size: clamp(2.65rem, 10vw, 4.4rem); }
  .hero-placeholder { min-height: 360px; }
  .availability-badge { right: 16px; bottom: 24px; }
  body { padding-bottom: 78px; }
}

@media (max-width: 575.98px) {
  .emergency-topbar { font-size: .78rem; }
  .hero-section .btn { width: 100%; }
  .hero-trust .col-sm-4 + .col-sm-4 { margin-top: .7rem; }
  .section { padding: 4rem 0; }
  .emergency-panel { border-left-width: 5px; }
  .emergency-call-card strong { font-size: 1.4rem; }
}

/* ============================================================
   Legal pages (Impressum / Datenschutz)
   ============================================================ */
.legal-hero {
  color: #fff;
  background:
    radial-gradient(circle at 88% 15%, rgba(29,151,140,.28), transparent 24%),
    linear-gradient(135deg, #06272c 0%, #0b4146 100%);
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.legal-hero .container { padding-top: clamp(3.2rem, 7vw, 5.5rem); padding-bottom: clamp(3rem, 6vw, 5rem); }
.legal-hero h1 { font-size: clamp(2.7rem, 7vw, 5.2rem); line-height: .98; }
.legal-hero p { color: rgba(255,255,255,.72); max-width: 720px; }
.legal-back {
  display: inline-flex; align-items: center; gap: .55rem; color: #a9e0d8; text-decoration: none;
  font-weight: 700; margin-bottom: 1.2rem;
}
.legal-back:hover { color: #fff; }
.legal-main { background: linear-gradient(180deg, #f4faf8, #fff 18rem); }
.legal-shell { max-width: 980px; margin-inline: auto; }
.legal-card {
  background: rgba(255,255,255,.96); border: 1px solid var(--border); border-radius: 1.25rem;
  padding: clamp(1.25rem, 3.5vw, 2.35rem); box-shadow: var(--shadow-sm); margin-bottom: 1.15rem;
}
.legal-card h2 { font-size: clamp(1.35rem, 3vw, 1.75rem); margin-bottom: .9rem; }
.legal-card h3 { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; font-size: 1rem; font-weight: 800; margin-top: 1.35rem; }
.legal-card p:last-child, .legal-card ul:last-child { margin-bottom: 0; }
.legal-card ul { padding-left: 1.2rem; }
.legal-card li + li { margin-top: .35rem; }
.legal-contact-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .8rem; }
.legal-contact-item { padding: 1rem; border-radius: .9rem; background: var(--mint-100); }
.legal-contact-item small { display:block; text-transform: uppercase; letter-spacing: .08em; color: var(--teal-700); font-weight: 800; font-size: .68rem; }
.legal-contact-item strong, .legal-contact-item a { display:block; margin-top:.2rem; color:var(--ink); text-decoration:none; overflow-wrap:anywhere; }
.legal-todo {
  border: 1px solid #f0cf7a; background: #fff8df; color: #5d4a18; border-radius: .9rem; padding: 1rem 1.1rem;
  font-size: .92rem;
}
.legal-todo strong { color:#4e3b08; }
.legal-meta { color: var(--muted); font-size: .86rem; }
.legal-link { overflow-wrap:anywhere; }
.mobile-menu-legal { display:flex; justify-content:center; align-items:center; gap:.7rem; margin-top:.85rem; font-size:.78rem; }
.mobile-menu-legal a { color:rgba(255,255,255,.68); text-decoration:none; }
.mobile-menu-legal a:hover { color:#fff; }

@media (max-width: 767.98px) {
  .footer-bottom { grid-template-columns: 1fr; text-align: center; gap: .45rem; }
  .footer-legal-links { text-align: center; }
  .footer-credit { white-space: normal; }
  .legal-hero .container { padding-top: 2.2rem; padding-bottom: 2.35rem; }
  .legal-hero h1 { font-size: clamp(2.5rem, 12vw, 3.6rem); }
  .legal-main .section { padding-top: 2rem; padding-bottom: 3.2rem; }
  .legal-card { border-radius: 1rem; box-shadow: none; padding: 1.1rem; }
  .legal-contact-grid { grid-template-columns: 1fr; }
}

/* ============================================================
   V4 — Premium static location map
   ============================================================ */
.location-section {
  position: relative;
  overflow: hidden;
}
.location-section::before {
  content: "";
  position: absolute;
  width: 420px;
  height: 420px;
  right: -180px;
  top: -180px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(38, 149, 136, .14), rgba(38, 149, 136, 0) 70%);
  pointer-events: none;
}
.location-shell {
  position: relative;
  overflow: hidden;
  border-radius: 1.65rem;
  background: #fff;
  border: 1px solid rgba(7, 54, 59, .08);
  box-shadow: 0 24px 70px rgba(7, 54, 59, .11);
}
.location-info {
  padding: clamp(1.7rem, 3vw, 3.1rem);
  background: linear-gradient(155deg, #072f34 0%, #0b464b 100%);
  color: #fff;
  display: flex;
  flex-direction: column;
}
.location-kicker {
  display: inline-block;
  margin-bottom: .75rem;
  color: #86d7ca;
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .13em;
  text-transform: uppercase;
}
.location-title {
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(2rem, 3.2vw, 3rem);
  line-height: 1.06;
  margin-bottom: 1.8rem;
}
.location-detail {
  display: grid;
  grid-template-columns: 46px minmax(0, 1fr);
  align-items: center;
  gap: .85rem;
  padding: .9rem 0;
  border-top: 1px solid rgba(255, 255, 255, .10);
}
.location-detail-icon {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: rgba(134, 215, 202, .12);
  color: #9be4d8;
  font-size: 1.05rem;
}
.location-detail-icon.emergency {
  background: rgba(228, 48, 58, .17);
  color: #ff9197;
}
.location-detail small,
.location-detail strong { display: block; }
.location-detail small {
  color: rgba(255,255,255,.58);
  font-size: .72rem;
  text-transform: uppercase;
  letter-spacing: .06em;
  margin-bottom: .12rem;
}
.location-detail strong {
  color: #fff;
  font-size: .98rem;
}
.location-detail a { color: #fff; text-decoration: none; }
.location-route-btn {
  align-self: flex-start;
  margin-top: 1.5rem;
}
.location-hint {
  margin-top: 1rem;
  color: rgba(255,255,255,.52);
  font-size: .76rem;
  line-height: 1.45;
}
.location-map-link {
  position: relative;
  display: block;
  height: 100%;
  min-height: 500px;
  overflow: hidden;
  background: #dfeae1;
}
.location-map-link picture {
  display: block;
  width: 100%;
  height: 100%;
}
.location-map-img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transition: transform .65s cubic-bezier(.2,.7,.2,1), filter .4s ease;
}
.location-map-link:hover .location-map-img {
  transform: scale(1.018);
  filter: saturate(1.03) contrast(1.01);
}
.location-map-link::after {
  content: "";
  position: absolute;
  inset: 0;
  box-shadow: inset 0 0 0 1px rgba(7, 47, 52, .04);
  pointer-events: none;
}
.location-map-badge {
  position: absolute;
  left: 1.25rem;
  top: 1.25rem;
  display: inline-flex;
  align-items: center;
  gap: .7rem;
  padding: .75rem .9rem;
  border-radius: 1rem;
  background: rgba(6, 39, 44, .9);
  color: #fff;
  border: 1px solid rgba(255,255,255,.14);
  box-shadow: 0 12px 30px rgba(0,0,0,.18);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}
.location-map-badge i { font-size: 1.25rem; color: #91ded2; }
.location-map-badge small,
.location-map-badge strong { display: block; line-height: 1.05; }
.location-map-badge small { font-size: .63rem; color: rgba(255,255,255,.64); text-transform: uppercase; letter-spacing: .08em; }
.location-map-badge strong { margin-top: .18rem; font-size: .92rem; }


/* ============================================================
   V5 FINAL — Emergency journey + FAQ + SEO-friendly content
   ============================================================ */
.notfall-steps-section {
  padding: 1.15rem 0 0;
  background: #fff;
}
.notfall-steps-shell {
  position: relative;
  overflow: hidden;
  padding: clamp(1.35rem, 2.7vw, 2.2rem);
  border-radius: 1.45rem;
  background: linear-gradient(145deg, #fff 0%, #fff8f8 100%);
  border: 1px solid rgba(216,41,50,.17);
  box-shadow: 0 18px 42px rgba(168,18,26,.07);
}
.notfall-steps-shell::after {
  content: "";
  position: absolute;
  width: 260px;
  height: 260px;
  right: -150px;
  top: -160px;
  border-radius: 50%;
  background: rgba(216,41,50,.06);
  pointer-events: none;
}
.notfall-steps-title {
  font-size: clamp(2rem, 3.5vw, 3.15rem);
  margin: .35rem 0 .65rem;
}
.notfall-steps-shell p { color: var(--muted); max-width: 620px; }
.notfall-steps-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: .8rem;
}
.notfall-step {
  position: relative;
  min-height: 132px;
  display: grid;
  grid-template-columns: 50px 1fr;
  grid-template-rows: auto 1fr;
  column-gap: .85rem;
  align-items: center;
  padding: 1rem;
  border-radius: 1rem;
  background: #fff;
  border: 1px solid var(--border);
  color: var(--ink);
  text-decoration: none;
}
.notfall-step > i {
  grid-column: 1;
  grid-row: 1 / span 2;
  width: 50px;
  height: 50px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--mint-100);
  color: var(--teal-700);
  font-size: 1.25rem;
}
.notfall-step > div { grid-column: 2; }
.notfall-step strong, .notfall-step small { display:block; }
.notfall-step strong { font-size: .98rem; }
.notfall-step small { margin-top:.18rem; color:var(--muted); line-height:1.35; }
.notfall-step-number {
  position: absolute;
  right: .72rem;
  top: .62rem;
  color: rgba(8,47,53,.22);
  font-weight: 800;
  font-size: .75rem;
}
.notfall-step-call {
  color: #fff;
  background: linear-gradient(135deg, #ed424b, #c71922);
  border-color: transparent;
  box-shadow: 0 12px 28px rgba(216,41,50,.18);
}
.notfall-step-call:hover { color:#fff; transform:translateY(-2px); }
.notfall-step-call > i { background:rgba(255,255,255,.14); color:#fff; }
.notfall-step-call small { color:rgba(255,255,255,.76); }
.notfall-step-call .notfall-step-number { color:rgba(255,255,255,.42); }

.faq-section { position:relative; overflow:hidden; }
.faq-section::before {
  content:"";
  position:absolute;
  left:-160px;
  top:40px;
  width:360px;
  height:360px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(29,151,140,.12), transparent 70%);
  pointer-events:none;
}
.faq-intro { position:sticky; top:130px; }
.faq-intro h2 {
  font-size: clamp(2.25rem, 4vw, 3.6rem);
  line-height:1.04;
  margin:.4rem 0 1rem;
}
.faq-intro p { color:var(--muted); max-width:420px; }
.faq-call-btn { margin-top:.55rem; }
.faq-call-note { display:block; color:var(--muted); margin-top:.65rem; max-width:340px; }
.premium-accordion { display:grid; gap:.7rem; }
.premium-accordion .accordion-item {
  overflow:hidden;
  border:1px solid var(--border);
  border-radius:1rem !important;
  background:rgba(255,255,255,.94);
  box-shadow:0 8px 20px rgba(5,39,44,.04);
}
.premium-accordion .accordion-button {
  padding:1.15rem 1.2rem;
  font-weight:800;
  color:var(--ink);
  background:#fff;
  box-shadow:none !important;
}
.premium-accordion .accordion-button:not(.collapsed) {
  color:var(--teal-700);
  background:linear-gradient(90deg, #eef8f5, #fff);
}
.premium-accordion .accordion-button::after {
  width:2.25rem;
  height:2.25rem;
  margin-left:1rem;
  border-radius:50%;
  background-color:var(--mint-100);
  background-position:center;
  background-size:.9rem;
}
.premium-accordion .accordion-body {
  padding:0 1.2rem 1.2rem;
  color:var(--muted);
}
.premium-accordion .accordion-body a { text-decoration:none; }

/* Help desktop navigation remain comfortable after adding FAQ. */
@media (min-width: 992px) and (max-width: 1199.98px) {
  .premium-nav .navbar-nav { gap: .15rem !important; }
  .premium-nav .nav-link { padding-left:.42rem !important; padding-right:.42rem !important; font-size:.84rem; }
  .premium-nav .btn-emergency { padding-left:.8rem; padding-right:.8rem; font-size:.85rem; }
}

.premium-nav .nav-link.active { color:#fff !important; }
.premium-nav .nav-link.active::after { content:""; display:block; height:2px; margin-top:.18rem; border-radius:2px; background:#85d9cd; }


/* ============================================================
   V6 PRODUCTION — Security-friendly local assets + final polish
   ============================================================ */
:root { --focus: #57d3c4; }

/* Local SVG icon system */
.icon { width: 1em; height: 1em; display: inline-block; flex: 0 0 auto; vertical-align: -.125em; color: currentColor; }
.brand-mark .icon { width: 1.25rem; height: 1.25rem; }
.trust-item .icon { width: 1.55rem; height: 1.55rem; color:#87d9cd; }
.icon-circle .icon { width:1.25rem; height:1.25rem; }
.service-card .icon { width:42px; height:42px; padding:10px; border-radius:50%; background:var(--mint-100); color:var(--teal-700); }
.info-line .icon { width:1.25rem; height:1.25rem; color:var(--teal-700); margin-top:.18rem; }
.image-placeholder .icon { width:2rem; height:2rem; margin-bottom:.65rem; }
.emergency-call-card > .icon { width:1.75rem; height:1.75rem; }
.notfall-step > .icon { grid-column:1; grid-row:1 / span 2; width:50px; height:50px; padding:13px; border-radius:50%; background:var(--mint-100); color:var(--teal-700); }
.notfall-step-call > .icon { background:rgba(255,255,255,.14); color:#fff; }
.location-detail-icon .icon { width:1.05rem; height:1.05rem; }
.location-map-badge > .icon { width:1.25rem; height:1.25rem; color:#91ded2; }
.mobile-action-grid .icon, .mobile-menu-link-icon .icon, .nav-call-mobile .icon, .dock-icon .icon, .mobile-route .icon { width:1.15rem; height:1.15rem; }

/* Keyboard accessibility */
.skip-link { position:fixed; left:1rem; top:-100px; z-index:1200; padding:.65rem 1rem; border-radius:.65rem; background:#fff; color:var(--ink); font-weight:800; box-shadow:var(--shadow-lg); transition:top .15s ease; }
.skip-link:focus { top:1rem; }
:where(a, button, [tabindex]):focus-visible { outline:3px solid var(--focus); outline-offset:3px; border-radius:.35rem; }

/* Premium nav underline / active section */
@media (min-width: 992px) {
  .premium-nav .nav-link { position:relative; }
  .premium-nav .nav-link::after { content:""; position:absolute; left:.55rem; right:.55rem; bottom:.3rem; height:2px; border-radius:99px; background:#87d9cd; transform:scaleX(0); transform-origin:center; transition:transform .2s ease; }
  .premium-nav .nav-link:hover::after, .premium-nav .nav-link:focus-visible::after, .premium-nav .nav-link.active::after { transform:scaleX(1); }
  .premium-nav .nav-emergency::after { background:#ff8d93; }
}

/* Live status dot */
.topbar-24 { display:inline-flex; align-items:center; gap:.4rem; }
.status-dot { width:.48rem; height:.48rem; border-radius:50%; background:#fff; box-shadow:0 0 0 4px rgba(255,255,255,.12); }


/* Micro-polish */
.btn, .service-card, .content-card, .quick-card, .premium-accordion .accordion-item { -webkit-tap-highlight-color:transparent; }
.btn { transition:transform .18s ease, box-shadow .18s ease, background-color .18s ease, color .18s ease; }
.location-map-link:focus-visible .location-map-img { transform:scale(1.012); }

/* Reveal animation — progressive enhancement; content stays visible without JS */
.reveal-ready .reveal-on-scroll { opacity:0; transform:translateY(16px); transition:opacity .55s ease, transform .55s ease; }
.reveal-ready .reveal-on-scroll.is-visible { opacity:1; transform:none; }

/* Mobile dock can compact after scroll, but expands inside emergency sections */
@media (max-width: 991.98px) {
  .mobile-emergency-dock { transition:transform .25s ease, left .25s ease, right .25s ease, box-shadow .25s ease; }
  .mobile-emergency-dock.is-compact { left:14px; right:14px; transform:translateY(4px) scale(.965); }
  .mobile-emergency-dock.is-compact .mobile-emergency-call small { display:none; }
  .mobile-emergency-dock.is-compact .mobile-emergency-call { min-height:54px; }
  .mobile-emergency-dock.is-emergency-zone { transform:none; left:7px; right:7px; }
}


@media (prefers-reduced-motion: reduce) {
  .reveal-ready .reveal-on-scroll { opacity:1 !important; transform:none !important; }
}


.offline-phone-icon { width:3rem; height:3rem; color:var(--danger); }
.error-404-section { min-height:calc(100vh - 40px); display:grid; place-items:center; padding:4rem 0; background:radial-gradient(circle at 80% 15%,rgba(29,151,140,.25),transparent 28%),linear-gradient(145deg,#06272c,#0b4b50); }
.error-404-card { max-width:760px; margin:auto; padding:clamp(1.5rem,5vw,3.5rem); border-radius:1.6rem; text-align:center; background:rgba(255,255,255,.96); box-shadow:var(--shadow-lg); }
.error-404-card h1 { font-size:clamp(2.5rem,7vw,5rem); margin:.45rem 0 1rem; }
.error-404-card p { color:var(--muted); max-width:620px; margin:0 auto 1.5rem; }

/* ============================================================
   V6.4 NAVIGATION HOTFIX (from V6.1)
   ============================================================ */
/* Praxis and Über uns share the same desktop row. This cue makes an explicit
   Über-uns navigation target visually unambiguous without changing layout. */
#ueber-uns .content-card {
  transition: box-shadow .25s ease, border-color .25s ease, transform .25s ease;
}
#ueber-uns .content-card.nav-target-highlight {
  border-color: rgba(210, 138, 158, .56);
  box-shadow: 0 0 0 4px rgba(210, 138, 158, .12), var(--shadow-lg);
}

/* JS calculates the exact sticky-navbar offset; native margins would otherwise
   fight it and cause small jumps. */
@media (min-width: 992px) {
  section[id], #ueber-uns { scroll-margin-top: 0; }
}


/* ============================================================
   V6.7 — Praxis gallery
   ============================================================ */
.gallery-section {
  position: relative;
  overflow: hidden;
}
.gallery-section::before {
  content: "";
  position: absolute;
  width: 420px;
  height: 420px;
  left: -210px;
  top: 80px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(210,138,158,.13), transparent 69%);
  pointer-events: none;
}
.gallery-heading { position: relative; z-index: 1; }
.gallery-heading .section-note { max-width: 520px; }
.gallery-grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  grid-auto-rows: 205px;
  gap: 1rem;
  margin-top: 1.5rem;
}
.gallery-item {
  position: relative;
  grid-column: span 3;
  margin: 0;
  min-width: 0;
  overflow: hidden;
  border-radius: 1.2rem;
  border: 1px solid var(--border);
  background: #fff;
  box-shadow: var(--shadow-sm);
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
.gallery-item-feature {
  grid-column: span 6;
  grid-row: span 2;
}
.gallery-item-third { grid-column: span 4; }
.gallery-item:hover {
  transform: translateY(-3px);
  box-shadow: 0 18px 42px rgba(55,94,87,.12);
  border-color: rgba(210,138,158,.32);
}
.gallery-photo-placeholder {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  align-content: center;
  text-align: center;
  gap: .35rem;
  padding: 1.1rem;
  color: #466c65;
  background:
    radial-gradient(circle at 80% 15%, rgba(236,198,208,.62), transparent 30%),
    radial-gradient(circle at 18% 82%, rgba(201,225,219,.78), transparent 34%),
    linear-gradient(145deg, #f9fcfb, #edf5f2 55%, #fbf0f3);
}
.gallery-photo-placeholder::after {
  content: "";
  position: absolute;
  inset: 12px;
  border: 1px dashed rgba(82,126,118,.26);
  border-radius: .9rem;
  pointer-events: none;
}
.gallery-photo-placeholder .icon {
  width: 2rem;
  height: 2rem;
  color: var(--rose-600, #bd7085);
}
.gallery-photo-placeholder span {
  font-size: .74rem;
  letter-spacing: .16em;
  font-weight: 900;
}
.gallery-photo-placeholder small {
  color: var(--muted);
  font-size: .88rem;
}
.gallery-item figcaption {
  position: absolute;
  left: .8rem;
  right: .8rem;
  bottom: .8rem;
  z-index: 2;
  padding: .55rem .75rem;
  border-radius: .8rem;
  background: rgba(255,255,255,.86);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  color: var(--ink);
  font-size: .88rem;
  font-weight: 800;
  box-shadow: 0 8px 20px rgba(55,94,87,.08);
}
.gallery-footnote {
  margin-top: 1rem;
  color: var(--muted);
  font-size: .85rem;
}
.gallery-footnote .icon { color: var(--rose-600, #bd7085); }

/* With Galerie added, keep the desktop navbar comfortable at common laptop widths. */
@media (min-width: 992px) and (max-width: 1399.98px) {
  .premium-nav .navbar-nav { gap: 0 !important; }
  .premium-nav .nav-link {
    padding-left: .34rem !important;
    padding-right: .34rem !important;
    font-size: .79rem;
  }
  .premium-nav .btn-emergency {
    margin-left: .55rem !important;
    padding-left: .7rem;
    padding-right: .7rem;
    font-size: .79rem;
  }
}

@media (max-width: 991.98px) {
  .gallery-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-auto-rows: 210px;
    gap: .8rem;
  }
  .gallery-item,
  .gallery-item-third { grid-column: span 1; }
  .gallery-item-feature { grid-column: 1 / -1; grid-row: span 2; }
}

@media (max-width: 575.98px) {
  .gallery-grid {
    grid-template-columns: 1fr;
    grid-auto-rows: 250px;
  }
  .gallery-item,
  .gallery-item-third,
  .gallery-item-feature {
    grid-column: 1;
    grid-row: span 1;
  }
  .gallery-item-feature { min-height: 320px; }
}


/* ============================================================
   V6.8 — Real practice photography
   ============================================================ */
.hero-photo,
.photo-frame {
  position: relative;
  overflow: hidden;
  background: #dfece8;
  border: 1px solid rgba(255,255,255,.18);
}
.hero-photo {
  min-height: 500px;
  border-radius: 1.4rem;
}
.hero-photo picture,
.hero-photo img,
.photo-frame picture,
.photo-frame img {
  display: block;
  width: 100%;
  height: 100%;
}
.hero-photo picture,
.photo-frame picture {
  position: absolute;
  inset: 0;
}
.hero-photo img,
.photo-frame img {
  object-fit: cover;
}
.hero-photo img { object-position: 50% 42%; }
.praxis-photo, .about-photo { border-radius: 1rem; }
.praxis-photo img { object-position: 50% 50%; }
.about-photo img { object-position: 50% 40%; }

.gallery-photo-button {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: zoom-in;
}
.gallery-photo-button picture,
.gallery-photo-button .gallery-photo {
  display: block;
  width: 100%;
  height: 100%;
}
.gallery-photo-button .gallery-photo {
  object-fit: cover;
  object-position: var(--photo-position, center);
  transition: transform .35s ease, filter .35s ease;
}
.gallery-item:hover .gallery-photo { transform: scale(1.035); }
.gallery-photo-button:focus-visible {
  outline: 4px solid rgba(210,138,158,.55);
  outline-offset: -5px;
  border-radius: 1.15rem;
}
.gallery-item figcaption { pointer-events: none; }
.gallery-modal .modal-dialog { padding: .75rem; }
.gallery-modal .modal-content {
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 1.35rem;
  background: #173d3a;
  box-shadow: 0 28px 80px rgba(15,48,44,.32);
}
.gallery-modal-stage {
  position: relative;
  min-height: 240px;
  display: grid;
  place-items: center;
  background: #102d2b;
}
.gallery-modal-stage img {
  display: block;
  width: 100%;
  max-height: min(78vh, 900px);
  object-fit: contain;
  background: #102d2b;
}
.gallery-modal-close {
  position: absolute;
  z-index: 3;
  top: 1rem;
  right: 1rem;
  width: 2.6rem;
  height: 2.6rem;
  padding: .72rem;
  border-radius: 50%;
  background-color: rgba(255,255,255,.92);
  opacity: 1;
  box-shadow: 0 8px 22px rgba(0,0,0,.18);
}
.gallery-modal-caption {
  padding: .9rem 1.1rem 1rem;
  color: #fff;
  font-weight: 800;
  text-align: center;
}
@media (max-width: 991.98px) {
  .hero-photo { min-height: 360px; }
}
@media (max-width: 575.98px) {
  .hero-photo { min-height: 280px; border-radius: .95rem; }
  .gallery-modal .modal-dialog { margin: .35rem; padding: 0; }
  .gallery-modal-stage img { max-height: 75vh; }
}

/* ============================================================
   V6.9 — Support illustrations (Erste Hilfe + EU-Heimtierausweis)
   ============================================================ */
.support-media {
  position: relative;
  overflow: hidden;
  border-radius: 1rem;
  background: #f8faf8;
  border: 1px solid rgba(69, 112, 104, .18);
  box-shadow: 0 10px 28px rgba(24, 67, 61, .07);
}
.support-media picture,
.support-media img {
  display: block;
  width: 100%;
  height: 100%;
}
.support-media picture {
  position: absolute;
  inset: 0;
}
.support-media img {
  object-fit: cover;
}
.support-media-passport img { object-position: center; }
@media (hover:hover) {
  .support-media { transition: transform .25s ease, box-shadow .25s ease; }
  .support-media:hover { transform: translateY(-2px); box-shadow: 0 16px 34px rgba(24, 67, 61, .10); }
}


/* ============================================================
   V6.10 — Praxis card photo/layout refinement
   ============================================================ */
.praxis-card {
  display: flex;
  flex-direction: column;
}
.praxis-details-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .7rem;
  margin-top: 1rem;
}
.praxis-detail {
  min-width: 0;
  margin: 0;
  padding: .85rem .8rem;
  border: 1px solid var(--border);
  border-radius: .9rem;
  background: linear-gradient(145deg, rgba(241,249,247,.96), rgba(255,255,255,.98));
  color: var(--muted);
  line-height: 1.45;
}
.praxis-detail .icon {
  margin-top: .12rem;
}
.praxis-detail strong {
  color: var(--ink);
}
.praxis-detail a {
  white-space: nowrap;
}
.praxis-photo-wide {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  min-height: 0;
  overflow: hidden;
  border-radius: 1rem;
  box-shadow: 0 14px 34px rgba(33, 82, 76, .10);
}
.praxis-photo-wide picture {
  position: absolute;
  inset: 0;
}
.praxis-photo-wide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 51%;
}
@media (max-width: 1199.98px) and (min-width: 992px) {
  .praxis-details-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .praxis-detail:last-child { grid-column: 1 / -1; }
}
@media (max-width: 767.98px) {
  .praxis-details-grid { grid-template-columns: 1fr; gap: .55rem; }
  .praxis-detail { padding: .78rem .8rem; }
  .praxis-photo-wide { aspect-ratio: 4 / 3; margin-top: 1rem !important; }
}
