.flows-slider-frontend {
    width: 100% !important;
    max-width: 100vw;
    overflow: hidden;
}
details[open] .flows-slider-frontend {
    width: 100%;
    max-width: 100vw;
}
.flows-slider-frontend .swiper { position:relative; width:100%; overflow:hidden; }
.flows-slider-frontend .swiper-slide { position:relative; overflow:hidden; }
.flows-slide-media-wrap { position:absolute; inset:0; overflow:hidden; }
.flows-slide-media-wrap img,
.flows-slide-media-wrap video {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block;
    border: 0;
}
/* Force YouTube/Vimeo iframes to fill the slide */
.flows-slide-media-wrap > iframe {
    width: 100% !important;
    height: 100% !important;
    border: 0;
    display: block;
}
.flows-slide-embed { width:100%; height:100%; border:0; }
.flows-slide-embed iframe { width:100%; height:100%; border:0; }
.flows-slide-content { position:absolute; inset:0; display:flex; flex-direction:column; padding:5%; box-sizing:border-box; color:#fff; z-index:2; pointer-events:none; }
.flows-slide-title,
.flows-slide-body { text-shadow:0 2px 10px rgba(0,0,0,0.55); }
.flows-slide-title { margin:0 0 0.4em; line-height:1.2; }
.flows-slide-body { margin:0 0 1em; max-width:640px; line-height:1.5; }
.flows-slide-button { display:inline-block; padding:0.7em 1.7em; text-decoration:none; font-weight:600; pointer-events:auto; }

/* Ken Burns effect – only on images, not videos */
@keyframes flowsFrontendKenBurns {
    from { transform: scale(1); }
    to   { transform: scale(1.12); }
}
.flows-slider-frontend[data-ken-burns="1"] .swiper-slide-active .flows-slide-media-wrap img {
    animation: flowsFrontendKenBurns 8s ease-in-out infinite alternate;
}

/* --- Mute toggle (speaker icon) --- */
.flows-slide-mute-toggle {
	position: absolute;
	bottom: 60px;
	right: 30px;
	z-index: 4;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	border: none;
	background: rgba(0,0,0,0.5);
	color: #fff;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0;
}
.flows-slide-mute-toggle:hover { background: rgba(0,0,0,0.7); }
.flows-slide-mute-toggle svg {
	width: 18px;
	height: 18px;
	fill: currentColor;
}

/* --- Navigation arrows (custom, bolder) --- */
.flows-slider-frontend .swiper-button-next,
.flows-slider-frontend .swiper-button-prev {
	color: #cccccc;
	width: 30px;
	height: 30px;
	margin-top: -15px;
}
.flows-slider-frontend .swiper-button-next::after,
.flows-slider-frontend .swiper-button-prev::after {
	font-size: 24px;
	font-weight: 700;
	text-shadow: 0 0 3px rgba(0,0,0,0.4);
}
.flows-slider-frontend .swiper-button-next:hover,
.flows-slider-frontend .swiper-button-prev:hover { color: #ffffff; }

/* --- Pagination dots --- */
.flows-slider-frontend .swiper-pagination-bullet {
	background: rgba(255,255,255,0.3);
	opacity: 1;
}
.flows-slider-frontend .swiper-pagination-bullet-active { background: #333333; }
.flows-slider-frontend .swiper-pagination { z-index: 5; }

/* ========== NAVIGATION STYLE PRESETS ========== */

/* Default style – already applied, no extra rules needed */

/* Minimal style */
.flows-nav-minimal .swiper-button-next,
.flows-nav-minimal .swiper-button-prev {
    width: 20px;
    height: 20px;
    margin-top: -10px;
}
.flows-nav-minimal .swiper-button-next::after,
.flows-nav-minimal .swiper-button-prev::after {
    font-size: 16px;
    font-weight: 400;
}
.flows-nav-minimal .swiper-pagination-bullet {
    width: 6px;
    height: 6px;
    background: rgba(255,255,255,0.5);
    opacity: 1;
}
.flows-nav-minimal .swiper-pagination-bullet-active {
    background: #ffffff;
}

/* Rounded style */
.flows-nav-rounded .swiper-button-next,
.flows-nav-rounded .swiper-button-prev {
    background: rgba(0,0,0,0.4);
    border-radius: 50%;
    width: 40px;
    height: 40px;
    margin-top: -20px;
    color: #fff;
}
.flows-nav-rounded .swiper-button-next::after,
.flows-nav-rounded .swiper-button-prev::after {
    font-size: 18px;
    font-weight: 600;
}
.flows-nav-rounded .swiper-button-next:hover,
.flows-nav-rounded .swiper-button-prev:hover {
    background: rgba(0,0,0,0.6);
}
.flows-nav-rounded .swiper-pagination-bullet {
    width: 10px;
    height: 10px;
    background: rgba(255,255,255,0.5);
    opacity: 1;
    border-radius: 50%;
}
.flows-nav-rounded .swiper-pagination-bullet-active {
    background: #ffffff;
    width: 12px;
    height: 12px;
}

/* Square style */
.flows-nav-square .swiper-button-next,
.flows-nav-square .swiper-button-prev {
    background: rgba(0,0,0,0.5);
    border-radius: 2px;
    width: 36px;
    height: 36px;
    margin-top: -18px;
    color: #fff;
}
.flows-nav-square .swiper-button-next::after,
.flows-nav-square .swiper-button-prev::after {
    font-size: 20px;
    font-weight: 700;
}
.flows-nav-square .swiper-button-next:hover,
.flows-nav-square .swiper-button-prev:hover {
    background: rgba(0,0,0,0.7);
}
.flows-nav-square .swiper-pagination-bullet {
    width: 12px;
    height: 4px;
    border-radius: 2px;
    background: rgba(255,255,255,0.4);
    opacity: 1;
}
.flows-nav-square .swiper-pagination-bullet-active {
    background: #ffffff;
    width: 24px;
}