/* Oymed: FAQ, Öffnungszeiten, Motion. Ruhige Bewegung (transform/opacity), alles unter prefers-reduced-motion aus. */
:root {
  --oymed-ease: cubic-bezier(0.22, 1, 0.36, 1);
  --oymed-ink: var(--secondary, #002442);
  --oymed-accent: var(--action, #5b99a6);
}

/* ---------- FAQ ---------- */
.oymed-faq {
  padding-block: var(--section-space-m, 4rem);
  padding-inline: var(--gutter, 1.5rem);
  interpolate-size: allow-keywords;
}
.oymed-faq__inner { max-width: min(var(--content-width, 1200px), 860px); margin-inline: auto; }
.oymed-faq__title { color: var(--oymed-ink); margin-block-end: var(--space-m, 1.5rem); }
.oymed-faq__item { border-block-end: 1px solid color-mix(in srgb, var(--oymed-ink) 15%, transparent); }
.oymed-faq__item:first-of-type { border-block-start: 1px solid color-mix(in srgb, var(--oymed-ink) 15%, transparent); }
.oymed-faq__q {
  display: flex; align-items: center; justify-content: space-between; gap: var(--space-s, 1rem);
  padding-block: var(--space-s, 1rem);
  font-weight: 600; color: var(--oymed-ink); cursor: pointer; list-style: none;
}
.oymed-faq__q::-webkit-details-marker { display: none; }
.oymed-faq__q::after {
  content: ""; flex: none; inline-size: 0.6em; block-size: 0.6em;
  border-inline-end: 2px solid var(--oymed-accent); border-block-end: 2px solid var(--oymed-accent);
  transform: translateY(-25%) rotate(45deg);
  transition: transform 0.3s var(--oymed-ease);
}
.oymed-faq__item[open] > .oymed-faq__q::after { transform: translateY(25%) rotate(-135deg); }
.oymed-faq__q:focus-visible { outline: 2px solid var(--focus-color, var(--oymed-accent)); outline-offset: 4px; border-radius: 2px; }
.oymed-faq__a { padding-block-end: var(--space-m, 1.5rem); max-width: 70ch; }
.oymed-faq__a > :last-child { margin-block-end: 0; }
.oymed-faq__item::details-content {
  block-size: 0; overflow: clip;
  transition: block-size 0.35s var(--oymed-ease), content-visibility 0.35s allow-discrete;
}
.oymed-faq__item[open]::details-content { block-size: auto; }

/* ---------- Öffnungszeiten / Status ---------- */
.oymed-hours { display: grid; grid-template-columns: max-content 1fr; gap: 0.35em 1.5em; margin-block: var(--space-s, 1rem) var(--space-m, 1.5rem); }
.oymed-hours dt { font-weight: 600; }
.oymed-hours dd { margin: 0; }
.oymed-open { display: inline-flex; align-items: center; gap: 0.5em; font-size: var(--text-s, 0.9rem); font-weight: 600; color: var(--oymed-ink); }
.oymed-open[hidden] { display: none; }
.oymed-open::before {
  content: ""; inline-size: 0.6em; block-size: 0.6em; border-radius: 50%;
  background: #2f8a57; box-shadow: 0 0 0 0 rgb(47 138 87 / 0.45);
  animation: oymed-pulse 2.4s var(--oymed-ease) 3;
}
.oymed-open.is-closed::before { background: #8a8f98; animation: none; }
@keyframes oymed-pulse { 70% { box-shadow: 0 0 0 0.55em rgb(47 138 87 / 0); } 100% { box-shadow: 0 0 0 0 rgb(47 138 87 / 0); } }

/* ---------- Scroll-Reveal (Klassen setzt erst das JS: ohne JS bleibt alles sichtbar) ---------- */
.oymed-reveal {
  opacity: 0; transform: translateY(20px);
  transition: opacity 0.55s var(--oymed-ease), transform 0.55s var(--oymed-ease);
  transition-delay: calc(var(--oymed-i, 0) * 70ms);
}
.oymed-reveal.is-visible { opacity: 1; transform: none; }

/* ---------- Header beim Scrollen ---------- */
.oxy-sticky-header { transition: box-shadow 0.3s var(--oymed-ease), background-color 0.3s var(--oymed-ease); }
.oxy-sticky-header.oymed-scrolled { box-shadow: 0 6px 24px -12px rgb(0 36 66 / 0.35); }

/* ---------- Karten in Rastern: leichtes Anheben bei Hover/Fokus ---------- */
@media (hover: hover) {
  .oxy-dynamic-list > :has(a) { transition: transform 0.3s var(--oymed-ease), box-shadow 0.3s var(--oymed-ease); }
  .oxy-dynamic-list > :has(a):hover { transform: translateY(-4px); box-shadow: 0 14px 30px -18px rgb(0 36 66 / 0.45); }
}
.oxy-dynamic-list > :has(a:focus-visible) { transform: translateY(-4px); box-shadow: 0 14px 30px -18px rgb(0 36 66 / 0.45); }

/* ---------- Buttons: heben sich bei Hover leicht an ---------- */
.ct-link-text, .ct-link-button { transition: transform 0.25s var(--oymed-ease), box-shadow 0.25s var(--oymed-ease), filter 0.25s var(--oymed-ease); }
@media (hover: hover) { .ct-link-text[class*="button--"]:hover, .ct-link-button:hover { transform: translateY(-2px); } }

/* ---------- Seitenwechsel: sanftes Überblenden (Browser ohne Support ignorieren es) ---------- */
@view-transition { navigation: auto; }
::view-transition-old(root), ::view-transition-new(root) { animation-duration: 0.25s; }

@media print { .oymed-reveal { opacity: 1; transform: none; } }

@media (prefers-reduced-motion: reduce) {
  .oymed-reveal { opacity: 1; transform: none; transition: none; }
  .oymed-faq__item::details-content, .oymed-faq__q::after,
  .oxy-dynamic-list > :has(a), .ct-link-text, .ct-link-button { transition: none; }
  .oxy-dynamic-list > :has(a):hover, .oxy-dynamic-list > :has(a:focus-visible),
  .ct-link-text[class*="button--"]:hover, .ct-link-button:hover { transform: none; }
  .oymed-open::before { animation: none; }
  @view-transition { navigation: none; }
}
