/*
Theme Name:         Sage Starter Theme
Theme URI:          https://roots.io/sage/
Description:        Sage is a WordPress starter theme.
Version:            10.3.1
Author:             Roots
Author URI:         https://roots.io/
Text Domain:        sage
License:            MIT License
License URI:        https://opensource.org/licenses/MIT
Requires PHP:       7.4
Requires at least:  5.9
*/


:root {
	--ws-blue: #55D4FF;
	--ws-dk-blue: #143A6F;
	--transition: ease all 200ms;
}



body {
	overflow-x: hidden;
}


main {
	position: relative;
	z-index: 0;
}

.button {
	background-color: var(--ws-blue);
	border: 0;
	border-radius: 32px;
	color: #FFF;
	display: inline-block;
	font-size: 1rem;
	font-weight: 600;
	padding: 0.5em 1em;
	text-decoration: none;
	text-transform: uppercase;
	transition: all .3s ease;
}

img {
	height: auto;
	max-width: 100%;
}




/* FLEXBOX COLUMNS ------------------------------ */
ul.ws-flex {
	display: flex;
	flex-wrap: wrap;
	gap: var(--ws-gap);
	list-style: none;
	padding: 0;
}

ul.ws-flex li {
	width: calc(100% / var(--ws-column-count) - (var(--ws-gap) * (var(--ws-column-count) - 1) / var(--ws-column-count)));
}




/* HEADER ------------------------------ */
#header {
	background: #004C91;
	margin-inline: -1em -0.5625em;
	position: sticky;
	top: 0;
	z-index: 1;
}

#app #header {
	margin: 0 -0.5625em;
	padding-top: 1em;
}

.home #header {
	background: #002e5b;
}

#header .navbar-brand img {
	max-width: 100%;
}

#header .nav-primary a[href="#"] {
	pointer-events: none;
}

/* Header Search */
#header .site-search #product-matches {
	background: #002E5B;
	padding: 0.25rem;
	text-transform: none;
	font-weight: 400;
}

#header .site-search #product-matches .small-title {
	text-transform: uppercase;
	font-weight: 600;
	font-family: Inter, sans-serif;
	background: #254C73;
	display: block;
	padding: 0 1em;
	line-height: 2.5rem;
}

#header .site-search #product-matches ul {
	margin: 0.25rem 0;
	padding: 0;
	list-style: none;
}

#header .site-search #product-matches ul li+li {
	margin-top: 0.25rem;
}

#header .site-search #product-matches ul li a {
	align-items: flex-start;
	background: rgba(255, 255, 255, 0.1);
	display: flex;
	gap: 0.625rem;
	padding: 0.5rem 1.5625rem;
}

#header .site-search #product-matches ul li a:is(:hover, :focus-visible) {
	background: none;
}

#header .site-search #product-matches .product-image {
	aspect-ratio: 1/1;
	position: relative;
	max-width: 4.25rem;
	flex-shrink: 0;
}

#header .site-search #product-matches .product-image img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: contain;
	object-position: center top;
}

#header .site-search #product-matches .product-description {
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	font-size: 0.875rem;
	line-height: 1.0625rem;
	gap: 0.125rem;
}

#header .site-search #product-matches h2 {
	border: 0;
	font-size: 1em;
	line-height: 1.0625rem;
	margin: 0;
	padding-left: 0 !important;
}

#header .site-search #product-matches p {
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	display: -webkit-box;
	font-size: 1em;
	font-weight: 300;
	line-height: 1.0625rem;
	margin: 0;
	overflow: hidden;
}

#header .site-search #product-matches a:is(:hover, :focus-visible) .product-name {
	color: var(--ws-blue);
}

#header .site-search #product-matches .view-all {
	background: #254C73;
	padding: 1em;
}

#header .site-search #product-matches [type=submit] {
	border: 0;
	background: var(--ws-blue);
	border-radius: 1.875rem;
	color: #002E5B;
	font-weight: 700;
	text-transform: uppercase;
	font-size: 0.875em;
	text-align: center;
	width: 100%;
}

#header .site-search #product-matches [type=submit]:is(:hover, :focus-visible) {
	color: var(--ws-blue);
	background: #002E5B;
	box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.5)
}



/* Hide the X from Chrome search input */
input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-results-button,
input[type="search"]::-webkit-search-results-decoration { display: none; }





/* WRAP ------------------------------ */
.wrap {
	margin-inline: auto;
	max-width: 74em;
	padding-inline: 1.5em;
}




/* STICKY CTA ------------------------------ */
.sticky-cta {
	position: fixed;
	right: .5em;
	top: 13em;
	transform: rotate(-90deg) translateY(-100%);
	transform-origin: top right;
	z-index: 10;
}

.sticky-cta a {
	background: var(--ws-dk-blue);
	border-radius: 10px 10px 0 0;
	border: 1px solid rgba(255, 255, 255, .5);
	border-bottom: 0;
	padding: .5em 1em;
}

.sticky-cta a:is(:hover, :focus, :focus-visible) {
	text-decoration: none;
}




/* CTA RIBBON (HOMEPAGE) ------------------------------ */

.call-to-action {
	text-align: center;
}

.call-to-action .wrap {
	max-width: 50em;
}

.call-to-action .button {
	margin-top: 1.25em;
}




/* PRODUCTS BLOCK ------------------------------ */

.products-block {
	margin: 2em 0;
}

.products-block ul.ws-flex {
	justify-content: center;
	row-gap: 2.5em;
	text-align: center;
	--ws-gap: 1.5em;
}

.products-block h2 {
	font-size: 1em;
	line-height: 1.1;
}

.products-block img {
	display: block;
	height: 10.5rem;
	margin: 0 auto 1em;
	width: auto;
}



/* Quote Customizations */
.product .button {
	white-space: nowrap;
}

.product .add_to_cart_button~.added_to_quote {
	background: #f69133 !important;
	position: absolute;
	bottom: 0;
	width: 90% !important;
	z-index: 10;
	display: inline-block;
}

/**/




/* HOMEPAGE EVENTS ------------------------------ */
.upcoming-events {
	text-align: center;
}

.upcoming-events .wrap {
	background: rgba(255, 255, 255, .05);
	border-radius: 1.5em;
	margin-inline: auto;
	max-width: 30em;
	padding: 1.5em;
}

.upcoming-events ul {
	list-style: none;
	padding: 0;
}

.upcoming-events li {
	font-size: 1.125em;
	padding: 0;
}

.upcoming-events li+li {
	margin-top: 2em;
}

.upcoming-events h3 {
	font-size: 1.25em;
	margin: 0;
}

.upcoming-events time {
	display: block;
	font-size: .9375em;
	font-style: italic;
	margin: 0 0 .5em;
}

.upcoming-events .button {
	box-shadow: inset 0 0 0 2px var(--ws-blue);
	color: #000 !important;
	padding-inline: 1.5em;
}

.upcoming-events .button:is(:hover, :focus-visible) {
	color: #FFF !important;
}





/* SEARCH RESULTS ------------------------------ */
body.search-results {
	background: #012E59;
}

body.search-results #header {
	background: #012E59;
}

body.search-results #header .site-search {
	background: #012E59;
}

#search-results {
	padding: 2.1875rem clamp(0rem, -2rem + 10vw, 5.5rem) clamp(3.75rem, 3.295rem + 2.27vw, 5rem);
}

#search-results .search-results-top form {
	align-items: center;
	display: flex;
	flex-wrap: wrap;
	gap: 0 0.875em;
	justify-content: center;
}

#search-results .search-results-top form h1 {
	border: 0;
	margin: 0;
	padding: 0;
}

#search-results .search-results-top form h1 {
	border: 0;
	font-size: clamp(1.125rem, 0.807rem + 1.59vw, 2rem);
	margin: 0;
	padding: 0;
}

#search-results .search-results-top form .search-box {
	position: relative;
}

#search-results .search-results-top form * {
	transition: var(--transition);
}

#search-results .search-results-top form #search {
	background: rgba(255, 255, 255, 0.14);
	border: 0;
	border-radius: clamp(2.813rem, 2.472rem + 1.7vw, 3.75rem);
	color: #fff;
	font-size: clamp(1.125rem, 0.807rem + 1.59vw, 2rem);
	height: clamp(2.813rem, 2.472rem + 1.7vw, 3.75rem);
	padding: 0 clamp(2.813rem, 2.472rem + 1.7vw, 3.75rem) 0 clamp(1.125rem, 0.852rem + 1.36vw, 1.875rem);
}

#search-results .search-results-top form #search:is(:hover, :focus) {
	box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.5);
}

#search-results .search-results-top [type=submit] {
	background: url(/wp-content/themes/danddfiltration/resources/images/search.svg) no-repeat center / 50% auto;
	border: 0;
	bottom: 0;
	height: clamp(2.813rem, 2.472rem + 1.7vw, 3.75rem);
	position: absolute;
	right: 0;
	width: clamp(2.813rem, 2.472rem + 1.7vw, 3.75rem);
}

#search-results .search-results-bottom {
	margin-top: 2.25em;
}

.products-list,
.products-list li {
	display: flex;
	list-style: none;
	margin: 0;
	padding: 0;
}

.products-list {
	display: flex;
	flex-wrap: wrap;
	gap: var(--ws-gap);
	justify-content: center;
}

.products-list li {
	margin-bottom: 3em;
	width: calc(100% / var(--ws-columns) - (var(--ws-gap) * (var(--ws-columns) - 1) / var(--ws-columns)));
}

.products-list a {
	background: rgba(255, 255, 255, 0.08);
	border: 1px solid rgba(255, 255, 255, 0.20);
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	transition: var(--transition);
	text-decoration: none;
}

.products-list a:is(:hover, :focus-visible) {
	border-color: var(--ws-blue);
	text-decoration: none;
	box-shadow: 0 20px 70px -23px RGBA(85, 212, 255, 0.5);
	background: #002E5B;
}

.products-list a:is(:hover, :focus-visible) * {
	text-decoration: none;
}

.products-list a .product-image {
	aspect-ratio: 1;
	padding: 1.5em;
	width: 100%;
}

.products-list a .product-image img {
	height: 100%;
	object-fit: contain;
	object-position: center;
	display: block;
	margin: 0 auto;
	width: 100%;
}

.products-list a .product-description {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	gap:0.5em;
	padding: clamp(1rem, 0.864rem + 0.68vw, 1.375rem);
}

.products-list a h2 {
	font-size: 1.125em;
	line-height: 1.25em;
	margin:0;
}

.products-list a p {
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 4;
	display: -webkit-box;
	margin: 0;
	overflow: hidden;
}

.products-list a .view-product {
	display: block;
	transform: translateY(50%);
	line-height: 1.875em;
	background: var(--ws-blue);
	color: #002E5B;
	border-radius: 1.875em;
	text-transform: uppercase;
	font-weight: 700;
	padding: 0 1.5em;
	transition: var(--transition);
}

.products-list a:is(:hover, :focus-visible) .view-product {
	color: #fff;
	background: #002E5B;
	box-shadow: 0 0 0 1px var(--ws-blue);
}





/* EVENTS PAGES ------------------------------ */

.tribe-common {
	--tec-color-text-primary: #000 !important;
	--tec-color-background-events-bar-submit-button: #004C91 !important;
	--tec-color-button-primary: #004C91 !important;
	--tec-color-accent-primary: #004C91 !important;
}

.tribe-common * {
	font-family: 'Inter', sans-serif !important
}

body .tribe-common a {
	color: #000 !important;
}

:is(.post-type-archive-tribe_events, .single-tribe_events) main {
	background: #FFF !important;
}

.tribe-events-single-event-title,
.tribe-events-schedule h2,
.tribe-events-content p {
	color: #000 !important;
}

:is(.tribe-events-nav-previous, .tribe-events-nav-next) a {
	color: #004C91 !important;
}

.tribe-common--breakpoint-medium.tribe-common a.tribe-common-c-btn-border-small,
.tribe-events-c-messages__message-list-item,
.tribe-events .tribe-events-c-messages__message-list-item-link,
.tribe-events-calendar-list__event-description p,
h2.tribe-events-single-section-title,
.tribe-events-event-url a {
	color: #000 !important;
}

h1.tribe-events-single-event-title {
	padding-left: .875rem;
}





/* STANDARD INTERIOR ------------------------------ */

.interior-page main {
	font-size: 1rem;
	padding-top: 3em;
	padding-bottom: 3em;
}

.interior-page main .wrap {
	max-width: 63.75rem;
}

.interior-page main h2 {
	font-size: clamp(1.375em, 1.193em + 0.91vw, 1.875em); /* 22px - 30px */
}

.interior-page main h3 {
	font-size: clamp(1.25em, 1.114em + 0.68vw, 1.625em); /* 20px - 26px */
}

.interior-page main h4 {
	font-size: clamp(1.125em, 1.034em + 0.45vw, 1.375em); /* 18px - 22px */
}


.interior-page main :is(p, h2, h3, h4, h5, h6, hr, blockquote, dd, ol) {
  margin-block: 0 1rem;
}

.interior-page main :is(p, ul, ol, .wp-block-buttons, .wp-block-video, aside, div, section) + :is(h2, h3, h4, h5, h6) {
  margin-top: 2rem;
}

.interior-page main a:not(.wp-block-button__link) {
	color: #55d4ff !important;
	text-decoration: underline;
	text-decoration-color: #55d4ff !important;
}

.interior-page main a:not(.wp-block-button__link):is(:hover, :focus-visible) {
	color: #55d4ff;
	text-decoration-color: #fff !important;
}

.interior-page main :is(.alignright, .alignleft) {
    height: auto;
    max-width: min(50%, 21em);
}

.interior-page main .alignright img {
    float: none;
    height: auto;
    margin: 0;
    max-width: 100%;
}

.interior-page main img.phototreatment {
    height: auto;
    max-width: 50%;
}

.interior-page main figure.phototreatment {
    text-align: center;
    width: 100%;
}

.interior-page main figure.phototreatment img {
    height: auto;
    max-width: 100%;
    width: auto;
}

.interior-page main img.phototreatment,
.interior-page main img.alignright,
.interior-page main .alignright img {
    height: auto;
    max-width: 100%;
    width: auto;
}

.interior-page main .alignright {
    clear: right;
    float: right;
}

.interior-page main .alignleft {
    clear: left;
    float: left;
}

.interior-page main .aligncenter {
    clear: both;
    display: block;
    margin-inline: auto;
}

.interior-page main figcaption {
    font-size: 0.875em;
    font-style: italic;
}

.interior-page main .alignright  figcaption{
    text-align: right;
}

.interior-page main .aligncenter figcaption,
.interior-page main .wp-block-video:not(.alignright, .align-left) figcaption {
    text-align: center;
}

.interior-page main .wp-block-quote {
    background: rgba(0,0,0,0.125);
    border-radius: 0.625em;
    margin: 1.5em 0;
    padding: 1.5em 1em;
    text-align: center;
}

.interior-page main .wp-block-quote p:first-of-type::before {
  content: open-quote;
}

.interior-page main .wp-block-quote p:last-of-type::after {
  content: close-quote;
}

.interior-page main .wp-block-quote :is(footer, cite) {
  font-size: .875rem;
  font-style: italic;
}

.interior-page main .wp-block-video:not(.alignright, .align-left) {
	margin: 2em 0;
}

.interior-page main .wp-block-button {
	margin: 0 !important;
}

.interior-page main .wp-block-button__link {
	background: #55d4ff;
	border: 0;
	color: #021C39 !important;
	cursor: pointer;
	display: inline-block;
	font-size: 1em;
	font-weight: 700;
	line-height: 1;
	padding: .75em 1.5em;
	transition: ease all .15s;
}

.interior-page main .wp-block-button__link:is(:hover, :focus-visible) {
	background: #021C39;
	box-shadow: 0 0 0 1px #55d4ff;
	color: #fff !important;
	text-decoration: none;
}

.interior-page main .wp-block-separator {
  border: 1px solid rgba(255,255,255,0.25);
  margin: 2.5em auto !important;
  opacity: 1;
  width: 100%;
}







/* MIN-WIDTH MEDIA QUERIES ------------------------------ */

@media (min-width: 992px) {


	/* Desktop Header Search */
	#header .navbar-brand {
		position: relative;
		z-index: 3;
	}

	#header .utility-nav {
		padding-right: 10.625rem;
	}

	#header .utility-nav a {
		font-size: 1rem;
	}

	#header .site-search {
		background: #004C91;
		font-size: 1rem;
		position: absolute;
		right: 0;
		top: -1.875rem;
		z-index: 2;
		text-align: left;
	}

	.home #header .site-search {
		background: #002e5b;
	}

	#header .site-search * {
		transition: var(--transition);
	}

	#header .site-search .search-wrapper {
		position: relative;
		z-index: 2;
	}

	#header .site-search label {
		color: rgba(255, 255, 255, 0.5);
		cursor: pointer;
		font-style: italic;
		left: 0;
		line-height: 34px;
		padding: 0 1.3125rem;
		position: absolute;
		text-transform: none;
		top: 0;
		width: 9.0625rem;
		border-radius: 2.125rem;
	}

	#header .site-search label:is(:hover, :focus-visible) {
		box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.5);
	}

	#header .site-search #siteSearch {
		background: rgba(255, 255, 255, 0.14);
		border: 0;
		border-radius: 2.125rem;
		color: #fff;
		height: 2.125rem;
		width: 9.0625rem;
		padding: 0 2.5rem 0 1.25rem;
	}

	#header .site-search #siteSearch:is(:focus, :focus-visible) {
		background: rgba(255, 255, 255, 0.14);
		border: 0;
		outline: none;
	}

	#header .site-search ::-webkit-input-placeholder {
		color: rgba(255, 255, 255, 0);
	}

	#header .site-search ::-moz-placeholder {
		color: rgba(255, 255, 255, 0);
	}

	#header .site-search :-ms-input-placeholder {
		color: rgba(255, 255, 255, 0);
	}

	#header .site-search :-moz-placeholder {
		color: rgba(255, 255, 255, 0);
	}

	#header .site-search .search-wrapper>[type=submit] {
		background: url(/wp-content/themes/danddfiltration/resources/images/search.svg) no-repeat center;
		border: 0;
		height: 2.125rem;
		position: absolute;
		right: 0;
		top: 0;
		width: 2.125rem;
	}

	#header .site-search .search-wrapper>.close {
		background: url(/wp-content/themes/danddfiltration/resources/images/search-close.svg) no-repeat center;
		border: 0;
		height: 2.125rem;
		padding: 0;
		position: absolute;
		right: 0;
		top: 0;
		width: 0;
		opacity: 0.5;
		display: none;
	}

	#header .site-search .product-matches {
		position: absolute;
		left: 5.375rem;
		top: calc(100% + 0.125rem);
		width: calc(100% - 8.875rem);
		opacity: 0;
		pointer-events: none;
	}

	#header .site-search .mask {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		z-index: 1;
		backdrop-filter: blur(2px);
		opacity: 0;
		pointer-events: none;
	}

	#header .site-search .mask:after {
		content: "";
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		opacity: 0.75;
		background: #002E5B;
	}

	#header .site-search #product-matches .product-image {
		width: 4.25rem;
	}

	/* Active Search */
	.search-active #header .site-search .search-wrapper {
		padding-left: 4.375rem;
		padding-right: 2.5rem;
	}

	.search-active #header .site-search label {
		box-shadow: none;
		padding: 0;
		width: 4.375rem;
		pointer-events: none;
	}

	.search-active #header .site-search #siteSearch {
		box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.5);
		width: 30.9375rem;
	}

	.search-has-value:not(.search-active) #header .site-search #siteSearch {
		color: rgba(255, 255, 255, 0)
	}

	.search-active #header .site-search ::-webkit-input-placeholder {
		color: rgba(255, 255, 255, 1);
		opacity: 1;
	}

	.search-active #header .site-search ::-moz-placeholder {
		color: rgba(255, 255, 255, 1);
		opacity: 1;
	}

	.search-active #header .site-search :-ms-input-placeholder {
		color: rgba(255, 255, 255, 1);
		opacity: 1;
	}

	.search-active #header .site-search :-moz-placeholder {
		color: rgba(255, 255, 255, 1);
		opacity: 1;
	}

	.search-active #header .site-search .search-wrapper>[type=submit] {
		right: 2.5rem;
	}

	.search-active #header .site-search .search-wrapper>.close {
		width: 2.125rem;
		display: block;
	}

	.search-active #header .site-search .search-wrapper>.close:is(:hover, :focus-visible) {
		opacity: 1;
	}

	.search-active #header .site-search .mask {
		pointer-events: all;
		opacity: 1;
	}

	.search-active #header .site-search .product-matches {
		pointer-events: all;
		opacity: 1;
	}

	#header .site-search #product-matches [type=submit] {
		height: 1.875rem;
	}

	/* Products list */
	.products-list {
		--ws-columns: 4;
		--ws-gap: 1em;
	}

}

@media (min-width: 601px) {
	.admin-bar #header {
		top: 46px;
	}
}


/* 750px */
@media (min-width: 46.875em) {

	.button:is(:hover, :focus-visible) {
		background: var(--ws-dk-blue);
		text-decoration: none;
	}

	.sticky-cta a:is(:hover, :focus-visible) {
		background: var(--ws-blue);
		color: var(--ws-dk-blue) !important;
	}


	.products-block ul.ws-flex {
		--ws-column-count: 4;
	}

}



/* 783px */
@media (min-width: 48.9375em) {
	.admin-bar #header {
		top: 32px;
	}
}




/* MAX-WIDTH MEDIA QUERIES ------------------------------ */

/* 991px */
@media (max-width: 61.9375em) {

	#header {
		margin-top: 0 !important;
	}

	#header .nav-container {
		max-width: 100%;
		padding-inline: 1em;
	}

	#header .navbar-brand img {
		top: 0 !important;
	}

	#header.scrolled .navbar-brand img {
		max-width: 4em;
	}

	#header .nav-primary .navbar-toggler {
		top: 2.25em !important;
	}

	#header.scrolled .nav-primary .navbar-toggler {
		top: 1em !important;
	}

	/* Mobile Header Search */
	#header .site-search {
		border-bottom: 1px solid rgba(255, 255, 255, 0.5);
		border-top: 1px solid rgba(255, 255, 255, 0.5);
		font-size: 1rem;
		padding: 1em 0;
	}

	#header .site-search .search-wrapper {
		display: flex;
		flex-wrap: wrap;
		gap: 0.25em 0
	}

	#header .site-search label {
		display: block;
		font-family: Inter, sans-serif;
		font-weight: 600;
		width: 100%;
	}

	#header .site-search #siteSearch {
		background: rgba(255, 255, 255, 0.14);
		border: 0;
		border-radius: 2.5rem 0 0 2.5rem;
		color: #fff;
		height: 2.5rem;
		padding: 0 2.5rem 0 1.25rem;
		width: calc(100% - 2.5rem);
	}

	#header .site-search #siteSearch:focus {
		box-shadow: none;
		border: 0;
		outline: none;
	}

	#header .site-search ::-webkit-input-placeholder {
		color: rgba(255, 255, 255, 0.5);
		font-style: italic;
		opacity: 1;
	}

	#header .site-search ::-moz-placeholder {
		color: rgba(255, 255, 255, 0.5);
		font-style: italic;
		opacity: 1;
	}

	#header .site-search :-ms-input-placeholder {
		color: rgba(255, 255, 255, 0.5);
		font-style: italic;
		opacity: 1;
	}

	#header .site-search :-moz-placeholder {
		color: rgba(255, 255, 255, 0.5);
		font-style: italic;
		opacity: 1;
	}

	#header .site-search .search-wrapper>[type="submit"] {
		background: rgba(255, 255, 255, 0.14) url(/wp-content/themes/danddfiltration/resources/images/search.svg) no-repeat center;
		border: 0;
		height: 2.5rem;
		width: 2.5rem;
		border-radius: 0 2.5rem 2.5rem 0;
	}

	#header .site-search .search-wrapper>.close {
		align-items: center;
		border-radius: 2.125rem;
		background: none;
		color: #fff;
		font-weight: 300;
		text-align: center;
		border: 1px solid #fff;
		line-height: 2.125rem;
		font-size: 0.875rem;
		gap: 0.35em;
		width: 100%;
		justify-content: center;
		display: none;
	}

	.search-active.search-has-value #header .site-search .search-wrapper>.close {
		display: flex;
	}

	#header .site-search .search-wrapper>.close:before {
		content: "";
		width: 1em;
		height: 1em;
		background: url(/wp-content/themes/danddfiltration/resources/images/search-close.svg) no-repeat center;
	}

	#header .site-search .search-wrapper>.close:after {
		content: "Close Search";
	}


	#header .site-search #product-matches ul {
		max-height: calc(100vh - 27.625em);
		overflow: auto;
	}

	#header .site-search #product-matches ul li a {
		padding: 0.5em;
	}

	#header .site-search #product-matches .product-image {
		width: 2.5rem;
	}

	#header .site-search #product-matches [type=submit] {
		height: 2.5rem;
	}

	/* Products list */
	.products-list {
		--ws-columns: 3;
		--ws-gap: 1em;
	}


}



/* 750px */
@media (max-width: 46.875em) {

	body:not(.home) {
		padding:0 1rem !important;
	}

	body:not(.home) > #app {
		padding:0;
	}

	.products-block ul.ws-flex {
		--ws-column-count: 2;
		--ws-gap: 0.5em;
	}

	/* Products list */
	.products-list {
		--ws-columns: 2;
		--ws-gap: 0.5em;
	}

	.interior-page main {
		padding-top: 2em;
	}

	.interior-page .wrap {
		padding: 0;
	}

}



/* 500px */
@media (max-width: 31.25em) {
	.products-block ul.ws-flex {
		--ws-column-count: 1;
	}
	/* Products list */
	.products-list {
		--ws-columns: 1;
	}

}