@charset "UTF-8";

/**
 * swipers.css 1.0.0
 *
 * Carousel management styles for Swiper.js instances.
 *
 * SWIPER-CONTAINER
 * .swiper-container      — base carousel wrapper
 * .swiper-container.min  — absolute controls variant
 * .swiper-container.off  — disabled state (< 2 slides)
 *
 * CONTROLS
 * .swiper-controls       — prev/next/pagination wrapper
 * .swiper-controls.full  — space-between layout
 *
 * SWIPERABLE
 * .grid.swiperable       — grid-to-swiper conversion
 * nav.swiperable         — nav-to-swiper conversion
 */


/* ============================================== */
/* ==================== VARS ==================== */
/* ============================================== */

/* ========== GLOBAL ========== */

:root {
	--swiper-gap: 1em;

	--swiper-disabled-opacity: .33;
	--swiper-disabled-filter: grayscale(.33);
	
	--swiper-controls-font-size: var(--font-size);
	--swiper-controls-bullet-size: 1em;
	--swiper-controls-fraction-size: .375em;

	--swiper-controls-button-top: 50%;
	--swiper-controls-button-position: translate(0%, -50%);

	--swiper-min-controls-previous-from: translate(-100%, -50%);
	--swiper-min-controls-previous-to: translate(-50%, -50%);
	--swiper-min-controls-next-from: translate(100%, -50%);
	--swiper-min-controls-next-to: translate(50%, -50%);

	--swiper-full-controls-button-top: 50%;
	--swiper-full-controls-previous-from: translate(-100%, -50%);
	--swiper-full-controls-previous-to: translate(50%, -50%);
	--swiper-full-controls-next-from: translate(100%, -50%);
	--swiper-full-controls-next-to: translate(-50%, -50%);

	--swiper-scrollbar-size: .5rem;
}


/* ========== SIZES ========== */

@media (min-width: 0px) {
	.swiper-container,
	.medium-size {
		--slide-width: calc(100% / var(--slides-per-row)); /* - var(--grid-gap));*/
		--slides-per-row: 1;
	}
	.short-size {
		--slides-per-row: 2;
	}
	.min-size {
		--slides-per-row: 3;
	}
}
@media (min-width: 760px) {
	.swiper-container {
		--slides-per-row: 1;
	}
	.medium-size {
		--slides-per-row: 2;
	}
	.short-size {
		--slides-per-row: 3;
	}
	.min-size {
		--slides-per-row: 6;
	}
}


/* ========== @MEDIA ========== */

@media (max-width: 1000px) {
	:root {
		--swiper-controls-font-size: calc(var(--font-size) * .75);

		--swiper-min-controls-previous-to: translate(25%, -50%);
		--swiper-min-controls-next-to: translate(-25%, -50%);

		--swiper-full-controls-button-top: 100%;
		--swiper-full-controls-previous-from: translate(-50%, -150%);
		--swiper-full-controls-previous-to: translate(50%, -150%);
		--swiper-full-controls-next-from: translate(50%, -150%);
		--swiper-full-controls-next-to: translate(-50%, -150%);
	}
}


/* ==================================================== */
/* ==================== ANIMATIONS ==================== */
/* ==================================================== */

/* ========== DEFAULT ========== */

:root {
	--swiper-wrapper-transition-timing-function: var(--ease);
}

.swiper-container.is-faster {
	--swiper-wrapper-transition-timing-function: var(--ease-fast);
}

.swiper-slide-content {
	transition: opacity var(--duration-normal) var(--easeInQuint);
}
.swiper-controls a {
	transition: all var(--duration-fast) var(--easeInQuint);
}

/* ========== NAV ========== */

nav.swiperable {
	transition: opacity var(--duration-fast) var(--ease);
}

/* ========== CUSTOM ========== */

.images .swiper-container {
	--swiper-wrapper-transition-timing-function: var(--easeInOutQuint-fast);
}
.content .swiper-container {
	--swiper-wrapper-transition-timing-function: var(--easeInOutQuint);
}


/* ================================================ */
/* ==================== GLOBAL ==================== */
/* ================================================ */

/* .clipped for inside <section-content> + <aside> */

/* ====================================== */
/* ========== SWIPER-CONTAINER ========== */
/* ====================================== */

.swiper-container {
	position: relative;
	width: 100%;
}
.swiper-container.onload {
	opacity: 0;
	overflow: hidden;
}

/* ================================== */
/* ========== SWIPER-SLIDE ========== */
/* ================================== */

.swiper-slide {
	display: flex;
	height: auto;
	margin: 0;
}


/* ========================================== */
/* ========== SWIPER-SLIDE-CONTENT ========== */
/* ========================================== */

.swiper-container .swiper-slide-content {
	position: relative;
	height: 100%;
	width: 100%;
	opacity: var(--swiper-disabled-opacity);
}
.swiper-slide.swiper-slide-active .swiper-slide-content {
	opacity: 1;
}


/* ============================= */
/* ========== CLIPPED ========== */
/* ============================= */

body.onload .swiper-container.clipped {
	overflow-y: visible;
	overflow-x: clip;
}
body.onload .swiper-container.clipped .swiper-slide .swiper-slide-content {
	transition: none;
}
/*body.onload .swiper-container.clipped .swiper-slide .swiper-slide-content,*/
/*
.swiper-container.clipped .swiper-slide.swiper-slide-prev .swiper-slide-content,
.swiper-container.clipped .swiper-slide.swiper-slide-next .swiper-slide-content {
	opacity: 0;
	pointer-events: none;
}
*/
.swiper-container.clipped .swiper-slide:not(.swiper-slide-visible) .swiper-slide-content {
    opacity: 0;
    pointer-events: none;
}

/* ========================================= */
/* ========== SWIPER NOTIFICATION ========== */
/* ========================================= */

.swiper-notification {
	position: absolute;
	z-index: -1000;
	top: 0;
	left: 0;
	pointer-events: none;
	opacity: 0;
}

/* ========== ON OFF ========== */

/* JS > if < 2 slides */

.swiper-container.off .swiper-wrapper {
	transform: translate3d(0, 0, 0) !important;
}
.swiper-container.off .swiper-controls .previous,
.swiper-container.off .swiper-controls .next,
.swiper-container.off + .swiper-controls .previous,
.swiper-container.off + .swiper-controls .next {
	display: none;
}

/* ========== NAV ========== */

nav.swiper-container:not(.swiper-initialized),
nav.swiperable:not(.swiper-initialized) {
	opacity: 0;
}
nav.swiper-container .swiper-slide,
nav.swiperable .swiper-slide {
	width: auto;
}

/* ========== ANCHORS ========== */

.swiper-container a::after {
	display: none;
}


/* ================================================== */
/* ==================== CONTROLS ==================== */
/* ================================================== */

/**
.swiper-controls > .previous + .swiper-pagination + .next
default == after swiper-wrapper
min    == in swiper-container (absolute)
**/

/* ========== DEFAULT ========== */

.swiper-controls {
	position: relative;
	z-index: 10;
	width: 100%;
	display: inline-flex;
	align-items: center;
	flex-wrap: unset;
	gap: var(--swiper-gap);
	font-size: var(--swiper-controls-font-size);
	line-height: 1;
	min-height: var(--swiper-controls-font-size);
	pointer-events: none;
}
.swiper-controls > * {
	z-index: 100;
	margin: 0;
	font-size: inherit;
	pointer-events: auto;
}

/* ========== FULL ========== */

.swiper-controls.full {
	justify-content: space-between;
}

/* ========== ONLOAD ========== */

.swiper-container.onload .swiper-controls {
	opacity: 0;
}

/* ========== VISIBILITY ========== */
/*
.swiper-container:not(:has(.swiper-slide:not(.swiper-slide-fully-visible))) .swiper-controls {
	display: none;
}
*/
/* ========== BUTTONS ========== */

.swiper-controls a {
	display: inline-flex;
	align-items: center;
	pointer-events: auto;
	line-height: 1;
	aspect-ratio: 1/1;
	padding: 0;
}

/* =================================== */
/* ========== NEXT PREVIOUS ========== */
/* =================================== */

.swiper-controls a.previous {
	left: 0;
	order: 1;
}
.swiper-controls a.next {
	right: 0;
	order: 3;
}

/* ========== ICONS ========== */

.swiper-controls a [class^="icon-"] {
	padding: 1em;
	height: 100%;
	aspect-ratio: 1/1;
	color: var(--button-text-color);
	border-radius: 50%;
}
.swiper-controls a [class^="icon-"]:after {
	content: "";
	position: absolute;
	z-index: -1;
	inset: 0;
	height: 100%;
	aspect-ratio: 1/1;
	background: var(--button-background-color);
	border-radius: 50%;
}


/* ========== HOVER ========== */

@media (hover: hover) {
	.swiper-controls a:hover [class^="icon-"] {
		color: var(--button-hover-text-color);
	}
	.swiper-controls a:hover [class^="icon-"]:after {
		background: var(--button-hover-background-color);
		transform: scale(1.25);
	}
}
@media (hover: none) {
	.swiper-controls a:active [class^="icon-"],
	.swiper-controls a.hover [class^="icon-"] {
		color: var(--button-hover-text-color);
	}
	.swiper-controls a:active [class^="icon-"]:after,
	.swiper-controls a.hover [class^="icon-"]:after {
		background: var(--button-hover-background-color);
		transform: scale(1.25);
	}
}


/* ========== DISABLED ========== */

.swiper-controls a.swiper-button-disabled {
	opacity: var(--swiper-disabled-opacity);
	pointer-events: none !important;
}

/* ========== ABSOLUTE ========== */

/* DEFAULT */

.swiper-container.min .swiper-controls {
	position: absolute;
	inset: 0;
	margin: 0;
}
.swiper-container.min .swiper-controls a.previous,
.swiper-container.min .swiper-controls a.next {
	position: absolute;
	top: var(--swiper-controls-button-top);
	opacity: 0;
}
.swiper-container.min .swiper-controls a.previous {
	transform: var(--swiper-min-controls-previous-from);
}
.swiper-container.min .swiper-controls a.next {
	transform: var(--swiper-min-controls-next-from);
}


/* ========== HOVER ========== */

@media (hover: hover) {
	.swiper-container.min:hover .swiper-controls a:not(.swiper-button-disabled) {
		opacity: 1 !important;
	}
	.swiper-container.min:hover .swiper-controls a.swiper-button-disabled {
		opacity: var(--swiper-disabled-opacity) !important;
	}
	.swiper-container.min:hover .swiper-controls a.previous {
		transform: var(--swiper-min-controls-previous-to);
	}
	.swiper-container.min:hover .swiper-controls a.next {
		transform: var(--swiper-min-controls-next-to);
	}
}
@media (hover: none) {
	.swiper-container.min.hover .swiper-controls a:not(.swiper-button-disabled) {
		opacity: 1 !important;
	}
	.swiper-container.min.hover .swiper-controls a.swiper-button-disabled {
		opacity: var(--swiper-disabled-opacity) !important;
	}
	.swiper-container.min.hover .swiper-controls a.previous {
		transform: var(--swiper-min-controls-previous-to);
	}
	.swiper-container.min.hover .swiper-controls a.next {
		transform: var(--swiper-min-controls-next-to);
	}
}


/* ========== MIN FULL ========== */

.swiper-container.min.full .swiper-controls a {
	top: var(--swiper-full-controls-button-top);
}
.swiper-container.min.full .swiper-controls a.previous {
	transform: var(--swiper-full-controls-previous-from);
}
.swiper-container.min.full .swiper-controls a.next {
	transform: var(--swiper-full-controls-next-from);
}


/* ========== HOVER ========== */

@media (hover: hover) {
	.swiper-container.min.full:hover .swiper-controls a.previous {
		transform: var(--swiper-full-controls-previous-to);
	}
	.swiper-container.min.full:hover .swiper-controls a.next {
		transform: var(--swiper-full-controls-next-to);
	}
}
@media (hover: none) {
	.swiper-container.min.full.hover .swiper-controls a.previous {
		transform: var(--swiper-full-controls-previous-to);
	}
	.swiper-container.min.full.hover .swiper-controls a.next {
		transform: var(--swiper-full-controls-next-to);
	}
}


/* ========== MOBILE ========== */

/* touch device only */

@media (pointer: coarse) {
	.swiper-controls a.previous,
	.swiper-controls a.next {
		opacity: 1 !important;
	}
	.swiper-controls a.previous.swiper-button-disabled,
	.swiper-controls a.next.swiper-button-disabled {
		opacity: var(--swiper-disabled-opacity) !important;
	}
	.swiper-container.min .swiper-controls a.previous {
		transform: var(--swiper-min-controls-previous-to);
	}
	.swiper-container.min .swiper-controls a.next {
		transform: var(--swiper-min-controls-next-to);
	}
	.swiper-container.min.full .swiper-controls a.previous {
		transform: var(--swiper-full-controls-previous-to);
	}
	.swiper-container.min.full .swiper-controls a.next {
		transform: var(--swiper-full-controls-next-to);
	}
}

/* ================================================ */
/* ==================== THUMBS ==================== */
/* ================================================ */

.swiper-thumbs figure {
	aspect-ratio: 16/9 !important;
}
.swiper-thumbs figure img {
	height: 100%;
	object-fit: cover;
}
.swiper-thumbs .swiper-slide:not(.swiper-slide-thumb-active) .swiper-slide-content {
	opacity: var(--swiper-disabled-opacity);
}
.swiper-thumbs .swiper-slide:not(.swiper-slide-thumb-active):hover .swiper-slide-content {
	opacity: 1;
}


/* ==================================================== */
/* ==================== PAGINATION ==================== */
/* ==================================================== */

/* ========== DEFAULT ========== */

.swiper-pagination {
	position: relative;
	z-index: 10;
	display: inline-flex;
	justify-content: center;
	gap: var(--swiper-gap);
	order: 2;
}
.swiper-pagination .swiper-pagination-bullet {
	display: inline-flex;
	align-items: center;
	height: var(--swiper-controls-bullet-size);
	width: var(--swiper-controls-bullet-size);
	opacity: var(--swiper-disabled-opacity);
	margin: 0 !important;
	background: none;
	border-radius: 50%;
	box-shadow: inset 0 0 0 var(--swiper-controls-bullet-size);
}
.swiper-pagination-bullet.active,
.swiper-pagination .swiper-pagination-bullet-active {
	opacity: 1;
}


/* ========== HOVER ========== */

@media (hover: hover) {
	.swiper-pagination .swiper-pagination-bullet:hover {
		opacity: 1;
	}
}
@media (hover: none) {
	.swiper-pagination .swiper-pagination-bullet:active,
	.swiper-pagination .swiper-pagination-bullet.hover {
		opacity: 1;
	}
}


/* ========== ABSOLUTE ========== */

.swiper-container.min .swiper-pagination,
.swiperable .swiper-pagination {
	position: absolute;
	bottom: 0;
	padding: var(--gutter-gap);
	transform: translate3d(0, 0, 0);
}

/* ========== FRACTION ========== */

.swiper-container.min .swiper-pagination.swiper-pagination-fraction,
.swiper-pagination.swiper-pagination-fraction {
	top: 0;
	bottom: auto;
	justify-content: flex-end;
	gap: 0;
	font-size: var(--swiper-controls-fraction-size);
	font-weight: var(--font-weight-bold);
	text-align: right;
	pointer-events: none;
}


/* ================================================== */
/* ==================== PARALLAX ==================== */
/* ================================================== */

/* WIP */

.swiper-container.has-parallax .swiper-slide .infos {
	opacity: 0;
	transform: translate(0, 100%);
	transition: all var(--duration-normal);
}
.swiper-container.has-parallax .swiper-slide.swiper-slide-active .infos {
	opacity: 1;
	transform: translate(0, 0);
	transition-delay: .5s;
}


/* =================================================== */
/* ==================== SCROLLBAR ==================== */
/* =================================================== */

/* WIP */

.swiper-scrollbar {
	height: var(--swiper-scrollbar-size);
	width: 100%;
}
.swiper-scrollbar {
	bottom: calc(var(--gutter-gap) / 4 * -1) !important;
	height: calc(var(--swiper-scrollbar-height) * 4);
	margin: 0 calc(var(--gutter-gap) * 2);
	max-width: var(--content-max-width);
	width: calc(100% - var(--gutter-gap) * 4) !important;
}
.swiper-scrollbar-drag {
	background: currentColor !important;
}


/* ========== HOVER ========== */

@media (hover: hover) {
	.swiper-container:hover .swiper-scrollbar {
		opacity: 1 !important;
	}
}
@media (hover: none) {
	.swiper-container.hover .swiper-scrollbar {
		opacity: 1 !important;
	}
}


/* ================================================= */
/* ==================== MARGINS ==================== */
/* ================================================= */

.swiper-container:not(.clipped):not(.full),
.swiper-container[class*="-size"].clipped {
	margin-left: calc(var(--grid-gap) * -.5);
    margin-right: calc(var(--grid-gap) * -.5);
    width: calc(100% + var(--grid-gap));
}
.swiper-container:not(.clipped):not(.full) .swiper-slide-content,
.swiper-container[class*="-size"].clipped .swiper-slide-content {
    margin: 0 calc(var(--grid-gap) * .5);
}
main > .swiper-container:not(.clipped):not(.full) {
    margin-left: calc(var(--section-gap) - var(--grid-gap) * .5) !important;
    margin-right: calc(var(--section-gap) - var(--grid-gap) * .5) !important;
    width: calc(100% - var(--section-gap) * 2 + var(--grid-gap)) !important;
    max-width: calc(var(--content-max-width) + var(--grid-gap)) !important;
}


/* =============================================== */
/* ==================== SIZES ==================== */
/* =============================================== */

.swiper-container[class*="-size"] .swiper-slide {
	display: flex;
	width: var(--slide-width);
}
.swiper-container[class*="-size"] .swiper-slide-content {
    opacity: 1;
}
.swiper-container[class*="-size"]:has(.swiper-slide:nth-child(2)) .swiper-slide:not(.swiper-slide-visible) {
    pointer-events: none;
    opacity: var(--swiper-disabled-opacity);
    filter: var(--swiper-disabled-filter);
}
/*
.swiper-container[class*="-size"] {
    margin-left: calc(var(--grid-gap) * -.5);
    margin-right: calc(var(--grid-gap) * -.5);
    width: calc(100% + var(--grid-gap));
}
.swiper-container[class*="-size"] .swiper-slide-content {
    margin: 0 calc(var(--grid-gap) * .5);
}
*/


/* ==================================================== */
/* ==================== SWIPERABLE ==================== */
/* ==================================================== */

/*
grid <> swiper
flex instead of grid
*/

/* ========== AS GRID ========== */

.grid.swiperable .items {
	display: flex;
	gap: 0;
	justify-content: unset;
}
.grid.swiperable .item {
	width: var(--item-width);
	flex-shrink: 0;
	position: relative;
	display: flex;
	height: auto;
}
.grid.swiperable .item-content {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	width: 100%;
	overflow: hidden;
}

/* =============================== */
/* ========== AS SWIPER ========== */
/* =============================== */

.swiperable .swiper-wrapper {
	gap: 0;
}
.swiperable .swiper-slide {
	position: relative;
	display: flex;
	height: auto;
}
.swiperable .swiper-slide.empty {
	display: none;
}
.swiperable:has(.swiper-slide:nth-child(2)) .swiper-slide:not(.swiper-slide-visible) {
    pointer-events: none;
    opacity: .33;
    filter: grayscale(.33);
}
.swiperable .grid-message {
	display: none;
}

/* ========== AS NAV ========== */

nav.swiperable {
	flex-wrap: nowrap;
}
nav.swiperable .swiper-slide {
	width: auto;
	transition: none;
}
nav.swiperable .swiper-slide:not(.swiper-slide-visible) {
	opacity: 1;
}

/* ========== MARGIN ========== */

/*
spacing like in grids
padding instead of margin (in grid gap = gutter-gap) => fix swiper bug
*/

.swiperable {
	margin-left: calc(var(--grid-gap) * -.5);
	margin-right: calc(var(--grid-gap) * -.5);
	width: calc(100% + var(--grid-gap));
	padding: 0;
}
.swiperable .item,
.swiperable .swiper-slide {
	margin: 0;
}
.swiperable .item-content {
	margin: 0 calc(var(--grid-gap) * .5);
}
.swiperable .swiper-controls {
	margin-left: calc(var(--grid-gap) * .5);
	margin-right: calc(var(--grid-gap) * .5);
}

/* ========== MIN ========== */

.swiperable.min .swiper-controls {
	left: 0;
	width: 100%;
	margin: 0;
}
.swiperable.min .swiper-controls .previous {
	left: calc(var(--grid-gap) * .5);
}
.swiperable.min .swiper-controls .next {
	right: calc(var(--grid-gap) * .5);
}

/* ========== @MEDIA ========== */

@media (min-width: 1200px) {
	.swiper-container.swiperable {
		overflow: visible;
	}
}