/* termin.css — Ergänzungen «Mehr Terminbuchungen».
   Nutzt dieselben Farben/Abstände wie main.css; Buttons selbst verwenden
   die bestehenden Klassen (btn-amber-glow + Gradient). */

html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
#termin { scroll-margin-top: 72px; }

/* Hero-CTA: goldener Button + Mikrozeile */
.ml-hero-cta { margin-top: 2.5rem; display: flex; flex-direction: column; align-items: flex-start; gap: .875rem; }
.ml-hero-cta__note { font-size: 13px; color: rgba(255,255,255,.85); letter-spacing: .01em; }
@media (min-width: 640px) { .ml-hero-cta { flex-direction: row; align-items: center; gap: 1.25rem; } }

/* Mittiger CTA nach «So läuft eine Zusammenarbeit ab» */
.ml-mid-cta { background: #060606; padding: 0 1.5rem 6rem; text-align: center; }
.ml-mid-cta .ml-hero-cta { justify-content: center; align-items: center; margin-top: 0; }

/* WhatsApp als dezenter Textlink unter dem goldenen Button */
.ml-wa-alt { margin-top: 1.25rem; text-align: inherit; }
.ml-wa-link { color: inherit; font-size: 13px; text-decoration: underline; text-underline-offset: 4px; opacity: .9; }
.ml-wa-link:hover { opacity: 1; }

/* Fixe Buchungsleiste — nur unter 768 px */
.ml-sticky-book { display: none; }
@media (max-width: 767.98px) {
  .ml-sticky-book {
    display: block; position: fixed; left: 0; right: 0; bottom: 0; z-index: 90;
    padding: 10px 16px calc(10px + env(safe-area-inset-bottom));
    background: rgba(6,6,6,.92); border-top: 1px solid rgba(255,255,255,.08);
    backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
    transition: transform .3s ease, opacity .3s ease, visibility .3s;
  }
  .ml-sticky-book.is-hidden { transform: translateY(110%); opacity: 0; pointer-events: none; visibility: hidden; }
  .ml-sticky-book a { width: 100%; }
  body.has-sticky-book { padding-bottom: calc(72px + env(safe-area-inset-bottom)); }
  body.has-sticky-book #ml-back-to-top { bottom: calc(88px + env(safe-area-inset-bottom)); }
}

/* Cookie-Banner kompakt: eine Zeile am unteren Rand */
.ml-cc { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; max-width: 72rem; margin: 0 auto; padding: .625rem 1rem; }
.ml-cc__text { flex: 1 1 260px; margin: 0; font-size: 12.5px; line-height: 1.5; color: rgba(255,255,255,.8); }
.ml-cc__text a { color: #E88A24; text-decoration: underline; text-underline-offset: 3px; }
.ml-cc__actions { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem .75rem; }
.ml-cc__btn { display: inline-flex; align-items: center; height: 34px; padding: 0 14px; border-radius: 3px; font-size: 11.5px; font-weight: 500; letter-spacing: .1em; text-transform: uppercase; color: #fff; white-space: nowrap; }
.ml-cc__btn--ghost { border: 1px solid rgba(255,255,255,.25); background: transparent; }
.ml-cc__link { font-size: 12px; color: rgba(255,255,255,.75); text-decoration: underline; text-underline-offset: 3px; white-space: nowrap; }
@media (max-width: 767.98px) { #ml-cookie-consent { max-height: 25vh; overflow-y: auto; } }