/*
 * Ausschnitt ohne Kopie (siehe includes/ausschnitt.php).
 *
 * Das Bild wird um den Fokuspunkt vergrößert und mit clip-path genau auf
 * seinen bisherigen Rahmen zurückgeschnitten. Die Werte setzt das Plugin
 * als Variablen an den Block – auf der Website per PHP, im Editor per
 * JavaScript. Diese eine Regel gilt für beide.
 *
 * "scale" statt "transform": Die Eigenschaft wirkt zusätzlich zu einer
 * etwaigen transform-Angabe des Themes und überschreibt sie nicht.
 */
.msds-ausschnitt img {
	scale: var(--msds-zoom, 1);
	transform-origin: var(--msds-ursprung, 50% 50%);
	object-position: var(--msds-ursprung, 50% 50%);
	clip-path: var(--msds-clip, none);
}

/* Das vergrößerte Bild ist zwar abgeschnitten, zählt für den Browser aber
   weiter in voller Größe. Am rechten Rand entstünde dadurch auf dem Handy
   eine waagerechte Bildlaufleiste. "overflow: clip" am Block verhindert
   das, ohne einen eigenen Scrollbereich anzulegen. Im Editor bleibt es
   weg, sonst würden die Anfasser zum Ändern der Bildgröße angeschnitten. */
.msds-ausschnitt:not(.block-editor-block-list__block) {
	overflow: hidden;
	overflow: clip;
}
