:root {
	--bg-grey: #f4f4f4b5;
	--edit-btn: #a29061;
	--edit-hover-btn: #a29061cf;
	--dark-bg: #002B5C;
	--grey-bg-op: rgba(0, 43, 92, 0.04);
	--contact-bg: rgba(162, 144, 97, 0.05);
	--box-border: rgba(162, 144, 97, 0.2);
}

.brandsGrid {
	padding-block: 3rem;
	border-bottom: 1px solid #00000030;

	.wrap p:last-child {
		padding-bottom: 0;
	}
	.lists.loading {
		opacity: .5;
		pointer-events: none;
	}
	ul {
		--gap-size: 1rem;
		list-style-type: none;
		padding: 0;
		margin: 0;
		grid-gap: var(--gap-size);
		padding-block: var(--gap-size);
		display: grid;
		grid-template-columns: repeat(auto-fit, minmax(min(calc(50% - var(--gap-size)), 18rem), 1fr));
		li {
			a {
				background-color: #fff;
				border-radius: 4px;
				padding: 1rem;
				display: flex;
				justify-content: center;
				align-items: center;
				min-height: 105px;
				box-shadow: 0 3px 10px rgba(17, 17, 17, 0.08);
				transition: box-shadow .5s ease;
			}
			&:active a,
			&:focus a,
			&:hover a {
				box-shadow: 0 0 0 transparent;
			}
			&:after {
				display: none;
			}
			img {
				height: 60px;
				object-fit: contain;
			}
		}
	}
	.top {
		text-align: center;
		max-width: 680px;
		margin-inline: auto;
	}
}

.brandList {
	padding-block: 3rem;
	.title {
		margin-bottom: 1rem;
	}
	.lists.loading {
		opacity: .5;
		pointer-events: none;
	}
	ul {
		list-style-type: none;
		margin: 0;
		padding: 0;
		display: flex;
		flex-direction: column;
		li {
			border: 1px solid #e2e2e2;
			a {
				position: relative;
				display: flex;
				padding: 1rem;
				background-color: #fff;
				color: #000;
				&:active,
				&:focus,
				&:hover {
					box-shadow: 0 1px 20px #1111112e;
					z-index: 1;
				}
			}
		}
	}
	.lists {
		display: flex;
		flex-wrap: wrap;
		@media (max-width: 480px) {
			justify-content: center;
		}
	}
	@media (max-width: 480px) {
		.title {
			text-align: center;
		}
	}
}

.contentImage {
	.image {
		width: 100%;
		height: 100%;
		display: flex;
		img {
			width: 100%;
			height: 100%;
			object-fit: cover;
		}
		@media (max-width: 768px) {
			order: 1;
		}
	}
	.wrap {
		--column: 2;
		display: grid;
		grid-template-columns: repeat(var(--column), 1fr);
		align-items: center;
		justify-content: left;
		@media (max-width: 768px) {
			--column: 1;
		}
	}
	.content {
		max-width: 600px;
		padding: clamp(1rem, 4vw, 2rem);
		font-size: clamp(.75rem, 2vw, .95rem);
		h2, h3, h4, h5, h6 {
			margin-bottom: 1rem;
		}
		@media (max-width: 768px) {
			order: 2;
		}
	}
	&.reverse {
		.content {
			order: 2;
			@media (min-width: 768px) {
				margin-right: auto;
			}
		}
	}
	&:not(.reverse) {
		.content {
			@media (min-width: 768px) {
				margin-left: auto;
			}
		}
	}
	&.dark {
		background-color: var(--dark-bg);
		.content {
			color: #fff;
			p, a, span {
				color: #fff;
			}
		}
	}
}

.contentListImage {
	padding-block: 4rem;

	h2, h3, h4, h5 {
		font-size: clamp(1.5rem, 2.5vw, 2.5rem);
		font-weight: bold;
		margin-bottom: 1rem;
		color: #212121;
	}
	.content {
		--gap: clamp(2rem, 7vw, 8.75rem);
		ul {
			--column: 2;
			list-style-type: none;
			padding: 0;
			margin: 0;
			display: grid;
			grid-template-columns: repeat(var(--column), 1fr);
			@media (max-width: 480px) {
				--column: 1;
			}
			li {
				font-family: 'Montserrat', sans-serif;
				font-size: clamp(1rem, 2vw, 1.25rem);
				color: #212121;
				margin-bottom: 1.25rem;
				display: flex;
				align-items: center;
				&:before {
					content: "";
					width: 25px;
					height: 25px;
					display: inline-flex;
					margin-right: .5rem;
					background: url("./images/list-icon.svg") no-repeat center;
					@media (max-width: 480px) {
						width: 15px;
						height: 15px;
						background-size: contain;
					}
				}
			}
		}
		@media (max-width: 1200px) {
			--gap: 2rem;
		}
	}
	.wrap {
		--column: 2;
		display: grid;
		grid-template-columns: repeat(var(--column), 1fr);
		align-items: center;
		@media (max-width: 1200px) {
			--column: 1;
			.image {
				grid-row: span 1/-1;
				margin-bottom: 2rem;
			}
		}
	}
	&:not(.reverse) {
		.content {
			padding-right: var(--gap);
		}
	}
	&.reverse {
		.wrap {
			@media (min-width: 1200px) {
				.image {
					grid-row: span 1/-1;
				}
			}
		}
	}
	&.dark {
		background-color: var(--grey-bg-op);
	}
	@media (min-width: 1200px) {
		&:not(.reverse) {
			.content {
				padding-right: var(--gap);
			}
		}
		&.reverse {
			.content {
				padding-left: var(--gap);
			}
		}
	}
}

.accordionImage {
	margin-block: clamp(2rem, 6vw, 4rem);

	.content {
		ul {
			list-style-type: none;
			padding: 0;
			margin: 0;
		}
		ul.accordionList {

			.title {
				font-size: clamp(1rem, 4vw, 1.125rem);
				font-weight: normal;
				color: var(--dark-bg);
				display: flex;
				align-items: center;
				justify-content: space-between;
				gap: 1rem;
				cursor: pointer;
				user-select: none;
				padding-block: 1.6rem;

				&:after {
					content: "";
					width: 20px;
					height: 16px;
					display: inline-flex;
					background: url("./images/arrow-right.svg") no-repeat center;
					transition: all .3s ease;
				}
			}

			li.item {
				p {
					min-height: 0;
					padding: 0;
				}
				&:not(:last-child) {
					border-bottom: 1px solid rgba(0, 43, 92, 0.15);
				}
				.accordionContent {
					display: grid;
					grid-template-rows: 0fr;
					opacity: 0;
					overflow: hidden;
					transition: grid-template-rows .3s ease, opacity .3s ease;
					ul {
						min-height: 0;
						padding: 0;
						li {
							display: flex;
							align-items: flex-start;
							gap: .75rem;
							font-size: 1rem;
							a {
								display: flex;
								align-items: flex-start;
								gap: .75rem;
								color: #5a5a5a;
								transition: all .3s ease;
								&:hover {
									color: var(--edit-btn);
									i {
										background: var(--edit-btn);
									}
								}
							}
							i {
								display: inline-flex;
								width: 16px;
								height: 26px;
								transition: all .3s ease;
								background: #111;
							}
							.location {
								mask: url("./images/location-icon.svg") no-repeat center;
							}
							.phone {
								mask: url("./images/phone-icon.svg") no-repeat center;
							}
							.email {
								mask: url("./images/email-icon.svg") no-repeat center;
							}
							&:not(:last-child) {
								margin-bottom: 1rem;
							}
						}
					}
				}
				&.active {
					.accordionContent {
						grid-template-rows: 1fr;
						opacity: 1;
						padding-bottom: 2rem;
					}
					.accordionTitle::after {
						transform: rotate(90deg);
					}
				}
			}
		}
	}
	@media (min-width: 992px) {
		.image {
			height: 100%;
			img {
				height: 100%;
				object-fit: cover;
			}
		}
	}
}

.headerContent {
	--hmax: 740px;
	position: relative;
	.bgimg {
		height: clamp(400px, 70vw, var(--hmax));
	}
	.content {
		position: absolute;
		bottom: 0;
		left: 0;
		width: 100%;
		color: #ffffff;
		text-align: center;
		.title {
			margin-bottom: 1.5rem;
			text-shadow: 0 1px 1px #00000057;
		}
		ul.brands {
			display: grid;
			grid-template-columns: repeat(auto-fill, minmax(min(calc(50% - 1.5rem), 17rem), 1fr));
			grid-gap: clamp(.5rem, 2vw, 1.5rem);
			list-style-type: none;
			margin: 0;
			padding: 0;
			li {
				background-color: #ffffff;
				padding: 1rem;
				display: flex;
				height: clamp(40px, 6vw, 86px);
				align-items: center;
				justify-content: center;
				width: 100%;
				svg, img {
					max-height: clamp(15px, 4vw, 40px);
					max-width: 200px;
					width: auto;
				}
			}
		}
		.wrap {
			padding: clamp(1rem, 4vw,2rem);
			background-color: rgba(0,0,0,.5);
		}
	}
}

.contentButton {
	font-family: 'gothamlight', sans-serif;
	padding-block: clamp(3rem, 8vw, 5rem);
	text-align: center;
	p {
		padding-bottom: 0;
	}
	.content {
		max-width: 1090px;
		margin-inline: auto;
		p {
			font-size: clamp(1.2rem, 4vw, 1.75rem);
			line-height: 140%;
			margin-bottom: 2.5rem;
		}
	}
}

.titleContent {
	padding-block: 3rem;
	p {
		padding-bottom: 0;
	}
	.title {
		text-transform: uppercase;
		color: var(--dark-bg);
		font-size: clamp(1.5rem, 4vw, 2.25rem);
		margin-bottom: clamp(1rem, 4vw, 2rem);
	}
	.wrap {
		text-align: center;
		max-width: 866px;
		margin-inline: auto;
		p {
			font-size: clamp(1rem, 4vw, 1.25rem);
		}
	}
}

.scheduleService {
	padding-block: clamp(3rem, 8vw, 6.25rem);
	background-color: var(--contact-bg);
	.title.xbig {
		text-align: center;
	}
}

.iconGridbox {
	padding-block: clamp(3rem, 8vw, 6.25rem);
	background-color: var(--grey-bg-op);
	.title.big {
		text-align: center;
	}
	ul.list {
		--gap: 2rem;
		--column: 32.8%;
		list-style-type: none;
		padding: 0;
		margin: 0;
		display: flex;
		justify-content: center;
		flex-wrap: wrap;
		gap: var(--gap);
		> li {
			flex-basis: calc(var(--column) - calc(var(--gap) / 2));
			text-align: center;
			background-color: #ffffff;
			padding: 2.875rem 2rem;
			border: 1px solid var(--box-border);
			.title {
				font-size: clamp(1.2rem, 4vw, 1.5rem);
				margin-block: 2rem 1rem;
				color: var(--dark-bg);
			}
			@media (max-width: 1200px) {
				--column: 50%;
			}
			@media (max-width: 768px) {
				--column: 100%;
			}
			ul, ol {
				list-style-type: none;
				padding: 0;
				margin: 0;
				text-align: center;
				li {
					font-family: 'gothamlight', sans-serif;
					display: block;
					font-size: 1rem;
					line-height: 170%;
				}
			}
		}
	}
	@media (max-width: 480px) {
		.title br {
			display: none;
		}
	}
}

.brandTrusted {
	padding-block: clamp(3rem, 8vw, 6.25rem);
	text-align: center;
	.logo {
		margin-bottom: 2rem;
	}
}

.brandDetailHeader {
	--hmax: 557px;
	position: relative;
	.bgimg {
		height: clamp(350px, 70vw, var(--hmax));
		background-attachment: fixed;
		background-size: inherit;
	}
	.title.xbig {
		color: #fff;
		text-shadow: 0 1px 1px #00000057;
	}
	.content {
		max-width: 920px;
		padding-block: 4rem 1rem;
		margin-inline: auto;
		text-align: center;
		height: 100%;
		.wrap {
			position: sticky;
			top: 120px;
		}
		p {
			color: #fff;
			margin-block: 1rem 0;
		}
	}
}

.editLink {
	position: absolute;
	top: 0;
	left: 0;
	padding: .5rem 1rem;
	background-color: var(--edit-btn);
	color: #fff !important;
	display: flex;
	align-items: center;
	justify-content: center;
	&:hover {
		background-color: var(--edit-hover-btn);
	}
}
.popupContentx {
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -45%);
	opacity: 0;
	visibility: hidden;
	transition: all .3s ease;
	z-index: 992;

	width: calc(100% - 1rem);
	background-color: #fff;
	max-width: 700px;
	padding: clamp(1rem, 5vw, 3rem);
	box-shadow: 0 20px 40px #0000001f;
	border-radius: 4px;

	max-height: 70vh;
	overflow-y: auto;
	overflow-x: hidden;

	img.wp-post-image {
		max-height: 150px;
		width: auto;
		margin-bottom: 2rem;
		max-width: 300px;
	}
	&.active {
		transform: translate(-50%, -50%);
		opacity: 1;
		visibility: visible;
	}
}
.closex {
	--size: 40px;
	width: var(--size);
	height: var(--size);
	position: absolute;
	top: 0;
	right: 0;
	display: flex;
	justify-content: center;
	align-items: center;
	cursor: pointer;
	svg {
		pointer-events: none;
	}
}
.overlayx {
	position: fixed;
	top: 0;
	left: 0;
	background-color: #ffffff7d;
	width: 100%;
	height: 100%;
	z-index: 991;
	opacity: 0;
	visibility: hidden;
	transition: all .3s ease;
	&.active {
		opacity: 1;
		visibility: visible;
	}
}
.bgimg {
	background-repeat: no-repeat;
	background-position: top center;
	background-size: cover;
}
.bgrey {
	background-color: var(--bg-grey);
}
.initialRelative .wp-block-cover__inner-container {
	position: initial !important;
}

.title {

	&.xbig {
		font-family: 'Cormorant Garamond', sans-serif;
		text-transform: uppercase;
		font-size: clamp(1.5rem, 4vw, 3rem);
		font-weight: normal;
	}
	&.big {
		text-transform: uppercase;
		color: var(--dark-bg);
		font-size: clamp(1.5rem, 4vw, 2.25rem);
		margin-bottom: clamp(1rem, 4vw, 2rem);
	}
}

.gridFull {
	grid-template-columns: inherit !important;
	> .content {
		padding: clamp(1rem, 4vw, 3.125rem);
	}
	@media (min-width: 992px) {
		--container-width: 1380px;
		--container-padding: 15px;
		--imagen: 7%;
		display: grid;
		grid-template-columns:
        minmax(var(--container-padding),1fr)
        minmax(0,calc((var(--container-width)/ 2)))
        minmax(0,calc(var(--container-width)/ 2))
        minmax(var(--container-padding),1fr) !important;
		align-items: center;

		> .content {
			display: flex;
			flex-direction: column;
			justify-content: center;
		}
		> .image {
			grid-column: 1/3;
		}
	}
}

.container {
	&.medium {
		max-width: 1090px;
	}
	&.small {
		max-width: 866px;
	}
}

body:not(.home) .inner-pg-menu {
	opacity: 1;
	visibility: visible;
}

.single-service,
.single-brand {
	.addtoany_share_save_container {
		margin: 3rem 0 !important;
		display: flex;
		justify-content: center;
		align-items: center;
		.addtoany_header {
			color: #000;
			font-size: 16px;
			font-style: normal;
			font-weight: 400;
			line-height: 16px;
			margin-bottom: 0px;
			position: relative;
			top: -3px;
			margin-right: 9px;
		}
		.addtoany_list a span {
			background: transparent !important;
		}
		.addtoany_list a span svg path {
			fill: #A39161 !important;
		}
	}
}

.headerContent,
.contentListImage,
.titleContent,
.contentButton,
.accordionImage
{
	--responsive--aligndefault-width: 90%;
}
.accordionTitleWrap {
	h2,h3,h4,h5 {
		font-size: clamp(1rem, 4vw, 1.125rem);
	}
}
@media (min-width: 992px) {
	.w-lg-75 { width: 75% !important; }
}
