/* Feinschliff nach Emil Kowalskis Design-Regeln (Nov. 2026)
   Wird auf allen öffentlichen Seiten als letzte Datei geladen. */
:root {
  --fh-ease-out: cubic-bezier(0.23, 1, 0.32, 1);
  --fh-ease-in-out: cubic-bezier(0.77, 0, 0.175, 1);
}

/* 1. Tippen fühlt sich direkt an: kein grauer Blitz, keine 300ms Wartezeit */
a, button, label, summary, [role="button"], input[type="submit"], input[type="button"] {
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
}
button, .btn, .top-cta, .menu-btn, .mobile-menu-btn, .submit-btn, .st-cta,
.hero-gallery-button, .hero-story-arrow, .fotobox-request-btn, .fotobox-cta,
.gallery-feature-cta, .cta-pricing-btn, .google-link, .wedding-view-button,
.block-3-view-button, input[type="submit"] {
  -webkit-user-select: none;
  user-select: none;
}

/* 2. Knöpfe geben beim Drücken nach (scale 0.97, 160 ms) */
html button:not(:disabled), html .btn, html .top-cta, html .st-cta, html .submit-btn,
html .hero-gallery-button, html .hero-story-arrow, html .fotobox-request-btn, html .fotobox-cta,
html .gallery-feature-cta, html .cta-pricing-btn, html .google-link, html .wedding-view-button,
html .block-3-view-button, html input[type="submit"] {
  transition-property: color, background-color, border-color, box-shadow, opacity, transform, scale;
  transition-duration: 200ms, 200ms, 200ms, 200ms, 200ms, 200ms, 160ms;
  transition-timing-function: ease, ease, ease, ease, ease, var(--fh-ease-out), var(--fh-ease-out);
}
html button:not(:disabled):active, html .btn:active, html .top-cta:active, html .st-cta:active,
html .submit-btn:active, html .hero-gallery-button:active, html .hero-story-arrow:active,
html .fotobox-request-btn:active, html .fotobox-cta:active, html .gallery-feature-cta:active,
html .cta-pricing-btn:active, html .google-link:active, html .wedding-view-button:active,
html .block-3-view-button:active, html input[type="submit"]:active {
  scale: 0.97;
}

/* 3. Hover-Effekte nur mit Maus: auf dem Handy bleibt nach dem Tippen nichts "hängen" */
@media (hover: none) {
  html .portfolio-image:hover, html .portfolio-portrait:hover, html .portfolio-landscape-1:hover,
  html .portfolio-landscape-2:hover, html .portfolio-square:hover, html .story-block:hover,
  html .gallery-item:hover, html .gallery-image-item:not(.loading):hover img,
  html .fotobox-gallery img:hover, html .pricing-card:hover, html .testimonial-card:hover,
  html .btn:hover, html .btn-primary:hover, html .wedding-view-button:hover,
  html .block-3-view-button:hover, html .fotobox-request-btn:hover, html .add-tile-btn:hover,
  html .upload-plus:hover, html .lightbox-close:hover, html .pricing-close:hover,
  html .st-card:hover .st-card-img img {
    transform: none;
  }
}

/* 4. Vollbild-Fenster auf dem Handy: richtige Höhe trotz Adressleiste */
@supports (height: 100dvh) {
  html .gallery-modal { height: 100dvh; }
  @media (max-width: 680px) {
    html .pricing-dialog { max-height: 100dvh; height: 100dvh; }
  }
}

/* 5. Weniger Bewegung, wenn das im System so eingestellt ist */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto !important; }
  html button:not(:disabled):active, html .btn:active { scale: 1; }
}