@charset "UTF-8";

/**
version: 1.0.0 – 20241002
autoprefixed
**/

/*****************************/
/********** DEFAULT **********/
/*****************************/

* {
	-webkit-tap-highlight-color: rgba(var(--accent-rgb), .25);
}

/*********************************/
/********** TEXT COLORS **********/
/*********************************/

.has-bright-color {
	color:var(--bright-color);
}
.has-light-color {
	color:var(--light-color);
}
.has-dark-color {
	color:var(--dark-color);
}
.has-accent-color {
	color:var(--accent-color);
}

/***************************************/
/********** BACKGROUND COLORS **********/
/***************************************/

.has-dark-background-color {
	color:var(--bright-color);
	background:var(--dark-color);
}
.has-light-background-color {
	background:var(--light-color);
}
.has-bright-background-color {
	background:var(--bright-color);
}

.has-dark-background-color .button,
.has-dark-background-color .swiper-controls a [class^="icon-"] {
	color:var(--dark-color);
	background: var(--bright-color);
}
.has-dark-background-color .button:hover,
.has-dark-background-color .swiper-controls a:hover [class^="icon-"] {
	color:var(--bright-color);
	background: var(--dark-color);
}

/***************************/
/********** THEME **********/
/***************************/

[class^="is-theme-"] .buttons a:hover,
[class^="is-theme-"] .button:hover,
[class^="is-theme-"] button:hover,
[class^="is-theme-"] .buttons a.active,
[class^="is-theme-"] .button.active,
[class^="is-theme-"] button.active {
	color: var(--dark-color);
	border-color: var(--theme-color);
	background: var(--theme-color);
}
[class^="is-theme-"] section.focus,
[class^="is-theme-"] #contextual {
	background: var(--theme-color);
}
[class^="is-theme-"] #contextual:before {
	background:
	-webkit-linear-gradient(
		left,
		rgba(var(--theme-rgb), 100%),
		rgba(var(--theme-rgb), 0) -webkit-calc(var(--gutter-gap) * 2),
		rgba(var(--theme-rgb), 0) -webkit-calc(100% - var(--gutter-gap) * 2),
		rgba(var(--theme-rgb), 100%)
	);
	background:
	-moz-linear-gradient(
		left,
		rgba(var(--theme-rgb), 100%),
		rgba(var(--theme-rgb), 0) -moz-calc(var(--gutter-gap) * 2),
		rgba(var(--theme-rgb), 0) -moz-calc(100% - var(--gutter-gap) * 2),
		rgba(var(--theme-rgb), 100%)
	);
	background:
	-webkit-gradient(
		linear,
		left top, right top,
		from(rgba(var(--theme-rgb), 100%)),
		color-stop(rgba(var(--theme-rgb), 0)),
		color-stop(rgba(var(--theme-rgb), 0)),
		to(rgba(var(--theme-rgb), 100%))
	);
	background:
	-o-linear-gradient(
		left,
		rgba(var(--theme-rgb), 100%),
		rgba(var(--theme-rgb), 0) calc(var(--gutter-gap) * 2),
		rgba(var(--theme-rgb), 0) calc(100% - var(--gutter-gap) * 2),
		rgba(var(--theme-rgb), 100%)
	);
	background:
	linear-gradient(
		90deg,
		rgba(var(--theme-rgb), 100%),
		rgba(var(--theme-rgb), 0) calc(var(--gutter-gap) * 2),
		rgba(var(--theme-rgb), 0) calc(100% - var(--gutter-gap) * 2),
		rgba(var(--theme-rgb), 100%)
	);
}
[class^="is-theme-"] nav.contextual.swiperable .swiper-controls .previous [class^="icon-"],
[class^="is-theme-"] nav.contextual.swiperable .swiper-controls .next [class^="icon-"] {
	color: var(--dark-color);
	background: var(--bright-color);
}
[class^="is-theme-"] nav.contextual.swiperable .swiper-controls .previous:hover [class^="icon-"],
[class^="is-theme-"] nav.contextual.swiperable .swiper-controls .next:hover [class^="icon-"] {
	color: var(--bright-color);
	background: var(--dark-color);
}