/* Ergänzungen für die statische Version (ersetzt die früheren React-Komponenten) */

/* Mobiles Hero-Bild */
.hero-mobile-img { object-position: top; }

/* Mobile-Menü */
.mobile-menu-btn { background: transparent; border: 0; cursor: pointer; }
.mobile-menu { border-top: 1px solid hsl(var(--border)); background: hsl(var(--background)); padding: .75rem 1rem 1.25rem; display: flex; flex-direction: column; gap: .25rem; }
.mobile-menu[hidden] { display: none; }
.mobile-menu a { padding: .65rem .5rem; border-radius: .375rem; font-size: 1rem; font-weight: 500; color: hsl(var(--muted-foreground)); text-decoration: none; }
.mobile-menu a:hover { background: hsl(var(--muted)); color: hsl(var(--primary)); }
.mobile-menu .mobile-menu__cta { margin-top: .5rem; text-align: center; background: hsl(var(--primary)); color: hsl(var(--primary-foreground)); }
@media (min-width: 768px) { .mobile-menu { display: none !important; } }

/* CTA-Links, die vorher Buttons waren */
a.inline-flex { text-decoration: none; }

/* FAQ als <details> */
.faq-item { display: block; }
.faq-question { list-style: none; cursor: pointer; display: flex; }
.faq-question::-webkit-details-marker { display: none; }
.faq-question svg { transition: transform .2s; }
.faq-item[open] .faq-question svg { transform: rotate(180deg); }
.faq-answer { font-size: 1.125rem; line-height: 2; }

/* Bewertungs-Slider: natives Scrollen mit Snap, funktioniert auch ohne JavaScript */
.review-viewport { overflow-x: auto; overflow-y: hidden; scroll-snap-type: x mandatory; scrollbar-width: none; scroll-behavior: smooth; }
.review-viewport::-webkit-scrollbar { display: none; }
.review-track { flex-wrap: nowrap; }
.review-slide { scroll-snap-align: start; }

/* Google-Maps-Zustimmung (Zwei-Klick-Lösung) */
.map-consent { height: 100%; min-height: 250px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .5rem; padding: 1.5rem; text-align: center; background: rgba(255,255,255,.08); color: #fff; }
.map-consent__title { font-weight: 600; font-size: 1.05rem; }
.map-consent__text { opacity: .85; }
.map-consent__btn { margin-top: .5rem; padding: .6rem 1.4rem; border: 0; border-radius: .375rem; background: #fff; color: #002A5B; font-weight: 600; cursor: pointer; }
.map-consent__btn:hover { background: rgba(255,255,255,.9); }
.map-consent__hint { font-size: .75rem; opacity: .7; max-width: 260px; }
.map-consent__hint a { text-decoration: underline; }
.map-consent iframe { width: 100%; height: 100%; min-height: 250px; border: 0; }
.map-consent.is-loaded { padding: 0; }
.review-track { margin-left: 0 !important; gap: 1rem; }
.review-slide { padding-left: 0 !important; }
.calc-empty { padding: 1rem 0; }
.mobile-menu a[aria-current="page"] { color: hsl(var(--primary)); font-weight: 600; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border-width: 0; }

/* Cookie-Einstellungen (Nachbau des Original-Dialogs, ohne Bibliotheken) */
.cookie-overlay { position: fixed; inset: 0; z-index: 9998; background: rgba(0,0,0,.8); }
.cookie-dialog { position: fixed; left: 50%; top: 50%; transform: translate(-50%,-50%); z-index: 9999;
  width: calc(100% - 2rem); max-width: 42rem; max-height: calc(100vh - 2rem); overflow-y: auto;
  background: #fff; border: 1px solid hsl(var(--border)); border-radius: .5rem; padding: 1.5rem;
  box-shadow: 0 10px 15px -3px rgba(0,0,0,.1), 0 4px 6px -4px rgba(0,0,0,.1); display: grid; gap: 1rem; }
.cookie-overlay[hidden], .cookie-dialog[hidden] { display: none; }
.cookie-close { position: absolute; right: 1rem; top: 1rem; background: none; border: 0; cursor: pointer; opacity: .7; padding: .25rem; color: hsl(var(--foreground)); }
.cookie-close:hover { opacity: 1; }
.cookie-title { font-size: 1.25rem; font-weight: 600; letter-spacing: -.025em; color: #002A5B; padding-right: 2rem; }
.cookie-desc { color: hsl(var(--muted-foreground)); font-size: 1rem; line-height: 1.5; margin-top: -.5rem; }
.cookie-list { display: grid; gap: 1rem; }
.cookie-card { display: flex; flex-direction: column; gap: .75rem; padding: 1rem; border-radius: .5rem;
  border: 1px solid hsl(var(--border)); background: hsl(var(--secondary) / .4); }
.cookie-card__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; }
.cookie-card h3 { font-weight: 600; color: hsl(var(--foreground)); }
.cookie-card p { font-size: .875rem; line-height: 1.625; color: hsl(var(--muted-foreground)); }
.cookie-always { margin-left: .5rem; font-size: .75rem; font-weight: 400; color: hsl(var(--muted-foreground)); }
.cookie-switch { flex-shrink: 0; width: 2.75rem; height: 1.5rem; border-radius: 9999px; border: 2px solid transparent;
  background: hsl(var(--input)); cursor: pointer; padding: 0; display: inline-flex; align-items: center; transition: background-color .15s; }
.cookie-switch span { display: block; width: 1.25rem; height: 1.25rem; border-radius: 9999px; background: hsl(var(--background));
  box-shadow: 0 2px 4px rgba(0,0,0,.2); transition: transform .15s; }
.cookie-switch[aria-checked="true"] { background: hsl(var(--primary)); }
.cookie-switch[aria-checked="true"] span { transform: translateX(1.25rem); }
.cookie-switch:disabled { cursor: not-allowed; opacity: .5; }
.cookie-switch:focus-visible, .cookie-btn:focus-visible, .cookie-close:focus-visible { outline: 2px solid hsl(var(--ring, var(--primary))); outline-offset: 2px; }
.cookie-more { font-size: .875rem; color: hsl(var(--muted-foreground)); }
.cookie-more a { text-decoration: underline; color: hsl(var(--primary)); }
.cookie-actions { display: flex; flex-direction: column-reverse; gap: .75rem; padding-top: .5rem; }
@media (min-width: 640px) { .cookie-actions { flex-direction: row; justify-content: flex-end; } }
.cookie-btn { height: 2.5rem; padding: 0 1rem; border-radius: .375rem; font-size: .875rem; font-weight: 500; cursor: pointer; white-space: nowrap; }
.cookie-btn--secondary { border: 1px solid hsl(var(--input)); background: hsl(var(--background)); color: hsl(var(--foreground)); }
.cookie-btn--secondary:hover { background: hsl(var(--accent)); color: hsl(var(--accent-foreground)); }
.cookie-btn--primary { border: 0; background: hsl(var(--accent)); color: hsl(var(--accent-foreground)); }
.cookie-btn--primary:hover { background: hsl(var(--accent) / .9); }
body.cookie-open { overflow: hidden; }

/* Scroll-Animationen (Ersatz für Framer Motion) */
html.anim [data-animate] { opacity: 0; transition: opacity .6s ease-out, transform .6s ease-out; transition-delay: var(--anim-delay, 0s); will-change: opacity, transform; }
html.anim [data-animate="fade-up"]    { transform: translateY(40px); }
html.anim [data-animate="hero"]       { transform: translateY(20px); }
html.anim [data-animate="slide-left"] { transform: translateX(-20px); }
html.anim [data-animate="pop"]        { transform: scale(0) rotate(-45deg); transition-timing-function: ease-out, cubic-bezier(.34,1.56,.64,1); }
html.anim [data-animate].is-in        { opacity: 1; transform: none; }
[data-progress] { transition: transform .1s linear; }
[data-parallax] { will-change: transform; }
