/**
* Theme Name: GEM
* Description: Green Energy Matters
* Author: Mike Salkeld
* Author URI: https://gemenergy.co.uk/
* Version: 1.0
**/

:root {

/*
--dark: 				#141E64;
--over: 				#434B83;
--blue: 				#434B83;
--green:				#44D49C;
--red:					#FF4C46;
--yellow:				#EED443;
--panel:				whitesmoke;
--pale:					#FFFFFF;
*/

accent-color:  			#44D49C;
--link: 				#44D49C;
--link-bg:				transparent;
--link-outline: 		#44D49C solid thin;
--pane:					#FFFFFF;
--notice:				gold;
--background:			gainsboro;
--table:				whitesmoke;
--form:					whitesmoke;
--input:				aliceblue;
--border:				gainsboro solid thin;
--border-focus: 		orange solid thin;
--border-required: 		orangered solid thin;
--border-optional:		orange solid thin;
--border-valid:			green solid thin;
--border-invalid:		crimson solid thin;
--border-disabled:		grey solid thin;
--field-valid:			honeydew;
--field-invalid:		mistyrose;
--outline:				gainsboro solid thin;
--alert: 				crimson;
--invalid: 				crimson;
--shadow: 				0 0 0.5rem 0 hsla(0 0% 0% / 0.3);
--padding:				1rem;
--pad:					0.5rem;
--margin: 				1rem;
--gap:					1rem;
--gap-text:				0.5rem;
--space:				1rem;
--radius:				1rem;
--radius-half:			calc(var(--radius) / 2);
--radius-quarter:		calc(var(--radius) / 4);
--limit: 				90rem;
--limit-aside: 			30rem;
--placeholder-nav:		hsl(0, 0%, 100%);
--placeholder-main:		hsl(0, 0%, 60%);
--tint-panel: 			rgba(255,255,255,0.9);
--hint: 				rgba(255,255,255,0.1);
--prompt: 				var(--notice);
--th:  					var(--green);
--td: 					#E6E6E6;
--shadow: 				0 0 0.2rem gainsboro;
}

@media screen {
	::-webkit-scrollbar              {background-color: var(--link); width: 1rem;}
	::-webkit-scrollbar-thumb        {background-color: var(--dark); border-radius: var(--radius); cursor: grab;}
	::-webkit-scrollbar-thumb:hover  {background-color: var(--over);}
	::-webkit-scrollbar-thumb:active {background-color: var(--over);}
	/*
	::-webkit-scrollbar-button       {border: var(--border); background: var(--colour-3);}
	::-webkit-scrollbar-button:hover {background-color: var(--colour-4);}
	::-webkit-scrollbar-track	    {}
	::-webkit-scrollbar-track-piece {}
	::-webkit-scrollbar-corner	    {}
	::-webkit-resizer			    {}
	*/
	ul.sub-menu::-webkit-scrollbar 			{border-radius: 0 0 var(--radius) 0;}
	ul.sub-menu::-webkit-scrollbar-thumb    {background-color: var(--link); border-radius: 0 0 var(--radius) 0; cursor: grab;}
	div:has(> table)::-webkit-scrollbar,
	.scroll::-webkit-scrollbar {border-radius: var(--radius);}
	::placeholder {color: var(--placeholder-nav);}
	a:focus,
	a:focus-visible {background-color: var(--green); color: var(--pale); outline: none;}
	[readonly] {background-color: yellow;}
	* {box-sizing: border-box; font: 1rem/1.5rem 'Inter Tight', sans-serif; font-weight: 300; margin: 0; padding: 0; text-wrap: pretty;}
	pre {background-color: var(--pale); border: var(--invalid) solid medium; color: var(--dark);}
	html {background-color: var(--background); overscroll-behavior: none; scroll-behavior: smooth; scroll-padding-top: calc(6rem - 1px);}
	body {background-color: var(--dark); background-attachment: fixed; color: var(--pale); display: flex; flex-direction: column; min-height: 100vh; position: relative; width: 100%;}
	body > img {bottom: -2rem; display: block; filter: blur(0rem); height: calc(100vh + 4rem); left: -2rem; object-fit: cover; object-position: center; position: fixed; right: -2rem; top: -2rem; transition: filter 0.5s ease-in-out; width: calc(100vw + 4rem); z-index: 1;}
	body > img.blur {filter: blur(0.25rem) grayscale(1)}
	body > * {z-index: 9;}
	input#toggle {display: none;}
	noscript {background-color: var(--alert); color: var(--pale); padding: var(--padding);}
	h1 {font-size: 3rem; font-weight: 900; line-height: 3rem;}
	h1 svg {float: left; margin: 0 calc(var(--margin) / 2) 0 0; max-height: 3rem; max-width: 3rem;}
	h2 {color: var(--green); font-size: 2rem; font-weight: 700; line-height: 2.5rem;}
	h3 {font-size: 1.4rem; line-height: 2rem;}
	h4 {font-size: 1.2rem; line-height: 1.5rem;}
	h5 {font-size: 1.0rem; line-height: 1rem;}
	h6 {font-size: 1rem; line-height: 1rem;}
	p {line-height: 2rem;}
	br {display: none;}
	hr {display: none;}
	abbr {color: inherit; font-size: inherit; text-decoration: none;}
	address br {display: block;}
	a {color: var(--colour-3); text-decoration: none;}
	p a:hover {text-decoration: underline;}
	small {font-size: 0.75rem; line-height: 1rem;}
	small a {font-size: inherit; line-height: inherit;}
	strong {font-size: inherit; line-height: inherit; font-weight: bold;}
	img.bottom {object-position: bottom;}
	img.top {object-position: top;}
	blockquote {background-color: var(--notice); border-radius: var(--radius-half); color: var(--dark); padding: var(--pad) var(--padding); text-align: center;}
	blockquote#notice {grid-area: notice;}
	svg {color: inherit; display: block; height: 100%; min-height: 1.5rem; min-width: 1.5rem; width: 100%;}
	.hide {height: 0; left: -100vw; overflow: hidden; position: absolute; width: 0;}
	.ignore {display: none !important;}
	p#skip {left: -100vw; position: absolute;}
	sup {font-size: small; line-height: 1rem; padding: 0 0 1rem 0;}
	nav#nav_primary {align-items: center; background-color: var(--dark); display: grid; grid-template-areas: 'logo . left right' 'menu menu menu menu'; grid-template-columns: auto auto auto auto; grid-template-rows: var(--menu) fit-content; height: 5rem; justify-content: space-between; outline: outline: var(--outline); position: sticky; top: 0;  width: 100%; z-index: 999;}
	nav#nav_primary.shadow {outline: var(--outline);}
	nav#nav_primary > a,
	nav#nav_primary > label {align-items: center; border-radius: var(--radius); display: flex; gap: 0; line-height: 2rem; min-height: 2rem; min-width: 2rem; padding: var(--padding); transition: background-color 0.3s ease-in-out; width: 100%;}
	nav#nav_primary > a#logo {display: block; grid-area: logo; height: inherit; max-width: 10rem; min-height: 5rem; min-width: 4rem; overflow: hidden; padding: var(--padding); position: relative; width: auto;}
	nav#nav_primary > a#logo svg {color: white; height: 3rem; min-height: 3rem; min-width: 8rem; position: absolute; width: 8rem; transition: width 0.3s ease-in-out 0.3s;}
	nav#nav_primary > a#logo svg #gem {opacity: 0; transition: opacity 0.3s ease-in-out 0;}
	nav#nav_primary > label > svg,
	nav#nav_primary > a > strong {display: none; line-height: 3rem; min-height: 3rem; font-size: 2rem;}
	nav#nav_primary > label > span,
	nav#nav_primary > a > span {display: none;}
	nav#nav_primary > a#tel {grid-area: tel;}
	nav#nav_primary > a#email {grid-area	: email;}
	nav#nav_primary > a#appointment {grid-area: appointment;}
	nav#nav_primary > label {grid-area: toggle;}
	nav#nav_primary a svg {color: var(--green);}
	nav#nav_primary a span {font-weight: inherit; margin: 0 0 0 var(--gap-text);}
	nav#nav_primary ul {align-items: center; background-color: var(--dark); display: flex; gap: var(--gap); justify-content: flex-start; list-style: none; padding: var(--padding);}
	nav#nav_primary ul.left {grid-area: left; justify-content: flex-start;}
	nav#nav_primary ul.right {grid-area: right; justify-content: flex-end; padding: var(--padding) var(--padding) var(--padding) 0;}
	nav#nav_primary ul li.call_to_action svg {color: inherit;}
	nav#nav_primary ul li.call_to_action span {white-space: nowrap;}
	nav#nav_primary ul li.call_to_action a {background-color: var(--green); color: var(--dark); font-weight: 900; text-align: center; transition: background-color 0.3s ease-in-out;}
	nav#nav_primary ul li.call_to_action a:focus,
	nav#nav_primary ul li.call_to_action a:hover {background-color: var(--pale) !important; color: var(--dark) !important;}
	nav#nav_primary ul a,
	nav#nav_primary ul label {align-items: center; background-color: var(--colour-0); border-radius: var(--radius); display: flex; height: 3rem; padding: calc(var(--padding) / 2); min-width: 3rem; transition: background-color 0.3s ease-in-out;}
	nav#nav_primary ul a:focus,
	nav#nav_primary ul a:hover,
	nav#nav_primary ul label:focus,
	nav#nav_primary ul label:hover {background-color: var(--over);}
	nav#nav_primary ul svg {display: block; max-height: 1.5rem; max-width: 1.5rem;}
	nav#nav_primary ul.cta svg {margin: 0 auto;}
	nav#nav_primary ul.cta span {display: none;}
	nav#nav_primary .menu-wrap {display: none; grid-area: menu;}
	nav#nav_primary .menu-wrap span {text-wrap: nowrap;}
	nav#nav_primary .menu-wrap ul.menu {align-items: flex-start; display: flex; flex-direction: column; gap: var(--gap); padding: 0;}
	nav#nav_primary .menu-wrap ul.menu li {display: flex; flex-direction: column; gap: var(--gap); width: 100%;}
	nav#nav_primary .menu-wrap ul.menu ul.sub-menu {padding: 0 0 0 calc(var(--padding) * 2);}
	nav#nav_primary ul.menu > li {position: relative;}
	nav#nav_primary ul.menu a {padding: var(--padding);}
	nav#nav_primary ul.menu li.quote a:focus,
	nav#nav_primary ul.menu li.quote a:hover {background-color: var(--pale);}
	nav#nav_primary ul.menu a:not(:last-child) span {background-image: url('svg/components/expand-more.svg'); background-position: top right; background-repeat: no-repeat; background-size: 2rem 2rem; line-height: inherit; min-height: 2rem; padding: 0 2rem 0 0;}
	nav#nav_primary ul.menu ol {list-style: none; margin: 0 0 0 calc(var(--margin) * 2);}
	nav#nav_primary ul.menu ol a {border-radius: var(--radius-half); padding: var(--padding);}
	nav#nav_primary ul.menu svg {height: 1.5rem; width: 1.5rem;}
	nav#nav_primary form {background-color: transparent; border: 0 none; border-radius: var(--radius-half); display: flex; flex-direction: row-reverse; gap: 0; grid-area: form; height: 3rem; overflow: hidden; padding: 0; width: 100%;}
	nav#nav_primary form label {left: -100vw; position: absolute;}
	nav#nav_primary form input[type='search'],
	nav#nav_primary form input[type='search']:focus,
	nav#nav_primary form input[type='search']:hover {background-color: transparent !important; border: 0 none; color: var(--pale); height: 3rem; line-height: 3rem; outline: 0 none; padding: var(--padding) 0; width: 100%;}
	nav#nav_primary form span {left: -100vw; position: absolute;}
	nav#nav_primary form button {background-color: transparent; border-radius: 0; display: block; height: 3rem; line-height: 3rem; margin: 0; padding: var(--padding) calc(var(--padding) / 2) var(--padding) var(--padding); text-align: center;}
	nav#nav_primary form svg {display: block; height: 1rem; margin: 0 auto; width: 1rem;}
	nav#nav_primary form:focus,
	nav#nav_primary form:hover,
	nav#nav_primary form:focus-within {background-color: rgba(255,255,255,0.15);}
	nav#nav_primary a,
	nav#nav_primary label {align-items: center; background-color: transparent; border-radius: var(--radius); color: var(--colour-6); cursor: pointer; display: flex; gap: 0; padding: var(--padding); white-space: nowrap;}
	input#toggle:checked ~ nav#nav_primary > .menu-wrap {background-color: var(--dark); display: flex; flex-direction: column; inset: 5rem 0 0 0; max-height: calc(100vh - 2rem); outline: var(--outline); overflow-x: hidden; overflow-y: auto; padding: var(--padding); position: fixed;}
	input#toggle:checked ~ nav#nav_primary > .menu-wrap ul.sub-menu {display: grid; grid-auto-flow: row; grid-template-columns: repeat(auto-fill,minmax(15rem,1fr));}
	body:has(input#toggle:checked) {overflow: hidden;}
	nav#nav_primary li.current-menu-ancestor > a,
	nav#nav_primary li.current-menu-parent > a,
	nav#nav_primary li.current-page-parent > a,
	nav#nav_primary li.current_page_parent > a,
	nav#nav_primary li.current_page_ancestor > a,
	nav#nav_primary li.current-page-ancestor > a,
	nav#nav_primary li.current-menu-item > a,
	nav#nav_primary li.current_page_item > a {background-color: var(--over);}
	form {background-color: var(--form); border-radius: var(--radius-half); color: var(--dark); display: flex; flex-direction: column; gap: var(--gap); padding: var(--padding); width: 100%;}
	form fieldset {border: 0 none; border-radius: var(--radius-half); display: flex; flex-direction: column; gap: var(--gap); padding: calc(var(--padding) * 3) 0 0 0; position: relative;}
	form fieldset.checkbox,
	form fieldset.radio {background-image: linear-gradient(var(--colour-1),var(--colour-2)); border: 0 none; gap: 0; margin: calc(var(--margin) * 3) 0 0 0; padding: var(--padding);}
	form fieldset.checkbox legend,
	form fieldset.radio legend {left: 0; position: absolute; top: -3rem;}
	form fieldset.checkbox label,
	form fieldset.radio label {max-width: 50%;}
	form legend {color: var(--dark); font-size: larger; font-weight: 700; position: absolute; top: 0;}
	form label {color: var(--dark); cursor: pointer; display: flex; flex-direction: column-reverse; justify-content: flex-start;  min-height: 3rem;}
	form label span {align-items: center; display: flex;}
	form label span small {color: var(--hint); margin: 0 0 0 var(--gap-text);}
	form input:not([type='checkbox'], [type='radio']) {accent-color: var(--colour-3); border-radius: var(--radius-quarter); color: var(--dark); display: block; min-height: 3rem; min-width: 3rem; padding: calc(var(--padding) / 2) var(--padding); width: 100%;}
	form input:focus,
	form input:hover {border: var(--border-focus); box-shadow: none; outline: none;}
	form input[type='date'] 	{background-color: var(--input);}
	form input[type='email'] 	{background-color: var(--input);}
	form input[type='tel'] 		{background-color: var(--input);}
	form input[type='text'] 	{background-color: var(--input);}
	form input[type='time'] 	{background-color: var(--input);}
	form input[type='checkbox'],
	form input[type='radio'] {min-height: 2rem; min-width: 2rem;}
	form input[type='search']::-webkit-search-cancel-button {content: URL('svg/components/search-clear.svg'); cursor: pointer; height: 1rem; margin: 0 var(--margin) 0 0; width: 1rem; -webkit-appearance: none;}
	form textarea {background-color: var(--input); border: var(--border); border-radius: var(--radius-half); height: 11rem; padding: var(--padding); width: 100%;}
	form textarea:focus,
	form textarea:focus-visible {border: var(--border-focus); box-shadow: none; outline: none;}
	form select {appearance: none; background: var(--link) url('svg/components/select.svg') right 0.5rem center no-repeat; background-size: 1.5rem 1.5rem; border-radius: var(--radius-half); color: var(--pale); height: 3rem; padding: var(--pad) var(--padding);}
	form option {background-color: var(--link); color: var(--pale); padding: var(--pad) var(--padding);}
	form input#files {display: none;}
	form span#upload_files {background-color: var(--pale); border: var(--border); border-radius: var(--radius-half); display: block; min-height: 3rem; padding: var(--pad) var(--padding);}
	form span#upload_files br {display: block;}
	form button,
	form input[type='submit'] {align-items: center; background-color: var(--link); border: 0 none; border-radius: var(--radius-half); color: var(--dark); cursor: pointer; font-size: 1rem; font-weight: bold; margin: 0; padding: calc(var(--padding) / 2) var(--padding); text-align: center; transition: background-color 0.3s ease-in-out;
	-webkit-appearance: none;
	-webkit-border-radius: var(--radius-half);}
	form button:focus,
	form button:hover,
	form input[type='submit']:focus,
	form input[type='submit']:hover {background-color: var(--over);}
	form fieldset:has(> label > input[type='checkbox']),
	form fieldset:has(> label > input[type='radio']) {flex-direction: row; flex-wrap: wrap;}
	form label:has(input[type='checkbox']),
	form label:has(input[type='radio']) {align-items: center; flex-direction: row; min-width: fit-content; width: 100%;}
	form label:has(input[type='checkbox']) span,
	form label:has(input[type='radio']) span {display: inline; width: 100%;}
	span.wpcf7-list-item-label::before,
	span.wpcf7-list-item-label::after {content: '';}
	input[type='text'] + span {justify-content: space-between;}
	input {background-color: var(--field-invalid); border: var(--border-required);}
	input:valid {border: var(--border-valid);}
	input.wpcf7-not-valid,
	textarea.wpcf7-not-valid {border: var(--border-required);}
	fieldset#sectors ~ fieldset#_form_glass,
	fieldset#sectors ~ fieldset#_form_solar,
	fieldset#sectors ~ fieldset#_form_window {display: none;}
	fieldset#sectors:has(input#sector_glass:checked) ~ fieldset#_form_glass,
	fieldset#sectors:has(input#sector_solar:checked) ~ fieldset#_form_solar,
	fieldset#sectors:has(input#sector_window:checked) ~ fieldset#_form_window {background-color: var(--form); border: var(--border); display: flex; padding: calc(var(--padding) * 4) var(--padding) var(--padding) var(--padding);}
	form#acf-form {padding: 0;}
	.acf-fields > .acf-tab-wrap,
	.acf-tab-wrap {background-color: var(--pale) !important;}
	ul.acf-tab-group {border-top: 0 none; display: flex; padding: var(--padding) var(--padding) 0 var(--padding);}
	ul.acf-tab-group li.active a {background-color: var(--pane) !important;}
	ul.acf-tab-group a {background-color: var(--color-1) !important; color: var(--dark) !important;}
	form#acf-form label {display: flex; gap: calc(var(--gap) / 2); margin: 0; min-height: auto; padding: 0;}
	form#acf-form input[type='checkbox'],
	form#acf-form input[type='radio'] {accent-color: var(--link); border: var(--border); display: block; height: 1rem; margin: 0; min-height: 1rem; min-width: 1rem; width: 1rem;}
	form#acf-form input,
	form#acf-form textarea {border: var(--border);}
	.acf-fields > .acf-field {border-top: 0 none !important; padding: var(--padding) !important;}
	.acf-label label {display: inline !important; margin: 0;}
	span.acf-required {display: inline-block !important;}
	ul.acf-radio-list,
	ul.acf-checkbox-list {border: 0 none !important; display: flex; gap: var(--gap); padding: 0 !important;}
	ul.acf-radio-list:focus-within,
	ul.acf-checkbox-list:focus-within {border-radius: 0; padding: 0;}
	.acf-hl::before,
	.acf-hl::after,
	.acf-bl::before,
	.acf-bl::after,
	.acf-cf::before,
	.acf-cf::after {display: none !important;}
	form#acf-form input[type='submit'] {margin: 0 auto var(--margin) auto; width: auto;}
	header {background-color: var(--hint); display: flex; flex-direction: column; grid-area: header; height: 50dvh; overflow: hidden; position: relative; width: 100%;}
	header.curve::before {border-radius: 25% 75% 0 0; content: ''; display: block; height: 10rem; inset: auto -2rem -4rem -2rem; position: absolute; z-index: 99;}
	header span {border-radius: var(--radius-half); margin: var(--margin); padding: var(--padding); width: fit-content;}
	header span:has(h1:empty) {opacity: 0;}
	header h1 {color: var(--pale); font-size: 3rem; line-height: 3rem;}
	header h2 {color: var(--pale); font-size: 2rem; line-height: 2rem; margin: var(--margin) 0 0 0;}
	header p  {color: var(--pale);}
	header a {color: var(--pale);}
	header figure {display: flex; margin: 0; height: 100%; position: relative; width: 100%;}
	header figcaption {display: grid; height: 100%; place-items: center; padding: var(--space); position: absolute; width: 100%; z-index: 99;}
	header figcaption div {border-radius: var(--radius); display: flex; gap: var(--gap); max-width: 30rem;}
	header figcaption a {background-color: var(--cta); border-radius: var(--radius); color: var(--pale); display: flex; flex-direction: column; padding: var(--padding); transition: background-color 0.3s ease-in-out;}
	header figcaption a:focus,
	header figcaption a:hover {background-color: var(--cta-over);}
	header figcaption span {background-color: var(--pale); border-radius: var(--radius); display: flex; flex-direction: column; padding: calc(var(--padding) / 2) var(--padding); width: fit-content;}
	header figcaption img,
	header figcaption svg {max-height: 6rem; max-width: 6rem;}
	header figcaption strong {font-size: 1.5rem;}
	header figcaption small {display: none; font-size: 1rem; line-height: 2rem;}
	header > img {height: 100%; object-fit: cover; position: absolute; width: 100%; z-index: -1;}
	header > img.bottom {object-position: bottom;}
	header > img.top {object-position: top;}
	body > img ~ header {background-color: transparent !important; background-image: none;}
	body > img ~ header h1 {color: var(--dark);}
	body > img ~ header h2 {color: var(--dark);}
	body > img ~ header figure {background-image: none !important;}
	summary {cursor: pointer;}
	#banner,
	#banners {height: 50dvh; position: relative; transition: height 0.3s ease-in-out; width: 100%;}
	#banner  	img,
	#banners 	img {display: block; object-fit: cover; object-position: center center; transition: height 0.3s ease-in-out; width: 100%;}
	#banner 	img.top,
	#banners 	img.top {object-position: center top;}
	#banner 	img.bottom,
	#banners 	img.bottom {object-position: center bottom;}
	#banner a,
	#banners a {background-color: var(--link); border-radius: 0.5rem; color: var(--pale); display: flex; flex-direction: column; float: right; max-width: var(--text-limit); padding: 1rem; transition: background-color 0.3s ease-in-out;}
	#banner a:focus,
	#banner a:focus-within,
	#banner a:hover,
	#banners a:focus,
	#banners a:focus-within,
	#banners a:hover {background-color: var(--over);}
	#banner span,
	#banners span {background-color: var(--pale); border-radius: 0.5rem; box-shadow: var(--shadow); color: var(--dark); display: flex; flex-direction: column; float: right; max-width: var(--text-limit); padding: 1rem; text-align: right;}
	#banner a.partner {background-color: var(--field);}
	#banner a.partner > img,
	#banner a.partner > svg {display: block; float: right; height: 100%; max-height: 6rem; max-width: 25rem; object-fit: contain; object-position: right; width: auto;}
	#banner figcaption span img,
	#banner figcaption span svg {display: block; height: auto; margin: 0 0 0 auto; max-height: 5rem; max-width: 12rem; width: 100%;}
	#banner strong,
	#banners strong {font-size: 1.5rem; font-weight: 900; line-height: 2rem; text-transform: capitalize;}
	#banner br,
	#banners br {display: none;}
	#banner small,
	#banners small {font-size: 1.5rem; line-height: 2rem;}
	#banner small:empty,
	#banners small:empty {display: none;}
	#banners {overflow: hidden; padding: 0; position: relative; z-index: 9;}
	#banners ol {height: 100%; list-style: none; margin: 0; position: relative; width: 100%;}
	#banners ol li {color: white; display: block; float: left; overflow: hidden; position: relative; width: 100%;}
	#banners ol a {background-color: var(--link); border-radius: var(--radius-half); color: var(--pale); display: flex; flex-direction: column; float: right; gap: var(--gap); max-width: var(--text-limit); padding: 0.75rem var(--padding); transition: background-color 0.3s ease-in-out;}
	#banner figcaption,
	#banners figcaption {background-color: transparent; color: white; position: absolute; width: 100%; z-index: 9;}
	#banner figcaption > div,
	#banners figcaption > div {margin: 0 auto; max-width: 50vw;}
	#banner figcaption,
	#banners figcaption,
	#banners ol li[style*='translateX(0px)'] figcaption {animation: caption 1s ease-in-out 2s forwards;}
	#banner figcaption + img,
	#banners figcaption + img,
	#banners ol li[style*='translateX(0px)'] figcaption + img {animation: banner 1s ease-in-out 2s forwards;}
	#banners button {background-color: var(--link); border: 0 none; border-radius: 0.5rem; color: var(--pale); cursor: pointer; height: 3rem; padding: 1rem; position: absolute; transition: background-color 0.3s ease-in-out; width: 3rem;}
	#banners button:focus,
	#banners button:hover {background-color: var(--over);}
	#banners button:first-of-type {left: var(--space);}
	#banners button:last-of-type {right: var(--space);}
	#banners button svg {color: var(--pale); display: block; fill: var(--pale); max-height: 1rem; stroke: var(--pale); max-width: 1rem;}
	#banner ~ blockquote,
	#banners ~ blockquote {margin: 0;}
	.glide {position: relative; height: 50vh; width: 100%;}
	.glide__track {height: 50dvh; overflow: hidden; width: 100%;}
	.glide__slides {backface-visibility: hidden; display: flex; flex-wrap: nowrap; list-style: none; margin: 0; padding: 0; position: relative; overflow: hidden; padding: 0; touch-action: pan-Y; transform-style: preserve-3d; white-space: nowrap;}
	.glide__slides--dragging {user-select: none;}
	.glide__slide {flex-shrink: 0; height: 100%; margin: 0; user-select: none; padding: 0; white-space: normal; width: 100vw; -webkit-tap-highlight-color: transparent; -webkit-touch-callout: none;}
	.glide__slide figure {max-height: 50dvh; width: 100vw;}
	.glide__slide a {-webkit-user-drag: none; user-select: none;}
	.glide__arrows {bottom: 0; display: flex; justify-content: space-between; list-style: none; margin: 0 auto; position: absolute; width: 100%; z-index: 99; -webkit-touch-callout: none;}
	.glide__bullets {display: none; user-select: none; -webkit-touch-callout: none;}
	.glide--rtl {direction: rtl;}
	.glide__arrow--disabled {opacity: 0.3;}
	.glide--swipeable {cursor: grab;}
	.glide--dragging {cursor: grabbing;}
	.glide__arrows button {align-items: center; background-color: var(--colour-1); border: 0 none; border-radius: var(--radius-half); bottom: var(--space); color: var(--pale); cursor: pointer; display: flex; height: 3rem; justify-content: center; transition: background-color 0.3s ease-in-out; width: 3rem;}
	.glide__arrows button svg {max-height: 1rem; max-width: 1rem;}
	.glide__arrows button:focus,
	.glide__arrows button:hover {background-color: var(--colour-3);}
	q {font-size: inherit;}
	dl#location br {display: block;}
	dl#location dt {margin: 0;}
	dt {font-size: larger; margin: var(--margin) 0;}
	dt ~ dt {margin: var(--margin) 0 0 0;}
	dd ~ dd {margin: var(--margin) 0 0 0;}
	dd strong {display: block; font-weight: 500;}
	dl#breadcrumb {display: flex; flex-direction: column; gap: var(--gap); justify-content: center; padding: var(--padding); width: 100%;}
	dl#breadcrumb dt {font-weight: bold;}
	dl#breadcrumb dt::after {content: ':';}
	dl#breadcrumb dd {text-align: center;}
	dl#breadcrumb dd ~ dd {display: flex; flex-direction: column;}
	dl#breadcrumb dd ~ dd::before {content: '\2193 '; margin: 0 0 var(--margin) 0;}
	dl#breadcrumb a:focus,
	dl#breadcrumb a:hover {text-decoration: underline;}
	main {display: flex; flex: 1; flex-direction: column; gap: var(--space); grid-template-columns: repeat(auto-fill,minmax(20rem,1fr)); padding: var(--space); width: 100%;}
	main ::placeholder {color: var(--placeholder-main);}
	article {display: flex; flex-direction: column; gap: var(--gap); grid-area: article; width: 100%;}
	body.home article > h2:first-of-type {color: var(--pale); font-size: 2rem; font-weight: 900; line-height: 2rem; text-align: center;}
	article a {color: var(--link); transition: color 0.3s ease-in-out;}
	article a:focus,
	article a:hover {text-decoration: underline;}
	article header#package {align-items: center; display: flex; flex-direction: column; gap: var(--gap); min-height: 24rem;}
	article header#package img {height: 100%; object-fit: contain; width: 100%;}
	article header#package p {font-size: 1.2rem; font-weight: 600;}
	ul#packages {display: grid; gap: var(--gap); grid-template-columns: repeat(auto-fit,minmax(15rem,1fr)); list-style: none;}
	ul#packages li {border-radius: var(--radius);}
	ul#packages a {text-decoration: none;}
	ul#packages a:focus,
	ul#packages a:hover {text-decoration: none;}
	ul#packages figure {display: flex; flex-direction: column; height: 100%; justify-content: space-between; padding: var(--padding);}
	ul#packages img {object-fit: cover; height: auto; width: auto;}
	ul#packages figcaption {color: var(--pale); font-size: 1.5rem; font-weight: bold; line-height: 2rem; padding: var(--padding); text-align: center;}
	ul {list-style: none;}
	ul#sector_hints {display: grid; gap: calc(var(--gap) * 2); grid-template-columns: repeat(auto-fit,minmax(20rem,1fr)); list-style: none;}
	ul#sector_hints a {align-items: center; border-radius: var(--radius); color: var(--colour-6); display: flex; flex-direction: column; height: 100%; justify-content: center; width: 100%;}
	ul#sector_hints a figure {display: flex; flex-direction: column; height: 100%; margin: 0; position: relative; width: 100%;}
	ul#sector_hints a img {aspect-ratio: 3/2; border-radius: var(--radius); flex: 1;}
	ul#sector_hints a figcaption {background-color: var(--colour-1); background-image: linear-gradient(var(--colour-1),var(--colour-2)); border-radius: var(--radius-half); color: var(--pale); display: grid; gap: 0 var(--gap-text); grid-template-areas: 'icon title'; grid-template-columns: 2rem 1fr; grid-template-rows: repeat(auto-fill,minmax(2rem,1fr)); inset: auto auto 1rem 1rem; max-width: calc(100% - 2rem); padding: var(--padding); position: absolute; z-index: 9;}
	ul#sector_hints a figcaption svg {grid-area: icon; max-height: 1rem; max-width: 1rem;}
	ul#sector_hints a figcaption strong {align-items: center; display: flex; gap: calc(var(--gap) / 2); grid-area: title;}
	ul#sector_hints a figcaption small {display: none; grid-area: summary;}
	ul#sector_hints a:focus figcaption,
	ul#sector_hints a:hover figcaption {background-color: var(--colour-4);}
	ul.features {display: flex; flex-direction: column; gap: var(--gap); list-style: none; width: 100%;}
	ul.features > li {background-color: var(--panel); border-radius: var(--radius); color: var(--dark); display: flex; gap: var(--gap); padding: var(--padding); position: relative; width: 100%;}
	ul.features > li.column {flex-direction: column;}
	ul.features > li.column-reverse {flex-direction: column-reverse;}
	ul.features > li.row {flex-direction: row;}
	ul.features > li.row-reverse {flex-direction: row-reverse;}
	ul.features > li:has(img),
	ul.features > li:has(> svg) {min-height: 15rem;}
	ul.features > li > a {color: var(--dark); display: flex; flex-direction: column; gap: var(--gap); height: 100%; width: 100%;}
	ul.features > li > a:focus,
	ul.features > li > a:hover {background-color: transparent !important; color: var(--dark) !important; text-decoration: none;}
	ul.features figure {background-color: var(--tint-panel); border-radius: var(--radius-half); display: flex; gap: var(--gap); margin: 0; overflow: hidden; position: relative; width: 100%;}
	ul.features figure.contain {background-color: var(--pale);}
	ul.features figure.contain figcaption {left: -300vw; position: absolute;}
	ul.features img {border-radius: var(--radius-half); display: block; height: 100%; object-fit: cover; object-position: center; width: 100%;}
	ul.features svg {flex: 1;}
	ul.features figcaption {background-color: gold; border-radius: var(--radius-quarter); display: flex; flex: 1; flex-direction: column; inset: auto var(--padding) var(--padding) var(--padding); justify-content: center; padding: var(--pad) var(--padding); position: absolute; width: fit-content; z-index: 99;}
	ul.features div {display: flex; flex-direction: column; gap: var(--gap);}
	ul.features small {font-size: 1rem; font-weight: 600;}
	ul.features h3 {font-weight: 900; line-height: 2rem; text-wrap: balance;}
	ul.features ul {display: flex; flex-direction: column; gap: var(--gap); list-style-type: disc !important; padding: var(--padding);}
	ul.features ul li {display: list-item; padding: 0;}
	ul.features li.blue h3 {color: var(--blue);}
	ul.features li.blue figcaption {background-color: var(--blue);}
	ul.features p strong {font-size: larger;}
	ul.features div ul {padding: 0 var(--padding);}
	ul#panes {display: flex; flex-direction: column; gap: var(--gap);}
	ul#panes li {flex: 1;}
	ul#panes figure {display: flex; flex-direction: column;}
	ul#panes button {background: var(--colour-6) url('../svg/components/pane-1.svg') center center no-repeat; background-size: contain; border: var(--link-outline); border-radius: var(--radius); cursor: pointer;}
	ul#panes button svg {color: var(--dark); object-fit: contain; object-position: center; visibility: hidden;}
	ul#panes button:hover {background-image: none;}
	ul#panes button:hover svg {visibility: visible;}
	ul#panes figcaption {padding: calc(var(--padding) / 2) var(--padding); text-align: center;}
	section.image figure {background-color: var(--panel); border-radius: var(--radius); padding: var(--padding);}
	section.image img {border-radius: var(--radius-half); height: auto; width: 100%;}
	section.logos {background-color: var(--pale); padding: var(--padding);}
	section.logos ul {align-items: center; border-radius: var(--radius); display: flex; flex-wrap: wrap; gap: var(--gap); justify-content: space-evenly;}
	section.logos li {min-height: 3rem; min-width: 3rem;}
	section.logos img,
	section.logos svg {max-height: 3rem; max-width: 12rem; object-fit: contain;}
	section.logos a {align-items: center; display: flex; justify-content: center; width: fit-content;}
	section.definitions dt {margin: 0;}
	section.definitions dt ~ dt {margin: var(--margin) 0 0 0;}
	section.definitions dd {margin: 0;}
	section {border-radius: var(--radius); display: flex; flex-direction: column; gap: var(--gap); min-height: fit-content;}
	section.cta {display: flex; flex-direction: column; gap: var(--gap);}
	section.cta a {align-items: center; background-color: var(--link); border-radius: var(--radius); color: var(--pale); display: flex; flex-direction: column; gap: var(--gap-text); justify-content: center; padding: var(--padding); text-align: center; transition: background-color 0.3s ease-in-out, box-shadow 0.3s ease-in-out;}
	section.cta a:focus,
	section.cta a:hover {background-color: var(--pale) !important; text-decoration: none;}
	section.cta strong {font-size: 2rem; font-weight: 900; line-height: 2rem;}
	section.cta small {font-size: 1.5rem; font-weight: 700; line-height: 1.5rem;}
	section.prompts ol {display: flex; gap: var(--gap); flex-direction: column; list-style: none; width: 100%;}
	section.prompts ol li {border-radius: var(--radius); overflow: hidden;}
	section.prompts ol li:not(:has(> a)),
	section.prompts ol a {color: inherit; display: grid; gap: var(--gap); grid-template-areas: 'icon title' 'summary summary'; grid-template-columns: minmax(5rem, max-content) 1fr; grid-template-rows: minmax(5rem, max-content) 1fr; padding: var(--padding); text-decoration: none;}

	section.prompts ol a:focus,
	section.prompts ol a:hover {background-color: var(--pale); color: var(--dark);}

	section.prompts ol svg {border-radius: var(--radius-half); display: block; grid-area: icon; height: 5rem; object-fit: contain; max-width: 6rem;}
	section.prompts ol figure {align-items: flex-start; display: flex; flex-direction: column; justify-content: flex-start; margin: 0; position: relative; width: 100%;}
	section.prompts ol img {border-radius: var(--radius-half); display: block; height: 6rem; object-fit: contain; max-width: 6rem;}
	section.prompts ol figcaption {color: var(--pale); display: flex; flex: 1; flex-direction: column;}
	section.prompts ol h3 {align-self: center; color: var(--green); font-size: 1.5rem; font-weight: 900; grid-area: title; line-height: 2rem;}
	section.prompts ol p {color: inherit; font-size: 1.2rem; font-weight: 700; grid-area: summary; line-height: 2rem;}
	section.selectable .cols_2 svg {margin: 0 auto; max-height: fit-content; max-width: fit-content;}
	section.selectable .cols_2:has(svg) div {flex: 1; max-width: 100%;}
	section.faq .q-a {background-color: var(--link); border-radius: var(--radius) !important; display: flex; flex-direction: column; gap: 0; overflow: hidden;}
	section.faq details {background-color: var(--pale); color: var(--dark); overflow: hidden;}
	section.faq details summary {background-color: var(--link); background-image: url('svg/components/expand-more.svg'); background-position: right 0.75rem top 0.75rem; background-repeat: no-repeat; background-size: 1.5rem; color: var(--pale); cursor: pointer; font-weight: 700; line-height: 2rem; padding: var(--pad) calc(var(--padding) * 3) var(--pad) var(--padding); transition: background-color 0.3s ease-in-out; user-select: none;}
	section.faq details[open] summary,
	section.faq details summary:focus,
	section.faq details summary:hover {background-color: var(--over);}
	section.faq details summary::after,
	section.faq details summary::before {content: '';}
	section.faq details summary::marker {content: '';}
	section.faq details summary::-webkit-details-marker {display: none;}
	section.faq details[open] summary {background-color: var(--over); background-image: url('svg/components/expand-less.svg');}
	section.faq details[open] summary::before {content: '';}
	section.faq details summary div {background-color: none !important;}
	section.faq details div:has(> table) {background-color: var(--panel);}
	section.faq details summary div::after,
	section.faq details summary div::before {content: ''; display: none !important;}
	section.faq details > div {color: inherit; display: flex; flex-direction: column; gap: var(--gap); padding: var(--padding);}
	section.faq details ul {list-style: disc; margin: 0 0 0 var(--margin);}
	section.faq details + details::before {background-color: #62eeb8; content: ''; display: block; height: 1px; width: 100%; z-index: 9;}
	section.footnotes ol.notes {display: flex; flex-direction: column; gap: var(--gap); list-style-type: decimal; margin: 0 0 0 var(--margin);}
	section.footnotes ol.notes ol {}
	section.footnotes li {}
	section.footnotes li::before {font-size: small;}
	section.footnotes li::marker {font-size: small;}
	section.footnotes small {line-height: inherit;}
	section.footnotes small * {font-size: inherit;}
	ol#steps {display: flex; flex-direction: column; gap: calc(var(--gap) * 4); justify-content: center; list-style: none !important; margin: 0 auto; width: 100%;}
	ol#steps > li {border: var(--border); border-radius: var(--radius-half); display: flex; flex-direction: column; gap: var(--gap); padding: var(--padding) var(--padding) var(--pad) var(--padding); position: relative; width: 100%;}
	ol#steps > li + li::before {background: transparent url('svg/components/arrow-down.svg') top center no-repeat; background-size: contain; color: var(--dark); content: ''; display: block; height: 2rem; position: absolute; text-align: center; top: -3rem; width: 100%;}
	ol#steps ul {}
	ol#steps ul li {display: flex; flex-direction: column;}
	ol#steps strong {font-weight: bold;}
	ol#steps ul details summary::marker {color: var(--colour-3);}
	ol#vacancies {display: flex; flex-direction: column; gap: var(--gap); list-style: none;}
	ol#vacancies li {background-color: var(--panel); border: var(--border); border-radius: var(--radius-half); height: 100%; padding: var(--pad) var(--padding); width: 100%;}
	ol#vacancies dl {}
	ol#vacancies dt {font-size: 1rem; font-weight: bold; margin: 0; width: 10rem;}
	ol#vacancies dd {margin: 0; width: calc(100% - 10rem);}
	dl#glossary {width: 100%;}
	dl#glossary dt {clear: both; float: left; width: 10rem;}
	dl#glossary dt ~ dt {margin: var(--margin) 0 0 0;}
	dl#glossary dd {clear: right; float: right; width: calc(100% - 11rem);}
	dl#glossary dd ~ dd {margin: var(--margin) 0 0 0;}
	.cols {display: flex; flex-direction: column; gap: var(--gap); height: fit-content; width: 100%;}
	.cols_2 {display: flex; flex-direction: column; gap: var(--gap); position: relative; width: 100%;}
	.cols_2 + .cols_2 {margin-top: var(--gap);}
	.cols_2 .text_left,
	.cols_2 .text_right {display: flex; flex-direction: column; gap: var(--gap); width: 100%;}
	.cols_2 .text_left ul,
	.cols_2 .text_right ul {display: flex; flex-direction: column; gap: var(--gap); list-style: disc; margin: 0 0 0 var(--margin);}
	.cols_2 figure {border-radius: var(--radius); display: flex; min-height: 20rem; position: relative;}
	.cols_2 figure:has(img.of-contain) {align-items: center; background-color: var(--panel); justify-content: center; padding: var(--padding);}
	.cols_2 figure img {height: 100%; object-fit: cover; object-position: center; width: 100%;}
	.cols_2 figure img.of-contain {object-fit: contain; position: relative; width: 100%;}
	.cols_2 figure img.of-contain + figcaption {opacity: 0;}
	.cols_2 figure img.of-cover {object-fit: cover;}
	.cols_2 figure figcaption {background-color: var(--pale); border-radius: var(--radius-quarter); color: var(--dark); inset: auto auto 1rem 1rem; padding: calc(var(--padding) / 2) var(--padding); position: absolute; z-index: 9;}
	.cols_2 span.yt iframe {aspect-ratio: 16/9; border-radius: var(--radius); height: 100%; object-fit: contain; object-position: center; overflow: hidden; width: 100%;}
	ol#policies {display: flex; flex-direction: column; gap: var(--gap);}
	ol#policies > li {display: flex; flex-direction: column; gap: var(--gap);}
	ol#policies ol {display: flex; flex-direction: column; gap: var(--gap); margin: 0 0 0 1rem; padding: var(--padding) 0;}
	ol#policies li li {padding: 0 0 0 1rem;}
	ol {list-style: none;}
	ol.upper-alpha {counter-reset: policies;}
	ol.upper-alpha > li > h2 {margin: 1rem 0 0 0; position: relative; text-transform: capitalize;}
	ol.upper-alpha > li > h2::before {content: counter(policies,upper-alpha) '. '; color: var(--green); counter-increment: policies;}
	ol:not([class],[id]) {counter-reset: point; margin: 0 1rem;}
	ol:not([class],[id]) > li::before {content: counter(policies,upper-alpha) counters(point,'.') '. '; color: var(--green); counter-increment: point;}
	ol.lower-alpha {counter-reset: policy; padding: var(--padding) 0;}
	ol.lower-alpha > li::before {content: counter(policy,lower-alpha) '. '; color: var(--green); counter-increment: policy;}
	ol#policy li > ol.lower-alpha {padding: var(--padding) 0 0 var(--padding);}
	ol#policy ol {display: flex; flex-direction: column; gap: var(--gap); padding: var(--padding) 0;}
	ol.files {list-style: decimal;}
	ol.files span {float: right; line-height: inherit;}
	ol.files a {display: inline-block;}
	ol.links {list-style: decimal;}
	ol.links span {float: right; line-height: inherit;}
	ol.links a {display: inline-block;}
	ol.products {display: flex; flex-direction: column; gap: var(--gap);}
	ol.products > li {background-color: var(--hint); border-radius: var(--radius); display: flex; flex-direction: column; gap: var(--gap); padding: var(--padding);}
	ol.products > li > div {display: flex; flex-direction: column; gap: var(--gap);}
	ol.products > li > div div {display: flex; flex: 1; flex-direction: column; gap: var(--gap);}
	ol.products h2 {font-size: 3rem; line-height: 3rem;}
	ol.products figure {display: flex; flex-direction: column; gap: var(--gap); width: 100%;}
	ol.products img {border-radius: var(--radius-half); width: 100%;}
	ol.products figcaption {display: none;}
	ol.products ul.features {display: flex; flex-wrap: wrap; gap: var(--gap);}
	ol.products ul.features li {align-items: center; background-color: var(--pale); border-radius: var(--radius-half); display: flex; flex-direction: row; padding: var(--pad) var(--padding);}
	ul.gallery {display: grid; gap: var(--gap); grid-template-columns: repeat(auto-fit,minmax(15rem,1fr)); list-style: none;}
	ul.gallery li {background-color: var(--hint); border-radius: var(--radius-half); padding: var(--padding);}
	ul.gallery figure {display: flex; flex-direction: column; gap: var(--gap);}
	ul.gallery img {border-radius: var(--radius-quarter); flex: 1; max-width: 100%; min-height: 10rem;}
	ul.gallery figcaption {}
	ul#products {display: grid; gap: var(--gap); grid-template-columns: repeat(auto-fill,minmax(15rem,1fr)); list-style: none;}
	ul#products img {max-height: 12rem; max-width: 12rem;}
	ol.downloads {display: flex; flex-wrap: wrap; gap: var(--gap);}
	ol.downloads li {border-radius: var(--radius-half);}
	ol.downloads a {align-items: center; background-color: var(--link); border-radius: var(--radius-half); color: var(--dark); display: flex; gap: var(--gap-text); padding: var(--padding); text-decoration: none; transition: background-color 0.3s ease-in-out;}
	ol.downloads a:focus,
	ol.downloads a:hover {background-color: var(--pale); text-decoration: none;}
	ol.downloads svg {max-height: 1rem; max-width: 1rem;}
	ol.downloads span {color: var(--dark);}
	ol.list {display: flex; flex-direction: column; gap: var(--gap);}
	ol.list > li {align-items: center; counter-increment: ordered; min-height: 3rem; padding: 0 0 0 3rem; position: relative;}
	ol.list > li::before {background-color: var(--red); border-radius: 100%; color: var(--pale); content: counter(ordered); font-weight: bold; height: 2rem; left: 0; line-height: 2rem; position: absolute; text-align: center; top: -0.25rem; width: 2rem;}
	ol.list > li strong {color: var(--red); text-transform: capitalize;}
	ol.list > li p {margin: 0.5rem 0;}
	section.dyk ul {display: grid; gap: var(--gap); grid-template-columns: repeat(auto-fill,minmax(18rem,1fr)); list-style: none; width: 100%;}
	section.dyk li {display: flex; height: 100%; width: 100%;}
	section.dyk a {background-color: var(--panel); border-radius: var(--radius); display: block; padding: var(--padding); width: 100%;}
	section.dyk a,
	section.dyk a * {transition: color 0.3s ease-in-out;}
	section.dyk a:focus,
	section.dyk a:hover,
	section.dyk a:focus *,
	section.dyk a:hover * {text-decoration: none !important;}
	section.dyk figure {display: flex; flex-direction: column; gap: var(--gap);}
	section.dyk img {background-color: var(--pale); border-radius: var(--radius-half); display: block; height: 12rem; object-fit: cover; width: 100%;}
	section.dyk figcaption {display: flex; flex-direction: column; gap: var(--gap);}
	section.dyk h3 {color: var(--link);}
	section.dyk a:focus h3,
	section.dyk a:hover h3 {color: var(--dark);}
	section.dyk p {color: var(--dark); line-height: 1.5rem;}
	section.polarity div {display: flex; flex-direction: column; gap: var(--gap);}
	section.polarity ul {display: grid; gap: var(--gap); grid-template-columns: repeat(auto-fill,minmax(18rem,1fr)); list-style: none; width: 100%;}
	section.polarity li {align-items: center; border-radius: var(--radius); color: var(--pale); display: flex; gap: var(--gap); padding: var(--padding);}
	section.polarity li::before {aspect-ratio: 1; display: inline-block; background-color: var(--pale); border-radius: 100%; font-size: 2rem; height: 2rem; line-height: 0.9; text-align: center; width: 2rem;}
	section.polarity ul.polarity-negative li {background-color: var(--red);}
	section.polarity ul.polarity-negative li::before {color: var(--red); content: '\2212 ';}
	section.polarity ul.polarity-positive li {background-color: var(--blue);}
	section.polarity ul.polarity-positive li::before {color: var(--blue); content: '\002B ';}
	ol#category-posts {display: flex; flex-direction: column; gap: var(--gap);}
	ol#category-posts li {background-color: var(--panel); border-radius: var(--radius); padding: var(--padding);}
	ol#category-posts a {display: block;}
	ol#category-posts figure {display: flex; flex-direction: column; gap: var(--gap);}
	ol#category-posts img {border-radius: var(--radius-half); display: block; flex: 1; height: 100%; object-fit: cover; width: 100%;}
	ol#category-posts figcaption {display: flex; flex: 1; flex-direction: column; gap: var(--gap);}
	ol#category-posts time {display: block;}
	body.single-package main article {gap: var(--gap);}
	body.single-package main article header {border-radius: var(--radius); display: flex; gap: var(--gap); outline: var(--dark) solid var(--gap); overflow: hidden; padding: var(--padding);}
	body.single-package main article header div {display: flex; flex-direction: column; gap: var(--gap);}
	body.single-package main article header div p {color: var(--dark);}
	ul#package_components {display: flex; flex-direction: column; gap: var(--gap);}
	ul#package_components > li {border-radius: var(--radius); color: var(--dark); display: grid; flex: 1; grid-template-areas: 'product_quantity' 'product_title' 'product_features' 'product_image'; min-height: fit-content; outline: var(--dark) solid var(--gap); overflow: hidden; position: relative;}
	ul#package_components > li > p {grid-area: product_quantity; padding: var(--padding) var(--padding) 0 var(--padding);}
	ul#package_components > li > h4 {font-weight: bold; grid-area: product_title; padding: 0 var(--padding);}
	ul#package_components > li div {display: flex; flex-direction: column; gap: var(--gap); grid-area: product_features; padding: var(--padding);}
	ul#package_components ul {list-style: disc; padding: 0 var(--padding);}
	ul#package_components figure {grid-area: product_image; overflow: hidden; padding: var(--padding) var(--padding) 0 var(--padding); position: relative;}
	ul#package_components img {height: 100%; max-height: 15rem; width: auto;}
	ul#package_components dl {display: flex; flex-direction: column; gap: var(--gap);}
	ul#package_components dl dt {display: none;}
	ul.bricks {display: flex; flex-direction: column; gap: var(--gap); width: 100%;}
	ul.bricks li {display: flex; flex-direction: column; gap: var(--gap); max-height: 24rem;}
	ul.bricks strong {align-items: center; border-radius: var(--radius); display: flex; font-size: 1.2rem; font-weight: 700; padding: var(--space);}
	ul.bricks figure {border-radius: var(--radius); display: block;  overflow: hidden; position: relative; width: 100%;}
	ul.bricks img {display: block; height: 100%;  object-fit: cover; width: 100%;}
	section#product img {height: auto; max-height: 100%; max-width: 100%; width: auto;}
	dl#data {border: var(--border); border-radius: var(--radius);}
	dl#data dt {outline: var(--outline); padding: var(--padding);}
	dl#data dd {outline: var(--outline); padding: var(--padding);}
	aside {background-color: var(--panel); border-radius: var(--radius); display: flex; flex-direction: column; gap: calc(var(--gap) * 2); padding: var(--padding); width: 100%;}
	aside > div {display: flex; flex-direction: column; gap: var(--gap);}
	aside section {display: flex; flex-direction: column; gap: var(--gap);}
	aside section#cta {padding: 0;}
	aside section#cta a {align-items: center; background-color: var(--colour-1); border-radius: var(--radius); color: var(--pale); display: flex; padding: var(--padding);}
	aside section#cta a:focus,
	aside section#cta a:hover {background-color: var(--colour-2);}
	aside section#cta ul#actions {display: flex; flex-direction: column; gap: var(--gap);}
	aside section#cta ul#actions li {align-items: center; background-color: var(--pale); border-radius: var(--radius); display: flex; flex: 1; gap: var(--gap);}
	aside section#cta ul#actions a {align-items: center; background-color: var(--link); border-radius: var(--radius-half); color: var(--dark); display: flex; gap: var(--gap); height: 100%; transition: background-color 0.3s ease-in-out; width: 100%;}
	aside section#cta ul#actions a:focus,
	aside section#cta ul#actions a:hover {background-color: var(--pale); color: var(--dark);}
	aside section#cta ul#actions h4 {display: flex; flex-direction: column;}
	aside section#cta ul#actions h4 span {}
	aside section#cta ul#actions svg {height: 3rem; min-height: 3rem; min-width: 3rem; width: 3rem;}
	aside section#cta ul#actions strong {font-weight: 600;}
	aside ul#sector_cta {background-color: var(--colour-5); background-image: linear-gradient(var(--colour-1),var(--colour-2)); border-radius: var(--radius); display: flex; flex-wrap: wrap; gap: 0; padding: var(--padding);}
	aside ul#sector_cta li {width: 50%;}
	aside ul#sector_cta a {align-items: center; border-radius: var(--radius-half); color: var(--pale); display: flex; flex-direction: row; height: 3rem; justify-content: flex-start; padding: var(--padding); text-align: left;}
	aside ul#sector_cta a:focus,
	aside ul#sector_cta a:hover {background-color: rgba(255,255,255,0.15);}
	aside ul#sector_cta svg {margin: 0 calc(var(--margin) / 2) 0 0; max-height: 1rem; max-width: 1rem;}
	aside ul#sector_cta span {line-height: 1rem;}
	aside form {display: flex; flex-direction: column; gap: var(--gap); grid-template-columns: repeat(auto-fit,minmax(24rem,1fr)); list-style: none;}
	aside form fieldset {display: flex; flex-direction: column; gap: var(--gap); padding: var(--padding) 0 0 0; width: 100%;}
	aside form fieldset legend {top: 0; position: relative;}
	aside form fieldset label {display: flex; flex-direction: column-reverse; gap: 0;}
	aside form > .col_2 {display: flex; flex-direction: column; gap: var(--gap);}
	aside form label {flex-direction: column-reverse;}
	aside form label input[type='checkbox'] + span,
	aside form label input[type='radio'] + span {line-height: 1rem; width: 100%;}
	aside form label a {color: var(--link);}
	aside form label:has(a) span.wpcf7-list-item-label {display: inline !important; gap: unset;}
	aside form > label {display: flex; flex-direction: column-reverse;}
	aside form > p {}
	aside form span {min-width: 5rem;}
	aside form span.wpcf7-checkbox {display: flex; flex-direction: row; flex-wrap: wrap;}
	aside form span.wpcf7-checkbox span { width: calc((100% - var(--gap)) / 2);}
	aside form > p {display: flex; flex-direction: column;}
	aside form > p,
	aside form > button {grid-column: 1/-1;}
	aside form > .col_2 {flex-direction: column;}
	aside ul#aside_prompts {background-color: var(--over); border-radius: var(--radius-half); display: grid; gap: 1px;  grid-template-columns: repeat(auto-fit,minmax(18rem,1fr)); overflow: hidden;}
	aside ul#aside_prompts li {background-color: var(--dark);}
	aside ul#aside_prompts a {background-color: var(--dark); color: var(--link); display: flex; height: 100%; padding: var(--gap); transition: background-color 0.3s ease-in-out; width: 100%;}
	aside ul#aside_prompts a:focus,
	aside ul#aside_prompts a:hover {background-color: rgba(255,255,255,0.15);}
	aside ul#aside_prompts figure {display: flex; flex-direction: column; gap: var(--gap);}
	aside ul#aside_prompts img {background-color: var(--pane); border-radius: var(--radius-quarter); display: block; height: 12rem; object-fit: cover; width: 100%;}
	aside ul#aside_prompts figcaption {color: var(--pale); display: flex; flex-direction: column;}
	aside ul#aside_prompts strong {color: var(--link);}
	aside ul#aside_prompts small {font-size: smaller; line-height: 1rem;}
	aside ul#engage {display: flex; flex-direction: column; gap: var(--gap);}
	aside ul#engage li {width: 100%;}
	aside ul#engage a {align-items: center; border-radius: var(--radius-half); color: var(--dark); display: flex; gap: var(--gap); height: 100%; padding: var(--padding); transition: background-color 0.3s ease-in-out; width: 100%;}
	aside ul#engage a:focus,
	aside ul#engage a:hover {background-color: var(--pale) !important;}
	aside ul#engage svg {max-height: 3rem; max-width: 3rem;}
	aside ul#engage h4 {display: flex; flex-direction: column;}
	nav#nav_secondary {background-image: linear-gradient(var(--colour-1),var(--colour-2)); border-top: var(--border); display: flex; flex-direction: column; gap: 2rem; justify-content: space-between; padding: var(--padding);}
	nav#nav_secondary section {background-color: transparent; display: flex; flex-direction: column; padding: 0; width: 100%;}
	nav#nav_secondary h3 {color: var(--green); font-weight: 700;}
	nav#nav_secondary ul {display: flex; flex-direction: column; gap: var(--gap);}
	nav#nav_secondary li {width: 100%;}
	nav#nav_secondary a {align-items: center; background-color: var(--link-bg); color: var(--pale); display: flex; gap: calc(var(--gap) / 2);}
	nav#nav_secondary a:focus,
	nav#nav_secondary a:hover {text-decoration: underline;}
	nav#nav_secondary li.current-item-menu a,
	nav#nav_secondary li.current_page_item a {text-decoration: underline;}
	nav#nav_secondary img,
	nav#nav_secondary svg {max-height: 1rem; max-width: 1rem;}
	nav#nav_secondary ul:not(#share) svg path {fill: var(--link); filter: brightness(1);}
	footer {background-color: var(--colour-1); border-top: var(--border); color: var(--colour-3); display: flex; flex-direction: column; gap: calc(var(--gap) * 2); justify-content: space-between;  padding: var(--padding);}
	footer #footer {display: flex; flex-direction: column; gap: var(--gap);}
	footer a {background-color: var(--link-bg); color: var(--pale); display: flex; gap: calc(var(--gap) / 2);}
	footer a:focus,
	footer a:hover {text-decoration: underline;}
	footer address {display: flex;}
	footer br {display: block;}
	footer small {color: var(--colour-4); line-height: 1rem;}
	footer small a {display: inline-block; line-height: inherit;}
	form.wpcf7-form span.wpcf7-list-item {margin: 0;}
	form.wpcf7-form span[data-name='privacy'] {margin: 0;}
	form.wpcf7-form span.wpcf7-acceptance span.wpcf7-list-item {width: 100%;}
	form.wpcf7-form span.wpcf7-acceptance label {border-radius: var(--radius-half); display: flex; gap: var(--gap-text); width: 100%;}
	form.wpcf7-form span.wpcf7-acceptance label:has(input[name='privacy']) {flex-direction: row;}
	form.wpcf7-form input.wpcf7-submit {background-color: var(--link); color: var(--pale); transition: background-color 0.3s ease-in-out, filter 0.3s ease-in-out, opacity 0.3s ease-in-out;}
	form.wpcf7-form input.wpcf7-submit:not(:disabled):focus,
	form.wpcf7-form input.wpcf7-submit:not(:disabled):hover {background-color: var(--over);}
	form.wpcf7-form input.wpcf7-submit:disabled {filter: grayscale(1); opacity: 0.3;}
	form.wpcf7-form span.wpcf7-spinner {display: none;}
	form.wpcf7-form label {justify-content: flex-start;}
	form.wpcf7-form label span.wpcf7-form-control-wrap {display: flex; flex-direction: column; width: 100%;}
	form.wpcf7-form .wpcf7-response-output {align-items: center; border: 0 none; border-radius: var(--radius-half); display: flex; line-height: 1rem; margin: 0; min-height: 3rem; padding: var(--padding);}
	form.wpcf7-form.sent 	.wpcf7-response-output {background-color: green; border-color: green; color: var(--pale);}
	form.wpcf7-form.invalid .wpcf7-response-output {background-color: var(--invalid); border-color: var(--border-invalid); color: var(--pale);}
	form.wpcf7-form.spam 	.wpcf7-response-output {background-color: var(--invalid); border-color: var(--border-invalid); color: var(--pale);}
	span.wpcf7-not-valid-tip {align-self: flex-start; text-align: left;}
	span.wpcf7-radio,
	span.wpcf7-checkbox {display: grid; grid-template-columns: repeat(auto-fill,minmax(15rem,1fr)); list-style: none;}
	span.wpcf7-checkbox label {gap: var(--gap-text);}
	span.wpcf7-list-item-label a {text-decoration: underline;}
	#cmplz-document {display: flex; flex-direction: column; font-size: initial; gap: var(--gap);}
	#cmplz-document,
	.editor-styles-wrapper .cmplz-unlinked-mode {max-width: 100% !important;}
	#cmplz-document h2,
	.editor-styles-wrapper .cmplz-unlinked-mode h2,
	#cmplz-document h3,
	.editor-styles-wrapper .cmplz-unlinked-mode h3 {margin: 0; padding: 0; text-transform: capitalize;}
	#cmplz-document p,
	.editor-styles-wrapper .cmplz-unlinked-mode p,
	#cmplz-document li,
	.editor-styles-wrapper .cmplz-unlinked-mode li,
	#cmplz-document td,
	.editor-styles-wrapper .cmplz-unlinked-mode td {font-size: 1rem;}
	#cmplz-cookies-overview .cmplz-dropdown p,
	#cmplz-document .cmplz-dropdown p,
	.editor-styles-wrapper .cmplz-unlinked-mode .cmplz-dropdown p,
	#cmplz-cookies-overview .cmplz-dropdown h4,
	#cmplz-document .cmplz-dropdown h4,
	.editor-styles-wrapper .cmplz-unlinked-mode .cmplz-dropdown h4,
	#cmplz-cookies-overview .cmplz-dropdown ul,
	#cmplz-document .cmplz-dropdown ul,
	.editor-styles-wrapper .cmplz-unlinked-mode .cmplz-dropdown ul {padding: 0;}
	span.cmplz-contact-address br {display: block;}
	#cmplz-cookies-overview p {padding: 0;}
	p:has([class^='cmplz-contact-']) {display: flex; flex-direction: column;}
	#cmplz-document .cmplz-subtitle,
	.editor-styles-wrapper .cmplz-unlinked-mode .cmplz-subtitle {margin: 0;}
	#cmplz-document h5,
	.editor-styles-wrapper .cmplz-unlinked-mode h5,
	#cmplz-cookies-overview .cmplz-dropdown p,
	#cmplz-document .cmplz-dropdown p,
	.editor-styles-wrapper .cmplz-unlinked-mode .cmplz-dropdown p,
	#cmplz-cookies-overview .cmplz-dropdown a,
	#cmplz-document .cmplz-dropdown a,
	.editor-styles-wrapper .cmplz-unlinked-mode .cmplz-dropdown a {font-size: 1rem !important; line-height: inherit;}
	#cmplz-cookies-overview .cmplz-dropdown h4,
	#cmplz-document .cmplz-dropdown h4,
	.editor-styles-wrapper .cmplz-unlinked-mode .cmplz-dropdown h4,
	#cmplz-cookies-overview .cmplz-dropdown h5,
	#cmplz-document .cmplz-dropdown h5,
	.editor-styles-wrapper .cmplz-unlinked-mode .cmplz-dropdown h5 {line-height: 1rem; padding: 0 !important;}
	#cmplz-cookies-overview .cmplz-dropdown summary,
	#cmplz-document .cmplz-dropdown summary,
	.editor-styles-wrapper .cmplz-unlinked-mode .cmplz-dropdown summary {margin: 0 !important; padding: var(--pad) var(--padding) !important;}
	#cmplz-cookies-overview {display: flex; flex-direction: column; gap: var(--gap);}
	#cmplz-cookies-overview .purpose,
	#cmplz-cookies-overview .cmplz-service-description,
	#cmplz-cookies-overview .cmplz-sharing-data,
	#cmplz-cookies-overview .name,
	#cmplz-cookies-overview .name-header,
	#cmplz-cookies-overview .retention-header,
	#cmplz-cookies-overview .retention,
	#cmplz-cookies-overview .function-header,
	#cmplz-cookies-overview .function {line-height: 1rem; padding: var(--padding) !important;}
	#cmplz-cookiebanner-container {z-index: 99;}
	.cmplz-cookiebanner .cmplz-message {line-height: 1rem; margin: 0 0 var(--margin) 0 !important;}
	.cmplz-cookiebanner .cmplz-categories {display: flex; flex-direction: column; gap: var(--gap) !important;}
	.cmplz-cookiebanner .cmplz-categories details.cmplz-category {border-radius: var(--radius-half); margin-bottom: 0; overflow: hidden;}
	.cmplz-cookiebanner .cmplz-buttons button {background-color: var(--link) !important; border: 0 none !important; color: var(--pale); transition: background-color 0.3s ease-in-out;}
	.cmplz-cookiebanner .cmplz-buttons button:focus,
	.cmplz-cookiebanner .cmplz-buttons button:hover {background-color: var(--over) !important;}
	span.cmplz-category-header {gap: var(--gap); padding: 0;}
	span.cmplz-category-header > span {color: inherit !important;}
	span.cmplz-category-header > span.cmplz-icon {color: var(--pale); height: 1rem; transform-origin: center; width: 1rem;}
	span.cmplz-category-header > span.cmplz-icon svg {min-height: 1rem; min-width: 1rem;}
	span.cmplz-category-header > span.cmplz-icon svg path {fill: var(--pale);}
	.cmplz-cookiebanner .cmplz-links a.cmplz-link {color: var(--link) !important; text-decoration: none;}
	.cmplz-cookiebanner .cmplz-links a.cmplz-link:focus,
	.cmplz-cookiebanner .cmplz-links a.cmplz-link:hover {background-color: transparent; color: var(--over); text-decoration: underline;}
	.cmplz-cookiebanner .cmplz-categories .cmplz-category summary {background-color: var(--link); color: var(--pale); padding: 0 0 0 var(--pad); transition: background-color 0.3s ease-in-out;}
	.cmplz-cookiebanner .cmplz-categories .cmplz-category[open] summary,
	.cmplz-cookiebanner .cmplz-categories .cmplz-category summary:focus,
	.cmplz-cookiebanner .cmplz-categories .cmplz-category summary:hover {background-color: var(--over);}
	.cmplz-cookiebanner .cmplz-categories .cmplz-category .cmplz-description {padding: var(--padding) !important;}
	.cmplz-cookiebanner .cmplz-categories .cmplz-category .cmplz-description span,
	.cmplz-cookiebanner .cmplz-categories .cmplz-category .cmplz-description span.cmplz-description-functional,
	.cmplz-cookiebanner .cmplz-categories .cmplz-category .cmplz-description span.cmplz-description-statistics-anonymous,
	.cmplz-cookiebanner .cmplz-categories .cmplz-category .cmplz-description span.cmplz-description-marketing {font-size: small; line-height: 1rem !important;}
	#cmplz-manage-consent-container.cmplz-manage-consent-container .cmplz-categories {display: flex; flex-direction: column; gap: var(--gap); margin: var(--margin) 0 0 0;}
	#cmplz-manage-consent-container.cmplz-manage-consent-container .cmplz-categories details.cmplz-category {border-radius: var(--radius-half); margin: 0; overflow: hidden;}
	#cmplz-manage-consent-container.cmplz-manage-consent-container .cmplz-categories details.cmplz-category:not(:last-child) {margin: 0;}
	#cmplz-manage-consent-container.cmplz-manage-consent-container .cmplz-categories details summary {background-color: var(--link); background-image: url('svg/components/expand-more.svg'); background-position: right 0.75rem top 0.75rem; background-repeat: no-repeat; background-size: 1.5rem; color: var(--pale);}
	#cmplz-manage-consent-container.cmplz-manage-consent-container .cmplz-categories details[open] summary {background-color: var(--over); background-image: url('svg/components/expand-less.svg');}
	#cmplz-manage-consent-container.cmplz-manage-consent-container .cmplz-categories details summary h3 {font-size: 1rem !important;}
	#cmplz-manage-consent-container.cmplz-manage-consent-container .cmplz-categories details summary span.cmplz-category-header {background-color: transparent !important; padding: var(--pad) var(--padding) !important;}
	#cmplz-manage-consent-container.cmplz-manage-consent-container .cmplz-categories details summary svg {visibility: hidden;}
	#cmplz-manage-consent-container.cmplz-manage-consent-container .cmplz-categories .cmplz-category .cmplz-category-header .cmplz-banner-checkbox {display: flex; gap: var(--gap-text);}
	#cmplz-manage-consent-container.cmplz-manage-consent-container .cmplz-categories .cmplz-category .cmplz-description {padding: var(--pad) var(--padding);}
	#cmplz-document #cmplz-cookies-overview details {border-radius: var(--radius-half); overflow: hidden;}
	#cmplz-document #cmplz-cookies-overview details summary {background-color: var(--link); background-image: url('svg/components/expand-more.svg'); background-position: right 0.75rem top 0.75rem; background-repeat: no-repeat; background-size: 1.5rem; color: var(--pale);}
	#cmplz-document #cmplz-cookies-overview details[open] summary {background-color: var(--over); background-image: url('svg/components/expand-less.svg');}
	#cmplz-document #cmplz-cookies-overview details summary > div {grid-template-columns: 1fr 1fr 1fr 3rem; padding: 0 3rem 0 0;}
	#cmplz-document #cmplz-cookies-overview details summary > div input {accent-color: var(--pale); display: block !important; visibility: visible;}
	#cmplz-document #cmplz-cookies-overview details summary > div::after {display: none;}
	#cmplz-document #cmplz-cookies-overview details summary > div h3 {padding: 0;}
	#cmplz-document #cmplz-cookies-overview details summary > div p {text-align: left;}
	.cmplz-cookiebanner .cmplz-buttons button.cmplz-btn {color: var(--dark); font-weight: 700;}
	.cmplz-cookiebanner .cmplz-buttons button.cmplz-btn:focus,
	.cmplz-cookiebanner .cmplz-buttons button.cmplz-btn:hover {background-color: var(--over);}
	iframe {border: 0 none; flex: 1; height: 100%; width: 100%;}
	div:has(> table),
	.scroll {display: block; height: 100%; overflow-x: auto; overflow-y: visible; position: relative;}
	table {background-color: transparent; border-radius: var(--radius); border-radius: var(--radius-half); color: var(--dark); overflow: hidden; width: 100%;}
	table caption {padding: 1rem;}
	table tr th:first-child {width: 100%;}
	table th,
	table td {border-radius: var(--radius-half); line-height: 1rem; min-width: 10rem; text-align: left; vertical-align: top;}
	table a {display: block; line-height: inherit; padding: 0 !important;}
	table a:has(sup) {display: inline;}
	table thead {}
	table thead tr {}
	table thead tr th {background-color: var(--th); font-weight: 900; padding: var(--padding); white-space: nowrap;}
	table thead tr th[colspan] {text-align: center;}
	table thead tr td {background-color: var(--td);}
	table tbody {}
	table tbody tr {}
	table tbody tr th {background-color: var(--th); font-weight: 700; padding: var(--padding);}
	table tbody tr:last-of-type th,
	table tbody tr:last-of-type td {padding-bottom: var(--padding);}
	table tbody tr td {background-color: var(--td); padding: var(--padding); white-space: nowrap;}
	table tbody tr td ol {list-style-position: inside;}
	table tbody tr td li {display: flex; gap: var(--gap); justify-content: space-between; line-height: 1rem;}
	table tfoot {}
	table tfoot tr {}
	table tfoot tr th {}
	table tfoot tr td {}
	.header {background-color: gainsboro;}
	table br {display: block;}
	th.admin 	{background-color: rgba(0,0,0,0.1);}
	th.property {background-color: rgba(0,0,0,0.2);}
	th.customer {background-color: rgba(0,0,0,0.3);}
	tr.active 	{background-color: bisque;}
	tr.complete {background-color: lightgreen;}
	tr.inactive {background-color: mistyrose;}
	tr.pending 	{background-color: whitesmoke;}
	table img {max-height: 3rem; max-width: 4rem;}
	table.save tr th + th,
	table.save tr td + td {text-align: right;}
	form#acf-form select {background-color: dimgrey; border: var(--border); border-radius: var(---radius); color: var(--pale);}
	form#acf-form select.lead 		{background-color: orange;}
	form#acf-form select.sale		{background-color: hotpink;}
	form#acf-form select.finance 	{background-color: green;}
	form#acf-form select.survey		{background-color: purple;}
	form#acf-form select.install 	{background-color: blue;}
	form#acf-form select.revisit 	{background-color: teal;}
	form#acf-form select.avoid 		{background-color: crimson;}
	form#acf-form select.pending 	{background-color: dimgrey;}
	form#acf-form select.active		{background-color: orange;}
	form#acf-form select.inactive 	{background-color: red;}
	form#acf-form select.complete 	{background-color: green;}
	img.tl {object-position: top left;}
	img.tc {object-position: top center;}
	img.tr {object-position: top right;}
	img.ml {object-position: center left;}
	img.mc {object-position: center center;}
	img.mr {object-position: center right;}
	img.bl {object-position: bottom left;}
	img.bc {object-position: bottom center;}
	img.br {object-position: bottom right;}
	#cmplz-cookies-overview .cmplz-dropdown .cookies-per-purpose,
	#cmplz-document .cmplz-dropdown .cookies-per-purpose,
	.editor-styles-wrapper .cmplz-unlinked-mode .cmplz-dropdown .cookies-per-purpose {background-color: transparent !important; margin: 0 var(--margin) var(--margin) var(--margin);}
	.cookies-per-purpose * {background-color: transparent !important;}
	form#form_monday fieldset {display: grid; gap: var(--gap); grid-template-columns: repeat(auto-fill,minmax(24rem,1fr)); list-style: none;}
	output {background-color: mistyrose; border-radius: var(--radius-half); filter: grayscale(1); outline: crimson solid thin; padding: var(--pad) var(--padding);white-space: pre;}
	.ptr--ptr {background-color: var(--pale);}
	.cookies-per-purpose  > div {outline: var(--pale) solid thin;}
	.name-header ~ .name-header,
	.retention-header ~ .retention-header,
	.function-header ~ .function-header {display: none;}
	a[target='_blank']::after {}
	@media (min-width: 20rem){
		nav#nav_secondary {flex-wrap: wrap;}
	}
	@media (min-width: 30rem){
		nav#nav_primary ul li#call_to_action span {display: flex;}
	}
	@media (min-width: 40rem){
		:root {--space: 2rem;}
		html {scroll-padding-top: calc(7rem - 1px);}
		nav#nav_primary {padding: 0 var(--padding);}
		nav#nav_primary a {line-height: 2rem; height: 3rem;}
		.cols {display: grid; gap: var(--gap) !important; grid-template-columns: repeat(auto-fit,minmax(18rem,1fr));}
		.cols legend {grid-column: 1/-1;}
		nav#nav_secondary {flex-direction: row; padding: var(--space);}
		nav#nav_secondary section {width: calc((100% - 2rem) / 2);}
		#banner strong,
		#banners strong {font-size: 2rem; line-height: 2.5rem;}
		header figcaption small {display: block;}
		section.definitions dl {display: grid; gap: var(--gap); grid-template-columns: 1fr 2fr;}
		section.definitions dt,
		section.definitions dd {margin: 0 !important;}
		section.polarity div {flex-direction: row;}
		section.prompts ol {flex-direction: row; flex-wrap: wrap;}
		section.prompts ol li {grid-template-areas: 'icon' 'title' 'summary'; max-width: calc((100% - var(--gap)) / 2); width: 100%;}
		ol.products > li > div {flex-direction: row;}
		ol.products figure {max-width: calc((100% - var(--gap)) / 2);}
		ul#package_components > li {grid-template-areas: 'product_quantity product_quantity' 'product_title product_title' 'product_features product_image';}
		ul.bricks li {flex-direction: row;}
		ul.bricks li:nth-child(even) {flex-direction: row-reverse;}
		ul.bricks strong {max-width: calc((100% - var(--gap)) / 3);}
		ul.bricks figure {max-width: calc(((100% - var(--gap)) / 3) * 2);}
		ol#category-posts figure {flex-direction: row;}
		ol#category-posts img {height: 100%; max-height: auto; max-width: 50%; width: 100%;}
		footer {flex-direction: row; padding: var(--padding) var(--space);}
	}
	@media (min-width: 48rem){
		header span {max-width: 50vw;}
		ul#panes {flex-direction: row;}
		article .cols_2 {flex-direction: row;}
		article .cols_2 > *:not(figure) {justify-content: center;}
		article .cols_2 > * {flex: 1; position: relative;}
		article .cols_2 > *:first-child {left: 0; right: auto;}
		article .cols_2 > *:last-child {left: auto; right: 0 !important;}
		article .cols_2 figure {border-radius: var(--radius-half); overflow: hidden; width: 100%;}
		article .cols_2 figure img {inset: 0; position: absolute;}
		aside form > p {display: flex; flex-direction: row; gap: var(--gap);}
		section.cta a {flex-direction: row;}
		ul.features li.row figure {inset: var(--padding) calc((100% - (var(--gap) * 3)) / 2) var(--padding) var(--padding); max-width: calc((100% - (var(--gap) * 3)) / 2); overflow: hidden; position: absolute;}


		ul.features li.row figure + div {inset: 0 0 var(--padding) calc(((100% - var(--gap)) / 2) + var(--gap)); max-width: calc((100% - var(--gap)) / 2); position: relative;}


		ul.features.alternate li:nth-child(even) figure {inset: var(--padding) 0 var(--padding) calc(((100% - var(--gap)) / 2) + var(--gap));}
		ul.features.alternate li:nth-child(even) figure + div {inset: 0 calc(((100% - (var(--gap))) / 2) + var(--gap)) 0 0;}
		section.prompts ol li {grid-template-areas: 'icon title' 'summary summary';}
		ul#package_components {flex-direction: row;}
		ul#package_components > li {grid-template-areas: 'product_quantity' 'product_title' 'product_features' 'product_image';}
	}
	@media (min-width: 54rem){
		article header#package {flex-direction: row;}
		body.single-package main article header figure {min-width: 50%;}
		body.home aside section#cta ul#actions {flex-direction: row;}
		body.home aside ul#engage {flex-direction: row;}
		footer #footer {flex-direction: row;}
	}
	@media (min-width: 66rem){
		body,
		body:has(input#toggle:checked) {overflow-y: auto;}
		nav#nav_primary {height: 5rem; grid-template-areas: 'logo . left menu'; grid-template-columns: auto auto auto auto; outline: transparent solid thin; transition: outline 1s ease-in-out;}
		nav#nav_primary.shadow {outline: var(--outline);}
		nav#nav_primary a:not(#logo):focus,
		nav#nav_primary a:not(#logo):hover {background-color: rgba(255,255,255,0.15); border-radius: var(--radius);}
		nav#nav_primary ul {display: flex; justify-content: space-between; padding: var(--padding);}
		nav#nav_primary ul.left {gap: var(--gap);}
		nav#nav_primary ul.right {display: none;}
		nav#nav_primary ul a {align-items: center; line-height: 2rem; padding: var(--padding) 0; position: relative;}
		nav#nav_primary form {border-radius: var(--radius); width: 8rem;}
		nav#nav_primary form:focus-within {width: 100%;}
		nav#nav_primary form input[type='search'] {min-width: 5rem;}
		nav#nav_primary form input[type='search']:focus {max-width: 100%;}
		nav#nav_primary form button {border-radius: 0 var(--radius) var(--radius) 0;}
		nav#nav_primary a:not(#logo) svg,
		nav#nav_primary form button svg {height: 1.5rem; width: 1.5rem;}
		nav#nav_primary ul span,
		nav#nav_primary ol span {line-height: 2rem;}
		nav#nav_primary > a#logo {width: 10rem; transition: width 0.3s ease-in-out 0s;}
		nav#nav_primary > a#logo svg #gem {opacity: 1; transition: opacity 0.3s ease-in-out 0.3s;}
		nav#nav_primary .menu-wrap {padding: var(--padding);}
		input#toggle:checked ~ nav#nav_primary > .menu-wrap,
		nav#nav_primary .menu-wrap {background-color: transparent; background-image: none; display: flex; flex-direction: row; height: 5rem; inset: 0; justify-content: flex-end; outline: none; overflow: visible; position: relative;}
		nav#nav_primary .menu-wrap ul.menu {display: flex; flex-direction: row; gap: var(--gap); padding: 0; position: relative;}
		input#toggle:checked ~ 	nav#nav_primary > .menu-wrap ul.sub-menu,
		nav#nav_primary .menu-wrap ul.menu ul.sub-menu {border-radius: 0 0 var(--radius) var(--radius); border-top: transparent solid 1rem; display: flex; flex-direction: column; height: 0; left: -1rem; margin: 0; min-width: 100%; opacity: 0; overflow: hidden; padding: 0 var(--padding); position: absolute; top: 3rem; transition: opacity 0.3s ease-in-out, padding 0.3s ease-in-out;}
		nav#nav_primary .menu-wrap ul li {width: 100%;}
		nav#nav_primary .menu-wrap li {display: flex; flex-direction: column;}
		nav#nav_primary .menu-wrap span {line-height: 1rem;}
		input#toggle:checked ~ nav#nav_primary > .menu-wrap li:hover > ul.sub-menu,
		nav#nav_primary .menu-wrap li:focus-within > ul,
		nav#nav_primary .menu-wrap li:focus-within > ul.sub-menu,
		nav#nav_primary .menu-wrap li:focus > ul.sub-menu,
		nav#nav_primary .menu-wrap li:hover > ul.sub-menu,
		nav#nav_primary .menu-wrap li a:focus + ul.sub-menu {border-radius: 0 0 var(--radius) var(--radius); display: grid; grid-auto-flow: row; height: fit-content; opacity: 1; overflow-x: hidden; overflow-y: auto; padding: 0 var(--padding) var(--padding) var(--padding);}
		nav#nav_primary .menu-wrap ul ul a {border-radius: var(--radius-half) !important; padding: var(--padding);}
		nav#nav_primary ul.sub-menu {max-height: calc(100dvh - 5rem);}
		body[style] header {background-color: transparent;}
		body[style] header figure {background-image: none !important;}
		#banner strong,
		#banners strong {font-size: 2.5rem; line-height: 3rem;}
		dl#breadcrumb {flex-direction: row;}
		dl#breadcrumb dd ~ dd {flex-direction: row;}
		dl#breadcrumb dd ~ dd::before {content: '\2192 '; margin: 0 var(--margin) 0 0;}
		ul#sector_hints {display: grid; grid-auto-flow: dense; grid-template-columns: repeat(auto-fit,minmax(25%,1fr));}
		ul#sector_hints a figcaption {grid-template-areas: 'icon title' 'summary summary';}
		ul#sector_hints a figcaption svg {max-height: 2rem; max-width: 2rem;}
		ul#sector_hints a figcaption strong { font-size: 1.5rem;}
		ul#sector_hints a figcaption small {display: block; font-size: 1rem; line-height: 1rem;}
		ul#package_components > li {grid-template-areas: 'product_quantity product_quantity' 'product_title product_title' 'product_features product_image';}
		article {gap: var(--space);}
		section.prompts ol figcaption p {display: block;}
		nav#nav_secondary {flex-wrap: nowrap;}
		nav#nav_secondary section {width: calc(100% / 4);}
		footer {flex-direction: row; flex-wrap: nowrap; justify-content: space-between;}
	}
	@media (min-width: 75rem){
		nav#nav_primary > a > span {display: block;}
		body:not(.home) main {flex-direction: row;}
		body:not(.home) article {max-width: calc(100% - var(--space) - var(--limit-aside));}
		body:not(.home) aside {max-width: var(--limit-aside); position: relative;}
		aside > div {display: flex; flex-direction: column; gap: var(--gap); position: sticky; top: 6rem;}
		aside ul#aside_prompts figure {flex-direction: row;}
		aside ul#aside_prompts img {max-height: 4rem; max-width: 6rem; object-fit: cover;}
	}
	@media (min-width: 90rem){
		nav#nav_primary ul a {padding: var(--padding);}
		nav#nav_primary ul.cta span {display: flex;}
		section.prompts ol li {grid-template-areas: 'icon title' 'summary summary';}
	}
	@media (min-width: 96rem){
		section.prompts ol li {grid-template-areas: 'icon' 'title' 'summary'; width: calc((100% - (var(--gap)) * 3) / 4);}
		ul.features div {flex: 1;}
		ul.features > li:has(img),
		ul.features > li:has(> svg) {flex-direction: row;}
	}

}


@media print {
	:root {
		font-size: 		10pt;
		--cta-fill:		honeydew;
		--gap: 			5mm;
		--margin: 		5mm;
		--padding: 		5mm;
		--border: 		silver solid thin;
		--aspect-ratio: 3/2;
	}
	* {box-sizing: border-box; font: 1rem/1.5rem 'Inter Tight', sans-serif; font-weight: 300; margin: 0; padding: 0; text-wrap: pretty;}
	html {}
	body {color: var(--dark); display: flex; flex-direction: column; gap: var(--gap);}
	a {color: var(--dark); font-weight: bold; text-decoration: none;}
	/* a[href^='https://']::after {color: var(--green); content: '[ 'attr(href)' ]'; font-size: small; margin: 0 0 0 2mm;} */
	a span {color: inherit; font-weight: inherit;}
	hr {display: none;}
	h1 {font-size: 2.0rem; line-height: 2rem;}
	h2 {font-size: 1.7rem; line-height: 2rem;}
	h3 {font-size: 1.5rem; line-height: 2rem;}
	h4 {font-size: 1.3rem; line-height: 1.5rem;}
	h5 {font-size: 1.1rem; line-height: 1.5rem;}
	h6 {font-size: 1.0rem; line-height: 1.5rem;}
	dt,
	h1,
	h2,
	h3,
	h4,
	h5,
	h6,
	legend,
	strong,
	summary {font-weight: bold;}
	small {font-size: small;}
	figure {background-color: whitesmoke; border-radius: var(--radius); padding: var(--padding);}
	figure img {border-radius: var(--radius-half);}
	input#toggle,
	p#skip {display: none;}
	img {display: block; height: auto; object-fit: cover; object-position: center; width: 100%;}
	svg {display: block; height: auto; max-height: 24rem; max-width: 24rem; object-fit: contain;}
	nav#nav_primary {align-items: center; display: flex; gap: var(--gap); justify-content: space-between;}
	nav#nav_primary > a#logo {align-items: center; color: var(--dark); display: flex; gap: var(--gap);}
	nav#nav_primary > a#logo svg {color: var(--dark) !important; max-width: 12rem;}
	nav#nav_primary label {display: none;}
	nav#nav_primary ul {display: flex; gap: var(--gap); list-style-type: none; padding: 0;}
	nav#nav_primary ul.right {display: none;}
	nav#nav_primary li {display: flex; gap: var(--gap);}
	nav#nav_primary li.call_to_action {display: none;}
	nav#nav_primary ul {height: 100%;}
	nav#nav_primary ul a {align-items: center; display: flex; gap: 1ch;}
	nav#nav_primary ul svg {max-height: 2rem; max-width: 2rem;}
	nav#nav_primary ul span {white-space: nowrap;}
	.menu-wrap {display: none;}
	header {background-color: transparent !important; display: flex; flex-direction: column; gap: var(--gap);}
	header #banners ol {display: flex; flex-wrap: wrap; gap: var(--gap); list-style: none; max-width: 100vw; transform: unset !important; width: 100vw;}
	header #banners ol li {max-width: calc((100% - var(--gap)) / 2); width: 100%;}
	header #banners ol li.glide__slide--clone {display: none !important;}
	header #banners ol li ~ li {border-top: var(--border);}
	header #banners ol figure {display: flex; flex-direction: column; gap: var(--gap); padding: 0; width: 100%;}
	header #banners ol figcaption a {background-color: transparent !important;}
	header #banners ol img {aspect-ratio: 3/2; display: block; height: auto; object-fit: cover; width: 100%;}
	main {background-color: transparent !important;}
	article {display: flex; flex-direction: column; gap: var(--gap); padding: var(--padding) 0;}
	section {display: flex; flex-direction: column; gap: var(--gap);}
	ul#logos {align-items: center; display: flex; flex-wrap: wrap; gap: var(--gap); list-style: none;}
	ul#logos a {align-items: center; display: flex; gap: var(--gap);}
	ul#logos img,
	ul#logos svg {max-width: 6rem; max-width: 6rem;}
	ul.features {display: flex; flex-direction: column; gap: var(--gap); list-style: none;}
	ul.features > li {display: flex; flex: 1; flex-direction: row; gap: var(--gap); max-width: 100%; padding: 0;}
	ul.features > li > div {display: flex; flex-direction: column; gap: var(--gap);}
	ul.features a {display: flex; gap: var(--gap); width: 100%;}
	ul.features a > * {max-width: calc((100% - var(--gap)) /2);}
	ul.features a div {display: flex; flex-direction: column; gap: var(--gap);}
	ul.features div ol,
	ul.features div ul {padding: 0 0 0 2rem;}
	ul.features figure,
	ul.features div {flex: 1; max-width: calc((100% - var(--gap)) / 2);}
	ul.features figure {border-radius: var(--radius); display: flex; flex-direction: column; gap: var(--gap); margin: 0; padding: var(--padding);}
	ul.features img {aspect-ratio: var(--aspect-ratio); border-radius: var(--radius-half); width: 100%;}
	ol.prompts {display: flex; flex-wrap: wrap; gap: var(--gap); list-style: none; padding: 0; width: 100%;}
	ol.prompts > li {border-radius: var(--radius); max-width: calc((100% - var(--gap)) / 2); padding: var(--padding); width: 100%;}
	ol.prompts > li > svg {max-height: 4rem; max-width: 4rem;}
	ol.prompts figure {width: 100%;}
	ul#aside_prompts {display: flex; flex-wrap: wrap; gap: var(--gap); list-style: none; width: 100%;}
	ul#aside_prompts li {max-width: calc((100% - var(--gap)) / 2); width: 100%;}
	ul#aside_prompts img {aspect-ratio: var(--aspect-ratio); border-radius: var(--radius-half); width: 100%;}
	ul#aside_prompts figure {display: flex; flex-direction: column; gap: var(--gap);}
	ul#menu-resources,
	ul#menu-policies,
	ul#share {align-items: center; display: flex; flex-wrap: wrap; gap: var(--gap); list-style: none; padding: var(--padding) 0; width: 100%;}
	ul#menu-resources span,
	ul#menu-policies span,
	ul#share span {white-space: nowrap;}
	section#accreditation ul {align-items: center; display: flex; flex-wrap: wrap; gap: var(--gap); justify-content: space-between; list-style: none; padding: var(--padding) 0; width: 100%;}
	section#accreditation img,
	section#accreditation svg {max-width: 6rem; max-width: 6rem;}
	section#accreditation abbr {display: none;}
	section#accreditation a {align-items: center; display: flex; gap: var(--gap); justify-content: space-between;}
	section.cta a {align-items: center; display: flex; gap: 1ch; padding: var(--padding);}
	section.faq .q-a {display: flex; flex-direction: column; gap: var(--gap);}
	section ul#logos {justify-content: space-between;}
	section ul#logos img,
	section ul#logos svg {max-height: 6rem; max-width: 6rem;}
	ul#actions {display: flex; gap: var(--gap); justify-content: space-between; list-style: none; padding: var(--padding);}
	ul#actions a {align-items: center; display: flex; gap: var(--gap);}
	ul#actions h4 {display: flex; flex-direction: column;}
	ul#actions li[data-link='https'] {display: none;}
	ul#engage {display: flex; flex-direction: column; justify-content: space-between; list-style: none;}
	ul#engage a {align-items: center; display: flex; gap: var(--gap); padding: var(--padding);}
	ul#engage h4 {display: flex; flex-direction: column;}
	ul#share {align-items: center; display: flex; gap: var(--gap); justify-content: space-between; list-style: none;}
	section:has(ul#menu-resources) {display: none;}
	section:has(ul#menu-policies) {display: none;}
	aside > div {display: flex; flex-direction: column; gap: var(--gap);}
	aside ul#aside_prompts figcaption {display: flex; flex-direction: column;}
	aside svg,
	nav#nav_secondary ul svg {max-height: 2rem; max-width: 2rem;}
	nav#nav_secondary ul a {display: flex; gap: 1ch;}
	body > div:has(> .grecaptcha-badge),
	.snackbar,
	#cmplz-manage-consent {display: none !important;}
	#footer small {padding: var(--padding) 0;}
	/*
	body {color: var(--dark); display: flex; flex-direction: column; gap: var(--gap); padding: 0;}
	body > img {display: none;}
	img {border-radius: var(--radius-half); max-height: 10cm;}
	hr {display: none;}
	a {color: var(--cta); text-decoration: underline;}
	a span {color: inherit;}
	blockquote#notice {display: none;}
	nav#nav_primary {height: auto; position: relative;}
	nav#nav_primary > a#logo {padding: 0;}
	nav#nav_primary > a#logo svg {color: var(--blue);}
	nav#nav_primary > a#logo svg #gem {opacity: 1;}
	nav#nav_primary ul.cta.left span {display: flex;}
	nav#nav_primary ul.cta.right label svg {display: none;}
	nav#nav_primary ul.cta.right label::before {content: 'GEM';}
	nav#nav_primary .menu-wrap {display: none;}
	header {border: var(--border);}
	header figcaption a {background-color: var(--cta-fill);}
	header figcaption small {display: block;}
	header figure {height: unset;}
	header figure img {aspect-ratio: 3/2; display: block; height: auto; object-fit: cover; object-position: center; width: 100%;}
	div.cols_2 {flex-direction: row;}
	nav {border-radius: var(--radius); padding: var(--padding);}
	header,
	section {border: var(--border); border-radius: var(--radius); padding: var(--padding); page-break-before: auto; page-break-after: auto;}
	form.wpcf7-form label {flex-direction: row-reverse; gap: var(--gap); width: 100%;}
	ol.glide__slides {display: flex; flex-direction: row; flex-wrap: wrap; gap: var(--gap); margin: 0; overflow: visible; padding: 0; position: relative; width: 100%;}
	#banners ol li,
	ol.glide__slides li {border: var(--border); border-radius: var(--radius); max-width: calc((100% - var(--gap)) / 2); overflow: visible; position: relative; width: 100% !important;}
	ol.glide__slides a {display: flex; flex-direction: column; gap: var(--gap); padding: 0;}
	ol.glide__slides figure {max-height: 100%;}
	main {padding: 0;}
	section.cta a {background-color: var(--cta-fill);}
	section {border: var(--border);}
	section.cta a {display: flex; flex-direction: row; gap: 1ch;}
	figure {display: flex; flex-direction: column; gap: var(--gap);}
	figcaption {position: relative;}
	details {border-top: var(--border); display: flex; flex-direction: column; gap: 0; padding-top: var(--padding);}
	details summary {color: var(--dark); font-weight: bold; padding: 0;}
	details summary ~ * {padding: 0;}
	aside {padding: 0;}
	ul#actions a {padding: 0;}
	ul#actions h4 {flex-direction: row; gap: 1ch;}
	nav#nav_secondary {display: none;}
	#footer {display: flex; flex-direction: column; gap: var(--gap);}
	*/
}