/* =========================================================
   AB Portfolio – Grund-CSS
   Globale Regeln aus dem bisherigen Lay-Feld „CSS for Desktop Version“,
   inhaltlich unverändert übernommen. Wird wie bisher nur oberhalb von
   Lays Handy-Breakpoint geladen (media-Attribut, siehe includes/assets.php).
   ========================================================= */

/* ---------------------------------------------------------
   1. Seite selbst scrollt nicht
   Bewusst global (Entscheidung AB, CLAUDE.md Abschnitt 6): keine vertikale
   Scrollleiste der ganzen Seite; gescrollt wird im Carousel bzw. in den
   Spalten des Split-Screen-Layouts.
   --------------------------------------------------------- */
html {
	overflow: hidden !important;
	height: 100vh !important;
	min-height: 100vh !important;
}

/* ---------------------------------------------------------
   2. Split-Screen-Layout
   Reihen mit der Lay-Klasse `split-screen-row`: jede Spalte scrollt für
   sich, mit schmaler Scrollleiste.
   --------------------------------------------------------- */
.split-screen-row {
	margin-top: 70px;
}

.split-screen-row .col {
	height: calc(100vh - 70px) !important;
	overflow-y: scroll !important;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: thin !important;
	scrollbar-color: #000 #fff !important;
}

.split-screen-row .col::-webkit-scrollbar {
	display: block !important;
	width: 6px;
}

.split-screen-row .col::-webkit-scrollbar-track {
	background: transparent;
}

.split-screen-row .col::-webkit-scrollbar-thumb {
	background-color: rgba(0, 0, 0, 0.3);
	border-radius: 3px;
}

/* ---------------------------------------------------------
   3. Overlay (Lay-Seiten-Overlay)
   Weißer Hintergrund und Ebene über dem Inhalt, aber unter dem Cursor.
   --------------------------------------------------------- */
.lay-overlay {
	z-index: 2147483600 !important;
	background-color: #fff !important;
}

/* Inhalte im Overlay dürfen aus den Spalten herausragen (Imagehover-Bilder). */
.lay-overlay .row,
.lay-overlay .col,
.lay-overlay .column-wrap {
	overflow: visible !important;
}

/* ---------------------------------------------------------
   4. Imagehover-Add-on
   Das Hover-Bild liegt auf der obersten Ebene.
   --------------------------------------------------------- */
.lay-imagehover-on-element {
	z-index: 999999999 !important;
}

/* Safari: Neuzeichnen im Overlay erzwingen. */
.lay-overlay .lay-imagehover-on-element {
	transform: translateZ(0);
	will-change: transform;
}