/*! modern-normalize v3.0.1 | MIT License | https://github.com/sindresorhus/modern-normalize */

/*
Document
========
*/

/**
Use a better box model (opinionated).
*/

*,
::before,
::after {
	box-sizing: border-box;
}

html {
	/* Improve consistency of default fonts in all browsers. (https://github.com/sindresorhus/modern-normalize/issues/3) */
	font-family:
		system-ui,
		'Segoe UI',
		Nunito,
		Helvetica,
		Arial,
		sans-serif,
		'Apple Color Emoji',
		'Segoe UI Emoji';
	line-height: 1.15; /* 1. Correct the line height in all browsers. */
	-webkit-text-size-adjust: 100%; /* 2. Prevent adjustments of font size after orientation changes in iOS. */
	tab-size: 4; /* 3. Use a more readable tab size (opinionated). */
}

/*
Sections
========
*/

body {
	margin: 0; /* Remove the margin in all browsers. */
}

/*
Text-level semantics
====================
*/

/**
Add the correct font weight in Chrome and Safari.
*/

b,
strong {
	font-weight: bolder;
}

/**
1. Improve consistency of default fonts in all browsers. (https://github.com/sindresorhus/modern-normalize/issues/3)
2. Correct the odd 'em' font sizing in all browsers.
*/

code,
kbd,
samp,
pre {
	font-family:
		ui-monospace,
		SFMono-Regular,
		Consolas,
		'Liberation Mono',
		Menlo,
		monospace; /* 1 */
	font-size: 1em; /* 2 */
}

/**
Add the correct font size in all browsers.
*/

small {
	font-size: 80%;
}

/**
Prevent 'sub' and 'sup' elements from affecting the line height in all browsers.
*/

sub,
sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}

sub {
	bottom: -0.25em;
}

sup {
	top: -0.5em;
}

/*
Tabular data
============
*/

/**
Correct table border color inheritance in Chrome and Safari. (https://issues.chromium.org/issues/40615503, https://bugs.webkit.org/show_bug.cgi?id=195016)
*/

table {
	border-color: currentcolor;
}

/*
Forms
=====
*/

/**
1. Change the font styles in all browsers.
2. Remove the margin in Firefox and Safari.
*/

button,
input,
optgroup,
select,
textarea {
	font-family: inherit; /* 1 */
	font-size: 100%; /* 1 */
	line-height: 1.15; /* 1 */
	margin: 0; /* 2 */
}

/**
Correct the inability to style clickable types in iOS and Safari.
*/

button,
[type='button'],
[type='reset'],
[type='submit'] {
	-webkit-appearance: button;
}

/**
Remove the padding so developers are not caught out when they zero out 'fieldset' elements in all browsers.
*/

legend {
	padding: 0;
}

/**
Add the correct vertical alignment in Chrome and Firefox.
*/

progress {
	vertical-align: baseline;
}

/**
Correct the cursor style of increment and decrement buttons in Safari.
*/

::-webkit-inner-spin-button,
::-webkit-outer-spin-button {
	height: auto;
}

/**
1. Correct the odd appearance in Chrome and Safari.
2. Correct the outline style in Safari.
*/

[type='search'] {
	-webkit-appearance: textfield; /* 1 */
	outline-offset: -2px; /* 2 */
}

/**
Remove the inner padding in Chrome and Safari on macOS.
*/

::-webkit-search-decoration {
	-webkit-appearance: none;
}

/**
1. Correct the inability to style clickable types in iOS and Safari.
2. Change font properties to 'inherit' in Safari.
*/

::-webkit-file-upload-button {
	-webkit-appearance: button; /* 1 */
	font: inherit; /* 2 */
}

/*
Interactive
===========
*/

/*
Add the correct display in Chrome and Safari.
*/

summary {
	display: list-item;
}

/*!
 * Hamburgers
 * @description Tasty CSS-animated hamburgers
 * @author Jonathan Suh @jonsuh
 * @site https://jonsuh.com/hamburgers
 * @link https://github.com/jonsuh/hamburgers
 */
.hamburger {
  padding: 15px 15px;
  display: inline-block;
  cursor: pointer;
  transition-property: opacity, filter;
  transition-duration: 0.15s;
  transition-timing-function: linear;
  font: inherit;
  color: inherit;
  text-transform: none;
  background-color: transparent;
  border: 0;
  margin: 0;
  overflow: visible; }
  .hamburger:hover {
	opacity: 0.7; }
  .hamburger.is-active:hover {
	opacity: 0.7; }
  .hamburger.is-active .hamburger-inner,
  .hamburger.is-active .hamburger-inner::before,
  .hamburger.is-active .hamburger-inner::after {
	background-color: #000; }

.hamburger-box {
  width: 40px;
  height: 24px;
  display: inline-block;
  position: relative; }

.hamburger-inner {
  display: block;
  top: 50%;
  margin-top: -2px; }
  .hamburger-inner, .hamburger-inner::before, .hamburger-inner::after {
	width: 40px;
	height: 4px;
	background-color: #000;
	border-radius: 4px;
	position: absolute;
	transition-property: transform;
	transition-duration: 0.15s;
	transition-timing-function: ease; }
  .hamburger-inner::before, .hamburger-inner::after {
	content: "";
	display: block; }
  .hamburger-inner::before {
	top: -10px; }
  .hamburger-inner::after {
	bottom: -10px; }

/*
 * Minus
 */
.hamburger--minus .hamburger-inner::before, .hamburger--minus .hamburger-inner::after {
  transition: bottom 0.08s 0s ease-out, top 0.08s 0s ease-out, opacity 0s linear; }

.hamburger--minus.is-active .hamburger-inner::before, .hamburger--minus.is-active .hamburger-inner::after {
  opacity: 0;
  transition: bottom 0.08s ease-out, top 0.08s ease-out, opacity 0s 0.08s linear; }

.hamburger--minus.is-active .hamburger-inner::before {
  top: 0; }

.hamburger--minus.is-active .hamburger-inner::after {
  bottom: 0; }
  
/*************************
 * Crystal colours *
 *************************/
:root {
  --color-primary: 0 75 255; /* #004bff */
  --color-secondary: 83 199 193; /* #53c7c1 */
  --color-accent: 255 131 15; /* #ff830f (mag.at: #3cdc78) */
  --color-text: 30 50 60;
  --color-light-text: 255 255 255;
  --color-background: 255 255 255;
  --color-dark-background: 30 50 60; /* #1e323c */
  --color-off-white: 247 247 247; /* rgb(var(--color-off-white)) */
}

/*************************
 * Crystal fonts *
 ************************
@font-face {
	font-family: "CGR Variable";
	src: url("../fonts/CGRVariable.woff2") format("woff2-variations"),
		 url("../fonts/CGRVariable.woff") format("woff-variations"),
		 url("../fonts/CGRVariable.ttf") format("truetype-variations");
} */

/*************************
 * Crystal fonts *
 *************************/
@font-face {
	font-family: "CGR Variable";
	src: url("../fonts/CGRVariable.woff2") format("woff2"),
		 url("../fonts/CGRVariable.woff") format("woff"),
		 url("../fonts/CGRVariable.ttf") format("truetype");
	font-weight: 100 900; 
	font-style: normal;
}

/*************************
 * Crystal font sizes *
 *************************/
:root {
	--font-size-body: 1.0625rem;
}
@media (min-width: 768px) {
	:root {
		--font-size-body: 1.125rem;
	}
}

/*************************
 * Crystal theme styles *
 *************************/
html {
	font-size: 100%;
}
body {
	color: rgb(var(--color-text));
	background: rgb(var(--color-background));
	font-family: "CGR Variable", sans-serif;
	font-weight: 300;
	font-size: var(--font-size-body);
	line-height: 100%;
	-webkit-text-size-adjust: 100%;
	-webkit-font-smoothing: antialiased;
}
h1, h2, h3, h4, h5,
.h1, .h2, .h3, .h4, .h5 {
	display: block;
	margin: 0 0 1em;
	font-weight: 700;
	line-height: 1.3;
}
p {
	margin: 0 0 1.4em;
	line-height: 1.4;
}
ul, ol {
	margin-bottom: 1.4em;
	padding-inline-start: 0;
	list-style-type: none;
}
a {
	outline: transparent solid 0px;
	text-decoration: none;
}
a.ext {
	position: relative;
	display: inline-block;	
	margin-right: 14px;		
	line-height: 1.1;
}
.icon {
	display: inline-block;
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
}
a.ext::after {
	position: absolute;
	top: 0;
	right: -14px;
	content: '\f08e';
	font: var(--fa-font-solid);
	font-size: 65%;
	transition: color 0.2s ease;
}
a.ext:hover::after {
	color: #222;
}
strong {
	font-weight: 700;
}
sub, sup {
	position: relative;
	vertical-align: baseline;
	font-size: 75%;
	line-height: 0;	
}
sub {
	bottom: -0.25em;
}
sup {
	top: -0.5em;
}
.nowrap {
	white-space: nowrap;
}
.fixed {
	position: fixed;
}
.sticky {
	position: sticky;
}
.hidden {
	display: none !important;
}
:hover, :focus {
	outline: none;
}

/*
 * Buttons
 */
button,
.button,
.logo,
.nav-primary ul li a,
.nav-primary ul li > span,
.ui-accordion .ui-accordion-header,
.stack-card-blurb a,
.custom-swiper-button-prev,
.custom-swiper-button-next,
form.quote div[class*="-wrap"] label {
			user-select: none;
	-webkit-user-select: none;
	-webkit-text-size-adjust: none;
	-webkit-touch-callout: none;
	-webkit-tap-highlight-color: transparent;
	text-size-adjust: none;
}
.button {
	position: relative;
	display: inline-block;
	overflow: hidden;
	vertical-align: middle;
	border: 0 !important;
	padding: 15px;
	color: #fff;
	background-color: rgb(var(--color-primary));
	cursor: pointer;
	font-size: 1.0625rem;
	font-weight: 500;
	line-height: 1.2;
	text-decoration: none;
	white-space: nowrap;
	transform: scale(1);
	/* backface-visibility: hidden; */
	will-change: transform;
	transition: margin 0.1s linear,
				padding 0.1s linear,
				opacity 0.2s ease-in-out,
				box-shadow 0.2s ease-in-out,
				transform 0.2s ease-in-out !important;
}
.button::before {
	position: absolute;
	inset: 0;
	content: '';
	z-index: 0;
	/* background: linear-gradient(135deg, #59cc57 0%, #69ef76 50%, #60e06f 51%, #48bf4c 71%, #4dbc47 100%); */
	background: linear-gradient(135deg, #38d7c7 0%, #53f7f3 50%, #4fe7e5 51%, #2fcabd 71%, #2cc9b6 100%);
	background-size: 400% 400%;
	background-position: 100% 70%;
	opacity: 0;
	transform: scale(0);
	transform-origin: center;
	transition: transform 0.2s ease,
				opacity 0.2s ease,
				background-position 0.19s ease;
}
.button:hover {
	opacity: 1 !important;
	transform: scale(1.1);
}
.button:hover::before,
.button.quote:hover::before {
	background-position: 0% 31%;
	opacity: 1;
	transform: scale(1.02);
	transition: transform 0.2s ease,
				opacity 0.2s ease,
				background-position 1s ease 0.1s;
}
.button > * {
	position: relative;
	z-index: 1;
}
.button span {
	position: relative;
	display: block;	
	z-index: 2;
	color: #fff;
	backface-visibility: hidden;
	transition: color 0.2s ease-in-out;
}
.button:not(.outline,.quote) span {
	text-shadow: 1px 1px 1px rgb(0 0 0 / 0);
}
.button:not(.outline,.quote):hover span {
	text-shadow: 1px 1px 1px rgb(0 0 0 / 0.1);
}
.button i {
	margin-right: 8px;
	text-shadow: 1px 1px 2px rgb(0 0 0 / 0.2);
	transition: transform 0.2s ease;
}
.button.outline {
	padding: 13px;
	background: transparent;
	box-shadow: 0 0 0 2px #fff;	
}
.button.outline:hover {
	padding: 15px;
	box-shadow: none !important;
}
.button.outline:hover span {
	color: rgb(var(--color-text));
}
.button.outline.dark {
	box-shadow: 0 0 0 2px rgb(var(--color-primary));
}
.button.outline.dark span {
	color: rgb(var(--color-primary));
}
.button.outline.dark:hover span {
	color: rgb(var(--color-text));
}
.button.quote {
	background-color: rgb(var(--color-accent));
	font-weight: 700;
}
.button.quote::before {
	background: linear-gradient(135deg, #ff2f31 0%, #ff7970 50%, #ff6659 51%, #ff1917 71%, #ff1019 100%);
	background-size: 400% 400%;
	background-position: 100% 70%;
}
.button.insta::before {
	background: #d6249f;
	background: radial-gradient(circle farthest-corner at 35% 90%, #fec564, transparent 50%), radial-gradient(circle farthest-corner at 0 140%, #fec564, transparent 50%), radial-gradient(ellipse farthest-corner at 0 -25%, #5258cf, transparent 50%), radial-gradient(ellipse farthest-corner at 20% -50%, #5258cf, transparent 50%), radial-gradient(ellipse farthest-corner at 100% 0, #893dc2, transparent 50%), radial-gradient(ellipse farthest-corner at 60% -20%, #893dc2, transparent 50%), radial-gradient(ellipse farthest-corner at 100% 100%, #d9317a, transparent), linear-gradient(#6559ca, #bc318f 30%, #e33f5f 50%, #f77638 70%, #fec66d 100%);
}

/*
 * Header
 */
.before-header {
	position: fixed;
	top: 0;
	right: 0;
	z-index: 99999;
	width: 100%;
	color: #fff;
}
.before-header div.wrap {
	position: relative;
	display: flex;
	align-items: start;	
}
.before-header a {
	height: 40px;
	border-width: 0 1px 0 0;
	border-style: solid;
	border-color: rgb(0 0 0 / 0.2);
	padding: 0 15px;
	color: #fff;
	font-size: 0.9375rem;
	line-height: 40px;
	text-decoration: none;
	transition: color 0.2s ease,
				background-color 0.2s ease;
}
.before-header a:hover {
	color: #bbb;
}
.before-header a span {
	display: none;
}
.before-header a i {
	width: auto;
	text-shadow: 1px 1px 2px rgb(0 0 0 / 0.2);
}
.before-header a:not(.quote) i {
	font-size: 0.875rem;
}
.before-header a.email {
	border-right-width: 0;
}
.before-header a.quote {
	position: absolute;
	top: 0;
	right: 0;
	width: calc(100% - 85px);
	border: 0;	
	background-color: rgb(var(--color-accent));
	font-size: 1rem;
	font-weight: 700;
	text-align: center;
}
.before-header a.quote:hover {
	color: #fff;
	background-color: #f00;
}
.before-header a.quote i {
	margin-right: 10px;
	transition: transform 0.2s ease;	
}
.before-header a.quote:hover i {
	transform: scale(1.2);
}
header {
	position: fixed;
	top: 0;
	left: 0;
	z-index: 9999;
	overflow: hidden;
	width: 100%;
	width: calc(100% + 1px); /* box-shadow workaround */
	height: 140px;
	border-top: 40px solid rgb(var(--color-primary));	
	background-color: rgb(255 255 255 / 1);
	box-shadow: 0 1px 1px 0 rgb(0 0 0 / 0);
	-webkit-backdrop-filter: blur(40px);
	backdrop-filter: blur(40px);
	transition: height 0.3s ease, 
				border 0.3s ease,
				background-color 0.3s ease,
				box-shadow 0.3s ease;
}
.scrolled header {
	height: 128px;
	box-shadow: 0 1px 1px 0 rgb(0 0 0 / 0.1);
}
header.open {
	height: 100vh;
	background-color: rgb(255 255 255 / 1) !important;
}
header.scroll {
	overflow-y: auto;
}
header > div.wrap {
	position: relative;
}

/*
 * Logo
 */
.logo {
	position: relative;
	align-items: center;
	width: 251px;
	height: 76px;
	margin: 10px 15px;
	border-width: 2px 0;
	border-style: solid;
	border-color: transparent;
	box-sizing: content-box;
	background-image: url(../img/logo.png);
	background-repeat: no-repeat;
	background-size: cover;
	cursor: pointer;
	transition: width 0.3s ease,
				height 0.3s ease,
				padding 0.3s ease;
}
@media screen and (-webkit-min-device-pixel-ratio: 2), screen and (min-device-pixel-ratio: 2) { .logo { background-image: url('../img/logo@2x.png'); } }
@media screen and (-webkit-min-device-pixel-ratio: 3), screen and (min-device-pixel-ratio: 3) { .logo { background-image: url('../img/logo@3x.png'); } }
.scrolled header .logo {
	width: 218px;
	height: 66px;
	border-width: 2px 0;
}

/* Logo sparkles */
.sparkle-layer {
	position: absolute;
	height: 100%;
	aspect-ratio: 1.16;
	pointer-events: none;
	overflow: visible;
}
.sparkle-layer span {
	position: absolute;
	aspect-ratio: 1;
	opacity: 0;
	transform: translate(-50%, -50%) scale(0.15) rotate(var(--r, 0deg));
	background: url('../img/sparkle_3.svg') center / contain no-repeat;
	animation: sparkle-pop 10s ease-in-out calc(2s + var(--delay, 0s)) infinite;
	will-change: transform, opacity;
	backface-visibility: hidden;
}
.sparkle-layer span.sparkle-1 { width: 30%; top: 30%; left: 20%; --delay: 0s;    --r: 12deg; }
.sparkle-layer span.sparkle-2 { width: 28%; top: 20%; left: 30%; --delay: 0.25s; --r: 42deg; }
.sparkle-layer span.sparkle-3 { width: 26%; top: 58%; left: 37%; --delay: 0.5s;  --r: 25deg; }
.sparkle-layer span.sparkle-4 { width: 31%; top: 40%; left: 50%; --delay: 0.75s; --r: 55deg; }
.sparkle-layer span.sparkle-5 { width: 22%; top: 52%; left: 50%; --delay: 0.85s; --r: 10deg; }
.sparkle-layer span.sparkle-6 { width: 32%; top: 30%; left: 73%; --delay: 1.1s;  --r: 70deg; }


@keyframes sparkle-pop {
	0% { 
		opacity: 0; 
		transform: translate(-50%, -50%) scale(0.15) rotate(var(--r)); 
	}
	1.45% { /* Was 10% */
		opacity: 1; 
		transform: translate(-50%, -50%) scale(0.35) rotate(calc(var(--r) + 18deg)); 
	}
	7.25% { /* Was 50% */
		opacity: 1; 
		transform: translate(-50%, -50%) scale(1) rotate(calc(var(--r) + 90deg)); 
	}
	13.05% { /* Was 90% */
		opacity: 1; 
		transform: translate(-50%, -50%) scale(0.35) rotate(calc(var(--r) + 162deg)); 
	}
	14.5% { /* Was 100% */
		opacity: 0; 
		transform: translate(-50%, -50%) scale(0.15) rotate(calc(var(--r) + 180deg)); 
	}
	
	/* 'Wait' phase (1.45s to 10s) */
	100% { 
		opacity: 0; 
		transform: translate(-50%, -50%) scale(0.15) rotate(calc(var(--r) + 180deg)); 
	}
}

/* Hamburger */
.hamburger {
	behavior: url(PIE.htc);
	position: fixed;
	top: 50px;
	right: 3px;
	z-index: 99999;
	margin-top: -28px;
	padding: 12px 12px;
	opacity: 1;
	line-height: 0;
	transition: top 0.2s ease;
}
.hamburger:hover {
	opacity: 1;
}
.scrolled header .hamburger {
	top: 44px;
}
.hamburger.is-active:hover {
	opacity: 1;
}
.hamburger.is-active .hamburger-inner,
.hamburger.is-active .hamburger-inner::before,
.hamburger.is-active .hamburger-inner::after {
	background-color: rgb(var(--color-dark-background));
}
.hamburger-box {
	width: 30px;
	height: 30px;
	line-height: 0;
}
.hamburger-inner {
	margin-top: -1px;
}
.hamburger-inner, .hamburger-inner::before, .hamburger-inner::after {
	width: 30px;
	height: 3px;
	background-color: rgb(var(--color-dark-background));
}
.hamburger-inner::before {
	top: -9px;
}
.hamburger-inner::after {
	bottom: -9px;
}

/*
 * Navigation
 */ 
.nav-primary {
	width: 100%;
	margin-top: 80px;
}
.nav-primary ul {
	margin: 0 0 0 10px;
	font-size: 0;
}
.nav-primary ul li {
	display: inline-block;
	float: left;
	clear: both;
	text-align: left;
}
.nav-primary > ul > li:last-of-type {
	padding-bottom: 50px;
}
.nav-primary ul li a,
.nav-primary ul li > span {
	position: relative;
	display: inline-block;
	padding: 14px 15px;
	color: rgb(var(--color-text));
	cursor: pointer;
	font-size: 1.5rem;
	font-weight: 700;
	line-height: 1;
	text-decoration: none;
	transition: color 0.2s ease;
}
.nav-primary ul li.has-children > span {
	padding-right: 40px;
}
.nav-primary ul li.has-children > span::after {
	position: absolute;
	top: 15px;
	right: 8px;
	content: '\f107';
	display: block;
	color: rgb(var(--color-text));
	font: var(--fa-font-solid);
	font-size: 1.4375rem;
	transition: color 0.2s ease,
				transform 0.2s ease,
				line-height 0.3s ease;
}
@media screen and (max-width: 991px) { 
	.nav-primary ul li.has-children:focus > span::after {
		color: #222;
		transform: rotate(180deg);
	}
	.nav-primary ul li.has-children:focus ul.sub-menu {
		height: auto;
		max-height: 550px;
	}
}
.nav-primary ul.sub-menu {
	overflow: hidden;
	max-height: 0;
	transition: max-height 0.5s ease;
}
.nav-primary ul.sub-menu li:first-of-type {
	/* padding-top: 10px; */
}
.nav-primary ul.sub-menu li:last-of-type {
	padding-bottom: 10px;
}
.nav-primary ul.sub-menu li a {
	height: auto !important;
	border: 0;
	font-size:  1.3125rem;
	line-height: 1.3 !important;
}
.nav-primary ul.sub-menu li a::before {
	display: none;
}
@media screen and (max-width: 991px),
	   screen and (min-width: 1152px) { 
	ul.sub-menu > li.contact-link {
		display: none !important;
	}
}
.nav-primary > div.quote-btn-wrap {
	display: none;	
}

/*
 * Front page hero
 */
#front-page-hero,
#front-page-hero .swiper-container {
	height: calc(100vh - 40px);
	min-height: 460px;
	max-height: 1020px;
}
#front-page-hero {
	position: relative;
	overflow: hidden;
	background-color: #fff;
	background-image: url('../img/hero_georgian-bars-sunlight.webp');
	background-size: cover;
	background-position: center center;
	transition: margin 0.3s ease;
}
#front-page-hero::before {
	position: absolute;
	inset: 0;
	content: '';
	opacity: 0.1;
	background-color: #fff;
	transition: opacity 0.2s ease;
}
#front-page-hero.solid::before {
	opacity: 1;
}
#front-page-hero .wrap {
	position: relative;
	max-width: 100%;
	z-index: 9;
}
#front-page-hero .wrap::before,
#front-page-hero .wrap::after {
	display: block;
	clear: none;
}
#front-page-hero .wrap::before,
#global-hero::before,
#front-page-why::after {
	position: absolute;
	inset: 0;
	content: '';
	opacity: 0.6;
	background: linear-gradient(89.7deg, rgba(0, 0, 0, 1) -10.7%, rgba(53, 100, 125, 1) 88.8%);
}
/* #front-page-hero .wrap::before {
	opacity: 0.5;
} */
#front-page-hero .wrap::after,
#global-hero::after {
	position: absolute;
	top: -10vh;
	left: -5vh;
	bottom: -10vh;
	content: '';
	display: none;	
	opacity: 0;
	width: 60vw;
	background: linear-gradient(106deg, rgba(17, 20, 26, 0) 0%, rgba(17, 20, 26, 0) 50%, rgba(17, 20, 26, 1) 100%);
	transform: rotate(-8deg) scale(1.1) translate(-20px,-20px);
	transition: opacity 1s ease,
				transform 1s ease;
}
#front-page-hero .wrap.loaded::after,
#global-hero.loaded::after {
	transform: rotate(-8deg) scale(1.1) translate(0);
	opacity: 0.2;
}
#front-page-hero video {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center center;
	display: block;
}
#front-page-hero .swiper-container {
	width: 100%;
	max-width: 1152px;
}
#front-page-hero .swiper-container::after {
	position: absolute;
	inset: 0;
	content: '';
	display: none;
	background: radial-gradient(ellipse at right top,rgb(255 255 255 / 0.5) 0%, rgb(255 255 255 / 0) 50%);
}
#front-page-hero .swiper-slide {
	display: flex;
	align-items: center;
	padding: 140px 20px 60px;	
	color: #fff;
}
@media screen and (min-width: 411px) { #front-page-hero .swiper-slide { padding-right: 30px; padding-left: 30px; } }
@media screen and (min-width: 768px) { #front-page-hero .swiper-slide { padding-right: 60px; padding-left: 60px; } }
/* @media screen and (min-width: 992px) { #front-page-hero .swiper-slide { } } */
@media screen and (min-width: 1280px) { #front-page-hero .swiper-slide { padding-left: 20px; } }
@media screen and (min-width: 1366px) { #front-page-hero .swiper-slide { padding-right: 0; padding-left: 0; } }
#front-page-hero .swiper-slide div {
		width: 100%;
		max-width: 700px;
}
#front-page-hero .swiper-slide .h1 {
	margin-bottom: 20px;
	font-size: 2.1250rem;
	font-weight: 300;
	line-height: 1.1;
	letter-spacing: -1px;
}
.js .h1.reveal {
	opacity: 0;
}
.js .h1.reveal.reveal-ready {
	opacity: 1;
}
.h1.reveal span.word {
	display: inline-block;
	white-space: nowrap;
}
.h1.reveal span.letter {
	display: inline-block;
	opacity: 0;
	filter: blur(10px);	
	animation: focus 2s ease forwards;
	animation-delay: calc(var(--i) * 0.05s);
}
@keyframes focus {
	from {
		opacity: 0;
		filter: blur(10px);
	}
	to {
		opacity: 1;
		filter: blur(0);
	}
}
#front-page-hero .swiper-slide h1 {
	margin-bottom: 30px;
	font-size: 1rem;
	font-weight: 400;
}
#front-page-hero .swiper-slide h1 strong {
	font-weight: 400;	
}
#front-page-hero .swiper-slide a.button {
	margin-bottom: 20px;
}
#front-page-hero .swiper-slide a.button:first-of-type {
	margin-right: 20px;
}

/* Scroll down cue */
.scroll-down-cue {
	position: absolute;
	left: 50%;
	bottom: 30px;
	z-index: 99;
	opacity: 1;
	width: 41px;
	height: 30px;
	margin-left: -20px;
	transition: bottom 0.5s ease, opacity 0.5s ease, transform 0.5s;
	animation: mover 5s infinite cubic-bezier(0.175, 0.885, 0.32, 1.275);
}
.scroll-down-cue::before, .scroll-down-cue::after {
	position: absolute;
	top: 0;
	left: 0;
	content: '';
	width: 25px;
	height: 1px;
	background-color: #fff;
	transform: rotate(45deg);	
}
.scroll-down-cue::after {
	left: 17px;
	transform: rotate(-45deg);
}
@media screen and (max-height: 500px) {
	.scroll-down-cue { display: none; }
}
@keyframes mover {
	10%, 100% {
		transform: translateY(0);
	}
	0% {
		transform: translateY(0);
	}
	5% {
		transform: translateY(-10px);
	}
}
.scroll-down-cue.hide {
	bottom: -20px;
	opacity: 0;
}

/*
 * Global hero image
 */
#global-hero {
	position: relative;
	overflow: hidden;
	width: 100%;
	border-top: 40px solid #666;
	padding: 160px 20px 60px;	
	background-size: cover;
	background-position: center center;
	transition: padding 0.3s ease;
}
#global-hero div.wrap {
	position: relative;
	display: flex;
	align-items: center;
	z-index: 99;
	max-width: 768px;
	height: 100%;
	text-align: center;
}
#global-hero h1,
#global-hero .h1 {
	max-width: none;
	margin: 0 auto;
	color: #fff;
	font-size: 2em;
}

/*
 * Structure
 */
.wrap {
	width: 100%;
	max-width: 1152px;
	margin: 0 auto;
}
.wrap::before,
.wrap::after {
	content: '';
	display: table;
	clear: both;
}
.row {
	width: 100%;
} 
.row::before, .row::after {
	content: '';
	display: table;
}
.row::after {
	clear: both;
}
.col-1,
.col-2,
.col-3,
.col-4 {
	width: 100%;
}
.home .fade-effect,
#global-hero .fade-effect {
	opacity: 0;
	animation-duration: 1s;
	animation-fill-mode: both;
	animation-timing-function: ease-in-out;
}
@keyframes fadeInUp {
	from { opacity: 0; transform: translateY(20px); }
	to { opacity: 1; transform: translateY(0); }
}
.fade-in-up {
	animation-name: fadeInUp;
}

/* 
 * Breadcrumbs
 */
.nav-breadcrumb {
	box-sizing: content-box;
	max-width: 1152px;
	margin: 0 auto 30px;		
}
.nav-breadcrumb ol li {
	position: relative;
	display: inline-block;
	font-size: 0.875rem;
}
.nav-breadcrumb ol li:first-of-type {
	display: inline-block;
	padding: 0 0 0 0;
	background: rgb(var(--color-primary));
	line-height: 18px;
	clip-path: polygon(
		0 0,
		calc(100% - 9px) 0,
		100% 50%,
		calc(100% - 9px) 100%,
		0 100%
	);
	transition: background-color 0.2s ease;
}
.nav-breadcrumb ol li:first-of-type:hover {
	background: rgb(var(--color-text));
}
.nav-breadcrumb ol li:last-child::before {
	content: '\00a0\f0da\00a0\00a0';
	color: #4f5f75;
	font-family: 'Font Awesome 5 Free';
	font-weight: 900;
}
.nav-breadcrumb ol li:nth-child(2)::before {
	content: '';
}
.nav-breadcrumb ol li a {
	display: block;
	border: 0 !important;
	padding: 9px 12px 9px 8px;
	color: #fff !important;
	background: transparent;
	font-weight: 700;
	line-height: 0;
}
.nav-breadcrumb ol li a:hover {
	color: #fff;
}

/*
 * Content
 */
section.content {
	padding: 50px 20px 30px;
	background-color: #fff;
}

section.content a:not(.button),
.cards p a,
.accordion p a,
#front-page-testimonials .widget-intro p a,
.learn-more a {
	color: rgb(var(--color-primary));
	text-decoration: none;
	background-image: linear-gradient(transparent calc(100% - 1px), rgb(var(--color-text) / 1) 1px), linear-gradient(transparent calc(100% - 1px), rgb(var(--color-primary) / 0.3) 1px);
	background-position: 0 calc(100% - 1px), 0 calc(100% - 1px);
	background-repeat: no-repeat;
	background-size: 0% 6px, 100% 6px;
	transition: color 0.2s ease, background 0.2s ease;
}
section.content a:not(.button):hover,
.accordion p a:hover,
.cards p a:hover,
#front-page-testimonials .widget-intro p a:hover,
.locations p a:hover,
.learn-more a:hover {
	color: #222;
	background-size: 100% 6px, 100% 6px;
}
section.content a.button {
	margin: 5px 0;
}
section.content h1,
section.content h2,
section.content h3,
section.content h4,
section.content h5 {
	padding-top: 0.2em;
}
section.content h2,
h1.quote-header {
	font-size: 1.22em;
}
section.content h3 {
	color: #666;
	font-size: 1.17em;
}
section.content h4 {
	font-size: 1.11em;
}
section.content h5 {
	font-size: 1.06em;
}
section.content h6 {
	font-size: 1em;
}
section.content ul.fa-ul {
	list-style: none;
}
section.content ul.fa-ul li strong.heading {
	color: #666;
}
section.content div.entry {
	box-sizing: content-box;
	margin: 0 auto 40px;
}
section.content div.entry p {
	margin: 0 auto 1.4em;
	line-height: 1.5;
}
section.content div.entry p.sub-heading {
	margin-top: -1em;
	color: #666;
	font-weight: 700;
}
section.content div.entry figure.image {
	position: relative;
	display: block;
	width: 100%;
	max-width: 640px;
	margin: 30px auto 30px;
}
section.content div.entry figure.image img {
	width: 100%;
}
section.content div.entry figure.image figcaption {
	position: relative;
	width: calc(100% - 20px);
	margin: 2px 0 0 20px;	
	font-size: 0.875rem;
	line-height: 1.3;
}
section.content div.entry figure.image figcaption::before {
	position: absolute;
	top: 1px;
	left: -20px;
	content: '\f05a';
	opacity: 0.5;
	font: var(--fa-font-solid);
}
section.content div.entry ul.fa-ul {
	margin: 0 0 2em 3em;
}
section.content div.entry ul.fa-ul li {
	margin-bottom: 1.4em;
	line-height: 1.6;
}
section.content div.entry ul.fa-ul:not(.contact) li span.fa-li {
	top: 1px;
	left: -2.2em;
}
section.content div.entry ul.fa-ul li i {
	color: rgb(var(--color-secondary));;
}
section.content div.entry ul.fa-ul li i.fa-square-check,
section.content div.entry ul.fa-ul li i.fa-circle-check {
	color: #8bd300;
}
section.content div.entry ul.fa-ul li i.fa-triangle-exclamation {
	color: tomato;
}
section.content div.entry ul.fa-ul.tight li {
	margin-bottom: 0.8em;
}
section.content div.entry ol {
	margin: 0 0 2em 3em;
	list-style-type: decimal; 
	list-style-position: outside; 
}
section.content div.entry ol li {
	margin-bottom: 1.4em;
	line-height: 1.6
}
section.content div.entry ol.tight li {
	margin-bottom: 0.8em;
}
section.content div.entry small {
	font-size: 0.875rem;
	line-height: 1;
}
section.content div.cta-buttons {
	padding: 5px 0 15px;
}
section.content div.cta-buttons a {
	margin-bottom: 15px;
}
section.content div.cta-buttons a:first-of-type {
	margin-right: 15px;
}
section.content div.cta-buttons a.wide:hover {
	transform: scale(1.05);
}
section.content div.entry .anchor {
	position: relative;
}
section.content div.entry .anchor > a {
	position: absolute;
	top: -150px;
}
@media screen and (max-width: 991px) {
	section.content div.bio .col-2 {
		width: 100% !important;
	}
	section.content div.bio .col-2 {
		margin: 0 !important;
	}
}
section.content div.bio figure.image {
	margin: 0 auto 20px;
}
section.content div.bio figure.image:last-of-type {
	display: none;
}
section.content div.alert {
	max-width: 500px;
	margin-bottom: 25px;
	padding: 15px;
	background-color: #fff8dc;
	font-size: 0.9375rem;
}
section.content div.alert p {
	margin: 0;
}
section.content div.alert p:first-of-type {
	text-transform: uppercase;
	font-size: 0.875rem;
	font-weight: 600;
}
section.content div.alert p.date {
	margin-top: 15px;
	font-size: 0.875em;
}	
section.footnote {
	padding-top: 5px;
	padding-left: 22px;
	position: relative;
	font-size: 0.8125rem;
}
section.footnote::before {
	content: '\f05a';
	position: absolute;
	top: 7px;
	left: 0;
	opacity: 0.6;
	font-family: 'Font Awesome 5 Free';
	font-size: 15px;
	font-weight: 900;
}

/* Content sidebar */
section.content div.sidebar > div {
	width: 100%;
	margin-bottom: 20px;
	padding: 30px 25px;
	background-color: rgb(var(--color-off-white));
	font-size: 1rem;
}
section.content div.sidebar div > span {
	margin-bottom: 1em;
	display: block;
	font-size: 1.0625em;
	font-weight: 400;
}
section.content div.sidebar hr {
	width: 100%;
	height: 3px;
	margin-bottom: 1em;
	border: 0;
	background-color: #fff;
}
section.content div.quick-contact hr {
	margin-bottom: 1.2em;
}
section.content div.sidebar ul {
	margin-bottom: 0;
}
section.content div.sidebar ul li {
	margin-bottom: 1em;
}
section.content div.sidebar ul li:last-of-type {
	margin-bottom: 0;
}
section.content div.sidebar a {
	border-bottom: 1px solid rgb(2 11 23 / 0);
	color: #222;		
}
section.content div.sidebar a:hover {
	border-bottom: 1px solid rgb(2 11 23 / 1);
}
/* section.content div.sidebar div.testimonials i.fa.fa-star {
	width: auto;
	margin-right: 4px;
	position: relative;
	color: #ffcd53;
	font-size: 1.70rem;
	text-shadow: 1px 1px 3px rgb(0 0 0 / 0.2);
} */
section.content div.sidebar div.testimonials i.fa-solid.fa-star {
	position: relative;
	display: inline-block;
	margin-right: 4px;
	font-size: 1.7rem;

	/* Sunburst gradient */
	background: radial-gradient(
		circle at 40% 40%,
		#fff6b3 0%,	 /* bright centre */
		#ffd35a 35%,	/* yellow */
		#ffb300 65%,	/* orange */
		#ff8c00 100%	/* deeper edge */
	);

	/* Clip gradient to icon */
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;

	/* Glow */
	text-shadow:
		0 0 3px rgba(255, 200, 0, 0.4),
		0 0 6px rgba(255, 170, 0, 0.3),
		0 0 9px rgba(255, 140, 0, 0.2);
}
section.content div.sidebar div.testimonials p.review-rating {
	margin-top: 10px;
}
section.content div.sidebar div.testimonials p.review-rating span {
	font-weight: 500;
}
section.content div.sidebar div.testimonials blockquote {
	margin-inline-start: 0;
	margin-block-end: 0;
}
section.content div.sidebar div.testimonials blockquote cite {
	padding-left: 35px;
	display: block;
	position: relative;
	font-style: normal;
	line-height: 1.2;
}
section.content div.sidebar div.testimonials blockquote cite::before {
	position: absolute;
	top: 0;
	left: 0;
	width: 35px;
	content: '\f007';
	font: var(--fa-font-regular);
	font-size: 1.4rem;
	line-height: 38px;
	text-align: center;
}
section.content div.sidebar div.testimonials blockquote cite strong {
	font-weight: 500;
}
section.content div.sidebar div.postcode-note {
	margin-top: -5px;
	padding-top: 0;
	padding-bottom: 0;
	background-color: #fff;
}
section.content div.sidebar div.postcode-note p {
	/* font-size: 0.8125rem; */
}

/*
 * Contact page
 */
.contact-details {
	margin-top: 2em;
	position: relative;
}
section.content div.entry ul.contact {
	margin-bottom: 1.4em;
	list-style: none;
}
section.content div.entry ul.contact li {
	margin-bottom: 0.6em;
	line-height: 1.4;
}
section.content div.entry ul.contact li span.fa-li {
	left: -2.2em;
}
section.content div.entry ul.contact li span i {
	color: #222;
	opacity: 0.5;
}
input[type=text],
input[type=number],
input[type=email],
input[type=password],
textarea {
	-webkit-appearance: none;
}
#formThanks,
#formError {
	display: none;
	font-weight: 500;
}
#formThanks i.far {
	color: #8bd300;
}
#formError i.far {
	color: #c00;
}
form.contact {
	padding-top: 20px !important;
	padding-bottom: 20px !important;
	font-size: 0;
}
form.quote {
	margin-bottom: 40px;
}
form.quote > div:first-of-type {
	margin-top: 2em;
}
form.quote .customer-details {
	font-size: 0;
}
form.contact > div,
form.quote .customer-details > div {
	font-size: var(--font-size-body);
}
form.quote h5 {
	position: relative;
}
form.quote h5 span {
	position: relative;
	z-index: 9;
	padding-right: 1px;
	background-color: rgb(var(--color-background));
}
form.quote h5::before,
form.quote h5::after {
	content: '';
	position: absolute;
	left: 0;
	top: 50%;
	width: 100%;
	height: 2px;
	background-color: rgb(var(--color-text) / 0.5);
}
form.quote h5::after {
	top: calc(50% + 1px);
	height: 1px;
	background-color: rgb(var(--color-background) / 0.5);
}
form.quote legend {
	margin-bottom: 0.8em;
	font-size: 1.125rem;
	font-weight: 700;
	text-align: left;
}
section.content div.entry form.quote p.info,
section.content div.entry form.quote p.warning {
	position: relative;
	margin: 1.4em 0 0 1.5rem;
	font-size: 0.95em;
}
section.content div.entry form.quote p.info::before,
section.content div.entry form.quote p.warning::before {
	content: '\f05a';
	position: absolute;
	top: 4px;
	left: -1.5rem;
	opacity: 0.5;
	font: var(--fa-font-solid);
}
section.content div.entry form.quote p.warning::before {
	content: '\f071';
	opacity: 1;
	color: tomato;
	font: var(--fa-font-solid);
}
form.quote .window-or-door-wrap,
form.quote .pattern-wrap,
form.quote .style-wrap {
	text-align: center;
}
form.quote .cost-wrap,
form.quote .total-cost-wrap {
	padding: 35px 25px; 
	background-color: rgb(var(--color-off-white));
}
form.quote .cost-wrap h6,
form.quote .total-cost-wrap h6 {
	margin: 0 0 0.8em;
}
form.contact label,
form.quote label {
	margin-bottom: 0.5em;
	display: block;
	font-weight: 700;
}
form.quote div[class*="-wrap"] {
	margin-bottom: 2em;
}
form.quote .cost-wrap {
	margin-bottom: 1.4em !important;
}
form.quote div[class*="-wrap"]:not(.dimensions-wrap) label {
	position: relative;
	display: inline-block;
	margin: 0 10px;
	max-width: 140px;
	vertical-align: top;
	cursor: pointer;
	font-weight: 300;
	text-align: center;
}
form.contact label span,
form.quote label span {
	opacity: 0.7;
	color: #f00;
}
form.contact input,
form.contact textarea,
form.quote select,
form.quote input,
form.quote textarea {
	width: 100%;
	height: auto;
	margin-bottom: 1.4em;
	border: 2px solid #ccc;
	border-radius: 4px;
	padding: 0.6em 0.8em;
	color: rgb(var(--color-text));
	background-color: rgb(var(--color-background)) !important;
	font-family: "CGR Variable", sans-serif;
	font-size: 1rem;
	line-height: 1;
}
form input#postcode {
	margin-bottom: 0.3em;
}
form.quote select {
	width: auto;
}
@media screen and (max-width: 479px) { 
	form.quote select.window-type {
		width: 100%;
	}
}
form.quote input[type=checkbox],
form.quote input[type=radio] {
	position: absolute;
	top: 0;
	left: 0;
	width: auto;
	height: auto;
	margin: 0;
	opacity: 0;
	pointer-events: none;
}
form.quote div[class*="-wrap"] input,
form.quote div[class*="-wrap"] select,
form.quote select.no-panels {
	margin-bottom: 0;
}
form.quote input + img {
	display: block;
	width: 120px;
	height: 120px;
	margin-bottom: 10px;
	outline: 6px solid transparent;
	object-fit: cover;
	border-radius: 50%;
	outline-offset: -6px;
}
@media screen and (min-width: 600px) and (max-width: 799px),
	   screen and (min-width: 821px) {
	form.quote input + img {
		width: 140px;
		height: 140px;
	}
}
form.quote input:checked + img {
	outline-color: rgb(var(--color-primary));
}
form.quote .dimension {
	position: relative;
	display: inline-flex;
	flex-direction: row;
	align-items: center;
	margin: 0 10px 20px 0;
}
form.quote .dimension label {
	position: absolute;
	bottom: -20px;
	margin: 0;
	font-size: 11px;
	font-weight: 500;
	text-transform: uppercase;
}
form.quote .dimension input {
	width: auto;
	min-width: 6ch;
	margin-right: 5px;
	box-sizing: content-box;
}
input.limit-hit {
	border-color: #f99 !important;
}
input.limit-fade {
	transition: border-color 0.6s ease;
	border-color: #ccc !important;
}
form.contact input:focus,
form.quote input:focus {
	outline-offset: 0 !important;
}
form.contact textarea,
form.quote textarea {
	min-height: 200px;
	padding: 1em;
	resize: vertical;
}
form.contact button.submit {
	border: 0;
}
form .postcode-note {
	margin-bottom: 1em;
	font-size: 0.875rem;
}
@media screen and (max-width: 767px) {
	form .postcode-note	{
		display: block;
		margin-bottom: 1.75em;
	}
}
.grecaptcha-badge {
	visibility: hidden;
}
form.contact.quick {
	padding: 0 !important;
	position: relative;
}
form.contact.quick input,
form.contact.quick textarea {
	min-height: 45px;
	margin-bottom: 1em;
	border: 0;
	border-radius: 0;
	padding: 0.9em 0.6em;
}
form.contact.quick textarea {
	min-height: 90px;
	margin-bottom: 70px;
	padding: 0.9em 0.6em;
	transition: min-height 0.2s ease;
}
form.contact.quick button.submit {
	margin-left: 2px;
	display: block;
	position: absolute;
	bottom: 0;
}
form .company {
	position: absolute !important;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}
form.quote .cost,
form.quote .total-cost {
	display: inline-block;
	width: auto;
	max-width: 6ch;
	box-sizing: content-box;
	background: transparent !important;
	font-size: 1.125rem;
	border: 0;
	padding: 0;
	color: rgb(var(--color-text));
	font-weight: 300;
}

/*
 * How it works (front page widget)
 */
#front-page-how {
	padding: 80px 20px 0;
	position: relative;
	background-color: rgb(var(--color-off-white));
	z-index: 99;
}
/* Anchors positioned to account for fixed header */
.home .anchor {
	position: absolute;
	top: -127px;
	left: 0;
} 
.widget-intro {
	text-align: center;
}
.widget-intro h2,
#front-page-about h2 {
	font-size: 1.56em;
}
.widget-intro p {
	max-width: 600px;
	margin: 0 auto 4em;
	font-size: 1.06em;
}
.widget-intro .button {
	margin: 0 auto;
}
.cards .row > div {
	position: relative;
	display: flex;
	flex-direction: column;
	margin-bottom: 50px;	
	background-color: #fff;
	box-shadow: 0 10px 20px -10px rgba(35 44 57 / 20%);
	transition: transform 0.5s ease, box-shadow 0.5s ease;
}
.cards .row > div:hover {
	transform: translateY(-5px);
	box-shadow: 0 20px 10px -10px rgba(35 44 57 / 20%);
}
.cards .row > div .wrap {
	padding: 25px;
}
.cards .row > div.col-4.first .wrap {
	padding-bottom: 0;
}
.cards .row > div .label {
	width: 40px;
	height: 40px;
	border: 3px solid rgb(var(--color-text));
	border-radius: 50%;
	position: absolute;
	top: 0;
	left: 50px;
	transform: translate(-50%, -50%);
	box-shadow: 0 0 0 10px rgb(var(--color-background));
	background-color: rgb(var(--color-background));
	font-size: 1.375rem;
	font-weight: 700;
	line-height: 37px;
	text-align: center;
}
.cards .row > div .icon {
	width: auto;
	padding: 0 0 10px 10px;
	float: right;
	font-size: 5rem;
}
.cards .row > div svg {
	width: 90px;
	height: 90px;
	padding: 0 0 10px 10px;
	float: right;
}
/* SVG styles */
.stroke {
	fill: none;
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-width: 12px;
}
.stroke.white { stroke: #fff; }
.stroke.grey { stroke: #ccc; }
.stroke.green { stroke: #54c7c1; }
.stroke.blue { stroke: rgb(var(--color-text)); }
.fill.white { fill: #fff; }
.fill.black { fill: #000; }
.fill.grey { fill: #ccc; }
.fill.green { fill: #54c7c1; }
.fill.blue { fill: rgb(var(--color-text)); }
.op-80 { opacity: 0.8; }
.op-40 { opacity: 0.4; }
.op-30 { opacity: 0.3; }
.op-20 { opacity: 0.2; }
.op-10 { opacity: 0.1; }
.op-0 { opacity: 0; }
.br-50 { filter: brightness(0.5); }
.br-60 { filter: brightness(0.6); }
.br-70 { filter: brightness(0.7); }
.br-80 { filter: brightness(0.8); }
.br-85 { filter: brightness(0.85); }
.br-90 { filter: brightness(0.9); }
.br-110 { filter: brightness(1.1); }
.br-115 { filter: brightness(1.15); }
.br-120 { filter: brightness(1.2); }
.br-130 { filter: brightness(1.3); }

.cards .row > div .h3 {
	margin: 20px 0 0.6em;
	font-size: 1em;
}
.cards .row > div .button {
	width: 100%;
	border-bottom: 0;
	margin-bottom: 5px;
	text-align: center;
}
.cards .row > div .button:hover {
	transform: scale(1);
}
.cards .row > div .button:hover i {
	transform: scale(1.2);
}
.cards .row > div .time {
	margin: 0 0 1.6em;
	font-size: 1.3rem;
}
.cards .row > div .time i {
	color: #999;
}
.cards .row > div .features {
	margin-bottom: 1em;
}
.cards .row > div .features > div {
	margin: 0 15px 0 20px;
	display: inline-block;
	position: relative;
	font-size: 1.5rem;
	line-height: 1.2;
	white-space: nowrap;
}
.cards .row > div .features > div::before {
	content: '\f00c';
	position: absolute;
	top: 0;
	left: -20px;
	color: #8bd300;
	font-family: 'Font Awesome 5 Free';
	font-weight: 900;
}
.cards .row > div .features i {
	margin-right: 6px;
	color: #8bd300;
}
/* Tooltip */
.cards .row > div .features > div span {
	margin: 0;
	border-bottom: 1px dotted #ccc;
	position: relative;
	cursor: help;
}
.cards .row > div .features > div span::after {
	content: '\f129';
	position: absolute;
	top: 0;
	right: -8px;
	color: #999;
	font-family: 'Font Awesome 5 Free';
	font-size: 1rem;
	font-weight: 900;
}
.cards .row > div .features > div .tooltip {
	width: auto;
	margin-top: 15px;
	padding: 15px;
	display: block;
	position: absolute;
	top: 100%;
	left: 50%;
	z-index: 9;
	opacity: 0;
	cursor: help;
	pointer-events: none;		
	color: #fff;
	background-color: #4f5f75;
	font-size: 1.4rem;
	transform: translate(-50%, 10px);
	transition: all .25s ease-out;
	box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28);
}
/* This bridges the gap so you can mouse into the tooltip without it disappearing */
.cards .row > div .features > div .tooltip::before {
	content: '';
	width: 100%;
	height: 20px;
	display: block;
	position: absolute;
	top: -20px;
	left: 0;	
	cursor: help;
}
/* CSS triangles */
.cards .row > div .features > div .tooltip::after {
	border-left: solid transparent 10px;
	border-right: solid transparent 10px;
	border-bottom: solid #4f5f75 10px;
	top: -9px;
	content: '';
	height: 0;
	left: 50%;
	margin-left: -13px;
	position: absolute;
	width: 0;
}
.cards .row > div .features > div:hover .tooltip {
	opacity: 1;
	pointer-events: auto;
	transform: translate(-50%, 0);
}
.cards .row > div .learn-more a {
	position: relative;
	font-size: 1.6rem;
	font-weight: 600;
}
.cards .row > div .learn-more a::after {
	content: '\f101';
	position: absolute;
	top: 6px;
	right: -14px;
	color: #1e90ff;
	font-family: 'Font Awesome 5 Free';
	font-size: 11px;
	font-weight: 900;
	line-height: 1;
	transition: color 0.2s ease, right 0.2s ease;
}
.cards .row > div .learn-more a:hover::after {
	color: #222;
	right: -18px;
}
.cards .row > div .disclaimer {
	width: 100%;
	margin-top: auto;
	border-top: 1px solid #eee;
	padding: 25px;
}
.cards .row > div .disclaimer p {
	margin-bottom: 0;
	font-size: 0.8125rem;
	line-height: 1.3;
}
.cards .row > div .disclaimer strong {
	font-weight: 600;
}
.cards .extras {
	padding: 20px 10px;
}
.cards .extras .h3 {
	font-size: 1.0625rem;
}
.cards .extras div {
	line-height: 1.4;
}
.cards .extras div > span {
	margin-right: 15px;
	display: block;
}
.cards .extras div span i {
	margin-right: 5px;
	color: #4f5f75;
}
.cards .extras div > span > strong > span {
	font-size: 0.875rem;
}

/*
 * FAQ (front page widget)
 */
#front-page-faq {
	padding: 30px 20px 90px;
	position: relative;
	z-index: 99;
	background-color: rgb(var(--color-off-white));
	box-shadow: 0 1px 1px 0 rgb(0 0 0 / 0.1);
}
.ui-accordion {
	font-size: inherit !important;
}
.ui-accordion .ui-accordion-header {
	font-size: 1.06em !important;
	font-weight: 600;
}
.ui-accordion .ui-accordion-header,
.ui-accordion .ui-accordion-content {
	margin: 0 !important;
	border: 1px solid #ccc;
	border-top: 0;
	border-radius: 0;
	padding-left: 1.5em !important;
	color: rgb(var(--color-text));
	background: transparent;
	font-family: "CGR Variable", sans-serif;
}
.ui-accordion .ui-accordion-header:first-of-type {
	border-top: 1px solid #ccc;
}
.ui-accordion .ui-accordion-header.ui-state-hover {
	color: #666;
}
.ui-accordion .ui-accordion-header span {
	display: none;
}
.ui-accordion .ui-accordion-header::before {
	content: '\f105';
	position: absolute;
	left: 10px;
	color: rgb(var(--color-text));
	font: var(--fa-font-solid);
	transition: transform 0.2s ease;
}
.ui-accordion .ui-accordion-header.ui-state-active::before {
	transform: rotate( 90deg );
}
.ui-accordion .ui-accordion-content p,
.ui-accordion .ui-accordion-content ul li {
	font-size: 1em;
}
.checklist.ui-accordion,
.warning.ui-accordion {
	margin-bottom: 30px;
}
.checklist.ui-accordion.ui-accordion .ui-accordion-content,
.warning.ui-accordion.ui-accordion .ui-accordion-content {
	padding: 0.8em 2em;
}
.checklist.ui-accordion .ui-accordion-header,
.checklist.ui-accordion .ui-accordion-content,
.warning.ui-accordion .ui-accordion-header,
.warning.ui-accordion .ui-accordion-content {	
	padding-left: 1.8em !important;
	padding-right: 2em !important;
}
.checklist.ui-accordion .ui-accordion-header::before,
.warning.ui-accordion .ui-accordion-header::before {
	content: '\f107';
	right: 10px;
	left: auto;
}
.checklist.ui-accordion .ui-accordion-header.ui-state-active::before,
.warning.ui-accordion .ui-accordion-header.ui-state-active::before {
	transform: rotate( 180deg );
}
.checklist.ui-accordion .ui-accordion-header::after,
.warning.ui-accordion .ui-accordion-header::after {
	content: '\f14a';
	position: absolute;
	top: 9px;
	left: 9px;
	color: #8bd300;
	font: var(--fa-font-solid);
}
.warning.ui-accordion .ui-accordion-header::after {
	content: '\f071';
	color: tomato;
}

/*
 * About us (front page widget)
 */
#front-page-about {
	padding: 80px 20px 90px;
	position: relative;
	z-index: 99;
}
@media screen and (max-width: 767px) {
	#front-page-about .row {
		display: flex;
		flex-direction: column;
	}
	#front-page-about .row .first {
		padding-top: 40px;
		order: 2;
	}
}
#front-page-about img {
	width: 100%;
}

/*
 * Why choose us (front page widget)
 */
#front-page-why {
	padding: 80px 20px 90px;
	position: relative;
	z-index: 99;
	background-color: #fff;
	background-size: cover;
	background-position: center center;
	text-align: center;
}
#front-page-why::before {
	content: '';
	position: absolute;
	inset: 0;
	opacity: 0.7;
	background-image: url(../img/front-page_why.webp);
	background-size: cover;
	background-position: center center;
	filter: brightness(1.2);
}
/* #front-page-why::before {
	content: '';
	position: absolute;
	inset: 0;
	background-color: #fff;
	opacity: 0;
} */
#front-page-why .wrap {
	position: relative;
	z-index: 99;
	color: #fff;
}
#front-page-why .wrap .row::before,
#front-page-why .wrap .row::after {
	display: none;
}	
#front-page-why .wrap .row .col-4 {
	margin-top: 50px;
	opacity: 1;
	text-align: center;
}
#front-page-why .wrap .row .col-4 svg {
	width: 100px;
	height: 100px;
	margin-bottom: 10px;
}
#front-page-why .wrap .row .col-4 img {
	width: 100px;
	height: 100px;
}
#front-page-why .wrap .row .col-4 p {
	font-size: 1.125em;
	font-weight: 500;
}
@media screen and (max-width: 599px) {
	#front-page-why {
		height: 900px;
	}
	#front-page-why .wrap .row {
		margin-top: 30px;
		position: absolute;
		top: 0;
		left: 0;
		overflow: hidden;
	}
	#front-page-why .wrap .row .col-4 {
		position: relative;
		opacity: 0;
		left: -100px;
	}
	/* Base animation */
	#front-page-why .wrap.fade-in-up .row:nth-child(2) > div,
	#front-page-why .wrap.fade-in-up .row:nth-child(3) > div,
	#front-page-why .wrap.fade-in-up .row:nth-child(4) > div {
		animation: fade-slide-in 15s infinite;
		animation-delay: calc(var(--row-delay) + var(--i) * 0.1s);
	}

	/* Row offsets */
	#front-page-why .wrap.fade-in-up .row:nth-child(2) > div { --row-delay: 0s; }
	#front-page-why .wrap.fade-in-up .row:nth-child(3) > div { --row-delay: 5s; }
	#front-page-why .wrap.fade-in-up .row:nth-child(4) > div { --row-delay: 10s; }

	/* Column index (per item) */
	#front-page-why .wrap.fade-in-up .row > div:nth-of-type(1) { --i: 0; }
	#front-page-why .wrap.fade-in-up .row > div:nth-of-type(2) { --i: 1; }
	#front-page-why .wrap.fade-in-up .row > div:nth-of-type(3) { --i: 2; }
	#front-page-why .wrap.fade-in-up .row > div:nth-of-type(4) { --i: 3; }

	/* Updated keyframes (scaled for 10s cycle) */
	@keyframes fade-slide-in {
		0% { left: -100px; opacity: 0; }
		5% { left: -100px; opacity: 0; }
		7.5%, 32.5% { left: 0; opacity: 1; animation-timing-function: ease-in; }
		35%, 100% { left: 100px; opacity: 0; animation-timing-function: ease-out; }
	}
}

/*
 * Services widget  (front page widget)
 */ 
#front-page-services {
	padding: 80px 0 30px;
	position: relative;
	z-index: 99;
	background-color: rgb(var(--color-off-white));
	box-shadow: 0 1px 1px 0 rgb(0 0 0 / 0.1);
}
#front-page-services .wrap {
	max-width: calc(1152px + 20px);
}
@media screen and (max-width: 1199px) {
	#front-page-services .widget-intro {
		padding: 0 20px;
	}
}
#front-page-services .widget-intro {
	max-width: 1152px;
	margin: 0 auto;
}
#front-page-services .widget-intro h2 {
	margin: 0 0 calc(1em - 20px);
}
#front-page-services .swiper-container {
	margin-bottom: 40px;
	padding: 20px 10px;
}
#front-page-services .swiper-slide {
	height: auto;
	background-color: #fff;
	box-shadow: 0 10px 15px -10px rgba(35 44 57 / 20%);
	transition: transform 0.5s ease, box-shadow 0.5s ease;
}
#front-page-services .swiper-slide:hover {
	transform: translateY(-5px);
	box-shadow: 0 20px 10px -10px rgba(35 44 57 / 20%);
}
#front-page-services .swiper-slide .photo {
	width: 100%;
	aspect-ratio: 21 / 9;
	background: url(../img/card_blown-window-repair_2.webp) center / cover no-repeat;
}
#front-page-services .swiper-slide#door-glass-repair .photo { background-image: url(../img/card_door-glass-repair.webp); }
#front-page-services .swiper-slide#conservatory-window-repair .photo { background-image: url(../img/card_conservatory-window-repair.webp); }
#front-page-services .swiper-slide#hinge-repair .photo { background-image: url(../img/card_hinge-repair.webp); }
#front-page-services .swiper-slide#handle-repair .photo { background-image: url(../img/card_handle-repair.webp); }
#front-page-services .swiper-slide#lock-repair .photo { background-image: url(../img/card_lock-repair.webp); }
#front-page-services .swiper-slide#cat-flap-installation .photo { background-image: url(../img/card_cat-flap-installation.webp); }
#front-page-services .swiper-slide > div:not(.photo) {
	padding: 20px;
}
#front-page-services .swiper-slide > div h3,
#front-page-upgrades .stack-card h3 {
	font-size: 1.06em;
}
#front-page-services .swiper-slide > div p,
#front-page-services .swiper-slide > div a.button,
#front-page-upgrades .stack-card p {
	font-size: 0.94em;
}
#front-page-services > div.wrap > div.nav,
#front-page-testimonials > div.wrap > div.nav {
	width: auto !important;
	position: absolute;
	left: 50%;
	bottom: auto;
	transform: translate(-50%, -50%);
}
#front-page-services > div.wrap > div.custom-swiper-button-prev,
#front-page-testimonials > div.wrap > div.custom-swiper-button-prev {
	left: calc(50% - 20px);
}
#front-page-services > div.wrap > div.custom-swiper-button-next,
#front-page-testimonials > div.wrap > div.custom-swiper-button-next {
	left: calc(50% + 20px);
}
#front-page-services > div.wrap > div.custom-swiper-button-prev::before,
#front-page-services > div.wrap > div.custom-swiper-button-next::before,
#front-page-testimonials > div.wrap > div.custom-swiper-button-prev::before,
#front-page-testimonials > div.wrap > div.custom-swiper-button-next::before {
	content: '\f053';
	color: rgb(var(--color-dark-background));
	font: var(--fa-font-solid);
	font-size: 2rem;
}
#front-page-services > div.wrap > div.custom-swiper-button-next::before,
#front-page-testimonials > div.wrap > div.custom-swiper-button-next::before {
	content: '\f054';
}
#front-page-services > div.wrap > div.nav:not(.swiper-pagination),
#front-page-testimonials > div.wrap > div.nav:not(.swiper-pagination) {
	cursor: pointer;
}

/*
 * Upgrades (front page widget)
 */
#front-page-upgrades {
	padding: 70px 20px 90px;
	position: relative;
	z-index: 99;
	background-color: rgb(var(--color-off-white));
	box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.1);
}

/* Variables */
:root {
	/* spacing */
	--stack-cards-gap-sm: 1.25rem;
	--stack-cards-gap-md: 2rem;
}
@media(min-width: 64rem){
	:root {
		/* spacing */
		--stack-cards-gap-sm: 1.125rem;
		--stack-cards-gap-md: 2rem;
	}
}
.stack-cards {
	--stack-cards-gap: var(--stack-cards-gap-sm);
	--stack-cards-item-ratio: 1/1;
	margin-bottom: 0;
}
.stack-card {
	position: relative;
	position: -webkit-sticky;
	position: sticky;
	top: 148px;
	height: 0;
	padding: 0 0 calc(100% / (var(--stack-cards-item-ratio)));
	-webkit-transform-origin: center top;
			transform-origin: center top;
	background-color: #fff;
	box-shadow: 0 -10px 20px -10px rgb(35 44 57 / 0.2);
}
.stack-card::before {
	content: '';
	position: relative;
	display: block;
	width: 100%;
	height: 15vh;
	max-height: 100px;
	background: url('../img/card_integrated-blinds.webp') center / cover no-repeat;
	pointer-events: none;
}
.stack-card#acoustic-glass::before { background-image: url('../img/card_acoustic-glass.webp'); }
.stack-card#super-spacer::before { background-image: url('../img/card_super-spacer.webp'); }
.stack-card-blurb {
	padding: 25px 20px 0;
	line-height: 1.3 !important;
}
@media screen and (max-width: 599px),
       screen and (min-width: 768px) and (max-width: 1151px) {
	.stack-card-blurb p:last-of-type {
		display: none;
	}
}
.stack-card-blurb a {
	position: relative;
	display: inline-block;
	padding-right: 10px;
	color: rgb(var(--color-primary)) !important;
	font-weight: 500;
	font-size: 0.94em;
}
.stack-card-blurb a::before,
.stack-card-blurb a::after {
	position: absolute;
	top: 3px;
	content: '\f105';
	pointer-events: none;
	font: var(--fa-font-solid);
	font-size: 0.8em;
	line-height: 1.3;
	transition: right 0.2s ease,
				color 0.2s ease;
}
.stack-card-blurb a::before {
	right: 10px;
	color: rgb(var(--color-primary) / 0);
}
.stack-card-blurb a::after {
	right: 0;
}
.stack-card-blurb a:hover::before {
	right: 0px;
	color: rgb(var(--color-primary) / 1);
}
.stack-card-blurb a:hover::after {
	right: -5px;
}

/*
 * Testimonials (front page widget)
 */
#front-page-testimonials {
	padding: 50px 0 70px;
	position: relative;
	background-color: #fff;
	text-align: center;
}
#front-page-testimonials > div.wrap {
	max-width: 1152px;
}
#front-page-testimonials .swiper-container {
	margin-bottom: 40px;
	z-index: 999999999;
}
#front-page-testimonials .swiper-container .swiper-slide {
	padding: 0 20px;
}
#front-page-testimonials .swiper-container .swiper-slide div.avatar {
	position: relative;
	display: flex;
	align-items: flex-end;
	justify-content: center;
	width: 100px;
	height: 100px;
	margin: 15px auto;
	border-radius: 50%;
	overflow: hidden;
	color: rgb(var(--color-primary));
	line-height: 0;
}
#front-page-testimonials .swiper-container .swiper-slide div.avatar::before {
	content: '';
	position: absolute;
	inset: 0;
	z-index: 9;
	border-radius: 50%;
	background-color: rgb(var(--color-primary) / 0.2);
	opacity: 0;
	transform: scale(0.4);
	transition: opacity 0.2s ease,
				transform 0.2s ease;
}
#front-page-testimonials .swiper-container .swiper-slide div.avatar.fade-in-bounce::before {
	opacity: 1;
	transform: scale(1);
}
#front-page-testimonials .swiper-container .swiper-slide div.avatar svg {
	z-index: 99;
	display: block;
	width: 65%;
	height: auto;
	opacity: 0;
	transform: translateY(30px);
	transition: opacity 0.4s ease,
				transform 0.4s ease;
}
#front-page-testimonials .swiper-container .swiper-slide div.avatar.fade-in-bounce svg {
	opacity: 1;
	transform: translateY(0);
}
#front-page-testimonials .swiper-container .swiper-slide > div h3 {
	font-size: 1.17em;
}
#front-page-testimonials .swiper-container .swiper-slide > div p {
	max-width: 600px;
	margin: 0 auto;
}
#front-page-testimonials .swiper-container .swiper-slide > div {
	background: transparent;
}
#front-page-testimonials .swiper-container .swiper-slide > div h3 {
	margin-bottom: 0.1em;
	text-align: center;
}
#front-page-testimonials .swiper-container .swiper-slide > div h4 {
	margin-bottom: 1.2em;
	font-size: 1em;
	font-weight: 200;
	text-align: center;
}
#front-page-testimonials .swiper-container .swiper-slide > div blockquote p::before,
#front-page-testimonials .swiper-container .swiper-slide > div blockquote p::after {
	content: '\201C';
	height: auto;
	display: inline !important;
	position: static;
	top: auto;
	left: auto;
}
#front-page-testimonials .swiper-container .swiper-slide > div blockquote p::after {
	content: '\201D';
}
#front-page-testimonials > div.wrap > div.custom-swiper-button-prev {
	left: calc(50% - 60px);
}
#front-page-testimonials > div.wrap > div.custom-swiper-button-next {
	left: calc(50% + 60px);
}
#front-page-testimonials > div.wrap > div.custom-swiper-button-prev.swiper-button-disabled,
#front-page-testimonials > div.wrap > div.custom-swiper-button-next.swiper-button-disabled {
	cursor: default !important;
}
#front-page-testimonials > div.wrap > div.custom-swiper-button-prev.swiper-button-disabled::before,
#front-page-testimonials > div.wrap > div.custom-swiper-button-next.swiper-button-disabled::before {
	opacity: 0.5;
}
#front-page-testimonials > div.wrap > div.swiper-pagination {
	margin: 0;
	font-weight: 700;
}
#front-page-testimonials .widget-intro {
	padding: 0 20px;
}

/*
 * Map
 */
#global-map {
	padding: 0 20px 80px;
	background-color: rgb(var(--color-background));
}
#global-map .row {
	width: 100%;
	padding: 0;
	display: flex;
	flex-direction: column;
	box-shadow: 0 10px 20px -10px rgba(35 44 57 / 20%);
}
#global-map .row > div {
	width: 100%;
	margin-left: 0;
}
#global-map .row > div.locations {
	padding: 40px 30px;
	position: relative;
	color: rgb(var(--color-light-text));
	background-color: rgb(var(--color-secondary));
}
#global-map .row > div.locations h3 {
	margin-bottom: 0.8em;
	font-size: 1.725em;
	line-height: 1.3;
}
#global-map .row > div.locations p {
	line-height: 1.4;
}
#global-map .map {
	height: 400px;
	border: 0;
	background-color: #4dc7c1;
}

/*
 * Global CTA
 */
#global-cta {
	width: 100%;
	padding: 50px 20px;
	position: relative;
	z-index: 2;
	color: rgb(var(--color-light-text));
	background-color: rgb(var(--color-primary));
	background-image: url('../img/handles.svg');
	background-repeat: repeat;
	background-position: center;
	background-size: 240px auto;
	text-align: center;
}
/* #global-cta::before {
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 9;
	background-color: rgba(20, 47, 66, 0.6);	
}
#global-cta::after {
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 9;
} */
#global-cta .wrap {
	max-width: 600px;
	position: relative;
	z-index: 99;
}
#global-cta h2,
#global-cta p {
	position: relative;
}
#global-cta h2 {
	margin-bottom: 1em;
	font-size: 1.78em;
}
#global-cta p {
	margin-bottom: 2.1em;
	font-size: 1.0625rem;
}
#global-cta a.button.outline {
	margin: 0 auto;
}

/*
 * Footer
 */
footer {
	width: 100%;
	padding: 40px 20px;
	position: relative;
	z-index: 2;
	color: #fff;
	background-color: #1e323c;
	font-size: 1rem;
	line-height: 1.5;
}
footer .col-1 {
	margin-bottom: 30px;
	border-width: 1px;
	border-style: solid;
	border-color: rgb(255 255 255 / 0.15);
	padding: 15px 10px;
	text-align: center;
}
footer .col-1 ul {
	margin: 0;
}
footer .col-1 ul li {
	margin: 0 10px 0 !important;
	display: inline-block;
}
footer .col-1 ul li i {
	margin-right: 8px;
}
footer .col-4 h3 {
	color: rgb(255 255 255 / 0.5);
	font-size: 1em;
	font-weight: 500;
}
@media screen and (max-width: 599px) {
	footer div.col-4.autoglym {
		padding-top: 10px;
	}
	footer div.col-4 h3 {
		padding-top: 10px;
	}
	footer div.col-4:first-of-type h3 {
		padding-top: 0;
	}
	footer div.col-4:last-of-type h3 {
		padding-top: 10px;
	}
}
footer .col-1 a,
footer .col-4 a {
	display: inline-block;
	position: relative;
	color: #fff;
	background-image: linear-gradient(transparent calc(100% - 1px), rgb(255 255 255 / 1) 1px), linear-gradient(transparent calc(100% - 1px), rgb(255 255 255 / 0.15) 1px);
	background-position: 0 calc(100% - 1px), 0 calc(100% - 1px);
	background-repeat: no-repeat;
	background-size: 0% 6px, 100% 6px;
	transition: background 0.2s ease;
}
footer .col-1 a:hover,
footer .col-4 a:hover {
	background-size: 100% 6px, 100% 6px;
}
footer ul.fa-ul {
	margin-left: 1.7em;
}
footer ul li,
footer ul.fa-ul li {
	margin-bottom: 10px;
}
footer ul.fa-ul li:nth-child(2) {
	margin-bottom: 15px;
}
footer ul.fa-ul li span {
	width: 2.5em;
	left: -2.5em;
}
footer ul.fa-ul li span i {
	opacity: 0.8;
}
footer .date {
	font-size: 0.75rem;
}
footer .col-4.social a {
	width: 36px;
	height: 36px;
	margin-right: 5px;
	border: 0;
	border-radius: 50%;
	display: inline-block;
	overflow: hidden;
	position: relative;
	background-color: rgba(255, 255, 255, 0);
	background-image: none;
	transition: none;
}
footer .col-4.social a::before,
footer .col-4.social a::after {
	display: none;
}
footer .col-4.social a:hover {
	color: #eee;
}
footer .col-4.social a.facebook-f:hover {
	background-color: #404f93;
}
footer .col-4.social a.instagram:hover {
	background: #d6249f;
	background: radial-gradient(circle farthest-corner at 35% 90%, #fec564, transparent 50%), radial-gradient(circle farthest-corner at 0 140%, #fec564, transparent 50%), radial-gradient(ellipse farthest-corner at 0 -25%, #5258cf, transparent 50%), radial-gradient(ellipse farthest-corner at 20% -50%, #5258cf, transparent 50%), radial-gradient(ellipse farthest-corner at 100% 0, #893dc2, transparent 50%), radial-gradient(ellipse farthest-corner at 60% -20%, #893dc2, transparent 50%), radial-gradient(ellipse farthest-corner at 100% 100%, #d9317a, transparent), linear-gradient(#6559ca, #bc318f 30%, #e33f5f 50%, #f77638 70%, #fec66d 100%);
}
footer .col-4.social a.google:hover {
	background-color: #ea4335;
}
footer .col-4.social a i {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
}
footer .col-4.social a:hover {
	background-color: rgba(255, 255, 255, 1);
}
footer form.callback-request {
	max-width: 400px;
	padding: 0 !important;
}
footer form.callback-request div.input-wrapper,
.quote-pop-up form.contact div.input-wrapper {
	position: relative;
}
footer form.callback-request div.input-wrapper::after,
.quote-pop-up form.contact div.input-wrapper::after {
	content: '';
	width: 20px;
	position: absolute;
	top: 13px; /* Instead of line-height - check */
	left: 10px;
	color: rgb(255 255 255 / 0.5);
	font-family: 'Font Awesome 5 Free';
	font-weight: 900;
	text-align: center;
}
footer form.callback-request div.input-wrapper.name::after,
.quote-pop-up form.contact div.input-wrapper.name::after {
	content: '\f007';
}
footer form.callback-request div.input-wrapper.email::after,
.quote-pop-up form.contact div.input-wrapper.email::after {
	content: '\f0e0';
}
footer form.callback-request div.input-wrapper.phone::after,
.quote-pop-up form.contact div.input-wrapper.phone::after {
	content: '\f3ce';
}
footer form.callback-request input {
	width: 100%;
	margin: 0;
	border: 0;
	border-bottom-width: 2px;
	border-bottom-style: solid;
	border-bottom-color: rgb(255 255 255 / 0.5);
	border-radius: 0;
	padding: 18px 12px 18px 38px;
	color: #fff;
	caret-color: #fff;
	background: transparent;
}
footer form.callback-request input::-webkit-input-placeholder {
	color: rgb(255 255 255 / 0.5) !important;
}   
footer form.callback-request input:-moz-placeholder {
	color: rgb(255 255 255 / 0.5) !important;
}
footer form.callback-request input::-moz-placeholder {
	color: rgb(255 255 255 / 0.5) !important;
}
footer form.callback-request input:-ms-input-placeholder {
	color: rgb(255 255 255 / 0.5) !important;
}
footer form.callback-request input::-ms-input-placeholder {
	color: rgb(255 255 255 / 0.5) !important;
}
footer form.callback-request input::placeholder {
	color: rgb(255 255 255 / 0.5) !important;
}
footer form.callback-request input:-webkit-autofill,
footer form.callback-request input:-webkit-autofill:hover, 
footer form.callback-request input:-webkit-autofill:focus, 
footer form.callback-request input:-webkit-autofill:active  {
	border-bottom-color: rgb(143 153 158);
	-webkit-box-shadow: 0 0 0 30px rgb(53 71 80) inset !important;
	-webkit-text-fill-color: #fff !important;
	transition: none;
}
footer form.callback-request button {
	width: 100%;
	border: 0;
	border-radius: 0;
	padding: 20px 0 21px;
	color: #fff;
	background-color: rgb(255 255 255 / 0.5);
	font-size: 1em;
	transition: background-color 0.2s ease !important;
}
footer form.callback-request button::before {
	display: none;
}
footer form.callback-request button:hover {
	background: transparent;
	transform: scale(1);
}
.contact-form-privacy,
.quote-pop-up form.contact > div.contact-form-privacy {
	padding-top: 8px !important;
	font-size: 0.8750rem;
}
.contact-form-privacy i {
	opacity: 0.6;
}
.after-footer {
	width: 100%;
	margin: 0 auto;
	border-top: 1px solid rgba(137, 141, 154, 0.3);
	padding: 30px 20px;
	color: rgb(255 255 255 / 0.5);
	background-color: #1e323c;
	line-height: 1.4;
}
.after-footer div.wrap {
	height: 100%;
	text-align: center;
}
.after-footer div.wrap div {
	margin: 50px 0 80px;
}
.after-footer ul {
	margin: 0;
	text-align: center;
}
.after-footer ul li {
	font-size: 1rem;
}
.after-footer ul li a, .after-footer ul li strong {
	border-bottom: 1px solid rgb(255 255 255 / 0);
	cursor: pointer;
	color: rgb(255 255 255 / 0.5);
	font-weight: 700;
	text-decoration: none;
	transition: border 0.2s ease;
}
.after-footer ul li a:hover,
.after-footer ul li strong:hover {
	border-bottom: 1px solid rgb(255 255 255 / 0.5);
}
.after-footer ul li:first-of-type {
	margin-bottom: 0.8em;
}
.after-footer ul li:last-of-type {
	margin-top: 1.6em;
}
.after-footer ul li.payment-methods img {
	margin: 0 5px 0 0;
	border-radius: 3px;
	width: auto;
	height: 32px;
	background-color: #fff;
}
.cookies {
	width: 340px;
	height: auto;
	border-radius: 6px;
	padding: 15px 15px 5px;
	display: none;
	position: fixed;
	left: 10px;
	bottom: 10px;
	z-index: 999999;
	color: #fff;
	background-color: rgba(136, 136, 136, 0.96);
	box-shadow: 0px 1px 6px 0px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.04), 0px 3px 1px -2px rgba(0, 0, 0, 0.02);
	font-family: Arial, sans-serif;
}
.cookies h2 {
	font-size: 1rem;
}
.cookies p {
	font-size: 0.875rem;
	letter-spacing: 0.5px;
	line-height: 1.4;	
}
.cookies p a {
	color: #fff;
	text-decoration: none;
}
.cookies p a:link, .cookies p a:visited {
	border-bottom: 1px solid #ccc;
	padding-bottom: 1px;
	-webkit-transition: all 0.2s ease;
			transition: all 0.2s ease;
}
.cookies p a:hover {
	border-bottom: 1px solid #fff;
}
.cookies a.consent {
	width: auto;
	height: auto;
	margin: 0 10px 10px 0;
	border: 0;
	border-radius: 6px;
	padding: 15px;
	display: inline-block;
	position: relative;
	overflow: hidden;
	cursor: pointer;
	color: #fff;
	background-color: #0a3;
	font-size: 0.9375rem;
	font-weight: 700;
	line-height: 1;
	text-decoration: none;
	-webkit-transition: all 0.5s ease;
			transition: all 0.5s ease;
	-webkit-transform: none;
			transform: none;
	
}
.cookies a.consent:last-of-type {
	margin-right: 0;
}
.cookies a.consent::before,
.cookies a.consent::after {
	display: none;
}
.cookies a.consent:hover {
	background-color: #070;
	box-shadow: 0 5px 20px -5px rgba(0, 204, 51, 0.4);
}
.cookies a.consent#decline-cookies {
	background-color: #a03;
}
@media screen and (min-width: 411px) {
	.before-header a.email {
		border-right-width: 1px;
	}
	.before-header a.quote {
		width: 180px;
	}
	#front-page-hero .swiper-slide .h1 {
		font-size: 2.375rem;
	}
	#front-page-hero .swiper-slide h1 {
		font-size: 1.125rem;
	}
	#front-page-hero .swiper-pagination-bullets {
		display: block;
	}
}
@media screen and (min-width: 480px) {
	.before-header a.tel i {
		margin-right: 6px;
	}
	.before-header a.tel span {
		display: inline;
	}
	#front-page-hero {
		background-position: center 60%;
	}
	#front-page-hero .swiper-slide .h1 {
		margin-bottom: 25px;
		font-size: 2.5rem;
	}
	#front-page-hero .swiper-slide h1 {
		margin-bottom: 35px;
		font-size: 1.1875rem;
	}
	#front-page-hero video {
		object-position: center 60%;
	}
	.stack-cards {
		--stack-cards-item-ratio: 4/3;
	}
	.stack-card::before {
		max-height: none;
	}
	section.content div.entry ul.timeline {
		width: calc(100% - 150px);
		margin: 30px 0 40px 150px;
	}
	section.content div.entry ul.timeline li.event {
		padding: 40px 50px 35px;
	}
	section.content div.entry ul.timeline li.event:before {
		width: 120px;	
		left: -150px;
		padding-right: 30px;
		padding-left: 0;
		font-size: 0.875rem;
		text-align: right;
	}
	section.content div.entry ul.contact.alt {
		position: absolute;
		top: 0px;
		left: 225px;
	}
}

@media screen and (min-height: 600px) {
	.scroll-down-cue {
		bottom: 10px;
	}
	.scroll-down-cue.hide {
		bottom: -10px;
		opacity: 0;
	}
}

@media screen and (min-height: 736px) {
	#front-page-slideshow { 
		padding: 90px 0 100px;
	}
	#front-page-slideshow h1,
	#front-page-slideshow h2 {
		/* font-size: 2.5rem; */
	}
	#global-hero h1 {
		/* font-size: 2.25rem; */
	}
}
@media screen and (min-width: 600px) {
	.before-header a.email {
		border-right-width: 0;
	}
	.before-header a.email i {
		margin-right: 6px;
	}
	.before-header a.email span {
		display: inline;
	}
	#front-page-hero .swiper-slide {
		padding-right: 40px;
		padding-left: 40px;
	}
	#front-page-hero .swiper-slide .h1 {
		margin-bottom: 30px;
		font-size: 3.125rem;
	}
	#front-page-hero .swiper-slide h1 {
		margin-bottom: 40px;
		font-size: 1.25rem;
	}
	.cards .extras div > span {
		display: inline-block;
		white-space: nowrap;
	}
	#front-page-why .col-4 {
		width: 48.71795%;
		margin-left: 2.5641%;
		float: left;
	}
	#front-page-why .col-4.first,
	#front-page-why .row div:nth-child(3) {
		margin-left: 0;
		clear: both;
	}
	#front-page-why .grid {
		grid-template-columns: repeat(2, 1fr);
	}
	section.content .col-2 {
		margin-left: 2.5641%;
		float: left;
	}
	section.content .col-2.first {
		margin-left: 0;
	}
	section.content .col-2 {
		width: 48.71795%;
	}
	section.content div.images div.row > div img {
		margin-bottom: 2em;
	}
	.first .caption small {
		top: -40px;
	}
	section.content div.entry ul.fa-ul.services li {
		width: 50%;
		width: calc(50% - 3em);
		margin: 0 3em 0.8em 0;
		display: inline-block;
		vertical-align: top;
		line-height: 1.4;
	}
	#front-page-slideshow a.cta,
	#global-cta a.cta {
		margin: 0 5px 20px;
		display: inline-block;
	}
	footer .row div:nth-child(3) {
		margin-left: 0;
		clear: both;
	}
	footer .col-4 {
		width: 48.71795%;
		margin-left: 2.5641%;
		float: left;
	}
	footer .col-4.first {
		margin-left: 0;
	}
	.after-footer div.wrap div img {
		display: inline-block;
	}
}
@media screen and (min-width: 768px) {
	header {
		height: 160px;
	}
	.scrolled header:not(.open) {
		height: 140px;
	}
	.logo {
		width: 277px;
		height: 84px;
		margin: 15px;
		border-width: 3px 0;
	}
	.hamburger {
		top: 60px;
		right: 18px;
	}
	.scrolled header .hamburger {
		top: 50px;
	}
	.nav-primary ul {
		margin: 0 0 0 20px;
	}
	#front-page-hero,
	#front-page-hero .swiper-container	{
		height: calc(100vh - 40px);
	}
	#front-page-hero .wrap::after,
	#global-hero::after {
		width: 50vw;
	}
	#front-page-hero .swiper-slide {
		padding-top: 160px
	}
	#front-page-hero .swiper-slide .h1 {
		margin-bottom: 30px;
		font-size: 3.5rem;
	}
	.swiper-pagination-bullets .swiper-pagination-bullet {
		width: 14px;
		height: 14px;
		margin: 12px 0;
	}
	.scroll-down-cue {
		width: 60px;
		height: 30px;
		margin-left: -30px;
		bottom: 20px;
	}
	.scroll-down-cue::before,
	.scroll-down-cue::after {
		width: 40px;
		left: -4px;
	}
	.scroll-down-cue::after {
		left: 24px;
	}
	#global-hero {
		padding: 220px 20px 90px;
	}	
	.cards .row {
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;		
	}
	@media screen and (max-width: 991px) {
		.cards .col-4:nth-child(odd) {
			margin-left: 0;
		}
	}
	.cards .extras {
		padding: 25px;
	}
	.home .anchor {
		top: -139px;
	}
	.stack-cards {
		--stack-cards-gap: var(--stack-cards-gap-sm);
		--stack-cards-item-ratio: 3/1;
	}
	/* .stack-card {
		top: var(--sg0-space-md);
		padding: 0 0 0 calc(50%);
		padding-bottom: calc(100% / (var(--stack-cards-item-ratio)));
	} */
	.stack-card {
		top: 160px;
		padding-left: 50%;
	}
	.stack-card::before {
		position: absolute;
		inset: 0 auto 0 0;
		width: 50%;
		height: auto;
	}
	.stack-card-blurb a {
		padding-right: 12px;
	}
	.stack-card-blurb a::before,
	.stack-card-blurb a::after {
		top: 4px;
	}
	.stack-card-blurb a::before {
		right: 12px;
	}
	#front-page-testimonials {
		padding: 80px 0 120px;
	}
	#front-page-testimonials > div.wrap > div.swiper-pagination.swiper-pagination-bullets .swiper-pagination-bullet {
		margin: 0 6px;
	}
	#global-map {
		padding: 0 30px 100px;
	}
	#global-map .row {
		flex-direction: row;
	}
	#global-map .row > div {
		height: 420px;
	}
	#global-map .row > div.locations {
		width: 365px;
	}
	#global-map .row > div.locations a.button {
		position: absolute;
		bottom: 40px;
		left: 30px;
	}
	#global-map .row > div.map {
		flex: 1;
	}
	.col-2,
	.col-3,
	.col-4 {
		margin-left: 2.5641%;
		float: left;
	}
	.col-2.first,
	.col-3.first,
	.col-4.first {
		margin-left: 0;
	}
	.col-2 {
		width: 48.71795%;
	}
	.col-3 {
		width: 31.62393%;
	}
	.col-4 {
		width: 48.71795%;
	}
	section.content {
		padding: 70px 30px 50px;
	}
	section.content div.entry {
		margin: 0 auto;
	}
	section.content div.entry ul.timeline {
		margin-bottom: 0;
	}
	section.content div.entry .anchor > a {
		top: -160px;
	}
	form.contact > div,
	form.quote .customer-details > div {
		width: 50%;
		display: inline-block;
		padding: 0 0 0 10px;
		position: relative;
		vertical-align: top;
	}
	form.contact > div:nth-child(odd),
	form.quote .customer-details > div:nth-child(odd) {
		padding: 0 10px 0 0;
	}
	#contact-form > div:nth-child(7), /* div added by reCAPTCHA */
	form.quote .customer-details > div:nth-child(7) {
		width: 0;
		padding: 0;
	}
	footer {
		font-size: 1.0625rem;
	}
	.after-footer ul {
		width: 100%;
	}
	.after-footer ul li {
		text-align: left;
	}
	.anno-link {
		display: inline-block;
	}
	.cookies {
		left: 20px;
		bottom: 20px;
	}
}
@media screen and (min-width: 800px) {
	section.content div.wrap > div {
		float: left;
	}
	section.content div.entry {
		width: 64.95727%;
	}
	section.content div.sidebar {
		width: 32.47863%;
		margin-left: 2.5641%;
	}
}
@media screen and (min-width: 992px) {
	.scrolled .before-header {
		opacity: 0;
	}
	.before-header {
		height: 40px;
		-webkit-transition: top 0.3s ease, opacity 0.3s ease;
				transition: top 0.3s ease, opacity 0.3s ease;
	}
	.scrolled .before-header {
		opacity: 0;
		top: -35px;
	}
	.before-header a.quote {
		display: none;
	}
	header {
		height: 160px !important;
		overflow: visible !important;
	}
	header:hover {
		background-color: rgb(255 255 255 / 1) !important;
	}
	.scrolled header {
		height: 105px !important;
		border-top: 5px solid rgb(var(--color-primary));
	}
	header > div.wrap {
		padding: 0 30px;
	}
	.logo {
		float: left;
		margin: 15px 0;
	}
	.hamburger {
		display: none;
	}	
	.nav-primary {
		width: auto;
		height: auto;
		margin-top: 0;
		display: table;
		float: right;
		z-index: 99999;
		color: #fff;
		background: transparent;
		opacity: 1;
		text-align: right;
		transition: height 0.3s ease;
	}
	.nav-primary ul {
		margin: 0;
		display: table-cell;
		vertical-align: middle;
	}
	.nav-primary ul li {
		margin: 0;
		float: none;
		text-align: left;
	}
	.nav-primary > ul > li:last-of-type {
		padding-bottom: 0;
	}
	.nav-primary ul li a,
	.nav-primary ul li > span {
		padding-top: 0;
		padding-bottom: 0;
		height: 120px;
		display: inline-block;
		background-color: rgb(var(--color-primary) / 0);
		font-size: 1.125rem;
		line-height: 120px;
		-webkit-transition: height 0.3s ease, color 0.2s ease, background-color 0.2s ease, line-height 0.3s ease;
		transition: height 0.3s ease, color 0.2s ease, background-color 0.2s ease, line-height 0.3s ease;
	}
	.nav-primary ul li:hover a,
	.nav-primary ul li:hover span {
		color: #fff;
		background-color: rgb(var(--color-primary) / 1);
	}
	.nav-primary ul li.has-children > span::after {
		top: 1px;
		right: 15px;
		line-height: 120px;
	}	
	.nav-primary ul li.has-children:hover > span::after {
		color: #fff;
	}
	.scrolled header .nav-primary ul li a,
	.scrolled header .nav-primary ul li > span {
		height: 100px;
		line-height: 100px;
	}
	.scrolled header .nav-primary ul li.has-children > span::after {
		line-height: 100px;
	}
	.nav-primary ul li.has-children:hover > span::after {
		-webkit-transform: rotate(180deg);
				transform: rotate(180deg);
	}
	.nav-primary ul li.has-children:hover ul.sub-menu {
		padding-top: 0;
		pointer-events: auto;
		opacity: 1;			
	}
	.nav-primary ul.sub-menu {
		max-height: none;
		max-width: 250px;
		padding-top: 20px;
		position: absolute;
		overflow: hidden;
		cursor: pointer;
		pointer-events: none;
		opacity: 0;
		-webkit-box-shadow: 5px 5px 5px 0px rgba(0,0,0,0.05);
		box-shadow: 5px 5px 5px 0px rgba(0,0,0,0.05);
		-webkit-transition: padding 0.5s ease;
		transition: padding 0.5s ease;
	}
	.nav-primary ul.sub-menu li {
		display: block;
		background-color: rgb(var(--color-primary));
		line-height: 1;
	}
	.nav-primary ul.sub-menu li a {
		padding: 10px 15px;
		color: #fff;
		font-size: 1.0625rem;
	}
	.nav-primary ul.sub-menu li:hover a {
		color: rgb(var(--color-accent));
	}
	ul > li.contact-link {
		display: none;
	}
	.nav-primary > div.quote-btn-wrap {
		display: table-cell;
		vertical-align: middle;
		padding-left: 15px;	
	}
	.nav-primary > div.quote-btn-wrap a {
		line-height: 1.2;
	}
	#front-page-hero .swiper-slide .h1 {
		font-size: 3.75rem;
	}
	#front-page-hero .swiper-slide h1 {
		font-size: 1.3125rem;
	}
	#front-page-hero .swiper-pagination-bullets {
		top: calc(50% + 60px);
	}
	.home .anchor {
		top: -104px;
	}
	.cards .row > div:not(.extras) {
		margin-bottom: 2.5641%;
	}
	#front-page-faq {
		padding-top: 40px;
	}
	#front-page-why .wrap .row .col-4 {
		margin-top: 80px;
	}
	#front-page-why .wrap .row:nth-of-type(2) > div {
		margin-top: 40px;
	}
	#front-page-why .row div:nth-child(3) {
		margin-left: 2.5641%;
		clear: none;
	}
	.col-4,
	#front-page-why .col-4 {
		width: 23.07692%;
	}
	#front-page-why .grid {
		grid-template-columns: repeat(4, 1fr);
	}
	.stack-card {
		top: 125px;
	}
	section.content div.wrap > div {
		float: left;
	}
	section.content div.entry {
		width: 72.4359%;
		-webkit-transition: width 0.2s ease;
		transition: width 0.2s ease;
	}
	section.content div.entry .anchor > a {
		top: -125px;
	}
	section.content div.bio figure.image:first-of-type {
		display: none;
	}
	section.content div.bio figure.image:last-of-type {
		display: block;
	}
	section.content div.bio figure.image {
		margin: 0;
	}
	section.content div.bio h2 {
		font-size: 1.125rem;
	}
	section.content div.bio p {
		font-size: 1rem;
		line-height: 1.5;
	}
	section.content div.sidebar {
		width: 25%;
		margin-left: 2.5641%;
		-webkit-transition: width 0.2s ease;
		transition: width 0.2s ease;
	}
	section.content.q-c-focus div.entry {
		width: 64.95726%;
	}
	section.content.q-c-focus div.sidebar {
		width: 32.47863%;
		margin-left: 2.5641%;
	}
	section.content.q-c-focus form.contact.quick textarea {
		min-height: 135px;
	}
	.cards .col-4 {
		width: 23%;
		margin-left: 2.64102%;
		background-color: #fff;
		box-shadow: 0 1rem 2rem -1rem rgba(35, 44, 57, 0.2);
	}
	.cards .col-4:hover {
		box-shadow: 0 2rem 1rem -1rem rgba(35, 44, 57, 0.2);
	}
	.cards .col-4.first {
		margin-left: 0;
	}
	#instagram-feed .col-3:first-of-type {
		margin-left: 0;
	}
	#global-map .row > div.locations {
		padding-left: 30px;
	}	
	footer .row > div:nth-child(3) {
		margin-left: 2.5641%;
		clear: none;
	}
	footer .col-4 {
		width: 23.07692%;
	}
}
@media screen and (min-width: 1152px) {
	.nav-primary > ul > li:nth-last-of-type(2) ul.sub-menu li:nth-last-of-type(2) {
		padding-bottom: 10px;
	}
	ul > li.contact-link {
		display: inline-block;
	}
	#front-page-services {
		padding-right: 20px;
		padding-left: 20px;
	}
	#global-cta .wrap {
		max-width: none;
		display: flex;
		justify-content: center;
		align-items: center;
	}
	#global-cta h2 {
		margin: 0;
		display: inline-block;
	}
	#global-cta a.button.outline {
		margin: 0 0 0 24px;
		display: inline-block;
	}
	#global-cta a.button.outline:hover {
		margin: -4px 0 0 20px;
	}
	.after-footer div.wrap div img {
		margin-left: 2.5vw !important;
		margin-right: 2.5vw !important;
	}
	.after-footer div.wrap div img:first-of-type {
		margin-left: 0 !important;
	}
	.after-footer div.wrap div img:last-of-type {
		margin-right: 0 !important;
	}
}
@media screen and (min-width: 1200px) {
	.nav-primary {
		right: 25px;
	}
}
@media screen and (min-width: 1400px) {
	.swiper-pagination-bullets {
		left: 20px;
	}
}