/* SG Fakten – [sg_fuhre] Kupferstich. Alles auf .sgfs beschränkt; Schutz gegen Salient-/Page-Builder-Regeln für img, svg und button.
   Max. 640 px breit (= 597 px hoch): Hero bleibt so hoch wie mit dem bisherigen 600-px-Medaillon. */
.sgfs {
	position: relative; display: block; width: 100%; max-width: 640px; margin: 0 auto; padding: 0;
	aspect-ratio: 1500 / 1400; container-type: inline-size; line-height: 0;
}
@supports not (aspect-ratio: 1) { .sgfs { height: 0; padding-top: 93.3333%; } }

/* Standbild (sofort, ohne Skript und als Rückfall) */
.sgfs img.sgfs-poster {
	position: absolute !important; inset: 0; display: block !important; width: 100% !important; height: 100% !important;
	max-width: none !important; margin: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important;
	box-shadow: none !important; object-fit: contain; opacity: 1 !important; transform: none !important;
}
.sgfs.is-swapped img.sgfs-poster { visibility: hidden; }

/* Bewegte Szene: erst sichtbar, wenn alle Ebenen dekodiert sind */
.sgfs svg.sgfs-scene {
	position: absolute; inset: 0; display: block; width: 100% !important; height: 100% !important; max-width: none !important;
	overflow: hidden; opacity: 0; transition: opacity .35s ease;
}
.sgfs.is-ready svg.sgfs-scene { opacity: 1; }
.sgfs.is-fallback svg.sgfs-scene { display: none; }
.sgfs .sgfs-jar { transform-box: view-box; }

/* Unsichtbare Trefferflächen über Gesicht und Gläsern */
.sgfs button.sgfs-hit {
	position: absolute !important; display: block; min-width: 24px !important; min-height: 24px !important;
	margin: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 12px !important;
	background: transparent !important; color: transparent !important; box-shadow: none !important;
	font-size: 0 !important; line-height: 0 !important; text-indent: 0 !important; letter-spacing: 0 !important;
	cursor: pointer; -webkit-appearance: none; appearance: none; transform: none !important; transition: none !important;
	-webkit-tap-highlight-color: transparent;
}
.sgfs button.sgfs-hit:hover, .sgfs button.sgfs-hit:active { background: transparent !important; box-shadow: none !important; }
.sgfs button.sgfs-hit:focus { outline: none; }
.sgfs button.sgfs-hit:focus-visible { outline: 3px solid #265c40 !important; outline-offset: 3px !important; box-shadow: 0 0 0 3px #faf4e4 !important; }
.sgfs button.sgfs-face {
	left: 36.6%; top: 12.7%; width: 12.6%; height: 14.1%; min-width: 44px !important; min-height: 44px !important; border-radius: 45% !important;
}
.sgfs button.sgfs-face:focus-visible { outline-offset: 4px !important; }
.sgfs button.sgfs-cargo-hit { display: none; left: 55%; top: 34%; width: 34%; height: 25%; }
.sgfs button[hidden] { display: none !important; }
/* Schmale Komponente (unabhängig von der Fensterbreite): eine große Tippfläche für die ganze Ladung */
@container (max-width: 479px) {
	.sgfs button.sgfs-jar-hit { display: none !important; }
	.sgfs button.sgfs-cargo-hit:not([hidden]) { display: block; }
}

/* Pause / Abspielen */
.sgfs button.sgfs-pp {
	position: absolute !important; right: 1.5%; bottom: 1.5%; z-index: 2;
	width: 44px !important; height: 44px !important; min-width: 44px !important; min-height: 44px !important;
	margin: 0 !important; padding: 0 !important; border-radius: 50% !important; border: 1.5px solid #265c40 !important;
	background: #faf4e4 !important; color: #265c40 !important; box-shadow: none !important;
	display: grid !important; place-items: center; cursor: pointer; line-height: 1 !important; font-size: 0 !important;
	text-transform: none !important; letter-spacing: 0 !important; transform: none !important; opacity: 1 !important;
}
.sgfs button.sgfs-pp[hidden] { display: none !important; }
.sgfs button.sgfs-pp:hover { background: #eae9d7 !important; color: #174b31 !important; border-color: #174b31 !important; }
.sgfs button.sgfs-pp:focus { outline: none; }
.sgfs button.sgfs-pp:focus-visible { outline: 3px solid #265c40 !important; outline-offset: 3px !important; }
.sgfs .sgfs-pp svg { display: block; width: 18px !important; height: 18px !important; fill: currentColor; }
.sgfs .sgfs-pp .sgfs-i-play { display: none; }
.sgfs .sgfs-pp.is-paused .sgfs-i-play { display: block; }
.sgfs .sgfs-pp.is-paused .sgfs-i-pause { display: none; }

.sgfs .sgfs-status {
	position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden;
	clip-path: inset(50%); white-space: nowrap; border: 0;
}
@container (max-width: 479px) {
	.sgfs button.sgfs-pp { right: 0; bottom: 0; }   /* frei vom Hinterrad */
}
@media (forced-colors: active) {
	.sgfs button.sgfs-pp { border-color: ButtonText !important; }
	.sgfs button.sgfs-hit:focus-visible { outline-color: Highlight !important; }
}
