/* Begin late-load CSS */

 /** Begin CSS Section: defaults */

 /* Begin CSS Part: Base */
/* ==========================================
   EOS FORM POPUP MODAL
   4 ALL FOUNDATION
========================================== */

/* ==========================================
   PAGE BACKDROP
   Uses :has because EOS appends the dialog directly to body.
========================================== */

body:has(.ui-dialog.form-popup)::before {
	content: "";
	position: fixed;
	inset: 0;
	z-index: 4890;

	background:
		radial-gradient(circle at 18% 22%, rgba(217,147,14,.28), transparent 34%),
		radial-gradient(circle at 82% 78%, rgba(217,147,14,.16), transparent 34%),
		rgba(0,0,0,.72);

	backdrop-filter: blur(5px);
	-webkit-backdrop-filter: blur(5px);

	pointer-events: none;
}

/* Keep any EOS / jQuery UI overlay functional, but let our body backdrop handle the visuals */

body .ui-widget-overlay,
body .modal-mask:not(.hidden) {
	position: fixed !important;
	inset: 0 !important;
	z-index: 4885 !important;

	width: 100vw !important;
	height: 100vh !important;

	background: transparent !important;
	opacity: 1 !important;
}

/* Stop background scrolling while popup exists */

body:has(.ui-dialog.form-popup) {
	overflow: hidden;
}

/* ==========================================
   MAIN POPUP SHELL
========================================== */

body .ui-dialog.eos-dialogue.form-popup,
body .ui-dialog.form-popup {
	position: fixed !important;
	top: 50% !important;
	left: 50% !important;
	z-index: 5000 !important;

	display: flex !important;
	flex-direction: column;

	width: min(92vw, 760px) !important;
	max-width: 760px !important;
	height: auto !important;
	max-height: min(88vh, 920px) !important;

	margin: 0 !important;
	padding: 0 !important;

	background:
		linear-gradient(180deg, rgba(255,255,255,1), rgba(255,255,255,.97));

	border: 1px solid rgba(217,147,14,.34) !important;
	border-radius: var(--ww-radius-l) !important;

	box-shadow:
		0 34px 100px rgba(0,0,0,.42),
		0 0 0 1px rgba(217,147,14,.08),
		inset 0 1px 0 rgba(255,255,255,.95) !important;

	overflow: hidden !important;

	transform: translate(-50%, -50%) !important;

	animation: ww-form-popup-enter 0.24s ease-out both;
}

/* Top orange accent */

body .ui-dialog.eos-dialogue.form-popup::before,
body .ui-dialog.form-popup::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	z-index: 4;

	width: 100%;
	height: 7px;

	background:
		linear-gradient(
			90deg,
			var(--ww-color-orange),
			rgba(217,147,14,.45),
			var(--ww-color-orange)
		);

	pointer-events: none;
}

/* Soft brand glow */

body .ui-dialog.eos-dialogue.form-popup::after,
body .ui-dialog.form-popup::after {
	content: "";
	position: absolute;
	right: -110px;
	bottom: -110px;
	z-index: 0;

	width: 270px;
	height: 270px;

	background: rgba(217,147,14,.1);
	border-radius: 999px;

	pointer-events: none;
}

/* ==========================================
   TITLE BAR
========================================== */

body .ui-dialog.form-popup .ui-dialog-titlebar {
	position: relative;
	z-index: 3;

	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;

	min-height: 72px;

	margin: 0 !important;
	padding: 1.35rem clamp(1.25rem, 3vw, 2rem) 1.05rem !important;

	background: transparent !important;
	color: var(--ww-color-black) !important;

	border: 0 !important;
	border-radius: 0 !important;

	cursor: default !important;
}

body .ui-dialog.form-popup .ui-dialog-titlebar::before {
	content: "Enquiry form";

	display: inline-flex;
	align-items: center;
	gap: 0.55rem;

	color: var(--ww-color-black);

	font-size: clamp(1.45rem, 2.6vw, 2.05rem);
	font-weight: 900;
	line-height: 1.05;
	letter-spacing: -0.045em;
}

body .ui-dialog.form-popup .ui-dialog-titlebar::after {
	content: "";

	position: absolute;
	left: clamp(1.25rem, 3vw, 2rem);
	bottom: 0;

	width: 86px;
	height: 5px;

	background: var(--ww-color-orange);
	border-radius: 999px;
}

body .ui-dialog.form-popup .ui-dialog-title {
	display: none !important;
}

/* ==========================================
   CLOSE BUTTON
========================================== */

body .ui-dialog.form-popup .ui-dialog-titlebar-close {
	position: relative !important;
	top: auto !important;
	right: auto !important;
	z-index: 5;

	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;

	flex: 0 0 auto;

	width: 44px !important;
	height: 44px !important;
	min-width: 44px !important;
	min-height: 44px !important;

	margin: 0 !important;
	padding: 0 !important;

	background: var(--ww-color-black) !important;
	color: var(--ww-color-orange) !important;

	border: 2px solid var(--ww-color-black) !important;
	border-radius: 999px !important;

	box-shadow:
		0 10px 26px rgba(0,0,0,.14),
		inset 0 1px 0 rgba(255,255,255,.12) !important;

	font-size: 0 !important;
	line-height: 1 !important;
	text-indent: 0 !important;

	cursor: pointer !important;

	transition:
		background-color var(--ww-transition-fast),
		color var(--ww-transition-fast),
		border-color var(--ww-transition-fast),
		transform var(--ww-transition-fast),
		box-shadow var(--ww-transition-fast);
}

body .ui-dialog.form-popup .ui-dialog-titlebar-close::before,
body .ui-dialog.form-popup .ui-dialog-titlebar-close::after {
	content: "";
	position: absolute;

	width: 16px;
	height: 3px;

	background: currentColor;
	border-radius: 999px;

	transform-origin: center;
}

body .ui-dialog.form-popup .ui-dialog-titlebar-close::before {
	transform: rotate(45deg);
}

body .ui-dialog.form-popup .ui-dialog-titlebar-close::after {
	transform: rotate(-45deg);
}

body .ui-dialog.form-popup .ui-dialog-titlebar-close:hover,
body .ui-dialog.form-popup .ui-dialog-titlebar-close:focus {
	background: var(--ww-color-orange) !important;
	color: var(--ww-color-black) !important;
	border-color: var(--ww-color-orange) !important;

	box-shadow:
		0 14px 34px rgba(0,0,0,.2),
		0 0 24px rgba(217,147,14,.24) !important;

	transform: translateY(-2px);
}

/* Hide default jQuery UI close icon parts */

body .ui-dialog.form-popup .ui-dialog-titlebar-close .ui-button-icon,
body .ui-dialog.form-popup .ui-dialog-titlebar-close .ui-button-icon-space,
body .ui-dialog.form-popup .ui-dialog-titlebar-close .ui-icon {
	display: none !important;
}

/* ==========================================
   POPUP CONTENT AREA
   We style the wrapper only, not the form internals.
========================================== */

body .ui-dialog.form-popup .ui-dialog-content,
body .ui-dialog.form-popup .dialog.ui-dialog-content {
	position: relative;
	z-index: 2;

	display: block !important;

	width: 100% !important;
	height: auto !important;
	max-height: calc(min(88vh, 920px) - 72px) !important;

	margin: 0 !important;
	padding: clamp(1.25rem, 3vw, 2rem) !important;

	background: transparent !important;
	color: var(--ww-color-black) !important;

	border: 0 !important;

	overflow-y: auto !important;
	overflow-x: hidden !important;

	scrollbar-width: thin;
	scrollbar-color: rgba(217,147,14,.85) rgba(0,0,0,.08);
}

body .ui-dialog.form-popup .ui-dialog-content::-webkit-scrollbar {
	width: 10px;
}

body .ui-dialog.form-popup .ui-dialog-content::-webkit-scrollbar-track {
	background: rgba(0,0,0,.06);
	border-radius: 999px;
}

body .ui-dialog.form-popup .ui-dialog-content::-webkit-scrollbar-thumb {
	background: rgba(217,147,14,.85);
	border-radius: 999px;
}

/* Let the form fill the nicer wider popup shell */

body .ui-dialog.form-popup .dialog > .layout.mod_form,
body .ui-dialog.form-popup .layout.mod_form.initialised {
	width: 100% !important;
	max-width: none !important;

	margin: 0 !important;
}

/* ==========================================
   REMOVE JQUERY UI VISUAL NOISE
========================================== */

body .ui-dialog.form-popup.ui-widget,
body .ui-dialog.form-popup.ui-widget-content,
body .ui-dialog.form-popup .ui-widget-content,
body .ui-dialog.form-popup .ui-widget-header {
	font-family: inherit !important;
}

body .ui-dialog.form-popup .ui-resizable-handle {
	display: none !important;
}

body .ui-dialog.form-popup.ui-draggable .ui-dialog-titlebar {
	cursor: default !important;
}

/* ==========================================
   FOCUS STATE
========================================== */

body .ui-dialog.form-popup:focus,
body .ui-dialog.form-popup:focus-within {
	outline: 3px solid rgba(217,147,14,.35);
	outline-offset: 5px;
}

/* ==========================================
   BUSY SPINNER
========================================== */

body #eos-busy {
	position: fixed !important;
	inset: 0 !important;
	z-index: 6000 !important;

	display: flex;
	align-items: center;
	justify-content: center;

	background: rgba(0,0,0,.55);
	backdrop-filter: blur(4px);
	-webkit-backdrop-filter: blur(4px);
}

body #eos-busy.hidden {
	display: none !important;
}

body #eos-busy img {
	width: 72px !important;
	height: 72px !important;

	padding: 0.85rem;

	background: var(--ww-color-white);
	border: 1px solid rgba(217,147,14,.34);
	border-radius: 999px;

	box-shadow: 0 18px 54px rgba(0,0,0,.28);
}

/* ==========================================
   ANIMATION
========================================== */

@keyframes ww-form-popup-enter {

	from {
		opacity: 0;
		transform: translate(-50%, calc(-50% + 18px)) scale(.97);
	}

	to {
		opacity: 1;
		transform: translate(-50%, -50%) scale(1);
	}

}

/* ==========================================
   TABLET POPUP
========================================== */

@media (min-width: 768px) and (max-width: 1200px) {

	body .ui-dialog.eos-dialogue.form-popup,
	body .ui-dialog.form-popup {
		width: min(92vw, 700px) !important;
		max-width: 700px !important;
	}

}

/* ==========================================
   MOBILE POPUP
========================================== */

@media (max-width: 767px) {

	body .ui-dialog.eos-dialogue.form-popup,
	body .ui-dialog.form-popup {
		top: 50% !important;
		left: 50% !important;

		width: calc(100vw - 1.5rem) !important;
		max-width: calc(100vw - 1.5rem) !important;
		max-height: calc(100vh - 1.5rem) !important;

		border-radius: var(--ww-radius-m) !important;
	}

	body .ui-dialog.form-popup .ui-dialog-titlebar {
		min-height: 64px;
		padding: 1.15rem 1rem 0.95rem !important;
	}

	body .ui-dialog.form-popup .ui-dialog-titlebar::before {
		font-size: clamp(1.35rem, 7vw, 1.8rem);
	}

	body .ui-dialog.form-popup .ui-dialog-titlebar::after {
		left: 1rem;
	}

	body .ui-dialog.form-popup .ui-dialog-titlebar-close {
		width: 40px !important;
		height: 40px !important;
		min-width: 40px !important;
		min-height: 40px !important;
	}

	body .ui-dialog.form-popup .ui-dialog-content,
	body .ui-dialog.form-popup .dialog.ui-dialog-content {
		max-height: calc(100vh - 1.5rem - 64px) !important;
		padding: 1rem !important;
	}

}


/* ==========================================
   INFLATE LINK UTILITY
   Makes a link fill its parent container
========================================== */

/*
	Usage:
	<div class="layout-component some-card">
		...
		<a href="/" class="inflate" aria-label="Read more about ..."></a>
	</div>

	The parent element must be position: relative.
	This utility sets common EOS/card parents automatically.
*/

/* Common parent contexts */

body .layout-component:has(> .inflate),
body .card:has(> .inflate),
body .card-custom:has(> .inflate),
body .card-output:has(> .inflate),
body .iteration:has(> .inflate),
body .split-content.split-content--image-cards .layout-component:has(> .inflate) {
	position: relative;
}

/* The inflated clickable layer */

body a.inflate {
	position: absolute;
	inset: 0;
	z-index: 20;

	display: block;

	width: 100%;
	height: 100%;

	margin: 0 !important;
	padding: 0 !important;

	background: transparent;

	border: 0;
	border-radius: inherit;

	color: transparent !important;

	font-size: 0;
	line-height: 0;
	text-decoration: none;

	cursor: pointer;
}

/* Keep keyboard focus visible */

body a.inflate:focus-visible {
	outline: 3px solid var(--ww-color-orange);
	outline-offset: -6px;

	border-radius: inherit;
}

/* Prevent accidental generated text/icons */

body a.inflate::before,
body a.inflate::after {
	display: none !important;
}


.border-this {position:relative;}
.border-this::before {
  content: "";
  position: absolute;
  top: 0px;
  left: 0;
  z-index: 1000;
  width: 100%;
  height: 8px;
  background: linear-gradient( 90deg, var(--ww-color-orange), rgba(217,147,14,.45), var(--ww-color-orange) );
  pointer-events: none;
}

 /* Begin CSS Part: Layout */
/* Begin CSS Part: Layout */
/* ==========================================
   WATMAN WEB FRAMEWORK
   LAYOUT - MAIN
   4 ALL FOUNDATION
========================================== */

/* ==========================================
   PAGE SECTIONS
========================================== */

.page-section {
	width: 100%;

	background: var(--ww-color-body-bg);

	padding-block: clamp(4.5rem, 7vw, var(--ww-space-xl));
}

.page-section + .page-section {
	padding-top: 0;
}

/* ==========================================
   PAGE SECTION SPACING MODIFIERS
========================================== */

/* Re-add normal top spacing when a section follows another page-section */

body .page-section.page-section--with-top-padding {
	padding-top: clamp(4.5rem, 7vw, var(--ww-space-xl));
}

/* Smaller top spacing option */

body .page-section.page-section--with-small-top-padding {
	padding-top: var(--ww-space-l);
}

/* Force no top spacing when needed */

body .page-section.page-section--no-top-padding {
	padding-top: 0;
}

/* ==========================================
   PAGE SECTION INNER CONTAINERS
========================================== */

.page-section > .i,
.layout-cell.page-section > .i,
.layout-cell.stats-strip > .i {
	width: calc(100% - (var(--ww-page-gutter) * 2));
	max-width: var(--ww-container-max);

	margin-left: auto;
	margin-right: auto;
}

/* ==========================================
   PAGE SECTION CHILD REGIONS
========================================== */

.page-section-content,
.page-section-image,
.page-section-cards,
.page-section-form {
	width: 100%;
	min-width: 0;
}

.page-section-content > .i,
.page-section-image > .i,
.page-section-cards > .i,
.page-section-form > .i {
	width: 100%;
	min-width: 0;
}

.page-section-content > .textblock,
.page-section-content > .i > .textblock,
.page-section-content .content {
	max-width: var(--ww-container-narrow);
}

.page-section > .page-section-content,
.page-section > .i > .page-section-content {
	max-width: var(--ww-container-narrow);
}

.layout-component.textblock p:has(img) {
	margin-bottom: 0;
}

/* ==========================================
   FULL-WIDTH SPLIT CONTENT
   Structural rules only. Visual styling lives in Site Components / Specials.
========================================== */

body .split-content {
	width: 100%;
	max-width: none;

	padding-block: 0;

	overflow: hidden;
}

body .page-section.split-content > .i,
body .layout-cell.split-content > .i,
body .split-content > .i {
	display: grid;
	align-items: stretch;
	gap: 0;

	width: 100% !important;
	max-width: none !important;

	margin-left: 0 !important;
	margin-right: 0 !important;
}

body .split-content > .i > .layout-cell {
	min-width: 0;

	margin: 0 !important;
}

body .split-content > .i > .layout-cell > .i {
	width: 100%;
	min-width: 0;
	height: 100%;
}

/* Equal four-column split content modifier.
   Column counts are handled in Desktop / Tablet / Mobile Defaults. */

body .split-content--4 {
	width: 100%;
	max-width: none;

	overflow: hidden;
}
 /* Begin CSS Part: Desktop Defaults */
/* Begin CSS Part: Desktop Defaults */
@media (min-width: 1201px) {

	/* ======================================
	   WW GRIDS
	====================================== */

	body .ww-grid--2,
	body .ww-grid--2 > .i,
	body .layout-cell.ww-grid--2 > .i {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	body .ww-grid--3,
	body .ww-grid--3 > .i,
	body .layout-cell.ww-grid--3 > .i {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	body .ww-grid--4,
	body .ww-grid--4 > .i,
	body .layout-cell.ww-grid--4 > .i {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}

	body .ww-grid--5,
	body .ww-grid--5 > .i,
	body .layout-cell.ww-grid--5 > .i {
		grid-template-columns: repeat(5, minmax(0, 1fr));
	}

	body .ww-grid--3-1,
	body .ww-grid--3-1 > .i,
	body .layout-cell.ww-grid--3-1 > .i {
		grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
	}

	/* ======================================
	   SPLIT CONTENT LAYOUT
	====================================== */

	body .split-content--2 > .i {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	body .split-content--4 > .i {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}

	body .split-content--1-3 > .i {
		grid-template-columns: minmax(0, 1fr) minmax(0, 2fr);
	}

	body .split-content--3-1 > .i {
		grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
	}

	/* ======================================
	   STATS STRIP LAYOUT
	====================================== */

	body .stats-strip > .i {
		display: grid;
		grid-template-columns: repeat(4, minmax(0, 1fr));
		gap: clamp(1rem, 2vw, 2rem);
		align-items: stretch;
	}

	/* ======================================
	   FORM FIELD LAYOUT
	====================================== */

	body .form-fields > .i {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	/* ======================================
	   FOOTER LAYOUT
	====================================== */

	body .main-footer > .i {
		display: grid;
		grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr) minmax(0, 1fr);
		gap: clamp(2rem, 5vw, var(--ww-space-l));
	}

	body .base-footer > .i,
	body .base-footer > .i > .layout-cell {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 2rem;
	}

	body .base-menu .menubar {
		display: flex;
		align-items: center;
		justify-content: flex-end;
		flex-wrap: wrap;
		gap: 1rem;
	}

	/* ======================================
	   NEWS CARD SCROLLER LAYOUT
	====================================== */

	body .news-card-scroller .slide-group {
		display: grid;
		grid-template-columns: repeat(4, minmax(0, 1fr));
		gap: clamp(1rem, 2vw, 2rem);
		align-items: stretch;
	}

	body .news-card-scroller .news-slide {
		min-width: 0;
		height: 100%;
	}

}
 /* Begin CSS Part: Tablet Defaults */
/* Begin CSS Part: Tablet Defaults */
@media (min-width: 768px) and (max-width: 1200px) {

	/* ======================================
	   WW GRIDS
	====================================== */

	body .ww-grid--2,
	body .ww-grid--2 > .i,
	body .layout-cell.ww-grid--2 > .i {
		grid-template-columns: 1fr;
	}

	body .ww-grid--3,
	body .ww-grid--3 > .i,
	body .layout-cell.ww-grid--3 > .i,
	body .ww-grid--4,
	body .ww-grid--4 > .i,
	body .layout-cell.ww-grid--4 > .i {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	body .ww-grid--5,
	body .ww-grid--5 > .i,
	body .layout-cell.ww-grid--5 > .i {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	body .ww-grid--3-1,
	body .ww-grid--3-1 > .i,
	body .layout-cell.ww-grid--3-1 > .i {
		grid-template-columns: minmax(0, 1.55fr) minmax(260px, .9fr);
	}

	/* ======================================
	   SPLIT CONTENT LAYOUT
	====================================== */

	body .split-content--2 > .i,
	body .split-content--1-3 > .i,
	body .split-content--3-1 > .i {
		grid-template-columns: 1fr;
	}

	body .split-content--4 > .i {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	/* ======================================
	   STATS STRIP LAYOUT
	====================================== */

	body .stats-strip > .i {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: clamp(1rem, 2vw, 2rem);
		align-items: stretch;
	}

	/* ======================================
	   NEWS CARD SCROLLER LAYOUT
	====================================== */

	body .news-card-scroller .slide-group {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: clamp(1rem, 2vw, 2rem);
		align-items: stretch;
	}

	body .news-card-scroller .news-slide {
		min-width: 0;
		height: 100%;
	}

	/* ======================================
	   FORM FIELD LAYOUT
	====================================== */

	body .form-fields > .i {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	/* ======================================
	   FOOTER LAYOUT
	====================================== */

	body .main-footer > .i {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: clamp(2rem, 5vw, var(--ww-space-l));
	}

	body .footer-info-group {
		grid-column: 1 / -1;
	}

	body .base-footer > .i,
	body .base-footer > .i > .layout-cell {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 2rem;
	}

	body .base-menu .menubar {
		display: flex;
		align-items: center;
		justify-content: flex-end;
		flex-wrap: wrap;
		gap: 1rem;
	}

}
 /* Begin CSS Part: Mobile Defaults */
/* Begin CSS Part: Mobile Defaults */
@media (max-width: 767px) {

	body .page-content-wrapper {
		padding-top: var(--ww-header-height-mobile);
	}

	body .page-section {
		padding-block: var(--ww-space-l);
	}

	/* ======================================
	   WW GRIDS
	====================================== */

	body .ww-grid--2,
	body .ww-grid--2 > .i,
	body .layout-cell.ww-grid--2 > .i,
	body .ww-grid--3,
	body .ww-grid--3 > .i,
	body .layout-cell.ww-grid--3 > .i,
	body .ww-grid--4,
	body .ww-grid--4 > .i,
	body .layout-cell.ww-grid--4 > .i,
	body .ww-grid--5,
	body .ww-grid--5 > .i,
	body .layout-cell.ww-grid--5 > .i,
	body .ww-grid--3-1,
	body .ww-grid--3-1 > .i,
	body .layout-cell.ww-grid--3-1 > .i {
		grid-template-columns: 1fr;
	}

	/* ======================================
	   SPLIT CONTENT LAYOUT
	====================================== */

	body .split-content--2 > .i,
	body .split-content--1-3 > .i,
	body .split-content--3-1 > .i,
	body .split-content--4 > .i {
		grid-template-columns: 1fr;
	}

	/* ======================================
	   STATS STRIP LAYOUT
	====================================== */

	body .stats-strip > .i {
		display: grid;
		grid-template-columns: 1fr;
		gap: var(--ww-space-s);
		align-items: stretch;
	}

	/* ======================================
	   NEWS CARD SCROLLER LAYOUT
	====================================== */

	body .news-card-scroller .slide-group {
		display: grid;
		grid-template-columns: 1fr;
		gap: var(--ww-space-m);
		align-items: stretch;
	}

	body .news-card-scroller .news-slide {
		min-width: 0;
		height: 100%;
	}

	/* ======================================
	   FORM FIELD LAYOUT
	====================================== */

	body .form-fields > .i {
		display: grid;
		grid-template-columns: 1fr;
	}

	body .page-section-form .ww-form {
		padding: var(--ww-space-m);
	}

	/* ======================================
	   FLEX
	====================================== */

	body .ww-flex {
		flex-direction: column;
	}

	/* ======================================
	   FOOTER LAYOUT
	====================================== */

	body .main-footer > .i {
		display: grid;
		grid-template-columns: 1fr;
		gap: var(--ww-space-m);
	}

	body .footer-info-group {
		grid-column: auto;
	}

	body .base-footer > .i,
	body .base-footer > .i > .layout-cell {
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		gap: 1rem;
	}

	body .base-menu .menubar {
		display: flex;
		align-items: flex-start;
		justify-content: flex-start;
		flex-wrap: wrap;
		gap: 1rem;
	}

}
 /** Begin CSS Section: core */

 /* Begin CSS Part: DISABILITY */

 /* Begin CSS Part: Fonts */
/* ==========================================
   WATMAN WEB FRAMEWORK
   FONTS
   4 ALL FOUNDATION
========================================== */

body {
	font-family: "Noto Sans", Arial, sans-serif;
	font-size: 1rem;
	line-height: 1.65;
	color: var(--ww-color-text);
}

h1,
h2,
h3,
h4,
h5,
h6 {
	line-height: 1.08;
	font-weight: 700;
	text-wrap: balance;
	margin-bottom: 1rem;
	color: var(--ww-color-heading-main);
}

h1 {
	font-size: clamp(2.35rem, 5vw, 5.25rem);
	letter-spacing: -0.04em;
}

h2 {
	font-size: clamp(2rem, 3.6vw, 3.6rem);
	letter-spacing: -0.035em;
}

h3 {
	font-size: clamp(1.35rem, 2.2vw, 2.1rem);
	letter-spacing: -0.02em;
}

h4 {
	font-size: clamp(1.2rem, 1.6vw, 1.55rem);
}

h5,
h6,
label {
	color: var(--ww-color-heading-tertiary);
}

p,
ul,
ol {
	margin-bottom: 1.25rem;
}

p:last-child,
ul:last-child,
ol:last-child {
	margin-bottom: 0;
}

ul,
ol {
	padding-left: 1.4rem;
}

strong,
b {
	font-weight: 800;
}

/* ==========================================
   PAGE SECTION TYPOGRAPHY
========================================== */

.page-section .page-section-content h1,
.page-section .page-section-content h2 {
	position: relative;
	padding-bottom: 1rem;
}

.page-section .page-section-content h1::after,
.page-section .page-section-content h2::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	width: 84px;
	height: 5px;
	background: var(--ww-color-secondary);
}

.page-section .page-section-content p {
	font-size: clamp(1.05rem, 1.5vw, 1.22rem);
	line-height: 1.75;
	color: var(--ww-color-muted);
}

/* ==========================================
   CONTENT LINKS
========================================== */

.content a,
.page-section .content a,
.textblock a:not(.button) {
	color: var(--ww-color-link);
	text-decoration-color: rgba(217,147,14,.6);
	text-decoration-thickness: 2px;
	text-underline-offset: 0.18em;
	transition:
		color var(--ww-transition-fast),
		text-decoration-color var(--ww-transition-fast);
}

.content a:hover,
.content a:focus,
.page-section .content a:hover,
.page-section .content a:focus,
.textblock a:not(.button):hover,
.textblock a:not(.button):focus {
	color: var(--ww-color-link-hover);
	text-decoration-color: var(--ww-color-orange);
}
 /* Begin CSS Part: Buttons */
/* ==========================================
   WATMAN WEB FRAMEWORK
   BUTTONS
   4 ALL FOUNDATION
========================================== */

/* ==========================================
   BASE BUTTONS
========================================== */

.button,
.button:visited,
input[type="submit"],
input[type="button"],
button {
	--ww-button-current-bg: rgba(217,147,14,.07);
	--ww-button-current-text: var(--ww-color-black);
	--ww-button-current-border: var(--ww-color-orange);

	--ww-button-hover-bg: var(--ww-color-black);
	--ww-button-hover-text: var(--ww-color-orange);
	--ww-button-hover-border: var(--ww-color-black);

	--ww-button-arrow-bg: var(--ww-color-orange);
	--ww-button-arrow-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5 12h12M13 6l6 6-6 6' fill='none' stroke='%23000000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");

	--ww-button-hover-arrow-bg: var(--ww-color-orange);
	--ww-button-hover-arrow-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5 12h12M13 6l6 6-6 6' fill='none' stroke='%23000000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");

	--ww-button-shadow: 0 12px 28px rgba(0,0,0,.12);
	--ww-button-hover-shadow: 0 18px 42px rgba(0,0,0,.18);

	position: relative;
	isolation: isolate;

	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.65rem;

	width: auto;
	min-height: 52px;
	padding: 0.95rem 1.45rem;

	border: 2px solid var(--ww-button-current-border);
	border-radius: 999px;

	background: var(--ww-button-current-bg);
	color: var(--ww-button-current-text);

	font: inherit;
	font-size: 0.98rem;
	font-weight: 850;
	line-height: 1;
	letter-spacing: 0.01em;
	text-align: center;
	text-decoration: none;

	box-shadow:
		var(--ww-button-shadow),
		inset 0 1px 0 rgba(255,255,255,.12);

	overflow: hidden;
	cursor: pointer;

	transform: translateY(0);

	transition:
		background-color var(--ww-transition-fast),
		color var(--ww-transition-fast),
		border-color var(--ww-transition-fast),
		box-shadow var(--ww-transition-fast),
		transform var(--ww-transition-fast),
		opacity var(--ww-transition-fast);
}

.button:hover,
.button:focus,
input[type="submit"]:hover,
input[type="submit"]:focus,
input[type="button"]:hover,
input[type="button"]:focus,
button:hover,
button:focus {
	background: var(--ww-button-hover-bg);
	color: var(--ww-button-hover-text);
	border-color: var(--ww-button-hover-border);

	box-shadow:
		var(--ww-button-hover-shadow),
		inset 0 1px 0 rgba(255,255,255,.16);

	transform: translateY(-3px);
}

/* ==========================================
   BUTTON SHINE LAYER
   Applies to link-style .button CTAs only.
========================================== */

.button:not(.scroll-prev):not(.scroll-next)::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 0;
	pointer-events: none;

	background:
		linear-gradient(
			135deg,
			rgba(255,255,255,.22),
			transparent 42%,
			rgba(255,255,255,.08)
		);

	opacity: 0;

	transition: opacity var(--ww-transition-fast);
}

.button:not(.scroll-prev):not(.scroll-next):hover::before,
.button:not(.scroll-prev):not(.scroll-next):focus::before {
	opacity: 1;
}

/* ==========================================
   BUTTON ARROW
   Applies to link-style .button CTAs only.
========================================== */

.button:not(.scroll-prev):not(.scroll-next)::after {
	content: "";

	position: relative;
	z-index: 1;

	display: inline-block;
	flex: 0 0 auto;

	width: 1.35rem;
	height: 1.35rem;

	border-radius: 999px;

	background-color: var(--ww-button-arrow-bg);
	background-image: var(--ww-button-arrow-image);
	background-repeat: no-repeat;
	background-position: center;
	background-size: 58% 58%;

	transform: translateX(0);

	transition:
		background-color var(--ww-transition-fast),
		transform var(--ww-transition-fast);
}

.button:not(.scroll-prev):not(.scroll-next):hover::after,
.button:not(.scroll-prev):not(.scroll-next):focus::after {
	background-color: var(--ww-button-hover-arrow-bg);
	background-image: var(--ww-button-hover-arrow-image);

	transform: translateX(4px);
}

/* Optional no-arrow helper */

.button.button--no-arrow::after,
.button.no-arrow::after {
	display: none;
}

/* ==========================================
   BUTTON SIZES
========================================== */

.button.large,
input.super {
	min-height: 58px;
	padding: 1.05rem 1.65rem;

	font-size: 1.05rem;
}

.button.small {
	min-height: 42px;
	padding: 0.7rem 1.1rem;

	font-size: 0.9rem;
}

.button.small:not(.scroll-prev):not(.scroll-next)::after {
	width: 1.15rem;
	height: 1.15rem;
}

/* ==========================================
   DARK BACKGROUND BUTTON
   For black / dark areas.
========================================== */

.button.button--dark,
.button.dark {
	--ww-button-current-bg: rgba(217,147,14,.06);
	--ww-button-current-text: var(--ww-color-orange);
	--ww-button-current-border: var(--ww-color-orange);

	--ww-button-hover-bg: var(--ww-color-orange);
	--ww-button-hover-text: var(--ww-color-black);
	--ww-button-hover-border: var(--ww-color-orange);

	--ww-button-arrow-bg: var(--ww-color-orange);
	--ww-button-arrow-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5 12h12M13 6l6 6-6 6' fill='none' stroke='%23000000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");

	--ww-button-hover-arrow-bg: var(--ww-color-black);
	--ww-button-hover-arrow-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5 12h12M13 6l6 6-6 6' fill='none' stroke='%23d9930e' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");

	--ww-button-shadow:
		0 14px 32px rgba(0,0,0,.24),
		0 0 0 1px rgba(217,147,14,.08);

	--ww-button-hover-shadow:
		0 18px 42px rgba(0,0,0,.28),
		0 0 28px rgba(217,147,14,.28);
}

/* ==========================================
   LIGHT / ORANGE BACKGROUND BUTTON
   For orange brand panels.
========================================== */

.button.button--light,
.button.light {
	--ww-button-current-bg: rgba(0,0,0,.04);
	--ww-button-current-text: var(--ww-color-black);
	--ww-button-current-border: var(--ww-color-black);

	--ww-button-hover-bg: var(--ww-color-black);
	--ww-button-hover-text: var(--ww-color-orange);
	--ww-button-hover-border: var(--ww-color-black);

	--ww-button-arrow-bg: var(--ww-color-black);
	--ww-button-arrow-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5 12h12M13 6l6 6-6 6' fill='none' stroke='%23d9930e' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");

	--ww-button-hover-arrow-bg: var(--ww-color-orange);
	--ww-button-hover-arrow-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5 12h12M13 6l6 6-6 6' fill='none' stroke='%23000000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");

	--ww-button-shadow:
		0 14px 32px rgba(0,0,0,.16),
		0 0 0 1px rgba(0,0,0,.06);

	--ww-button-hover-shadow:
		0 18px 42px rgba(0,0,0,.22),
		0 0 24px rgba(0,0,0,.12);
}

/* ==========================================
   BRAND FILL BUTTON TREATMENTS
   Automatic contextual treatments inside fill-brand panels.
========================================== */

.fill-brand-1 .button:not(.scroll-prev):not(.scroll-next) {
	--ww-button-current-bg: rgba(217,147,14,.06);
	--ww-button-current-text: var(--ww-color-orange);
	--ww-button-current-border: var(--ww-color-orange);

	--ww-button-hover-bg: var(--ww-color-orange);
	--ww-button-hover-text: var(--ww-color-black);
	--ww-button-hover-border: var(--ww-color-orange);

	--ww-button-arrow-bg: var(--ww-color-orange);
	--ww-button-arrow-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5 12h12M13 6l6 6-6 6' fill='none' stroke='%23000000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");

	--ww-button-hover-arrow-bg: var(--ww-color-black);
	--ww-button-hover-arrow-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5 12h12M13 6l6 6-6 6' fill='none' stroke='%23d9930e' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");

	--ww-button-shadow:
		0 14px 32px rgba(0,0,0,.24),
		0 0 0 1px rgba(217,147,14,.08);

	--ww-button-hover-shadow:
		0 18px 42px rgba(0,0,0,.28),
		0 0 28px rgba(217,147,14,.28);
}

.fill-brand-2 .button:not(.scroll-prev):not(.scroll-next) {
	--ww-button-current-bg: rgba(0,0,0,.04);
	--ww-button-current-text: var(--ww-color-black);
	--ww-button-current-border: var(--ww-color-black);

	--ww-button-hover-bg: var(--ww-color-black);
	--ww-button-hover-text: var(--ww-color-orange);
	--ww-button-hover-border: var(--ww-color-black);

	--ww-button-arrow-bg: var(--ww-color-black);
	--ww-button-arrow-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5 12h12M13 6l6 6-6 6' fill='none' stroke='%23d9930e' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");

	--ww-button-hover-arrow-bg: var(--ww-color-orange);
	--ww-button-hover-arrow-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5 12h12M13 6l6 6-6 6' fill='none' stroke='%23000000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");

	--ww-button-shadow:
		0 14px 32px rgba(0,0,0,.16),
		0 0 0 1px rgba(0,0,0,.06);

	--ww-button-hover-shadow:
		0 18px 42px rgba(0,0,0,.22),
		0 0 24px rgba(0,0,0,.12);
}

/* ==========================================
   BRAND FILL BUTTON HOVER COLOUR FIX
   Keeps text readable if older contextual styles are present.
========================================== */

.fill-brand-1 .button:not(.scroll-prev):not(.scroll-next):hover,
.fill-brand-1 .button:not(.scroll-prev):not(.scroll-next):focus {
	background: var(--ww-color-orange);
	border-color: var(--ww-color-orange);
	color: var(--ww-color-black);
}

.fill-brand-2 .button:not(.scroll-prev):not(.scroll-next):hover,
.fill-brand-2 .button:not(.scroll-prev):not(.scroll-next):focus {
	background: var(--ww-color-black);
	border-color: var(--ww-color-black);
	color: var(--ww-color-orange);
}

.fill-brand-1 .button:not(.scroll-prev):not(.scroll-next):hover::after,
.fill-brand-1 .button:not(.scroll-prev):not(.scroll-next):focus::after {
	background-color: var(--ww-color-black);
	background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5 12h12M13 6l6 6-6 6' fill='none' stroke='%23d9930e' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.fill-brand-2 .button:not(.scroll-prev):not(.scroll-next):hover::after,
.fill-brand-2 .button:not(.scroll-prev):not(.scroll-next):focus::after {
	background-color: var(--ww-color-orange);
	background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5 12h12M13 6l6 6-6 6' fill='none' stroke='%23000000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

/* ==========================================
   BUTTON MODIFIER
   BACK BUTTON
========================================== */

/*
	Usage:
	<a class="button back" href="/news">Back to news</a>
	<a class="button button--back" href="/news">Back to news</a>

	This keeps the same circular arrow system as standard buttons,
	but places the icon before the text and flips the arrow direction.
*/

.button.back,
.button.button--back,
.button--back {
	flex-direction: row !important;
}

/* Keep the shine layer as normal.
   Do not use ::before for the back arrow. */

.button.back:not(.scroll-prev):not(.scroll-next)::before,
.button.button--back:not(.scroll-prev):not(.scroll-next)::before,
.button--back:not(.scroll-prev):not(.scroll-next)::before {
	content: "";

	position: absolute;
	inset: 0;
	z-index: 0;

	display: block;

	width: auto;
	height: auto;

	margin: 0;
	padding: 0;

	background:
		linear-gradient(
			135deg,
			rgba(255,255,255,.22),
			transparent 42%,
			rgba(255,255,255,.08)
		);

	border: 0;
	border-radius: inherit;
	box-shadow: none;

	opacity: 0;
	pointer-events: none;

	transform: none;

	transition: opacity var(--ww-transition-fast);
}

.button.back:not(.scroll-prev):not(.scroll-next):hover::before,
.button.back:not(.scroll-prev):not(.scroll-next):focus::before,
.button.button--back:not(.scroll-prev):not(.scroll-next):hover::before,
.button.button--back:not(.scroll-prev):not(.scroll-next):focus::before,
.button--back:not(.scroll-prev):not(.scroll-next):hover::before,
.button--back:not(.scroll-prev):not(.scroll-next):focus::before {
	opacity: 1;
}

/* Reuse the standard arrow circle, move it to the left, then flip the SVG. */

.button.back:not(.scroll-prev):not(.scroll-next)::after,
.button.button--back:not(.scroll-prev):not(.scroll-next)::after,
.button--back:not(.scroll-prev):not(.scroll-next)::after {
	content: "";

	position: relative;
	z-index: 1;

	display: inline-block !important;
	flex: 0 0 auto;
	order: -1;

	width: 1.35rem;
	height: 1.35rem;

	margin: 0;
	padding: 0;

	border: 0;
	border-radius: 999px;
	box-shadow: none;

	background-color: var(--ww-button-arrow-bg);
	background-image: var(--ww-button-arrow-image);
	background-repeat: no-repeat;
	background-position: center;
	background-size: 58% 58%;

	transform: translateX(0) scaleX(-1);

	transition:
		background-color var(--ww-transition-fast),
		transform var(--ww-transition-fast);
}

.button.back:not(.scroll-prev):not(.scroll-next):hover::after,
.button.back:not(.scroll-prev):not(.scroll-next):focus::after,
.button.button--back:not(.scroll-prev):not(.scroll-next):hover::after,
.button.button--back:not(.scroll-prev):not(.scroll-next):focus::after,
.button--back:not(.scroll-prev):not(.scroll-next):hover::after,
.button--back:not(.scroll-prev):not(.scroll-next):focus::after {
	background-color: var(--ww-button-hover-arrow-bg);
	background-image: var(--ww-button-hover-arrow-image);

	transform: translateX(-4px) scaleX(-1);
}

/* Back buttons should still respect no-arrow helpers. */

.button.back.button--no-arrow::after,
.button.back.no-arrow::after,
.button.button--back.button--no-arrow::after,
.button.button--back.no-arrow::after,
.button--back.button--no-arrow::after,
.button--back.no-arrow::after {
	display: none !important;
}


/* ==========================================
   INFLATED CARD BUTTON HOVER BRIDGE
   Makes visible buttons respond when an .inflate link covers the full card
========================================== */

/*
	Why:
	Some cards use <a class="inflate"> to make the whole block clickable.
	This means the visible .button underneath does not receive direct hover.
	These rules make the button react when the parent card is hovered/focused.
*/

/* Card-level hover should trigger the visible button state */

body .card-output:has(a.inflate):hover .button,
body .card-output:has(a.inflate):focus-within .button,
body .card-custom:has(a.inflate):hover .button,
body .card-custom:has(a.inflate):focus-within .button,
body .layout-component:has(> a.inflate):hover .button,
body .layout-component:has(> a.inflate):focus-within .button {
	background: var(--ww-button-hover-bg, var(--ww-color-black)) !important;
	color: var(--ww-button-hover-text, var(--ww-color-white)) !important;
	border-color: var(--ww-button-hover-border, var(--ww-button-hover-bg, var(--ww-color-black))) !important;

	transform: translateY(-2px);
}

/* Arrow / icon circle should also react */

body .card-output:has(a.inflate):hover .button::after,
body .card-output:has(a.inflate):focus-within .button::after,
body .card-custom:has(a.inflate):hover .button::after,
body .card-custom:has(a.inflate):focus-within .button::after,
body .layout-component:has(> a.inflate):hover .button::after,
body .layout-component:has(> a.inflate):focus-within .button::after {
	background-color: var(--ww-button-arrow-hover-bg, var(--ww-color-orange)) !important;

	transform: translateX(3px);
}



/* ==========================================
   DISABLED STATES
========================================== */

.button.disabled,
.button[aria-disabled="true"],
input[type="submit"]:disabled,
input[type="button"]:disabled,
button:disabled {
	opacity: 0.55;
	pointer-events: none;
	cursor: not-allowed;
	transform: none;
	box-shadow: none;
}

/* ==========================================
   REDUCED MOTION
========================================== */

@media (prefers-reduced-motion: reduce) {

	.button,
	.button::before,
	.button::after,
	input[type="submit"],
	input[type="button"],
	button {
		transition: none;
	}

	.button:hover,
	.button:focus,
	.button:hover::after,
	.button:focus::after,
	input[type="submit"]:hover,
	input[type="submit"]:focus,
	input[type="button"]:hover,
	input[type="button"]:focus,
	button:hover,
	button:focus {
		transform: none;
	}

}



/* ==========================================
   REUSABLE BUTTON COLOUR STATES
   Can be used anywhere, not just venue-actions
========================================== */

/*
	Example:

	<a class="button large clear-button" href="/">Hire Venue</a>
	<a class="button large black-button" href="/">Enquire</a>
*/

/* Clear / outline button */

body .button.clear-button,
body a.button.clear-button,
body .button.clear-button:link,
body a.button.clear-button:link,
body .button.clear-button:visited,
body a.button.clear-button:visited {
	background: transparent !important;
	color: var(--ww-color-black) !important;
	border-color: var(--ww-color-orange) !important;

	box-shadow: inset 0 0 0 1px var(--ww-color-orange) !important;
}

body .button.clear-button:hover,
body a.button.clear-button:hover,
body .button.clear-button:focus,
body a.button.clear-button:focus {
	background: var(--ww-color-orange) !important;
	color: var(--ww-color-black) !important;
	border-color: var(--ww-color-orange) !important;

	box-shadow:
		0 14px 34px rgba(217,147,14,.22),
		inset 0 0 0 1px var(--ww-color-orange) !important;
}
/* Black button */

body .button.black-button,
body a.button.black-button,
body .button.black-button:link,
body a.button.black-button:link,
body .button.black-button:visited,
body a.button.black-button:visited {
	background: var(--ww-color-black) !important;
	color: var(--ww-color-orange) !important;
	border-color: var(--ww-color-black) !important;

	box-shadow:
		0 14px 34px rgba(0,0,0,.18),
		inset 0 0 0 1px var(--ww-color-black) !important;
}

body .button.black-button:hover,
body a.button.black-button:hover,
body .button.black-button:focus,
body a.button.black-button:focus {
	background: var(--ww-color-orange) !important;
	color: var(--ww-color-black) !important;
	border-color: var(--ww-color-orange) !important;

	box-shadow:
		0 14px 34px rgba(217,147,14,.24),
		inset 0 0 0 1px var(--ww-color-orange) !important;
}

/* ==========================================
   ORANGE BUTTON
   Reusable button colour state
========================================== */

body .button.orange-button,
body a.button.orange-button,
body .button.orange-button:link,
body a.button.orange-button:link,
body .button.orange-button:visited,
body a.button.orange-button:visited {
	background: var(--ww-color-orange) !important;
	color: var(--ww-color-black) !important;
	border-color: var(--ww-color-orange) !important;

	box-shadow:
		0 14px 34px rgba(217,147,14,.24),
		inset 0 0 0 1px var(--ww-color-orange) !important;
}

body .button.orange-button:hover,
body a.button.orange-button:hover,
body .button.orange-button:focus,
body a.button.orange-button:focus {
	background: var(--ww-color-black) !important;
	color: var(--ww-color-orange) !important;
	border-color: var(--ww-color-black) !important;

	box-shadow:
		0 14px 34px rgba(0,0,0,.2),
		inset 0 0 0 1px var(--ww-color-black) !important;
}
 /* Begin CSS Part: Colours */

/* Begin CSS Part: Colours */
/* ==========================================
   WATMAN WEB FRAMEWORK
   COLOURS
   4 ALL FOUNDATION
========================================== */

:root {
	/* 4 All palette */
	--ww-color-white: #ffffff;
	--ww-color-black: #000000;
	--ww-color-orange: #d9930e;

	/* Semantic colour mapping */
	--ww-color-body-bg: var(--ww-color-white);
	--ww-color-text: var(--ww-color-black);
	--ww-color-muted: rgba(0,0,0,.68);

	--ww-color-primary: var(--ww-color-black);
	--ww-color-primary-text: var(--ww-color-orange);

	--ww-color-secondary: var(--ww-color-orange);
	--ww-color-secondary-text: var(--ww-color-black);

	--ww-color-header-bg: var(--ww-color-white);
	--ww-color-header-text: var(--ww-color-black);

	--ww-color-footer-bg: var(--ww-color-black);
	--ww-color-footer-text: var(--ww-color-orange);

	--ww-color-heading-main: var(--ww-color-black);
	--ww-color-heading-secondary: var(--ww-color-black);
	--ww-color-heading-tertiary: var(--ww-color-black);

	--ww-color-link: var(--ww-color-black);
	--ww-color-link-hover: var(--ww-color-orange);
	--ww-color-link-visited: var(--ww-color-black);

	--ww-color-button-bg: var(--ww-color-orange);
	--ww-color-button-text: var(--ww-color-black);
	--ww-color-button-border: var(--ww-color-orange);
	--ww-color-button-bg-hover: var(--ww-color-black);
	--ww-color-button-text-hover: var(--ww-color-orange);
	--ww-color-button-border-hover: var(--ww-color-black);

	--ww-color-border: rgba(0,0,0,.18);
	--ww-color-border-hover: rgba(0,0,0,.45);
	--ww-color-focus: var(--ww-color-orange);

	--ww-color-surface: var(--ww-color-white);
	--ww-color-surface-alt: rgba(217,147,14,.08);
	--ww-color-surface-dark: var(--ww-color-black);
}

/* ==========================================
   BRAND FILL COLOURS
   Shape/layout rules live elsewhere.
========================================== */

.fill-brand-1 {
	background: var(--ww-color-primary);
	color: var(--ww-color-primary-text);
}

.fill-brand-2 {
	background: var(--ww-color-secondary);
	color: var(--ww-color-secondary-text);
}

.fill-brand-1 h1,
.fill-brand-1 h2,
.fill-brand-1 h3,
.fill-brand-1 h4,
.fill-brand-1 h5,
.fill-brand-1 h6,
.fill-brand-1 label,
.fill-brand-1 p,
.fill-brand-1 a,
.fill-brand-1 a:visited {
	color: var(--ww-color-primary-text);
}

.fill-brand-2 h1,
.fill-brand-2 h2,
.fill-brand-2 h3,
.fill-brand-2 h4,
.fill-brand-2 h5,
.fill-brand-2 h6,
.fill-brand-2 label,
.fill-brand-2 p,
.fill-brand-2 a,
.fill-brand-2 a:visited {
	color: var(--ww-color-secondary-text);
}



/* ==========================================
   FILL BRAND 2
   Text links on orange backgrounds
========================================== */

/* Non-button text links */

body .fill-brand-2 a:not(.button):not(.inflate):not(.menu_item),
body .fill-brand-2 a:not(.button):not(.inflate):not(.menu_item):visited {
	position: relative;

	color: var(--ww-color-black) !important;

	font-weight: 800;
	text-decoration-line: underline;
	text-decoration-thickness: 2px;
	text-decoration-color: rgba(0,0,0,.35);
	text-underline-offset: 0.22em;

	background-image:
		linear-gradient(
			180deg,
			transparent 58%,
			rgba(255,255,255,.45) 58%
		);

	background-repeat: no-repeat;
	background-size: 100% 0%;
	background-position: 0 100%;

	transition:
		color var(--ww-transition-fast),
		text-decoration-color var(--ww-transition-fast),
		background-size var(--ww-transition-fast),
		text-underline-offset var(--ww-transition-fast);
}

/* Hover / focus */

body .fill-brand-2 a:not(.button):not(.inflate):not(.menu_item):hover,
body .fill-brand-2 a:not(.button):not(.inflate):not(.menu_item):focus {
	color: var(--ww-color-black) !important;

	text-decoration-color: var(--ww-color-black);
	text-underline-offset: 0.3em;

	background-size: 100% 42%;
}

/* Keyboard focus */

body .fill-brand-2 a:not(.button):not(.inflate):not(.menu_item):focus-visible {
	outline: 3px solid rgba(0,0,0,.65);
	outline-offset: 4px;
	border-radius: 0.2rem;
}

/* Keep button behaviour separate */

body .fill-brand-2 a.button,
body .fill-brand-2 a.button:visited {
	text-decoration: none !important;
	background-image: none !important;
}



/* ==========================================
   FILL BRAND TEXT STRENGTHENING
   Keeps text readable when .page-section-content rules apply
========================================== */

body .page-section.fill-brand-1,
body .page-section.fill-brand-2,
body .page-section.fill-brand-3 {
	color: var(--ww-color-white);
}

body .page-section.fill-brand-1 .page-section-content h1,
body .page-section.fill-brand-1 .page-section-content h2,
body .page-section.fill-brand-1 .page-section-content h3,
body .page-section.fill-brand-1 .page-section-content h4,
body .page-section.fill-brand-2 .page-section-content h1,
body .page-section.fill-brand-2 .page-section-content h2,
body .page-section.fill-brand-2 .page-section-content h3,
body .page-section.fill-brand-2 .page-section-content h4,
body .page-section.fill-brand-3 .page-section-content h1,
body .page-section.fill-brand-3 .page-section-content h2,
body .page-section.fill-brand-3 .page-section-content h3,
body .page-section.fill-brand-3 .page-section-content h4 {
	color: var(--ww-color-white) !important;
}

body .page-section.fill-brand-1 .page-section-content p,
body .page-section.fill-brand-2 .page-section-content p,
body .page-section.fill-brand-3 .page-section-content p {
	color: rgba(255,255,255,.82) !important;
}

body .page-section.fill-brand-1 .page-section-content a,
body .page-section.fill-brand-2 .page-section-content a,
body .page-section.fill-brand-3 .page-section-content a {
	color: var(--ww-color-orange) !important;
	text-decoration-color: rgba(217,147,14,.7);
}

 /* Begin CSS Part: Menus */

 /* Begin CSS Part: Responsive Menu */

 /* Begin CSS Part: Editor Overrides */

 /* Begin CSS Part: Specials */
/* Begin CSS Part: Specials */
/* ==========================================
   SPECIALS
   4 ALL FOUNDATION
   Detoxed / reorganised V2

   Contents:
   01. Page Section System
   02. Split Content Systems
   03. Card / Feature Sections
   04. Content / Action Utilities
   05. One-Off Sections
   06. Reduced Motion
========================================== */

/* ==========================================
   01. PAGE SECTION SYSTEM
========================================== */

/* ==========================================
   PAGE SECTION MEDIA SYSTEM
   Framework V2 structure
========================================== */

/*
	Recommended HTML:

	<div class="layout-cell page-section ww-grid ww-grid--2">
		<div class="i">

			<div class="layout-cell page-section-content">
				<div class="i">
					<div class="layout-component page-content">
						...
					</div>
				</div>
			</div>

			<div class="layout-cell page-section-media">
				<div class="i">
					<div class="layout-component page-image">
						<img src="" alt="">
					</div>

					<div class="layout-component page-cta">
						...
					</div>
				</div>
			</div>

		</div>
	</div>

	Video option:

	<div class="layout-cell page-section-media">
		<div class="i">
			<div class="layout-component page-video">
				<div class="content">
					<iframe></iframe>
				</div>
			</div>

			<div class="layout-component page-cta">
				...
			</div>
		</div>
	</div>

	Overlap option:
	Keep .page-section-media-overlap on .page-section.

	<div class="layout-cell page-section page-section-media-overlap ww-grid ww-grid--2">
		...
	</div>

	Useful per-section custom properties:

	.page-section {
		--ww-page-image-height: 540px;
		--ww-page-section-media-min-height: 440px;
		--ww-page-section-overlap-safe-bottom: 2rem;
		--ww-page-section-media-drop: 4.5rem;
	}

	How overlap works:
	- .page-section-content remains in normal flow.
	- .page-section-media is positioned absolutely on desktop.
	- the inner section row height is controlled by the content column.
	- media height matches the content-driven row height.
	- media is pulled down by --ww-page-section-media-drop.
	- section keeps --ww-page-section-overlap-safe-bottom as content breathing room.
	- visible overlap is approximately:
	  --ww-page-section-media-drop minus --ww-page-section-overlap-safe-bottom.
*/

/* ==========================================
   PAGE SECTION INNER LAYOUT
========================================== */

body .page-section {
	position: relative;
	isolation: isolate;
}

body .page-section > .i {
	position: relative;
	z-index: 1;
}

body .page-section.ww-grid > .i {
	align-items: center;
	gap: clamp(2rem, 5vw, 5rem);
}

/* ==========================================
   PAGE SECTION CONTENT
========================================== */

body .page-section .page-section-content {
	position: relative;
	z-index: 2;

	width: 100%;
	min-width: 0;
}

body .page-section .page-section-content.top-align {align-self:start;}

body .page-section .page-section-content > .i {
	width: 100%;
	min-width: 0;

	margin: 0 !important;
	padding: 0 !important;
}

body .page-section .page-section-content > .layout-component,
body .page-section .page-section-content > .i,
body .page-section .page-section-content .page-content,
body .page-section .page-section-content .content {
	max-width: 780px;
}

body .page-section .page-section-content > .layout-component,
body .page-section .page-section-content .page-content,
body .page-section .page-section-content .content {
	margin: 0 !important;
	padding: 0 !important;
}

body .page-section .page-section-content h1,
body .page-section .page-section-content h2 {
	position: relative;

	margin-bottom: clamp(1rem, 2vw, 1.35rem) !important;
	padding-bottom: 0.95rem;
}

body .page-section .page-section-content h1::after,
body .page-section .page-section-content h2::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;

	width: 86px;
	height: 5px;

	background: var(--ww-color-orange);
	border-radius: 999px;
}

body .page-section .page-section-content p:last-child {
	margin-bottom: 0;
}

/* ==========================================
   PAGE SECTION MEDIA COLUMN
========================================== */

body .page-section .page-section-media {
	position: relative;
	z-index: 2;
	isolation: isolate;

	display: flex;
	flex-direction: column;
	gap: clamp(1rem, 2vw, 1.4rem);

	width: 100%;
	min-width: 0;

	margin: 0 !important;

	overflow: visible;
}

/* EOS inner wrapper support */

body .page-section .page-section-media > .i {
	position: relative;

	display: flex;
	flex-direction: column;
	gap: inherit;

	width: 100%;
	min-width: 0;

	margin: 0 !important;
	padding: 0 !important;

	overflow: visible;
}

body .page-section .page-section-media > .layout-component,
body .page-section .page-section-media > .i > .layout-component {
	width: 100%;
	min-width: 0;

	margin: 0 !important;
}



/* ==========================================
   SHARED MEDIA CARD BASE
   Used by .page-image and .page-video
========================================== */

body .page-section .page-image,
body .page-section .page-video {
	position: relative;
	z-index: 2;
	isolation: isolate;

	width: 100%;
	min-width: 0;

	padding: clamp(0.65rem, 1.35vw, 0.95rem) !important;

	border-radius: var(--ww-radius-l);

	transform: translateZ(0);

	transition:
		transform var(--ww-transition-medium),
		box-shadow var(--ww-transition-medium),
		border-color var(--ww-transition-medium);
}

/* Inner content reset */

body .page-section .page-image > .content,
body .page-section .page-video > .content,
body .page-section .page-image .content,
body .page-section .page-video .content {
	position: relative;
	z-index: 2;

	width: 100%;
	min-width: 0;

	margin: 0 !important;
	padding: 0 !important;
}

/* ==========================================
   PAGE IMAGE
   Desktop: consistent cropped feature card.
   Tablet / mobile: natural image height.
========================================== */

body .page-section .page-image {
	display: flex;
	flex-direction: column;

	overflow: hidden;

	background:
		linear-gradient(180deg, rgba(255,255,255,1), rgba(255,255,255,.94));

	border: 1px solid rgba(217,147,14,.28);

	box-shadow:
		0 26px 76px rgba(0,0,0,.14),
		0 0 0 1px rgba(217,147,14,.06),
		inset 0 1px 0 rgba(255,255,255,.9);
}

/* Image top strip */

body .page-section .page-image::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	z-index: 4;

	width: 100%;
	height: 7px;

	background:
		linear-gradient(
			90deg,
			var(--ww-color-orange),
			rgba(217,147,14,.45),
			var(--ww-color-orange)
		);

	pointer-events: none;
}

/* Image soft corner glow */

body .page-section .page-image::after {
	content: "";
	position: absolute;
	right: -90px;
	bottom: -90px;
	z-index: 0;

	width: 230px;
	height: 230px;

	background: rgba(217,147,14,.12);
	border-radius: 999px;

	pointer-events: none;

	transition:
		transform var(--ww-transition-medium),
		opacity var(--ww-transition-medium);
}

body .page-section .page-image:hover,
body .page-section .page-image:focus-within {
	transform: translateY(-6px);

	border-color: rgba(217,147,14,.48);

	box-shadow:
		0 32px 86px rgba(0,0,0,.18),
		0 0 0 1px rgba(217,147,14,.09),
		inset 0 1px 0 rgba(255,255,255,.9);
}

body .page-section .page-image:hover::after,
body .page-section .page-image:focus-within::after {
	opacity: .9;
	transform: scale(1.16);
}

/* Direct image support and wrapped image support */


body .page-section {
	--ww-page-image-height: clamp(300px, 32vw, 620px);
}


body .page-section .page-image > img,
body .page-section .page-image .content img,
body .page-section .page-image .content p img {
	display: block;

	width: 100% !important;
	height: var(--ww-page-image-height) !important;
	max-width: none !important;

	margin: 0 !important;
	padding: 0 !important;

	object-fit: cover;
	object-position: center;

	border-radius: calc(var(--ww-radius-l) - 0.45rem);

	box-shadow: 0 16px 42px rgba(0,0,0,.16);

	transform: scale(1);

	transition:
		transform var(--ww-transition-medium),
		filter var(--ww-transition-medium);
}

body .page-section .page-image:hover > img,
body .page-section .page-image:focus-within > img,
body .page-section .page-image:hover .content img,
body .page-section .page-image:focus-within .content img,
body .page-section .page-image:hover .content p img,
body .page-section .page-image:focus-within .content p img {
	transform: scale(1.025);
	filter: saturate(1.04) contrast(1.02);
}

/* Content wrapper support when EOS outputs img inside .content or p */

body .page-section .page-image > .content,
body .page-section .page-image .content {
	flex: 1 1 auto;
	overflow: hidden;
}

body .page-section .page-image .content p,
body .page-section .page-image .content p:has(img) {
	margin: 0 !important;
	padding: 0 !important;
}

body .page-section .page-image .content p:has(img) {
	height: 100%;
}

/* ==========================================
   PAGE IMAGE TABLET / MOBILE
   Important: releases fixed heights so portrait
   images can display at their natural ratio.
========================================== */

@media (max-width: 1200px) {

	body .page-section .page-image {
		display: block;

		width: 100% !important;
		height: auto !important;
		min-height: 0 !important;
		max-height: none !important;

		overflow: hidden;
	}

	body .page-section .page-image > .content,
	body .page-section .page-image .content,
	body .page-section .page-image .content p,
	body .page-section .page-image .content p:has(img) {
		display: block;

		width: 100% !important;
		height: auto !important;
		min-height: 0 !important;
		max-height: none !important;

		flex: none !important;

		margin: 0 !important;
		padding: 0 !important;

		overflow: visible !important;
	}

	body .page-section .page-image > img,
	body .page-section .page-image .content img,
	body .page-section .page-image .content p img {
		display: block;

		width: 100% !important;
		height: auto !important;
		min-height: 0 !important;
		max-height: none !important;
		max-width: 100% !important;

		margin: 0 !important;
		padding: 0 !important;

		object-fit: contain !important;
		object-position: center center !important;

		transform: none;
	}

	body .page-section .page-image:hover,
	body .page-section .page-image:focus-within {
		transform: none;
	}

	body .page-section .page-image:hover > img,
	body .page-section .page-image:focus-within > img,
	body .page-section .page-image:hover .content img,
	body .page-section .page-image:focus-within .content img,
	body .page-section .page-image:hover .content p img,
	body .page-section .page-image:focus-within .content p img {
		transform: none;
		filter: saturate(1.02) contrast(1.01);
	}

	body .page-section .page-image:hover::after,
	body .page-section .page-image:focus-within::after {
		transform: none;
	}

}

@media (max-width: 767px) {

	body .page-section .page-image,
	body .page-section .page-video {
		padding: clamp(0.55rem, 3vw, 0.8rem) !important;
		border-radius: var(--ww-radius-m);
	}

	body .page-section .page-image::before {
		height: 6px;
	}

	body .page-section .page-image > img,
	body .page-section .page-image .content img,
	body .page-section .page-image .content p img {
		border-radius: calc(var(--ww-radius-m) - 0.35rem);
		box-shadow: 0 12px 30px rgba(0,0,0,.14);
	}

}

/* ==========================================
   PAGE VIDEO
   Cinematic video component
========================================== */

body .page-section .page-video {
	--ww-page-video-pad: clamp(0.65rem, 1.25vw, 0.95rem);
	--ww-video-corner-size: clamp(34px, 4vw, 54px);

	padding: var(--ww-page-video-pad) !important;

	overflow: visible;

	background:
		radial-gradient(circle at 18% 12%, rgba(217,147,14,.36), transparent 30%),
		radial-gradient(circle at 92% 86%, rgba(217,147,14,.22), transparent 34%),
		linear-gradient(145deg, rgba(0,0,0,1), rgba(25,25,25,1));

	border: 1px solid rgba(217,147,14,.52);

	box-shadow:
		0 34px 96px rgba(0,0,0,.34),
		0 0 0 1px rgba(217,147,14,.12),
		0 0 46px rgba(217,147,14,.12),
		inset 0 1px 0 rgba(255,255,255,.12);
}

/* Large ambient glow behind video */

body .page-section .page-video::before {
	content: "";
	position: absolute;
	inset: -22px;
	z-index: -2;

	background:
		radial-gradient(circle at 50% 50%, rgba(217,147,14,.24), transparent 58%);

	border-radius: calc(var(--ww-radius-l) + 1rem);

	filter: blur(18px);

	opacity: .9;

	pointer-events: none;
}

/* Offset orange shadow plate */

body .page-section .page-video::after {
	content: "";
	position: absolute;
	right: -18px;
	bottom: -18px;
	z-index: -1;

	width: 62%;
	height: 62%;

	background:
		linear-gradient(135deg, rgba(217,147,14,.8), rgba(217,147,14,.22));

	border-radius: var(--ww-radius-l);

	opacity: .55;

	pointer-events: none;

	transition:
		transform var(--ww-transition-medium),
		opacity var(--ww-transition-medium);
}

body .page-section .page-video:hover,
body .page-section .page-video:focus-within {
	transform: translateY(-6px);

	border-color: rgba(217,147,14,.78);

	box-shadow:
		0 42px 112px rgba(0,0,0,.42),
		0 0 0 1px rgba(217,147,14,.2),
		0 0 58px rgba(217,147,14,.18),
		inset 0 1px 0 rgba(255,255,255,.14);
}

body .page-section .page-video:hover::after,
body .page-section .page-video:focus-within::after {
	opacity: .78;

	transform: translate(5px, 5px);
}

/* Inner video surface */

body .page-section .page-video > .content,
body .page-section .page-video .content {
	aspect-ratio: 16 / 9;

	background: var(--ww-color-black);

	border: 1px solid rgba(255,255,255,.16);
	border-radius: calc(var(--ww-radius-l) - 0.45rem);

	box-shadow:
		0 18px 54px rgba(0,0,0,.42),
		inset 0 1px 0 rgba(255,255,255,.12);
}

/* Corner accents */

body .page-section .page-video > .content::before,
body .page-section .page-video > .content::after,
body .page-section .page-video .content::before,
body .page-section .page-video .content::after {
	content: "";
	position: absolute;
	z-index: 3;

	width: var(--ww-video-corner-size);
	height: var(--ww-video-corner-size);

	background: none;

	pointer-events: none;

	opacity: 1;

	transition:
		transform var(--ww-transition-medium),
		opacity var(--ww-transition-medium);
}

body .page-section .page-video > .content::before,
body .page-section .page-video .content::before {
	top: 0.85rem;
	left: 0.85rem;

	border-top: 3px solid var(--ww-color-orange);
	border-left: 3px solid var(--ww-color-orange);
	border-radius: 10px 0 0 0;
}

body .page-section .page-video > .content::after,
body .page-section .page-video .content::after {
	right: 0.85rem;
	bottom: 0.85rem;

	border-right: 3px solid var(--ww-color-orange);
	border-bottom: 3px solid var(--ww-color-orange);
	border-radius: 0 0 10px 0;
}

body .page-section .page-video:hover > .content::before,
body .page-section .page-video:focus-within > .content::before,
body .page-section .page-video:hover .content::before,
body .page-section .page-video:focus-within .content::before {
	transform: translate(-3px, -3px);
}

body .page-section .page-video:hover > .content::after,
body .page-section .page-video:focus-within > .content::after,
body .page-section .page-video:hover .content::after,
body .page-section .page-video:focus-within .content::after {
	transform: translate(3px, 3px);
}

body .page-section .page-video iframe {
	position: absolute;
	inset: 0;
	z-index: 1;

	display: block;

	width: 100% !important;
	height: 100% !important;

	margin: 0 !important;
	padding: 0 !important;

	border: 0 !important;

	transition:
		transform var(--ww-transition-medium),
		filter var(--ww-transition-medium);
}

body .page-section .page-video:hover iframe,
body .page-section .page-video:focus-within iframe {
	transform: scale(1.012);

	filter: saturate(1.05) contrast(1.03);
}

/* ==========================================
   PAGE CTA
========================================== */

body .page-section .page-cta {
	position: relative;
	z-index: 1;
	isolation: isolate;

	margin: 0 !important;
	padding: clamp(1.25rem, 2vw, 1.65rem) !important;

	background:
		radial-gradient(circle at 94% 15%, rgba(217,147,14,.15), transparent 34%),
		linear-gradient(180deg, rgba(255,255,255,1), rgba(255,255,255,.94));

	border: 1px solid rgba(217,147,14,.26);
	border-radius: var(--ww-radius-l);

	box-shadow:
		0 16px 44px rgba(0,0,0,.08),
		inset 0 1px 0 rgba(255,255,255,.9);

	overflow: hidden;
}

body .page-section .page-cta::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	z-index: 0;

	width: 6px;
	height: 100%;

	background: var(--ww-color-orange);

	pointer-events: none;
}

body .page-section .page-cta h1,
body .page-section .page-cta h2,
body .page-section .page-cta h3 {
	position: relative;
	z-index: 1;

	margin: 0 0 0.85rem !important;

	color: var(--ww-color-black);

	font-size: clamp(1.25rem, 1.65vw, 1.75rem);
	font-weight: 900;
	line-height: 1.08;
	letter-spacing: -0.04em;
}

body .page-section .page-cta p {
	position: relative;
	z-index: 1;

	margin: 0 0 1rem !important;

	color: rgba(0,0,0,.7);

	font-weight: 650;
	line-height: 1.55;
}

body .page-section .page-cta p:last-child {
	margin-bottom: 0 !important;
}

body .page-section .page-cta .button {
	position: relative;
	z-index: 1;
}

/* ==========================================
   PAGE CTA HIGHLIGHT BLOCK
   Elevated centred page summary / CTA card
========================================== */

/*
	Recommended HTML:

	<div class="layout-cell page-section ww-grid ww-grid--2 page-cta-highlight-block">
		<div class="i">
			<div class="layout-component page-content content">
				<h2>Get Involved</h2>
				<p>...</p>
				<p><em><strong>Highlighted message...</strong></em></p>
				<p><a class="button" href="#">Button</a></p>
			</div>
		</div>
	</div>

	Notes:
	- Modifier sits on .page-section.
	- Inner .page-content is lifted into an elevated summary card.
	- Works even if the parent still has ww-grid ww-grid--2.
	- Designed for h2, paragraphs, emphasis text and one or more buttons.
*/

body .page-section.page-cta-highlight-block {
	position: relative;
	isolation: isolate;

	background:
		radial-gradient(circle at 14% 18%, rgba(217,147,14,.16), transparent 34%),
		radial-gradient(circle at 88% 82%, rgba(217,147,14,.1), transparent 38%),
		linear-gradient(180deg, rgba(255,255,255,1), rgba(250,247,241,1));

	overflow: hidden;
}

body .page-section.page-cta-highlight-block::before {
	content: "";
	position: absolute;
	left: 50%;
	top: 50%;
	z-index: 0;

	width: min(760px, 92vw);
	aspect-ratio: 1 / 1;

	background:
		radial-gradient(circle, rgba(217,147,14,.18), rgba(217,147,14,.055) 42%, transparent 68%);

	border-radius: 999px;

	filter: blur(62px);

	transform: translate(-50%, -50%);

	pointer-events: none;
}

body .page-section.page-cta-highlight-block::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 0;

	background:
		linear-gradient(135deg, rgba(0,0,0,.045) 0 1px, transparent 1px 28px);

	opacity: .18;

	pointer-events: none;
}

/* Override any grid layout on this CTA section */

body .page-section.page-cta-highlight-block > .i {
	position: relative;
	z-index: 1;

	display: flex !important;
	align-items: center;
	justify-content: center;

	width: calc(100% - (var(--ww-page-gutter) * 2));
	max-width: var(--ww-container-max);

	margin-left: auto;
	margin-right: auto;

	min-height: clamp(280px, 28vw, 420px);
}

/* Elevated summary card */

body .page-section.page-cta-highlight-block .page-content,
body .page-section.page-cta-highlight-block > .i > .content {
	position: relative;
	isolation: isolate;

	width: min(100%, 920px);
	max-width: 920px;

	margin: 0 auto !important;
	padding: clamp(2rem, 4.5vw, 4rem) !important;

	background:
		radial-gradient(circle at 94% 14%, rgba(217,147,14,.16), transparent 34%),
		linear-gradient(180deg, rgba(255,255,255,1), rgba(255,255,255,.95));

	border: 1px solid rgba(217,147,14,.28);
	border-radius: var(--ww-radius-l);

	box-shadow:
		0 30px 86px rgba(0,0,0,.14),
		0 0 0 1px rgba(217,147,14,.06),
		inset 0 1px 0 rgba(255,255,255,.94);

	text-align: center;

	overflow: hidden;

	transform: translateY(-8px);
}

/* Orange top accent */

body .page-section.page-cta-highlight-block .page-content::before,
body .page-section.page-cta-highlight-block > .i > .content::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	z-index: 2;

	width: 100%;
	height: 7px;

	background:
		linear-gradient(
			90deg,
			var(--ww-color-orange),
			rgba(217,147,14,.42),
			var(--ww-color-orange)
		);

	pointer-events: none;
}

/* Soft corner bloom */

body .page-section.page-cta-highlight-block .page-content::after,
body .page-section.page-cta-highlight-block > .i > .content::after {
	content: "";
	position: absolute;
	right: -95px;
	bottom: -95px;
	z-index: 0;

	width: 250px;
	height: 250px;

	background: rgba(217,147,14,.11);
	border-radius: 999px;

	pointer-events: none;
}

/* Keep all actual content above decoration */

body .page-section.page-cta-highlight-block .page-content > *,
body .page-section.page-cta-highlight-block > .i > .content > * {
	position: relative;
	z-index: 1;
}

/* Heading */

body .page-section.page-cta-highlight-block h1,
body .page-section.page-cta-highlight-block h2 {
	max-width: 760px;

	margin: 0 auto clamp(1rem, 2vw, 1.35rem) !important;
	padding-bottom: 1rem;

	color: var(--ww-color-black);

	font-size: clamp(2.2rem, 4.5vw, 4.4rem);
	font-weight: 950;
	line-height: 1.02;
	letter-spacing: -0.06em;
	text-align: center;
	text-wrap: balance;
}

body .page-section.page-cta-highlight-block h1::after,
body .page-section.page-cta-highlight-block h2::after {
	content: "";
	display: block;

	width: 86px;
	height: 5px;

	margin: 1rem auto 0;

	background: var(--ww-color-orange);
	border-radius: 999px;
}

/* Paragraphs */

body .page-section.page-cta-highlight-block p {
	max-width: 760px;

	margin: 0 auto 1.1rem !important;

	color: rgba(0,0,0,.72);

	font-size: clamp(1.05rem, 1.35vw, 1.22rem);
	font-weight: 650;
	line-height: 1.72;
	text-align: center;
}

body .page-section.page-cta-highlight-block p:last-child {
	margin-bottom: 0 !important;
}

/* Highlighted emphasis line */

body .page-section.page-cta-highlight-block p:has(em strong),
body .page-section.page-cta-highlight-block p:has(strong em) {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.65rem;

	width: auto;
	max-width: min(100%, 780px);

	margin-top: clamp(0.6rem, 1.5vw, 1rem) !important;
	margin-bottom: clamp(1.25rem, 2vw, 1.75rem) !important;
	padding: 0.85rem 1.15rem !important;

	background: rgba(217,147,14,.12);
	color: var(--ww-color-black);

	border: 1px solid rgba(217,147,14,.28);
	border-radius: 999px;

	box-shadow:
		0 12px 30px rgba(0,0,0,.06),
		inset 0 1px 0 rgba(255,255,255,.85);

	font-size: clamp(1rem, 1.2vw, 1.12rem);
	font-weight: 900;
	line-height: 1.35;
}

body .page-section.page-cta-highlight-block p:has(em strong)::before,
body .page-section.page-cta-highlight-block p:has(strong em)::before {
	content: "";

	display: block;

	width: 0.62rem;
	height: 0.62rem;

	background: var(--ww-color-orange);
	border: 3px solid var(--ww-color-black);
	border-radius: 999px;

	box-shadow: 0 0 0 5px rgba(217,147,14,.16);

	flex: 0 0 auto;
}

body .page-section.page-cta-highlight-block p:has(em strong) em,
body .page-section.page-cta-highlight-block p:has(em strong) strong,
body .page-section.page-cta-highlight-block p:has(strong em) em,
body .page-section.page-cta-highlight-block p:has(strong em) strong {
	font-style: normal;
	font-weight: inherit;
}

/* Button flow */

body .page-section.page-cta-highlight-block .button,
body .page-section.page-cta-highlight-block a.button,
body .page-section.page-cta-highlight-block .component-footer .button {
	position: relative;
	z-index: 2;

	margin-top: clamp(0.35rem, 1vw, 0.75rem);
}

body .page-section.page-cta-highlight-block p:has(.button),
body .page-section.page-cta-highlight-block .component-footer {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 0.75rem;

	max-width: none;

	margin-top: clamp(1.25rem, 2vw, 1.75rem) !important;
}

/* ==========================================
   PAGE CTA HIGHLIGHT BLOCK RESPONSIVE
========================================== */

@media (max-width: 767px) {

	body .page-section.page-cta-highlight-block > .i {
		min-height: 0;
	}

	body .page-section.page-cta-highlight-block .page-content,
	body .page-section.page-cta-highlight-block > .i > .content {
		padding: clamp(1.5rem, 7vw, 2.25rem) !important;

		border-radius: var(--ww-radius-m);

		transform: none;
	}

	body .page-section.page-cta-highlight-block h1,
	body .page-section.page-cta-highlight-block h2 {
		font-size: clamp(2rem, 10vw, 3rem);
	}

	body .page-section.page-cta-highlight-block p {
		font-size: 1rem;
		line-height: 1.65;
	}

	body .page-section.page-cta-highlight-block p:has(em strong),
	body .page-section.page-cta-highlight-block p:has(strong em) {
		display: flex;
		align-items: flex-start;
		justify-content: flex-start;

		width: 100%;

		border-radius: var(--ww-radius-m);

		text-align: left;
	}

	body .page-section.page-cta-highlight-block p:has(em strong)::before,
	body .page-section.page-cta-highlight-block p:has(strong em)::before {
		margin-top: 0.22rem;
	}

	body .page-section.page-cta-highlight-block p:has(.button),
	body .page-section.page-cta-highlight-block .component-footer {
		flex-direction: column;
		align-items: stretch;
	}

	body .page-section.page-cta-highlight-block .button,
	body .page-section.page-cta-highlight-block a.button {
		width: 100%;
	}

}

/* ==========================================
   BLOCKQUOTE
   General page-section testimonial style
========================================== */

body .page-section .page-section-content blockquote {
	position: relative;
	isolation: isolate;

	margin: clamp(1.5rem, 3vw, 2.25rem) !important;
	padding: clamp(1.5rem, 3vw, 2.25rem) !important;

	background:
		radial-gradient(circle at 95% 10%, rgba(217,147,14,.16), transparent 34%),
		linear-gradient(180deg, rgba(255,255,255,1), rgba(255,255,255,.94));

	border: 1px solid rgba(217,147,14,.24);
	border-left: 7px solid var(--ww-color-orange);
	border-radius: var(--ww-radius-l);

	box-shadow:
		0 18px 48px rgba(0,0,0,.08),
		inset 0 1px 0 rgba(255,255,255,.9);

	overflow: hidden;
}

body .page-section .page-section-content blockquote::before {
	content: "“";
	position: absolute;
	right: clamp(1rem, 2vw, 1.5rem);
	top: -0.25rem;
	z-index: 0;

	color: rgba(217,147,14,.18);

	font-size: clamp(5rem, 10vw, 9rem);
	font-weight: 900;
	line-height: 1;

	pointer-events: none;
}

body .page-section .page-section-content blockquote p {
	position: relative;
	z-index: 1;

	margin: 0 0 1rem !important;

	color: rgba(0,0,0,.72);

	font-size: clamp(1rem, 1.2vw, 1.12rem);
	font-weight: 650;
	line-height: 1.72;
}


body .page-section.fill-brand-1 .page-section-content blockquote p {	color: rgba(0,0,0,.72) !important;}

body .page-section .page-section-content blockquote p:last-child {
	margin-bottom: 0 !important;
}

body .page-section .page-section-content blockquote strong {
	color: var(--ww-color-black);

	font-weight: 900;
}

/* ==========================================
   PAGE SECTION MEDIA OVERLAP MODIFIER
   Class stays on .page-section and cascades to .page-section-media
========================================== */

/*
	Desktop behaviour:
	- .page-section-content remains in normal grid flow.
	- .page-section-content controls the row height.
	- .page-section-media is absolutely positioned into the right column.
	- .page-section-media height matches the content-driven row.
	- .page-section-media is shifted down by --ww-page-section-media-drop.
	- .page-section keeps a safe bottom padding so long text does not clip.
	- If .page-image or .page-video is the only media component, it fills all available media height.
	- If there are two components, media uses flex layout and each component takes appropriate space.
*/

@media (min-width: 1201px) {

	body .page-section.page-section-media-overlap {
		--ww-page-section-overlap-safe-bottom: clamp(1.25rem, 2.2vw, 2.5rem);
		--ww-page-section-media-drop: clamp(3.25rem, 5.5vw, 5rem);
		--ww-page-section-media-gap: clamp(2rem, 5vw, 5rem);
		--ww-page-section-media-min-height: clamp(360px, 34vw, 540px);

		position: relative !important;
		z-index: 20 !important;

		padding-bottom: var(--ww-page-section-overlap-safe-bottom) !important;

		overflow: visible !important;
	}

	body .page-section.page-section-media-overlap > .i {
		position: relative !important;
		z-index: 2 !important;

		display: grid !important;
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
		gap: var(--ww-page-section-media-gap) !important;
		align-items: stretch !important;

		min-height: var(--ww-page-section-media-min-height);

		overflow: visible !important;
	}

	/* Content column stays in normal flow and controls the row height */

	body .page-section.page-section-media-overlap .page-section-content {
		position: relative !important;
		z-index: 4 !important;

		grid-column: 1 / 2 !important;
		grid-row: 1 !important;

		align-self: start !important;

	}

	/* Media column is positioned over the right column and matched to the content row */

	body .page-section.page-section-media-overlap .page-section-media {
		position: absolute !important;
		top: var(--ww-page-section-media-drop) !important;
		right: 0 !important;
		bottom: calc(var(--ww-page-section-media-drop) * -1) !important;
		z-index: 8 !important;

		display: flex !important;
		flex-direction: column !important;

		width: calc((100% - var(--ww-page-section-media-gap)) / 2) !important;
		height: auto !important;
		min-height: 0 !important;

		margin: 0 !important;
		padding: 0 !important;

		overflow: visible !important;

		transform: none !important;
	}

	body .page-section.page-section-media-overlap .page-section-media > .i {
		position: relative !important;
		z-index: 8 !important;

		display: flex !important;
		flex-direction: column !important;
		gap: clamp(1rem, 2vw, 1.4rem) !important;

		width: 100% !important;
		height: 100% !important;
		min-height: 0 !important;

		margin: 0 !important;
		padding: 0 !important;

		overflow: visible !important;
	}

	/* Allow media children to work as a true vertical stack */

	body .page-section.page-section-media-overlap .page-section-media > .i > .layout-component {
		width: 100% !important;
		min-width: 0 !important;

		margin: 0 !important;
	}

	/* Single media component fills the available matched height */

	body .page-section.page-section-media-overlap .page-section-media > .i > .page-image:only-child,
	body .page-section.page-section-media-overlap .page-section-media > .i > .page-video:only-child {
		flex: 1 1 auto !important;

		height: 100% !important;
		min-height: 0 !important;

		margin: 0 !important;
	}

	/* If there are two components, first media component takes remaining space */

	body .page-section.page-section-media-overlap .page-section-media > .i > .page-image:first-child:not(:only-child),
	body .page-section.page-section-media-overlap .page-section-media > .i > .page-video:first-child:not(:only-child) {
		flex: 1 1 auto !important;

		height: auto !important;
		min-height: 0 !important;

		margin: 0 !important;
	}

	/* CTA or secondary component keeps natural height */

	body .page-section.page-section-media-overlap .page-section-media > .i > .page-cta,
	body .page-section.page-section-media-overlap .page-section-media > .i > .layout-component:not(.page-image):not(.page-video) {
		flex: 0 0 auto !important;
	}

	/* Image fills the media card from the top */

	body .page-section.page-section-media-overlap .page-section-media .page-image > img,
	body .page-section.page-section-media-overlap .page-section-media .page-image .content,
	body .page-section.page-section-media-overlap .page-section-media .page-image .content p,
	body .page-section.page-section-media-overlap .page-section-media .page-image .content img {
		height: 100% !important;
		min-height: 0 !important;
	}

	body .page-section.page-section-media-overlap .page-section-media .page-image > img,
	body .page-section.page-section-media-overlap .page-section-media .page-image .content img {
		width: 100% !important;
		max-width: none !important;

		object-fit: cover !important;
		object-position: top center !important;
	}

	/* Video fills the media card when used in overlap mode */

	body .page-section.page-section-media-overlap .page-section-media .page-video > .content,
	body .page-section.page-section-media-overlap .page-section-media .page-video .content {
		flex: 1 1 auto !important;

		height: 100% !important;
		min-height: 0 !important;

		aspect-ratio: auto !important;
	}

	body .page-section.page-section-media-overlap .page-section-media .page-video iframe {
		position: absolute !important;
		inset: 0 !important;

		width: 100% !important;
		height: 100% !important;
	}

	/* Keep the following section behind the overlap */

	body .page-section.page-section-media-overlap + .page-section,
	body .page-section.page-section-media-overlap + .layout-cell {
		position: relative !important;
		z-index: 1 !important;
	}

	/* Optional class to disable overlap without removing the parent modifier */

	body .page-section.page-section-media-overlap.page-section-media-overlap--off {
		padding-bottom: clamp(4.5rem, 7vw, var(--ww-space-xl)) !important;
	}

	body .page-section.page-section-media-overlap.page-section-media-overlap--off .page-section-media {
		position: relative !important;
		top: auto !important;
		right: auto !important;
		bottom: auto !important;

		width: 100% !important;
		height: auto !important;
		min-height: 0 !important;
	}

	body .page-section.page-section-media-overlap.page-section-media-overlap--off .page-section-media > .i {
		height: auto !important;
	}

}

/* ==========================================
   PAGE SECTION MEDIA OVERLAP RESPONSIVE
========================================== */

@media (min-width: 768px) and (max-width: 1200px) {

	body .page-section.ww-grid > .i {
		gap: clamp(2rem, 4vw, 3rem);
	}

	body .page-section.page-section-media-overlap {
		overflow: visible !important;
	}

	body .page-section.page-section-media-overlap .page-section-media {
		position: relative !important;
		top: auto !important;
		right: auto !important;
		bottom: auto !important;

		width: 100% !important;
		height: auto !important;
		min-height: 0 !important;

		margin: 0 !important;
	}

	body .page-section.page-section-media-overlap .page-section-media > .i {
		height: auto !important;
		min-height: 0 !important;
	}

	body .page-section .page-video::after {
		right: -12px;
		bottom: -12px;
	}

}

@media (max-width: 767px) {

	body .page-section.ww-grid > .i {
		gap: 2rem;
	}

	body .page-section .page-section-media {
		gap: 1rem;
	}

	body .page-section .page-section-media > .i {
		gap: inherit;
	}

	body .page-section.page-section-media-overlap {
		overflow: hidden;
	}

	body .page-section.page-section-media-overlap .page-section-media {
		position: relative !important;
		top: auto !important;
		right: auto !important;
		bottom: auto !important;

		width: 100% !important;
		height: auto !important;
		min-height: 0 !important;

		margin: 0 !important;
	}

	body .page-section.page-section-media-overlap .page-section-media > .i,
	body .page-section.page-section-media-overlap .page-section-media .page-image,
	body .page-section.page-section-media-overlap .page-section-media .page-video {
		height: auto !important;
		min-height: 0 !important;
		max-height: none !important;
	}

	body .page-section .page-image,
	body .page-section .page-video,
	body .page-section .page-cta,
	body .page-section .page-section-content blockquote {
		border-radius: var(--ww-radius-m);
	}

	body .page-section .page-video::before {
		inset: -14px;
		filter: blur(14px);
	}

	body .page-section .page-video::after {
		right: -10px;
		bottom: -10px;
	}

	body .page-section .page-video > .content,
	body .page-section .page-video .content {
		border-radius: calc(var(--ww-radius-m) - 0.3rem);
	}

	body .page-section .page-video > .content::before,
	body .page-section .page-video .content::before {
		top: 0.6rem;
		left: 0.6rem;
	}

	body .page-section .page-video > .content::after,
	body .page-section .page-video .content::after {
		right: 0.6rem;
		bottom: 0.6rem;
	}

}

@media (max-width: 480px) {

	body .page-section .page-image,
	body .page-section .page-video {
		padding: 0.5rem !important;
	}

	body .page-section .page-video::after {
		display: none;
	}

	body .page-section .page-video {
		--ww-video-corner-size: 30px;
	}

	body .page-section .page-video > .content::before,
	body .page-section .page-video > .content::after,
	body .page-section .page-video .content::before,
	body .page-section .page-video .content::after {
		border-width: 2px;
	}

}

/* ==========================================
   02. SPLIT CONTENT SYSTEMS
========================================== */

/* ==========================================
   SPLIT CONTENT
   Layout shape is handled in responsive default tabs.
========================================== */

/*
	Standard usage:
	<div class="layout-cell split-content split-content--2">
		<div class="i">
			<div class="layout-cell split-content-image">...</div>
			<div class="layout-cell split-content-text">...</div>
		</div>
	</div>
*/

body .split-content {
	background: var(--ww-color-white);
}

body .split-content > .i > .layout-cell {
	min-height: clamp(380px, 42vw, 620px);
}

/* Image side */

body .split-content-image {
	overflow: hidden;
}

body .split-content-image .layout-component,
body .split-content-image .textblock,
body .split-content-image .textblock p {
	height: 100%;
}

body .split-content-image .textblock p {
	margin: 0;
}

body .split-content-image img {
	display: block;

	width: 100%;
	height: 100%;
	min-height: clamp(380px, 42vw, 620px);

	object-fit: cover;
}

/* Text side */

body .split-content-text {
	position: relative;
	isolation: isolate;

	display: flex;
	align-items: center;

	min-height: clamp(380px, 42vw, 620px);
	padding: clamp(2.5rem, 6vw, 6rem);

	border-radius: 0;

	overflow: hidden;
}

body .split-content-text.justify {
	justify-content: center;
}

body .split-content-text > .i {
	position: relative;
	z-index: 2;

	width: 100%;
	max-width: 760px;
}

body .split-content-text .layout-component,
body .split-content-text .textblock {
	width: 100%;
}

body .split-content-text p {
	font-size: clamp(1.05rem, 1.4vw, 1.22rem);
	line-height: 1.75;
}

body .split-content-text h2 {
	margin-bottom: 1.25rem;
}

body .split-content-text p:last-child {
	margin-bottom: 0;
}

/* ==========================================
   SPLIT CONTENT BRAND EMBLEM BACKGROUNDS
   Decorative lift for split-content panels.
   Colour treatment is handled separately by fill-brand classes.
========================================== */

body .split-content-text.left-content::before,
body .split-content-text.right-content::before {
	content: "";
	position: absolute;
	z-index: 1;

	width: clamp(340px, 46vw, 760px);
	aspect-ratio: 1 / 1;

	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;

	transform-origin: center;

	pointer-events: none;

	transition:
		transform 0.8s ease,
		opacity 0.8s ease;
}

/* Soft depth layer */

body .split-content-text.left-content::after,
body .split-content-text.right-content::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 0;

	background:
		radial-gradient(circle at 78% 20%, rgba(255,255,255,.14), transparent 38%),
		radial-gradient(circle at 18% 78%, rgba(255,255,255,.08), transparent 34%);

	opacity: 0.9;

	pointer-events: none;
}

/* Content on right column: emblem pushed top/right */

body .split-content-text.right-content::before {
	top: -32%;
	right: -18%;

	background-image: url("/userfiles/css/images/4allemblemwhite.png");

	opacity: 0.43;

	transform: rotate(-10deg) scale(1);
}

/* Content on left column: emblem pushed left/bottom */

body .split-content-text.left-content::before {
	left: -22%;
	bottom: -26%;

	background-image: url("/userfiles/css/images/4allemblemwhite.png");

	opacity: 0.40;

	transform: rotate(10deg) scale(1);
}

/* Subtle interaction */

body .split-content-text.right-content:hover::before {
	opacity: 0.48;

	transform: rotate(-7deg) scale(1.04);
}

body .split-content-text.left-content:hover::before {
	opacity: 0.44;

	transform: rotate(7deg) scale(1.04);
}




/* ==========================================
   SPLIT CONTENT VOLUNTEER ROLES
   Main scoped role-card treatment appears later.
   Removed broad fill-brand list targeting to avoid
   styling every orange split-content list.
========================================== */

/* ==========================================
   SPLIT CONTENT IMAGE CARDS
   Reusable full-width image feature strip
========================================== */

/*
	Recommended HTML:
	<div class="layout-cell split-content split-content--4 split-content--image-cards">
		<div class="i">
			<div class="layout-cell">...</div>
			<div class="layout-cell">...</div>
			<div class="layout-cell">...</div>
			<div class="layout-cell">...</div>
		</div>
	</div>
*/

body .split-content--image-cards {
	position: relative;
	isolation: isolate;

	background: var(--ww-color-black);
}

body .split-content--image-cards > .i > .layout-cell {
	position: relative;
	isolation: isolate;

	min-height: clamp(280px, 28vw, 430px);

	background: var(--ww-color-black);

	overflow: hidden;
}

body .split-content--image-cards .layout-component,
body .split-content--image-cards .textblock {
	position: static;

	width: 100%;
	height: 100%;

	margin: 0 !important;
	padding: 0 !important;
}

body .split-content--image-cards .component-topper,
body .split-content--image-cards .component-topper p {
	width: 100%;
	height: 100%;

	margin: 0 !important;
	padding: 0 !important;
}

body .split-content--image-cards .component-topper img {
	display: block;

	width: 100% !important;
	height: 100% !important;
	max-width: none !important;

	margin: 0 !important;
	padding: 0 !important;

	object-fit: cover;
	object-position: center;

	transform: scale(1);

	transition:
		transform 0.55s ease,
		filter 0.55s ease;
}

body .split-content--image-cards > .i > .layout-cell::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;

	background:
		linear-gradient(180deg, rgba(0,0,0,.08), rgba(0,0,0,.68)),
		radial-gradient(circle at 22% 22%, rgba(217,147,14,.24), transparent 38%);

	pointer-events: none;

	transition:
		opacity var(--ww-transition-medium);
}

body .split-content--image-cards > .i > .layout-cell::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	z-index: 2;

	width: 100%;
	height: 6px;

	background: var(--ww-color-orange);

	transform: scaleX(.28);
	transform-origin: left center;

	pointer-events: none;

	transition: transform var(--ww-transition-medium);
}

body .split-content--image-cards h3 {
	position: absolute;
	left: clamp(1rem, 2vw, 1.65rem);
	right: clamp(1rem, 2vw, 1.65rem);
	bottom: clamp(1rem, 2vw, 1.45rem);
	z-index: 3;

	margin: 0 !important;
	padding: 0 !important;

	color: var(--ww-color-white);

	font-size: clamp(1.25rem, 2vw, 2.05rem);
	font-weight: 900;
	line-height: 1.08;
	letter-spacing: -0.04em;
	text-align: left;
	text-wrap: balance;

	text-shadow: 0 3px 16px rgba(0,0,0,.42);

	transition:
		color var(--ww-transition-fast),
		transform var(--ww-transition-fast);
}

body .split-content--image-cards > .i > .layout-cell:hover img,
body .split-content--image-cards > .i > .layout-cell:focus-within img {
	transform: scale(1.06);
	filter: saturate(1.05) contrast(1.04);
}

body .split-content--image-cards > .i > .layout-cell:hover::after,
body .split-content--image-cards > .i > .layout-cell:focus-within::after {
	transform: scaleX(1);
}

body .split-content--image-cards > .i > .layout-cell:hover h3,
body .split-content--image-cards > .i > .layout-cell:focus-within h3 {
	color: var(--ww-color-orange);

	transform: translateY(-4px);
}


/* ==========================================
   SPLIT IMAGE CARDS H3 TWO-LINE CONTROL
   Forces card headings into neat wrapped titles
========================================== */

body .split-content--image-cards .textblock h3 {
	display: block;

	max-width: 12ch;

	margin-right: auto !important;

	text-wrap: balance;
	line-height: 1.08;
}

/* Let the longer third title breathe slightly */

body .split-content--image-cards > .i > .layout-cell.i2 .textblock h3 {
	max-width: 15ch;
}


/* ==========================================
   SPLIT CONTENT RESPONSIVE
========================================== */

@media (max-width: 1200px) {

	body .split-content-text.left-content::before,
	body .split-content-text.right-content::before {
		width: clamp(320px, 68vw, 640px);
	}

	body .split-content-text.right-content::before {
		top: -28%;
		right: -20%;
	}

	body .split-content-text.left-content::before {
		left: -24%;
		bottom: -28%;
	}

}

@media (min-width: 768px) and (max-width: 1200px) {

	body .split-content--image-cards > .i > .layout-cell {
		min-height: 320px;
	}

}

@media (max-width: 767px) {

	body .split-content > .i > .layout-cell {
		min-height: auto;
	}

	body .split-content-image img {
		min-height: 320px;
	}

	body .split-content-text {
		min-height: auto;
		padding: var(--ww-space-m);
	}

	body .split-content-text.left-content::before,
	body .split-content-text.right-content::before {
		width: clamp(280px, 95vw, 460px);

		opacity: 0.50;
	}

	body .split-content-text.right-content::before {
		top: -18%;
		right: -36%;

		transform: rotate(-8deg) scale(1);
	}

	body .split-content-text.left-content::before {
		left: -36%;
		bottom: -18%;

		transform: rotate(8deg) scale(1);
	}

	body .split-content-text.left-content:hover::before,
	body .split-content-text.right-content:hover::before {
		transform: none;
	}

	body .split-content--image-cards > .i > .layout-cell {
		min-height: 260px;
	}

	body .split-content--image-cards h3 {
		font-size: clamp(1.45rem, 8vw, 2.15rem);
	}

}

@media (max-width: 480px) {

	body .split-content--image-cards > .i > .layout-cell {
		min-height: 230px;
	}

}

/* ==========================================
   SPLIT CONTENT CAPTIONED IMAGE
   Optional overlay text treatment for split-content image panels
========================================== */

/*
	Recommended HTML:
	<div class="layout-cell split-content split-content--1-3 split-content--captioned split-caption--glass">
		<div class="i">
			<div class="layout-cell split-content-image">
				<div class="layout-component content">
					<h4>Get Involved</h4>
					<div class="content">
						<img src="..." alt="">
					</div>
				</div>
			</div>

			<div class="layout-cell split-content-text fill-brand-2">...</div>
		</div>
	</div>

	Available variants:
	.split-caption--glass
	.split-caption--statement
	.split-caption--tab
*/

/* ==========================================
   BASE IMAGE PANEL SETUP
========================================== */

body .split-content.split-content--captioned .split-content-image {
	position: relative;
	isolation: isolate;

	overflow: hidden;
}

body .split-content.split-content--captioned .split-content-image .layout-component {
	position: relative;
	isolation: isolate;

	width: 100%;
	height: 100%;
	min-height: clamp(420px, 38vw, 680px);

	margin: 0 !important;
	padding: 0 !important;

	background: var(--ww-color-black);

	overflow: hidden;
}

/* Image canvas wrapper */

body .split-content.split-content--captioned .split-content-image .layout-component > .content {
	position: relative;
	isolation: isolate;

	width: 100%;
	height: 100%;
	min-height: inherit;

	margin: 0 !important;
	padding: 0 !important;

	overflow: hidden;
}

body .split-content.split-content--captioned .split-content-image .layout-component > .content p {
	width: 100%;
	height: 100%;

	margin: 0 !important;
	padding: 0 !important;
}

body .split-content.split-content--captioned .split-content-image img {
	display: block;

	width: 100% !important;
	height: 100% !important;
	min-height: inherit;
	max-width: none !important;

	margin: 0 !important;
	padding: 0 !important;

	object-fit: cover;
	object-position: center;

	transform: scale(1);

	transition:
		transform 0.75s ease,
		filter 0.75s ease;
}

/* ==========================================
   GRAPHIC IMAGE TREATMENT
========================================== */

/* Main mood layer */

body .split-content.split-content--captioned .split-content-image .layout-component > .content::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;

	background:
		linear-gradient(180deg, rgba(0,0,0,.02), rgba(0,0,0,.55)),
		radial-gradient(circle at 18% 18%, rgba(217,147,14,.26), transparent 34%),
		radial-gradient(circle at 86% 76%, rgba(217,147,14,.15), transparent 32%);

	pointer-events: none;

	transition:
		opacity var(--ww-transition-medium),
		background-position var(--ww-transition-medium);
}

/* Graphic texture: diagonal energy lines + soft dot pattern */

body .split-content.split-content--captioned .split-content-image .layout-component > .content::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 2;

	background:
		linear-gradient(
			135deg,
			transparent 0 55%,
			rgba(217,147,14,.32) 55% 55.45%,
			transparent 55.45% 100%
		),
		linear-gradient(
			135deg,
			transparent 0 66%,
			rgba(255,255,255,.18) 66% 66.22%,
			transparent 66.22% 100%
		),
		radial-gradient(circle, rgba(255,255,255,.18) 0 1px, transparent 1.5px);

	background-size:
		100% 100%,
		100% 100%,
		18px 18px;

	background-position:
		0 0,
		0 0,
		0 0;

	opacity: .42;

	mix-blend-mode: screen;

	pointer-events: none;

	transition:
		opacity var(--ww-transition-medium),
		background-position 0.9s ease;
}

/* Bottom orange accent line */

body .split-content.split-content--captioned .split-content-image .layout-component::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	z-index: 6;

	width: 100%;
	height: 7px;

	background:
		linear-gradient(
			90deg,
			var(--ww-color-orange),
			rgba(217,147,14,.35),
			var(--ww-color-orange)
		);

	transform: scaleX(.28);
	transform-origin: left center;

	pointer-events: none;

	transition: transform var(--ww-transition-medium);
}

/* Soft animated glow shape */

body .split-content.split-content--captioned .split-content-image .layout-component::before {
	content: "";
	position: absolute;
	right: -150px;
	top: -150px;
	z-index: 3;

	width: clamp(260px, 34vw, 520px);
	aspect-ratio: 1 / 1;

	background:
		radial-gradient(circle, rgba(217,147,14,.22), rgba(217,147,14,.06) 42%, transparent 66%);

	border-radius: 999px;

	filter: blur(8px);

	opacity: .78;

	pointer-events: none;

	transform: scale(.92);

	transition:
		transform 0.9s ease,
		opacity 0.9s ease;
}

/* Hover image behaviour */

body .split-content.split-content--captioned .split-content-image:hover img,
body .split-content.split-content--captioned .split-content-image:focus-within img {
	transform: scale(1.05);

	filter: saturate(1.06) contrast(1.04);
}

body .split-content.split-content--captioned .split-content-image:hover .layout-component::before,
body .split-content.split-content--captioned .split-content-image:focus-within .layout-component::before {
	opacity: .95;

	transform: scale(1.08) translate(-8px, 8px);
}

body .split-content.split-content--captioned .split-content-image:hover .layout-component::after,
body .split-content.split-content--captioned .split-content-image:focus-within .layout-component::after {
	transform: scaleX(1);
}

body .split-content.split-content--captioned .split-content-image:hover .layout-component > .content::after,
body .split-content.split-content--captioned .split-content-image:focus-within .layout-component > .content::after {
	opacity: .58;

	background-position:
		0 0,
		0 0,
		9px 9px;
}

/* ==========================================
   BASE CAPTION TYPOGRAPHY
========================================== */

body .split-content.split-content--captioned .split-content-image h4 {
	position: absolute;
	z-index: 7;

	margin: 0 !important;

	font-weight: 950;
	line-height: 1;
	letter-spacing: -0.045em;
	text-wrap: balance;

	pointer-events: none;

	transition:
		transform var(--ww-transition-medium),
		opacity var(--ww-transition-medium),
		background-color var(--ww-transition-medium),
		color var(--ww-transition-medium),
		border-color var(--ww-transition-medium);
}

/* ==========================================
   OPTION 1: GLASS BADGE
   Best all-rounder. Premium, readable, not too loud.
========================================== */

body .split-content.split-content--captioned.split-caption--glass .split-content-image h4,
body .split-content.split-content--captioned:not(.split-caption--statement):not(.split-caption--tab) .split-content-image h4 {
	left: clamp(1.25rem, 2.8vw, 2.5rem);
	bottom: clamp(1.25rem, 2.8vw, 2.5rem);

	max-width: min(420px, calc(100% - 2.5rem));

	padding: clamp(0.85rem, 1.4vw, 1.15rem) clamp(1rem, 1.8vw, 1.4rem);

	background:
		linear-gradient(180deg, rgba(0,0,0,.74), rgba(0,0,0,.58));

	color: var(--ww-color-white);

	border: 1px solid rgba(255,255,255,.18);
	border-left: 6px solid var(--ww-color-orange);
	border-radius: var(--ww-radius-m);

	box-shadow:
		0 18px 42px rgba(0,0,0,.3),
		inset 0 1px 0 rgba(255,255,255,.12);

	backdrop-filter: blur(10px);

	font-size: clamp(1.55rem, 3vw, 3.2rem);
}

body .split-content.split-content--captioned.split-caption--glass .split-content-image h4::after,
body .split-content.split-content--captioned:not(.split-caption--statement):not(.split-caption--tab) .split-content-image h4::after {
	content: "";
	display: block;

	width: 56px;
	height: 4px;

	margin-top: 0.65rem;

	background: var(--ww-color-orange);
	border-radius: 999px;

	transform: scaleX(.65);
	transform-origin: left center;

	transition: transform var(--ww-transition-medium);
}

body .split-content.split-content--captioned.split-caption--glass .split-content-image:hover h4,
body .split-content.split-content--captioned.split-caption--glass .split-content-image:focus-within h4,
body .split-content.split-content--captioned:not(.split-caption--statement):not(.split-caption--tab) .split-content-image:hover h4,
body .split-content.split-content--captioned:not(.split-caption--statement):not(.split-caption--tab) .split-content-image:focus-within h4 {
	transform: translateY(-6px);

	color: var(--ww-color-orange);
}

body .split-content.split-content--captioned.split-caption--glass .split-content-image:hover h4::after,
body .split-content.split-content--captioned.split-caption--glass .split-content-image:focus-within h4::after,
body .split-content.split-content--captioned:not(.split-caption--statement):not(.split-caption--tab) .split-content-image:hover h4::after,
body .split-content.split-content--captioned:not(.split-caption--statement):not(.split-caption--tab) .split-content-image:focus-within h4::after {
	transform: scaleX(1);
}

/* ==========================================
   OPTION 2: BIG STATEMENT
   Bolder editorial style. Great for emotional campaign panels.
========================================== */

body .split-content.split-content--captioned.split-caption--statement .split-content-image h4 {
	left: clamp(1.25rem, 3vw, 3rem);
	right: clamp(1.25rem, 3vw, 3rem);
	bottom: clamp(1.5rem, 4vw, 4rem);

	color: var(--ww-color-white);

	font-size: clamp(2.3rem, 5.5vw, 6.2rem);

	text-shadow:
		0 4px 20px rgba(0,0,0,.5),
		0 0 34px rgba(0,0,0,.35);
}

body .split-content.split-content--captioned.split-caption--statement .split-content-image h4::before {
	content: "";
	display: block;

	width: clamp(72px, 10vw, 140px);
	height: 7px;

	margin-bottom: clamp(0.85rem, 1.4vw, 1.25rem);

	background: var(--ww-color-orange);
	border-radius: 999px;

	box-shadow: 0 0 22px rgba(217,147,14,.25);

	transform: scaleX(.55);
	transform-origin: left center;

	transition: transform var(--ww-transition-medium);
}

body .split-content.split-content--captioned.split-caption--statement .split-content-image:hover h4,
body .split-content.split-content--captioned.split-caption--statement .split-content-image:focus-within h4 {
	transform: translateY(-8px);
}

body .split-content.split-content--captioned.split-caption--statement .split-content-image:hover h4::before,
body .split-content.split-content--captioned.split-caption--statement .split-content-image:focus-within h4::before {
	transform: scaleX(1);
}

/* ==========================================
   OPTION 3: ORANGE SIDE TAB
   Funkier. Feels more like a campaign label or impact tag.
========================================== */

body .split-content.split-content--captioned.split-caption--tab .split-content-image h4 {
	left: 0;
	bottom: clamp(1.35rem, 3vw, 2.5rem);

	max-width: min(440px, calc(100% - 2rem));

	padding: clamp(0.9rem, 1.4vw, 1.15rem) clamp(1.1rem, 2vw, 1.65rem);

	background: var(--ww-color-orange);
	color: var(--ww-color-black);

	border-radius: 0 var(--ww-radius-m) var(--ww-radius-m) 0;

	box-shadow:
		0 18px 42px rgba(0,0,0,.28),
		0 0 30px rgba(217,147,14,.18);

	font-size: clamp(1.55rem, 3vw, 3.05rem);
}

body .split-content.split-content--captioned.split-caption--tab .split-content-image h4::after {
	content: "";
	position: absolute;
	right: -18px;
	top: 0;

	width: 18px;
	height: 100%;

	background:
		linear-gradient(
			90deg,
			rgba(217,147,14,.55),
			rgba(217,147,14,0)
		);

	pointer-events: none;
}

body .split-content.split-content--captioned.split-caption--tab .split-content-image:hover h4,
body .split-content.split-content--captioned.split-caption--tab .split-content-image:focus-within h4 {
	transform: translateX(8px);
}

/* ==========================================
   RESPONSIVE
========================================== */

@media (max-width: 767px) {

	body .split-content.split-content--captioned .split-content-image .layout-component {
		min-height: 340px;
	}

	body .split-content.split-content--captioned.split-caption--glass .split-content-image h4,
	body .split-content.split-content--captioned:not(.split-caption--statement):not(.split-caption--tab) .split-content-image h4,
	body .split-content.split-content--captioned.split-caption--tab .split-content-image h4 {
		font-size: clamp(1.45rem, 8vw, 2.5rem);
	}

	body .split-content.split-content--captioned.split-caption--statement .split-content-image h4 {
		font-size: clamp(2.25rem, 12vw, 4rem);
	}

}

@media (max-width: 480px) {

	body .split-content.split-content--captioned .split-content-image .layout-component {
		min-height: 300px;
	}

	body .split-content.split-content--captioned.split-caption--glass .split-content-image h4,
	body .split-content.split-content--captioned:not(.split-caption--statement):not(.split-caption--tab) .split-content-image h4 {
		left: 1rem;
		right: 1rem;
		bottom: 1rem;

		max-width: none;
	}

	body .split-content.split-content--captioned .split-content-image .layout-component::before {
		right: -190px;
		top: -190px;
	}

}

/* ==========================================
   VOLUNTEER ROLES LIST
   Enhancement layer only
   Relies on split-content + fill-brand-2 base styling
========================================== */

body .split-content--volunteer-roles .split-content-text > .i {
	max-width: 980px;
}

/* ==========================================
   ROLE LIST GRID
========================================== */

body .split-content--volunteer-roles ul {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: clamp(0.8rem, 1.4vw, 1.15rem);

	margin: clamp(1.5rem, 3vw, 2.25rem) 0 0 !important;
	padding: 0 !important;

	list-style: none;
}

/* ==========================================
   ROLE CARDS
========================================== */

body .split-content--volunteer-roles li {
	position: relative;
	isolation: isolate;

	margin: 0 !important;
	padding: clamp(1rem, 1.6vw, 1.35rem) !important;

	background:
		radial-gradient(circle at 92% 10%, rgba(217,147,14,.18), transparent 34%),
		linear-gradient(180deg, rgba(255,255,255,.94), rgba(255,255,255,.84));

	border: 1px solid rgba(0,0,0,.14);
	border-radius: var(--ww-radius-m);

	box-shadow:
		0 12px 28px rgba(0,0,0,.12),
		inset 0 1px 0 rgba(255,255,255,.72);

	overflow: hidden;

	transition:
		transform var(--ww-transition-fast),
		box-shadow var(--ww-transition-fast),
		border-color var(--ww-transition-fast);
}

/* Black top accent */

body .split-content--volunteer-roles li::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;

	width: 100%;
	height: 5px;

	background: var(--ww-color-black);

	pointer-events: none;
}

/* Soft corner glow */

body .split-content--volunteer-roles li::after {
	content: "";
	position: absolute;
	right: -46px;
	bottom: -46px;
	z-index: 0;

	width: 118px;
	height: 118px;

	background: rgba(217,147,14,.16);
	border-radius: 999px;

	pointer-events: none;

	transition:
		transform var(--ww-transition-medium),
		opacity var(--ww-transition-medium);
}

body .split-content--volunteer-roles li:hover {
	transform: translateY(-5px);

	border-color: rgba(0,0,0,.28);

	box-shadow:
		0 18px 42px rgba(0,0,0,.18),
		inset 0 1px 0 rgba(255,255,255,.78);
}

body .split-content--volunteer-roles li:hover::after {
	opacity: .9;

	transform: scale(1.2);
}

/* ==========================================
   ROLE TEXT
========================================== */

body .split-content--volunteer-roles li h3 {
	position: relative;
	z-index: 2;

	display: flex;
	align-items: center;
	gap: .55rem;

	margin: 0 0 .55rem !important;

	color: var(--ww-color-black);

	font-size: clamp(1.05rem, 1.25vw, 1.32rem);
	font-weight: 950;
	line-height: 1.08;
	letter-spacing: -.035em;
}

body .split-content--volunteer-roles li p {
	position: relative;
	z-index: 2;

	margin: 0 !important;

	color: rgba(0,0,0,.76);

	font-size: clamp(.9rem, .95vw, 1rem);
	font-weight: 650;
	line-height: 1.52;
}

/* ==========================================
   OPTIONAL IMAGE ACCENT
   Keeps image base styling inherited from split-content
========================================== */

body .split-content--volunteer-roles .split-content-image {
	position: relative;
	isolation: isolate;
}

body .split-content--volunteer-roles .split-content-image::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	z-index: 3;

	width: 100%;
	height: 8px;

	background:
		linear-gradient(
			90deg,
			var(--ww-color-orange),
			rgba(217,147,14,.35),
			var(--ww-color-orange)
		);

	pointer-events: none;
}

/* ==========================================
   RESPONSIVE
========================================== */

@media (max-width: 1200px) {

	body .split-content--volunteer-roles ul {
		grid-template-columns: 1fr;
	}

}

@media (max-width: 767px) {

	body .split-content--volunteer-roles ul {
		margin-top: 1.5rem !important;
	}

	body .split-content--volunteer-roles li {
		padding: 1rem !important;

		border-radius: var(--ww-radius-s);
	}

}

@media (max-width: 480px) {

	body .split-content--volunteer-roles li h3 {
		align-items: flex-start;
	}

	body .split-content--volunteer-roles li h3::before {
		margin-top: .16rem;
	}

}

/* ==========================================
   03. CARD / FEATURE SECTIONS
========================================== */

/* ==========================================
   ICON CARD SECTION
   Reusable dark / brand icon card section
========================================== */

/*
	Recommended HTML:
	<div class="layout-cell page-section fill-brand-1 icon-card-section">
		<div class="i">
			<div class="layout-cell section-intro">...</div>
			<div class="layout-cell icon-card-grid ww-grid ww-grid--5">...</div>
		</div>
	</div>
*/

body .icon-card-section {
	position: relative;
	isolation: isolate;

	overflow: hidden;
}

/* Dark branded background */

body .icon-card-section.fill-brand-1 {
	background:
		radial-gradient(circle at 10% 20%, rgba(217,147,14,.22), transparent 32%),
		radial-gradient(circle at 90% 82%, rgba(217,147,14,.14), transparent 38%),
		var(--ww-color-black);

	color: var(--ww-color-white);
}

body .icon-card-section.fill-brand-1::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 0;

	background:
		linear-gradient(135deg, rgba(255,255,255,.055) 0 1px, transparent 1px 26px);

	opacity: .16;

	pointer-events: none;
}

body .icon-card-section::after {
	content: "";
	position: absolute;
	left: 50%;
	bottom: -180px;
	z-index: 0;

	width: min(760px, 90vw);
	aspect-ratio: 1 / 1;

	background: rgba(217,147,14,.16);
	border-radius: 999px;

	filter: blur(72px);

	transform: translateX(-50%);

	pointer-events: none;
}

body .icon-card-section > .i {
	position: relative;
	z-index: 1;
}

/* ==========================================
   ICON CARD SECTION INTRO
========================================== */

body .icon-card-section .section-intro h1,
body .icon-card-section .section-intro h2 {
	color: var(--ww-color-orange);
}

body .icon-card-section .section-intro p {
	color: rgba(255,255,255,.86);
}


body .icon-card-section .section-intro h3 {
  	color: rgba(255,255,255,.86);
}

/* ==========================================
   ICON CARD GRID
========================================== */

body .ww-grid.icon-card-grid > .i {
	align-items: stretch;
	gap: clamp(0.6rem, 1vw, 1rem);
}

/* White cards */

body .icon-card-grid > .i > .layout-component {
	position: relative;
	isolation: isolate;

	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;

	height: 100%;
	min-height: clamp(300px, 24vw, 390px);

	margin: 0 !important;
	padding: clamp(1.35rem, 2vw, 1.9rem) clamp(1rem, 1.45vw, 1.35rem) !important;

	background:
		linear-gradient(180deg, rgba(255,255,255,1), rgba(255,255,255,.94));

	border: 1px solid rgba(255,255,255,.2);
	border-radius: var(--ww-radius-l);

	box-shadow:
		0 18px 50px rgba(0,0,0,.24),
		inset 0 1px 0 rgba(255,255,255,.8);

	text-align: center;

	overflow: hidden;

	transition:
		transform var(--ww-transition-fast),
		border-color var(--ww-transition-fast),
		box-shadow var(--ww-transition-fast);
}

/* Orange top strip */

body .icon-card-grid > .i > .layout-component::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;

	width: 100%;
	height: 7px;

	background:
		linear-gradient(
			90deg,
			var(--ww-color-orange),
			rgba(217,147,14,.45),
			var(--ww-color-orange)
		);

	pointer-events: none;
}

/* Soft corner glow, like the stats cards */

body .icon-card-grid > .i > .layout-component::after {
	content: "";
	position: absolute;
	top: -70px;
	right: -70px;
	z-index: 0;

	width: 170px;
	height: 170px;

	background: rgba(217,147,14,.12);
	border-radius: 999px;

	pointer-events: none;

	transition:
		transform var(--ww-transition-medium),
		opacity var(--ww-transition-medium);
}

body .icon-card-grid > .i > .layout-component:hover {
	transform: translateY(-6px);

	border-color: rgba(217,147,14,.65);

	box-shadow:
		0 26px 70px rgba(0,0,0,.34),
		0 0 0 1px rgba(217,147,14,.12),
		inset 0 1px 0 rgba(255,255,255,.85);
}

body .icon-card-grid > .i > .layout-component:hover::after {
	opacity: .9;

	transform: scale(1.18);
}

/* ==========================================
   ICON TOPPER
========================================== */

body .icon-card-grid .component-topper {
	position: relative;
	z-index: 2;

	display: flex;
	align-items: center;
	justify-content: center;

	width: clamp(82px, 6vw, 106px);
	height: clamp(82px, 6vw, 106px);

	margin: 0 auto clamp(1rem, 1.6vw, 1.25rem) !important;
	padding: 0 !important;

	background:
		radial-gradient(circle at 35% 25%, rgba(255,255,255,.55), transparent 35%),
		var(--ww-color-orange);

	border: 7px solid rgba(217,147,14,.16);
	border-radius: 999px;

	box-shadow:
		0 14px 30px rgba(217,147,14,.25),
		inset 0 1px 0 rgba(255,255,255,.45);

	transition:
		transform var(--ww-transition-medium),
		box-shadow var(--ww-transition-medium);
}

body .icon-card-grid > .i > .layout-component:hover .component-topper {
	transform: translateY(-3px) scale(1.04);

	box-shadow:
		0 18px 36px rgba(217,147,14,.32),
		inset 0 1px 0 rgba(255,255,255,.55);
}

body .icon-card-grid .component-topper p {
	margin: 0 !important;
	padding: 0 !important;
}

body .icon-card-grid .component-topper img {
	display: block;

	width: clamp(46px, 3.7vw, 64px) !important;
	height: clamp(46px, 3.7vw, 64px) !important;

	margin: 0 auto !important;
	padding: 0 !important;

	object-fit: contain;

	filter:
		brightness(0) invert(1)
		drop-shadow(0 8px 14px rgba(0,0,0,.18));

	transition:
		transform var(--ww-transition-medium),
		filter var(--ww-transition-medium);
}

body .icon-card-grid > .i > .layout-component:hover .component-topper img {
	transform: scale(1.05);
}


body .icon-card-grid .component-footer {
	padding-top: 0.75rem;
}

/* ==========================================
   ICON CARD TEXT
========================================== */

body .icon-card-grid h2,
body .icon-card-grid h3 {
	position: relative;
	z-index: 2;

	margin: 0 0 0.75rem !important;

	color: var(--ww-color-black);

	font-size: clamp(1.1rem, 1.25vw, 1.48rem);
	font-weight: 900;
	line-height: 1.08;
	letter-spacing: -0.035em;
	text-align: center;
}

body .icon-card-grid h2::after,
body .icon-card-grid h3::after {
	content: "";
	display: block;

	width: 42px;
	height: 4px;

	margin: 0.65rem auto 0;

	background: var(--ww-color-orange);
	border-radius: 999px;
}

body .icon-card-grid p {
	position: relative;
	z-index: 2;

	color: rgba(0,0,0,.72);

	font-size: clamp(0.86rem, .92vw, .96rem);
	font-weight: 650;
	line-height: 1.52;
	text-align: center;
}

/* ==========================================
   ICON CARD SECTION RESPONSIVE
========================================== */

@media (min-width: 768px) and (max-width: 1200px) {

	body .icon-card-grid.ww-grid--5 > .i {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	body .icon-card-grid.ww-grid--5 > .i > .layout-component:last-child:nth-child(5) {
		grid-column: 2 / span 1;
	}

	body .icon-card-grid > .i > .layout-component {
		min-height: 320px;
	}

}

@media (max-width: 767px) {

	body .section-intro h1,
	body .section-intro h2 {
		font-size: clamp(2rem, 10vw, 3rem);
	}

	body .icon-card-section {
		padding-block: var(--ww-space-l);
	}

	body .icon-card-grid > .i {
		grid-template-columns: 1fr;
		gap: 1rem;
	}

	body .icon-card-grid > .i > .layout-component {
		min-height: auto;

		padding: var(--ww-space-m) !important;

		border-radius: var(--ww-radius-m);
	}

	body .icon-card-grid .component-topper {
		width: 82px;
		height: 82px;

		border-width: 7px;
	}

	body .icon-card-grid .component-topper img {
		width: 46px !important;
		height: 46px !important;
	}

}

@media (max-width: 480px) {

	body .icon-card-grid p {
		font-size: .92rem;
	}

}

/* ==========================================
   STATS STRIP
   Layout shape is handled in responsive default tabs.
========================================== */

body .stats-strip {
	position: relative;
	isolation: isolate;

	background:
		radial-gradient(circle at 12% 20%, rgba(217,147,14,.28), transparent 34%),
		radial-gradient(circle at 88% 82%, rgba(217,147,14,.18), transparent 38%),
		var(--ww-color-black);

	color: var(--ww-color-white);

	padding-block: clamp(4rem, 7vw, 7rem);

	overflow: hidden;
}

body .stats-strip::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -2;

	background:
		linear-gradient(135deg, rgba(255,255,255,.06) 0 1px, transparent 1px 24px);

	opacity: 0.18;

	pointer-events: none;
}

body .stats-strip::after {
	content: "";
	position: absolute;
	left: 50%;
	bottom: -160px;
	z-index: -1;

	width: min(720px, 90vw);
	aspect-ratio: 1 / 1;

	background: rgba(217,147,14,.18);
	border-radius: 999px;

	filter: blur(70px);

	transform: translateX(-50%);

	pointer-events: none;
}

body .stats-strip > .i {
	position: relative;
	z-index: 2;
}

/* Stat cards */

body .stats-strip .layout-component {
	position: relative;

	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;

	height: 100%;
	min-height: clamp(260px, 22vw, 340px);

	padding: clamp(1.75rem, 3vw, 2.75rem);

	background:
		linear-gradient(180deg, rgba(255,255,255,1), rgba(255,255,255,.94));

	border: 1px solid rgba(255,255,255,.2);
	border-radius: var(--ww-radius-l);

	text-align: center;

	box-shadow:
		0 18px 50px rgba(0,0,0,.24),
		inset 0 1px 0 rgba(255,255,255,.8);

	overflow: hidden;

	transition:
		transform var(--ww-transition-fast),
		box-shadow var(--ww-transition-fast),
		border-color var(--ww-transition-fast),
		background-color var(--ww-transition-fast);
}

body .stats-strip .layout-component::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;

	width: 100%;
	height: 7px;

	background:
		linear-gradient(
			90deg,
			var(--ww-color-orange),
			rgba(217,147,14,.45),
			var(--ww-color-orange)
		);
}

body .stats-strip .layout-component::after {
	content: "";
	position: absolute;
	top: -70px;
	right: -70px;

	width: 170px;
	height: 170px;

	background: rgba(217,147,14,.12);
	border-radius: 999px;

	pointer-events: none;

	transition:
		transform var(--ww-transition-medium),
		opacity var(--ww-transition-medium);
}

body .stats-strip .layout-component:hover {
	transform: translateY(-8px);

	border-color: rgba(217,147,14,.65);

	box-shadow:
		0 26px 70px rgba(0,0,0,.34),
		0 0 0 1px rgba(217,147,14,.12),
		inset 0 1px 0 rgba(255,255,255,.85);
}

body .stats-strip .layout-component:hover::after {
	opacity: 0.9;

	transform: scale(1.18);
}

/* Icon topper */

body .stats-strip .component-topper {
	position: relative;
	z-index: 2;

	display: flex;
	align-items: center;
	justify-content: center;

	width: clamp(72px, 7vw, 96px);
	height: clamp(72px, 7vw, 96px);

	margin: 0 auto clamp(1.1rem, 2vw, 1.5rem);

	background:
		radial-gradient(circle at 35% 25%, rgba(255,255,255,.55), transparent 35%),
		var(--ww-color-orange);

	border: 8px solid rgba(217,147,14,.16);
	border-radius: 999px;

	box-shadow:
		0 14px 30px rgba(217,147,14,.25),
		inset 0 1px 0 rgba(255,255,255,.45);

	transition:
		transform var(--ww-transition-medium),
		box-shadow var(--ww-transition-medium);
}

body .stats-strip .layout-component:hover .component-topper {
	transform: translateY(-3px) scale(1.04);

	box-shadow:
		0 18px 36px rgba(217,147,14,.32),
		inset 0 1px 0 rgba(255,255,255,.55);
}

body .stats-strip .component-topper img {
	display: block;

	width: clamp(34px, 3.8vw, 52px);
	height: clamp(34px, 3.8vw, 52px);

	object-fit: contain;
}

/* Number */

body .stats-strip .content {
	position: relative;
	z-index: 2;
}

body .stats-strip .content p {
	margin: 0 0 0.65rem;

	color: var(--ww-color-black);

	font-size: clamp(3rem, 5.5vw, 5.6rem);
	font-weight: 900;
	letter-spacing: -0.075em;
	line-height: 0.9;

	text-align: center;
}

/* Label */

body .stats-strip .component-footer {
	position: relative;
	z-index: 2;
}

body .stats-strip .component-footer p {
	margin: 0;

	color: var(--ww-color-black);

	font-size: clamp(0.95rem, 1.25vw, 1.12rem);
	font-weight: 850;
	line-height: 1.25;

	text-align: center;
}

body .stats-strip .component-footer p::before {
	content: "";
	display: block;

	width: 48px;
	height: 4px;

	margin: 0 auto 0.9rem;

	background: var(--ww-color-orange);
	border-radius: 999px;
}

/* ==========================================
   STATS STRIP RESPONSIVE
========================================== */

@media (min-width: 768px) and (max-width: 1200px) {

	body .stats-strip {
		padding-block: clamp(3.5rem, 7vw, 5.5rem);
	}

	body .stats-strip .layout-component {
		min-height: clamp(250px, 34vw, 320px);
	}

}

@media (max-width: 767px) {

	body .stats-strip {
		padding-block: var(--ww-space-l);
	}

	body .stats-strip .layout-component {
		min-height: 240px;

		padding: var(--ww-space-m);

		border-radius: var(--ww-radius-m);
	}

	body .stats-strip .component-topper {
		width: 72px;
		height: 72px;

		margin-bottom: 1rem;

		border-width: 7px;
	}

	body .stats-strip .component-topper img {
		width: 38px;
		height: 38px;
	}

	body .stats-strip .content p {
		font-size: clamp(2.8rem, 18vw, 4.6rem);
	}

}

/* ==========================================
   IMAGE CARD SECTION
   Fundraising / option cards
========================================== */

/*
	Recommended HTML:
	<div class="layout-cell page-section image-card-section fill-brand-1">
		<div class="i">
			<div class="layout-cell image-card-grid ww-grid ww-grid--2">
				<div class="i">
					<div class="layout-component content">
						<div class="component-topper">...</div>
						<h3>Heading</h3>
						<p>Text...</p>
						<div class="component-footer">...</div>
					</div>
				</div>
			</div>
		</div>
	</div>
*/

body .image-card-section {
	position: relative;
	isolation: isolate;

	overflow: hidden;
}

body .image-card-section > .i {
	position: relative;
	z-index: 1;
}

/* ==========================================
   CARD GRID
========================================== */

body .image-card-grid > .i {
	align-items: stretch;
	gap: clamp(1rem, 2vw, 1.6rem);
}

/* ==========================================
   CARD SHELL
========================================== */

body .image-card-grid > .i > .layout-component {
	--ww-image-card-bg: var(--ww-card-bg, var(--ww-color-white));
	--ww-image-card-heading: var(--ww-card-heading, var(--ww-color-black));
	--ww-image-card-text: var(--ww-card-text, rgba(0,0,0,.72));
	--ww-image-card-accent: var(--ww-card-accent, var(--ww-color-orange));

	position: relative;
	isolation: isolate;

	display: flex;
	flex-direction: column;

	height: 100%;

	margin: 0 !important;
	padding: clamp(1rem, 1.8vw, 1.35rem) !important;

	background:
		radial-gradient(circle at 92% 8%, rgba(217,147,14,.13), transparent 30%),
		linear-gradient(180deg, rgba(255,255,255,1), rgba(255,255,255,.96));

	border: 1px solid rgba(217,147,14,.26);
	border-radius: var(--ww-radius-l);

	box-shadow:
		0 22px 60px rgba(0,0,0,.18),
		inset 0 1px 0 rgba(255,255,255,.9);

	overflow: hidden;

	text-align: center;

	transition:
		transform var(--ww-transition-medium),
		box-shadow var(--ww-transition-medium),
		border-color var(--ww-transition-medium);
}

/* Top accent strip */

body .image-card-grid > .i > .layout-component::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	z-index: 4;

	width: 100%;
	height: 7px;

	background:
		linear-gradient(
			90deg,
			var(--ww-image-card-accent),
			rgba(217,147,14,.42),
			var(--ww-image-card-accent)
		);

	pointer-events: none;
}

/* Soft card glow */

body .image-card-grid > .i > .layout-component::after {
	content: "";
	position: absolute;
	right: -90px;
	bottom: -90px;
	z-index: 0;

	width: 220px;
	height: 220px;

	background: rgba(217,147,14,.11);
	border-radius: 999px;

	pointer-events: none;

	transition:
		transform var(--ww-transition-medium),
		opacity var(--ww-transition-medium);
}

body .image-card-grid > .i > .layout-component:hover,
body .image-card-grid > .i > .layout-component:focus-within {
	transform: translateY(-6px);

	border-color: rgba(217,147,14,.55);

	box-shadow:
		0 32px 78px rgba(0,0,0,.26),
		0 0 36px rgba(217,147,14,.12),
		inset 0 1px 0 rgba(255,255,255,.9);
}

body .image-card-grid > .i > .layout-component:hover::after,
body .image-card-grid > .i > .layout-component:focus-within::after {
	opacity: .95;

	transform: scale(1.14);
}

/* ==========================================
   IMAGE PRESENTATION AREA
========================================== */

body .image-card-grid .component-topper {
	position: relative;
	z-index: 2;
	isolation: isolate;

	margin: 0 0 clamp(1.25rem, 2vw, 1.7rem) !important;
	padding: clamp(0.65rem, 1.15vw, 0.95rem) !important;

	background:
		radial-gradient(circle at 88% 12%, rgba(217,147,14,.16), transparent 32%),
		linear-gradient(180deg, rgba(255,255,255,1), rgba(250,247,241,1));

	border: 1px solid rgba(217,147,14,.22);
	border-radius: calc(var(--ww-radius-l) - .45rem);

	box-shadow:
		inset 0 1px 0 rgba(255,255,255,.9),
		0 14px 34px rgba(0,0,0,.08);

	overflow: hidden;

	transition:
		border-color var(--ww-transition-medium),
		box-shadow var(--ww-transition-medium),
		transform var(--ww-transition-medium);
}

/* Graphic corner bloom */

body .image-card-grid .component-topper::before {
	content: "";
	position: absolute;
	top: -72px;
	right: -72px;
	z-index: 1;

	width: 180px;
	height: 180px;

	background:
		radial-gradient(circle, rgba(217,147,14,.2), rgba(217,147,14,.06) 45%, transparent 68%);

	border-radius: 999px;

	pointer-events: none;

	transition:
		transform var(--ww-transition-medium),
		opacity var(--ww-transition-medium);
}

/* Subtle shine and dotted graphic texture */

body .image-card-grid .component-topper::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 3;

	background:
		linear-gradient(135deg, rgba(255,255,255,.28), transparent 34%),
		linear-gradient(180deg, rgba(255,255,255,0), rgba(217,147,14,.075)),
		radial-gradient(circle, rgba(217,147,14,.16) 0 1px, transparent 1.5px);

	background-size:
		100% 100%,
		100% 100%,
		18px 18px;

	opacity: .42;

	pointer-events: none;

	transition:
		opacity var(--ww-transition-medium),
		background-position .75s ease;
}

body .image-card-grid > .i > .layout-component:hover .component-topper,
body .image-card-grid > .i > .layout-component:focus-within .component-topper {
	border-color: rgba(217,147,14,.38);

	box-shadow:
		inset 0 1px 0 rgba(255,255,255,.95),
		0 18px 42px rgba(0,0,0,.12),
		0 0 24px rgba(217,147,14,.08);
}

body .image-card-grid > .i > .layout-component:hover .component-topper::before,
body .image-card-grid > .i > .layout-component:focus-within .component-topper::before {
	opacity: .95;

	transform: scale(1.16) translate(-6px, 6px);
}

body .image-card-grid > .i > .layout-component:hover .component-topper::after,
body .image-card-grid > .i > .layout-component:focus-within .component-topper::after {
	opacity: .58;

	background-position:
		0 0,
		0 0,
		9px 9px;
}

body .image-card-grid .component-topper p {
	position: relative;
	z-index: 2;

	margin: 0 !important;
	padding: 0 !important;
}

body .image-card-grid .component-topper img {
	display: block;

	width: 100% !important;
	max-width: none !important;

	margin: 0 !important;
	padding: 0 !important;

	object-fit: contain;
	object-position: center;

	background: transparent;

	border-radius: calc(var(--ww-radius-l) - .8rem);

	filter:
		drop-shadow(0 12px 22px rgba(0,0,0,.08));

	transform: scale(1);

	transition:
		transform .7s ease,
		filter .7s ease;
}

body .image-card-grid > .i > .layout-component:hover .component-topper img,
body .image-card-grid > .i > .layout-component:focus-within .component-topper img {
	transform: scale(1.035);

	filter:
		saturate(1.04)
		contrast(1.02)
		drop-shadow(0 16px 28px rgba(0,0,0,.12));
}





/* ==========================================
   CARD TEXT
========================================== */

body .image-card-grid h3 {
	position: relative;
	z-index: 2;

	margin: 0 0 .85rem !important;

	color: var(--ww-image-card-heading);

	font-size: clamp(1.45rem, 2vw, 2rem);
	font-weight: 950;
	line-height: 1.05;
	letter-spacing: -.04em;
	text-align: center;
}

body .image-card-grid h3::after {
	content: "";
	display: block;

	width: 58px;
	height: 4px;

	margin: .75rem auto 0;

	background: var(--ww-image-card-accent);
	border-radius: 999px;
}

body .image-card-grid p {
	position: relative;
	z-index: 2;

	margin-left: auto;
	margin-right: auto;

	color: var(--ww-image-card-text);

	font-size: clamp(.95rem, 1vw, 1.02rem);
	line-height: 1.6;
	text-align: center;
}

body .image-card-grid p:last-of-type {
	margin-bottom: 0;
}

/* ==========================================
   CARD FOOTER
========================================== */

body .image-card-grid .component-footer {
	position: relative;
	z-index: 2;

	margin-top: auto !important;
	padding-top: clamp(1.25rem, 2vw, 1.7rem) !important;

	text-align: center;
}

body .image-card-grid .component-footer .button {
	position: relative;
	z-index: 2;
}


/* ==========================================
   IMAGE CARD BUTTON COLOUR FIX
   Black text in every state
========================================== */

body .image-card-section .image-card-grid .component-footer .button,
body .image-card-section .image-card-grid .component-footer .button:visited,
body .image-card-section .image-card-grid .component-footer .button:hover,
body .image-card-section .image-card-grid .component-footer .button:focus,
body .image-card-section .image-card-grid .component-footer a.button,
body .image-card-section .image-card-grid .component-footer a.button:visited,
body .image-card-section .image-card-grid .component-footer a.button:hover,
body .image-card-section .image-card-grid .component-footer a.button:focus {
	color: var(--ww-color-black) !important;
}

/* ==========================================
   RESPONSIVE
========================================== */

@media (max-width: 767px) {

	body .image-card-grid > .i {
		gap: 1rem;
	}

	body .image-card-grid > .i > .layout-component {
		padding: 1rem !important;

		border-radius: var(--ww-radius-m);
	}

	body .image-card-grid .component-topper {
		padding: 0.65rem !important;

		border-radius: calc(var(--ww-radius-m) - .3rem);
	}

	body .image-card-grid .component-topper img {


		border-radius: calc(var(--ww-radius-m) - .6rem);
	}

}

@media (max-width: 480px) {

	body .image-card-grid .component-topper img {

	}

}

/* ==========================================
   LOGO CARD SECTION
   Community hub / venue cards
========================================== */

/*
	Recommended HTML:

	<div class="layout-cell page-section fill-brand-1 logo-card-section">
		<div class="i">
			<div class="layout-cell section-intro">...</div>
			<div class="layout-cell ww-grid ww-grid--3">
				<div class="i">
					<div class="layout-component card-custom logo-card">
						<div class="component-topper">
							<img>
						</div>
						<h4>Card title</h4>
						<div class="content">...</div>
						<div class="component-footer">
							<a class="button">Find out more</a>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
*/

/* ==========================================
   SECTION SHELL
========================================== */

body .logo-card-section {
	position: relative;
	isolation: isolate;

	background:
		radial-gradient(circle at 12% 18%, rgba(217,147,14,.2), transparent 34%),
		radial-gradient(circle at 88% 86%, rgba(217,147,14,.12), transparent 38%),
		var(--ww-color-black);

	color: var(--ww-color-white);

	overflow: hidden;
}

body .logo-card-section::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 0;

	background:
		linear-gradient(135deg, rgba(255,255,255,.055) 0 1px, transparent 1px 26px);

	opacity: .16;

	pointer-events: none;
}

body .logo-card-section::after {
	content: "";
	position: absolute;
	left: 50%;
	bottom: -220px;
	z-index: 0;

	width: min(820px, 92vw);
	aspect-ratio: 1 / 1;

	background: rgba(217,147,14,.14);
	border-radius: 999px;

	filter: blur(76px);

	transform: translateX(-50%);

	pointer-events: none;
}

body .logo-card-section > .i {
	position: relative;
	z-index: 1;
}

/* ==========================================
   SECTION INTRO
========================================== */

body .logo-card-section .section-intro,
body .logo-card-section .cards-intro,
body .logo-card-section .location-intro {
	max-width: 820px;

	margin-left: auto !important;
	margin-right: auto !important;

	text-align: center;
}

body .logo-card-section .section-intro h1,
body .logo-card-section .section-intro h2,
body .logo-card-section .cards-intro h1,
body .logo-card-section .cards-intro h2,
body .logo-card-section .location-intro h1,
body .logo-card-section .location-intro h2 {
	margin: 0 0 0.9rem !important;

	color: var(--ww-color-orange);

	font-size: clamp(2.2rem, 5vw, 4.4rem);
	font-weight: 950;
	line-height: 1.02;
	letter-spacing: -0.06em;
	text-align: center;
	text-wrap: balance;
}

body .logo-card-section .section-intro p,
body .logo-card-section .cards-intro p,
body .logo-card-section .location-intro p {
	max-width: 640px;

	margin-left: auto !important;
	margin-right: auto !important;

	color: rgba(255,255,255,.86);

	font-size: clamp(1.05rem, 1.45vw, 1.24rem);
	font-weight: 650;
	line-height: 1.65;
	text-align: center;
}

/* ==========================================
   CARD GRID
========================================== */

body .logo-card-section .ww-grid > .i {
	align-items: stretch;
	gap: clamp(1rem, 2vw, 1.6rem);
}

/* ==========================================
   LOGO CARD SHELL
========================================== */

body .logo-card-section .logo-card {
	position: relative;
	isolation: isolate;

	display: flex;
	flex-direction: column;

	height: 100%;
	min-height: clamp(560px, 40vw, 760px);

	margin: 0 !important;
	padding: clamp(1rem, 1.8vw, 1.35rem) !important;

	background:
		radial-gradient(circle at 92% 10%, rgba(217,147,14,.13), transparent 30%),
		linear-gradient(180deg, rgba(255,255,255,1), rgba(255,255,255,.95));

	color: var(--ww-color-black);

	border: 1px solid rgba(217,147,14,.26);
	border-radius: var(--ww-radius-l);

	box-shadow:
		0 24px 68px rgba(0,0,0,.26),
		0 0 0 1px rgba(217,147,14,.06),
		inset 0 1px 0 rgba(255,255,255,.92);

	text-align: center;

	overflow: hidden;

	transition:
		transform var(--ww-transition-medium),
		box-shadow var(--ww-transition-medium),
		border-color var(--ww-transition-medium);
}

body .logo-card-section .logo-card::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	z-index: 4;

	width: 100%;
	height: 7px;

	background:
		linear-gradient(
			90deg,
			var(--ww-color-orange),
			rgba(217,147,14,.42),
			var(--ww-color-orange)
		);

	pointer-events: none;
}

body .logo-card-section .logo-card::after {
	content: "";
	position: absolute;
	right: -95px;
	bottom: -95px;
	z-index: 0;

	width: 240px;
	height: 240px;

	background: rgba(217,147,14,.11);
	border-radius: 999px;

	pointer-events: none;

	transition:
		transform var(--ww-transition-medium),
		opacity var(--ww-transition-medium);
}

body .logo-card-section .logo-card:hover,
body .logo-card-section .logo-card:focus-within {
	transform: translateY(-8px);

	border-color: rgba(217,147,14,.62);

	box-shadow:
		0 34px 88px rgba(0,0,0,.34),
		0 0 38px rgba(217,147,14,.13),
		inset 0 1px 0 rgba(255,255,255,.95);
}

body .logo-card-section .logo-card:hover::after,
body .logo-card-section .logo-card:focus-within::after {
	opacity: .95;

	transform: scale(1.16);
}

/* Keep card content above decorative layers */

body .logo-card-section .logo-card > * {
	position: relative;
	z-index: 2;
}

/* ==========================================
   LOGO TOPPER
   Larger, prominent logo presentation
========================================== */

body .logo-card-section .logo-card .component-topper {
	position: relative;
	isolation: isolate;

	display: flex;
	align-items: center;
	justify-content: center;

	min-height: clamp(250px, 24vw, 350px);

	margin: 0 0 clamp(1.15rem, 2vw, 1.6rem) !important;
	padding: clamp(1.15rem, 1.8vw, 1.65rem) !important;

	background:
		radial-gradient(circle at 88% 12%, rgba(217,147,14,.14), transparent 32%),
		linear-gradient(180deg, rgba(255,255,255,1), rgba(250,247,241,1));

	border: 1px solid rgba(217,147,14,.22);
	border-radius: calc(var(--ww-radius-l) - .45rem);

	box-shadow:
		inset 0 1px 0 rgba(255,255,255,.94),
		0 14px 34px rgba(0,0,0,.08);

	overflow: hidden;

	transition:
		transform var(--ww-transition-medium),
		border-color var(--ww-transition-medium),
		box-shadow var(--ww-transition-medium);
}

body .logo-card-section .logo-card .component-topper::before {
	content: "";
	position: absolute;
	top: -70px;
	right: -70px;
	z-index: 0;

	width: 180px;
	height: 180px;

	background:
		radial-gradient(circle, rgba(217,147,14,.2), rgba(217,147,14,.055) 45%, transparent 68%);

	border-radius: 999px;

	pointer-events: none;

	transition:
		transform var(--ww-transition-medium),
		opacity var(--ww-transition-medium);
}

body .logo-card-section .logo-card .component-topper::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;

	background:
		linear-gradient(135deg, rgba(255,255,255,.34), transparent 34%),
		radial-gradient(circle, rgba(217,147,14,.13) 0 1px, transparent 1.5px);

	background-size:
		100% 100%,
		18px 18px;

	opacity: .38;

	pointer-events: none;

	transition:
		opacity var(--ww-transition-medium),
		background-position .75s ease;
}

body .logo-card-section .logo-card:hover .component-topper,
body .logo-card-section .logo-card:focus-within .component-topper {
	border-color: rgba(217,147,14,.42);

	box-shadow:
		inset 0 1px 0 rgba(255,255,255,.96),
		0 18px 42px rgba(0,0,0,.12),
		0 0 26px rgba(217,147,14,.09);
}

body .logo-card-section .logo-card:hover .component-topper::before,
body .logo-card-section .logo-card:focus-within .component-topper::before {
	opacity: .95;

	transform: scale(1.16) translate(-6px, 6px);
}

body .logo-card-section .logo-card:hover .component-topper::after,
body .logo-card-section .logo-card:focus-within .component-topper::after {
	opacity: .55;

	background-position:
		0 0,
		9px 9px;
}

body .logo-card-section .logo-card .component-topper img {
	position: relative;
	z-index: 2;

	display: block;

	width: min(100%, 340px) !important;
	height: auto !important;
	max-height: 340px !important;

	margin: 0 auto !important;
	padding: 0 !important;

	object-fit: contain;
	object-position: center;

	filter: drop-shadow(0 12px 18px rgba(0,0,0,.08));

	transform: scale(1);

	transition:
		transform var(--ww-transition-medium),
		filter var(--ww-transition-medium);
}

body .logo-card-section .logo-card:hover .component-topper img,
body .logo-card-section .logo-card:focus-within .component-topper img {
	transform: scale(1.04);

	filter:
		saturate(1.04)
		contrast(1.02)
		drop-shadow(0 16px 24px rgba(0,0,0,.12));
}

/* ==========================================
   CARD TITLE
========================================== */

body .logo-card-section .logo-card h1,
body .logo-card-section .logo-card h2,
body .logo-card-section .logo-card h3,
body .logo-card-section .logo-card h4 {
	margin: 0 0 0.85rem !important;

	color: var(--ww-color-black);

	font-size: clamp(1.35rem, 1.75vw, 1.9rem);
	font-weight: 950;
	line-height: 1.08;
	letter-spacing: -0.04em;
	text-align: center;
	text-wrap: balance;
}

body .logo-card-section .logo-card h1::after,
body .logo-card-section .logo-card h2::after,
body .logo-card-section .logo-card h3::after,
body .logo-card-section .logo-card h4::after {
	content: "";
	display: block;

	width: 58px;
	height: 4px;

	margin: 0.75rem auto 0;

	background: var(--ww-color-orange);
	border-radius: 999px;
}

/* ==========================================
   CARD COPY
========================================== */

body .logo-card-section .logo-card .content {
	flex: 1 1 auto;

	width: 100%;

	margin: 0 !important;
	padding: 0 !important;
}

body .logo-card-section .logo-card .content p {
	margin: 0 0 0.8rem !important;

	color: rgba(0,0,0,.72);

	font-size: clamp(.95rem, 1vw, 1.02rem);
	font-weight: 600;
	line-height: 1.62;
	text-align: center;
}

body .logo-card-section .logo-card .content p:last-child {
	margin-bottom: 0 !important;
}

/* ==========================================
   CARD FOOTER
========================================== */

body .logo-card-section .logo-card .component-footer {
	position: relative;
	z-index: 2;

	margin-top: auto !important;
	padding-top: clamp(1.25rem, 2vw, 1.7rem) !important;

	text-align: center;
}

body .logo-card-section .logo-card .component-footer p {
	margin: 0 !important;
}

body .logo-card-section .logo-card .component-footer .button,
body .logo-card-section .logo-card .component-footer a.button {
	position: relative;
	z-index: 2;

	width: auto;
}

/* ==========================================
   RESPONSIVE
========================================== */

@media (min-width: 768px) and (max-width: 1200px) {

	body .logo-card-section .ww-grid--3 > .i {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: clamp(0.85rem, 1.6vw, 1.25rem);
	}

	body .logo-card-section .logo-card {
		min-height: 560px;
	}

	body .logo-card-section .logo-card .component-topper {
		min-height: 230px;
	}

	body .logo-card-section .logo-card .component-topper img {
		width: min(100%, 250px) !important;
		max-height: 250px !important;
	}

	body .logo-card-section .logo-card h1,
	body .logo-card-section .logo-card h2,
	body .logo-card-section .logo-card h3,
	body .logo-card-section .logo-card h4 {
		font-size: clamp(1.18rem, 2.1vw, 1.5rem);
	}

	body .logo-card-section .logo-card .content p {
		font-size: .94rem;
		line-height: 1.55;
	}

}

@media (max-width: 767px) {

	body .logo-card-section .ww-grid > .i {
		grid-template-columns: 1fr;
		gap: 1rem;
	}

	body .logo-card-section .logo-card {
		min-height: 0;

		padding: 1rem !important;

		border-radius: var(--ww-radius-m);
	}

	body .logo-card-section .logo-card .component-topper {
		min-height: 230px;

		padding: 1.1rem !important;

		border-radius: calc(var(--ww-radius-m) - .3rem);
	}

	body .logo-card-section .logo-card .component-topper img {
		width: min(100%, 240px) !important;
		max-height: 240px !important;
	}

	body .logo-card-section .logo-card h1,
	body .logo-card-section .logo-card h2,
	body .logo-card-section .logo-card h3,
	body .logo-card-section .logo-card h4 {
		font-size: clamp(1.35rem, 7vw, 1.9rem);
	}

	body .logo-card-section .logo-card .component-footer .button,
	body .logo-card-section .logo-card .component-footer a.button {
		width: 100%;
	}

}

@media (max-width: 480px) {

	body .logo-card-section .logo-card .component-topper {
		min-height: 200px;
	}

	body .logo-card-section .logo-card .component-topper img {
		width: min(100%, 210px) !important;
		max-height: 210px !important;
	}

}



/* ==========================================
   REDUCED MOTION
   Consolidated accessibility fallback for Specials
========================================== */




/* ==========================================
   04. CONTENT / ACTION UTILITIES
========================================== */

/* ==========================================
   PAGE CONTENT LISTS
   Reusable list styling for normal page-section content
========================================== */

/*
	Recommended HTML:

	<div class="layout-component page-content content">
		<div class="content">
			<h2>Heading</h2>
			<p>Intro text</p>
			<ul>
				<li>List item</li>
				<li>List item</li>
			</ul>
			<div class="venue-actions">
				<a class="button large" href="#">Hire Venue</a>
				<a class="button large" href="#">Enquire</a>
			</div>
		</div>
	</div>

	Notes:
	- Scoped to .page-content so it can be reused across normal content sections.
	- Use .plain-list on a ul if you ever want to opt out.
*/

/* ==========================================
   GENERIC PAGE CONTENT LIST
========================================== */

body .page-section .page-content ul:not(.plain-list) {
	display: grid;
	grid-template-columns: 1fr;
	gap: 0.65rem;

	margin: clamp(1.2rem, 2vw, 1.65rem) 0 !important;
	padding: 0 !important;

	list-style: none !important;
}

body .page-section .page-content ul:not(.plain-list) li {
	position: relative;
	isolation: isolate;

	display: flex;
	align-items: center;
	gap: 0.75rem;

	min-height: 52px;

	margin: 0 !important;
	padding: 0.85rem 1rem 0.85rem 3.25rem !important;

	background:
		radial-gradient(circle at 94% 18%, rgba(217,147,14,.13), transparent 34%),
		linear-gradient(180deg, rgba(255,255,255,1), rgba(255,255,255,.95));

	color: var(--ww-color-black);

	border: 1px solid rgba(217,147,14,.22);
	border-radius: var(--ww-radius-m);

	box-shadow:
		0 12px 30px rgba(0,0,0,.07),
		inset 0 1px 0 rgba(255,255,255,.9);

	font-size: clamp(0.98rem, 1.08vw, 1.08rem);
	font-weight: 750;
	line-height: 1.35;

	overflow: hidden;

	transition:
		transform var(--ww-transition-fast),
		box-shadow var(--ww-transition-fast),
		border-color var(--ww-transition-fast);
}

body .page-section .page-content ul:not(.plain-list) li::before {
	content: "";

	position: absolute;
	left: 1rem;
	top: 50%;
	z-index: 2;

	width: 1.35rem;
	height: 1.35rem;

	background:
		var(--ww-color-orange)
		url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5 12.5l4.2 4.2L19 7' fill='none' stroke='%23000000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")
		center / 68% 68%
		no-repeat;

	border-radius: 999px;

	box-shadow:
		0 8px 18px rgba(217,147,14,.24),
		0 0 0 5px rgba(217,147,14,.12);

	transform: translateY(-50%);
}

body .page-section .page-content ul:not(.plain-list) li::after {
	content: "";

	position: absolute;
	right: -42px;
	bottom: -42px;
	z-index: 0;

	width: 112px;
	height: 112px;

	background: rgba(217,147,14,.1);
	border-radius: 999px;

	pointer-events: none;

	transition:
		transform var(--ww-transition-medium),
		opacity var(--ww-transition-medium);
}

body .page-section .page-content ul:not(.plain-list) li:hover {
	transform: translateY(-3px);

	border-color: rgba(217,147,14,.42);

	box-shadow:
		0 18px 42px rgba(0,0,0,.1),
		0 0 0 1px rgba(217,147,14,.08),
		inset 0 1px 0 rgba(255,255,255,.95);
}

body .page-section .page-content ul:not(.plain-list) li:hover::after {
	opacity: .95;

	transform: scale(1.14);
}

/* Keep text above decoration */

body .page-section .page-content ul:not(.plain-list) li > * {
	position: relative;
	z-index: 1;
}
/* ==========================================
   ACTION BUTTON CONTAINER
   Venue / page footer CTA button row
========================================== */

body .action-button-container {
	position: relative;
	isolation: isolate;
	z-index: 2;

	width: 100%;
	min-width: 0;

	padding: clamp(1.25rem, 3vw, 2rem) !important;

	background:
		radial-gradient(circle at 12% 18%, rgba(217,147,14,.24), transparent 34%),
		radial-gradient(circle at 88% 82%, rgba(217,147,14,.16), transparent 38%),
		linear-gradient(180deg, rgba(0,0,0,1), rgba(20,20,20,1));

	border: 1px solid rgba(217,147,14,.34);

	box-shadow:
		0 24px 68px rgba(0,0,0,.2),
		0 0 0 1px rgba(217,147,14,.08),
		inset 0 1px 0 rgba(255,255,255,.1);

	overflow: hidden;
}

body .action-button-container::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;

	width: 100%;
	height: 7px;

	background:
		linear-gradient(
			90deg,
			var(--ww-color-orange),
			rgba(217,147,14,.42),
			var(--ww-color-orange)
		);

	pointer-events: none;
}

body .action-button-container::after {
	content: "";
	position: absolute;
	right: -90px;
	bottom: -90px;
	z-index: 0;

	width: 250px;
	height: 250px;

	background: rgba(217,147,14,.14);
	border-radius: 999px;

	pointer-events: none;
}

body .action-button-container .venue-actions,
body .venue-actions {
	position: relative;
	z-index: 2;

	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 0.85rem;

	width: 100%;

	margin: 0 !important;
	padding: 0 !important;
}

body .action-button-container .venue-actions .button,
body .action-button-container .venue-actions a.button,
body .venue-actions .button,
body .venue-actions a.button {
	min-width: clamp(150px, 12vw, 190px);

	margin: 0 !important;
}

/* ==========================================
   ACTION BUTTON CONTAINER
   Dark background button tweaks
========================================== */

body .action-button-container .button.clear-button,
body .action-button-container a.button.clear-button,
body .action-button-container .button.clear-button:link,
body .action-button-container a.button.clear-button:link,
body .action-button-container .button.clear-button:visited,
body .action-button-container a.button.clear-button:visited {
	background: transparent !important;
	color: var(--ww-color-white) !important;
	border-color: var(--ww-color-orange) !important;

	box-shadow:
		0 12px 30px rgba(0,0,0,.18),
		inset 0 0 0 1px var(--ww-color-orange) !important;
}

body .action-button-container .button.clear-button:hover,
body .action-button-container a.button.clear-button:hover,
body .action-button-container .button.clear-button:focus,
body .action-button-container a.button.clear-button:focus {
	background: var(--ww-color-orange) !important;
	color: var(--ww-color-black) !important;
	border-color: var(--ww-color-orange) !important;
}

body .action-button-container .button.black-button,
body .action-button-container a.button.black-button,
body .action-button-container .button.black-button:link,
body .action-button-container a.button.black-button:link,
body .action-button-container .button.black-button:visited,
body .action-button-container a.button.black-button:visited {
	background: var(--ww-color-black) !important;
	color: var(--ww-color-orange) !important;
	border-color: var(--ww-color-orange) !important;

	box-shadow:
		0 12px 30px rgba(0,0,0,.22),
		inset 0 0 0 1px var(--ww-color-orange) !important;
}

body .action-button-container .button.black-button:hover,
body .action-button-container a.button.black-button:hover,
body .action-button-container .button.black-button:focus,
body .action-button-container a.button.black-button:focus {
	background: var(--ww-color-white) !important;
	color: var(--ww-color-black) !important;
	border-color: var(--ww-color-white) !important;
}

/* ==========================================
   ACTION BUTTON CONTAINER RESPONSIVE
========================================== */

@media (max-width: 767px) {

	body .action-button-container {
		margin-top: 1.75rem !important;
		padding: 1rem !important;

		border-radius: var(--ww-radius-m);
	}

	body .action-button-container .venue-actions,
	body .venue-actions {
		flex-direction: column;
		align-items: stretch;
		gap: 0.7rem;
	}

	body .action-button-container .venue-actions .button,
	body .action-button-container .venue-actions a.button,
	body .venue-actions .button,
	body .venue-actions a.button {
		width: 100%;
		min-width: 0;
	}

}

/* ==========================================
   RESPONSIVE
========================================== */

@media (max-width: 767px) {

	body .page-section .page-content ul:not(.plain-list) {
		gap: 0.6rem;
	}

	body .page-section .page-content ul:not(.plain-list) li {
		min-height: 50px;

		padding: 0.8rem 0.9rem 0.8rem 3.05rem !important;

		border-radius: var(--ww-radius-s);

		font-size: 0.98rem;
	}

	body .page-section .page-content ul:not(.plain-list) li::before {
		left: 0.9rem;

		width: 1.25rem;
		height: 1.25rem;
	}


}

/* ==========================================
   REDUCED MOTION
========================================== */




/* ==========================================
   05. ONE-OFF SECTIONS
========================================== */

/* ==========================================
   HALL OF FAME IMAGE CARD SECTION
   Uses: .page-section.fill-brand-1.glow-up
         .image-card-section
         .card-custom.card-image

   Optional card elements:
   h4     = supporting tag / club / academy
   label  = main name
========================================== */

body .page-section.glow-up {
	--hall-card-radius: var(--ww-radius-l);
	--hall-card-image-ratio: 4 / 5;
	--hall-card-pad: clamp(0.7rem, 1.35vw, 1rem);
	--hall-card-glow: rgba(217,147,14,.28);
	--hall-card-hover-lift: 8px;
	--hall-card-hover-safe-space: calc(var(--hall-card-hover-lift) + 14px);

	position: relative;
	isolation: isolate;

	padding-bottom: clamp(3.5rem, 7vw, 6rem) !important;

	background:
		radial-gradient(circle at 14% 16%, rgba(217,147,14,.22), transparent 34%),
		radial-gradient(circle at 86% 78%, rgba(217,147,14,.16), transparent 32%),
		linear-gradient(180deg, rgba(0,0,0,1), rgba(18,18,18,1)) !important;

	overflow: hidden;
}

/* Soft decorative glow */

body .page-section.glow-up::before {
	content: "";
	position: absolute;
	left: 50%;
	top: clamp(2rem, 5vw, 4rem);
	z-index: 0;

	width: min(980px, 92vw);
	height: min(420px, 42vw);

	background:
		radial-gradient(circle at 50% 50%, rgba(217,147,14,.22), rgba(217,147,14,.08) 42%, transparent 72%);

	transform: translateX(-50%);

	pointer-events: none;
}

/* Subtle pitch-light texture */

body .page-section.glow-up::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 0;

	background:
		linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px),
		linear-gradient(180deg, rgba(255,255,255,.025) 1px, transparent 1px);

	background-size: 52px 52px;

	opacity: .22;

	pointer-events: none;
}

body .page-section.glow-up > .i {
	position: relative;
	z-index: 1;
}

/* ==========================================
   HALL OF FAME INTRO
========================================== */

body .page-section.glow-up .page-section-content {
	width: min(100%, 900px);
	margin: 0 auto clamp(2rem, 4vw, 3.25rem) !important;
	padding: 0 !important;

	text-align: center;
}

body .page-section.glow-up .page-section-content .page-content {
	margin: 0 !important;
	padding: 0 !important;
}

body .page-section.glow-up .page-section-content h2 {
	position: relative;

	display: inline-block;

	margin: 0 0 clamp(1rem, 2vw, 1.35rem) !important;
	padding-bottom: clamp(0.85rem, 1.5vw, 1.05rem) !important;

	color: var(--ww-color-white) !important;

	font-size: clamp(2.3rem, 5.4vw, 5.2rem);
	font-weight: 950;
	line-height: 0.95;
	letter-spacing: -0.065em;

	text-shadow:
		0 8px 28px rgba(0,0,0,.34),
		0 0 34px rgba(217,147,14,.14);
}

body .page-section.glow-up .page-section-content h2::after {
	content: "";
	position: absolute;
	left: 50%;
	bottom: 0;

	width: min(150px, 52vw);
	height: 7px;

	background:
		linear-gradient(
			90deg,
			transparent,
			var(--ww-color-orange),
			transparent
		);

	border-radius: 999px;

	transform: translateX(-50%);
}

body .page-section.glow-up .page-section-content p {
	width: min(100%, 760px);

	margin: 0 auto 1rem !important;

	color: rgba(255,255,255,.84) !important;

	font-size: clamp(1.08rem, 1.55vw, 1.28rem) !important;
	font-weight: 520;
	line-height: 1.78 !important;
}

body .page-section.glow-up .page-section-content p:last-child {
	margin-bottom: 0 !important;
}


/* ==========================================
   HALL OF FAME GRID
========================================== */

body .page-section.glow-up .image-card-section {
	width: 100%;
	min-width: 0;

	margin: 0 !important;
	padding: 0 !important;

	overflow: visible !important;
}

body .page-section.glow-up .image-card-section > .i {
	display: grid !important;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: clamp(1rem, 2vw, 1.5rem);

	width: 100%;
	min-width: 0;

	/*
		Hover runway:
		The cards lift upwards on hover.
		This top padding gives the orange shine room to move without being clipped.
	*/
	margin: calc(var(--hall-card-hover-safe-space) * -1) 0 0 !important;
	padding: var(--hall-card-hover-safe-space) 0 0 !important;

	overflow: visible !important;
}


/* ==========================================
   HALL OF FAME CARDS
========================================== */

body .page-section.glow-up .card-custom.card-image {
	position: relative;
	z-index: 1;
	isolation: isolate;

	display: flex;
	flex-direction: column;

	min-width: 0;
	height: 100%;

	margin: 0 !important;
	padding: var(--hall-card-pad) !important;

	background:
		linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.9));

	border: 1px solid rgba(217,147,14,.38);
	border-radius: var(--hall-card-radius);

	box-shadow:
		0 24px 60px rgba(0,0,0,.34),
		0 0 0 1px rgba(255,255,255,.08),
		inset 0 1px 0 rgba(255,255,255,.95);

	overflow: hidden;

	transform: translateY(0);

	transition:
		transform var(--ww-transition-medium),
		box-shadow var(--ww-transition-medium),
		border-color var(--ww-transition-medium);
}

/* Gold top shine */

body .page-section.glow-up .card-custom.card-image::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	z-index: 30;

	width: 100%;
	height: 7px;

	background:
		linear-gradient(
			90deg,
			rgba(217,147,14,.55),
			var(--ww-color-orange),
			rgba(255,230,170,1),
			var(--ww-color-orange),
			rgba(217,147,14,.55)
		);

	box-shadow:
		0 0 18px rgba(217,147,14,.28),
		0 1px 0 rgba(255,255,255,.2);

	opacity: 1;

	transform: scaleX(1);
	transform-origin: center;

	pointer-events: none;

	transition:
		transform var(--ww-transition-medium),
		box-shadow var(--ww-transition-medium),
		opacity var(--ww-transition-medium);
}

/* Card glow pool */

body .page-section.glow-up .card-custom.card-image::after {
	content: "";
	position: absolute;
	left: 50%;
	bottom: -70px;
	z-index: -1;

	width: 180px;
	height: 180px;

	background:
		radial-gradient(circle, rgba(217,147,14,.28), transparent 70%);

	border-radius: 999px;

	transform: translateX(-50%) scale(.9);
	opacity: .65;

	transition:
		transform var(--ww-transition-medium),
		opacity var(--ww-transition-medium);

	pointer-events: none;
}

body .page-section.glow-up .card-custom.card-image:hover,
body .page-section.glow-up .card-custom.card-image:focus-within {
	z-index: 5;

	transform: translateY(calc(var(--hall-card-hover-lift) * -1));

	border-color: rgba(217,147,14,.74);

	box-shadow:
		0 34px 80px rgba(0,0,0,.44),
		0 0 34px rgba(217,147,14,.18),
		0 0 0 1px rgba(255,255,255,.12),
		inset 0 1px 0 rgba(255,255,255,.95);
}

body .page-section.glow-up .card-custom.card-image:hover::before,
body .page-section.glow-up .card-custom.card-image:focus-within::before {
	opacity: 1;

	transform: scaleX(.92);

	box-shadow:
		0 0 26px rgba(217,147,14,.45),
		0 1px 0 rgba(255,255,255,.28);
}

body .page-section.glow-up .card-custom.card-image:hover::after,
body .page-section.glow-up .card-custom.card-image:focus-within::after {
	opacity: 1;
	transform: translateX(-50%) scale(1.18);
}


/* ==========================================
   IMAGE AREA
========================================== */

body .page-section.glow-up .card-custom.card-image .content {
	position: relative;

	order: 1;

	width: 100%;
	aspect-ratio: var(--hall-card-image-ratio);

	margin: 0 !important;
	padding: 0 !important;

	background:
		linear-gradient(180deg, rgba(0,0,0,.08), rgba(0,0,0,.16));

	border-radius:
		calc(var(--hall-card-radius) - 0.35rem)
		calc(var(--hall-card-radius) - 0.35rem)
		0
		0;

	overflow: hidden;
}

body .page-section.glow-up .card-custom.card-image .content::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 2;

	background:
		linear-gradient(180deg, rgba(0,0,0,0) 42%, rgba(0,0,0,.2) 100%),
		radial-gradient(circle at 50% 18%, rgba(255,255,255,.16), transparent 36%);

	pointer-events: none;
}

body .page-section.glow-up .card-custom.card-image img {
	display: block;

	width: 100% !important;
	height: 100% !important;
	min-height: 100% !important;

	margin: 0 !important;
	padding: 0 !important;

	object-fit: cover;
	object-position: center top;

	filter:
		saturate(1.04)
		contrast(1.03);

	transform: scale(1.001);

	transition:
		transform 0.55s ease,
		filter 0.55s ease;
}

body .page-section.glow-up .card-custom.card-image:hover img,
body .page-section.glow-up .card-custom.card-image:focus-within img {
	filter:
		saturate(1.12)
		contrast(1.05);

	transform: scale(1.06);
}


/* ==========================================
   NAME PLAQUE
========================================== */

body .page-section.glow-up .card-custom.card-image label {
	position: relative;
	z-index: 4;

	order: 2;

	display: flex !important;
	align-items: center;
	justify-content: center;

	min-height: clamp(58px, 5.2vw, 74px);

	margin: 0 !important;
	padding: clamp(0.85rem, 1.45vw, 1.05rem) clamp(0.85rem, 1.5vw, 1.15rem) !important;

	background:
		radial-gradient(circle at 50% 0%, rgba(217,147,14,.22), transparent 52%),
		linear-gradient(180deg, rgba(0,0,0,.98), rgba(18,18,18,1));

	color: var(--ww-color-white) !important;

	border-top: 1px solid rgba(217,147,14,.42);

	border-radius:
		0
		0
		calc(var(--hall-card-radius) - 0.35rem)
		calc(var(--hall-card-radius) - 0.35rem);

	box-shadow:
		inset 0 1px 0 rgba(255,255,255,.08),
		0 -10px 28px rgba(0,0,0,.18);

	font-size: clamp(1rem, 1.18vw, 1.18rem);
	font-weight: 950;
	line-height: 1.08;
	letter-spacing: -0.025em;
	text-align: center;

	white-space: normal;

	transition:
		color var(--ww-transition-fast),
		border-color var(--ww-transition-fast),
		box-shadow var(--ww-transition-fast);
}

body .page-section.glow-up .card-custom.card-image label::before {
	content: "";
	position: absolute;
	left: 50%;
	top: 0;

	width: 46px;
	height: 4px;

	background: var(--ww-color-orange);
	border-radius: 0 0 999px 999px;

	transform: translateX(-50%);

	box-shadow: 0 0 16px rgba(217,147,14,.32);

	transition:
		width var(--ww-transition-fast),
		box-shadow var(--ww-transition-fast);
}

body .page-section.glow-up .card-custom.card-image:hover label,
body .page-section.glow-up .card-custom.card-image:focus-within label {
	color: var(--ww-color-orange) !important;

	border-top-color: rgba(217,147,14,.7);

	box-shadow:
		inset 0 1px 0 rgba(255,255,255,.1),
		0 -12px 32px rgba(0,0,0,.22);
}

body .page-section.glow-up .card-custom.card-image:hover label::before,
body .page-section.glow-up .card-custom.card-image:focus-within label::before {
	width: 70px;

	box-shadow: 0 0 22px rgba(217,147,14,.5);
}


/* ==========================================
   OPTIONAL CARD H4
   Supporting club / academy / descriptor tag
========================================== */

body .page-section.glow-up .card-custom.card-image > h4 {
	position: relative;
	z-index: 4;

	order: 3;

	display: flex !important;
	align-items: center;
	justify-content: center;
	gap: 0.45rem;

	min-height: clamp(42px, 4.2vw, 54px);

	margin: 0 !important;
	padding: clamp(0.7rem, 1.15vw, 0.9rem) clamp(0.8rem, 1.35vw, 1rem) !important;

	background:
		linear-gradient(180deg, rgba(217,147,14,.14), rgba(217,147,14,.06)),
		rgba(255,255,255,.98);

	color: var(--ww-color-black) !important;

	border-top: 1px solid rgba(217,147,14,.28);
	border-radius:
		0
		0
		calc(var(--hall-card-radius) - 0.35rem)
		calc(var(--hall-card-radius) - 0.35rem);

	box-shadow:
		inset 0 1px 0 rgba(255,255,255,.88),
		0 -8px 22px rgba(0,0,0,.08);

	font-size: clamp(0.78rem, 0.95vw, 0.92rem);
	font-weight: 950;
	line-height: 1.15;
	letter-spacing: 0.035em;
	text-align: center;
	text-transform: uppercase;

	transition:
		color var(--ww-transition-fast),
		background-color var(--ww-transition-fast),
		border-color var(--ww-transition-fast),
		box-shadow var(--ww-transition-fast);
}

/* Hide genuinely empty optional h4s */

body .page-section.glow-up .card-custom.card-image > h4:empty {
	display: none !important;
}

/*
	If a card has h4, make the main label a middle plaque:
	image top, name plaque middle, h4 tag bottom.
*/

body .page-section.glow-up .card-custom.card-image:has(> h4:not(:empty)) label {
	border-radius: 0;
}

body .page-section.glow-up .card-custom.card-image:has(> h4:not(:empty)) label::after {
	content: "";
	position: absolute;
	left: 50%;
	bottom: -1px;

	width: min(70%, 160px);
	height: 1px;

	background:
		linear-gradient(
			90deg,
			transparent,
			rgba(217,147,14,.42),
			transparent
		);

	transform: translateX(-50%);

	pointer-events: none;
}

body .page-section.glow-up .card-custom.card-image:hover > h4,
body .page-section.glow-up .card-custom.card-image:focus-within > h4 {
	color: var(--ww-color-black) !important;

	background:
		linear-gradient(180deg, rgba(217,147,14,.28), rgba(217,147,14,.12)),
		rgba(255,255,255,1);

	border-top-color: rgba(217,147,14,.48);

	box-shadow:
		inset 0 1px 0 rgba(255,255,255,.9),
		0 -10px 26px rgba(0,0,0,.1);
}


/* ==========================================
   HALL OF FAME RESPONSIVE
========================================== */

@media (min-width: 768px) and (max-width: 1200px) {

	body .page-section.glow-up .image-card-section > .i {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	body .page-section.glow-up .card-custom.card-image {
		--hall-card-image-ratio: 5 / 4;
	}

}

@media (max-width: 767px) {

	body .page-section.glow-up {
		--hall-card-hover-lift: 6px;
		--hall-card-hover-safe-space: calc(var(--hall-card-hover-lift) + 12px);

		padding-bottom: clamp(3rem, 10vw, 4.5rem) !important;
	}

	body .page-section.glow-up .page-section-content {
		margin-bottom: 1.75rem !important;
	}

	body .page-section.glow-up .image-card-section > .i {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 0.9rem;

		margin: calc(var(--hall-card-hover-safe-space) * -1) 0 0 !important;
		padding: var(--hall-card-hover-safe-space) 0 0 !important;

		overflow: visible !important;
	}

	body .page-section.glow-up .card-custom.card-image {
		--hall-card-pad: 0.6rem;
		--hall-card-image-ratio: 4 / 5;

		border-radius: var(--ww-radius-m);
	}

	body .page-section.glow-up .card-custom.card-image .content {
		border-radius:
			calc(var(--ww-radius-m) - 0.25rem)
			calc(var(--ww-radius-m) - 0.25rem)
			0
			0;
	}

	body .page-section.glow-up .card-custom.card-image label {
		min-height: 56px;

		border-radius:
			0
			0
			calc(var(--ww-radius-m) - 0.25rem)
			calc(var(--ww-radius-m) - 0.25rem);

		font-size: 0.95rem;
	}

	body .page-section.glow-up .card-custom.card-image > h4 {
		min-height: 42px;

		border-radius:
			0
			0
			calc(var(--ww-radius-m) - 0.25rem)
			calc(var(--ww-radius-m) - 0.25rem);

		font-size: 0.74rem;
		letter-spacing: 0.03em;
	}

	body .page-section.glow-up .card-custom.card-image:has(> h4:not(:empty)) label {
		border-radius: 0;
	}

}

@media (max-width: 480px) {

	body .page-section.glow-up .image-card-section > .i {
		grid-template-columns: 1fr;
	}

	body .page-section.glow-up .card-custom.card-image {
		--hall-card-image-ratio: 5 / 4;
	}

	body .page-section.glow-up .card-custom.card-image > h4 {
		font-size: 0.78rem;
	}

}


/* ==========================================
   AWARDS & ACHIEVEMENTS SECTION
   4 ALL Foundation

   Current HTML structure:
   .awards-section
   .awardsintro
   .page-image-stack
   .page-section-cards.awards
   .layout-component.textblock
   .content
   .component-footer
========================================== */

body .awards-section {
	--awards-radius: var(--ww-radius-l);
	--awards-radius-small: var(--ww-radius-m);
	--awards-gold: var(--ww-color-orange);
	--awards-card-bg: var(--ww-color-white);
	--awards-card-border: rgba(217,147,14,.24);
	--awards-card-text: rgba(0,0,0,.72);

	position: relative;
	isolation: isolate;

	width: 100%;
	min-width: 0;

	margin: 0 !important;
	padding:
		clamp(3rem, 7vw, 6rem)
		0 !important;

	background:
		radial-gradient(circle at 12% 16%, rgba(217,147,14,.14), transparent 34%),
		radial-gradient(circle at 88% 82%, rgba(217,147,14,.10), transparent 36%),
		linear-gradient(180deg, rgba(255,255,255,1), rgba(250,247,241,1));

	overflow: hidden;
}

/* Soft background grid */

body .awards-section::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 0;

	background:
		linear-gradient(90deg, rgba(217,147,14,.045) 1px, transparent 1px),
		linear-gradient(180deg, rgba(217,147,14,.035) 1px, transparent 1px);

	background-size: 58px 58px;

	opacity: .48;

	pointer-events: none;
}

/* Soft gold glow */

body .awards-section::after {
	content: "";
	position: absolute;
	right: -150px;
	top: -150px;
	z-index: 0;

	width: clamp(280px, 36vw, 560px);
	height: clamp(280px, 36vw, 560px);

	background:
		radial-gradient(
			circle,
			rgba(217,147,14,.18),
			rgba(217,147,14,.07) 48%,
			transparent 74%
		);

	border-radius: 999px;

	pointer-events: none;
}

/* ==========================================
   AWARDS INNER LAYOUT
========================================== */

body .awards-section > .i {
	position: relative;
	z-index: 1;

	display: grid !important;
	grid-template-columns: 1fr;
	gap: clamp(1.5rem, 3.5vw, 2.75rem);

	width: calc(100% - (var(--ww-page-gutter) * 2));
	max-width: min(1160px, var(--ww-container-max));

	margin-left: auto !important;
	margin-right: auto !important;
	padding: 0 !important;
}

/* Reset direct child cells */

body .awards-section > .i > .layout-cell {
	width: 100% !important;
	max-width: none !important;
	min-width: 0 !important;

	margin: 0 !important;
	padding: 0 !important;

	float: none !important;
}

/* ==========================================
   AWARDS INTRO / HEADING
========================================== */

body .awards-section .awardsintro {
	position: relative;
	z-index: 1;

	width: 100%;

	margin: 0 auto !important;
	padding: 0 !important;

	text-align: center;
}

body .awards-section .awardsintro .page-image-stack {
	position: relative;

	width: 100%;
	max-width: 900px;

	margin: 0 auto !important;
	padding: 0 !important;

	text-align: center;
}

body .awards-section .awardsintro h2 {
	position: relative;

	display: inline-block;

	margin: 0 !important;
	padding-bottom: clamp(.85rem, 1.5vw, 1.05rem) !important;

	color: var(--ww-color-black) !important;

	font-size: clamp(2.15rem, 5vw, 4.6rem);
	font-weight: 950;
	line-height: .96;
	letter-spacing: -0.065em;
	text-align: center;
	text-wrap: balance;

	text-shadow:
		0 8px 28px rgba(0,0,0,.08);
}

body .awards-section .awardsintro h2::after {
	content: "";
	position: absolute;
	left: 50%;
	bottom: 0;

	width: min(160px, 52vw);
	height: 7px;

	background:
		linear-gradient(
			90deg,
			transparent,
			var(--awards-gold),
			transparent
		);

	border-radius: 999px;

	transform: translateX(-50%);
}

/* Decorative heading detail */

body .awards-section .awardsintro .page-image-stack::before {
	content: "";
	position: absolute;
	left: clamp(-1rem, -2vw, -1.5rem);
	top: clamp(2rem, 4vw, 4rem);
	z-index: -1;

	width: 94px;
	height: 94px;

	background:
		radial-gradient(circle, rgba(217,147,14,.38) 2px, transparent 3px);

	background-size: 14px 14px;

	opacity: .42;

	pointer-events: none;
}

body .awards-section .awardsintro .page-image-stack::after {
	content: "";
	position: absolute;
	right: clamp(-1rem, -2vw, -1.5rem);
	bottom: clamp(-2rem, -3vw, -1rem);
	z-index: -1;

	width: 120px;
	height: 120px;

	border: 18px solid rgba(217,147,14,.12);
	border-radius: 999px;

	pointer-events: none;
}

/* ==========================================
   AWARDS CARD GRID
========================================== */

body .awards-section .page-section-cards.awards {
	position: relative;
	z-index: 1;
	isolation: isolate;

	display: grid !important;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	align-items: stretch;
	gap: clamp(1rem, 2.5vw, 1.5rem);

	width: 100%;
	min-width: 0;

	margin: 0 auto !important;
	padding: 0 !important;
}

/* ==========================================
   AWARDS CARD SHELL
========================================== */

body .awards-section .page-section-cards.awards > .layout-component {
	position: relative;
	isolation: isolate;

	display: flex !important;
	flex-direction: column;

	width: 100% !important;
	min-width: 0;
	height: 100%;

	margin: 0 !important;
	padding: clamp(1rem, 1.8vw, 1.35rem) !important;

	background:
		radial-gradient(circle at 94% 12%, rgba(217,147,14,.13), transparent 32%),
		linear-gradient(180deg, rgba(255,255,255,1), rgba(255,255,255,.95));

	border: 1px solid var(--awards-card-border);
	border-radius: var(--awards-radius);

	box-shadow:
		0 22px 60px rgba(0,0,0,.12),
		0 0 0 1px rgba(255,255,255,.78),
		inset 0 1px 0 rgba(255,255,255,.95);

	overflow: hidden;

	transition:
		transform var(--ww-transition-medium),
		box-shadow var(--ww-transition-medium),
		border-color var(--ww-transition-medium);
}

/* Top gold strip */

body .awards-section .page-section-cards.awards > .layout-component::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	z-index: 4;

	width: 100%;
	height: 7px;

	background:
		linear-gradient(
			90deg,
			var(--awards-gold),
			rgba(217,147,14,.45),
			var(--awards-gold)
		);

	pointer-events: none;
}

/* Soft corner orb */

body .awards-section .page-section-cards.awards > .layout-component::after {
	content: "";
	position: absolute;
	right: -82px;
	bottom: -82px;
	z-index: 0;

	width: 210px;
	height: 210px;

	background: rgba(217,147,14,.10);
	border-radius: 999px;

	opacity: .6;

	pointer-events: none;

	transition:
		transform var(--ww-transition-medium),
		opacity var(--ww-transition-medium);
}

body .awards-section .page-section-cards.awards > .layout-component:hover,
body .awards-section .page-section-cards.awards > .layout-component:focus-within {
	transform: translateY(-6px);

	border-color: rgba(217,147,14,.48);

	box-shadow:
		0 30px 78px rgba(0,0,0,.16),
		0 0 30px rgba(217,147,14,.10),
		0 0 0 1px rgba(255,255,255,.84),
		inset 0 1px 0 rgba(255,255,255,.95);
}

body .awards-section .page-section-cards.awards > .layout-component:hover::after,
body .awards-section .page-section-cards.awards > .layout-component:focus-within::after {
	opacity: .9;
	transform: scale(1.16);
}

/* Keep real content above decoration */

body .awards-section .page-section-cards.awards > .layout-component > * {
	position: relative;
	z-index: 2;
}

/* ==========================================
   AWARDS LOGO AREA
========================================== */

body .awards-section .page-section-cards.awards > .layout-component > .content {
	position: relative;
	isolation: isolate;

	display: flex;
	align-items: center;
	justify-content: center;

	width: 100%;
	min-height: clamp(190px, 18vw, 260px);

	margin: 0 0 clamp(1rem, 1.8vw, 1.35rem) !important;
	padding: clamp(1rem, 1.8vw, 1.4rem) !important;

	background:
		radial-gradient(circle at 88% 14%, rgba(217,147,14,.14), transparent 34%),
		linear-gradient(180deg, rgba(255,255,255,1), rgba(250,247,241,1));

	border: 1px solid rgba(217,147,14,.2);
	border-radius: calc(var(--awards-radius) - .45rem);

	box-shadow:
		inset 0 1px 0 rgba(255,255,255,.92),
		0 14px 34px rgba(0,0,0,.07);

	overflow: hidden;
}

/* Logo area shine */

body .awards-section .page-section-cards.awards > .layout-component > .content::before {
	content: "";
	position: absolute;
	top: -72px;
	right: -72px;
	z-index: 0;

	width: 180px;
	height: 180px;

	background:
		radial-gradient(circle, rgba(217,147,14,.18), rgba(217,147,14,.055) 45%, transparent 70%);

	border-radius: 999px;

	pointer-events: none;

	transition:
		transform var(--ww-transition-medium),
		opacity var(--ww-transition-medium);
}

body .awards-section .page-section-cards.awards > .layout-component:hover > .content::before,
body .awards-section .page-section-cards.awards > .layout-component:focus-within > .content::before {
	opacity: .95;
	transform: scale(1.16) translate(-6px, 6px);
}

/* Logo image */

body .awards-section .page-section-cards.awards img {
	position: relative;
	z-index: 1;

	display: block !important;
	float: none !important;

	margin: 0 auto !important;
	padding: 0 !important;

	object-fit: contain !important;
	object-position: center !important;

	filter:
		saturate(1.02)
		contrast(1.02)
		drop-shadow(0 10px 16px rgba(0,0,0,.06));

	transition:
		transform var(--ww-transition-medium),
		filter var(--ww-transition-medium);
}


body .awards-section .page-section-cards.awards > .layout-component:hover img,
body .awards-section .page-section-cards.awards > .layout-component:focus-within img {
	transform: scale(1.035);

	filter:
		saturate(1.06)
		contrast(1.04)
		drop-shadow(0 14px 22px rgba(0,0,0,.09));
}

/* ==========================================
   AWARDS TEXT FOOTER
========================================== */

body .awards-section .page-section-cards.awards .component-footer {
	position: relative;
	z-index: 2;

	display: block;

	width: 100%;

	margin: 0 !important;
	padding: clamp(1rem, 1.8vw, 1.35rem) !important;

	background:
		linear-gradient(180deg, rgba(0,0,0,.98), rgba(18,18,18,1));

	color: var(--ww-color-white);

	border-radius: calc(var(--awards-radius) - .45rem);

	box-shadow:
		inset 0 1px 0 rgba(255,255,255,.08),
		0 14px 34px rgba(0,0,0,.14);

	text-align: center;

	overflow: hidden;
}

body .awards-section .page-section-cards.awards .component-footer::before {
	content: "";
	position: absolute;
	left: 50%;
	top: 0;
	z-index: 1;

	width: 70px;
	height: 5px;

	background: var(--awards-gold);
	border-radius: 0 0 999px 999px;

	transform: translateX(-50%);

	box-shadow: 0 0 18px rgba(217,147,14,.34);

	pointer-events: none;
}

/* Award year / title */

body .awards-section .page-section-cards.awards .component-footer h2 {
	position: relative;
	z-index: 2;

	margin: 0 0 .35rem !important;
	padding: 0 !important;

	color: var(--ww-color-white) !important;

	font-size: clamp(1.05rem, 1.35vw, 1.35rem);
	font-weight: 950;
	line-height: 1.08;
	letter-spacing: -0.035em;
	text-align: center;
	text-wrap: balance;
}

/* Add separation when a card has multiple awards */

body .awards-section .page-section-cards.awards .component-footer h2:not(:first-child) {
	margin-top: clamp(1rem, 1.8vw, 1.35rem) !important;
	padding-top: clamp(1rem, 1.8vw, 1.35rem) !important;

	border-top: 1px solid rgba(217,147,14,.28);
}

/* Award category */

body .awards-section .page-section-cards.awards .component-footer h3 {
	position: relative;
	z-index: 2;

	margin: 0 0 .3rem !important;
	padding: 0 !important;

	color: var(--awards-gold) !important;

	font-size: clamp(.95rem, 1.08vw, 1.08rem);
	font-weight: 850;
	line-height: 1.22;
	letter-spacing: -0.015em;
	text-align: center;
	text-wrap: balance;
}

/* Award result */

body .awards-section .page-section-cards.awards .component-footer p {
	position: relative;
	z-index: 2;

	display: inline-flex;
	align-items: center;
	justify-content: center;

	min-width: 84px;

	margin: .2rem auto 0 !important;
	padding: .42rem .75rem !important;

	background: rgba(217,147,14,.14);
	color: var(--ww-color-white) !important;

	border: 1px solid rgba(217,147,14,.36);
	border-radius: 999px;

	font-size: .86rem;
	font-weight: 900;
	line-height: 1.1;
	text-align: center;
	text-transform: uppercase;
	letter-spacing: .04em;
}

body .awards-section .page-section-cards.awards .component-footer p:last-child {
	margin-bottom: 0 !important;
}

/* ==========================================
   AWARDS RESPONSIVE
========================================== */

@media (max-width: 1100px) {

	body .awards-section > .i {
		max-width: min(960px, var(--ww-container-max));
	}

	body .awards-section .page-section-cards.awards {
		gap: 1rem;
	}

	body .awards-section .page-section-cards.awards > .layout-component {
		padding: 1rem !important;
	}

	body .awards-section .page-section-cards.awards > .layout-component > .content {
		min-height: 210px;
	}

	body .awards-section .page-section-cards.awards img {
		max-width: min(100%, 240px) !important;
		max-height: 170px !important;
	}

	body .awards-section .page-section-cards.awards > .layout-component:nth-child(2) img,
	body .awards-section .page-section-cards.awards > .layout-component:nth-child(3) img {
		max-width: min(100%, 255px) !important;
		max-height: 180px !important;
	}

	body .awards-section .page-section-cards.awards .component-footer {
		padding: 1rem !important;
	}

	body .awards-section .page-section-cards.awards .component-footer h2 {
		font-size: 1.05rem;
	}

	body .awards-section .page-section-cards.awards .component-footer h3 {
		font-size: .94rem;
	}

}

@media (max-width: 900px) {

	body .awards-section .page-section-cards.awards {
		grid-template-columns: 1fr;
		max-width: 620px;
	}

	body .awards-section .page-section-cards.awards > .layout-component {
		border-radius: var(--awards-radius-small);
	}

	body .awards-section .page-section-cards.awards > .layout-component > .content {
		min-height: 210px;
		border-radius: calc(var(--awards-radius-small) - .35rem);
	}

	body .awards-section .page-section-cards.awards img,
	body .awards-section .page-section-cards.awards > .layout-component:nth-child(2) img,
	body .awards-section .page-section-cards.awards > .layout-component:nth-child(3) img {
		max-width: min(100%, 290px) !important;
		max-height: 190px !important;
	}

	body .awards-section .page-section-cards.awards .component-footer {
		border-radius: calc(var(--awards-radius-small) - .35rem);
	}

}

@media (max-width: 767px) {

	body .awards-section {
		padding:
			clamp(2.25rem, 10vw, 3.5rem)
			0 !important;
	}

	body .awards-section > .i {
		gap: 1.25rem;
	}

	body .awards-section .awardsintro h2 {
		font-size: clamp(2rem, 12vw, 3.25rem);
	}

	body .awards-section .awardsintro .page-image-stack::before,
	body .awards-section .awardsintro .page-image-stack::after {
		display: none;
	}

	body .awards-section .page-section-cards.awards {
		gap: .9rem;
	}

	body .awards-section .page-section-cards.awards > .layout-component {
		padding: .9rem !important;
	}

	body .awards-section .page-section-cards.awards > .layout-component > .content {
		min-height: 190px;
		padding: 1rem !important;
	}

	body .awards-section .page-section-cards.awards img,
	body .awards-section .page-section-cards.awards > .layout-component:nth-child(2) img,
	body .awards-section .page-section-cards.awards > .layout-component:nth-child(3) img {
		max-width: min(100%, 260px) !important;
		max-height: 165px !important;
	}

	body .awards-section .page-section-cards.awards .component-footer h2:not(:first-child) {
		margin-top: 1rem !important;
		padding-top: 1rem !important;
	}

	body .awards-section .page-section-cards.awards .component-footer p {
		font-size: .78rem;
	}

}

@media (max-width: 480px) {

	body .awards-section .page-section-cards.awards > .layout-component > .content {
		min-height: 170px;
	}

	body .awards-section .page-section-cards.awards img,
	body .awards-section .page-section-cards.awards > .layout-component:nth-child(2) img,
	body .awards-section .page-section-cards.awards > .layout-component:nth-child(3) img {
		max-width: min(100%, 230px) !important;
		max-height: 145px !important;
	}

	body .awards-section .page-section-cards.awards .component-footer h2 {
		font-size: 1rem;
	}

	body .awards-section .page-section-cards.awards .component-footer h3 {
		font-size: .9rem;
	}

}

/* ==========================================
   AWARDS REDUCED MOTION
========================================== */

@media (prefers-reduced-motion: reduce) {

	body .awards-section .page-section-cards.awards > .layout-component,
	body .awards-section .page-section-cards.awards > .layout-component::after,
	body .awards-section .page-section-cards.awards > .layout-component > .content::before,
	body .awards-section .page-section-cards.awards img {
		transition: none !important;
	}

	body .awards-section .page-section-cards.awards > .layout-component:hover,
	body .awards-section .page-section-cards.awards > .layout-component:focus-within,
	body .awards-section .page-section-cards.awards > .layout-component:hover::after,
	body .awards-section .page-section-cards.awards > .layout-component:focus-within::after,
	body .awards-section .page-section-cards.awards > .layout-component:hover > .content::before,
	body .awards-section .page-section-cards.awards > .layout-component:focus-within > .content::before,
	body .awards-section .page-section-cards.awards > .layout-component:hover img,
	body .awards-section .page-section-cards.awards > .layout-component:focus-within img {
		transform: none !important;
	}

}

/* ==========================================
   REDUCED MOTION
========================================== */

/* ==========================================
   06. REDUCED MOTION
   Consolidated accessibility fallback for Specials
========================================== */

@media (prefers-reduced-motion: reduce) {

	body .page-section .page-image,
	body .page-section .page-video,
	body .page-section .page-image::after,
	body .page-section .page-video::after,
	body .page-section .page-image > img,
	body .page-section .page-image .content img,
	body .page-section .page-image .content p img,
	body .page-section .page-video iframe,
	body .page-section .page-video > .content::before,
	body .page-section .page-video > .content::after,
	body .page-section .page-video .content::before,
	body .page-section .page-video .content::after,
	body .page-section .page-cta,
	body .page-section.page-cta-highlight-block .page-content,
	body .page-section.page-cta-highlight-block > .i > .content,
	body .page-section .page-section-content blockquote,
	body .page-section .page-content ul:not(.plain-list) li,
	body .page-section .page-content ul:not(.plain-list) li::after,
	body .action-button-container,
	body .split-content-text.left-content::before,
	body .split-content-text.right-content::before,
	body .split-content--volunteer-roles li,
	body .split-content--volunteer-roles li::after,
	body .split-content--image-cards .component-topper img,
	body .split-content--image-cards h3,
	body .split-content--image-cards > .i > .layout-cell::after,
	body .split-content.split-content--captioned .split-content-image img,
	body .split-content.split-content--captioned .split-content-image h4,
	body .split-content.split-content--captioned .split-content-image .layout-component::before,
	body .split-content.split-content--captioned .split-content-image .layout-component::after,
	body .split-content.split-content--captioned .split-content-image .layout-component > .content::before,
	body .split-content.split-content--captioned .split-content-image .layout-component > .content::after,
	body .split-content.split-content--captioned.split-caption--statement .split-content-image h4::before,
	body .icon-card-grid > .i > .layout-component,
	body .icon-card-grid > .i > .layout-component::before,
	body .icon-card-grid > .i > .layout-component::after,
	body .icon-card-grid .component-topper,
	body .icon-card-grid .component-topper img,
	body .stats-strip .layout-component,
	body .stats-strip .layout-component::after,
	body .stats-strip .component-topper,
	body .image-card-grid > .i > .layout-component,
	body .image-card-grid > .i > .layout-component::after,
	body .image-card-grid .component-topper,
	body .image-card-grid .component-topper::before,
	body .image-card-grid .component-topper::after,
	body .image-card-grid .component-topper img,
	body .logo-card-section .logo-card,
	body .logo-card-section .logo-card::after,
	body .logo-card-section .logo-card .component-topper,
	body .logo-card-section .logo-card .component-topper::before,
	body .logo-card-section .logo-card .component-topper::after,
	body .logo-card-section .logo-card .component-topper img,
	body .page-section.glow-up .card-custom.card-image,
	body .page-section.glow-up .card-custom.card-image::before,
	body .page-section.glow-up .card-custom.card-image::after,
	body .page-section.glow-up .card-custom.card-image img,
	body .page-section.glow-up .card-custom.card-image label,
	body .page-section.glow-up .card-custom.card-image label::before,
	body .page-section.glow-up .card-custom.card-image > h4,
	body .awards-section .page-section-cards.awards > .layout-component,
	body .awards-section .page-section-cards.awards > .layout-component::after,
	body .awards-section .page-section-cards.awards img,
	body .awards-section .page-section-media.awards {
		transition: none !important;
	}

	body .page-section .page-image:hover,
	body .page-section .page-image:focus-within,
	body .page-section .page-video:hover,
	body .page-section .page-video:focus-within,
	body .page-section .page-image:hover::after,
	body .page-section .page-image:focus-within::after,
	body .page-section .page-video:hover::after,
	body .page-section .page-video:focus-within::after,
	body .page-section .page-image:hover > img,
	body .page-section .page-image:focus-within > img,
	body .page-section .page-image:hover .content img,
	body .page-section .page-image:focus-within .content img,
	body .page-section .page-image:hover .content p img,
	body .page-section .page-image:focus-within .content p img,
	body .page-section .page-video:hover iframe,
	body .page-section .page-video:focus-within iframe,
	body .page-section .page-video:hover > .content::before,
	body .page-section .page-video:focus-within > .content::before,
	body .page-section .page-video:hover > .content::after,
	body .page-section .page-video:focus-within > .content::after,
	body .page-section .page-video:hover .content::before,
	body .page-section .page-video:focus-within .content::before,
	body .page-section .page-video:hover .content::after,
	body .page-section .page-video:focus-within .content::after,
	body .page-section.page-cta-highlight-block .page-content,
	body .page-section.page-cta-highlight-block > .i > .content,
	body .page-section .page-content ul:not(.plain-list) li:hover,
	body .page-section .page-content ul:not(.plain-list) li:hover::after,
	body .split-content-text.left-content:hover::before,
	body .split-content-text.right-content:hover::before,
	body .split-content--volunteer-roles li:hover,
	body .split-content--volunteer-roles li:hover::after,
	body .split-content--image-cards > .i > .layout-cell:hover img,
	body .split-content--image-cards > .i > .layout-cell:focus-within img,
	body .split-content--image-cards > .i > .layout-cell:hover h3,
	body .split-content--image-cards > .i > .layout-cell:focus-within h3,
	body .split-content.split-content--captioned .split-content-image:hover img,
	body .split-content.split-content--captioned .split-content-image:focus-within img,
	body .split-content.split-content--captioned .split-content-image:hover h4,
	body .split-content.split-content--captioned .split-content-image:focus-within h4,
	body .split-content.split-content--captioned.split-caption--tab .split-content-image:hover h4,
	body .split-content.split-content--captioned.split-caption--tab .split-content-image:focus-within h4,
	body .split-content.split-content--captioned .split-content-image:hover .layout-component::before,
	body .split-content.split-content--captioned .split-content-image:focus-within .layout-component::before,
	body .icon-card-grid > .i > .layout-component:hover,
	body .icon-card-grid > .i > .layout-component:hover::after,
	body .icon-card-grid > .i > .layout-component:hover .component-topper,
	body .icon-card-grid > .i > .layout-component:hover .component-topper img,
	body .stats-strip .layout-component:hover,
	body .stats-strip .layout-component:hover::after,
	body .stats-strip .layout-component:hover .component-topper,
	body .image-card-grid > .i > .layout-component:hover,
	body .image-card-grid > .i > .layout-component:focus-within,
	body .image-card-grid > .i > .layout-component:hover::after,
	body .image-card-grid > .i > .layout-component:focus-within::after,
	body .image-card-grid > .i > .layout-component:hover .component-topper::before,
	body .image-card-grid > .i > .layout-component:focus-within .component-topper::before,
	body .image-card-grid > .i > .layout-component:hover .component-topper img,
	body .image-card-grid > .i > .layout-component:focus-within .component-topper img,
	body .logo-card-section .logo-card:hover,
	body .logo-card-section .logo-card:focus-within,
	body .logo-card-section .logo-card:hover::after,
	body .logo-card-section .logo-card:focus-within::after,
	body .logo-card-section .logo-card:hover .component-topper::before,
	body .logo-card-section .logo-card:focus-within .component-topper::before,
	body .logo-card-section .logo-card:hover .component-topper img,
	body .logo-card-section .logo-card:focus-within .component-topper img,
	body .page-section.glow-up .card-custom.card-image:hover,
	body .page-section.glow-up .card-custom.card-image:focus-within,
	body .page-section.glow-up .card-custom.card-image:hover::before,
	body .page-section.glow-up .card-custom.card-image:focus-within::before,
	body .page-section.glow-up .card-custom.card-image:hover::after,
	body .page-section.glow-up .card-custom.card-image:focus-within::after,
	body .page-section.glow-up .card-custom.card-image:hover img,
	body .page-section.glow-up .card-custom.card-image:focus-within img,
	body .awards-section .page-section-cards.awards > .layout-component:hover,
	body .awards-section .page-section-cards.awards > .layout-component:focus-within,
	body .awards-section .page-section-cards.awards > .layout-component:hover::after,
	body .awards-section .page-section-cards.awards > .layout-component:focus-within::after,
	body .awards-section .page-section-cards.awards > .layout-component:hover img,
	body .awards-section .page-section-cards.awards > .layout-component:focus-within img,
	body .awards-section .page-section-media.awards:hover,
	body .awards-section .page-section-media.awards:focus-within {
		transform: none !important;
	}

}

/* End CSS Part: Specials */

 /* Begin CSS Part: Effects */
/* Begin CSS Part: Effects */
/* ==========================================
   TOP FADE EFFECT
   Reusable section background fade
========================================== */

/*
	Usage:
	<div class="layout-cell col1 page-section top-fade">
		<div class="i">
			...
		</div>
	</div>

	Optional per-section tweaks:
	.top-fade {
		--ww-top-fade-height: 360px;
		--ww-top-fade-strength: .12;
	}
*/

body .top-fade {
	--ww-top-fade-height: clamp(240px, 34vw, 460px);
	--ww-top-fade-colour: 217,147,14;
	--ww-top-fade-strength: .1;

	position: relative;
	isolation: isolate;

	background: var(--ww-color-body-bg);
}

body .top-fade::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	z-index: 0;

	width: 100%;
	height: var(--ww-top-fade-height);

	background:
		linear-gradient(
			180deg,
			rgba(var(--ww-top-fade-colour), var(--ww-top-fade-strength)) 0%,
			rgba(var(--ww-top-fade-colour), calc(var(--ww-top-fade-strength) * .55)) 42%,
			rgba(var(--ww-top-fade-colour), 0) 100%
		);

	pointer-events: none;
}

/* Keep normal section content above the fade */

body .top-fade > .i,
body .top-fade > .layout-component,
body .top-fade > .layout-cell {
	position: relative;
	z-index: 1;
}


 /* Begin CSS Part: Site Design */
/* ==========================================
   SITE DESIGN - MAIN
   FOOTER ONLY
   4 ALL FOUNDATION
========================================== */

/* ==========================================
   FOOTER WRAPPER
========================================== */

body .footer-wrapper {
	width: 100%;

	background: var(--ww-color-footer-bg);
	color: var(--ww-color-footer-text);
}

/* ==========================================
   MAIN FOOTER LAYOUT
========================================== */

body .main-footer {
	padding-block: clamp(4rem, 7vw, var(--ww-space-xl));
}

body .main-footer > .i {
	display: grid;
	grid-template-columns:
		minmax(0, 1fr)
		minmax(0, 1fr)
		minmax(0, 1.15fr)
		minmax(220px, 0.85fr);
	gap: clamp(2rem, 4vw, var(--ww-space-l));
	align-items: start;
}

body .main-footer-group {
	min-width: 0;
}

/* ==========================================
   FOOTER HEADINGS / LABELS
========================================== */

body .main-footer-group > label,
body .footer-contact-component label,
body .footer-info-group h3,
body .footer-logo h3 {
	display: block;

	margin: 0 0 1rem;

	color: var(--ww-color-orange);

	font-size: 0.88rem;
	font-weight: 900;
	line-height: 1.2;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

/* ==========================================
   FOOTER MENU
========================================== */

body .main-footer .menubar,
body .main-footer .menubar ul,
body .main-footer .menubar li,
body .base-footer .menubar,
body .base-footer .menubar ul,
body .base-footer .menubar li {
	list-style: none;

	margin: 0;
	padding: 0;
}

/* Top-level menu only */

body .footer-menu-group .menubar {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 0.72rem;
}

/* Hide footer submenus */

body .footer-menu-group .menubar .menubar,
body .footer-menu-group .has_child > .menubar {
	display: none !important;
}

/* Top-level footer links */

body .main-footer .menu_item,
body .main-footer .menu_item:visited {
	display: inline-flex;
	align-items: center;
	gap: 0.45rem;

	color: var(--ww-color-white);

	font-weight: 700;
	line-height: 1.35;
	text-decoration: none;

	transition:
		color var(--ww-transition-fast),
		opacity var(--ww-transition-fast),
		transform var(--ww-transition-fast);
}

body .main-footer .menu_item::before {
	content: "";

	width: 0.45rem;
	height: 0.45rem;

	background: var(--ww-color-orange);
	border-radius: 999px;

	opacity: .75;

	transition:
		opacity var(--ww-transition-fast),
		transform var(--ww-transition-fast);
}

body .main-footer .menu_item:hover,
body .main-footer .menu_item:focus {
	color: var(--ww-color-orange);
	opacity: 1;
}

body .main-footer .menu_item:hover::before,
body .main-footer .menu_item:focus::before {
	opacity: 1;

	transform: scale(1.15);
}

/* ==========================================
   FOOTER CONTACT DETAILS
========================================== */

body .footer-contact-component {
	margin-bottom: 1.15rem;
}

body .footer-contact-component:last-child {
	margin-bottom: 0;
}

body .footer-contact-component label {
	margin-bottom: 0.25rem;
}

body .footer-contact-group .company-info-part,
body .footer-contact-group p,
body .footer-contact-group .content,
body .footer-info-group p,
body .footer-menu-group {
	color: var(--ww-color-white);

	line-height: 1.55;
}

body .footer-contact-group .component-topper p {
	margin: 0 0 1rem;

	color: rgba(255,255,255,.9);
}

body .footer-address .component-topper p {
	max-width: 34ch;
}

.company-info-part.address div[itemprop="addressCountry"] {display:none !important;}

/* Address */

body .footer-address .company-info-part.name {
	margin-bottom: 0.25rem;

	color: var(--ww-color-white);

	font-weight: 850;
}

body .footer-address .company-info-part.address div {
	color: var(--ww-color-white);

	line-height: 1.55;
}

/* ==========================================
   FOOTER LINKS
========================================== */

body .footer-contact-group a,
body .footer-contact-group a:visited,
body .main-footer a,
body .main-footer a:visited,
body .base-footer a,
body .base-footer a:visited {
	color: var(--ww-color-white);

	text-decoration-color: rgba(217,147,14,.55);
	text-underline-offset: 0.18em;

	transition:
		color var(--ww-transition-fast),
		opacity var(--ww-transition-fast),
		transform var(--ww-transition-fast);
}

body .footer-contact-group a:hover,
body .footer-contact-group a:focus,
body .main-footer a:hover,
body .main-footer a:focus,
body .base-footer a:hover,
body .base-footer a:focus {
	color: var(--ww-color-orange);
	opacity: 1;
}

/* ==========================================
   FOOTER SOCIAL ICONS
   4 ALL FOUNDATION
========================================== */

body .social-footer {
	margin-top: clamp(0.75rem, 1.4vw, 1.1rem) !important;
}

body .social-footer p {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.55rem;

	margin: 0 !important;
	padding: 0 !important;
}

body .social-footer a {
	position: relative;
	isolation: isolate;

	display: inline-flex !important;
	align-items: center;
	justify-content: center;

	width: 42px;
	height: 42px;

	margin: 0 !important;
	padding: 0 !important;

	background:
		radial-gradient(circle at 32% 24%, rgba(255,255,255,.2), transparent 36%),
		linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.02));

	color: var(--ww-color-white);

	border: 1px solid rgba(217,147,14,.3);
	border-radius: 999px;

	box-shadow:
		0 10px 26px rgba(0,0,0,.22),
		inset 0 1px 0 rgba(255,255,255,.12);

	text-decoration: none !important;

	overflow: hidden;

	transform: translateY(0);

	transition:
		transform var(--ww-transition-fast),
		background-color var(--ww-transition-fast),
		border-color var(--ww-transition-fast),
		box-shadow var(--ww-transition-fast);
}

body .social-footer a::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 0;

	background:
		radial-gradient(circle at 50% 50%, rgba(217,147,14,.45), rgba(217,147,14,.16) 42%, transparent 72%);

	opacity: 0;

	transform: scale(.72);

	transition:
		opacity var(--ww-transition-fast),
		transform var(--ww-transition-fast);

	pointer-events: none;
}

body .social-footer a:hover,
body .social-footer a:focus {
	transform: translateY(-3px);

	background: var(--ww-color-orange);

	border-color: var(--ww-color-orange);

	box-shadow:
		0 16px 34px rgba(0,0,0,.28),
		0 0 24px rgba(217,147,14,.18),
		inset 0 1px 0 rgba(255,255,255,.22);
}

body .social-footer a:hover::before,
body .social-footer a:focus::before {
	opacity: 1;

	transform: scale(1);
}

body .social-footer a:focus-visible {
	outline: 3px solid rgba(217,147,14,.45);
	outline-offset: 4px;
}

/* Normalise the mixed icon image sizes */

body .social-footer a img {
	position: relative;
	z-index: 1;

	display: block;

	width: 22px !important;
	height: 22px !important;
	max-width: 22px !important;
	max-height: 22px !important;

	margin: 0 !important;
	padding: 0 !important;

	object-fit: contain;
	object-position: center;

	filter:
		brightness(0) invert(1)
		drop-shadow(0 6px 12px rgba(0,0,0,.18));

	transform: scale(1);

	transition:
		transform var(--ww-transition-fast),
		filter var(--ww-transition-fast);
}

/* LinkedIn and TikTok source files can visually sit smaller/larger, this keeps them balanced */

body .social-footer a[title*="Linkedin"] img,
body .social-footer a[title*="LinkedIn"] img,
body .social-footer a[href*="linkedin"] img {
	width: 20px !important;
	height: 20px !important;
	max-width: 20px !important;
	max-height: 20px !important;
}

body .social-footer a[href*="tiktok"] img {
	width: 21px !important;
	height: 21px !important;
	max-width: 21px !important;
	max-height: 21px !important;
}

body .social-footer a:hover img,
body .social-footer a:focus img {
	transform: scale(1.08);

	filter:
		brightness(0) saturate(100%)
		drop-shadow(0 7px 14px rgba(0,0,0,.22));
}

/* ==========================================
   FOOTER SOCIAL ICONS RESPONSIVE
========================================== */

@media (max-width: 767px) {

	body .social-footer p {
		gap: 0.5rem;
	}

	body .social-footer a {
		width: 40px;
		height: 40px;
	}

	body .social-footer a img {
		width: 21px !important;
		height: 21px !important;
		max-width: 21px !important;
		max-height: 21px !important;
	}

}

/* ==========================================
   REDUCED MOTION
========================================== */

@media (prefers-reduced-motion: reduce) {

	body .social-footer a,
	body .social-footer a::before,
	body .social-footer a img {
		transition: none;
	}

	body .social-footer a:hover,
	body .social-footer a:focus,
	body .social-footer a:hover::before,
	body .social-footer a:focus::before,
	body .social-footer a:hover img,
	body .social-footer a:focus img {
		transform: none;
	}

}

/* ==========================================
   FOOTER LOGO / SUPPORTED BY BLOCK
========================================== */

body .footer-info-group {
	text-align: center;
}

body .footer-info-group > .layout-cell,
body .footer-logo {
	position: relative;
}

body .footer-logo {
	isolation: isolate;

	display: flex;
	flex-direction: column;
	align-items: center;

	margin: 0 !important;
	padding: clamp(1.45rem, 2.4vw, 2.1rem) !important;

	background:
		linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.035));

	border: 1px solid rgba(217,147,14,.22);
	border-radius: var(--ww-radius-m);

	box-shadow:
		0 16px 44px rgba(0,0,0,.18),
		inset 0 1px 0 rgba(255,255,255,.08);

	overflow: hidden;

	transition:
		transform var(--ww-transition-fast),
		border-color var(--ww-transition-fast),
		box-shadow var(--ww-transition-fast);
}

body .footer-logo::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	z-index: 0;

	width: 100%;
	height: 5px;

	background:
		linear-gradient(
			90deg,
			var(--ww-color-orange),
			rgba(217,147,14,.45),
			var(--ww-color-orange)
		);

	pointer-events: none;
}

body .footer-logo:hover,
body .footer-logo:focus-within {
	transform: translateY(-3px);

	border-color: rgba(217,147,14,.42);

	box-shadow:
		0 22px 54px rgba(0,0,0,.26),
		0 0 24px rgba(217,147,14,.08),
		inset 0 1px 0 rgba(255,255,255,.1);
}

body .footer-logo h3 {
	position: relative;
	z-index: 2;

	margin-bottom: 1rem;

	color: var(--ww-color-orange);

	text-align: center;
}

body .footer-logo p {
	position: relative;
	z-index: 2;
	margin: 0 !important;
	border-radius: var(--ww-radius-s);
}

body .footer-info-group img,
body .footer-logo img {
	display: block;

	width: auto;
	max-width: 220px;
	height: auto;
padding:0px 12px;
	margin-inline: auto;
}

body .footer-info-group h2,
body .footer-info-group h3 {
	color: var(--ww-color-orange);
}

body .footer-logo .component-footer {
	display: none;
}

/* ==========================================
   FOOTER BUTTONS
========================================== */

body .main-footer .button,
body .main-footer .button:visited,
body .base-footer .button,
body .base-footer .button:visited {
	background: var(--ww-color-orange);
	color: var(--ww-color-black);

	border-color: var(--ww-color-orange);
}

body .main-footer .button:hover,
body .main-footer .button:focus,
body .base-footer .button:hover,
body .base-footer .button:focus {
	background: var(--ww-color-white);
	color: var(--ww-color-black);

	border-color: var(--ww-color-white);
}

/* ==========================================
   BASE FOOTER
========================================== */

body .base-footer {
	padding-block: 1.25rem;

	border-top: 1px solid rgba(217,147,14,.28);
}

body .base-footer > .i {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 2rem;
}

body .base-footer > .i > .layout-cell {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 2rem;

	width: 100%;
}

body .base-copyright p {
	margin: 0;

	color: var(--ww-color-white);

	font-size: 0.9rem;
	line-height: 1.4;

	opacity: 0.9;
}

body .base-menu .menubar {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	flex-wrap: wrap;
	gap: 1rem;
}

body .base-footer .menu_item,
body .base-footer .menu_item:visited {
	color: var(--ww-color-white);

	font-size: 0.9rem;
	line-height: 1.4;
	text-decoration: none;

	transition:
		color var(--ww-transition-fast),
		opacity var(--ww-transition-fast);
}

body .base-footer .menu_item:hover,
body .base-footer .menu_item:focus {
	color: var(--ww-color-orange);
	opacity: 1;
}

/* ==========================================
   FOOTER RESPONSIVE
========================================== */

@media (min-width: 768px) and (max-width: 1200px) {

	body .main-footer > .i {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	body .footer-info-group {
		text-align: left;
	}

	body .footer-info-group img,
	body .footer-logo img {
		margin-inline: 0;
	}

	body .footer-logo {
		align-items: center;
		text-align: left;
	}

	body .footer-logo h3 {
		text-align: left;
	}

}

@media (max-width: 767px) {

	body .main-footer {
		padding-block: var(--ww-space-l);
	}

	body .main-footer > .i {
		grid-template-columns: 1fr;
		gap: var(--ww-space-m);
	}

	body .footer-info-group {
		text-align: left;
	}

	body .footer-info-group img,
	body .footer-logo img {
		max-width: 220px;
		margin-inline: 0;
	}

	body .footer-logo {
		align-items: center;
		text-align: left;
	}

	body .footer-logo h3 {
		text-align: left;
	}

	body .base-footer > .i,
	body .base-footer > .i > .layout-cell {
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		gap: 1rem;
	}

	body .base-menu .menubar {
		justify-content: flex-start;
	}

}

/* ==========================================
   REDUCED MOTION
========================================== */

@media (prefers-reduced-motion: reduce) {

	body .main-footer .menu_item,
	body .main-footer .menu_item::before,
	body .main-footer img,
	body .footer-logo,
	body .base-footer .menu_item {
		transition: none;
	}

	body .main-footer .menu_item:hover::before,
	body .main-footer .menu_item:focus::before,
	body .main-footer a:hover img,
	body .main-footer a:focus img,
	body .footer-logo:hover,
	body .footer-logo:focus-within {
		transform: none;
	}

}
 /* Begin CSS Part: User Design */

 /* Begin CSS Part: Site Components */
/* ==========================================
   WATMAN WEB FRAMEWORK
   SITE COMPONENTS
   4 ALL FOUNDATION
========================================== */

/* ==========================================
   CARD BASE
========================================== */

.card {
	display: flex;
	flex-direction: column;
	min-width: 0;
	height: 100%;
	background: var(--ww-color-surface);
	border: 1px solid rgba(0,0,0,.08);
	border-radius: var(--ww-radius-m);
	overflow: hidden;
	box-shadow: 0 6px 20px rgba(0,0,0,.04);
	transition:
		transform var(--ww-transition-fast),
		box-shadow var(--ww-transition-fast),
		border-color var(--ww-transition-fast);
}

.card:hover {
	transform: translateY(-4px);
	box-shadow: 0 15px 40px rgba(0,0,0,.08);
	border-color: rgba(0,0,0,.12);
}

/* ==========================================
   CUSTOM CARD
========================================== */

.card-custom .component-topper,
.card-output .card-image-container {
	display: block;
	overflow: hidden;
}

.card-custom .component-topper img,
.card-output .card-image-container img {
	display: block;
	width: 100%;
	height: auto;
	transition: transform 0.4s ease;
}

.card-custom:hover .component-topper img,
.card-output:hover .card-image-container img {
	transform: scale(1.03);
}

.card-custom h2,
.card-custom h3,
.card-custom h4,
.card-custom label,
.card-custom .content,
.card-custom .component-footer {
	padding-inline: var(--ww-space-m);
}

.card-custom h2,
.card-custom h3,
.card-custom h4 {
	margin-top: var(--ww-space-m);
	margin-bottom: 0.5rem;
}

.card-custom label {
	display: block;
	margin-bottom: 1rem;
	color: var(--ww-color-orange);
	font-size: 0.85rem;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 0.06em;
}

.card-custom .content {
	flex: 1;
}

.card-custom .component-footer {
	margin-top: auto;
	padding-top: var(--ww-space-m);
	padding-bottom: var(--ww-space-m);
}


/* ==========================================
   MAP CONTAINER
   Contact page / Find Us map with address
========================================== */

body .map-container {
	position: relative;
	isolation: isolate;

	width: 100%;
	min-width: 0;

	padding: clamp(1.2rem, 3vw, 2rem) !important;

	background:
		radial-gradient(circle at 88% 12%, rgba(217,147,14,.16), transparent 34%),
		radial-gradient(circle at 10% 90%, rgba(217,147,14,.08), transparent 34%),
		linear-gradient(180deg, rgba(255,255,255,1), rgba(255,255,255,.96));

	border: 1px solid rgba(217,147,14,.24);

	box-shadow:
		0 20px 60px rgba(0,0,0,.08),
		inset 0 1px 0 rgba(255,255,255,.9);

	overflow: hidden;
}

/* Top orange accent */

body .map-container::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;

	width: 100%;
	height: 7px;

	background:
		linear-gradient(
			90deg,
			var(--ww-color-orange),
			rgba(217,147,14,.5),
			var(--ww-color-orange)
		);

	pointer-events: none;
}

/* Soft background glow */

body .map-container::after {
	content: "";
	position: absolute;
	right: -100px;
	bottom: -100px;
	z-index: 0;

	width: 260px;
	height: 260px;

	background: rgba(217,147,14,.11);
	border-radius: 999px;

	pointer-events: none;
}

/* ==========================================
   MAP MAIN LABEL
========================================== */

body .map-container > label {
	position: relative;
	z-index: 2;

	display: inline-flex;
	align-items: center;
	gap: 0.55rem;

	margin: 0 0 clamp(1rem, 2vw, 1.35rem) !important;
	padding: 0.48rem 0.8rem !important;

	background: rgba(217,147,14,.12);
	color: var(--ww-color-black);

	border: 1px solid rgba(217,147,14,.28);
	border-radius: 999px;

	font-size: 0.82rem;
	font-weight: 950;
	line-height: 1;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

body .map-container > label::before {
	content: "";

	display: inline-block;

	width: 0.55rem;
	height: 0.55rem;

	background: var(--ww-color-orange);
	border-radius: 999px;

	box-shadow: 0 0 0 5px rgba(217,147,14,.14);
}

/* ==========================================
   MAP INNER LAYOUT
========================================== */

body .map-container > .i {
	position: relative;
	z-index: 2;

	display: grid !important;
	grid-template-columns: minmax(260px, 0.75fr) minmax(0, 1.65fr);
	gap: clamp(1rem, 2vw, 1.5rem);
	align-items: stretch;

	width: 100%;
	min-width: 0;

	margin: 0 !important;
	padding: 0 !important;
}

/* ==========================================
   MAP ADDRESS CARD
========================================== */

body .map-container .map-address {
	position: relative;
	isolation: isolate;

	display: flex;
	flex-direction: column;
	justify-content: center;

	width: 100%;
	min-width: 0;
	min-height: clamp(300px, 28vw, 430px);

	margin: 0 !important;
	padding: clamp(1.35rem, 2.6vw, 2.25rem) !important;

	background:
		radial-gradient(circle at 92% 12%, rgba(217,147,14,.18), transparent 36%),
		linear-gradient(180deg, rgba(0,0,0,1), rgba(22,22,22,1));

	color: var(--ww-color-white);

	border: 1px solid rgba(217,147,14,.34);
	border-radius: calc(var(--ww-radius-l) - 0.35rem);

	box-shadow:
		0 18px 48px rgba(0,0,0,.18),
		0 0 0 1px rgba(217,147,14,.08),
		inset 0 1px 0 rgba(255,255,255,.1);

	overflow: hidden;
}

body .map-container .map-address::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	z-index: 1;

	width: 7px;
	height: 100%;

	background: var(--ww-color-orange);

	pointer-events: none;
}

body .map-container .map-address::after {
	content: "";
	position: absolute;
	right: -70px;
	bottom: -70px;
	z-index: 0;

	width: 190px;
	height: 190px;

	background: rgba(217,147,14,.16);
	border-radius: 999px;

	pointer-events: none;
}

body .map-container .map-address > * {
	position: relative;
	z-index: 2;
}

body .map-container .map-address label {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;

	width: fit-content;

	margin: 0 0 clamp(0.85rem, 1.5vw, 1.15rem) !important;
	padding: 0.5rem 0.75rem !important;

	background: rgba(255,255,255,.1);
	color: var(--ww-color-orange);

	border: 1px solid rgba(217,147,14,.36);
	border-radius: 999px;

	font-size: 0.78rem;
	font-weight: 950;
	line-height: 1;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

body .map-container .map-address label::before {
	content: "";

	display: block;

	width: 0.5rem;
	height: 0.5rem;

	background: var(--ww-color-orange);
	border-radius: 999px;

	box-shadow: 0 0 0 5px rgba(217,147,14,.14);
}

body .map-container .map-address p {
	max-width: 360px;

	margin: 0 !important;

	color: rgba(255,255,255,.92);

	font-size: clamp(1.05rem, 1.35vw, 1.28rem);
	font-weight: 750;
	line-height: 1.55;
}

/* ==========================================
   MAP DISPLAY
========================================== */

body .map-container .map-display,
body .map-container .map-display .content {
	position: relative;
	z-index: 2;

	width: 100%;
	min-width: 0;

	margin: 0 !important;
	padding: 0 !important;
}

body .map-container .map-display .content {
	height: 100%;
	min-height: clamp(300px, 28vw, 430px);

	background: rgba(0,0,0,.06);

	border: 1px solid rgba(0,0,0,.08);
	border-radius: calc(var(--ww-radius-l) - 0.35rem);

	box-shadow:
		0 18px 48px rgba(0,0,0,.1),
		inset 0 1px 0 rgba(255,255,255,.88);

	overflow: hidden;
}

/* Force Google map to be responsive */

body .map-container iframe {
	display: block;

	width: 100% !important;
	height: 100% !important;
	min-height: clamp(300px, 28vw, 430px);

	margin: 0 !important;
	padding: 0 !important;

	border: 0 !important;

	filter: saturate(.95) contrast(1.02);
}

/* ==========================================
   MAP RESPONSIVE
========================================== */

@media (max-width: 900px) {

	body .map-container > .i {
		grid-template-columns: 1fr;
	}

	body .map-container .map-address {
		min-height: 0;
	}

	body .map-container .map-address p {
		max-width: none;
	}

	body .map-container .map-display .content,
	body .map-container iframe {
		min-height: 380px;
	}

}

@media (max-width: 767px) {

	body .map-container {
		margin-top: 3rem !important;
		padding: 0.9rem !important;

		border-radius: var(--ww-radius-m);
	}

	body .map-container > label {
		margin-bottom: 0.9rem !important;

		font-size: 0.78rem;
	}

	body .map-container > .i {
		gap: 0.9rem;
	}

	body .map-container .map-address {
		padding: 1.25rem !important;

		border-radius: calc(var(--ww-radius-m) - 0.2rem);
	}

	body .map-container .map-address p {
		font-size: 1rem;
		line-height: 1.55;
	}

	body .map-container .map-display .content {
		min-height: 340px;

		border-radius: calc(var(--ww-radius-m) - 0.2rem);
	}

	body .map-container iframe {
		min-height: 340px;
	}

}

@media (max-width: 480px) {

	body .map-container .map-display .content,
	body .map-container iframe {
		min-height: 300px;
	}

}




/* ==========================================
   CONTACT MAP COLLECTION
   4 ALL FOUNDATION
   Uses:
   .map-collection-container
   .map-contact-container
   .map-display
   .map-address
========================================== */

body .map-collection-container {
	--map-card-radius: var(--ww-radius-l);
	--map-card-pad: clamp(0.85rem, 1.5vw, 1.15rem);
	--map-height: clamp(280px, 28vw, 420px);

	position: relative;
	isolation: isolate;

	width: 100%;
	min-width: 0;

	padding:
		clamp(2.5rem, 5vw, 4.5rem)
		clamp(1rem, 3vw, 2rem)
		clamp(2.5rem, 5vw, 4.5rem) !important;

	background:
		radial-gradient(circle at 12% 14%, rgba(217,147,14,.22), transparent 34%),
		radial-gradient(circle at 86% 82%, rgba(217,147,14,.15), transparent 32%),
		linear-gradient(180deg, rgba(0,0,0,1), rgba(18,18,18,1));

	border: 1px solid rgba(217,147,14,.24);
	border-radius: var(--map-collection-radius);

	box-shadow:
		0 26px 76px rgba(0,0,0,.22),
		inset 0 1px 0 rgba(255,255,255,.06);

	overflow: hidden;
}

/* Decorative texture */

body .map-collection-container::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 0;

	background:
		linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px),
		linear-gradient(180deg, rgba(255,255,255,.025) 1px, transparent 1px);

	background-size: 54px 54px;

	opacity: .22;

	pointer-events: none;
}

/* Soft centre glow */

body .map-collection-container::after {
	content: "";
	position: absolute;
	left: 50%;
	top: 18%;
	z-index: 0;

	width: min(900px, 90vw);
	height: 420px;

	background:
		radial-gradient(circle, rgba(217,147,14,.2), rgba(217,147,14,.06) 45%, transparent 72%);

	transform: translateX(-50%);

	pointer-events: none;
}

/* Main heading label */

body .map-collection-container > label {
	position: relative;
	z-index: 2;

	display: block;

	width: fit-content;

	margin: 0 auto clamp(2rem, 4vw, 3.25rem) !important;
	padding: 0 0 clamp(0.85rem, 1.4vw, 1.05rem) !important;

	color: var(--ww-color-white);

	font-size: clamp(2.4rem, 5.6vw, 5.4rem);
	font-weight: 950;
	line-height: .95;
	letter-spacing: -0.065em;
	text-align: center;

	text-shadow:
		0 10px 32px rgba(0,0,0,.36),
		0 0 34px rgba(217,147,14,.16);
}

body .map-collection-container > label::after {
	content: "";
	position: absolute;
	left: 50%;
	bottom: 0;

	width: min(150px, 50vw);
	height: 7px;

	background:
		linear-gradient(
			90deg,
			transparent,
			var(--ww-color-orange),
			transparent
		);

	border-radius: 999px;

	transform: translateX(-50%);
}

/* ==========================================
   MAP COLLECTION GRID
========================================== */

body .map-collection-container > .i {
	position: relative;
	z-index: 2;

	display: grid !important;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: clamp(1rem, 2.2vw, 1.65rem);

	width: 100%;
	min-width: 0;

	margin: 0 !important;
	padding: 0 !important;

	counter-reset: mapHub;
}

/* ==========================================
   MAP CARD
========================================== */

body .map-collection-container .map-contact-container {
	position: relative;
	isolation: isolate;

	display: flex;
	flex-direction: column;

	min-width: 0;
	height: 100%;

	margin: 0 !important;
	padding: var(--map-card-pad) !important;

	background:
		linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92));

	border: 1px solid rgba(217,147,14,.38);
	border-radius: var(--map-card-radius);

	box-shadow:
		0 22px 62px rgba(0,0,0,.32),
		0 0 0 1px rgba(255,255,255,.08),
		inset 0 1px 0 rgba(255,255,255,.95);

	overflow: hidden;

	transform: translateY(0);

	transition:
		transform var(--ww-transition-medium),
		box-shadow var(--ww-transition-medium),
		border-color var(--ww-transition-medium);
}

body .map-collection-container .map-contact-container {
	counter-increment: mapHub;
}

/* Gold top shine */

body .map-collection-container .map-contact-container::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	z-index: 4;

	width: 100%;
	height: 7px;

	background:
		linear-gradient(
			90deg,
			rgba(217,147,14,.55),
			var(--ww-color-orange),
			rgba(255,230,170,1),
			var(--ww-color-orange),
			rgba(217,147,14,.55)
		);

	box-shadow:
		0 0 18px rgba(217,147,14,.3),
		0 1px 0 rgba(255,255,255,.18);

	pointer-events: none;

	transition:
		transform var(--ww-transition-medium),
		box-shadow var(--ww-transition-medium);
}

/* Number badge */

body .map-collection-container .map-contact-container::after {
	content: "0" counter(mapHub);

	position: absolute;
	top: clamp(1.15rem, 2vw, 1.45rem);
	left: clamp(1.15rem, 2vw, 1.45rem);
	z-index: 5;

	display: inline-flex;
	align-items: center;
	justify-content: center;

	width: 42px;
	height: 42px;

	background: var(--ww-color-black);
	color: var(--ww-color-orange);

	border: 1px solid rgba(217,147,14,.55);
	border-radius: 999px;

	box-shadow:
		0 12px 28px rgba(0,0,0,.28),
		inset 0 1px 0 rgba(255,255,255,.1);

	font-size: 0.84rem;
	font-weight: 950;
	line-height: 1;

	pointer-events: none;
}

body .map-collection-container .map-contact-container:hover,
body .map-collection-container .map-contact-container:focus-within {
	transform: translateY(-7px);

	border-color: rgba(217,147,14,.76);

	box-shadow:
		0 34px 86px rgba(0,0,0,.42),
		0 0 34px rgba(217,147,14,.18),
		0 0 0 1px rgba(255,255,255,.12),
		inset 0 1px 0 rgba(255,255,255,.95);
}

body .map-collection-container .map-contact-container:hover::before,
body .map-collection-container .map-contact-container:focus-within::before {
	transform: scaleX(.92);

	box-shadow:
		0 0 26px rgba(217,147,14,.46),
		0 1px 0 rgba(255,255,255,.26);
}

/* ==========================================
   MAP DISPLAY
========================================== */

body .map-collection-container .map-display {
	position: relative;

	order: 1;

	width: 100%;
	min-width: 0;

	margin: 0 !important;
	padding: 0 !important;
}

body .map-collection-container .map-display .content {
	position: relative;

	width: 100%;
	height: var(--map-height);

	margin: 0 !important;
	padding: 0 !important;

	background:
		linear-gradient(180deg, rgba(0,0,0,.08), rgba(0,0,0,.16));

	border-radius:
		calc(var(--map-card-radius) - 0.35rem)
		calc(var(--map-card-radius) - 0.35rem)
		0
		0;

	overflow: hidden;
}

/* Map glaze */

body .map-collection-container .map-display .content::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 2;

	background:
		linear-gradient(180deg, rgba(0,0,0,.04), rgba(0,0,0,.16)),
		radial-gradient(circle at 50% 18%, rgba(255,255,255,.18), transparent 38%);

	pointer-events: none;
}

body .map-collection-container .map-display iframe {
	display: block;

	width: 100% !important;
	height: 100% !important;
	min-height: 100% !important;

	margin: 0 !important;
	padding: 0 !important;

	border: 0 !important;

	filter:
		saturate(.96)
		contrast(1.02);

	transform: scale(1.001);

	transition:
		filter 0.45s ease,
		transform 0.45s ease;
}

body .map-collection-container .map-contact-container:hover .map-display iframe,
body .map-collection-container .map-contact-container:focus-within .map-display iframe {
	filter:
		saturate(1.08)
		contrast(1.04);

	transform: scale(1.025);
}

/* ==========================================
   ADDRESS PLAQUE
========================================== */

body .map-collection-container .map-address {
	position: relative;
	z-index: 3;

	order: 2;

	display: flex;
	flex-direction: column;

	width: 100%;
	min-width: 0;

	margin: 0 !important;
	padding:
		clamp(1rem, 1.7vw, 1.25rem)
		clamp(1rem, 1.7vw, 1.25rem)
		clamp(1.05rem, 1.8vw, 1.35rem) !important;

	background:
		radial-gradient(circle at 50% 0%, rgba(217,147,14,.24), transparent 56%),
		linear-gradient(180deg, rgba(0,0,0,.98), rgba(18,18,18,1));

	color: var(--ww-color-white);

	border-top: 1px solid rgba(217,147,14,.44);
	border-radius:
		0
		0
		calc(var(--map-card-radius) - 0.35rem)
		calc(var(--map-card-radius) - 0.35rem);

	box-shadow:
		inset 0 1px 0 rgba(255,255,255,.08),
		0 -10px 28px rgba(0,0,0,.18);

	text-align: center;
}

body .map-collection-container .map-address::before {
	content: "";
	position: absolute;
	left: 50%;
	top: 0;

	width: 58px;
	height: 4px;

	background: var(--ww-color-orange);
	border-radius: 0 0 999px 999px;

	box-shadow: 0 0 18px rgba(217,147,14,.38);

	transform: translateX(-50%);

	transition:
		width var(--ww-transition-fast),
		box-shadow var(--ww-transition-fast);
}

body .map-collection-container .map-contact-container:hover .map-address::before,
body .map-collection-container .map-contact-container:focus-within .map-address::before {
	width: 84px;

	box-shadow: 0 0 26px rgba(217,147,14,.55);
}

body .map-collection-container .map-address > label {
	display: block;

	margin: 0 0 0.55rem !important;
	padding: 0 !important;

	color: var(--ww-color-white) !important;

	font-size: clamp(1.02rem, 1.25vw, 1.24rem);
	font-weight: 950;
	line-height: 1.08;
	letter-spacing: -0.025em;
	text-align: center;
}

body .map-collection-container .map-address .content {
	margin: 0 !important;
	padding: 0 !important;
}

body .map-collection-container .map-address p {
	position: relative;

	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.45rem;

	margin: 0 !important;
	padding: 0 !important;

	color: rgba(255,255,255,.78) !important;

	font-size: clamp(0.92rem, 1.05vw, 1.02rem);
	font-weight: 650;
	line-height: 1.45;
	text-align: center;
}

body .map-collection-container .map-address p::before {
	content: "";

	display: inline-block;
	flex: 0 0 auto;

	width: 0.72rem;
	height: 0.72rem;

	background: var(--ww-color-orange);

	-webkit-mask:
		url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='black' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 2C8.13 2 5 5.13 5 9c0 5.25 7 13 7 13s7-7.75 7-13c0-3.87-3.13-7-7-7Zm0 9.5A2.5 2.5 0 1 1 12 6a2.5 2.5 0 0 1 0 5.5Z'/%3E%3C/svg%3E")
		center / contain no-repeat;
	mask:
		url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='black' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 2C8.13 2 5 5.13 5 9c0 5.25 7 13 7 13s7-7.75 7-13c0-3.87-3.13-7-7-7Zm0 9.5A2.5 2.5 0 1 1 12 6a2.5 2.5 0 0 1 0 5.5Z'/%3E%3C/svg%3E")
		center / contain no-repeat;
}

/* ==========================================
   CONTACT MAP COLLECTION RESPONSIVE
========================================== */

@media (min-width: 768px) and (max-width: 1200px) {

	body .map-collection-container {
		--map-height: clamp(300px, 36vw, 420px);
	}

	body .map-collection-container > .i {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	body .map-collection-container .map-contact-container:last-child {
		grid-column: 1 / -1;
	}

	body .map-collection-container .map-contact-container:last-child .map-display .content {
		height: clamp(320px, 34vw, 440px);
	}

}

@media (max-width: 767px) {

	body .map-collection-container {
		--map-collection-radius: var(--ww-radius-m);
		--map-card-radius: var(--ww-radius-m);
		--map-card-pad: 0.65rem;
		--map-height: clamp(260px, 76vw, 360px);

		margin: clamp(1.5rem, 8vw, 3rem) auto !important;
		padding:
			clamp(2rem, 9vw, 3rem)
			0.85rem
			clamp(2rem, 9vw, 3rem) !important;
	}

	body .map-collection-container > label {
		margin-bottom: 1.65rem !important;

		font-size: clamp(2.25rem, 13vw, 3.6rem);
	}

	body .map-collection-container > .i {
		grid-template-columns: 1fr;
		gap: 1rem;
	}

	body .map-collection-container .map-contact-container {
		border-radius: var(--ww-radius-m);
	}

	body .map-collection-container .map-contact-container::after {
		top: 1rem;
		left: 1rem;

		width: 38px;
		height: 38px;

		font-size: 0.78rem;
	}

	body .map-collection-container .map-display .content {
		border-radius:
			calc(var(--ww-radius-m) - 0.25rem)
			calc(var(--ww-radius-m) - 0.25rem)
			0
			0;
	}

	body .map-collection-container .map-address {
		border-radius:
			0
			0
			calc(var(--ww-radius-m) - 0.25rem)
			calc(var(--ww-radius-m) - 0.25rem);
	}

	body .map-collection-container .map-address > label {
		font-size: 1.05rem;
	}

	body .map-collection-container .map-address p {
		font-size: 0.92rem;
	}

}

@media (max-width: 420px) {

	body .map-collection-container {
		padding-left: 0.65rem !important;
		padding-right: 0.65rem !important;
	}

	body .map-collection-container .map-address p {
		display: block;
	}

	body .map-collection-container .map-address p::before {
		display: block;

		margin: 0 auto 0.4rem;
	}

}

/* ==========================================
   REDUCED MOTION
========================================== */

@media (prefers-reduced-motion: reduce) {

	body .map-collection-container .map-contact-container,
	body .map-collection-container .map-contact-container::before,
	body .map-collection-container .map-display iframe,
	body .map-collection-container .map-address::before {
		transition: none !important;
	}

	body .map-collection-container .map-contact-container:hover,
	body .map-collection-container .map-contact-container:focus-within,
	body .map-collection-container .map-contact-container:hover::before,
	body .map-collection-container .map-contact-container:focus-within::before,
	body .map-collection-container .map-contact-container:hover .map-display iframe,
	body .map-collection-container .map-contact-container:focus-within .map-display iframe {
		transform: none !important;
	}

}

 /* Begin CSS Part: Results */

 /* Begin CSS Part: Pages */
/* ==========================================
   PAGE SECTION CONTACT INFO
   Scoped to contact details inside:
   .page-section-content.page-section-contact
========================================== */

body .page-section-content.page-section-contact {
	position: relative;
	isolation: isolate;
}

/* Inner layout */
body .page-section-content.page-section-contact > .i {
	display: grid !important;
	gap: clamp(1rem, 2vw, 1.4rem);

	width: 100%;
	min-width: 0;

	margin: 0 !important;
	padding: 0 !important;
}

/* Intro content spans full width */
body .page-section-content.page-section-contact .page-content {
	grid-column: 1 / -1;

	width: 100%;
	max-width: 760px;

	margin: 0 0 clamp(0.4rem, 1vw, 0.8rem) !important;
	padding: 0 !important;
}

/* ==========================================
   CONTACT INFO CARDS
========================================== */

body .page-section-content.page-section-contact .company-info {
	position: relative;
	isolation: isolate;

	display: flex;
	flex-direction: column;
	justify-content: flex-start;

	margin: 0 !important;
	padding: clamp(1.25rem, 2vw, 1.65rem) clamp(1.1rem, 2vw, 1.5rem) clamp(1.2rem, 2vw, 1.55rem) clamp(4.65rem, 5vw, 5.1rem) !important;

	background:
		radial-gradient(circle at 94% 12%, rgba(217,147,14,.15), transparent 34%),
		linear-gradient(180deg, rgba(255,255,255,1), rgba(255,255,255,.94));

	border: 1px solid rgba(217,147,14,.26);
	border-radius: var(--ww-radius-l);

	box-shadow:
		0 18px 48px rgba(0,0,0,.09),
		0 0 0 1px rgba(255,255,255,.72),
		inset 0 1px 0 rgba(255,255,255,.92);

	overflow: hidden;

	transition:
		transform var(--ww-transition-fast),
		border-color var(--ww-transition-fast),
		box-shadow var(--ww-transition-fast);
}

/* Orange top accent */
body .page-section-content.page-section-contact .company-info::after {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	z-index: 3;

	width: 100%;
	height: 6px;

	background:
		linear-gradient(
			90deg,
			var(--ww-color-orange),
			rgba(217,147,14,.42),
			var(--ww-color-orange)
		);

	pointer-events: none;
}

/* Icon circle */
body .page-section-content.page-section-contact .company-info::before {
	position: absolute;
	left: clamp(1.1rem, 1.8vw, 1.35rem);
	top: clamp(1.35rem, 2vw, 1.65rem);
	z-index: 2;

	display: flex;
	align-items: center;
	justify-content: center;

	width: clamp(2.5rem, 3vw, 3rem);
	height: clamp(2.5rem, 3vw, 3rem);

	background:
		radial-gradient(circle at 35% 25%, rgba(255,255,255,.48), transparent 36%),
		var(--ww-color-orange);

	color: var(--ww-color-black);

	border: 5px solid rgba(217,147,14,.16);
	border-radius: 999px;

	box-shadow:
		0 12px 26px rgba(217,147,14,.22),
		inset 0 1px 0 rgba(255,255,255,.42);

	font-size: 1.25rem;
	font-weight: 900;
	line-height: 1;

	pointer-events: none;
}

/* Icons by existing classes */
body .page-section-content.page-section-contact .company-info.tel::before {
	content: "☎";
}

body .page-section-content.page-section-contact .company-info.mail::before {
	content: "✉";
}

body .page-section-content.page-section-contact .company-info.addy::before {
	content: "⌖";
}

/* Address card spans both columns */
body .page-section-content.page-section-contact .company-info.addy {
	grid-column: 1 / -1;
}

/* Soft corner glow */
body .page-section-content.page-section-contact .company-info .company-info-part::after {
	content: "";
	position: absolute;
	right: -70px;
	bottom: -70px;
	z-index: -1;

	width: 170px;
	height: 170px;

	background: rgba(217,147,14,.09);
	border-radius: 999px;

	pointer-events: none;
}

/* Hover */
body .page-section-content.page-section-contact .company-info:hover,
body .page-section-content.page-section-contact .company-info:focus-within {
	transform: translateY(-4px);

	border-color: rgba(217,147,14,.48);

	box-shadow:
		0 24px 62px rgba(0,0,0,.13),
		0 0 0 1px rgba(217,147,14,.08),
		inset 0 1px 0 rgba(255,255,255,.95);
}

/* ==========================================
   CONTACT INFO TEXT
========================================== */

body .page-section-content.page-section-contact .company-info label {
	position: relative;
	z-index: 2;

	display: block;

	margin: 0 0 0.55rem !important;
	padding: 0 !important;

	color: var(--ww-color-black);

	font-size: clamp(0.88rem, 1vw, 0.98rem);
	font-weight: 950;
	line-height: 1.15;
	letter-spacing: 0.035em;
	text-transform: uppercase;
}

body .page-section-content.page-section-contact .company-info-part {
	position: relative;
	z-index: 2;

	margin: 0 !important;
	padding: 0 !important;

	color: rgba(0,0,0,.74);

	font-size: clamp(1.02rem, 1.25vw, 1.16rem);
	font-weight: 700;
	line-height: 1.55;
}

/* Telephone link */
body .page-section-content.page-section-contact .company-info-part a,
body .page-section-content.page-section-contact .company-info-part a:visited {
	color: var(--ww-color-black);

	font-size: clamp(1.15rem, 1.55vw, 1.45rem);
	font-weight: 950;
	line-height: 1.2;
	text-decoration: none;
}

body .page-section-content.page-section-contact .company-info-part a:hover,
body .page-section-content.page-section-contact .company-info-part a:focus {
	color: var(--ww-color-orange);
}

/* Email text */
body .page-section-content.page-section-contact .company-info-part.email {
	color: var(--ww-color-black);

	font-size: clamp(1.05rem, 1.35vw, 1.3rem);
	font-weight: 900;
	line-height: 1.25;

	overflow-wrap: anywhere;
}

/* Address formatting */
body .page-section-content.page-section-contact .company-info-part.address {
	max-width: 620px;
}

body .page-section-content.page-section-contact .company-info-part.address [itemprop="address"] {
	display: grid;
	grid-template-columns: 1fr;
	gap: 0.18rem;
}

body .page-section-content.page-section-contact .company-info-part.address [itemprop] {
	margin: 0 !important;
	padding: 0 !important;
}

body .page-section-content.page-section-contact .company-info-part.address [itemprop="postalCode"] {
	display: inline-flex;
	align-items: center;
	justify-content: flex-start;

	width: fit-content;

	margin-top: 0.45rem !important;
	padding: 0.35rem 0.65rem !important;

	background: rgba(217,147,14,.12);
	color: var(--ww-color-black);

	border: 1px solid rgba(217,147,14,.28);
	border-radius: 999px;

	font-size: 0.92rem;
	font-weight: 950;
	line-height: 1.1;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

/* ==========================================
   CONTACT INTRO REFINEMENTS
========================================== */

body .page-section-content.page-section-contact .page-content h1,
body .page-section-content.page-section-contact .page-content h2 {
	margin-bottom: clamp(1rem, 2vw, 1.25rem) !important;
}

body .page-section-content.page-section-contact .page-content p {
	max-width: 680px;
}

body .page-section-content.page-section-contact .page-content p em {
	color: rgba(0,0,0,.58);

	font-size: 0.95rem;
	font-style: normal;
	font-weight: 800;
}

/* ==========================================
   RESPONSIVE
========================================== */

@media (max-width: 900px) {

	body .page-section-content.page-section-contact > .i {
		grid-template-columns: 1fr;
	}

	body .page-section-content.page-section-contact .company-info.addy {
		grid-column: auto;
	}

}

@media (max-width: 767px) {

	body .page-section-content.page-section-contact > .i {
		gap: 0.9rem;
	}

	body .page-section-content.page-section-contact .company-info {
		min-height: 0;

		padding:
			1.15rem
			1rem
			1.15rem
			4.25rem !important;

		border-radius: var(--ww-radius-m);
	}

	body .page-section-content.page-section-contact .company-info::before {
		left: 1rem;
		top: 1.15rem;

		width: 2.35rem;
		height: 2.35rem;

		font-size: 1.1rem;
	}

	body .page-section-content.page-section-contact .company-info label {
		font-size: 0.82rem;
	}

	body .page-section-content.page-section-contact .company-info-part,
	body .page-section-content.page-section-contact .company-info-part.email {
		font-size: 1rem;
	}

	body .page-section-content.page-section-contact .company-info-part a,
	body .page-section-content.page-section-contact .company-info-part a:visited {
		font-size: 1.12rem;
	}

}

/* ==========================================
   REDUCED MOTION
========================================== */

@media (prefers-reduced-motion: reduce) {

	body .page-section-content.page-section-contact .company-info,
	body .page-section-content.page-section-contact .company-info-part a {
		transition: none !important;
	}

	body .page-section-content.page-section-contact .company-info:hover,
	body .page-section-content.page-section-contact .company-info:focus-within {
		transform: none !important;
	}

}


/* ==========================================
   REPORTS / IMPACT DOWNLOAD SECTION
   4 ALL FOUNDATION

   Structure:
   .reports-section
      .recent-report
         > label              Current Report
         .textblock
            > label           Year label
            img
      .previous-reports
         > label              Previous Reports
         > .i
            .reportblock
               > label        Year label
               img
========================================== */

body .reports-section {
	--reports-radius: var(--ww-radius-l);
	--reports-gold: var(--ww-color-orange);
	--reports-soft-gold: rgba(217,147,14,.12);

	position: relative;
	isolation: isolate;

	width: 100%;
	max-width: min(1120px, 100%);

	margin: clamp(1.5rem, 4vw, 3rem) auto 0 !important;
	padding:
		clamp(2.25rem, 5vw, 4rem)
		clamp(1rem, 3vw, 2.5rem) !important;

	background:
		radial-gradient(circle at 14% 18%, rgba(217,147,14,.16), transparent 34%),
		radial-gradient(circle at 88% 82%, rgba(217,147,14,.1), transparent 36%),
		linear-gradient(180deg, rgba(255,255,255,1), rgba(250,247,241,1));

	border: 1px solid rgba(217,147,14,.22);
	border-radius: var(--reports-radius);

	box-shadow:
		0 26px 76px rgba(0,0,0,.09),
		0 0 0 1px rgba(255,255,255,.75),
		inset 0 1px 0 rgba(255,255,255,.95);

	text-align: center;

	overflow: hidden;
}

/* Soft grid texture */

body .reports-section::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 0;

	background:
		linear-gradient(90deg, rgba(217,147,14,.055) 1px, transparent 1px),
		linear-gradient(180deg, rgba(217,147,14,.04) 1px, transparent 1px);

	background-size: 54px 54px;

	opacity: .36;

	pointer-events: none;
}

/* Golden ambient glow */

body .reports-section::after {
	content: "";
	position: absolute;
	right: -140px;
	top: -140px;
	z-index: 0;

	width: clamp(260px, 34vw, 520px);
	height: clamp(260px, 34vw, 520px);

	background:
		radial-gradient(circle, rgba(217,147,14,.18), rgba(217,147,14,.07) 46%, transparent 72%);

	border-radius: 999px;

	pointer-events: none;
}

body .reports-section > * {
	position: relative;
	z-index: 1;
}


/* ==========================================
   GENERAL REPORT RESET
========================================== */

body .reports-section img {
	display: block !important;

	float: none !important;

	width: auto;
	max-width: 100%;
	height: auto !important;

	margin: 0 auto !important;
	padding: 0 !important;

	object-fit: contain;
}

body .reports-section p {
	margin: 0 !important;
	padding: 0 !important;
}

body .reports-section a {
	position: relative;

	display: inline-block;

	margin: 0 !important;
	padding: 0 !important;

	text-decoration: none !important;
	border-radius: calc(var(--reports-radius) - .45rem);
}


/* ==========================================
   RECENT / FEATURED REPORT
========================================== */

body .reports-section .recent-report {
	position: relative;
	isolation: isolate;

	width: min(100%, 540px);

	margin: 0 auto clamp(2rem, 5vw, 3.5rem) !important;
	padding:
		clamp(2.7rem, 4.6vw, 3.35rem)
		clamp(1.25rem, 3vw, 2rem)
		clamp(1.25rem, 3vw, 2rem) !important;

	background:
		radial-gradient(circle at 50% 0%, rgba(217,147,14,.18), transparent 52%),
		linear-gradient(180deg, rgba(0,0,0,.98), rgba(20,20,20,1));

	border: 1px solid rgba(217,147,14,.42);
	border-radius: var(--reports-radius);

	box-shadow:
		0 26px 72px rgba(0,0,0,.24),
		0 0 0 1px rgba(255,255,255,.08),
		inset 0 1px 0 rgba(255,255,255,.1);

	overflow: hidden;
}

/* Gold top shine */

body .reports-section .recent-report::after {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	z-index: 2;

	width: 100%;
	height: 7px;

	background:
		linear-gradient(
			90deg,
			rgba(217,147,14,.45),
			var(--reports-gold),
			rgba(255,230,170,.9),
			var(--reports-gold),
			rgba(217,147,14,.45)
		);

	pointer-events: none;
}

/* Main "Current Report" label */

body .reports-section .recent-report > label {
	position: absolute;
	left: 50%;
	top: 0;
	z-index: 4;

	display: inline-flex;
	align-items: center;
	justify-content: center;

	width: fit-content;

	margin: 0 !important;
	padding: 0.6rem 1.15rem !important;

	background: var(--reports-gold);
	color: var(--ww-color-black) !important;

	border-radius: 0 0 999px 999px;

	box-shadow:
		0 12px 28px rgba(0,0,0,.24),
		0 0 22px rgba(217,147,14,.18);

	font-size: 0.78rem;
	font-weight: 950;
	line-height: 1;
	letter-spacing: 0.08em;
	text-transform: uppercase;

	transform: translateX(-50%);

	pointer-events: none;
}

body .reports-section .recent-report > .i {
	width: 100%;
	min-width: 0;

	margin: 0 !important;
	padding: 0 !important;
}

body .reports-section .recent-report .textblock {
	position: relative;
	z-index: 3;

	display: flex !important;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 1rem;

	width: 100%;
	min-width: 0;

	margin: 0 !important;
	padding: 0 !important;
}

/* Empty h4 safety */

body .reports-section .recent-report h4:empty {
	display: none !important;
}

/* Featured year label */

body .reports-section .recent-report .textblock > label {
	display: inline-flex;
	align-items: center;
	justify-content: center;

	width: fit-content;

	margin: 0 auto 0.15rem !important;
	padding: 0.5rem 0.85rem !important;

	background: rgba(255,255,255,.1);
	color: rgba(255,255,255,.88) !important;

	border: 1px solid rgba(255,255,255,.16);
	border-radius: 999px;

	box-shadow:
		inset 0 1px 0 rgba(255,255,255,.08);

	font-size: 0.8rem;
	font-weight: 950;
	line-height: 1;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

body .reports-section .recent-report a {
	transition:
		transform var(--ww-transition-medium),
		box-shadow var(--ww-transition-medium),
		filter var(--ww-transition-medium);
}

body .reports-section .recent-report img {
	width: min(100%, 320px) !important;

	background: var(--ww-color-white);

	border: 1px solid rgba(255,255,255,.22);
	border-radius: calc(var(--reports-radius) - .5rem);

	box-shadow:
		0 24px 58px rgba(0,0,0,.34),
		0 0 0 10px rgba(255,255,255,.05);
}

body .reports-section .recent-report:hover a,
body .reports-section .recent-report:focus-within a {
	transform: translateY(-6px) scale(1.02);

	filter:
		saturate(1.04)
		contrast(1.02);

	box-shadow:
		0 30px 70px rgba(0,0,0,.34),
		0 0 34px rgba(217,147,14,.16);
}


/* ==========================================
   PREVIOUS REPORTS AREA
========================================== */

body .reports-section .previous-reports {
	position: relative;

	width: 100%;
	min-width: 0;

	margin: 0 auto !important;
	padding: clamp(1.35rem, 3vw, 2.1rem) 0 0 !important;

	border-top: 1px solid rgba(217,147,14,.24);
}

/* Actual HTML label */

body .reports-section .previous-reports > label {
	display: flex;
	align-items: center;
	justify-content: center;

	width: fit-content;

	margin: 0 auto clamp(1.25rem, 3vw, 2rem) !important;
	padding: 0.55rem 0.95rem !important;

	background: rgba(217,147,14,.12);
	color: var(--ww-color-black) !important;

	border: 1px solid rgba(217,147,14,.26);
	border-radius: 999px;

	font-size: 0.82rem;
	font-weight: 950;
	line-height: 1;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

body .reports-section .previous-reports > .i {
	display: grid !important;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: clamp(1rem, 2vw, 1.5rem);

	align-items: stretch;

	width: 100%;
	min-width: 0;

	margin: 0 !important;
	padding: 0 !important;
}


/* ==========================================
   PREVIOUS REPORT CARD
========================================== */

body .reports-section .previous-reports > .i > .layout-component {
	position: relative;
	isolation: isolate;

	display: flex !important;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	gap: 0.85rem;

	min-width: 0;
	min-height: 100%;

	margin: 0 !important;
	padding:
		clamp(1.1rem, 2vw, 1.45rem)
		clamp(0.9rem, 1.8vw, 1.25rem)
		clamp(0.95rem, 1.8vw, 1.2rem) !important;

	background:
		linear-gradient(180deg, rgba(255,255,255,1), rgba(255,250,241,1));

	border: 1px solid rgba(217,147,14,.22);
	border-radius: var(--ww-radius-m);

	box-shadow:
		0 16px 42px rgba(0,0,0,.08),
		inset 0 1px 0 rgba(255,255,255,.92);

	overflow: hidden;

	transition:
		transform var(--ww-transition-fast),
		box-shadow var(--ww-transition-fast),
		border-color var(--ww-transition-fast);
}

body .reports-section .previous-reports > .i > .layout-component::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	z-index: 1;

	width: 100%;
	height: 5px;

	background:
		linear-gradient(
			90deg,
			var(--reports-gold),
			rgba(217,147,14,.38),
			var(--reports-gold)
		);

	pointer-events: none;
}

body .reports-section .previous-reports > .i > .layout-component::after {
	content: "";
	position: absolute;
	right: -58px;
	top: -58px;
	z-index: 0;

	width: 128px;
	height: 128px;

	background: rgba(217,147,14,.1);
	border-radius: 999px;

	pointer-events: none;

	transition:
		transform var(--ww-transition-medium),
		opacity var(--ww-transition-medium);
}

body .reports-section .previous-reports > .i > .layout-component:hover,
body .reports-section .previous-reports > .i > .layout-component:focus-within {
	transform: translateY(-5px);

	border-color: rgba(217,147,14,.42);

	box-shadow:
		0 22px 58px rgba(0,0,0,.12),
		0 0 24px rgba(217,147,14,.1),
		inset 0 1px 0 rgba(255,255,255,.95);
}

body .reports-section .previous-reports > .i > .layout-component:hover::after,
body .reports-section .previous-reports > .i > .layout-component:focus-within::after {
	opacity: .9;
	transform: scale(1.12);
}

/* Hide empty placeholder slots */

body .reports-section .previous-reports > .i > .layout-component.empty {
	display: none !important;
}

/* Previous report year label */

body .reports-section .previous-reports > .i > .layout-component > label {
	position: relative;
	z-index: 2;

	display: inline-flex;
	align-items: center;
	justify-content: center;

	width: fit-content;

	margin: 0 auto !important;
	padding: 0.42rem 0.75rem !important;

	background: rgba(217,147,14,.12);
	color: var(--ww-color-black) !important;

	border: 1px solid rgba(217,147,14,.26);
	border-radius: 999px;

	font-size: 0.78rem;
	font-weight: 950;
	line-height: 1;
	letter-spacing: 0.05em;
	text-transform: uppercase;
}

body .reports-section .previous-reports > .i > .layout-component p {
	position: relative;
	z-index: 2;
}

body .reports-section .previous-reports > .i > .layout-component a {
	transition:
		transform var(--ww-transition-fast),
		filter var(--ww-transition-fast);
}

body .reports-section .previous-reports > .i > .layout-component img {
	width: min(100%, 190px) !important;

	background: var(--ww-color-white);

	border: 1px solid rgba(0,0,0,.08);
	border-radius: calc(var(--ww-radius-m) - .35rem);

	box-shadow:
		0 12px 30px rgba(0,0,0,.12);
}

body .reports-section .previous-reports > .i > .layout-component:hover a,
body .reports-section .previous-reports > .i > .layout-component:focus-within a {
	transform: translateY(-3px);

	filter:
		saturate(1.04)
		contrast(1.02);
}


/* ==========================================
   REPORT DOWNLOAD AFFORDANCE
   Adds a subtle arrow icon without changing HTML
========================================== */

body .reports-section .recent-report a::after,
body .reports-section .previous-reports > .i > .layout-component a::after {
	content: "";

	position: absolute;
	right: clamp(0.5rem, 1vw, 0.75rem);
	bottom: clamp(0.5rem, 1vw, 0.75rem);
	z-index: 3;

	display: inline-block;

	width: 38px;
	height: 38px;

	background: var(--reports-gold);

	border-radius: 999px;

	box-shadow:
		0 10px 24px rgba(0,0,0,.2);

	opacity: 0;

	transform: translateY(4px);

	transition:
		opacity var(--ww-transition-fast),
		transform var(--ww-transition-fast);
}

body .reports-section .recent-report a::before,
body .reports-section .previous-reports > .i > .layout-component a::before {
	content: "";

	position: absolute;
	right: calc(clamp(0.5rem, 1vw, 0.75rem) + 14px);
	bottom: calc(clamp(0.5rem, 1vw, 0.75rem) + 14px);
	z-index: 4;

	width: 0.55rem;
	height: 0.55rem;

	border-right: 3px solid var(--ww-color-black);
	border-bottom: 3px solid var(--ww-color-black);

	opacity: 0;

	transform: rotate(-45deg) translateY(4px);

	transition:
		opacity var(--ww-transition-fast),
		transform var(--ww-transition-fast);
}

body .reports-section .recent-report:hover a::after,
body .reports-section .recent-report:focus-within a::after,
body .reports-section .recent-report:hover a::before,
body .reports-section .recent-report:focus-within a::before,
body .reports-section .previous-reports > .i > .layout-component:hover a::after,
body .reports-section .previous-reports > .i > .layout-component:focus-within a::after,
body .reports-section .previous-reports > .i > .layout-component:hover a::before,
body .reports-section .previous-reports > .i > .layout-component:focus-within a::before {
	opacity: 1;
}

body .reports-section .recent-report:hover a::after,
body .reports-section .recent-report:focus-within a::after,
body .reports-section .previous-reports > .i > .layout-component:hover a::after,
body .reports-section .previous-reports > .i > .layout-component:focus-within a::after {
	transform: translateY(0);
}

body .reports-section .recent-report:hover a::before,
body .reports-section .recent-report:focus-within a::before,
body .reports-section .previous-reports > .i > .layout-component:hover a::before,
body .reports-section .previous-reports > .i > .layout-component:focus-within a::before {
	transform: rotate(-45deg) translate(2px, 2px);
}


/* ==========================================
   REPORTS RESPONSIVE
========================================== */

@media (min-width: 768px) and (max-width: 1200px) {

	body .reports-section .previous-reports > .i {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	body .reports-section .previous-reports > .i > .layout-component img {
		width: min(100%, 220px) !important;
	}

}

@media (max-width: 767px) {

	body .reports-section {
		border-radius: var(--ww-radius-m);

		padding:
			clamp(2rem, 9vw, 3rem)
			1rem !important;
	}

	body .reports-section .recent-report {
		width: 100%;

		border-radius: var(--ww-radius-m);
	}

	body .reports-section .recent-report img {
		width: min(100%, 260px) !important;
	}

	body .reports-section .previous-reports > .i {
		grid-template-columns: 1fr;
		gap: 1rem;
	}

	body .reports-section .previous-reports > .i > .layout-component {
		border-radius: var(--ww-radius-m);
	}

	body .reports-section .previous-reports > .i > .layout-component img {
		width: min(100%, 230px) !important;
	}

}


/* ==========================================
   REDUCED MOTION
========================================== */

@media (prefers-reduced-motion: reduce) {

	body .reports-section .recent-report a,
	body .reports-section .previous-reports > .i > .layout-component,
	body .reports-section .previous-reports > .i > .layout-component::after,
	body .reports-section .previous-reports > .i > .layout-component a,
	body .reports-section .recent-report a::before,
	body .reports-section .recent-report a::after,
	body .reports-section .previous-reports > .i > .layout-component a::before,
	body .reports-section .previous-reports > .i > .layout-component a::after {
		transition: none !important;
	}

	body .reports-section .recent-report:hover a,
	body .reports-section .recent-report:focus-within a,
	body .reports-section .previous-reports > .i > .layout-component:hover,
	body .reports-section .previous-reports > .i > .layout-component:focus-within,
	body .reports-section .previous-reports > .i > .layout-component:hover::after,
	body .reports-section .previous-reports > .i > .layout-component:focus-within::after,
	body .reports-section .previous-reports > .i > .layout-component:hover a,
	body .reports-section .previous-reports > .i > .layout-component:focus-within a {
		transform: none !important;
	}

}





/* ==========================================
   ISSUU ANNUAL REPORT EMBED
   Impact page catalogue frame
========================================== */

body .issuu-report-embed {
	position: relative;
	isolation: isolate;

	width: 100%;
	max-width: var(--ww-container-max);

	margin: clamp(2rem, 5vw, 4rem) auto;
	padding: clamp(1rem, 2.5vw, 1.5rem);

	background:
		radial-gradient(circle at 92% 8%, rgba(217,147,14,.16), transparent 32%),
		linear-gradient(180deg, rgba(255,255,255,1), rgba(255,250,241,1));

	border: 1px solid rgba(217,147,14,.24);
	border-radius: var(--ww-radius-l);

	box-shadow:
		0 22px 64px rgba(0,0,0,.1),
		inset 0 1px 0 rgba(255,255,255,.92);

	overflow: hidden;
}

body .issuu-report-embed::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	z-index: 2;

	width: 100%;
	height: 7px;

	background:
		linear-gradient(
			90deg,
			var(--ww-color-orange),
			rgba(217,147,14,.44),
			var(--ww-color-orange)
		);

	pointer-events: none;
}

body .issuu-report-embed__intro {
	position: relative;
	z-index: 1;

	max-width: 760px;

	margin: 0 0 clamp(1rem, 2.5vw, 1.5rem);
	padding: clamp(.75rem, 1.8vw, 1rem) clamp(.5rem, 1vw, .75rem) 0;
}

body .issuu-report-embed__intro h2 {
	margin: 0 0 .65rem !important;

	color: var(--ww-color-black);

	font-size: clamp(1.8rem, 4vw, 3.2rem);
	font-weight: 950;
	line-height: 1.02;
	letter-spacing: -.055em;
	text-wrap: balance;
}

body .issuu-report-embed__intro p {
	margin: 0 !important;

	color: var(--ww-color-muted);

	font-size: clamp(1rem, 1.4vw, 1.12rem);
	line-height: 1.65;
}

body .issuu-report-embed__frame {
	position: relative;
	z-index: 1;

	width: 100%;

	aspect-ratio: 16 / 10;

	background: var(--ww-color-black);
	border: 1px solid rgba(0,0,0,.1);
	border-radius: var(--ww-radius-m);

	box-shadow:
		0 18px 48px rgba(0,0,0,.16),
		inset 0 1px 0 rgba(255,255,255,.18);

	overflow: hidden;
}

body .issuu-report-embed__frame iframe {
	position: absolute;
	inset: 0;

	display: block;

	width: 100%;
	height: 100%;

	margin: 0;
	padding: 0;

	background: var(--ww-color-white);
	border: 0;
}

body .issuu-report-embed__actions {
	position: relative;
	z-index: 1;

	display: flex;
	flex-wrap: wrap;
	gap: .75rem;

	margin-top: clamp(1rem, 2vw, 1.35rem);
	padding: 0 clamp(.5rem, 1vw, .75rem) clamp(.25rem, 1vw, .5rem);
}

@media (max-width: 767px) {

	body .issuu-report-embed {
		border-radius: var(--ww-radius-m);
	}

	body .issuu-report-embed__frame {
		aspect-ratio: 4 / 5;
		border-radius: var(--ww-radius-s);
	}

	body .issuu-report-embed__actions .button {
		width: 100%;
		justify-content: center;
	}

}
 /** Begin CSS Section: modules */

 /* Begin CSS Part: 404 */

 /* Begin CSS Part: Admin */

 /* Begin CSS Part: Auto Pdf */

 /* Begin CSS Part: Basket */

 /* Begin CSS Part: Calendar */

 /* Begin CSS Part: Categories */
/* Begin CSS Part: Categories */
/* ==========================================
   WATMAN WEB FRAMEWORK
   CATEGORIES / OUTPUT CARDS
   4 ALL FOUNDATION
========================================== */

.card-output > .layout-cell,
.card-output > .i {
	display: flex;
	flex-direction: column;
	height: 100%;
}

.card-output .card-content-container {
	display: flex;
	flex-direction: column;
	flex: 1;
	padding: var(--ww-space-m);
}

.card-output .title h2,
.card-output .title h3,
.card-output .title h4 {
	margin-bottom: 0.75rem;
}

.card-output .abstract {
	margin-bottom: 1rem;
}

.card-output .specific-component {
	margin-top: auto;
	color: var(--ww-color-muted);
	font-size: 0.9rem;
	font-weight: 800;
}

.card-output .card-action-container {
	padding: 0 var(--ww-space-m) var(--ww-space-m);
}

.card-output .collation-item-link,
.card-output .collation-item-link:visited {
	display: inline-flex;
	align-items: center;
	justify-content: center;

	min-height: 46px;
	padding: 0.8rem 1.35rem;

	background: var(--ww-color-button-bg);
	color: var(--ww-color-button-text);

	border: 2px solid var(--ww-color-button-border);
	border-radius: 999px;

	font-weight: 800;
	line-height: 1;
	text-decoration: none;

	transition:
		background-color var(--ww-transition-fast),
		color var(--ww-transition-fast),
		border-color var(--ww-transition-fast),
		transform var(--ww-transition-fast);
}

.card-output .collation-item-link:hover,
.card-output .collation-item-link:focus {
	background: var(--ww-color-button-bg-hover);
	color: var(--ww-color-button-text-hover);
	border-color: var(--ww-color-button-border-hover);
	transform: translateY(-1px);
}





/* ==========================================
   HUB / LOCATION LISTINGS
   4 ALL FOUNDATION
   Scoped to .hub-listings and .hub-listing only.
========================================== */

/* ==========================================
   OUTER LIST WRAPPER
========================================== */

body .hub-listings {
	background:
		linear-gradient(180deg, rgba(217,147,14,.055), rgba(255,255,255,1) 360px),
		var(--ww-color-white);
}

/* Add breathing room when hub listings follow another page section */

body .page-section.hub-listings {
	padding-top: clamp(3rem, 6vw, 5rem) !important;
}

body .hub-listings > .i {
	width: calc(100% - (var(--ww-page-gutter) * 2));
	max-width: var(--ww-container-max);

	margin-left: auto;
	margin-right: auto;
}

body .hub-listings > .i > .categories,
body .hub-listings > .i > .categories > .layout.mod_collation_component_categories {
	width: 100%;
	min-width: 0;
}

body .hub-listings > .i > .categories > .layout.mod_collation_component_categories {
	display: grid !important;
	grid-template-columns: 1fr !important;
	gap: clamp(1.25rem, 2.5vw, 2rem) !important;
}

/* ==========================================
   MAIN LOCATION CARD
========================================== */

body .hub-listing.card-output {
	position: relative;
	isolation: isolate;

	width: 100%;
	min-width: 0;

	background: var(--ww-color-white);

	border: 1px solid rgba(0,0,0,.08);
	border-radius: var(--ww-radius-l);

	box-shadow:
		0 16px 44px rgba(0,0,0,.08),
		inset 0 1px 0 rgba(255,255,255,.9);

	overflow: hidden;

	transition:
		transform var(--ww-transition-fast),
		box-shadow var(--ww-transition-fast),
		border-color var(--ww-transition-fast);
}

body .hub-listing.card-output:hover,
body .hub-listing.card-output:focus-within {
	transform: translateY(-5px);
	border-color: rgba(217,147,14,.5);

	box-shadow:
		0 26px 70px rgba(0,0,0,.14),
		0 0 0 1px rgba(217,147,14,.12),
		inset 0 1px 0 rgba(255,255,255,.95);
}

body .hub-listing.card-output::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	z-index: 3;

	width: 100%;
	height: 7px;

	background: linear-gradient(
		90deg,
		var(--ww-color-orange),
		rgba(217,147,14,.45),
		var(--ww-color-orange)
	);

	pointer-events: none;
}

body .hub-listing.card-output::after {
	content: "";
	position: absolute;
	right: -100px;
	bottom: -100px;
	z-index: 0;

	width: 260px;
	height: 260px;

	background: rgba(217,147,14,.10);
	border-radius: 999px;

	pointer-events: none;

	transition:
		transform var(--ww-transition-medium),
		opacity var(--ww-transition-medium);
}

body .hub-listing.card-output:hover::after {
	opacity: 0.95;
	transform: scale(1.15);
}

/* Override generic card-output behaviour for this generated structure */

body .hub-listing.card-output > .layout-cell,
body .hub-listing.card-output > .layout-cell > .layout-cell {
	display: grid !important;
	flex: initial !important;

	width: 100%;
	min-width: 0;
	height: auto !important;

	margin: 0 !important;
	padding: 0 !important;
}

body .hub-listing.card-output > .layout-cell > .layout-cell {
	grid-template-columns: minmax(260px, 34%) minmax(0, 1fr) !important;
	align-items: stretch;
}

/* ==========================================
   LOCATION IMAGE
========================================== */

body .hub-listing .card-image-container {
	position: relative;
	z-index: 1;

	display: block !important;

	width: 100%;
	height: 100%;
	min-height: 300px;

	background: var(--ww-color-black);

	overflow: hidden;
}

body .hub-listing .card-image-container .image,
body .hub-listing .card-image-container .layout-component {
	width: 100%;
	height: 100%;

	margin: 0 !important;
	padding: 0 !important;
}

body .hub-listing .card-image-container img {
	display: block;

	width: 100% !important;
	height: 100% !important;
	max-width: none !important;

	object-fit: cover;
	object-position: center;

	transform: scale(1);

	transition:
		transform 0.45s ease,
		opacity 0.45s ease;
}

body .hub-listing:hover .card-image-container img {
	transform: scale(1.045);
}

body .hub-listing .card-image-container::after {
	content: "";
	position: absolute;
	inset: 0;

	background:
		linear-gradient(90deg, transparent 55%, rgba(0,0,0,.24)),
		linear-gradient(0deg, rgba(0,0,0,.16), transparent 48%);

	pointer-events: none;
}

/* ==========================================
   LOCATION CONTENT
========================================== */

body .hub-listing .card-content-container {
	position: relative !important;
	z-index: 2;

	display: grid !important;
	grid-template-columns: minmax(0, 1fr) auto;
	grid-template-areas:
		"title link"
		"hubs hubs";
	align-content: center;
	gap: 1rem 1.5rem;

	width: 100%;
	min-width: 0;

	padding: clamp(1.5rem, 3vw, 2.5rem) !important;

	background:
		linear-gradient(180deg, rgba(255,255,255,1), rgba(255,255,255,.96));
}

body .hub-listing .card-content-container > .title {
	grid-area: title;

	margin: 0 !important;
	padding: 0 !important;

	color: var(--ww-color-black);

	font-size: clamp(1.8rem, 3vw, 3rem);
	font-weight: 900;
	line-height: 1.02;
	letter-spacing: -0.05em;
	text-wrap: balance;
}

/* Main location link */

body .hub-listing .card-content-container > .link {
	grid-area: link;

	align-self: start;
	justify-self: end;

	margin: 0 !important;
	padding: 0 !important;
}

body .hub-listing .card-content-container > .link .category-link,
body .hub-listing .card-content-container > .link .category-link:visited {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.45rem;

	min-height: 48px;
	padding: 0.85rem 1.15rem;

	background: var(--ww-color-black);
	color: var(--ww-color-orange);

	border: 2px solid var(--ww-color-black);
	border-radius: 999px;

	font-size: 0.9rem;
	font-weight: 900;
	line-height: 1;
	text-decoration: none;
	white-space: nowrap;

	transition:
		background-color var(--ww-transition-fast),
		color var(--ww-transition-fast),
		border-color var(--ww-transition-fast),
		transform var(--ww-transition-fast);
}

body .hub-listing .card-content-container > .link .category-link::after {
	content: "";
	display: inline-block;

	width: 0.45rem;
	height: 0.45rem;

	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;

	transform: rotate(-45deg);
}

body .hub-listing .card-content-container > .link .category-link:hover,
body .hub-listing .card-content-container > .link .category-link:focus {
	background: var(--ww-color-orange);
	color: var(--ww-color-black);
	border-color: var(--ww-color-orange);

	transform: translateY(-1px);
}

/* ==========================================
   NESTED HUBS
========================================== */

body .hub-listing .card-content-container > .categories {
	grid-area: hubs;

	width: 100%;
	min-width: 0;

	margin: 0 !important;
	padding: 0 !important;
}

body .hub-listing .card-content-container > .categories > label {
	display: block;

	margin: 0 0 0.75rem !important;
	padding: 0 !important;

	color: rgba(0,0,0,.58);

	font-size: 0.78rem;
	font-weight: 900;
	line-height: 1;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

body .hub-listing .card-content-container > .categories.empty {
	display: block !important;
}

body .hub-listing .card-content-container > .categories.empty label {
	margin-bottom: 0 !important;
}

body .hub-listing .card-content-container > .categories.empty::after {
	content: "No hubs currently listed for this location.";

	display: block;

	margin-top: 0.55rem;
	padding: 0.85rem 1rem;

	background: rgba(217,147,14,.08);
	border: 1px solid rgba(217,147,14,.2);
	border-radius: var(--ww-radius-m);

	color: rgba(0,0,0,.68);

	font-size: 0.95rem;
	font-weight: 750;
	line-height: 1.35;
}

/* Nested hub list: fixed 2-column layout */

body .hub-listing .card-content-container > .categories > .layout.mod_collation_component_categories {
	display: grid !important;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 0.65rem;

	width: 100%;
	min-width: 0;
}

/* If there is only one hub, let it span the full width */

body .hub-listing .card-content-container > .categories > .layout.mod_collation_component_categories > .iteration:only-child {
	grid-column: 1 / -1;
}

/* Nested hub item */

body .hub-listing .card-content-container > .categories .iteration {
	position: relative;

	min-width: 0;

	background:
		linear-gradient(135deg, rgba(217,147,14,.10), rgba(217,147,14,.045));

	border: 1px solid rgba(217,147,14,.22);
	border-radius: var(--ww-radius-m);

	overflow: hidden;

	transition:
		background-color var(--ww-transition-fast),
		border-color var(--ww-transition-fast),
		transform var(--ww-transition-fast),
		box-shadow var(--ww-transition-fast);
}

body .hub-listing .card-content-container > .categories .iteration:hover,
body .hub-listing .card-content-container > .categories .iteration:focus-within {
	background: rgba(217,147,14,.14);
	border-color: rgba(217,147,14,.42);

	transform: translateY(-2px);

	box-shadow: 0 12px 28px rgba(0,0,0,.08);
}

body .hub-listing .card-content-container > .categories .iteration > .layout-cell {
	position: relative;

	display: flex !important;
	align-items: center;
	justify-content: space-between;
	gap: 0.75rem;

	width: 100%;
	min-width: 0;

	margin: 0 !important;
	padding: 0.85rem 1rem !important;
}

/* Nested hub title */

body .hub-listing .card-content-container > .categories .iteration .title {
	margin: 0 !important;
	padding: 0 !important;

	color: var(--ww-color-black);

	font-size: 0.98rem;
	font-weight: 900;
	line-height: 1.25;
}

body .hub-listing .card-content-container > .categories .iteration .title::after {
	content: "";

	flex: 0 0 auto;

	display: inline-block;

	width: 0.45rem;
	height: 0.45rem;

	margin-left: 0.55rem;

	border-right: 2px solid var(--ww-color-orange);
	border-bottom: 2px solid var(--ww-color-orange);

	transform: rotate(-45deg) translateY(-1px);
}

/* Hide empty generated link component */

body .hub-listing .card-content-container > .categories .iteration .link:empty {
	display: none !important;
}

/* Make nested hub overlay link cover its hub item */

body .hub-listing .card-content-container > .categories .iteration a.category-link.wrap.inflate {
	position: absolute !important;
	inset: 0 !important;
	z-index: 4 !important;

	display: block !important;

	width: 100% !important;
	height: 100% !important;
	min-height: 0 !important;

	margin: 0 !important;
	padding: 0 !important;

	font-size: 0 !important;
	line-height: 0 !important;
	text-indent: -9999px !important;

	background: transparent !important;
	color: transparent !important;
	text-decoration: none !important;

	border: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;

	transform: none !important;
	outline: none;

	cursor: pointer;
}

/* ==========================================
   TABLET HUB LISTINGS
========================================== */

@media (min-width: 768px) and (max-width: 1200px) {

	body .hub-listing.card-output > .layout-cell > .layout-cell {
		grid-template-columns: minmax(220px, 32%) minmax(0, 1fr) !important;
	}

	body .hub-listing .card-image-container {
		min-height: 280px;
	}

	body .hub-listing .card-content-container {
		grid-template-columns: 1fr;
		grid-template-areas:
			"title"
			"link"
			"hubs";
		gap: 1rem;
	}

	body .hub-listing .card-content-container > .link {
		justify-self: start;
	}

	body .hub-listing .card-content-container > .categories > .layout.mod_collation_component_categories {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

}

/* ==========================================
   MOBILE HUB LISTINGS
========================================== */

@media (max-width: 767px) {

	body .hub-listings > .i > .categories > .layout.mod_collation_component_categories {
		gap: 1.25rem !important;
	}

	body .hub-listing.card-output {
		border-radius: var(--ww-radius-m);
	}

	body .hub-listing.card-output > .layout-cell > .layout-cell {
		grid-template-columns: 1fr !important;
	}

	body .hub-listing .card-image-container {
		min-height: 220px;
		aspect-ratio: 16 / 10;
	}

	body .hub-listing .card-image-container::after {
		background: linear-gradient(0deg, rgba(0,0,0,.22), transparent 56%);
	}

	body .hub-listing .card-content-container {
		grid-template-columns: 1fr;
		grid-template-areas:
			"title"
			"link"
			"hubs";
		gap: 1rem;

		padding: 1.2rem !important;
	}

	body .hub-listing .card-content-container > .title {
		font-size: clamp(1.65rem, 9vw, 2.35rem);
	}

	body .hub-listing .card-content-container > .link {
		justify-self: stretch;
	}

	body .hub-listing .card-content-container > .link .category-link {
		width: 100%;
	}

	body .hub-listing .card-content-container > .categories > .layout.mod_collation_component_categories {
		grid-template-columns: 1fr;
		gap: 0.6rem;
	}

	body .hub-listing .card-content-container > .categories .iteration > .layout-cell {
		padding: 0.8rem 0.9rem !important;
	}

}






/* ==========================================
   NEWS ARTICLE PREVIEW CARDS
   4 ALL FOUNDATION
   Full-width list layout
========================================== */

/* ==========================================
   NEWS CARD VARIABLES
========================================== */

:root {
	--ww-news-card-inset-y: clamp(1.35rem, 2.2vw, 2rem);
	--ww-news-card-inset-x: clamp(1.55rem, 2.5vw, 2.45rem);
	--ww-news-card-inset-left: clamp(1.05rem, 1.65vw, 1.55rem);

	--ww-news-card-inset-tablet: clamp(1.25rem, 2.4vw, 1.85rem);
	--ww-news-card-inset-mobile: 1.2rem;

	--ww-news-card-row-gap: 0;
	--ww-news-card-button-gap: clamp(0.45rem, 0.85vw, 0.75rem);
	--ww-news-card-date-gap: clamp(0.55rem, 0.9vw, 0.8rem);
	--ww-news-card-title-gap: clamp(0.38rem, 0.75vw, 0.65rem);
}

/* ==========================================
   NEWS LIST WRAPPER
========================================== */

body .layout-component.items > .collation-items-list:has(> .card-news) {
	display: grid !important;
	grid-template-columns: 1fr !important;
	gap: clamp(1.25rem, 2.5vw, 2rem) !important;

	width: 100%;
	min-width: 0;

	margin: 0 !important;
	padding: 0 !important;
}

/* Hidden order-by filter remains hidden */

body .order-by.hidden {
	display: none !important;
}

/* ==========================================
   MAIN NEWS CARD
========================================== */

body .card-news.card-output {
	position: relative;
	isolation: isolate;

	display: grid !important;
	grid-template-columns: minmax(260px, 34%) minmax(0, 1fr) !important;
	align-items: stretch;
	gap: 0 !important;
	column-gap: 0 !important;
	row-gap: 0 !important;

	width: 100%;
	min-width: 0;

	margin: 0 !important;
	padding: 0 !important;

	background: var(--ww-color-white);

	border: 1px solid rgba(0,0,0,.08);
	border-radius: var(--ww-radius-l);

	box-shadow:
		0 16px 44px rgba(0,0,0,.08),
		inset 0 1px 0 rgba(255,255,255,.9);

	overflow: hidden;

	transition:
		transform var(--ww-transition-fast),
		box-shadow var(--ww-transition-fast),
		border-color var(--ww-transition-fast);
}

/* Reset only the direct cells, then re-apply content padding later */

body .card-news.card-output > .layout-cell {
	min-width: 0 !important;
	height: auto !important;

	margin: 0 !important;
	padding: 0 !important;
}

body .card-news.card-output > .card-image-container {
	display: block !important;
	height: auto !important;
}

body .card-news.card-output > .card-content-container {
	display: grid !important;
	flex: initial !important;
	height: auto !important;
}

/* Top accent */

body .card-news.card-output::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	z-index: 4;

	width: 100%;
	height: 7px;

	background:
		linear-gradient(
			90deg,
			var(--ww-color-orange),
			rgba(217,147,14,.45),
			var(--ww-color-orange)
		);

	pointer-events: none;
}

/* Soft glow */

body .card-news.card-output::after {
	content: "";
	position: absolute;
	right: -90px;
	bottom: -90px;
	z-index: 0;

	width: 220px;
	height: 220px;

	background: rgba(217,147,14,.1);
	border-radius: 999px;

	pointer-events: none;

	transition:
		transform var(--ww-transition-medium),
		opacity var(--ww-transition-medium);
}

body .card-news.card-output:hover,
body .card-news.card-output:focus-within {
	transform: translateY(-5px);
	border-color: rgba(217,147,14,.5);

	box-shadow:
		0 26px 70px rgba(0,0,0,.14),
		0 0 0 1px rgba(217,147,14,.12),
		inset 0 1px 0 rgba(255,255,255,.95);
}

body .card-news.card-output:hover::after,
body .card-news.card-output:focus-within::after {
	opacity: 0.95;
	transform: scale(1.16);
}

/* ==========================================
   IMAGE SIDE
========================================== */

body .card-news.card-output > .card-image-container {
	position: relative;
	z-index: 1;

	display: block !important;

	width: 100%;
	height: 100%;
	min-height: clamp(215px, 19vw, 270px);

	background: var(--ww-color-black);

	overflow: hidden;
}

body .card-news.card-output > .card-image-container .icon,
body .card-news.card-output > .card-image-container .layout-component {
	width: 100%;
	height: 100%;

	margin: 0 !important;
	padding: 0 !important;
}

body .card-news.card-output > .card-image-container img {
	display: block;

	width: 100% !important;
	height: 100% !important;
	max-width: none !important;

	margin: 0 !important;
	padding: 0 !important;

	object-fit: cover;
	object-position: center;

	transform: scale(1);

	transition:
		transform 0.5s ease,
		opacity 0.5s ease;
}

body .card-news.card-output:hover > .card-image-container img,
body .card-news.card-output:focus-within > .card-image-container img {
	transform: scale(1.045);
}

body .card-news.card-output > .card-image-container::after {
	content: "";
	position: absolute;
	inset: 0;

	background:
		linear-gradient(90deg, transparent 62%, rgba(0,0,0,.18)),
		linear-gradient(0deg, rgba(0,0,0,.12), transparent 46%);

	pointer-events: none;
}

/* ==========================================
   CONTENT SIDE
========================================== */

body .card-news.card-output > .card-content-container {
	position: relative !important;
	z-index: 2;

	display: grid !important;
	grid-template-columns: minmax(0, 1fr);
	grid-template-rows: auto auto auto minmax(var(--ww-news-card-button-gap), 1fr) auto;
	grid-template-areas:
		"date"
		"title"
		"abstract"
		"spacer"
		"button";
	align-content: stretch;
	gap: var(--ww-news-card-row-gap);

	width: 100%;
	min-width: 0;
	min-height: 100%;

	margin: 0 !important;
	padding:
		calc(var(--ww-news-card-inset-y) + 0.25rem)
		var(--ww-news-card-inset-x)
		var(--ww-news-card-inset-y)
		var(--ww-news-card-inset-left) !important;

	background:
		linear-gradient(180deg, rgba(255,255,255,1), rgba(255,255,255,.965));
}

/* ==========================================
   DATE
========================================== */

body .card-news.card-output > .card-content-container .date {
	grid-area: date;

	justify-self: start;

	display: inline-flex;
	align-items: center;
	gap: 0.45rem;

	width: auto;

	margin: 0 0 var(--ww-news-card-date-gap) !important;
	padding: 0.48rem 0.82rem !important;

	background: rgba(217,147,14,.12);
	color: var(--ww-color-black);

	border: 1px solid rgba(217,147,14,.28);
	border-radius: 999px;

	font-size: 0.76rem;
	font-weight: 900;
	line-height: 1;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

body .card-news.card-output > .card-content-container .date::before {
	content: "";

	display: block;

	width: 0.48rem;
	height: 0.48rem;

	background: var(--ww-color-orange);
	border-radius: 999px;
}

/* ==========================================
   TITLE
========================================== */

body .card-news.card-output > .card-content-container .title {
	grid-area: title;

	margin: 0 0 var(--ww-news-card-title-gap) !important;
	padding: 0 !important;
}

body .card-news.card-output > .card-content-container .title h3,
body .card-news.card-output > .card-content-container .title h4 {
	margin: 0 !important;

	color: var(--ww-color-black);

	font-size: clamp(1.22rem, 1.76vw, 1.88rem);
	font-weight: 900;
	line-height: 1.08;
	letter-spacing: -0.038em;
	text-wrap: balance;
}

/* ==========================================
   ABSTRACT
========================================== */

body .card-news.card-output > .card-content-container .abstract {
	grid-area: abstract;

	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;

	max-width: 760px;

	margin: 0 !important;
	padding: 0 !important;

	color: var(--ww-color-muted);

	font-size: clamp(0.96rem, 1.05vw, 1.04rem) !important;
	line-height: 1.58 !important;

	overflow: hidden;
}

/* Clean up CMS pasted Word/editor spans */

body .card-news.card-output > .card-content-container .abstract,
body .card-news.card-output > .card-content-container .abstract p,
body .card-news.card-output > .card-content-container .abstract span {
	color: var(--ww-color-muted) !important;

	font-family: inherit !important;
	font-size: inherit !important;
	font-weight: inherit !important;
	line-height: inherit !important;
}

body .card-news.card-output > .card-content-container .abstract p {
	margin: 0 0 0.45rem !important;
	padding: 0 !important;
}

body .card-news.card-output > .card-content-container .abstract p:last-child {
	margin-bottom: 0 !important;
}

body .card-news.card-output > .card-content-container .abstract a {
	position: relative;
	z-index: 10;

	color: var(--ww-color-black) !important;
	font-weight: 900;
	text-decoration-color: var(--ww-color-orange) !important;
	text-decoration-thickness: 2px;
	text-underline-offset: 3px;
}

/* ==========================================
   VISUAL READ BUTTON
   Sits in its own bottom-right grid row.
========================================== */

body .card-news.card-output > .card-content-container::after {
	content: "Read article  →";

	grid-area: button;

	align-self: end;
	justify-self: end;

	display: inline-flex;
	align-items: center;
	justify-content: center;

	min-height: 44px;

	margin: 0 !important;
	padding: 0.78rem 1.1rem;

	background: var(--ww-color-black);
	color: var(--ww-color-orange);

	border: 2px solid var(--ww-color-black);
	border-radius: 999px;

	font-size: 0.84rem;
	font-weight: 900;
	line-height: 1;
	white-space: nowrap;

	pointer-events: none;

	transition:
		background-color var(--ww-transition-fast),
		color var(--ww-transition-fast),
		border-color var(--ww-transition-fast),
		transform var(--ww-transition-fast);
}

body .card-news.card-output > .card-content-container::before {
	display: none !important;
}

body .card-news.card-output:hover > .card-content-container::after,
body .card-news.card-output:focus-within > .card-content-container::after {
	background: var(--ww-color-orange);
	color: var(--ww-color-black);
	border-color: var(--ww-color-orange);

	transform: translateY(-1px);
}

/* Hide empty generated link component */

body .card-news .link.empty,
body .card-news .layout-component.link:empty {
	display: none !important;
}

/* ==========================================
   FULL CARD OVERLAY LINK
========================================== */

body .card-news > a.collation-item-link.wrap.inflate,
body .card-news .card-content-container > a.collation-item-link.wrap.inflate {
	position: absolute !important;
	inset: 0 !important;
	z-index: 8 !important;

	display: block !important;

	width: 100% !important;
	height: 100% !important;
	min-height: 0 !important;

	margin: 0 !important;
	padding: 0 !important;

	font-size: 0 !important;
	line-height: 0 !important;
	text-indent: -9999px !important;

	background: transparent !important;
	color: transparent !important;
	text-decoration: none !important;

	border: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;

	transform: none !important;
	outline: none;

	cursor: pointer;
}

/* Keyboard focus */

body .card-news:focus-within {
	outline: 3px solid rgba(217,147,14,.45);
	outline-offset: 4px;
}

/* ==========================================
   TABLET NEWS CARDS
========================================== */

@media (min-width: 768px) and (max-width: 1200px) {

	body .card-news.card-output {
		grid-template-columns: minmax(240px, 34%) minmax(0, 1fr) !important;
		gap: 0 !important;
		column-gap: 0 !important;
		row-gap: 0 !important;
	}

	body .card-news.card-output > .card-image-container {
		min-height: 245px;
	}

	body .card-news.card-output > .card-content-container {
		grid-template-rows: auto auto auto minmax(0.75rem, 1fr) auto;
		gap: 0;

		padding:
			calc(var(--ww-news-card-inset-tablet) + 0.25rem)
			var(--ww-news-card-inset-tablet)
			var(--ww-news-card-inset-tablet)
			clamp(1rem, 1.65vw, 1.35rem) !important;
	}

	body .card-news.card-output > .card-content-container .title h3,
	body .card-news.card-output > .card-content-container .title h4 {
		font-size: clamp(1.22rem, 2.25vw, 1.75rem);
	}

	body .card-news.card-output > .card-content-container::after {
		min-height: 42px;

		padding: 0.74rem 1rem;

		font-size: 0.82rem;
	}

}

/* ==========================================
   MOBILE NEWS CARDS
========================================== */

@media (max-width: 767px) {

	body .layout-component.items > .collation-items-list:has(> .card-news) {
		gap: 1.25rem !important;
	}

	body .card-news.card-output {
		grid-template-columns: 1fr !important;
		gap: 0 !important;
		column-gap: 0 !important;
		row-gap: 0 !important;

		border-radius: var(--ww-radius-m);
	}

	body .card-news.card-output > .card-image-container {
		min-height: 210px;
		aspect-ratio: 16 / 9;
	}

	body .card-news.card-output > .card-image-container::after {
		background:
			linear-gradient(0deg, rgba(0,0,0,.22), transparent 56%);
	}

	body .card-news.card-output > .card-content-container {
		grid-template-rows: auto auto auto 0.75rem auto;
		gap: 0;

		padding: var(--ww-news-card-inset-mobile) !important;
		padding-top: calc(var(--ww-news-card-inset-mobile) + 0.25rem) !important;
	}

	body .card-news.card-output > .card-content-container .title h3,
	body .card-news.card-output > .card-content-container .title h4 {
		font-size: clamp(1.28rem, 7vw, 1.8rem);
	}

	body .card-news.card-output > .card-content-container .abstract {
		-webkit-line-clamp: 4;

		font-size: 0.96rem !important;
	}

	body .card-news.card-output > .card-content-container::after {
		justify-self: stretch;

		width: 100%;
		min-height: 48px;
		padding: 0.76rem 1rem;

		font-size: 0.84rem;
	}

}


/* ==========================================
   EVENTS CATEGORY SELECTOR + EVENT CARDS
   4 ALL FOUNDATION
========================================== */



/* ==========================================
   EVENTS CATEGORY SELECTOR
   Upcoming Events / Past Events
========================================== */

body .event-categories {
	width: 100%;
	min-width: 0;

	margin: 0 !important;
	padding: 0 0 24px 0 !important;
}

body .event-categories > .layout {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 0.8rem;

	width: 100%;
	min-width: 0;

	margin: 0 !important;
	padding: 0 !important;
}

body .event-categories .category-buttons {
	display: inline-flex;

	margin: 0 !important;
	padding: 0 !important;
}

body .event-categories .category-buttons > .layout-cell,
body .event-categories .category-buttons .link {
	margin: 0 !important;
	padding: 0 !important;
}

/* ==========================================
   DEFAULT CATEGORY BUTTON
========================================== */

body .event-categories .category-link {
	position: relative;
	isolation: isolate;

	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.55rem;

	min-height: 52px;

	margin: 0 !important;
	padding: 0.9rem 1.25rem !important;

	background: var(--ww-color-white);
	color: var(--ww-color-black);

	border: 2px solid rgba(217,147,14,.28);
	border-radius: 999px;

	box-shadow:
		0 10px 28px rgba(0,0,0,.06),
		inset 0 1px 0 rgba(255,255,255,.95);

	font-size: 0.95rem;
	font-weight: 900;
	line-height: 1;
	text-decoration: none;

	overflow: hidden;

	transition:
		background-color var(--ww-transition-fast),
		color var(--ww-transition-fast),
		border-color var(--ww-transition-fast),
		box-shadow var(--ww-transition-fast),
		transform var(--ww-transition-fast);
}

body .event-categories .category-link::before {
	content: "";

	display: block;

	width: 0.55rem;
	height: 0.55rem;

	background: var(--ww-color-orange);
	border-radius: 999px;

	box-shadow: 0 0 0 5px rgba(217,147,14,.12);

	transition:
		background-color var(--ww-transition-fast),
		box-shadow var(--ww-transition-fast),
		transform var(--ww-transition-fast);
}

/* ==========================================
   HOVER / FOCUS STATE
========================================== */

body .event-categories .category-link:hover,
body .event-categories .category-link:focus {
	background: var(--ww-color-black);
	color: var(--ww-color-orange);
	border-color: var(--ww-color-black);

	box-shadow:
		0 16px 38px rgba(0,0,0,.12),
		0 0 0 1px rgba(217,147,14,.16);

	transform: translateY(-2px);
}

body .event-categories .category-link:hover::before,
body .event-categories .category-link:focus::before {
	background: var(--ww-color-orange);
	box-shadow: 0 0 0 5px rgba(217,147,14,.22);

	transform: scale(1.08);
}

/* ==========================================
   ACTIVE / CURRENT CATEGORY STATE
   EOS places .active on the wrapper:
   .layout-component.active.link > .category-link
========================================== */

body .event-categories .link.active .category-link,
body .event-categories .layout-component.active .category-link,
body .event-categories .category-link.active,
body .event-categories .category-link.current,
body .event-categories .category-link.selected,
body .event-categories .category-link[aria-current="page"] {
	background:
		radial-gradient(circle at 14% 50%, rgba(217,147,14,.24), transparent 28%),
		var(--ww-color-black);

	color: var(--ww-color-orange);

	border-color: var(--ww-color-orange);

	box-shadow:
		0 18px 44px rgba(0,0,0,.16),
		0 0 0 1px rgba(217,147,14,.28),
		0 0 24px rgba(217,147,14,.16),
		inset 0 1px 0 rgba(255,255,255,.08);

	transform: translateY(-2px);
}

body .event-categories .link.active .category-link::before,
body .event-categories .layout-component.active .category-link::before,
body .event-categories .category-link.active::before,
body .event-categories .category-link.current::before,
body .event-categories .category-link.selected::before,
body .event-categories .category-link[aria-current="page"]::before {
	background: var(--ww-color-orange);

	box-shadow:
		0 0 0 5px rgba(217,147,14,.24),
		0 0 18px rgba(217,147,14,.55);

	transform: scale(1.12);
}

/* Small active label */

body .event-categories .link.active .category-link::after,
body .event-categories .layout-component.active .category-link::after,
body .event-categories .category-link.active::after,
body .event-categories .category-link.current::after,
body .event-categories .category-link.selected::after,
body .event-categories .category-link[aria-current="page"]::after {
	content: "Current";

	display: inline-flex;
	align-items: center;
	justify-content: center;

	margin-left: 0.2rem;
	padding: 0.28rem 0.5rem;

	background: var(--ww-color-orange);
	color: var(--ww-color-black);

	border-radius: 999px;

	font-size: 0.68rem;
	font-weight: 950;
	line-height: 1;
	letter-spacing: 0.045em;
	text-transform: uppercase;

	box-shadow: 0 8px 18px rgba(0,0,0,.22);
}

/* Keep active state stable on hover */

body .event-categories .link.active .category-link:hover,
body .event-categories .layout-component.active .category-link:hover,
body .event-categories .link.active .category-link:focus,
body .event-categories .layout-component.active .category-link:focus {
	background:
		radial-gradient(circle at 14% 50%, rgba(217,147,14,.28), transparent 30%),
		var(--ww-color-black);

	color: var(--ww-color-orange);
	border-color: var(--ww-color-orange);

	transform: translateY(-2px);
}

/* ==========================================
   MOBILE
========================================== */

@media (max-width: 767px) {

	body .event-categories > .layout {
		gap: 0.65rem;
	}

	body .event-categories .category-buttons {
		width: 100%;
	}

	body .event-categories .category-buttons > .layout-cell,
	body .event-categories .category-buttons .link,
	body .event-categories .category-link {
		width: 100%;
	}

	body .event-categories .category-link {
		min-height: 50px;
		padding: 0.85rem 1rem !important;

		font-size: 0.92rem;
	}

	body .event-categories .link.active .category-link::after,
	body .event-categories .layout-component.active .category-link::after,
	body .event-categories .category-link.active::after,
	body .event-categories .category-link.current::after,
	body .event-categories .category-link.selected::after,
	body .event-categories .category-link[aria-current="page"]::after {
		margin-left: auto;
	}

}






/* ==========================================
   EVENTS LIST WRAPPER
========================================== */

body .event-listings {
	display: grid !important;
	grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
	gap: clamp(1.25rem, 2.5vw, 2rem) !important;

	width: 100%;
	min-width: 0;

	margin: 0 !important;
	padding: 0 !important;
}

/* ==========================================
   EVENT CARD
========================================== */

body .event-listings .card-event {
	position: relative;
	isolation: isolate;

	display: grid !important;
	grid-template-rows: auto 1fr;
	gap: 0 !important;

	min-width: 0;
	height: 100%;

	margin: 0 !important;
	padding: 0 !important;

	background: var(--ww-color-white);

	border: 1px solid rgba(0,0,0,.08);
	border-radius: var(--ww-radius-l);

	box-shadow:
		0 16px 44px rgba(0,0,0,.08),
		inset 0 1px 0 rgba(255,255,255,.9);

	overflow: hidden;

	transition:
		transform var(--ww-transition-fast),
		box-shadow var(--ww-transition-fast),
		border-color var(--ww-transition-fast);
}

body .event-listings .card-event::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	z-index: 4;

	width: 100%;
	height: 6px;

	background:
		linear-gradient(
			90deg,
			var(--ww-color-orange),
			rgba(217,147,14,.42),
			var(--ww-color-orange)
		);

	pointer-events: none;
}

body .event-listings .card-event::after {
	content: "";
	position: absolute;
	right: -70px;
	bottom: -70px;
	z-index: 0;

	width: 180px;
	height: 180px;

	background: rgba(217,147,14,.1);
	border-radius: 999px;

	pointer-events: none;

	transition:
		transform var(--ww-transition-medium),
		opacity var(--ww-transition-medium);
}

body .event-listings .card-event:hover,
body .event-listings .card-event:focus-within {
	transform: translateY(-5px);
	border-color: rgba(217,147,14,.5);

	box-shadow:
		0 26px 70px rgba(0,0,0,.14),
		0 0 0 1px rgba(217,147,14,.12),
		inset 0 1px 0 rgba(255,255,255,.95);
}

body .event-listings .card-event:hover::after,
body .event-listings .card-event:focus-within::after {
	opacity: 0.95;
	transform: scale(1.18);
}

/* Reset EOS card cells */

body .event-listings .card-event > .layout-cell {
	min-width: 0 !important;

	margin: 0 !important;
	padding: 0 !important;
}

/* ==========================================
   EVENT IMAGE
========================================== */

body .event-listings .card-event > .layout-cell:first-of-type {
	position: relative;
	z-index: 1;

	width: 100%;
	min-height: 220px;

	background: var(--ww-color-black);

	overflow: hidden;
}

body .event-listings .card-event > .layout-cell:first-of-type .icon,
body .event-listings .card-event > .layout-cell:first-of-type .layout-component {
	width: 100%;
	height: 100%;

	margin: 0 !important;
	padding: 0 !important;
}

body .event-listings .card-event > .layout-cell:first-of-type img {
	display: block;

	width: 100% !important;
	height: 100% !important;
	max-width: none !important;

	margin: 0 !important;
	padding: 0 !important;

	object-fit: cover;
	object-position: center;

	transform: scale(1);

	transition:
		transform 0.5s ease,
		opacity 0.5s ease;
}

body .event-listings .card-event:hover > .layout-cell:first-of-type img,
body .event-listings .card-event:focus-within > .layout-cell:first-of-type img {
	transform: scale(1.055);
}

body .event-listings .card-event > .layout-cell:first-of-type::after {
	content: "";
	position: absolute;
	inset: 0;

	background:
		linear-gradient(180deg, rgba(0,0,0,.04), rgba(0,0,0,.24)),
		radial-gradient(circle at 82% 18%, rgba(217,147,14,.24), transparent 36%);

	pointer-events: none;
}

/* ==========================================
   EVENT CONTENT
========================================== */

body .event-listings .card-event > .layout-cell.static {
	position: relative;
	z-index: 2;

	display: grid !important;
	grid-template-rows: auto auto minmax(0.85rem, 1fr) auto;
	grid-template-areas:
		"date"
		"title"
		"abstract"
		"button";
	gap: 0.65rem;

	min-height: 250px;

	margin: 0 !important;
	padding: clamp(1.25rem, 2vw, 1.65rem) !important;

	background:
		linear-gradient(180deg, rgba(255,255,255,1), rgba(255,255,255,.965));
}

/* ==========================================
   EVENT DATE
========================================== */

body .event-listings .card-event .date {
	grid-area: date;

	justify-self: start;

	display: inline-flex;
	align-items: center;
	gap: 0.45rem;

	width: auto;

	margin: 0 0 0.1rem !important;
	padding: 0.48rem 0.82rem !important;

	background: rgba(217,147,14,.12);
	color: var(--ww-color-black);

	border: 1px solid rgba(217,147,14,.28);
	border-radius: 999px;

	font-size: 0.76rem;
	font-weight: 900;
	line-height: 1;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

body .event-listings .card-event .date::before {
	content: "";

	display: block;

	width: 0.48rem;
	height: 0.48rem;

	background: var(--ww-color-orange);
	border-radius: 999px;
}

/* ==========================================
   EVENT TITLE
========================================== */

body .event-listings .card-event .title {
	grid-area: title;

	margin: 0 !important;
	padding: 0 !important;
}

body .event-listings .card-event .title h3,
body .event-listings .card-event .title h4 {
	margin: 0 !important;

	color: var(--ww-color-black);

	font-size: clamp(1.35rem, 1.8vw, 1.9rem);
	font-weight: 900;
	line-height: 1.08;
	letter-spacing: -0.04em;
	text-wrap: balance;
}

/* ==========================================
   EVENT ABSTRACT
========================================== */

body .event-listings .card-event .abstract {
	grid-area: abstract;

	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;

	margin: 0 !important;
	padding: 0 !important;

	color: var(--ww-color-muted);

	font-size: 0.98rem !important;
	line-height: 1.6 !important;

	overflow: hidden;
}

body .event-listings .card-event .abstract.empty {
	display: none !important;
}

/* Clean pasted editor markup */

body .event-listings .card-event .abstract,
body .event-listings .card-event .abstract p,
body .event-listings .card-event .abstract span,
body .event-listings .card-event .abstract strong,
body .event-listings .card-event .abstract em {
	color: var(--ww-color-muted) !important;

	font-family: inherit !important;
	font-size: inherit !important;
	line-height: inherit !important;
}

body .event-listings .card-event .abstract p {
	margin: 0 0 0.45rem !important;
	padding: 0 !important;
}

body .event-listings .card-event .abstract p:last-child {
	margin-bottom: 0 !important;
}

/* ==========================================
   VISUAL VIEW EVENT BUTTON
========================================== */

body .event-listings .card-event > .layout-cell.static::after {
	content: "View event  →";

	grid-area: button;

	align-self: end;
	justify-self: start;

	display: inline-flex;
	align-items: center;
	justify-content: center;

	min-height: 44px;

	margin: 0.25rem 0 0 !important;
	padding: 0.78rem 1.1rem;

	background: var(--ww-color-black);
	color: var(--ww-color-orange);

	border: 2px solid var(--ww-color-black);
	border-radius: 999px;

	font-size: 0.84rem;
	font-weight: 900;
	line-height: 1;
	white-space: nowrap;

	pointer-events: none;

	transition:
		background-color var(--ww-transition-fast),
		color var(--ww-transition-fast),
		border-color var(--ww-transition-fast),
		transform var(--ww-transition-fast);
}

body .event-listings .card-event:hover > .layout-cell.static::after,
body .event-listings .card-event:focus-within > .layout-cell.static::after {
	background: var(--ww-color-orange);
	color: var(--ww-color-black);
	border-color: var(--ww-color-orange);

	transform: translateY(-1px);
}

/* Hide empty generated link component */

body .event-listings .card-event .link.empty,
body .event-listings .card-event .layout-component.link:empty {
	display: none !important;
}

/* ==========================================
   FULL CARD OVERLAY LINK
========================================== */

body .event-listings .card-event > a.collation-item-link.wrap.inflate,
body .event-listings .card-event .layout-cell.static > a.collation-item-link.wrap.inflate {
	position: absolute !important;
	inset: 0 !important;
	z-index: 8 !important;

	display: block !important;

	width: 100% !important;
	height: 100% !important;
	min-height: 0 !important;

	margin: 0 !important;
	padding: 0 !important;

	font-size: 0 !important;
	line-height: 0 !important;
	text-indent: -9999px !important;

	background: transparent !important;
	color: transparent !important;
	text-decoration: none !important;

	border: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;

	transform: none !important;
	outline: none;

	cursor: pointer;
}

/* Keyboard focus */

body .event-listings .card-event:focus-within {
	outline: 3px solid rgba(217,147,14,.45);
	outline-offset: 4px;
}

/* ==========================================
   TABLET EVENTS
========================================== */

@media (min-width: 768px) and (max-width: 1200px) {

	body .event-listings {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	}

	body .event-listings .card-event > .layout-cell:first-of-type {
		min-height: 215px;
	}

	body .event-listings .card-event > .layout-cell.static {
		min-height: 240px;
	}

	body .event-listings .card-event .title h3,
	body .event-listings .card-event .title h4 {
		font-size: clamp(1.3rem, 2.4vw, 1.75rem);
	}

}

/* ==========================================
   MOBILE EVENTS
========================================== */

@media (max-width: 767px) {

	body .event-categories > .layout {
		justify-content: stretch;
		gap: 0.65rem;
	}

	body .event-categories .category-buttons {
		display: flex;
		width: 100%;
	}

	body .event-categories .category-buttons > .layout-cell,
	body .event-categories .category-buttons .link {
		width: 100%;
	}

	body .event-categories .category-link {
		width: 100%;
		min-height: 50px;
	}

	body .event-listings {
		grid-template-columns: 1fr !important;
		gap: 1.25rem !important;
	}

	body .event-listings .card-event {
		border-radius: var(--ww-radius-m);
	}

	body .event-listings .card-event > .layout-cell:first-of-type {
		min-height: 210px;
		aspect-ratio: 16 / 9;
	}

	body .event-listings .card-event > .layout-cell.static {
		min-height: 0;
		padding: 1.2rem !important;
	}

	body .event-listings .card-event .title h3,
	body .event-listings .card-event .title h4 {
		font-size: clamp(1.3rem, 7vw, 1.85rem);
	}

	body .event-listings .card-event .abstract {
		-webkit-line-clamp: 4;
	}

	body .event-listings .card-event > .layout-cell.static::after {
		justify-self: stretch;

		width: 100%;
		min-height: 48px;
	}

}




/* ==========================================
   PROJECT LISTING CARDS
   4 ALL FOUNDATION
   Two-column project grid
========================================== */

/* ==========================================
   PROJECT LISTINGS GRID
========================================== */


body.pt-project-overview .project-listings .attr-value-is-centre {display:none !important;}

body .project-listings {
	display: grid !important;
	grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	gap: clamp(1.25rem, 2.5vw, 2rem) !important;

	width: 100%;
	min-width: 0;

	margin: 0 !important;
	padding: 0 !important;
}

/* Keep EOS / framework grid classes from fighting this specific list */

body .project-listings.ww-grid,
body .layout.project-listings.ww-grid,
body .layout.mod_collation_component_items.project-listings {
	display: grid !important;
}

/* ==========================================
   PROJECT CARD
========================================== */

body .project-listings .card-project {
	position: relative;
	isolation: isolate;

	display: grid !important;
	grid-template-rows: auto 1fr;
	gap: 0 !important;

	min-width: 0;
	height: 100%;

	margin: 0 !important;
	padding: 0 !important;

	background: var(--ww-color-white);

	border: 1px solid rgba(0,0,0,.08);
	border-radius: var(--ww-radius-l);

	box-shadow:
		0 16px 44px rgba(0,0,0,.08),
		inset 0 1px 0 rgba(255,255,255,.9);

	overflow: hidden;

	transition:
		transform var(--ww-transition-fast),
		box-shadow var(--ww-transition-fast),
		border-color var(--ww-transition-fast);
}

body .project-listings .card-project::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	z-index: 4;

	width: 100%;
	height: 6px;

	background:
		linear-gradient(
			90deg,
			var(--ww-color-orange),
			rgba(217,147,14,.42),
			var(--ww-color-orange)
		);

	pointer-events: none;
}

body .project-listings .card-project::after {
	content: "";
	position: absolute;
	right: -70px;
	bottom: -70px;
	z-index: 0;

	width: 180px;
	height: 180px;

	background: rgba(217,147,14,.1);
	border-radius: 999px;

	pointer-events: none;

	transition:
		transform var(--ww-transition-medium),
		opacity var(--ww-transition-medium);
}

body .project-listings .card-project:hover,
body .project-listings .card-project:focus-within {
	transform: translateY(-5px);
	border-color: rgba(217,147,14,.5);

	box-shadow:
		0 26px 70px rgba(0,0,0,.14),
		0 0 0 1px rgba(217,147,14,.12),
		inset 0 1px 0 rgba(255,255,255,.95);
}

body .project-listings .card-project:hover::after,
body .project-listings .card-project:focus-within::after {
	opacity: 0.95;
	transform: scale(1.18);
}

/* Reset EOS card cells */

body .project-listings .card-project > input[type="hidden"] {
	display: none !important;
}

body .project-listings .card-project > .layout-cell {
	min-width: 0 !important;

	margin: 0 !important;
	padding: 0 !important;
}

/* ==========================================
   PROJECT IMAGE
========================================== */

body .project-listings .card-project > .card-image-container {
	position: relative;
	z-index: 1;

	display: block !important;

	width: 100%;
	min-height: clamp(230px, 23vw, 330px);

  border-bottom:1px solid #ccc;
	overflow: hidden;
}

body .project-listings .card-project > .card-image-container .icon,
body .project-listings .card-project > .card-image-container .layout-component {
	width: 100%;
	height: 100%;

	margin: 0 !important;
	padding: 0 !important;
}

body .project-listings .card-project > .card-image-container img {
	display: block;

	width: 100% !important;
	height: 100% !important;
	max-width: none !important;

	margin: 0 !important;
	padding: 0 !important;

	object-fit: cover;
	object-position: center;

	transform: scale(1);

	transition:
		transform 0.5s ease,
		opacity 0.5s ease,
		filter 0.5s ease;
}

body .project-listings .card-project:hover > .card-image-container img,
body .project-listings .card-project:focus-within > .card-image-container img {
	transform: scale(1.055);
	filter: saturate(1.04) contrast(1.03);
}

body .project-listings .card-project > .card-image-container::after {
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
}

/* ==========================================
   PROJECT CONTENT
========================================== */

body .project-listings .card-project > .card-content-container {
	position: static !important;
	z-index: 2;

	display: grid !important;
	grid-template-rows: auto auto minmax(0.85rem, 1fr) auto;
	grid-template-areas:
		"title"
		"abstract"
		"spacer"
		"button";
	gap: 0.75rem;

	min-width: 0;
	min-height: clamp(230px, 20vw, 300px);

	margin: 0 !important;
	padding: clamp(1.25rem, 2vw, 1.65rem) !important;

	background:
		linear-gradient(180deg, rgba(255,255,255,1), rgba(255,255,255,.965));
}

/* ==========================================
   PROJECT TITLE
========================================== */

body .project-listings .card-project .title {
	grid-area: title;

	margin: 0 !important;
	padding: 0 !important;
}

body .project-listings .card-project .title h3,
body .project-listings .card-project .title h4 {
	position: relative;

	margin: 0 !important;
	padding-bottom: 0.85rem;

	color: var(--ww-color-black);

	font-size: clamp(1.45rem, 2.2vw, 2.2rem);
	font-weight: 900;
	line-height: 1.06;
	letter-spacing: -0.04em;
	text-wrap: balance;
}

body .project-listings .card-project .title h3::after,
body .project-listings .card-project .title h4::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;

	width: 58px;
	height: 5px;

	background: var(--ww-color-orange);
	border-radius: 999px;
}

/* ==========================================
   PROJECT ABSTRACT
========================================== */

body .project-listings .card-project .abstract {
	grid-area: abstract;

	display: -webkit-box;
	-webkit-line-clamp: 4;
	-webkit-box-orient: vertical;

	margin: 0 !important;
	padding: 0 !important;

	color: var(--ww-color-muted);

	font-size: 0.98rem !important;
	line-height: 1.6 !important;

	overflow: hidden;
}

body .project-listings .card-project .abstract.empty {
	display: none !important;
}

/* Clean pasted editor markup */

body .project-listings .card-project .abstract,
body .project-listings .card-project .abstract p,
body .project-listings .card-project .abstract span,
body .project-listings .card-project .abstract strong,
body .project-listings .card-project .abstract em {
	color: var(--ww-color-muted) !important;

	font-family: inherit !important;
	font-size: inherit !important;
	line-height: inherit !important;
}

body .project-listings .card-project .abstract p {
	margin: 0 0 0.45rem !important;
	padding: 0 !important;
}

body .project-listings .card-project .abstract p:last-child {
	margin-bottom: 0 !important;
}

/* ==========================================
   VISUAL VIEW PROJECT BUTTON
========================================== */

body .project-listings .card-project > .card-content-container::after {
	content: "View project  →";

	grid-area: button;

	align-self: end;
	justify-self: start;

	display: inline-flex;
	align-items: center;
	justify-content: center;

	min-height: 44px;

	margin: 0.25rem 0 0 !important;
	padding: 0.78rem 1.1rem;

	background: var(--ww-color-black);
	color: var(--ww-color-orange);

	border: 2px solid var(--ww-color-black);
	border-radius: 999px;

	font-size: 0.84rem;
	font-weight: 900;
	line-height: 1;
	white-space: nowrap;

	pointer-events: none;

	transition:
		background-color var(--ww-transition-fast),
		color var(--ww-transition-fast),
		border-color var(--ww-transition-fast),
		transform var(--ww-transition-fast);
}

body .project-listings .card-project:hover > .card-content-container::after,
body .project-listings .card-project:focus-within > .card-content-container::after {
	background: var(--ww-color-orange);
	color: var(--ww-color-black);
	border-color: var(--ww-color-orange);

	transform: translateY(-1px);
}

/* Hide empty generated link component */

body .project-listings .card-project .link.empty,
body .project-listings .card-project .layout-component.link:empty {
	display: none !important;
}

/* ==========================================
   FULL CARD OVERLAY LINK
========================================== */

body .project-listings .card-project > a.collation-item-link.wrap.inflate,
body .project-listings .card-project .card-content-container > a.collation-item-link.wrap.inflate {
	position: absolute !important;
	inset: 0 !important;
	z-index: 8 !important;

	display: block !important;

	width: 100% !important;
	height: 100% !important;
	min-height: 0 !important;

	margin: 0 !important;
	padding: 0 !important;

	font-size: 0 !important;
	line-height: 0 !important;
	text-indent: -9999px !important;

	background: transparent !important;
	color: transparent !important;
	text-decoration: none !important;

	border: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;

	transform: none !important;
	outline: none;

	cursor: pointer;
}

/* Keyboard focus */

body .project-listings .card-project:focus-within {
	outline: 3px solid rgba(217,147,14,.45);
	outline-offset: 4px;
}

/* ==========================================
   TABLET PROJECT CARDS
========================================== */

@media (min-width: 768px) and (max-width: 1200px) {

	body .project-listings {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	}

	body .project-listings .card-project > .card-image-container {
		min-height: 220px;
	}

	body .project-listings .card-project > .card-content-container {
		min-height: 240px;
	}

	body .project-listings .card-project .title h3,
	body .project-listings .card-project .title h4 {
		font-size: clamp(1.35rem, 2.6vw, 1.9rem);
	}

}

/* ==========================================
   MOBILE PROJECT CARDS
========================================== */

@media (max-width: 767px) {

	body .project-listings {
		grid-template-columns: 1fr !important;
		gap: 1.25rem !important;
	}

	body .project-listings .card-project {
		border-radius: var(--ww-radius-m);
	}

	body .project-listings .card-project > .card-image-container {
		min-height: 210px;
		aspect-ratio: 16 / 9;
	}

	body .project-listings .card-project > .card-image-container::after {
		background:
			linear-gradient(0deg, rgba(0,0,0,.22), transparent 56%);
	}

	body .project-listings .card-project > .card-content-container {
		min-height: 0;
		padding: 1.2rem !important;
	}

	body .project-listings .card-project .title h3,
	body .project-listings .card-project .title h4 {
		font-size: clamp(1.3rem, 7vw, 1.85rem);
	}

	body .project-listings .card-project .abstract {
		-webkit-line-clamp: 4;
	}

	body .project-listings .card-project > .card-content-container::after {
		justify-self: stretch;

		width: 100%;
		min-height: 48px;
	}

}


/* ==========================================
   VACANCIES LISTINGS + PAGE FOOTER NOTICE
   4 ALL FOUNDATION
========================================== */

/* ==========================================
   VACANCY LISTINGS GRID
========================================== */

body .vacancy-listings {
	display: grid !important;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: clamp(1.25rem, 2.5vw, 2rem) !important;

	width: 100%;
	min-width: 0;

	margin: 0 !important;
	padding: 0 !important;
}

/* ==========================================
   VACANCY CARD
========================================== */

body .vacancy-listings .card-vacancy {
	position: relative;
	isolation: isolate;

	display: grid !important;

	min-width: 0;
	height: 100%;

	margin: 0 !important;
	padding: 0 !important;

	background:
		linear-gradient(180deg, rgba(255,255,255,1), rgba(255,255,255,.965));

	border: 1px solid rgba(0,0,0,.08);
	border-radius: var(--ww-radius-l);

	box-shadow:
		0 16px 44px rgba(0,0,0,.08),
		inset 0 1px 0 rgba(255,255,255,.9);

	overflow: hidden;

	transition:
		transform var(--ww-transition-fast),
		box-shadow var(--ww-transition-fast),
		border-color var(--ww-transition-fast);
}

body .vacancy-listings .card-vacancy::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	z-index: 3;

	width: 100%;
	height: 7px;

	background:
		linear-gradient(
			90deg,
			var(--ww-color-orange),
			rgba(217,147,14,.46),
			var(--ww-color-orange)
		);

	pointer-events: none;
}

body .vacancy-listings .card-vacancy::after {
	content: "";
	position: absolute;
	right: -80px;
	bottom: -80px;
	z-index: 0;

	width: 210px;
	height: 210px;

	background: rgba(217,147,14,.1);
	border-radius: 999px;

	pointer-events: none;

	transition:
		transform var(--ww-transition-medium),
		opacity var(--ww-transition-medium);
}

body .vacancy-listings .card-vacancy:hover,
body .vacancy-listings .card-vacancy:focus-within {
	transform: translateY(-5px);
	border-color: rgba(217,147,14,.5);

	box-shadow:
		0 26px 70px rgba(0,0,0,.14),
		0 0 0 1px rgba(217,147,14,.12),
		inset 0 1px 0 rgba(255,255,255,.95);
}

body .vacancy-listings .card-vacancy:hover::after,
body .vacancy-listings .card-vacancy:focus-within::after {
	opacity: 0.95;
	transform: scale(1.16);
}

/* Reset EOS internals */

body .vacancy-listings .card-vacancy > .layout-cell {
	position: relative;
	z-index: 2;

	display: grid !important;
	grid-template-columns: 1fr;
	grid-template-areas:
		"title"
		"meta"
		"button";
	align-content: start;
	gap: clamp(1rem, 1.8vw, 1.35rem);

	min-width: 0;
	min-height: 100%;

	margin: 0 !important;
	padding: clamp(1.5rem, 3vw, 2.25rem) !important;
}

/* ==========================================
   VACANCY TITLE
========================================== */

body .vacancy-listings .card-vacancy .title {
	grid-area: title;

	margin: 0 !important;
	padding: 0 !important;
}

body .vacancy-listings .card-vacancy .title h3 {
	position: relative;

	margin: 0 !important;
	padding-bottom: 0.85rem;

	color: var(--ww-color-black);

	font-size: clamp(1.55rem, 2.4vw, 2.45rem);
	font-weight: 900;
	line-height: 1.05;
	letter-spacing: -0.045em;
	text-wrap: balance;
}

body .vacancy-listings .card-vacancy .title h3::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;

	width: 64px;
	height: 5px;

	background: var(--ww-color-orange);
	border-radius: 999px;
}

/* ==========================================
   VACANCY META PILLS
========================================== */

body .vacancy-listings .card-vacancy .job-location,
body .vacancy-listings .card-vacancy .job-hours {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;

	width: fit-content;
	max-width: 100%;

	margin: 0 !important;
	padding: 0.55rem 0.8rem !important;

	background: rgba(217,147,14,.11);
	color: var(--ww-color-black);

	border: 1px solid rgba(217,147,14,.26);
	border-radius: 999px;

	font-size: 0.86rem;
	font-weight: 900;
	line-height: 1.1;
}

body .vacancy-listings .card-vacancy .job-location::before,
body .vacancy-listings .card-vacancy .job-hours::before {
	content: "";

	display: block;

	width: 0.5rem;
	height: 0.5rem;

	background: var(--ww-color-orange);
	border-radius: 999px;

	flex: 0 0 auto;
}

body .vacancy-listings .card-vacancy .job-location::after {
	content: "Location";
	order: -1;

	color: rgba(0,0,0,.56);

	font-size: 0.7rem;
	font-weight: 900;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

body .vacancy-listings .card-vacancy .job-hours::after {
	content: "Hours";
	order: -1;

	color: rgba(0,0,0,.56);

	font-size: 0.7rem;
	font-weight: 900;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

/* Use the component positions to form a neat meta stack */

body .vacancy-listings .card-vacancy .job-location {
	grid-area: meta;
	align-self: start;
}

body .vacancy-listings .card-vacancy .job-hours {
	grid-area: meta;
	align-self: start;

	margin-top: 3rem !important;
}

/* ==========================================
   VACANCY CTA
========================================== */

body .vacancy-listings .card-vacancy .link {
	grid-area: button;

	align-self: end;

	margin: clamp(1rem, 2vw, 1.5rem) 0 0 !important;
	padding: 0 !important;
}

body .vacancy-listings .card-vacancy .link a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.55rem;

	min-height: 48px;

	margin: 0 !important;
	padding: 0.85rem 1.15rem !important;

	background: var(--ww-color-black);
	color: var(--ww-color-orange);

	border: 2px solid var(--ww-color-black);
	border-radius: 999px;

	font-size: 0.9rem;
	font-weight: 900;
	line-height: 1;
	text-decoration: none;
	white-space: nowrap;

	transition:
		background-color var(--ww-transition-fast),
		color var(--ww-transition-fast),
		border-color var(--ww-transition-fast),
		transform var(--ww-transition-fast);
}

body .vacancy-listings .card-vacancy .link a::after {
	content: "→";

	font-weight: 900;

	transition: transform var(--ww-transition-fast);
}

body .vacancy-listings .card-vacancy:hover .link a,
body .vacancy-listings .card-vacancy:focus-within .link a {
	background: var(--ww-color-orange);
	color: var(--ww-color-black);
	border-color: var(--ww-color-orange);

	transform: translateY(-1px);
}

body .vacancy-listings .card-vacancy:hover .link a::after,
body .vacancy-listings .card-vacancy:focus-within .link a::after {
	transform: translateX(3px);
}

/* Keyboard focus */

body .vacancy-listings .card-vacancy:focus-within {
	outline: 3px solid rgba(217,147,14,.45);
	outline-offset: 4px;
}

/* ==========================================
   PAGE FOOTER NOTICE
   Reward Gateway block
========================================== */

body .page-footer-notice {
	position: relative;
	isolation: isolate;

	background:
		linear-gradient(135deg, rgba(217,147,14,.12), rgba(217,147,14,.045)),
		var(--ww-color-white);

  padding-top: clamp(2rem, 4vw, 3.5rem) !important;
}

body .page-footer-notice > .i {
	width: calc(100% - (var(--ww-page-gutter) * 2));
	max-width: var(--ww-container-max);

	margin-left: auto;
	margin-right: auto;
}

body .page-footer-notice .textblock {
	position: relative;
	isolation: isolate;

	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(220px, 300px);
	grid-template-areas:
		"title logo"
		"content logo";
	align-items: center;
	gap: clamp(1.5rem, 4vw, 3rem);

	margin: 0 !important;
	padding: clamp(1.5rem, 4vw, 2.75rem) !important;

	background:
		radial-gradient(circle at 92% 18%, rgba(217,147,14,.18), transparent 34%),
		var(--ww-color-white);

	border: 1px solid rgba(217,147,14,.26);
	border-radius: var(--ww-radius-l);

	box-shadow:
		0 18px 54px rgba(0,0,0,.08),
		inset 0 1px 0 rgba(255,255,255,.95);

	overflow: hidden;
}

body .page-footer-notice .textblock::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;

	width: 100%;
	height: 7px;

	background: var(--ww-color-orange);
}

body .page-footer-notice .textblock h2 {
	grid-area: title;

	margin: 0 !important;

	color: var(--ww-color-black);

	font-size: clamp(1.9rem, 4vw, 3.4rem);
	font-weight: 900;
	line-height: 1.04;
	letter-spacing: -0.055em;
	text-wrap: balance;
}

body .page-footer-notice .textblock .content {
	grid-area: content;

	max-width: 860px;
}

body .page-footer-notice .textblock .content p {
	margin: 0 0 1rem !important;

	color: var(--ww-color-muted);

	font-size: clamp(1rem, 1.2vw, 1.08rem);
	line-height: 1.7;
}

body .page-footer-notice .textblock .content p:last-child {
	margin-bottom: 0 !important;
}

body .page-footer-notice .textblock .component-footer {
	grid-area: logo;

	display: flex;
	align-items: center;
	justify-content: center;

	margin: 0 !important;
	padding: 1rem !important;

	background: rgba(255,255,255,.85);

	border: 1px solid rgba(0,0,0,.08);
	border-radius: var(--ww-radius-m);

	box-shadow:
		0 10px 28px rgba(0,0,0,.06),
		inset 0 1px 0 rgba(255,255,255,.95);
}

body .page-footer-notice .textblock .component-footer p {
	margin: 0 !important;
	padding: 0 !important;
}

body .page-footer-notice .textblock .component-footer img {
	display: block;

	width: min(100%, 300px) !important;
	height: auto !important;

	margin: 0 auto !important;
	padding: 0 !important;

	object-fit: contain;
}

/* ==========================================
   TABLET VACANCIES
========================================== */

@media (min-width: 768px) and (max-width: 1200px) {

	body .vacancy-listings {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	body .vacancy-listings .card-vacancy > .layout-cell {
		padding: clamp(1.35rem, 2.5vw, 2rem) !important;
	}

	body .vacancy-listings .card-vacancy .title h3 {
		font-size: clamp(1.45rem, 3vw, 2.1rem);
	}

	body .page-footer-notice .textblock {
		grid-template-columns: 1fr;
		grid-template-areas:
			"title"
			"content"
			"logo";
	}

	body .page-footer-notice .textblock .component-footer {
		justify-content: flex-start;
	}

}

/* ==========================================
   MOBILE VACANCIES
========================================== */

@media (max-width: 767px) {

	body .vacancy-listings {
		grid-template-columns: 1fr;
		gap: 1.25rem !important;
	}

	body .vacancy-listings .card-vacancy {
		border-radius: var(--ww-radius-m);
	}

	body .vacancy-listings .card-vacancy > .layout-cell {
		padding: 1.2rem !important;
	}

	body .vacancy-listings .card-vacancy .title h3 {
		font-size: clamp(1.45rem, 8vw, 2.1rem);
	}

	body .vacancy-listings .card-vacancy .job-hours {
		margin-top: 2.8rem !important;
	}

	body .vacancy-listings .card-vacancy .link a {
		width: 100%;
		min-height: 50px;
	}

	body .page-footer-notice .textblock {
		grid-template-columns: 1fr;
		grid-template-areas:
			"title"
			"content"
			"logo";

		padding: 1.25rem !important;

		border-radius: var(--ww-radius-m);
	}

	body .page-footer-notice .textblock h2 {
		font-size: clamp(1.8rem, 10vw, 2.65rem);
	}

	body .page-footer-notice .textblock .component-footer {
		justify-content: flex-start;
	}

}

 /* Begin CSS Part: Checkout */

 /* Begin CSS Part: Collation */









/* ==========================================
   ARTICLE DETAIL PAGE
   4 ALL FOUNDATION
   Used for news, events and vacancies
========================================== */

/* ==========================================
   ARTICLE PAGE WRAPPER
   Add .news-article-page to the outer page-section.
========================================== */

body .news-article-page {
	position: relative;
}

body .news-article-page > .i {
	width: calc(100% - (var(--ww-page-gutter) * 2));
	max-width: var(--ww-container-max);

	margin-left: auto;
	margin-right: auto;
}

/* Main article column fallback */

body .news-article-page > .i > .layout-cell:first-child {
	width: 100%;
	max-width: 1040px;

	margin: 0 auto !important;
	padding: 0 !important;
}

/* Hide empty overrides anywhere in detail layouts */

body .news-article-page .overrides.empty {
	display: none !important;
}

/* ==========================================
   ARTICLE DETAIL OPTIONAL SIDE COLUMN
   Supports direct sidebar blocks and nested layout-cell blocks.
========================================== */

/* Hide only obvious empty placeholder components */

body .news-article-page .side-column .layout-component.empty,
body .news-article-page .side-column .textblock.empty,
body .news-article-page .side-column .overrides.empty,
body .news-article-page .side-column .files:empty,
body .news-article-page .side-column .files.empty {
	display: none !important;
}

/* Hide the whole sidebar only when it has no recognised useful content */

body .news-article-page .side-column:not(:has(.notice-box, .linked-items, .application-process, .form-component, .textblock:not(.empty), .content:not(.empty), .files:not(:empty))) {
	display: none !important;
}

/* Default article layout when there is no meaningful sidebar */

body .news-article-page > .i:not(:has(> .side-column .notice-box, > .side-column .linked-items, > .side-column .application-process, > .side-column .form-component, > .side-column .textblock:not(.empty), > .side-column .content:not(.empty), > .side-column .files:not(:empty))) {
	display: block;
}

body .news-article-page > .i:not(:has(> .side-column .notice-box, > .side-column .linked-items, > .side-column .application-process, > .side-column .form-component, > .side-column .textblock:not(.empty), > .side-column .content:not(.empty), > .side-column .files:not(:empty))) > .layout-cell:first-child {
	width: 100%;
	max-width: 1040px;

	margin: 0 auto !important;
	padding: 0 !important;
}

/* Two-column layout when sidebar has useful content */

body .news-article-page > .i:has(> .side-column .notice-box, > .side-column .linked-items, > .side-column .application-process, > .side-column .form-component, > .side-column .textblock:not(.empty), > .side-column .content:not(.empty), > .side-column .files:not(:empty)) {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(280px, 360px);
	gap: clamp(2rem, 4vw, 3.5rem);
	align-items: start;
}

body .news-article-page > .i:has(> .side-column .notice-box, > .side-column .linked-items, > .side-column .application-process, > .side-column .form-component, > .side-column .textblock:not(.empty), > .side-column .content:not(.empty), > .side-column .files:not(:empty)) > .layout-cell:first-child {
	width: 100%;
	max-width: none;

	margin: 0 !important;
	padding: 0 !important;
}

body .news-article-page > .i:has(> .side-column .notice-box, > .side-column .linked-items, > .side-column .application-process, > .side-column .form-component, > .side-column .textblock:not(.empty), > .side-column .content:not(.empty), > .side-column .files:not(:empty)) > .side-column {
	display: grid !important;
	gap: clamp(1.25rem, 2.5vw, 1.75rem);

	width: 100%;
	min-width: 0;

	margin: 0 !important;
	padding: 0 !important;
}

/* ==========================================
   ARTICLE DETAIL SIDEBAR NOTICE BOX
   Host an event / contact CTA
========================================== */

body .news-article-page .side-column > .notice-box {
	position: relative;
	isolation: isolate;

	width: 100%;
	min-width: 0;

	margin: 0 !important;
	padding: clamp(1.25rem, 2.5vw, 1.65rem) !important;

	background:
		radial-gradient(circle at 88% 12%, rgba(217,147,14,.32), transparent 36%),
		var(--ww-color-black);

	border: 1px solid rgba(217,147,14,.38);
	border-radius: var(--ww-radius-l);

	box-shadow:
		0 18px 54px rgba(0,0,0,.16),
		inset 0 1px 0 rgba(255,255,255,.12);

	overflow: hidden;
}

body .news-article-page .side-column > .notice-box::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	z-index: 2;

	width: 100%;
	height: 6px;

	background: var(--ww-color-orange);

	pointer-events: none;
}

body .news-article-page .side-column > .notice-box label {
	display: block;

	margin: 0 0 0.75rem !important;
	padding: 0 !important;

	color: var(--ww-color-white);

	font-size: clamp(1.35rem, 2vw, 1.8rem);
	font-weight: 900;
	line-height: 1.08;
	letter-spacing: -0.04em;
}

body .news-article-page .side-column > .notice-box p {
	margin: 0 0 1rem !important;
	padding: 0 !important;

	color: rgba(255,255,255,.78);

	font-size: 0.98rem;
	line-height: 1.62;
}

body .news-article-page .side-column > .notice-box p:last-child {
	margin-bottom: 0 !important;
}

/* Button treatment inside dark notice box */

body .news-article-page .side-column > .notice-box .button {
	--ww-button-current-bg: var(--ww-color-orange);
	--ww-button-current-text: var(--ww-color-black);
	--ww-button-current-border: var(--ww-color-orange);

	--ww-button-hover-bg: var(--ww-color-white);
	--ww-button-hover-text: var(--ww-color-black);
	--ww-button-hover-border: var(--ww-color-white);

	--ww-button-arrow-bg: var(--ww-color-black);
	--ww-button-arrow-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5 12h12M13 6l6 6-6 6' fill='none' stroke='%23d9930e' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");

	--ww-button-hover-arrow-bg: var(--ww-color-orange);
	--ww-button-hover-arrow-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5 12h12M13 6l6 6-6 6' fill='none' stroke='%23000000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");

	width: 100%;
	min-height: 50px;

	margin-top: 0.25rem !important;
}

/* ==========================================
   ARTICLE DETAIL SIDEBAR APPLICATION PROCESS
   Vacancy application / enquiry panel
========================================== */

body .news-article-page .side-column .application-process {
	position: relative;
	isolation: isolate;

	display: grid;
	gap: 1rem;

	width: 100%;
	min-width: 0;

	margin: 0 !important;
	padding: clamp(1.25rem, 2.5vw, 1.65rem) !important;

	background:
		radial-gradient(circle at 88% 12%, rgba(217,147,14,.22), transparent 36%),
		var(--ww-color-white);

	border: 1px solid rgba(217,147,14,.26);
	border-radius: var(--ww-radius-l);

	box-shadow:
		0 16px 44px rgba(0,0,0,.08),
		inset 0 1px 0 rgba(255,255,255,.95);

	overflow: hidden;
}

body .news-article-page .side-column .application-process::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	z-index: 2;

	width: 100%;
	height: 6px;

	background: var(--ww-color-orange);

	pointer-events: none;
}

body .news-article-page .side-column .application-process > .layout-component {
	position: relative;
	z-index: 2;

	margin: 0 !important;
	padding: 0 !important;
}

body .news-article-page .side-column .application-process h2 {
	margin: 0 0 0.75rem !important;

	color: var(--ww-color-black);

	font-size: clamp(1.45rem, 2.2vw, 2rem);
	font-weight: 900;
	line-height: 1.06;
	letter-spacing: -0.045em;
}

body .news-article-page .side-column .application-process p {
	margin: 0 0 0.9rem !important;

	color: var(--ww-color-muted);

	font-size: 0.98rem;
	line-height: 1.62;
}

body .news-article-page .side-column .application-process p:last-child {
	margin-bottom: 0 !important;
}

/* Email/contact content inside application block */

body .news-article-page .side-column .application-process .content {
	padding: 0.9rem !important;

	background: rgba(217,147,14,.09);

	border: 1px solid rgba(217,147,14,.22);
	border-radius: var(--ww-radius-m);

	color: var(--ww-color-black);

	font-size: 0.95rem;
	font-weight: 800;
	line-height: 1.55;
}

/* Empty file holder should not create visible space */

body .news-article-page .side-column .application-process .files:empty,
body .news-article-page .side-column .application-process .files.empty {
	display: none !important;
}

/* Enquire button */

body .news-article-page .side-column .application-process .form-component {
	margin-top: 0.25rem !important;
}

body .news-article-page .side-column .application-process .button,
body .news-article-page .side-column .application-process button {
	width: 100%;
	min-height: 50px;
}

/* ==========================================
   ARTICLE DETAIL SIDEBAR RELATED ITEMS
   Related news / related events
========================================== */

body .news-article-page .side-column > .linked-items {
	position: relative;
	isolation: isolate;

	width: 100%;
	min-width: 0;

	margin: 0 !important;
	padding: clamp(1.1rem, 2vw, 1.35rem) !important;

	background: var(--ww-color-white);

	border: 1px solid rgba(0,0,0,.08);
	border-radius: var(--ww-radius-l);

	box-shadow:
		0 16px 44px rgba(0,0,0,.08),
		inset 0 1px 0 rgba(255,255,255,.95);

	overflow: hidden;
}

body .news-article-page .side-column > .linked-items::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	z-index: 2;

	width: 100%;
	height: 6px;

	background: var(--ww-color-orange);

	pointer-events: none;
}

body .news-article-page .side-column > .linked-items > h3 {
	margin: 0 0 1rem !important;

	color: var(--ww-color-black);

	font-size: clamp(1.35rem, 2vw, 1.8rem);
	font-weight: 900;
	line-height: 1.08;
	letter-spacing: -0.04em;
}

/* Avoid nested linked-items div inheriting panel styling */

body .news-article-page .side-column > .linked-items .linked-items {
	margin: 0 !important;
	padding: 0 !important;

	background: transparent !important;
	border: 0 !important;
	box-shadow: none !important;
}

/* Hide helper scripts */

body .news-article-page .side-column > .linked-items script {
	display: none !important;
}

/* Related item cards */

body .news-article-page .side-column > .linked-items .iteration.mini {
	position: relative;
	isolation: isolate;

	margin: 0 0 1rem !important;
	padding: 0 !important;

	background: rgba(217,147,14,.055);

	border: 1px solid rgba(217,147,14,.18);
	border-radius: var(--ww-radius-m);

	overflow: hidden;

	transition:
		transform var(--ww-transition-fast),
		border-color var(--ww-transition-fast),
		box-shadow var(--ww-transition-fast);
}

body .news-article-page .side-column > .linked-items .iteration.mini:last-child {
	margin-bottom: 0 !important;
}

body .news-article-page .side-column > .linked-items .iteration.mini:hover,
body .news-article-page .side-column > .linked-items .iteration.mini:focus-within {
	transform: translateY(-3px);
	border-color: rgba(217,147,14,.42);

	box-shadow: 0 14px 34px rgba(0,0,0,.09);
}

body .news-article-page .side-column > .linked-items .iteration.mini > .layout-cell {
	position: relative;

	margin: 0 !important;
	padding: 0 !important;
}

body .news-article-page .side-column > .linked-items .icon {
	margin: 0 !important;
	padding: 0 !important;

	background: var(--ww-color-black);
}

body .news-article-page .side-column > .linked-items .icon img {
	display: block;

	width: 100% !important;
	height: 150px !important;
	max-width: none !important;

	margin: 0 !important;
	padding: 0 !important;

	object-fit: cover;
	object-position: center;
}

body .news-article-page .side-column > .linked-items .title {
	margin: 0 !important;
	padding: 1rem 1rem 0.35rem !important;
}

body .news-article-page .side-column > .linked-items .title h4 {
	margin: 0 !important;

	color: var(--ww-color-black);

	font-size: 1.05rem;
	font-weight: 900;
	line-height: 1.16;
	letter-spacing: -0.03em;
}

body .news-article-page .side-column > .linked-items .date {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;

	margin: 0 1rem 1rem !important;
	padding: 0.4rem 0.65rem !important;

	background: rgba(217,147,14,.12);
	color: var(--ww-color-black);

	border: 1px solid rgba(217,147,14,.24);
	border-radius: 999px;

	font-size: 0.74rem;
	font-weight: 900;
	line-height: 1;
}

body .news-article-page .side-column > .linked-items .date::before {
	content: "";

	width: 0.45rem;
	height: 0.45rem;

	background: var(--ww-color-orange);
	border-radius: 999px;
}

body .news-article-page .side-column > .linked-items .link.empty,
body .news-article-page .side-column > .linked-items .layout-component.link:empty {
	display: none !important;
}

body .news-article-page .side-column > .linked-items a.inflate,
body .news-article-page .side-column > .linked-items .collation-item-link.wrap.inflate {
	position: absolute !important;
	inset: 0 !important;
	z-index: 5 !important;

	display: block !important;

	width: 100% !important;
	height: 100% !important;

	margin: 0 !important;
	padding: 0 !important;

	font-size: 0 !important;
	line-height: 0 !important;
	text-indent: -9999px !important;

	background: transparent !important;
	color: transparent !important;
	text-decoration: none !important;

	border: 0 !important;
	box-shadow: none !important;
}

/* ==========================================
   ARTICLE TITLE
========================================== */

body .news-article-page .title {
	margin: 0 !important;
	padding: 0 !important;
}

body .news-article-page .title .component-topper {
	margin: 0 0 0.65rem !important;
	padding: 0 !important;
}

body .news-article-page .title .component-topper p {
	margin: 0 !important;

	color: var(--ww-color-muted);

	font-size: clamp(1rem, 1.3vw, 1.15rem);
	font-weight: 850;
	line-height: 1.45;
}

body .news-article-page .title h1 {
	position: relative;

	max-width: 980px;

	margin: 0 0 clamp(1.25rem, 2.5vw, 2rem) !important;
	padding-bottom: clamp(1rem, 2vw, 1.35rem);

	color: var(--ww-color-black);

	font-size: clamp(2.35rem, 5.4vw, 5.25rem);
	font-weight: 900;
	line-height: 1.02;
	letter-spacing: -0.06em;
	text-wrap: balance;
}

body .news-article-page .title h1::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;

	width: clamp(90px, 10vw, 150px);
	height: 7px;

	background: var(--ww-color-orange);
	border-radius: 999px;
}

/* ==========================================
   POST DETAILS
   Date, author, vacancy details
========================================== */

body .news-article-page .post-details {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.75rem;

	width: 100%;

	margin: 0 0 clamp(1.5rem, 3vw, 2.5rem) !important;
	padding: 0 !important;
}

body .news-article-page .post-details .layout-component {
	display: inline-flex !important;
	align-items: center;
	gap: 0.45rem;

	width: auto;

	margin: 0 !important;
	padding: 0.55rem 0.85rem !important;

	background: rgba(217,147,14,.12);
	color: var(--ww-color-black);

	border: 1px solid rgba(217,147,14,.28);
	border-radius: 999px;

	font-size: 0.82rem;
	font-weight: 900;
	line-height: 1;
}

body .news-article-page .post-details label {
	margin: 0 !important;
	padding: 0 !important;

	color: rgba(0,0,0,.58);

	font-size: 0.72rem;
	font-weight: 900;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

body .news-article-page .post-details .content,
body .news-article-page .post-details .author-name {
	margin: 0 !important;
	padding: 0 !important;

	color: var(--ww-color-black);

	font-family: inherit !important;
	font-size: inherit !important;
	font-weight: 900;
	line-height: inherit;
}

body .news-article-page .post-details .date-created::before,
body .news-article-page .post-details .author::before,
body .news-article-page .post-details .text-field::before {
	content: "";

	display: block;

	width: 0.5rem;
	height: 0.5rem;

	background: var(--ww-color-orange);
	border-radius: 999px;

	flex: 0 0 auto;
}

/* ==========================================
   POST CONTENT GROUP
========================================== */

body .news-article-page .post-content-group {
	display: grid;
	gap: clamp(1.5rem, 3vw, 2.5rem);

	width: 100%;

	margin: 0 !important;
	padding: 0 !important;
}

/* Hide empty content panels inside the main content group */

body .news-article-page .post-content-group > .layout-component.empty,
body .news-article-page .post-content.empty {
	display: none !important;
}

/* ==========================================
   MAIN ARTICLE IMAGE
========================================== */

body .news-article-page .images {
	position: relative;
	isolation: isolate;

	width: 100%;

	margin: 0 !important;
	padding: 0 !important;

	border-radius: var(--ww-radius-l);

	box-shadow:
		0 22px 64px rgba(0,0,0,.14),
		inset 0 1px 0 rgba(255,255,255,.16);

	overflow: hidden;
}

body .news-article-page .images::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	z-index: 2;

	width: 100%;
	height: 7px;

	background: var(--ww-color-orange);

	pointer-events: none;
}

body .news-article-page .images .main-image {
	width: 100%;

	margin: 0 !important;
	padding: 0 !important;

	background: var(--ww-color-black);
}

body .news-article-page .images img {
	display: block;

	width: 100% !important;
	height: clamp(300px, 38vw, 520px) !important;
	max-width: none !important;

	margin: 0 !important;
	padding: 0 !important;

	object-fit: cover;
	object-position: center;
}

body .news-article-page .collation-item-thumbs.empty {
	display: none !important;
}

/* ==========================================
   ARTICLE BODY
========================================== */

body .news-article-page .post-content {
	position: relative;
	isolation: isolate;

	width: 100%;

	margin: 0 !important;
	padding: clamp(1.5rem, 3.5vw, 2.75rem) !important;
	padding-left: clamp(1.85rem, 3.7vw, 3.1rem) !important;

	background: var(--ww-color-white);

	border: 1px solid rgba(0,0,0,.08);
	border-radius: var(--ww-radius-l);

	box-shadow:
		0 16px 44px rgba(0,0,0,.08),
		inset 0 1px 0 rgba(255,255,255,.95);

	color: var(--ww-color-muted);

	font-family: inherit !important;
	font-size: clamp(1.05rem, 1.25vw, 1.16rem) !important;
	line-height: 1.78 !important;

	overflow: hidden;
}

body .news-article-page .post-content::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;

	width: 7px;
	height: 100%;

	background: var(--ww-color-orange);
}

body .news-article-page .post-content > label {
	display: inline-flex;

	margin: 0 0 1rem !important;
	padding: 0.45rem 0.7rem !important;

	background: rgba(217,147,14,.12);
	color: var(--ww-color-black);

	border: 1px solid rgba(217,147,14,.28);
	border-radius: 999px;

	font-size: 0.78rem;
	font-weight: 900;
	line-height: 1;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

/* Clean up pasted Word/editor spans */

body .news-article-page .post-content,
body .news-article-page .post-content p,
body .news-article-page .post-content span,
body .news-article-page .post-content strong,
body .news-article-page .post-content em,
body .news-article-page .post-content sup,
body .news-article-page .post-content li {
	font-family: inherit !important;
	font-size: inherit !important;
	line-height: inherit !important;
}

body .news-article-page .post-content span {
	color: inherit !important;
}

body .news-article-page .post-content strong {
	color: var(--ww-color-black) !important;
	font-weight: 900;
}

body .news-article-page .post-content p {
	margin: 0 0 1.15rem !important;
	padding: 0 !important;
}

body .news-article-page .post-content p:last-child {
	margin-bottom: 0 !important;
}

body .news-article-page .post-content ul,
body .news-article-page .post-content ol {
	margin: 0 0 1.25rem 1.25rem !important;
	padding: 0 !important;
}

body .news-article-page .post-content li {
	margin: 0 0 0.55rem !important;
	padding-left: 0.15rem !important;

	color: var(--ww-color-muted);
}

body .news-article-page .post-content li::marker {
	color: var(--ww-color-orange);
	font-weight: 900;
}

body .news-article-page .post-content a {
	color: var(--ww-color-black);
	font-weight: 900;
	text-decoration-color: var(--ww-color-orange);
	text-decoration-thickness: 2px;
	text-underline-offset: 4px;
	overflow-wrap: anywhere;
}

body .news-article-page .post-content sup {
	position: relative;
	top: -0.35em;

	font-size: 0.7em !important;
	line-height: 0 !important;
}

/* Improve quote-like article text where pasted as spans/br */

body .news-article-page .post-content br + br {
	display: block;
	content: "";

	margin-top: 1rem;
}

/* ==========================================
   BACK BUTTON WRAPPER
   Arrow/icon handled globally in Buttons tab.
========================================== */

body .news-article-page .back-button {
	margin: clamp(1.5rem, 3vw, 2.5rem) 0 0 !important;
	padding: 0 !important;
}

body .news-article-page .back-button.textblock {
	background: transparent !important;
	border: 0 !important;
	box-shadow: none !important;
}

/* ==========================================
   TABLET ARTICLE PAGE
========================================== */

@media (min-width: 768px) and (max-width: 1200px) {

	body .news-article-page > .i:not(:has(> .side-column .notice-box, > .side-column .linked-items, > .side-column .application-process, > .side-column .form-component, > .side-column .textblock:not(.empty), > .side-column .content:not(.empty), > .side-column .files:not(:empty))) > .layout-cell:first-child {
		max-width: 980px;
	}

	body .news-article-page .title h1 {
		font-size: clamp(2.4rem, 6vw, 4.3rem);
	}

	body .news-article-page .images img {
		height: clamp(290px, 42vw, 460px) !important;
	}

}

/* ==========================================
   RESPONSIVE ARTICLE SIDE COLUMN
========================================== */

@media (max-width: 1000px) {

	body .news-article-page > .i:has(> .side-column .notice-box, > .side-column .linked-items, > .side-column .application-process, > .side-column .form-component, > .side-column .textblock:not(.empty), > .side-column .content:not(.empty), > .side-column .files:not(:empty)) {
		grid-template-columns: 1fr;
	}

	body .news-article-page > .i:has(> .side-column .notice-box, > .side-column .linked-items, > .side-column .application-process, > .side-column .form-component, > .side-column .textblock:not(.empty), > .side-column .content:not(.empty), > .side-column .files:not(:empty)) > .side-column {
		margin-top: clamp(1.5rem, 4vw, 2.5rem) !important;
	}

	body .news-article-page .side-column > .linked-items .icon img {
		height: 190px !important;
	}

}

/* ==========================================
   MOBILE ARTICLE PAGE
========================================== */

@media (max-width: 767px) {

	body .news-article-page {
		padding-block: var(--ww-space-l);
	}

	body .news-article-page .title h1 {
		font-size: clamp(2.1rem, 11vw, 3.25rem);
		letter-spacing: -0.052em;
	}

	body .news-article-page .post-details {
		gap: 0.55rem;
	}

	body .news-article-page .post-details .layout-component {
		width: 100%;
		justify-content: flex-start;

		font-size: 0.8rem;
	}

	body .news-article-page .images {
		border-radius: var(--ww-radius-m);
	}

	body .news-article-page .images img {
		height: 260px !important;
	}

	body .news-article-page .post-content {
		padding: 1.25rem !important;
		padding-left: 1.45rem !important;

		border-radius: var(--ww-radius-m);

		font-size: 1rem !important;
		line-height: 1.7 !important;
	}

	body .news-article-page .back-button a,
	body .news-article-page .back-button .button {
		width: 100%;
		min-height: 50px;
	}

	body .news-article-page .side-column > .notice-box,
	body .news-article-page .side-column > .linked-items,
	body .news-article-page .side-column .application-process {
		border-radius: var(--ww-radius-m);
	}

}



/* ==========================================
   GALLERY SECTION
   Project / hub image gallery
   4 ALL FOUNDATION
========================================== */

/*
	Recommended HTML:

	<div class="layout-cell page-section fill-brand-1 gallery-section">
		<div class="i">
			<div class="layout-component image-gallery images">
				<div class="content">
					<div class="collation-gallery-image-container">
						<div class="gallery-arrow-left"></div>
						<div class="gallery-slides">
							<div class="gallery-image active">
								<img>
							</div>
						</div>
						<div class="gallery-arrow-right"></div>
					</div>

					<div class="collation-item-thumbs">
						<div class="image-thumb">
							<img>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>

	Important:
	This version preserves the EOS native slide strip behaviour.
	It fixes right-side image creep by allowing the active image
	to overscan slightly beyond its EOS slide width.
*/

/* ==========================================
   SECTION SHELL
========================================== */

body .gallery-section {
	--ww-gallery-frame-border: 10px;
	--ww-gallery-bleed-guard: clamp(56px, 4.5vw, 96px);

	position: relative;
	isolation: isolate;

	background:
		radial-gradient(circle at 12% 18%, rgba(217,147,14,.22), transparent 34%),
		radial-gradient(circle at 88% 86%, rgba(217,147,14,.14), transparent 38%),
		var(--ww-color-black);

	color: var(--ww-color-white);

	overflow: hidden;
}

body .gallery-section::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 0;

	background:
		linear-gradient(135deg, rgba(255,255,255,.055) 0 1px, transparent 1px 26px);

	opacity: .16;

	pointer-events: none;
}

body .gallery-section::after {
	content: "";
	position: absolute;
	left: 50%;
	bottom: -220px;
	z-index: 0;

	width: min(860px, 94vw);
	aspect-ratio: 1 / 1;

	background: rgba(217,147,14,.16);
	border-radius: 999px;

	filter: blur(78px);

	transform: translateX(-50%);

	pointer-events: none;
}

body .gallery-section > .i {
	position: relative;
	z-index: 1;

	width: calc(100% - (var(--ww-page-gutter) * 2));
	max-width: min(var(--ww-container-max), 1600px);

	margin-left: auto;
	margin-right: auto;
}

/* Hide the section if EOS outputs no image */

body .gallery-section:not(:has(img)),
body .gallery-section .image-gallery:not(:has(img)) {
	display: none !important;
}

/* ==========================================
   GALLERY COMPONENT
========================================== */

body .gallery-section .image-gallery,
body .gallery-section .image-gallery > .content {
	position: relative;

	width: 100%;
	min-width: 0;

	margin: 0 !important;
	padding: 0 !important;
}

/* ==========================================
   MAIN GALLERY FRAME
========================================== */

body .gallery-section .collation-gallery-image-container {
	position: relative;
	isolation: isolate;

	box-sizing: border-box;

	width: 100% !important;
	max-width: 1600px !important;
	aspect-ratio: 16 / 9;

	margin: 0 auto !important;
	padding: 0 !important;

	background: var(--ww-color-white);

	border: var(--ww-gallery-frame-border) solid rgba(255,255,255,.94);
	border-top-color: rgba(255,255,255,.98);
	border-radius: var(--ww-radius-l);

	box-shadow:
		0 34px 96px rgba(0,0,0,.34),
		0 0 0 1px rgba(217,147,14,.18),
		0 0 46px rgba(217,147,14,.12),
		inset 0 1px 0 rgba(255,255,255,.94);

	overflow: hidden !important;
}

body .gallery-section .collation-gallery-image-container::before {
	content: "";
	position: absolute;
	top: calc(var(--ww-gallery-frame-border) * -1);
	left: calc(var(--ww-gallery-frame-border) * -1);
	z-index: 9;

	width: calc(100% + (var(--ww-gallery-frame-border) * 2));
	height: 7px;

	background:
		linear-gradient(
			90deg,
			var(--ww-color-orange),
			rgba(217,147,14,.42),
			var(--ww-color-orange)
		);

	pointer-events: none;
}

body .gallery-section .collation-gallery-image-container::after {
	content: "";
	position: absolute;
	right: -120px;
	bottom: -120px;
	z-index: 0;

	width: 320px;
	height: 320px;

	background: rgba(217,147,14,.11);
	border-radius: 999px;

	pointer-events: none;
}

/* ==========================================
   SLIDE STRIP
   Preserve EOS left / width behaviour
========================================== */

body .gallery-section .gallery-slides {
	position: relative !important;
	z-index: 2;

	display: block !important;

	height: 100% !important;

	margin: 0 !important;
	padding: 0 !important;

	overflow: visible !important;
}

/*
	Do not force left, transform or absolute stacking here.
	EOS controls the horizontal movement inline.
*/

/* ==========================================
   INDIVIDUAL SLIDES
========================================== */

body .gallery-section .gallery-image {
	position: relative !important;
	z-index: 1;

	box-sizing: border-box;

	height: 100% !important;

	margin: 0 !important;
	padding: 0 !important;

	background: var(--ww-color-black);

	overflow: visible !important;
}

body .gallery-section .gallery-image.active {
	z-index: 4;
}

/*
	Overscan fix:
	EOS slide widths can be slightly narrower than the visible frame.
	The active image extends beyond the slide width, covering the
	right-side creep while the outer frame clips the final result.
*/

body .gallery-section .gallery-image img {
	position: relative;
	z-index: 1;

	display: block;

	width: calc(100% + var(--ww-gallery-bleed-guard)) !important;
	height: 100% !important;
	max-width: none !important;
	max-height: none !important;

	margin: 0 !important;
	padding: 0 !important;

	object-fit: cover;
	object-position: center;

	border-radius: calc(var(--ww-radius-l) - 0.95rem);

	transform: scale(1);

	transition:
		transform var(--ww-transition-medium),
		filter var(--ww-transition-medium);
}

/*
	Keep non-active slides lower in the layer stack so the current
	active slide masks any neighbour creep.
*/

body .gallery-section .gallery-image:not(.active) {
	z-index: 1;
}

body .gallery-section .gallery-image.active img {
	z-index: 5;
}

body .gallery-section .collation-gallery-image-container:hover .gallery-image.active img,
body .gallery-section .collation-gallery-image-container:focus-within .gallery-image.active img {
	transform: scale(1.018);

	filter: saturate(1.04) contrast(1.02);
}

/* ==========================================
   RIGHT EDGE SAFETY MASK
   Small final guard for browser/EOS rounding
========================================== */

body .gallery-section .collation-gallery-image-container .gallery-slides::after {
	content: "";
	position: absolute;
	top: 0;
	right: calc(var(--ww-gallery-bleed-guard) * -1);
	z-index: 6;

	width: var(--ww-gallery-bleed-guard);
	height: 100%;

	background: transparent;

	pointer-events: none;
}

/* ==========================================
   ARROWS
========================================== */

body .gallery-section .gallery-arrow-left,
body .gallery-section .gallery-arrow-right {
	position: absolute;
	top: 50%;
	z-index: 10;

	display: flex !important;
	align-items: center;
	justify-content: center;

	width: clamp(46px, 4vw, 62px);
	height: clamp(46px, 4vw, 62px);

	margin: 0 !important;
	padding: 0 !important;

	background: rgba(0,0,0,.78);
	color: var(--ww-color-orange);

	border: 1px solid rgba(217,147,14,.48);
	border-radius: 999px;

	box-shadow:
		0 18px 44px rgba(0,0,0,.24),
		inset 0 1px 0 rgba(255,255,255,.08);

	font-size: 0 !important;
	font-weight: 900;
	line-height: 1;

	transform: translateY(-50%);

	cursor: pointer;

	transition:
		transform var(--ww-transition-fast),
		background-color var(--ww-transition-fast),
		color var(--ww-transition-fast),
		border-color var(--ww-transition-fast),
		box-shadow var(--ww-transition-fast);
}

body .gallery-section .gallery-arrow-left {
	left: clamp(1rem, 2vw, 1.75rem);
}

body .gallery-section .gallery-arrow-right {
	right: clamp(1rem, 2vw, 1.75rem);
}

body .gallery-section .gallery-arrow-left::before,
body .gallery-section .gallery-arrow-right::before {
	display: block;

	font-size: clamp(1.55rem, 2vw, 1.95rem);
	font-weight: 900;
	line-height: 1;
}

body .gallery-section .gallery-arrow-left::before {
	content: "‹";
}

body .gallery-section .gallery-arrow-right::before {
	content: "›";
}

body .gallery-section .gallery-arrow-left:hover,
body .gallery-section .gallery-arrow-left:focus,
body .gallery-section .gallery-arrow-right:hover,
body .gallery-section .gallery-arrow-right:focus {
	background: var(--ww-color-orange);
	color: var(--ww-color-black);
	border-color: var(--ww-color-orange);

	box-shadow:
		0 22px 54px rgba(0,0,0,.3),
		0 0 30px rgba(217,147,14,.2);
}

body .gallery-section .gallery-arrow-left:hover,
body .gallery-section .gallery-arrow-left:focus {
	transform: translateY(-50%) translateX(-3px);
}

body .gallery-section .gallery-arrow-right:hover,
body .gallery-section .gallery-arrow-right:focus {
	transform: translateY(-50%) translateX(3px);
}

/* Hide arrows when only one gallery image is present */

body .gallery-section .collation-gallery-image-container:has(.gallery-image:only-child) .gallery-arrow-left,
body .gallery-section .collation-gallery-image-container:has(.gallery-image:only-child) .gallery-arrow-right {
	display: none !important;
}

/* ==========================================
   THUMBNAILS
========================================== */

body .gallery-section .collation-item-thumbs {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: clamp(0.55rem, 1vw, 0.85rem);

	width: 100%;
	max-width: 1100px;

	margin: clamp(1rem, 2vw, 1.4rem) auto 0 !important;
	padding: 0 !important;
}

body .gallery-section .image-thumb {
	position: relative;
	isolation: isolate;

	width: clamp(86px, 8vw, 128px);
	aspect-ratio: 16 / 9;

	margin: 0 !important;
	padding: 0.28rem !important;

	background: rgba(255,255,255,.94);

	border: 1px solid rgba(217,147,14,.28);
	border-radius: var(--ww-radius-s);

	box-shadow:
		0 12px 30px rgba(0,0,0,.18),
		inset 0 1px 0 rgba(255,255,255,.9);

	overflow: hidden;

	cursor: pointer;

	transition:
		transform var(--ww-transition-fast),
		border-color var(--ww-transition-fast),
		box-shadow var(--ww-transition-fast);
}

body .gallery-section .image-thumb:hover,
body .gallery-section .image-thumb:focus,
body .gallery-section .image-thumb.active,
body .gallery-section .image-thumb.selected {
	transform: translateY(-3px);

	border-color: var(--ww-color-orange);

	box-shadow:
		0 18px 38px rgba(0,0,0,.24),
		0 0 0 2px rgba(217,147,14,.2),
		inset 0 1px 0 rgba(255,255,255,.95);
}

body .gallery-section .image-thumb img {
	display: block;

	width: 100% !important;
	height: 100% !important;
	max-width: none !important;

	margin: 0 !important;
	padding: 0 !important;

	object-fit: cover;
	object-position: center;

	border-radius: calc(var(--ww-radius-s) - 0.22rem);
}

/* ==========================================
   TABLET
========================================== */

@media (min-width: 768px) and (max-width: 1200px) {

	body .gallery-section {
		--ww-gallery-frame-border: 10px;
		--ww-gallery-bleed-guard: 80px;
	}

	body .gallery-section > .i {
		width: calc(100% - (var(--ww-page-gutter) * 2));
	}

	body .gallery-section .collation-gallery-image-container {
		border-radius: var(--ww-radius-l);
	}

	body .gallery-section .image-thumb {
		width: clamp(82px, 10vw, 112px);
	}

}

/* ==========================================
   MOBILE
========================================== */

@media (max-width: 767px) {

	body .gallery-section {
		--ww-gallery-frame-border: 8px;
		--ww-gallery-bleed-guard: 60px;
	}

	body .gallery-section .collation-gallery-image-container {
		aspect-ratio: 16 / 10;

		border-radius: var(--ww-radius-m);
	}

	body .gallery-section .gallery-image img {
		border-radius: calc(var(--ww-radius-m) - 0.5rem);
	}

	body .gallery-section .gallery-arrow-left,
	body .gallery-section .gallery-arrow-right {
		width: 42px;
		height: 42px;

		background: rgba(0,0,0,.82);
	}

	body .gallery-section .gallery-arrow-left {
		left: 0.8rem;
	}

	body .gallery-section .gallery-arrow-right {
		right: 0.8rem;
	}

	body .gallery-section .gallery-arrow-left::before,
	body .gallery-section .gallery-arrow-right::before {
		font-size: 1.35rem;
	}

	body .gallery-section .collation-item-thumbs {
		gap: 0.55rem;
		margin-top: 0.9rem !important;
	}

	body .gallery-section .image-thumb {
		width: clamp(72px, 22vw, 96px);

		padding: 0.22rem !important;
	}

}

/* ==========================================
   SMALL MOBILE
========================================== */

@media (max-width: 480px) {

	body .gallery-section {
		--ww-gallery-frame-border: 7px;
		--ww-gallery-bleed-guard: 46px;
	}

	body .gallery-section .collation-gallery-image-container {
		aspect-ratio: 4 / 3;
	}

	body .gallery-section .gallery-arrow-left,
	body .gallery-section .gallery-arrow-right {
		width: 38px;
		height: 38px;
	}

	body .gallery-section .image-thumb {
		width: clamp(66px, 26vw, 86px);
	}

}

/* ==========================================
   REDUCED MOTION
========================================== */

@media (prefers-reduced-motion: reduce) {

	body .gallery-section .gallery-image img,
	body .gallery-section .gallery-arrow-left,
	body .gallery-section .gallery-arrow-right,
	body .gallery-section .image-thumb {
		transition: none;
	}

	body .gallery-section .collation-gallery-image-container:hover .gallery-image.active img,
	body .gallery-section .collation-gallery-image-container:focus-within .gallery-image.active img,
	body .gallery-section .gallery-arrow-left:hover,
	body .gallery-section .gallery-arrow-left:focus,
	body .gallery-section .gallery-arrow-right:hover,
	body .gallery-section .gallery-arrow-right:focus,
	body .gallery-section .image-thumb:hover,
	body .gallery-section .image-thumb:focus,
	body .gallery-section .image-thumb.active,
	body .gallery-section .image-thumb.selected {
		transform: none;
	}

}


 /* Begin CSS Part: Collation Admin */
/* ==========================================
   ACTIVITY LISTING + DETAIL PAGES
   4 ALL FOUNDATION
   Unified rework for consistent attribute cards
========================================== */

/* ==========================================
   SHARED ACTIVITY ATTRIBUTE DESIGN TOKENS
========================================== */

body {
	--activity-attr-icon-size: 42px;
	--activity-attr-icon-img-size: 22px;
	--activity-attr-gap-x: 0.72rem;
	--activity-attr-gap-y: 0.22rem;
	--activity-attr-pad: 0.78rem 0.9rem;
	--activity-attr-radius: var(--ww-radius-m);
	--activity-attr-bg: rgba(217,147,14,.08);
	--activity-attr-border: rgba(217,147,14,.22);
	--activity-attr-orb: rgba(217,147,14,.12);
}

/* ==========================================
   ACTIVITY LISTING CARDS
   Scoped to activity result cards only
========================================== */

body .layout-component.items.ww-grid > .collation-items-list,
body .activity-results > .collation-items-list {
	display: grid !important;
	grid-template-columns: 1fr !important;
	gap: clamp(1.25rem, 2.5vw, 2rem) !important;

	width: 100% !important;
	min-width: 0 !important;

	margin: 0 !important;
	padding: 0 !important;
}

body .activity-card.card-output {
	position: relative;
	isolation: isolate;

	display: grid !important;
	grid-template-columns: minmax(280px, 36%) minmax(0, 1fr) !important;
	align-items: stretch;

	width: 100%;
	min-width: 0;

	background: var(--ww-color-white);

	border: 1px solid rgba(0,0,0,.08);
	border-radius: var(--ww-radius-l);

	box-shadow:
		0 16px 44px rgba(0,0,0,.08),
		inset 0 1px 0 rgba(255,255,255,.9);

	overflow: hidden;

	transition:
		transform var(--ww-transition-fast),
		box-shadow var(--ww-transition-fast),
		border-color var(--ww-transition-fast);
}

body .activity-card.card-output:hover,
body .activity-card.card-output:focus-within {
	transform: translateY(-5px);
	border-color: rgba(217,147,14,.5);

	box-shadow:
		0 26px 70px rgba(0,0,0,.14),
		0 0 0 1px rgba(217,147,14,.12),
		inset 0 1px 0 rgba(255,255,255,.95);
}

body .activity-card.card-output::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	z-index: 3;

	width: 100%;
	height: 7px;

	background:
		linear-gradient(
			90deg,
			var(--ww-color-orange),
			rgba(217,147,14,.45),
			var(--ww-color-orange)
		);

	pointer-events: none;
}

body .activity-card.card-output::after {
	content: "";
	position: absolute;
	right: -90px;
	bottom: -90px;
	z-index: 0;

	width: 220px;
	height: 220px;

	background: rgba(217,147,14,.10);
	border-radius: 999px;

	pointer-events: none;

	transition:
		transform var(--ww-transition-medium),
		opacity var(--ww-transition-medium);
}

body .activity-card.card-output:hover::after,
body .activity-card.card-output:focus-within::after {
	opacity: .95;
	transform: scale(1.18);
}

body .activity-card.card-output > .layout-cell {
	min-width: 0 !important;
	height: auto !important;
	margin: 0 !important;
	padding: 0 !important;
}

body .activity-card.card-output > .card-image-container {
	display: block !important;
	height: auto !important;
}

body .activity-card.card-output > .card-content-container {
	display: grid !important;
	flex: initial !important;
	height: auto !important;
}

/* ==========================================
   ACTIVITY LISTING IMAGE SIDE
========================================== */

body .activity-card .card-image-container {
	position: relative;
	z-index: 1;

	display: block !important;

	width: 100%;
	height: 100%;
	min-height: 320px;

	background: var(--ww-color-black);
	overflow: hidden;
}

body .activity-card .card-image-container .icon,
body .activity-card .card-image-container .layout-component {
	width: 100%;
	height: 100%;

	margin: 0 !important;
	padding: 0 !important;
}

body .activity-card .card-image-container img {
	display: block;

	width: 100% !important;
	height: 100% !important;
	max-width: none !important;

	object-fit: cover;
	object-position: center;

	transform: scale(1);

	transition:
		transform .45s ease,
		opacity .45s ease;
}

body .activity-card:hover .card-image-container img,
body .activity-card:focus-within .card-image-container img {
	transform: scale(1.045);
}

body .activity-card .card-image-container::after {
	content: "";
	position: absolute;
	inset: 0;

	background:
		linear-gradient(90deg, transparent 58%, rgba(0,0,0,.22)),
		linear-gradient(0deg, rgba(0,0,0,.18), transparent 46%);

	pointer-events: none;
}

/* ==========================================
   ACTIVITY LISTING CONTENT SIDE
========================================== */

body .activity-card .card-content-container {
	position: static !important;
	z-index: 1;

	display: grid !important;
	grid-template-columns: minmax(0, 1fr) auto;
	grid-template-areas:
		"title button"
		"abstract button"
		"details details"
		"suitable suitable";
	align-content: center;
	gap: 1rem 1.5rem;

	width: 100%;
	min-width: 0;

	padding: clamp(1.5rem, 3vw, 2.5rem) !important;

	background:
		linear-gradient(180deg, rgba(255,255,255,1), rgba(255,255,255,.96));
}

body .activity-card .title {
	grid-area: title;

	margin: 0 !important;
	padding: 0 !important;
}

body .activity-card .title h3 {
	margin: 0 !important;

	color: var(--ww-color-black);

	font-size: clamp(1.55rem, 2.4vw, 2.6rem);
	font-weight: 900;
	line-height: 1.05;
	letter-spacing: -0.045em;
	text-wrap: balance;
}

body .activity-card .abstract {
	grid-area: abstract;

	display: -webkit-box;
	-webkit-line-clamp: 4;
	-webkit-box-orient: vertical;

	max-width: 760px;

	margin: 0 !important;
	padding: 0 !important;

	color: var(--ww-color-muted);

	font-size: clamp(1rem, 1.2vw, 1.08rem);
	line-height: 1.65;

	overflow: hidden;
}

body .activity-card .abstract.empty {
	display: none !important;
}

body .activity-card .abstract p {
	margin: 0 0 .55rem !important;
}

body .activity-card .abstract p:last-child {
	margin-bottom: 0 !important;
}

/* ==========================================
   ACTIVITY LISTING ATTRIBUTE ROWS
   Uses the same visual pattern as detail page, only smaller.
========================================== */

body .activity-card .details-mini {
	grid-area: details;

	display: grid !important;
	grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
	align-items: start !important;
	gap: .75rem;

	width: 100%;
	min-width: 0;

	margin: 0 !important;
	padding: 0 !important;
}

body .activity-card .suitable-mini {
	grid-area: suitable;

	display: grid !important;
	grid-template-columns: minmax(210px, .38fr) minmax(0, 1fr);
	align-items: start !important;
	gap: .75rem;

	width: 100%;
	min-width: 0;

	margin: 0 !important;
	padding: 0 !important;
}

body .activity-card .suitable-mini .collation-attribute-group:only-child {
	grid-column: 1 / -1;
}

body .activity-card .details-mini .collation-attribute-group,
body .activity-card .suitable-mini .collation-attribute-group {
	--activity-attr-icon-size: 42px;
	--activity-attr-icon-img-size: 22px;
	--activity-attr-gap-x: .68rem;
	--activity-attr-gap-y: .18rem;
	--activity-attr-pad: .75rem .85rem;

	position: relative;
	isolation: isolate;

	display: grid !important;
	grid-template-columns: var(--activity-attr-icon-size) minmax(0, 1fr) !important;
	grid-template-areas: none !important;
	grid-auto-flow: row !important;
	grid-auto-rows: auto !important;
	align-items: start !important;
	align-self: start !important;
	column-gap: var(--activity-attr-gap-x) !important;
	row-gap: var(--activity-attr-gap-y) !important;

	width: 100%;
	min-width: 0;
	min-height: 0 !important;
	height: auto !important;

	margin: 0 !important;
	padding: var(--activity-attr-pad) !important;

	background: rgba(217,147,14,.08);
	border: 1px solid rgba(217,147,14,.2);
	border-radius: var(--ww-radius-m);

	overflow: hidden !important;

	transform: none !important;
}

body .activity-card .suitable-mini .collation-attribute-group {
	background:
		linear-gradient(135deg, rgba(217,147,14,.13), rgba(217,147,14,.055));
	border-color: rgba(217,147,14,.24);
}

body .activity-card .suitable-mini .collation-attribute-group.location {
	background:
		linear-gradient(135deg, rgba(0,0,0,.045), rgba(217,147,14,.08));
}

body .activity-card .details-mini .collation-attribute-group::after,
body .activity-card .suitable-mini .collation-attribute-group::after {
	content: "";
	position: absolute;
	right: -28px;
	top: -28px;
	z-index: -1;

	width: 78px;
	height: 78px;

	background: rgba(217,147,14,.12);
	border-radius: 999px;

	pointer-events: none;
}

/* Shared listing attribute pieces */

body .activity-card .attribute-main-image {
	grid-area: unset !important;
	grid-column: 1 !important;
	grid-row: 1 / span 10 !important;

	position: static !important;
	inset: auto !important;

	display: flex !important;
	align-items: center !important;
	justify-content: center !important;

	width: var(--activity-attr-icon-size) !important;
	height: var(--activity-attr-icon-size) !important;
	min-width: var(--activity-attr-icon-size) !important;

	margin: 0 !important;
	padding: 0 !important;

	background: var(--ww-color-orange) !important;
	border-radius: 999px !important;

	box-shadow: 0 8px 18px rgba(217,147,14,.22) !important;

	transform: none !important;
}

body .activity-card .attribute-main-image img {
	display: block !important;

	width: var(--activity-attr-icon-img-size) !important;
	height: var(--activity-attr-icon-img-size) !important;
	max-width: var(--activity-attr-icon-img-size) !important;
	max-height: var(--activity-attr-icon-img-size) !important;

	margin: 0 !important;
	padding: 0 !important;

	object-fit: contain !important;
}

body .activity-card .attribute-name {
	grid-area: unset !important;
	grid-column: 2 !important;
	grid-row: 1 !important;

	position: static !important;
	inset: auto !important;

	display: block !important;

	min-width: 0 !important;

	margin: 0 !important;
	padding: 0 !important;

	color: rgba(0,0,0,.62) !important;

	font-size: .72rem !important;
	font-weight: 900 !important;
	line-height: 1 !important;
	letter-spacing: .075em !important;
	text-transform: uppercase !important;

	transform: none !important;
}

body .activity-card .collation-attribute {
	grid-area: unset !important;
	grid-column: 2 !important;
	grid-row: auto !important;

	position: static !important;
	inset: auto !important;
	z-index: auto !important;

	display: block !important;

	width: auto !important;
	max-width: 100% !important;
	min-width: 0 !important;

	margin: 0 !important;
	padding: 0 !important;

	background: transparent !important;
	border: 0 !important;
	box-shadow: none !important;

	float: none !important;
	clear: both !important;

	transform: none !important;
}

body .activity-card .collation-attribute + .collation-attribute {
	margin-top: .08rem !important;
}

body .activity-card .attribute-value,
body .activity-card .attribute-value.day,
body .activity-card .attribute-value.monday,
body .activity-card .attribute-value.tuesday,
body .activity-card .attribute-value.wednesday,
body .activity-card .attribute-value.thursday,
body .activity-card .attribute-value.friday,
body .activity-card .attribute-value.saturday,
body .activity-card .attribute-value.sunday {
	position: static !important;
	inset: auto !important;

	display: block !important;

	width: 100% !important;
	max-width: 100% !important;
	min-width: 0 !important;

	margin: 0 !important;
	padding: 0 !important;

	background: transparent !important;
	border: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;

	color: var(--ww-color-black) !important;

	font-size: .92rem !important;
	font-weight: 850 !important;
	line-height: 1.24 !important;
	text-align: left !important;
	white-space: normal !important;
	word-break: normal !important;
	overflow-wrap: normal !important;

	float: none !important;
	clear: both !important;

	transform: none !important;
}

body .activity-card .suitable-mini .collation-attribute-group.location .attribute-value {
	font-size: 1rem !important;
	font-weight: 900 !important;
	line-height: 1.25 !important;
}

body .activity-card .suitable-mini .collation-attribute-group.suitablefor .attribute-value {
	font-size: .98rem !important;
	font-weight: 850 !important;
	line-height: 1.35 !important;
}

/* ==========================================
   ACTIVITY LISTING BUTTON / OVERLAY LINK
========================================== */

body .activity-card .text-link {
	grid-area: button;

	align-self: start;
	justify-self: end;

	margin: 0 !important;
	padding: 0 !important;
}

body .activity-card .text-link .button,
body .activity-card .text-link .button:visited {
	pointer-events: none;

	min-height: 48px;
	padding: .85rem 1.15rem;

	white-space: nowrap;

	font-size: .9rem;
}

body .activity-card .link.empty,
body .activity-card .layout-component.link:empty {
	display: none !important;
}

body .activity-card > a.collation-item-link.wrap.inflate,
body .activity-card .card-content-container > a.collation-item-link.wrap.inflate {
	position: absolute !important;
	inset: 0 !important;
	z-index: 8 !important;

	display: block !important;

	width: 100% !important;
	height: 100% !important;
	min-height: 0 !important;

	margin: 0 !important;
	padding: 0 !important;

	font-size: 0 !important;
	line-height: 0 !important;
	text-indent: -9999px !important;

	background: transparent !important;
	color: transparent !important;
	text-decoration: none !important;

	border: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;

	transform: none !important;
	outline: none;

	pointer-events: auto !important;
	cursor: pointer;
}

body .activity-card:focus-within {
	outline: 3px solid rgba(217,147,14,.45);
	outline-offset: 4px;
}

/* ==========================================
   ACTIVITY DETAIL PAGE WRAPPER
========================================== */

body .activity-page,
body .activity-detail-section {
	position: relative;
}

body .activity-page.top-fade {
	background:
		linear-gradient(180deg, rgba(217,147,14,.055), rgba(255,255,255,1) 360px),
		var(--ww-color-white);
}

body .activity-page > .i,
body .activity-detail-section > .i {
	width: calc(100% - (var(--ww-page-gutter) * 2));
	max-width: var(--ww-container-max);

	margin-left: auto;
	margin-right: auto;
}

body .activity-page > .i > .layout-cell > .title,
body .activity-detail-section .page-section-content > .title {
	margin: 0 0 1.5rem !important;
	padding: 0 !important;
}

body .activity-page > .i > .layout-cell > .title h1,
body .activity-detail-section .page-section-content > .title h1 {
	position: relative;

	margin: 0 !important;
	padding-bottom: 1rem;

	color: var(--ww-color-black);

	font-size: clamp(2.6rem, 6vw, 5.6rem);
	font-weight: 900;
	line-height: .98;
	letter-spacing: -0.06em;
	text-wrap: balance;
}

body .activity-page > .i > .layout-cell > .title h1::after,
body .activity-detail-section .page-section-content > .title h1::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;

	width: 96px;
	height: 6px;

	background: var(--ww-color-orange);
	border-radius: 999px;
}

body .activity-detail-section > .i {
	display: grid !important;
	grid-template-columns: minmax(0, 1fr) minmax(300px, 360px);
	align-items: start;
	gap: clamp(2rem, 4vw, 4rem);
}

body .activity-detail-section .page-section-content,
body .activity-detail-section .page-section-side-column {
	width: 100%;
	min-width: 0;

	margin: 0 !important;
	padding: 0 !important;
}

/* ==========================================
   ACTIVITY DETAIL FEATURE IMAGE + CONTENT
========================================== */

body .activity-detail-section .page-section-content .icon {
	position: relative;

	width: 100%;

	margin: 0 0 1.75rem !important;
	padding: 0 !important;

	background: var(--ww-color-black);
	border-radius: var(--ww-radius-l);

	box-shadow:
		0 22px 64px rgba(0,0,0,.16),
		inset 0 1px 0 rgba(255,255,255,.85);

	overflow: hidden;
}

body .activity-detail-section .page-section-content .icon::after {
	content: "";
	position: absolute;
	inset: 0;

	background:
		linear-gradient(0deg, rgba(0,0,0,.22), transparent 48%),
		linear-gradient(90deg, rgba(0,0,0,.12), transparent 45%);

	pointer-events: none;
}

body .activity-detail-section .page-section-content .icon img {
	display: block;

	width: 100% !important;
	height: clamp(320px, 42vw, 520px) !important;
	max-width: none !important;

	object-fit: cover;
	object-position: center;
}

body .activity-detail-section .page-section-content > .layout-cell .content:not(.empty),
body .activity-detail-section .article-content:not(.empty) {
	max-width: 940px;

	color: var(--ww-color-muted);

	font-size: clamp(1.05rem, 1.4vw, 1.2rem);
	line-height: 1.75;
}

body .activity-detail-section .page-section-content .content p,
body .activity-detail-section .article-content p {
	margin: 0 0 1rem;
}

body .activity-detail-section .page-section-content .content p:last-child,
body .activity-detail-section .article-content p:last-child {
	margin-bottom: 0;
}

body .activity-detail-section .article-content.empty {
	display: none !important;
}

/* ==========================================
   ACTIVITY DETAIL LOCATION / HUB BOX
========================================== */

body .activity-detail-section .categories.frame-box {
	position: relative;
	isolation: isolate;

	margin: clamp(2rem, 4vw, 3rem) 0 !important;
	padding: clamp(1rem, 2vw, 1.5rem) !important;

	background:
		radial-gradient(circle at 94% 12%, rgba(217,147,14,.16), transparent 32%),
		var(--ww-color-white);

	border: 1px solid rgba(217,147,14,.22);
	border-radius: var(--ww-radius-l);

	box-shadow:
		0 16px 46px rgba(0,0,0,.08),
		inset 0 1px 0 rgba(255,255,255,.9);

	overflow: hidden;
}

body .activity-detail-section .categories.frame-box::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;

	width: 100%;
	height: 7px;

	background: var(--ww-color-orange);

	pointer-events: none;
}

body .activity-detail-section .categories.frame-box > .layout,
body .activity-detail-section .categories.frame-box .layout.mod_collation_collation_item_component_categories {
	display: grid !important;
	grid-template-columns: 1fr !important;
	align-items: stretch !important;
	gap: 1rem !important;

	width: 100% !important;
	max-width: none !important;
	min-width: 0 !important;

	margin: 0 !important;
	padding: 0 !important;
}

body .activity-detail-section .categories.frame-box .category-display,
body .activity-detail-section .categories.frame-box .category-result {
	display: grid !important;
	grid-template-columns: 140px minmax(0, 1fr) !important;
	align-items: center !important;
	gap: 1.25rem !important;

	grid-column: 1 / -1 !important;

	width: 100% !important;
	max-width: none !important;
	min-width: 0 !important;

	margin: 0 !important;
	padding: clamp(.85rem, 1.5vw, 1rem) !important;

	background: rgba(217,147,14,.045) !important;
	border: 1px solid rgba(217,147,14,.16) !important;
	border-radius: var(--ww-radius-m) !important;

	overflow: hidden !important;
}

body .activity-detail-section .categories.frame-box .category-display > .layout-cell,
body .activity-detail-section .categories.frame-box .category-result > .layout-cell {
	width: 100% !important;
	max-width: none !important;
	min-width: 0 !important;

	margin: 0 !important;
	padding: 0 !important;

	float: none !important;
}

body .activity-detail-section .categories.frame-box .category-display > .layout-cell:first-child,
body .activity-detail-section .categories.frame-box .category-result > .layout-cell:first-child {
	grid-column: 1 !important;
}

body .activity-detail-section .categories.frame-box .category-display > .layout-cell:last-child,
body .activity-detail-section .categories.frame-box .category-result > .layout-cell:last-child {
	grid-column: 2 !important;
}

body .activity-detail-section .categories.frame-box .image {
	width: 140px !important;
	height: 140px !important;

	margin: 0 !important;
	padding: 0 !important;

	background: rgba(217,147,14,.08);
	border: 1px solid rgba(217,147,14,.22);
	border-radius: var(--ww-radius-m);

	overflow: hidden;
}

body .activity-detail-section .categories.frame-box .image img {
	display: block;

	width: 100% !important;
	height: 100% !important;

	object-fit: cover;
	object-position: center;
}

body .activity-detail-section .categories.frame-box .title {
	margin: 0 0 .75rem !important;
	padding: 0 !important;
}

body .activity-detail-section .categories.frame-box .component-topper p {
	margin: 0 0 .35rem !important;

	color: var(--ww-color-orange);

	font-size: .82rem;
	font-weight: 900;
	line-height: 1.2;
	letter-spacing: .07em;
	text-transform: uppercase;
}

body .activity-detail-section .categories.frame-box h2 {
	margin: 0 !important;

	color: var(--ww-color-black);

	font-size: clamp(1.45rem, 2.3vw, 2.2rem);
	font-weight: 900;
	line-height: 1.08;
	letter-spacing: -0.04em;
}

body .activity-detail-section .categories.frame-box .description,
body .activity-detail-section .categories.frame-box .cat-contact {
	margin: 0 0 .65rem !important;
	padding: 0 !important;
}

body .activity-detail-section .categories.frame-box .description.empty,
body .activity-detail-section .categories.frame-box .cat-contact.empty {
	display: none !important;
}

body .activity-detail-section .categories.frame-box label {
	display: block;

	margin: 0 0 .15rem !important;

	color: rgba(0,0,0,.58);

	font-size: .76rem;
	font-weight: 900;
	line-height: 1;
	letter-spacing: .07em;
	text-transform: uppercase;
}

body .activity-detail-section .categories.frame-box .description p,
body .activity-detail-section .categories.frame-box .cat-contact .content {
	margin: 0 !important;

	color: var(--ww-color-black);

	font-size: .98rem;
	font-weight: 750;
	line-height: 1.4;
}

body .activity-detail-section .categories.frame-box .link {
	margin-top: .75rem !important;
	padding: 0 !important;
	text-align: left !important;
}

body .activity-detail-section .categories.frame-box .category-link,
body .activity-detail-section .categories.frame-box .category-link:visited {
	display: inline-flex;
	align-items: center;
	gap: .45rem;

	color: var(--ww-color-black);

	font-size: .95rem;
	font-weight: 900;
	line-height: 1.2;
	text-decoration: none;
}

body .activity-detail-section .categories.frame-box .category-link:hover,
body .activity-detail-section .categories.frame-box .category-link:focus {
	color: var(--ww-color-orange);
}

/* ==========================================
   ACTIVITY DETAIL ATTRIBUTE GROUPS
   Same composition as listing cards, slightly larger.
========================================== */

body .activity-detail-section .detail-attributes,
body .activity-detail-section .suitable-attributes {
	width: 100% !important;
	max-width: none !important;
	min-width: 0 !important;

	padding: 0 !important;
}

body .activity-detail-section .detail-attributes {
	margin: clamp(2rem, 4vw, 3rem) 0 .9rem !important;
}

body .activity-detail-section .suitable-attributes {
	margin: 0 0 clamp(2rem, 4vw, 3rem) !important;
}

body .activity-detail-section .detail-attributes > .content,
body .activity-detail-section .suitable-attributes {
	display: grid !important;
	align-items: start !important;
	gap: .85rem !important;

	width: 100% !important;
	max-width: none !important;
	min-width: 0 !important;
}

body .activity-detail-section .detail-attributes > .content {
	grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

body .activity-detail-section .suitable-attributes {
	grid-template-columns: minmax(180px, .85fr) minmax(0, 2.15fr) !important;
}

body .activity-detail-section .detail-attributes .collation-attribute-group,
body .activity-detail-section .suitable-attributes .collation-attribute-group {
	--activity-attr-icon-size: 44px;
	--activity-attr-icon-img-size: 23px;
	--activity-attr-gap-x: .85rem;
	--activity-attr-gap-y: .25rem;
	--activity-attr-pad: clamp(.95rem, 1.35vw, 1.15rem);

	position: relative !important;
	isolation: isolate !important;

	display: grid !important;
	grid-template-columns: var(--activity-attr-icon-size) minmax(0, 1fr) !important;
	grid-template-areas: none !important;
	grid-auto-flow: row !important;
	grid-auto-rows: auto !important;
	align-items: start !important;
	align-self: start !important;
	column-gap: var(--activity-attr-gap-x) !important;
	row-gap: var(--activity-attr-gap-y) !important;

	width: 100% !important;
	max-width: none !important;
	min-width: 0 !important;
	min-height: 0 !important;
	height: auto !important;

	margin: 0 !important;
	padding: var(--activity-attr-pad) !important;

	background:
		radial-gradient(circle at 96% 0%, rgba(217,147,14,.12), transparent 34%),
		rgba(217,147,14,.08) !important;
	border: 1px solid rgba(217,147,14,.22) !important;
	border-radius: var(--ww-radius-m) !important;

	overflow: hidden !important;

	transform: none !important;
}

body .activity-detail-section .suitable-attributes .collation-attribute-group.suitablefor {
	background:
		linear-gradient(135deg, rgba(217,147,14,.13), rgba(217,147,14,.055)) !important;
}

body .activity-detail-section .detail-attributes .collation-attribute-group::after,
body .activity-detail-section .suitable-attributes .collation-attribute-group::after {
	content: "";
	position: absolute;
	right: -28px;
	top: -28px;
	z-index: -1;

	width: 78px;
	height: 78px;

	background: rgba(217,147,14,.13);
	border-radius: 999px;

	pointer-events: none;
}

body .activity-detail-section .detail-attributes .attribute-main-image,
body .activity-detail-section .suitable-attributes .attribute-main-image {
	grid-area: unset !important;
	grid-column: 1 !important;
	grid-row: 1 / span 10 !important;

	position: static !important;
	inset: auto !important;

	display: flex !important;
	align-items: center !important;
	justify-content: center !important;

	width: var(--activity-attr-icon-size) !important;
	height: var(--activity-attr-icon-size) !important;
	min-width: var(--activity-attr-icon-size) !important;

	margin: 0 !important;
	padding: 0 !important;

	background: var(--ww-color-orange) !important;
	border-radius: 999px !important;

	box-shadow: 0 8px 18px rgba(217,147,14,.22) !important;

	transform: none !important;
}

body .activity-detail-section .detail-attributes .attribute-main-image img,
body .activity-detail-section .suitable-attributes .attribute-main-image img {
	display: block !important;

	width: var(--activity-attr-icon-img-size) !important;
	height: var(--activity-attr-icon-img-size) !important;
	max-width: var(--activity-attr-icon-img-size) !important;
	max-height: var(--activity-attr-icon-img-size) !important;

	margin: 0 !important;
	padding: 0 !important;

	object-fit: contain !important;
}

body .activity-detail-section .detail-attributes .attribute-name,
body .activity-detail-section .suitable-attributes .attribute-name {
	grid-area: unset !important;
	grid-column: 2 !important;
	grid-row: 1 !important;

	position: static !important;
	inset: auto !important;

	display: flex !important;
	align-items: center !important;

	min-width: 0 !important;

	margin: 0 !important;
	padding: 0 !important;

	color: rgba(0,0,0,.62) !important;

	font-size: .78rem !important;
	font-weight: 950 !important;
	line-height: 1 !important;
	letter-spacing: .075em !important;
	text-transform: uppercase !important;

	transform: none !important;
}

body .activity-detail-section .detail-attributes .collation-attribute,
body .activity-detail-section .suitable-attributes .collation-attribute {
	grid-area: unset !important;
	grid-column: 2 !important;
	grid-row: auto !important;

	position: static !important;
	inset: auto !important;
	z-index: auto !important;

	display: block !important;

	width: auto !important;
	max-width: 100% !important;
	min-width: 0 !important;

	margin: 0 !important;
	padding: 0 !important;

	background: transparent !important;
	border: 0 !important;
	box-shadow: none !important;

	float: none !important;
	clear: both !important;

	transform: none !important;
}

body .activity-detail-section .detail-attributes .collation-attribute + .collation-attribute,
body .activity-detail-section .suitable-attributes .collation-attribute + .collation-attribute {
	margin-top: .12rem !important;
}

body .activity-detail-section .detail-attributes .attribute-value,
body .activity-detail-section .suitable-attributes .attribute-value,
body .activity-detail-section .detail-attributes .attribute-value.day,
body .activity-detail-section .detail-attributes .attribute-value.monday,
body .activity-detail-section .detail-attributes .attribute-value.tuesday,
body .activity-detail-section .detail-attributes .attribute-value.wednesday,
body .activity-detail-section .detail-attributes .attribute-value.thursday,
body .activity-detail-section .detail-attributes .attribute-value.friday,
body .activity-detail-section .detail-attributes .attribute-value.saturday,
body .activity-detail-section .detail-attributes .attribute-value.sunday {
	position: static !important;
	inset: auto !important;

	display: block !important;

	width: 100% !important;
	max-width: 100% !important;
	min-width: 0 !important;

	margin: 0 !important;
	padding: 0 !important;

	background: transparent !important;
	border: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;

	color: var(--ww-color-black) !important;

	font-size: 1rem !important;
	font-weight: 850 !important;
	line-height: 1.28 !important;
	text-align: left !important;
	white-space: normal !important;
	word-break: normal !important;
	overflow-wrap: normal !important;

	float: none !important;
	clear: both !important;

	transform: none !important;
}

body .activity-detail-section .detail-attributes .collation-attribute-group.day .attribute-value,
body .activity-detail-section .detail-attributes .collation-attribute-group.time .attribute-value,
body .activity-detail-section .suitable-attributes .collation-attribute-group.location .attribute-value {
	white-space: nowrap !important;
}

body .activity-detail-section .suitable-attributes .collation-attribute-group.suitablefor .attribute-value {
	max-width: 980px !important;
}

/* ==========================================
   DETAIL ACTIONS + SIDE COLUMN
========================================== */

body .activity-detail-section .action-buttons {
	display: flex;
	flex-wrap: wrap;
	gap: .75rem;

	margin-top: clamp(2rem, 4vw, 3rem) !important;
	padding-top: 0 !important;
}

body .activity-detail-section .action-buttons .textblock,
body .activity-detail-section .action-buttons p {
	margin: 0 !important;
	padding: 0 !important;
}

body .activity-detail-section .button.back {
	background: var(--ww-color-black);
	color: var(--ww-color-orange);
	border-color: var(--ww-color-black);
}

body .activity-detail-section .button.back:hover,
body .activity-detail-section .button.back:focus {
	background: var(--ww-color-orange);
	color: var(--ww-color-black);
	border-color: var(--ww-color-orange);
}

body .activity-detail-section .page-section-side-column {
	position: sticky;
	top: calc(var(--ww-header-height-desktop) + 2rem);
}

body .activity-detail-section .page-section-side-column .frame-box {
	position: relative;
	isolation: isolate;

	margin: 0 !important;
	padding: clamp(1.5rem, 3vw, 2rem) !important;

	background:
		radial-gradient(circle at 88% 12%, rgba(255,255,255,.16), transparent 34%),
		var(--ww-color-black);

	color: var(--ww-color-white);

	border: 1px solid rgba(217,147,14,.35);
	border-radius: var(--ww-radius-l);

	box-shadow:
		0 18px 54px rgba(0,0,0,.18),
		inset 0 1px 0 rgba(255,255,255,.1);

	overflow: hidden;
}

body .activity-detail-section .page-section-side-column .frame-box::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;

	width: 100%;
	height: 7px;

	background: var(--ww-color-orange);

	pointer-events: none;
}

body .activity-detail-section .page-section-side-column .frame-box h2 {
	margin: 0 0 .75rem !important;

	color: var(--ww-color-white);

	font-size: clamp(1.65rem, 2.8vw, 2.35rem);
	font-weight: 900;
	line-height: 1.05;
	letter-spacing: -0.04em;
}

body .activity-detail-section .page-section-side-column .frame-box p {
	margin: 0 0 1rem !important;

	color: rgba(255,255,255,.86);

	font-size: 1rem;
	line-height: 1.55;
}

body .activity-detail-section .page-section-side-column .frame-box p:last-child {
	margin-bottom: 0 !important;
}

body .activity-detail-section .page-section-side-column .button.book,
body .activity-detail-section .page-section-side-column .button.book:visited {
	width: 100%;
	justify-content: center;

	background: var(--ww-color-orange);
	color: var(--ww-color-black);
	border-color: var(--ww-color-orange);
}

body .activity-detail-section .page-section-side-column .button.book:hover,
body .activity-detail-section .page-section-side-column .button.book:focus {
	background: var(--ww-color-white);
	color: var(--ww-color-black);
	border-color: var(--ww-color-white);
}

/* ==========================================
   TABLET
========================================== */

@media (min-width: 768px) and (max-width: 1200px) {

	body .activity-card.card-output {
		grid-template-columns: minmax(240px, 34%) minmax(0, 1fr) !important;
	}

	body .activity-card .card-image-container {
		min-height: 300px;
	}

	body .activity-card .card-content-container {
		grid-template-columns: 1fr;
		grid-template-areas:
			"title"
			"abstract"
			"details"
			"suitable"
			"button";
		gap: 1rem;

		padding: clamp(1.35rem, 3vw, 2rem) !important;
	}

	body .activity-card .text-link {
		justify-self: start;
	}

	body .activity-card .details-mini,
	body .activity-detail-section .detail-attributes > .content {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	}

	body .activity-card .suitable-mini {
		grid-template-columns: minmax(190px, .4fr) minmax(0, 1fr);
	}

	body .activity-detail-section .suitable-attributes {
		grid-template-columns: 1fr !important;
	}

	body .activity-detail-section > .i {
		grid-template-columns: minmax(0, 1fr) minmax(280px, 330px);
		gap: 2rem;
	}

	body .activity-detail-section .categories.frame-box .category-display,
	body .activity-detail-section .categories.frame-box .category-result {
		grid-template-columns: 110px minmax(0, 1fr) !important;
	}

	body .activity-detail-section .categories.frame-box .image {
		width: 110px !important;
		height: 110px !important;
	}

}

/* ==========================================
   MOBILE
========================================== */

@media (max-width: 767px) {

	body .layout-component.items.ww-grid > .collation-items-list,
	body .activity-results > .collation-items-list {
		gap: 1.25rem !important;
	}

	body .activity-card.card-output {
		grid-template-columns: 1fr !important;

		border-radius: var(--ww-radius-m);
	}

	body .activity-card .card-image-container {
		min-height: 230px;
		aspect-ratio: 16 / 10;
	}

	body .activity-card .card-image-container::after {
		background: linear-gradient(0deg, rgba(0,0,0,.22), transparent 56%);
	}

	body .activity-card .card-content-container {
		grid-template-columns: 1fr;
		grid-template-areas:
			"title"
			"abstract"
			"details"
			"suitable"
			"button";
		gap: 1rem;

		padding: 1.2rem !important;
	}

	body .activity-card .title h3 {
		font-size: clamp(1.45rem, 8vw, 2.1rem);
	}

	body .activity-card .abstract {
		-webkit-line-clamp: 5;

		font-size: .98rem;
	}

	body .activity-card .details-mini,
	body .activity-card .suitable-mini,
	body .activity-detail-section .detail-attributes > .content,
	body .activity-detail-section .suitable-attributes {
		grid-template-columns: 1fr !important;
		gap: .65rem !important;
	}

	body .activity-card .details-mini .collation-attribute-group,
	body .activity-card .suitable-mini .collation-attribute-group,
	body .activity-detail-section .detail-attributes .collation-attribute-group,
	body .activity-detail-section .suitable-attributes .collation-attribute-group {
		--activity-attr-icon-size: 38px;
		--activity-attr-icon-img-size: 20px;
		--activity-attr-gap-x: .65rem;
		--activity-attr-pad: .75rem;

		grid-column: auto !important;

		border-radius: var(--ww-radius-s);
	}

	body .activity-card .text-link {
		justify-self: stretch;
	}

	body .activity-card .text-link .button {
		width: 100%;
		min-height: 50px;
	}

	body .activity-detail-section > .i {
		grid-template-columns: 1fr;
		gap: 2rem;
	}

	body .activity-page > .i > .layout-cell > .title h1,
	body .activity-detail-section .page-section-content > .title h1 {
		font-size: clamp(2.2rem, 13vw, 3.6rem);
	}

	body .activity-detail-section .page-section-content .icon {
		border-radius: var(--ww-radius-m);
	}

	body .activity-detail-section .page-section-content .icon img {
		height: 280px !important;
	}

	body .activity-detail-section .categories.frame-box {
		border-radius: var(--ww-radius-m);
	}

	body .activity-detail-section .categories.frame-box .category-display,
	body .activity-detail-section .categories.frame-box .category-result {
		grid-template-columns: 1fr !important;
		gap: 1rem !important;
	}

	body .activity-detail-section .categories.frame-box .category-display > .layout-cell:first-child,
	body .activity-detail-section .categories.frame-box .category-display > .layout-cell:last-child,
	body .activity-detail-section .categories.frame-box .category-result > .layout-cell:first-child,
	body .activity-detail-section .categories.frame-box .category-result > .layout-cell:last-child {
		grid-column: 1 !important;
	}

	body .activity-detail-section .categories.frame-box .image {
		width: 100% !important;
		height: auto !important;
		aspect-ratio: 16 / 9 !important;
	}

	body .activity-detail-section .action-buttons,
	body .activity-detail-section .action-buttons .textblock,
	body .activity-detail-section .action-buttons p,
	body .activity-detail-section .action-buttons .button {
		width: 100%;
	}

	body .activity-detail-section .page-section-side-column {
		position: static;
	}

	body .activity-detail-section .page-section-side-column .frame-box {
		border-radius: var(--ww-radius-m);
	}

}

/* ==========================================
   REDUCED MOTION
========================================== */

@media (prefers-reduced-motion: reduce) {

	body .activity-card.card-output,
	body .activity-card.card-output::after,
	body .activity-card .card-image-container img {
		transition: none !important;
	}

	body .activity-card.card-output:hover,
	body .activity-card.card-output:focus-within,
	body .activity-card.card-output:hover::after,
	body .activity-card.card-output:focus-within::after,
	body .activity-card:hover .card-image-container img,
	body .activity-card:focus-within .card-image-container img {
		transform: none !important;
	}

}


/* ==========================================
   FINAL INDEX CARD SPACING FIX
   Restores breathing room inside activity listing cards
========================================== */

body .activity-card.card-output > .card-content-container,
body .activity-card .card-content-container {
	padding:
		clamp(1.4rem, 2.8vw, 2.4rem)
		clamp(1.35rem, 3vw, 2.6rem)
		clamp(1.35rem, 2.8vw, 2.2rem) !important;

	gap: clamp(0.85rem, 1.6vw, 1.25rem) clamp(1rem, 2vw, 1.5rem) !important;
}

/* Keep title away from the orange top rule */

body .activity-card .title {
	margin: 0 !important;
	padding: 0 !important;
}

body .activity-card .title h3 {
	margin: 0 !important;
	padding: 0 !important;
}

/* Give abstract a little room before the attributes */

body .activity-card .abstract {
	margin: 0 !important;
	padding: 0 !important;
}

body .activity-card .abstract p {
	margin: 0 0 0.5rem !important;
}

body .activity-card .abstract p:last-child {
	margin-bottom: 0 !important;
}

/* Add a touch of internal spacing around the attribute area */

body .activity-card .details-mini,
body .activity-card .suitable-mini {
	margin-top: 0.15rem !important;
}

/* Slightly improve the button position */

body .activity-card .text-link {
	margin-top: 0 !important;
	padding: 0 !important;
}

/* ==========================================
   TABLET INDEX CARD SPACING
========================================== */

@media (min-width: 768px) and (max-width: 1200px) {

	body .activity-card.card-output > .card-content-container,
	body .activity-card .card-content-container {
		padding: clamp(1.25rem, 2.7vw, 2rem) !important;
	}

}

/* ==========================================
   MOBILE INDEX CARD SPACING
========================================== */

@media (max-width: 767px) {

	body .activity-card.card-output > .card-content-container,
	body .activity-card .card-content-container {
		padding: 1.15rem !important;
		gap: 0.9rem !important;
	}

}




/* ==========================================
   CURRENT CATEGORY HERO FIX
   Makes nested current-category wrapper span full width
========================================== */

body .mod_collation_component_current_category.page-section-media-overlap.ww-grid > .layout-cell.i {
	grid-column: 1 / -1 !important;

	width: 100%;
	min-width: 0;
}

/* Turn the inner wrapper into the actual two-column layout */

body .mod_collation_component_current_category.page-section-media-overlap > .layout-cell.i {
	display: grid !important;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	align-items: center;
	gap: clamp(2rem, 5vw, 5rem);
}


@media (max-width: 767px) {

	body .mod_collation_component_current_category.page-section-media-overlap > .layout-cell.i {
		grid-template-columns: 1fr;
		gap: clamp(1.5rem, 6vw, 2.5rem);
	}

}


/* ==========================================
   ACTIVITY DETAIL SIDE COLUMN CATEGORY LINKS
   Reworked for moved activity categories
   Requires helper JS below for:
   - primary location detection
   - ordering primary category first
   - hiding repeated Activity Location headings
========================================== */

body .activity-detail-section .page-section-side-column .activity-links {
	position: relative;
	isolation: isolate;

	width: 100%;
	min-width: 0;

	margin: clamp(1rem, 2vw, 1.35rem) 0 0 !important;
	padding: clamp(1rem, 2vw, 1.25rem) !important;

	background:
		radial-gradient(circle at 92% 10%, rgba(217,147,14,.15), transparent 34%),
		linear-gradient(180deg, rgba(255,255,255,1), rgba(255,250,241,1));

	border: 1px solid rgba(217,147,14,.24);
	border-radius: var(--ww-radius-l);

	box-shadow:
		0 18px 54px rgba(0,0,0,.1),
		inset 0 1px 0 rgba(255,255,255,.92);

	overflow: hidden;
}

body .activity-detail-section .page-section-side-column .activity-links::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	z-index: 2;

	width: 100%;
	height: 7px;

	background:
		linear-gradient(
			90deg,
			var(--ww-color-orange),
			rgba(217,147,14,.44),
			var(--ww-color-orange)
		);

	pointer-events: none;
}

body .activity-detail-section .page-section-side-column .activity-links::after {
	content: "";
	position: absolute;
	right: -76px;
	top: -76px;
	z-index: 0;

	width: 170px;
	height: 170px;

	background: rgba(217,147,14,.1);
	border-radius: 999px;

	pointer-events: none;
}

body .activity-detail-section .page-section-side-column .activity-links > .layout,
body .activity-detail-section .page-section-side-column .activity-links .mod_collation_collation_item_component_categories {
	position: relative;
	z-index: 1;

	display: grid !important;
	grid-template-columns: 1fr !important;
	gap: .85rem !important;

	width: 100%;
	min-width: 0;

	margin: 0 !important;
	padding: 0 !important;
}

/* Each category entry */

body .activity-detail-section .page-section-side-column .activity-links .mod_collation_collation_item_component_categories > .layout-cell {
	position: relative;
	isolation: isolate;

	display: block !important;

	width: 100%;
	min-width: 0;

	margin: 0 !important;
	padding: 0 !important;

	background:
		linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.9));

	border: 1px solid rgba(217,147,14,.18);
	border-radius: var(--ww-radius-m);

	box-shadow:
		0 10px 28px rgba(0,0,0,.075),
		inset 0 1px 0 rgba(255,255,255,.92);

	overflow: hidden;

	transition:
		transform var(--ww-transition-fast),
		box-shadow var(--ww-transition-fast),
		border-color var(--ww-transition-fast);
}

body .activity-detail-section .page-section-side-column .activity-links .mod_collation_collation_item_component_categories > .layout-cell:hover,
body .activity-detail-section .page-section-side-column .activity-links .mod_collation_collation_item_component_categories > .layout-cell:focus-within {
	transform: translateY(-3px);

	border-color: rgba(217,147,14,.42);

	box-shadow:
		0 16px 40px rgba(0,0,0,.11),
		0 0 22px rgba(217,147,14,.08),
		inset 0 1px 0 rgba(255,255,255,.95);
}

/* Hide repeated Activity Location headings by default.
   JS adds .activity-link-primary to the real location card. */

body .activity-detail-section .page-section-side-column .activity-links .mod_collation_collation_item_component_categories > .layout-cell > label {
	display: none !important;
}

body .activity-detail-section .page-section-side-column .activity-links .mod_collation_collation_item_component_categories > .layout-cell.activity-link-primary > label {
	display: inline-flex !important;
	align-items: center;
	justify-content: center;

	margin: 0 0 .8rem !important;
	padding: .48rem .8rem !important;

	background: var(--ww-color-orange);
	color: var(--ww-color-black) !important;

	border-radius: 0 0 999px 999px;

	box-shadow:
		0 10px 24px rgba(0,0,0,.14),
		0 0 20px rgba(217,147,14,.16);

	font-size: .74rem;
	font-weight: 950;
	line-height: 1;
	letter-spacing: .075em;
	text-transform: uppercase;
}

/* Entry inner layout */

body .activity-detail-section .page-section-side-column .activity-links .mod_collation_collation_item_component_categories > .layout-cell > .i {
	display: grid !important;
	grid-template-columns: 76px minmax(0, 1fr) !important;
	align-items: center !important;
	gap: .85rem !important;

	width: 100%;
	min-width: 0;

	margin: 0 !important;
	padding: .75rem !important;
}

body .activity-detail-section .page-section-side-column .activity-links .mod_collation_collation_item_component_categories > .layout-cell.activity-link-primary > .i {
	grid-template-columns: 96px minmax(0, 1fr) !important;

	padding:
		0 clamp(.9rem, 1.8vw, 1.1rem)
		clamp(.95rem, 1.8vw, 1.1rem) !important;
}

/* Image column */

body .activity-detail-section .page-section-side-column .activity-links .as-cat-image,
body .activity-detail-section .page-section-side-column .activity-links .as-cat-image .image {
	width: 100% !important;
	min-width: 0 !important;

	margin: 0 !important;
	padding: 0 !important;
}

body .activity-detail-section .page-section-side-column .activity-links .as-cat-image .image {
	position: relative;

	aspect-ratio: 1 / 1;

	background: rgba(217,147,14,.08);
	border: 1px solid rgba(217,147,14,.2);
	border-radius: var(--ww-radius-s);

	overflow: hidden;
}

body .activity-detail-section .page-section-side-column .activity-links .activity-link-primary .as-cat-image .image {
	border-radius: var(--ww-radius-m);
}

body .activity-detail-section .page-section-side-column .activity-links .as-cat-image img {
	display: block !important;

	width: 100% !important;
	height: 100% !important;
	max-width: none !important;

	margin: 0 !important;
	padding: 0 !important;

	object-fit: cover;
	object-position: center;

	transform: scale(1);

	transition:
		transform .45s ease,
		filter .45s ease;
}

body .activity-detail-section .page-section-side-column .activity-links .mod_collation_collation_item_component_categories > .layout-cell:hover .as-cat-image img,
body .activity-detail-section .page-section-side-column .activity-links .mod_collation_collation_item_component_categories > .layout-cell:focus-within .as-cat-image img {
	transform: scale(1.045);

	filter:
		saturate(1.04)
		contrast(1.02);
}

/* Detail column */

body .activity-detail-section .page-section-side-column .activity-links .as-cat-detail {
	position: relative;

	display: block !important;

	width: 100% !important;
	min-width: 0 !important;

	margin: 0 !important;
	padding: 0 !important;
}

body .activity-detail-section .page-section-side-column .activity-links .as-cat-detail > .layout-component {
	position: relative;
	z-index: 2;

	margin: 0 !important;
	padding: 0 !important;
}

body .activity-detail-section .page-section-side-column .activity-links .as-cat-detail .title {
	margin: 0 !important;
	padding: 0 !important;

	color: var(--ww-color-black) !important;

	font-size: .98rem !important;
	font-weight: 950 !important;
	line-height: 1.12 !important;
	letter-spacing: -.025em !important;
}

body .activity-detail-section .page-section-side-column .activity-links .activity-link-primary .as-cat-detail .title {
	font-size: clamp(1.12rem, 1.6vw, 1.28rem) !important;
	letter-spacing: -.04em !important;
}

/* Address / Email fields */

body .activity-detail-section .page-section-side-column .activity-links .description,
body .activity-detail-section .page-section-side-column .activity-links .custom-field {
	margin-top: .55rem !important;

	color: var(--ww-color-black) !important;

	font-size: .88rem !important;
	font-weight: 760 !important;
	line-height: 1.35 !important;
}

body .activity-detail-section .page-section-side-column .activity-links .description.empty,
body .activity-detail-section .page-section-side-column .activity-links .custom-field.empty,
body .activity-detail-section .page-section-side-column .activity-links .description.is-empty,
body .activity-detail-section .page-section-side-column .activity-links .custom-field.is-empty {
	display: none !important;
}

body .activity-detail-section .page-section-side-column .activity-links .description > label,
body .activity-detail-section .page-section-side-column .activity-links .custom-field > label {
	display: block !important;

	margin: 0 0 .22rem !important;
	padding: 0 !important;

	color: rgba(0,0,0,.56) !important;

	font-size: .69rem !important;
	font-weight: 950 !important;
	line-height: 1 !important;
	letter-spacing: .075em !important;
	text-transform: uppercase !important;
}

body .activity-detail-section .page-section-side-column .activity-links .description p {
	margin: 0 !important;
	padding: 0 !important;
}

body .activity-detail-section .page-section-side-column .activity-links .custom-field a {
	position: relative;
	z-index: 10;

	color: var(--ww-color-black) !important;
	text-decoration-color: rgba(217,147,14,.5);
	text-underline-offset: 3px;
}

/* Secondary cards should only show their title/image.
   JS marks empty meta fields, CSS hides them. */

body .activity-detail-section .page-section-side-column .activity-links .activity-link-secondary .description,
body .activity-detail-section .page-section-side-column .activity-links .activity-link-secondary .custom-field {
	display: none !important;
}

/* Primary card prominence */

body .activity-detail-section .page-section-side-column .activity-links .activity-link-primary {
	background:
		radial-gradient(circle at 92% 12%, rgba(217,147,14,.15), transparent 34%),
		linear-gradient(180deg, rgba(255,255,255,1), rgba(255,250,241,1));

	border-color: rgba(217,147,14,.34);

	box-shadow:
		0 16px 42px rgba(0,0,0,.11),
		0 0 0 1px rgba(217,147,14,.08),
		inset 0 1px 0 rgba(255,255,255,.96);
}

body .activity-detail-section .page-section-side-column .activity-links .activity-link-primary::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	z-index: 1;

	width: 100%;
	height: 6px;

	background:
		linear-gradient(
			90deg,
			var(--ww-color-orange),
			rgba(217,147,14,.42),
			var(--ww-color-orange)
		);

	pointer-events: none;
}

body .activity-detail-section .page-section-side-column .activity-links .activity-link-primary::after {
	content: "";
	position: absolute;
	right: -44px;
	bottom: -44px;
	z-index: 0;

	width: 118px;
	height: 118px;

	background: rgba(217,147,14,.1);
	border-radius: 999px;

	pointer-events: none;
}

/* Secondary archive/list cards */

body .activity-detail-section .page-section-side-column .activity-links .activity-link-secondary > .i {
	grid-template-columns: 58px minmax(0, 1fr) !important;
	gap: .7rem !important;
	padding: .65rem !important;
}

body .activity-detail-section .page-section-side-column .activity-links .activity-link-secondary .as-cat-detail .title {
	font-size: .9rem !important;
	line-height: 1.15 !important;
}

/* Full card link */

body .activity-detail-section .page-section-side-column .activity-links .category-link.wrap.inflate {
	position: absolute !important;
	inset: 0 !important;
	z-index: 8 !important;

	display: block !important;

	width: 100% !important;
	height: 100% !important;

	margin: 0 !important;
	padding: 0 !important;

	background: transparent !important;
	color: transparent !important;

	border: 0 !important;
	box-shadow: none !important;

	font-size: 0 !important;
	line-height: 0 !important;
	text-indent: -9999px !important;
	text-decoration: none !important;

	cursor: pointer;
}

/* Visual arrow */

body .activity-detail-section .page-section-side-column .activity-links .as-cat-detail::after {
	content: "";

	position: absolute;
	right: 0;
	top: 50%;
	z-index: 3;

	width: .55rem;
	height: .55rem;

	border-right: 3px solid var(--ww-color-orange);
	border-bottom: 3px solid var(--ww-color-orange);

	opacity: .65;

	transform: translateY(-50%) rotate(-45deg);

	transition:
		transform var(--ww-transition-fast),
		opacity var(--ww-transition-fast),
		border-color var(--ww-transition-fast);
}

body .activity-detail-section .page-section-side-column .activity-links .mod_collation_collation_item_component_categories > .layout-cell:hover .as-cat-detail::after,
body .activity-detail-section .page-section-side-column .activity-links .mod_collation_collation_item_component_categories > .layout-cell:focus-within .as-cat-detail::after {
	opacity: 1;

	border-color: var(--ww-color-black);

	transform: translate(3px, -50%) rotate(-45deg);
}

/* Give text space so arrow never sits on title */

body .activity-detail-section .page-section-side-column .activity-links .as-cat-detail .title,
body .activity-detail-section .page-section-side-column .activity-links .as-cat-detail .description,
body .activity-detail-section .page-section-side-column .activity-links .as-cat-detail .custom-field {
	padding-right: 1rem !important;
}

/* Keyboard focus */

body .activity-detail-section .page-section-side-column .activity-links .mod_collation_collation_item_component_categories > .layout-cell:focus-within {
	outline: 3px solid rgba(217,147,14,.36);
	outline-offset: 3px;
}

/* ==========================================
   SIDE COLUMN ACTIVITY LINKS RESPONSIVE
========================================== */

@media (min-width: 768px) and (max-width: 1200px) {

	body .activity-detail-section .page-section-side-column .activity-links .mod_collation_collation_item_component_categories > .layout-cell > .i,
	body .activity-detail-section .page-section-side-column .activity-links .mod_collation_collation_item_component_categories > .layout-cell.activity-link-primary > .i {
		grid-template-columns: 72px minmax(0, 1fr) !important;
	}

	body .activity-detail-section .page-section-side-column .activity-links .activity-link-secondary > .i {
		grid-template-columns: 54px minmax(0, 1fr) !important;
	}

}

@media (max-width: 767px) {

	body .activity-detail-section .page-section-side-column .activity-links {
		border-radius: var(--ww-radius-m);
	}

	body .activity-detail-section .page-section-side-column .activity-links .mod_collation_collation_item_component_categories > .layout-cell,
	body .activity-detail-section .page-section-side-column .activity-links .activity-link-primary {
		border-radius: var(--ww-radius-m);
	}

	body .activity-detail-section .page-section-side-column .activity-links .mod_collation_collation_item_component_categories > .layout-cell > .i,
	body .activity-detail-section .page-section-side-column .activity-links .mod_collation_collation_item_component_categories > .layout-cell.activity-link-primary > .i {
		grid-template-columns: 76px minmax(0, 1fr) !important;
		padding: .75rem !important;
	}

	body .activity-detail-section .page-section-side-column .activity-links .activity-link-primary > label {
		margin-left: .75rem !important;
	}

}

/* ==========================================
   ACTIVITY LINKS JS SAFETY STATES
========================================== */

body .activity-detail-section .page-section-side-column .activity-links.activity-links-ready .activity-link-secondary > label {
	display: none !important;
}

body .activity-detail-section .page-section-side-column .activity-links.activity-links-ready .activity-link-primary:first-child {
	margin-top: 0 !important;
}


/* ==========================================
   ACTIVITY DETAIL PRIMARY LOCATION REWORK
   Updates:
   - Primary Activity Location card uses large image on top
   - More breathing room between title, address and email
   - Deeper Activity Location label so text is not clipped
   - Secondary category cards remain compact
========================================== */

/* Primary card label: deeper tab */

body .activity-detail-section .page-section-side-column .activity-links .mod_collation_collation_item_component_categories > .layout-cell.activity-link-primary > label {
	position: relative;
	z-index: 4;

	display: inline-flex !important;
	align-items: center;
	justify-content: center;

	margin: 0 0 clamp(.95rem, 1.6vw, 1.15rem) clamp(.95rem, 1.8vw, 1.15rem) !important;
	padding: .72rem 1rem .62rem !important;

	background: var(--ww-color-orange);
	color: var(--ww-color-black) !important;

	border-radius: 0 0 999px 999px;

	box-shadow:
		0 12px 28px rgba(0,0,0,.16),
		0 0 22px rgba(217,147,14,.18);

	font-size: .75rem;
	font-weight: 950;
	line-height: 1.05;
	letter-spacing: .075em;
	text-transform: uppercase;

	transform: none !important;
}

/* Primary card becomes a feature-style stacked layout */

body .activity-detail-section .page-section-side-column .activity-links .mod_collation_collation_item_component_categories > .layout-cell.activity-link-primary > .i {
	display: grid !important;
	grid-template-columns: 1fr !important;
	align-items: stretch !important;
	gap: clamp(.9rem, 1.8vw, 1.15rem) !important;

	width: 100%;
	min-width: 0;

	margin: 0 !important;
	padding:
		0
		clamp(.95rem, 1.8vw, 1.15rem)
		clamp(1rem, 1.9vw, 1.25rem) !important;
}

/* Primary image sits large on top */

body .activity-detail-section .page-section-side-column .activity-links .activity-link-primary .as-cat-image {
	width: 100% !important;
	min-width: 0 !important;

	margin: 0 !important;
	padding: 0 !important;
}

body .activity-detail-section .page-section-side-column .activity-links .activity-link-primary .as-cat-image .image {
	width: 100% !important;
	height: auto !important;

	aspect-ratio: 16 / 10 !important;

	margin: 0 !important;
	padding: 0 !important;

	background:
		radial-gradient(circle at 85% 12%, rgba(217,147,14,.12), transparent 34%),
		rgba(217,147,14,.08);

	border: 1px solid rgba(217,147,14,.24);
	border-radius: var(--ww-radius-m);

	box-shadow:
		0 12px 28px rgba(0,0,0,.1),
		inset 0 1px 0 rgba(255,255,255,.78);

	overflow: hidden;
}

body .activity-detail-section .page-section-side-column .activity-links .activity-link-primary .as-cat-image img {
	display: block !important;

	width: 100% !important;
	height: 100% !important;
	max-width: none !important;

	margin: 0 !important;
	padding: 0 !important;

	object-fit: cover;
	object-position: center;
}

/* Primary detail area breathes beneath image */

body .activity-detail-section .page-section-side-column .activity-links .activity-link-primary .as-cat-detail {
	display: grid !important;
	grid-template-columns: 1fr;
	gap: clamp(.65rem, 1.4vw, .85rem) !important;

	width: 100% !important;
	min-width: 0 !important;

	margin: 0 !important;
	padding: 0 .1rem !important;
}

body .activity-detail-section .page-section-side-column .activity-links .activity-link-primary .as-cat-detail > .layout-component {
	margin: 0 !important;
	padding: 0 !important;
}

body .activity-detail-section .page-section-side-column .activity-links .activity-link-primary .as-cat-detail .title {
	margin: 0 !important;
	padding: 0 1.25rem 0 0 !important;

	color: var(--ww-color-black) !important;

	font-size: clamp(1.22rem, 1.8vw, 1.42rem) !important;
	font-weight: 950 !important;
	line-height: 1.06 !important;
	letter-spacing: -.045em !important;
	text-wrap: balance;
}

/* Address and email as tidy mini rows */

body .activity-detail-section .page-section-side-column .activity-links .activity-link-primary .description,
body .activity-detail-section .page-section-side-column .activity-links .activity-link-primary .custom-field {
	position: relative;
	z-index: 2;

	display: block !important;

	margin: 0 !important;
	padding:
		clamp(.65rem, 1.2vw, .78rem)
		clamp(.7rem, 1.3vw, .85rem) !important;

	color: var(--ww-color-black) !important;

	font-size: .9rem !important;
	font-weight: 760 !important;
	line-height: 1.42 !important;

}

body .activity-detail-section .page-section-side-column .activity-links .activity-link-primary .description > label,
body .activity-detail-section .page-section-side-column .activity-links .activity-link-primary .custom-field > label {
	display: block !important;

	margin: 0 0 .32rem !important;
	padding: 0 !important;

	color: rgba(0,0,0,.56) !important;

	font-size: .69rem !important;
	font-weight: 950 !important;
	line-height: 1 !important;
	letter-spacing: .085em !important;
	text-transform: uppercase !important;
}

body .activity-detail-section .page-section-side-column .activity-links .activity-link-primary .description .content,
body .activity-detail-section .page-section-side-column .activity-links .activity-link-primary .custom-field .content {
	margin: 0 !important;
	padding: 0 !important;

	color: var(--ww-color-black) !important;

	font-size: .92rem !important;
	font-weight: 780 !important;
	line-height: 1.42 !important;
}

body .activity-detail-section .page-section-side-column .activity-links .activity-link-primary .description p {
	margin: 0 !important;
	padding: 0 !important;
}

body .activity-detail-section .page-section-side-column .activity-links .activity-link-primary .custom-field a {
	position: relative;
	z-index: 12;

	color: var(--ww-color-black) !important;

	font-weight: 850 !important;
	text-decoration-color: rgba(217,147,14,.65);
	text-decoration-thickness: 2px;
	text-underline-offset: 3px;
}

body .activity-detail-section .page-section-side-column .activity-links .activity-link-primary .custom-field a:hover,
body .activity-detail-section .page-section-side-column .activity-links .activity-link-primary .custom-field a:focus {
	color: var(--ww-color-orange) !important;
}

/* Keep empty fields hidden even when the primary-card display rules above are active */

body .activity-detail-section .page-section-side-column .activity-links .activity-link-primary .description.empty,
body .activity-detail-section .page-section-side-column .activity-links .activity-link-primary .custom-field.empty,
body .activity-detail-section .page-section-side-column .activity-links .activity-link-primary .description.is-empty,
body .activity-detail-section .page-section-side-column .activity-links .activity-link-primary .custom-field.is-empty {
	display: none !important;
}

/* Move primary arrow to sit neatly with the title block, not over the meta rows */

body .activity-detail-section .page-section-side-column .activity-links .activity-link-primary .as-cat-detail::after {
	top: .28rem;
	right: .15rem;

	transform: rotate(-45deg);
}

body .activity-detail-section .page-section-side-column .activity-links .activity-link-primary:hover .as-cat-detail::after,
body .activity-detail-section .page-section-side-column .activity-links .activity-link-primary:focus-within .as-cat-detail::after {
	transform: translateX(3px) rotate(-45deg);
}

/* Secondary cards stay compact */

body .activity-detail-section .page-section-side-column .activity-links .activity-link-secondary > .i {
	grid-template-columns: 58px minmax(0, 1fr) !important;
	gap: .7rem !important;
	padding: .65rem !important;
}

body .activity-detail-section .page-section-side-column .activity-links .activity-link-secondary .as-cat-image .image {
	aspect-ratio: 1 / 1 !important;
}

body .activity-detail-section .page-section-side-column .activity-links .activity-link-secondary .description,
body .activity-detail-section .page-section-side-column .activity-links .activity-link-secondary .custom-field {
	display: none !important;
}

/* Tablet: keep the primary card stacked, but reduce image height a touch */

@media (min-width: 768px) and (max-width: 1200px) {

	body .activity-detail-section .page-section-side-column .activity-links .mod_collation_collation_item_component_categories > .layout-cell.activity-link-primary > .i {
		grid-template-columns: 1fr !important;
		gap: .9rem !important;
	}

	body .activity-detail-section .page-section-side-column .activity-links .activity-link-primary .as-cat-image .image {
		aspect-ratio: 16 / 9 !important;
	}

	body .activity-detail-section .page-section-side-column .activity-links .activity-link-secondary > .i {
		grid-template-columns: 54px minmax(0, 1fr) !important;
	}

}

/* Mobile: primary card keeps feature image, secondary cards remain compact */

@media (max-width: 767px) {

	body .activity-detail-section .page-section-side-column .activity-links .mod_collation_collation_item_component_categories > .layout-cell.activity-link-primary > label {
		margin-left: .85rem !important;
		padding: .7rem .95rem .6rem !important;
	}

	body .activity-detail-section .page-section-side-column .activity-links .mod_collation_collation_item_component_categories > .layout-cell.activity-link-primary > .i {
		grid-template-columns: 1fr !important;
		gap: .85rem !important;
		padding:
			0
			.85rem
			.95rem !important;
	}

	body .activity-detail-section .page-section-side-column .activity-links .activity-link-primary .as-cat-image .image {
		aspect-ratio: 16 / 9 !important;
	}

	body .activity-detail-section .page-section-side-column .activity-links .activity-link-primary .as-cat-detail .title {
		font-size: clamp(1.18rem, 6vw, 1.45rem) !important;
	}

	body .activity-detail-section .page-section-side-column .activity-links .activity-link-secondary > .i {
		grid-template-columns: 58px minmax(0, 1fr) !important;
		padding: .65rem !important;
	}

}


/* ==========================================
   FINAL ACTIVITY LINKS FULL-CARD CLICK FIX
   Makes the whole activity link card clickable,
   including the image area.
========================================== */

/*
	The category link lives inside .as-cat-detail in the EOS output.
	By default, absolute positioning would only cover that detail column
	because .as-cat-detail is positioned.

	This override lets the hidden .category-link.inflate use the full
	.layout-cell card as its containing block instead.
*/

body .activity-detail-section .page-section-side-column .activity-links .mod_collation_collation_item_component_categories > .layout-cell {
	position: relative !important;
}

/* Let the inflate link escape the text column and cover the full card */

body .activity-detail-section .page-section-side-column .activity-links .as-cat-detail {
	position: static !important;
}

/* Full card click target */

body .activity-detail-section .page-section-side-column .activity-links .category-link.wrap.inflate {
	position: absolute !important;
	inset: 0 !important;
	z-index: 18 !important;

	display: block !important;

	width: 100% !important;
	height: 100% !important;

	margin: 0 !important;
	padding: 0 !important;

	background: transparent !important;
	color: transparent !important;

	border: 0 !important;
	box-shadow: none !important;

	font-size: 0 !important;
	line-height: 0 !important;
	text-indent: -9999px !important;
	text-decoration: none !important;

	cursor: pointer;
}

/*
	Keep the email address clickable as email, if present.
	This sits above the full-card link only for the email text itself.
*/

body .activity-detail-section .page-section-side-column .activity-links .custom-field {
	position: relative;
	z-index: 24;
}

body .activity-detail-section .page-section-side-column .activity-links .custom-field a {
	position: relative !important;
	z-index: 30 !important;
}

/* Keep content visually above decorative blobs, but below the click layer */

body .activity-detail-section .page-section-side-column .activity-links .as-cat-image,
body .activity-detail-section .page-section-side-column .activity-links .as-cat-detail > .layout-component,
body .activity-detail-section .page-section-side-column .activity-links .activity-link-primary > label {
	position: relative;
	z-index: 2;
}

/* Clickable-card cursor everywhere */

body .activity-detail-section .page-section-side-column .activity-links .mod_collation_collation_item_component_categories > .layout-cell,
body .activity-detail-section .page-section-side-column .activity-links .mod_collation_collation_item_component_categories > .layout-cell .as-cat-image,
body .activity-detail-section .page-section-side-column .activity-links .mod_collation_collation_item_component_categories > .layout-cell .as-cat-detail,
body .activity-detail-section .page-section-side-column .activity-links .mod_collation_collation_item_component_categories > .layout-cell img {
	cursor: pointer;
}

/* Replace the old text-column arrow with a card-level arrow */

body .activity-detail-section .page-section-side-column .activity-links .as-cat-detail::after {
	display: none !important;
}

body .activity-detail-section .page-section-side-column .activity-links .mod_collation_collation_item_component_categories > .layout-cell::after {
	content: "";

	position: absolute;
	right: clamp(.85rem, 1.6vw, 1rem);
	top: 50%;
	z-index: 22;

	width: .55rem;
	height: .55rem;

	border-right: 3px solid var(--ww-color-orange);
	border-bottom: 3px solid var(--ww-color-orange);

	opacity: .65;

	transform: translateY(-50%) rotate(-45deg);

	pointer-events: none;

	transition:
		transform var(--ww-transition-fast),
		opacity var(--ww-transition-fast),
		border-color var(--ww-transition-fast);
}

body .activity-detail-section .page-section-side-column .activity-links .mod_collation_collation_item_component_categories > .layout-cell:hover::after,
body .activity-detail-section .page-section-side-column .activity-links .mod_collation_collation_item_component_categories > .layout-cell:focus-within::after {
	opacity: 1;

	border-color: var(--ww-color-black);

	transform: translate(3px, -50%) rotate(-45deg);
}

/* Primary card arrow sits with the title/content block rather than the image */

body .activity-detail-section .page-section-side-column .activity-links .activity-link-primary::after {
	right: clamp(1.05rem, 1.9vw, 1.25rem);
	top: auto;
	bottom: clamp(1.45rem, 2.4vw, 1.75rem);

	transform: rotate(-45deg);
}

body .activity-detail-section .page-section-side-column .activity-links .activity-link-primary:hover::after,
body .activity-detail-section .page-section-side-column .activity-links .activity-link-primary:focus-within::after {
	transform: translateX(3px) rotate(-45deg);
}

/*
	The primary card already uses ::after as a soft decorative orb earlier.
	Because we now need the card-level arrow on ::after, move that orb to ::before
	is not possible without disturbing the top orange rule. So we keep the arrow here
	and rely on the parent panel's glow for decoration.
*/

/* Make sure the primary card's top orange rule still displays above the card link */

body .activity-detail-section .page-section-side-column .activity-links .activity-link-primary::before {
	z-index: 23 !important;
}

/* Focus state on the hidden card link */

body .activity-detail-section .page-section-side-column .activity-links .category-link.wrap.inflate:focus {
	outline: none !important;
}

body .activity-detail-section .page-section-side-column .activity-links .mod_collation_collation_item_component_categories > .layout-cell:focus-within {
	outline: 3px solid rgba(217,147,14,.36);
	outline-offset: 3px;
}

/* Mobile keeps the full-card click area */

@media (max-width: 767px) {

	body .activity-detail-section .page-section-side-column .activity-links .category-link.wrap.inflate {
		inset: 0 !important;
	}

	body .activity-detail-section .page-section-side-column .activity-links .activity-link-primary::after {
		right: 1rem;
		bottom: 1.25rem;
	}

}


/* ==========================================
   PRIMARY ACTIVITY LOCATION ARROW FINAL FINAL
   One arrow only, bottom-right of the primary card
========================================== */

/* Kill every old primary-card arrow attached to the text area */

body .activity-detail-section .page-section-side-column .activity-links .mod_collation_collation_item_component_categories > .layout-cell.activity-link-primary .as-cat-detail::after,
body .activity-detail-section .page-section-side-column .activity-links .mod_collation_collation_item_component_categories > .layout-cell.activity-link-primary:hover .as-cat-detail::after,
body .activity-detail-section .page-section-side-column .activity-links .mod_collation_collation_item_component_categories > .layout-cell.activity-link-primary:focus-within .as-cat-detail::after {
	content: none !important;
	display: none !important;
	width: 0 !important;
	height: 0 !important;
	border: 0 !important;
	opacity: 0 !important;
	visibility: hidden !important;
	transform: none !important;
}

/* Keep primary card and inner wrapper ready for positioning */

body .activity-detail-section .page-section-side-column .activity-links .mod_collation_collation_item_component_categories > .layout-cell.activity-link-primary {
	position: relative !important;
}

body .activity-detail-section .page-section-side-column .activity-links .mod_collation_collation_item_component_categories > .layout-cell.activity-link-primary > .i {
	position: relative !important;
}

/* Remove any accidental arrow previously added to the inner wrapper */

body .activity-detail-section .page-section-side-column .activity-links .mod_collation_collation_item_component_categories > .layout-cell.activity-link-primary > .i::after {
	content: none !important;
	display: none !important;
	width: 0 !important;
	height: 0 !important;
	border: 0 !important;
	opacity: 0 !important;
	visibility: hidden !important;
}

/* Add the single real arrow to the inner wrapper */

body .activity-detail-section .page-section-side-column .activity-links .mod_collation_collation_item_component_categories > .layout-cell.activity-link-primary > .i::before {
	content: "" !important;

	position: absolute !important;
	right: clamp(1.1rem, 2vw, 1.3rem) !important;
	bottom: clamp(1.05rem, 2vw, 1.25rem) !important;
	z-index: 30 !important;

	display: block !important;

	width: 0.68rem !important;
	height: 0.68rem !important;

	background: transparent !important;

	border-top: 0 !important;
	border-left: 0 !important;
	border-right: 3px solid var(--ww-color-orange) !important;
	border-bottom: 3px solid var(--ww-color-orange) !important;

	opacity: 0.85 !important;
	visibility: visible !important;

	transform: rotate(-45deg) !important;

	transition:
		transform var(--ww-transition-fast),
		opacity var(--ww-transition-fast),
		border-color var(--ww-transition-fast);

	pointer-events: none !important;
}

/* Hover movement for the new bottom-right arrow */

body .activity-detail-section .page-section-side-column .activity-links .mod_collation_collation_item_component_categories > .layout-cell.activity-link-primary:hover > .i::before,
body .activity-detail-section .page-section-side-column .activity-links .mod_collation_collation_item_component_categories > .layout-cell.activity-link-primary:focus-within > .i::before {
	opacity: 1 !important;

	border-color: var(--ww-color-black) !important;

	transform: translate(3px, -3px) rotate(-45deg) !important;
}

/* Give the content enough room so the arrow sits cleanly */

body .activity-detail-section .page-section-side-column .activity-links .mod_collation_collation_item_component_categories > .layout-cell.activity-link-primary .as-cat-detail {
	padding-bottom: clamp(1.85rem, 3vw, 2.25rem) !important;
}

/* ==========================================
   PRIMARY ACTIVITY LOCATION ARROW CONSOLIDATION
   Final state:
   - Primary card uses one bottom-right arrow on > .i::before
   - Primary card does NOT use the shared centre card arrow
   - Secondary cards keep the shared centre arrow
========================================== */

/* Remove the shared card-level centre arrow from the primary card only */

body .activity-detail-section .page-section-side-column .activity-links .mod_collation_collation_item_component_categories > .layout-cell.activity-link-primary::after,
body .activity-detail-section .page-section-side-column .activity-links .mod_collation_collation_item_component_categories > .layout-cell.activity-link-primary:hover::after,
body .activity-detail-section .page-section-side-column .activity-links .mod_collation_collation_item_component_categories > .layout-cell.activity-link-primary:focus-within::after {
	content: none !important;

	display: none !important;

	width: 0 !important;
	height: 0 !important;

	margin: 0 !important;
	padding: 0 !important;

	background: transparent !important;
	border: 0 !important;
	box-shadow: none !important;

	opacity: 0 !important;
	visibility: hidden !important;

	transform: none !important;

	pointer-events: none !important;
}

/* Remove the old text-column arrow from the primary card */

body .activity-detail-section .page-section-side-column .activity-links .mod_collation_collation_item_component_categories > .layout-cell.activity-link-primary .as-cat-detail::after,
body .activity-detail-section .page-section-side-column .activity-links .mod_collation_collation_item_component_categories > .layout-cell.activity-link-primary:hover .as-cat-detail::after,
body .activity-detail-section .page-section-side-column .activity-links .mod_collation_collation_item_component_categories > .layout-cell.activity-link-primary:focus-within .as-cat-detail::after {
	content: none !important;

	display: none !important;

	width: 0 !important;
	height: 0 !important;

	margin: 0 !important;
	padding: 0 !important;

	background: transparent !important;
	border: 0 !important;
	box-shadow: none !important;

	opacity: 0 !important;
	visibility: hidden !important;

	transform: none !important;

	pointer-events: none !important;
}

/* Keep the primary card and inner wrapper positioned */

body .activity-detail-section .page-section-side-column .activity-links .mod_collation_collation_item_component_categories > .layout-cell.activity-link-primary {
	position: relative !important;
}

body .activity-detail-section .page-section-side-column .activity-links .mod_collation_collation_item_component_categories > .layout-cell.activity-link-primary > .i {
	position: relative !important;
}

/* Make sure no accidental inner-wrapper after arrow survives */

body .activity-detail-section .page-section-side-column .activity-links .mod_collation_collation_item_component_categories > .layout-cell.activity-link-primary > .i::after {
	content: none !important;

	display: none !important;

	width: 0 !important;
	height: 0 !important;

	margin: 0 !important;
	padding: 0 !important;

	background: transparent !important;
	border: 0 !important;
	box-shadow: none !important;

	opacity: 0 !important;
	visibility: hidden !important;

	transform: none !important;

	pointer-events: none !important;
}

/* The single primary-card arrow */

body .activity-detail-section .page-section-side-column .activity-links .mod_collation_collation_item_component_categories > .layout-cell.activity-link-primary > .i::before {
	content: "" !important;

	position: absolute !important;
	right: clamp(1.1rem, 2vw, 1.3rem) !important;
	bottom: clamp(1.05rem, 2vw, 1.25rem) !important;
	z-index: 35 !important;

	display: block !important;

	width: 0.68rem !important;
	height: 0.68rem !important;

	background: transparent !important;

	border-top: 0 !important;
	border-left: 0 !important;
	border-right: 3px solid var(--ww-color-orange) !important;
	border-bottom: 3px solid var(--ww-color-orange) !important;

	opacity: 0.85 !important;
	visibility: visible !important;

	transform: rotate(-45deg) !important;

	transition:
		transform var(--ww-transition-fast),
		opacity var(--ww-transition-fast),
		border-color var(--ww-transition-fast);

	pointer-events: none !important;
}

body .activity-detail-section .page-section-side-column .activity-links .mod_collation_collation_item_component_categories > .layout-cell.activity-link-primary:hover > .i::before,
body .activity-detail-section .page-section-side-column .activity-links .mod_collation_collation_item_component_categories > .layout-cell.activity-link-primary:focus-within > .i::before {
	opacity: 1 !important;

	border-color: var(--ww-color-black) !important;

	transform: translate(3px, -3px) rotate(-45deg) !important;
}

/* Give the primary detail content a little room above the bottom-right arrow */

body .activity-detail-section .page-section-side-column .activity-links .mod_collation_collation_item_component_categories > .layout-cell.activity-link-primary .as-cat-detail {
	padding-bottom: clamp(1.85rem, 3vw, 2.25rem) !important;
}

/* Re-confirm secondary cards keep the centre arrow */

body .activity-detail-section .page-section-side-column .activity-links .mod_collation_collation_item_component_categories > .layout-cell.activity-link-secondary::after {
	content: "" !important;

	position: absolute !important;
	right: clamp(.85rem, 1.6vw, 1rem) !important;
	top: 50% !important;
	z-index: 22 !important;

	display: block !important;

	width: .55rem !important;
	height: .55rem !important;

	background: transparent !important;

	border-top: 0 !important;
	border-left: 0 !important;
	border-right: 3px solid var(--ww-color-orange) !important;
	border-bottom: 3px solid var(--ww-color-orange) !important;

	opacity: .65 !important;
	visibility: visible !important;

	transform: translateY(-50%) rotate(-45deg) !important;

	pointer-events: none !important;

	transition:
		transform var(--ww-transition-fast),
		opacity var(--ww-transition-fast),
		border-color var(--ww-transition-fast);
}

body .activity-detail-section .page-section-side-column .activity-links .mod_collation_collation_item_component_categories > .layout-cell.activity-link-secondary:hover::after,
body .activity-detail-section .page-section-side-column .activity-links .mod_collation_collation_item_component_categories > .layout-cell.activity-link-secondary:focus-within::after {
	opacity: 1 !important;

	border-color: var(--ww-color-black) !important;

	transform: translate(3px, -50%) rotate(-45deg) !important;
}


/* ==========================================
   ACTIVITY DETAIL DIRECT BOOKING CARD
   Appears when a direct booking link is added in admin
   Uses:
   .activity-detail-section
   .page-section-side-column
   .direct-booking
========================================== */

body .activity-detail-section .page-section-side-column .direct-booking {
	position: relative;
	isolation: isolate;

	width: 100%;
	min-width: 0;

	margin: 0px 0px 24px 0px !important;
	padding: clamp(1.5rem, 3vw, 2rem) !important;

	background:
		radial-gradient(circle at 88% 12%, rgba(255,255,255,.16), transparent 34%),
		radial-gradient(circle at 12% 92%, rgba(217,147,14,.14), transparent 38%),
		var(--ww-color-black);

	color: var(--ww-color-white);

	border: 1px solid rgba(217,147,14,.35);
	border-radius: var(--ww-radius-l);

	box-shadow:
		0 18px 54px rgba(0,0,0,.18),
		inset 0 1px 0 rgba(255,255,255,.1);

	overflow: hidden;
}

/* Orange top strip */

body .activity-detail-section .page-section-side-column .direct-booking::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	z-index: 2;

	width: 100%;
	height: 7px;

	background: var(--ww-color-orange);

	pointer-events: none;
}

/* Soft background orb */

body .activity-detail-section .page-section-side-column .direct-booking::after {
	content: "";
	position: absolute;
	right: -54px;
	bottom: -54px;
	z-index: 0;

	width: 150px;
	height: 150px;

	background: rgba(217,147,14,.12);
	border-radius: 999px;

	pointer-events: none;
}

/* Keep content above decoration */

body .activity-detail-section .page-section-side-column .direct-booking .component-topper,
body .activity-detail-section .page-section-side-column .direct-booking .content {
	position: relative;
	z-index: 1;

	width: 100%;
	min-width: 0;

	margin: 0 !important;
	padding: 0 !important;
}

/* Heading */

body .activity-detail-section .page-section-side-column .direct-booking h2 {
	margin: 0 0 .75rem !important;
	padding: 0 !important;

	color: var(--ww-color-white);

	font-size: clamp(1.65rem, 2.8vw, 2.35rem);
	font-weight: 900;
	line-height: 1.05;
	letter-spacing: -0.04em;
}

/* Copy */

body .activity-detail-section .page-section-side-column .direct-booking p {
	margin: 0 0 1.15rem !important;
	padding: 0 !important;

	color: rgba(255,255,255,.86);

	font-size: 1rem;
	font-weight: 600;
	line-height: 1.55;
}

body .activity-detail-section .page-section-side-column .direct-booking p:last-child {
	margin-bottom: 1.15rem !important;
}

/* Content wrapper */

body .activity-detail-section .page-section-side-column .direct-booking .content {
	display: flex;
}

/* Direct booking link styled as button */

body .activity-detail-section .page-section-side-column .direct-booking .content a,
body .activity-detail-section .page-section-side-column .direct-booking .content a:visited {
	position: relative;
	isolation: isolate;

	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	gap: .55rem;

	width: 100%;
	min-height: 52px;

	margin: 0 !important;
	padding: .95rem 1.25rem !important;

	background: var(--ww-color-orange);
	color: var(--ww-color-black) !important;

	border: 2px solid var(--ww-color-orange);
	border-radius: 999px;

	box-shadow:
		0 14px 32px rgba(0,0,0,.22),
		inset 0 1px 0 rgba(255,255,255,.28);

	font-size: .98rem;
	font-weight: 950;
	line-height: 1;
	text-align: center;
	text-decoration: none !important;

	overflow: hidden;

	transition:
		background-color var(--ww-transition-fast),
		color var(--ww-transition-fast),
		border-color var(--ww-transition-fast),
		box-shadow var(--ww-transition-fast),
		transform var(--ww-transition-fast);
}

/* Small arrow */

body .activity-detail-section .page-section-side-column .direct-booking .content a::after {
	content: "";

	display: block;

	width: .55rem;
	height: .55rem;

	border-right: 3px solid currentColor;
	border-bottom: 3px solid currentColor;

	transform: rotate(-45deg);

	transition:
		transform var(--ww-transition-fast);
}

/* Hover / focus */

body .activity-detail-section .page-section-side-column .direct-booking .content a:hover,
body .activity-detail-section .page-section-side-column .direct-booking .content a:focus {
	background: var(--ww-color-white);
	color: var(--ww-color-black) !important;
	border-color: var(--ww-color-white);

	box-shadow:
		0 18px 42px rgba(0,0,0,.28),
		0 0 22px rgba(217,147,14,.16),
		inset 0 1px 0 rgba(255,255,255,.45);

	transform: translateY(-2px);
}

body .activity-detail-section .page-section-side-column .direct-booking .content a:hover::after,
body .activity-detail-section .page-section-side-column .direct-booking .content a:focus::after {
	transform: translateX(3px) rotate(-45deg);
}

/* Keyboard focus */

body .activity-detail-section .page-section-side-column .direct-booking .content a:focus-visible {
	outline: 3px solid rgba(217,147,14,.42);
	outline-offset: 4px;
}

/* Hide if EOS outputs an empty booking component */

body .activity-detail-section .page-section-side-column .direct-booking:has(.content:empty),
body .activity-detail-section .page-section-side-column .direct-booking:has(.content a[href=""]) {
	display: none !important;
}

/* ==========================================
   RESPONSIVE
========================================== */

@media (max-width: 767px) {

	body .activity-detail-section .page-section-side-column .direct-booking {
		padding: 1.35rem !important;

		border-radius: var(--ww-radius-m);
	}

	body .activity-detail-section .page-section-side-column .direct-booking h2 {
		font-size: clamp(1.5rem, 8vw, 2rem);
	}

	body .activity-detail-section .page-section-side-column .direct-booking p {
		font-size: .96rem;
		line-height: 1.5;
	}

	body .activity-detail-section .page-section-side-column .direct-booking .content a,
	body .activity-detail-section .page-section-side-column .direct-booking .content a:visited {
		min-height: 50px;
		padding: .9rem 1rem !important;
	}

}

/* ==========================================
   REDUCED MOTION
========================================== */

@media (prefers-reduced-motion: reduce) {

	body .activity-detail-section .page-section-side-column .direct-booking .content a,
	body .activity-detail-section .page-section-side-column .direct-booking .content a::after {
		transition: none !important;
	}

	body .activity-detail-section .page-section-side-column .direct-booking .content a:hover,
	body .activity-detail-section .page-section-side-column .direct-booking .content a:focus,
	body .activity-detail-section .page-section-side-column .direct-booking .content a:hover::after,
	body .activity-detail-section .page-section-side-column .direct-booking .content a:focus::after {
		transform: none !important;
	}

}

 /* Begin CSS Part: Cookies */


 /* Begin CSS Part: Crm */

 /* Begin CSS Part: Currency Converter */

 /* Begin CSS Part: Discount */

 /* Begin CSS Part: Email Template */

 /* Begin CSS Part: Form */
/* ==========================================
   WATMAN WEB FRAMEWORK
   FORMS
   4 ALL FOUNDATION
========================================== */

form {
	width: 100%;
}

.ww-form,
.form-fields,
.form-footer,
.form-fields > .i,
.form-footer > .i {
	width: 100%;
	min-width: 0;
}

.form-component {
	width: 100%;
	margin-bottom: 1.25rem;
}

.form-component.empty {
	display: none;
}

.form-component label,
.page-section .company-info label {
	display: block;
	margin-bottom: 0.5rem;
	color: var(--ww-color-heading-tertiary);
	font-size: 0.9rem;
	font-weight: 800;
	line-height: 1.2;
}

.ff-required-star {
	color: var(--ww-color-orange);
}

input[type="text"],
input[type="email"],
input[type="tel"],
input[type="number"],
input[type="password"],
input[type="search"],
input[type="url"],
input[type="date"],
input[type="time"],
select,
textarea {
	width: 100%;
	min-height: 52px;
	padding: 0.85rem 1rem;
	border: 1px solid var(--ww-color-border);
	border-radius: var(--ww-radius-s);
	background: var(--ww-color-white);
	color: var(--ww-color-text);
	font: inherit;
	line-height: 1.4;
	transition:
		border-color var(--ww-transition-fast),
		box-shadow var(--ww-transition-fast),
		background-color var(--ww-transition-fast);
}

textarea {
	min-height: 170px;
	resize: vertical;
}

input::placeholder,
textarea::placeholder {
	color: rgba(0,0,0,.45);
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="tel"]:focus,
input[type="number"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="url"]:focus,
input[type="date"]:focus,
input[type="time"]:focus,
select:focus,
textarea:focus {
	border-color: var(--ww-color-orange);
	box-shadow: 0 0 0 3px rgba(217,147,14,.18);
	outline: none;
}

.form-fields > .i {
	display: grid;
	gap: var(--ww-space-s);
}

.form-fields > .i > .form-component {
	min-width: 0;
	margin-bottom: 1.25rem;
}

.form-fields > .i > .form-component.col1 {
	grid-column: 1 / -1;
}

.checkbox .multi-select-container,
.radio .multi-select-container,
.checkbox-value {
	display: flex;
	align-items: flex-start;
	gap: 0.75rem;
}

.checkbox input[type="checkbox"],
.radio input[type="radio"] {
	flex: 0 0 auto;
	width: 18px;
	height: 18px;
	margin-top: 0.35rem;
}

.rt-label p {
	margin: 0;
	font-size: 0.95rem;
	line-height: 1.5;
}

.captcha-code {
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
}

.captcha-code input[type="text"] {
	width: 100%;
	max-width: 220px;
}

.synchronous-captcha-code {
	display: block;
	width: auto;
	max-width: 220px;
	height: auto;
	border: 1px solid var(--ww-color-border);
	border-radius: var(--ww-radius-s);
}

.submit-button {
	margin-top: 2rem;
}

.submit-button input[type="submit"] {
	min-width: 160px;
}


/* ==========================================
   PAGE SECTION FORMS
   General EOS form styling inside .page-section-form
========================================== */

body .page-section-form {
	--ww-form-padding: clamp(1.25rem, 3vw, 2rem);
	--ww-form-inner-padding: clamp(1.5rem, 4vw, 2.75rem);
	--ww-form-gap: clamp(1rem, 2vw, 1.35rem);
	--ww-form-field-radius: 0.85rem;

	position: relative;
	isolation: isolate;

	min-width: 0;

	padding: var(--ww-form-padding) !important;

	background:
		radial-gradient(circle at 90% 10%, rgba(217,147,14,.16), transparent 34%),
		linear-gradient(180deg, rgba(217,147,14,.10), rgba(217,147,14,.04));

	border: 1px solid rgba(217,147,14,.22);
	border-radius: var(--ww-radius-l);

	box-shadow:
		0 20px 60px rgba(0,0,0,.08),
		inset 0 1px 0 rgba(255,255,255,.78);

	overflow: hidden;
}

/* Decorative top line */

body .page-section-form::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;

	width: 100%;
	height: 7px;

	background:
		linear-gradient(
			90deg,
			var(--ww-color-orange),
			rgba(217,147,14,.5),
			var(--ww-color-orange)
		);

	pointer-events: none;
}

/* Soft glow */

body .page-section-form::after {
	content: "";
	position: absolute;
	right: -90px;
	bottom: -90px;
	z-index: -1;

	width: 240px;
	height: 240px;

	background: rgba(217,147,14,.12);
	border-radius: 999px;

	pointer-events: none;
}

/* Form containers */

body .page-section-form > .i,
body .page-section-form form,
body .page-section-form .layout.mod_form,
body .page-section-form .layout.mod_form > form,
body .page-section-form form > .layout.mod_form {
	width: 100%;
	min-width: 0;
}

body .page-section-form .layout.mod_form.initialised {
	position: relative;
	z-index: 2;

	width: 100%;
	min-width: 0;

	margin: 0 !important;
	padding: 0 !important;
}

body .page-section-form form > .layout.mod_form {
	position: relative;

	display: block;

	margin: 0 !important;
	padding: var(--ww-form-inner-padding) !important;

	background:
		linear-gradient(180deg, rgba(255,255,255,1), rgba(255,255,255,.97));

	border: 1px solid rgba(0,0,0,.08);
	border-radius: calc(var(--ww-radius-l) - 0.35rem);

	box-shadow:
		0 18px 48px rgba(0,0,0,.08),
		inset 0 1px 0 rgba(255,255,255,.95);

	overflow: hidden;
}

/* Hide empty config rows */

body .page-section-form .form-component.empty,
body .page-section-form .main-config.empty {
	display: none !important;
}

/* ==========================================
   FORM FIELD LAYOUT
========================================== */

/* Field rows */

body .page-section-form form > .layout.mod_form > .layout-cell {
	width: 100%;
	min-width: 0;

	margin: 0 !important;
	padding: 0 !important;
}

/* Main field group */

body .page-section-form form > .layout.mod_form > .layout-cell:nth-child(2) {
	display: grid !important;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--ww-form-gap);

	align-items: start;

	margin: 0 0 var(--ww-form-gap) !important;
}

/* Footer group: terms, captcha, submit */

body .page-section-form form > .layout.mod_form > .layout-cell:nth-child(3) {
	display: grid !important;
	grid-template-columns: 1fr;
	gap: clamp(0.9rem, 2vw, 1.15rem);

	align-items: center;

	margin-top: clamp(1rem, 2.5vw, 1.5rem) !important;
	padding-top: clamp(1rem, 2.5vw, 1.5rem) !important;

	border-top: 1px solid rgba(0,0,0,.08);
}

/* Individual components */

body .page-section-form .form-component {
	width: 100% !important;
	min-width: 0;

	margin: 0 !important;
	padding: 0 !important;
}

/* Full-width fields */

body .page-section-form .form-component.col1,
body .page-section-form .form-component.text-area,
body .page-section-form .form-component.submit-button,
body .page-section-form .form-component.checkbox,
body .page-section-form .form-component.captcha-code {
	grid-column: 1 / -1;
}

/* ==========================================
   LABELS
========================================== */

body .page-section-form .form-component > label {
	display: block;

	margin: 0 0 0.45rem !important;
	padding: 0 !important;

	color: var(--ww-color-black);

	font-size: 0.84rem;
	font-weight: 900;
	line-height: 1.2;
	letter-spacing: 0.01em;
}

body .page-section-form .ff-required-star {
	color: var(--ww-color-orange);
	font-weight: 900;
}

/* ==========================================
   TEXT INPUTS / TEXTAREA
========================================== */

body .page-section-form input[type="text"],
body .page-section-form input[type="email"],
body .page-section-form input[type="tel"],
body .page-section-form input[type="number"],
body .page-section-form input[type="password"],
body .page-section-form select,
body .page-section-form textarea {
	display: block;

	width: 100% !important;
	min-width: 0;

	margin: 0 !important;
	padding: 0.95rem 1rem !important;

	background: rgba(255,255,255,.92);
	color: var(--ww-color-black);

	border: 1px solid rgba(0,0,0,.13);
	border-radius: var(--ww-form-field-radius);

	box-shadow:
		0 1px 0 rgba(255,255,255,.9),
		inset 0 1px 2px rgba(0,0,0,.025);

	font-family: inherit;
	font-size: 1rem;
	font-weight: 650;
	line-height: 1.35;

	outline: none;

	transition:
		background-color var(--ww-transition-fast),
		border-color var(--ww-transition-fast),
		box-shadow var(--ww-transition-fast),
		transform var(--ww-transition-fast);
}

body .page-section-form textarea {
	min-height: 170px;

	resize: vertical;
	line-height: 1.55;
}

body .page-section-form input::placeholder,
body .page-section-form textarea::placeholder {
	color: rgba(0,0,0,.42);
}

body .page-section-form input[type="text"]:hover,
body .page-section-form input[type="email"]:hover,
body .page-section-form input[type="tel"]:hover,
body .page-section-form input[type="number"]:hover,
body .page-section-form input[type="password"]:hover,
body .page-section-form select:hover,
body .page-section-form textarea:hover {
	border-color: rgba(217,147,14,.44);
}

body .page-section-form input[type="text"]:focus,
body .page-section-form input[type="email"]:focus,
body .page-section-form input[type="tel"]:focus,
body .page-section-form input[type="number"]:focus,
body .page-section-form input[type="password"]:focus,
body .page-section-form select:focus,
body .page-section-form textarea:focus {
	background: var(--ww-color-white);

	border-color: var(--ww-color-orange);

	box-shadow:
		0 0 0 4px rgba(217,147,14,.16),
		0 10px 28px rgba(0,0,0,.06);

	transform: translateY(-1px);
}

/* EOS completed field state */

body .page-section-form .form-component.complete input,
body .page-section-form .form-component.complete textarea {
	border-color: rgba(217,147,14,.28);
}

/* ==========================================
   CHECKBOX / TERMS
========================================== */

body .page-section-form .checkbox .multi-select-container {
	display: flex;
	align-items: flex-start;
	gap: 0.75rem;

	width: 100%;

	margin: 0 !important;
	padding: 1rem !important;

	background: rgba(217,147,14,.07);

	border: 1px solid rgba(217,147,14,.2);
	border-radius: var(--ww-form-field-radius);
}

body .page-section-form .checkbox input[type="checkbox"] {
	flex: 0 0 auto;

	width: 1.2rem !important;
	height: 1.2rem !important;

	margin: 0.15rem 0 0 !important;

	accent-color: var(--ww-color-orange);
}

body .page-section-form .checkbox .rt-label {
	min-width: 0;

	color: rgba(0,0,0,.7);

	font-size: 0.92rem;
	font-weight: 650;
	line-height: 1.45;
}

body .page-section-form .checkbox .rt-label p {
	margin: 0 !important;
	padding: 0 !important;
}

body .page-section-form .checkbox .rt-label a {
	color: var(--ww-color-black);
	font-weight: 900;
	text-decoration-color: var(--ww-color-orange);
	text-decoration-thickness: 2px;
	text-underline-offset: 3px;
}

/* ==========================================
   CAPTCHA
========================================== */

body .page-section-form .captcha-code {
	display: grid !important;
	grid-template-columns: minmax(180px, 1fr) auto;
	gap: 0.85rem;

	align-items: center;

	width: 100%;

	margin: 0 !important;
	padding: 0 !important;
}

body .page-section-form .captcha-code input.hidden {
	display: none !important;
}

body .page-section-form .captcha-code input[name="captcha"] {
	min-height: 50px;
}

body .page-section-form .captcha-code img.synchronous-captcha-code {
	display: block;

	width: auto !important;
	max-width: 190px;
	height: 58px !important;

	margin: 0 !important;
	padding: 0.35rem !important;

	object-fit: contain;

	background: var(--ww-color-white);

	border: 1px solid rgba(0,0,0,.12);
	border-radius: var(--ww-form-field-radius);

	box-shadow: 0 8px 22px rgba(0,0,0,.07);

	cursor: pointer;
}

/* ==========================================
   SUBMIT BUTTON
========================================== */

body .page-section-form .submit-button {
	display: flex !important;
	justify-content: flex-start;

	margin-top: 0.25rem !important;
}

body .page-section-form .submit-button input[type="submit"],
body .page-section-form input[type="submit"].super.confirm.go {
	display: inline-flex !important;
	align-items: center;
	justify-content: center;

	min-height: 54px;
	min-width: 180px;

	margin: 0 !important;
	padding: 0.95rem 1.6rem !important;

	background: var(--ww-color-black) !important;
	color: var(--ww-color-orange) !important;

	border: 2px solid var(--ww-color-black) !important;
	border-radius: 999px !important;

	box-shadow:
		0 12px 30px rgba(0,0,0,.14),
		inset 0 1px 0 rgba(255,255,255,.12);

	font-family: inherit;
	font-size: 0.98rem;
	font-weight: 900;
	line-height: 1;
	text-align: center;

	cursor: pointer;

	transition:
		background-color var(--ww-transition-fast),
		color var(--ww-transition-fast),
		border-color var(--ww-transition-fast),
		transform var(--ww-transition-fast),
		box-shadow var(--ww-transition-fast);
}

body .page-section-form .submit-button input[type="submit"]:hover,
body .page-section-form .submit-button input[type="submit"]:focus,
body .page-section-form input[type="submit"].super.confirm.go:hover,
body .page-section-form input[type="submit"].super.confirm.go:focus {
	background: var(--ww-color-orange) !important;
	color: var(--ww-color-black) !important;
	border-color: var(--ww-color-orange) !important;

	box-shadow:
		0 16px 38px rgba(0,0,0,.18),
		0 0 26px rgba(217,147,14,.24);

	transform: translateY(-2px);
}

/* ==========================================
   VALIDATION / ERRORS
========================================== */

body .page-section-form .form-component.error input,
body .page-section-form .form-component.error textarea,
body .page-section-form .form-component.error select,
body .page-section-form .form-component.invalid input,
body .page-section-form .form-component.invalid textarea,
body .page-section-form .form-component.invalid select {
	border-color: #b00020 !important;

	box-shadow:
		0 0 0 4px rgba(176,0,32,.1),
		inset 0 1px 2px rgba(0,0,0,.025);
}

body .page-section-form .field-error,
body .page-section-form .form-error,
body .page-section-form .error-message {
	margin-top: 0.45rem;

	color: #b00020;

	font-size: 0.85rem;
	font-weight: 850;
	line-height: 1.35;
}

/* ==========================================
   FORM RESPONSIVE
========================================== */

@media (max-width: 900px) {

	body .page-section-form form > .layout.mod_form > .layout-cell:nth-child(2) {
		grid-template-columns: 1fr;
	}

}

@media (max-width: 767px) {

	body .page-section-form {
		--ww-form-padding: 0.85rem;
		--ww-form-inner-padding: 1.15rem;

		border-radius: var(--ww-radius-m);
	}

	body .page-section-form form > .layout.mod_form {
		border-radius: var(--ww-radius-m);
	}

	body .page-section-form textarea {
		min-height: 150px;
	}

	body .page-section-form .captcha-code {
		grid-template-columns: 1fr;
	}

	body .page-section-form .captcha-code img.synchronous-captcha-code {
		max-width: 100%;
		width: 100% !important;
		height: auto !important;
		min-height: 58px;
	}

	body .page-section-form .submit-button {
		justify-content: stretch;
	}

	body .page-section-form .submit-button input[type="submit"],
	body .page-section-form input[type="submit"].super.confirm.go {
		width: 100%;
	}

}

 /* Begin CSS Part: Google Analytics */

 /* Begin CSS Part: Home */

 /* Begin CSS Part: Multi User */

 /* Begin CSS Part: News Letter */
/* ==========================================
   NEWSLETTER HERO BANNER
   4 All Foundation
   Scoped only to:
   .newsletter-banner
========================================== */

body .newsletter-banner {
	--newsletter-banner-accent: var(--ww-color-orange);
	--newsletter-banner-radius: var(--ww-radius-l);
	--newsletter-banner-radius-small: var(--ww-radius-m);

	position: relative;
	isolation: isolate;

	overflow: hidden;
}

/* Strengthen readability over the hero image */

body .newsletter-banner .background-image {
	position: relative;
	isolation: isolate;

	background-position: center center;
	background-size: cover;
	background-repeat: no-repeat;
}

body .newsletter-banner .background-image::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 0;

	background:
		linear-gradient(
			90deg,
			rgba(0,0,0,.76) 0%,
			rgba(0,0,0,.62) 38%,
			rgba(0,0,0,.34) 68%,
			rgba(0,0,0,.18) 100%
		),
		radial-gradient(circle at 18% 35%, rgba(217,147,14,.22), transparent 34%),
		linear-gradient(180deg, rgba(0,0,0,.12), rgba(0,0,0,.22));

	pointer-events: none;
}

body .newsletter-banner .background-image::after {
	content: "";
	position: absolute;
	right: -160px;
	bottom: -220px;
	z-index: 0;

	width: min(720px, 85vw);
	aspect-ratio: 1 / 1;

	background: rgba(217,147,14,.22);
	border-radius: 999px;

	filter: blur(78px);

	pointer-events: none;
}

/* Keep actual banner content above overlay */

body .newsletter-banner .nested-banner-content {
	position: relative;
	z-index: 2;
}

body .newsletter-banner .nested-banner-content > .i {
	position: relative;
	z-index: 2;

	display: grid !important;
	grid-template-columns: minmax(0, .88fr) minmax(360px, .82fr);
	align-items: center;
	gap: clamp(2rem, 5vw, 5rem);

	width: calc(100% - (var(--ww-page-gutter) * 2));
	max-width: min(1180px, var(--ww-container-max));

	margin-left: auto !important;
	margin-right: auto !important;
	padding:
		clamp(5rem, 8vw, 8rem)
		0
		clamp(5rem, 8vw, 8rem) !important;
}

/* Reset the two banner columns */

body .newsletter-banner .nested-banner-content > .i > .layout-cell {
	width: 100% !important;
	max-width: none !important;
	min-width: 0 !important;

	margin: 0 !important;
	padding: 0 !important;

	float: none !important;
}

/* ==========================================
   NEWSLETTER HERO TEXT
========================================== */

body .newsletter-banner .title,
body .newsletter-banner .newsletter-intro {
	width: 100%;
	max-width: 660px;

	margin: 0 !important;
	padding: 0 !important;
}


body .newsletter-banner .title h1,
body .newsletter-banner .title h2 {
	max-width: 620px;

	margin: 0 0 clamp(1rem, 1.8vw, 1.35rem) !important;
	padding: 0 !important;

	color: var(--ww-color-white) !important;

	font-size: clamp(3rem, 5.4vw, 6rem);
	font-weight: 950;
	line-height: .96;
	letter-spacing: -0.07em;
	text-wrap: balance;

	text-shadow:
		0 8px 34px rgba(0,0,0,.42),
		0 1px 0 rgba(0,0,0,.22);
}

body .newsletter-banner .title h1::after,
body .newsletter-banner .title h2::after {
	content: "";
	display: block;

	width: 94px;
	height: 6px;

	margin-top: clamp(1rem, 1.8vw, 1.25rem);

	background:
		linear-gradient(
			90deg,
			var(--newsletter-banner-accent),
			rgba(217,147,14,.28)
		);

	border-radius: 999px;

	box-shadow: 0 0 22px rgba(217,147,14,.22);
}

body .newsletter-banner .newsletter-intro p {
	max-width: 620px;

	margin: 0 !important;
	padding: 0 !important;

	color: rgba(255,255,255,.92) !important;

	font-size: clamp(1.08rem, 1.55vw, 1.35rem);
	font-weight: 650;
	line-height: 1.58;

	text-shadow: 0 4px 18px rgba(0,0,0,.4);
}

/* ==========================================
   NEWSLETTER FORM PANEL
========================================== */

body .newsletter-banner .signup-form {
	position: relative;
	isolation: isolate;

	width: 100% !important;
	max-width: 560px;

	margin: 0 0 0 auto !important;
	padding: clamp(1.15rem, 2vw, 1.65rem) !important;

	background:
		radial-gradient(circle at 94% 12%, rgba(217,147,14,.2), transparent 36%),
		linear-gradient(180deg, rgba(0,0,0,.54), rgba(0,0,0,.38));

	border: 1px solid rgba(255,255,255,.18);
	border-top: 1px solid rgba(217,147,14,.62);
	border-radius: var(--newsletter-banner-radius);

	box-shadow:
		0 30px 86px rgba(0,0,0,.34),
		0 0 0 1px rgba(217,147,14,.12),
		inset 0 1px 0 rgba(255,255,255,.16);

	backdrop-filter: blur(10px);

	overflow: hidden;
}

body .newsletter-banner .signup-form::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	z-index: 3;

	width: 100%;
	height: 7px;

	background:
		linear-gradient(
			90deg,
			var(--newsletter-banner-accent),
			rgba(217,147,14,.38),
			var(--newsletter-banner-accent)
		);

	pointer-events: none;
}

body .newsletter-banner .signup-form::after {
	content: "";
	position: absolute;
	right: -90px;
	bottom: -90px;
	z-index: 0;

	width: 230px;
	height: 230px;

	background: rgba(217,147,14,.16);
	border-radius: 999px;

	pointer-events: none;
}

body .newsletter-banner .signup-form > *,
body .newsletter-banner .signup-form .mod_form,
body .newsletter-banner .signup-form form,
body .newsletter-banner .signup-form .mod_news_letter_component_signup_form {
	position: relative;
	z-index: 2;
}

/* ==========================================
   EOS FORM RESET
========================================== */

body .newsletter-banner .signup-form .layout,
body .newsletter-banner .signup-form .mod_form,
body .newsletter-banner .signup-form form,
body .newsletter-banner .signup-form .mod_news_letter_component_signup_form,
body .newsletter-banner .signup-form .layout-cell,
body .newsletter-banner .signup-form .layout-component,
body .newsletter-banner .signup-form .form-component {
	width: 100% !important;
	max-width: none !important;
	min-width: 0 !important;

	height: auto !important;
	min-height: 0 !important;
	max-height: none !important;

	margin: 0 !important;
	padding: 0 !important;

	float: none !important;
	clear: none !important;

	box-sizing: border-box;
}

/* Hide empty EOS config component */

body .newsletter-banner .signup-form .form-component.empty,
body .newsletter-banner .signup-form .main-config.empty {
	display: none !important;
}

/* Form layout */

body .newsletter-banner .signup-form .mod_news_letter_component_signup_form {
	display: grid !important;
	grid-template-columns: 1fr;
	gap: clamp(.9rem, 1.6vw, 1.15rem);
}

body .newsletter-banner .signup-form .mod_news_letter_component_signup_form > .layout-cell {
	display: grid !important;
	grid-template-columns: 1fr;
	gap: clamp(.85rem, 1.4vw, 1rem);
}

/* ==========================================
   LABELS
========================================== */

body .newsletter-banner .signup-form label {
	display: block !important;

	margin: 0 0 .45rem !important;
	padding: 0 !important;

	color: rgba(255,255,255,.94) !important;

	font-size: .9rem;
	font-weight: 900;
	line-height: 1.2;
	letter-spacing: -.01em;

	text-shadow: 0 3px 12px rgba(0,0,0,.28);
}

/* ==========================================
   TEXT INPUTS
========================================== */

body .newsletter-banner .signup-form input[type="text"],
body .newsletter-banner .signup-form input[type="email"] {
	display: block;

	width: 100% !important;
	min-height: 56px;

	margin: 0 !important;
	padding: 0 1rem !important;

	background: rgba(255,255,255,.96);

	color: var(--ww-color-black);

	border: 1px solid rgba(255,255,255,.72);
	border-radius: var(--ww-radius-m);

	box-shadow:
		0 14px 34px rgba(0,0,0,.18),
		inset 0 1px 0 rgba(255,255,255,.92);

	font-size: 1rem;
	font-weight: 650;
	line-height: 1.2;

	outline: none;

	transition:
		border-color var(--ww-transition-fast),
		box-shadow var(--ww-transition-fast),
		background-color var(--ww-transition-fast);
}

body .newsletter-banner .signup-form input[type="text"]:focus,
body .newsletter-banner .signup-form input[type="email"]:focus {
	background: var(--ww-color-white);

	border-color: rgba(217,147,14,.92);

	box-shadow:
		0 0 0 4px rgba(217,147,14,.22),
		0 16px 38px rgba(0,0,0,.22),
		inset 0 1px 0 rgba(255,255,255,.95);
}

/* ==========================================
   PRIVACY CHECKBOX
========================================== */

body .newsletter-banner .signup-form .checkbox {
	display: block !important;
}

body .newsletter-banner .signup-form .multi-select-container {
	position: relative;

	display: grid !important;
	grid-template-columns: auto minmax(0, 1fr);
	align-items: center;
	gap: .75rem;

	width: 100% !important;

	margin: .1rem 0 0 !important;
	padding: .85rem 1rem !important;

	background: rgba(0,0,0,.28);

	border: 1px solid rgba(255,255,255,.18);
	border-radius: var(--ww-radius-m);

	box-shadow:
		inset 0 1px 0 rgba(255,255,255,.08),
		0 10px 24px rgba(0,0,0,.12);
}

body .newsletter-banner .signup-form .multi-select-container input[type="checkbox"] {
	appearance: none;
	-webkit-appearance: none;

	position: relative;

	display: block;

	width: 1.25rem !important;
	height: 1.25rem !important;
	min-width: 1.25rem;
	min-height: 1.25rem;

	margin: 0 !important;
	padding: 0 !important;

	background: rgba(255,255,255,.96);

	border: 2px solid rgba(255,255,255,.82);
	border-radius: .35rem;

	box-shadow:
		0 8px 18px rgba(0,0,0,.18),
		inset 0 1px 0 rgba(255,255,255,.9);

	cursor: pointer;

	transition:
		background-color var(--ww-transition-fast),
		border-color var(--ww-transition-fast),
		box-shadow var(--ww-transition-fast);
}

body .newsletter-banner .signup-form .multi-select-container input[type="checkbox"]::after {
	content: "";

	position: absolute;
	left: 50%;
	top: 45%;

	width: .38rem;
	height: .68rem;

	border-right: 3px solid var(--ww-color-black);
	border-bottom: 3px solid var(--ww-color-black);

	opacity: 0;

	transform:
		translate(-50%, -50%)
		rotate(42deg)
		scale(.75);

	transition:
		opacity var(--ww-transition-fast),
		transform var(--ww-transition-fast);
}

body .newsletter-banner .signup-form .multi-select-container input[type="checkbox"]:checked {
	background: var(--newsletter-banner-accent);
	border-color: var(--newsletter-banner-accent);

	box-shadow:
		0 0 0 4px rgba(217,147,14,.22),
		0 10px 22px rgba(217,147,14,.24);
}

body .newsletter-banner .signup-form .multi-select-container input[type="checkbox"]:checked::after {
	opacity: 1;

	transform:
		translate(-50%, -50%)
		rotate(42deg)
		scale(1);
}

body .newsletter-banner .signup-form .rt-label {
	min-width: 0;
}

body .newsletter-banner .signup-form .rt-label p {
	margin: 0 !important;

	color: rgba(255,255,255,.9) !important;

	font-size: .95rem;
	font-weight: 650;
	line-height: 1.45;
}

body .newsletter-banner .signup-form .rt-label a {
	color: var(--ww-color-white) !important;
	font-weight: 900;
	text-decoration: underline;
	text-decoration-color: var(--newsletter-banner-accent);
	text-decoration-thickness: 2px;
	text-underline-offset: .18em;
}

body .newsletter-banner .signup-form .rt-label a:hover,
body .newsletter-banner .signup-form .rt-label a:focus {
	color: var(--newsletter-banner-accent) !important;
}

/* ==========================================
   SUBMIT BUTTON
========================================== */

body .newsletter-banner .signup-form .submit-button {
	display: flex !important;
	align-items: center;
	justify-content: flex-start;

	margin-top: .25rem !important;
}

body .newsletter-banner .signup-form input[type="submit"] {
	display: inline-flex;
	align-items: center;
	justify-content: center;

	width: auto;
	min-width: clamp(140px, 12vw, 180px);
	min-height: 54px;

	margin: 0 !important;
	padding: .95rem 1.45rem !important;

	background:
		linear-gradient(180deg, rgba(255,188,58,1), var(--newsletter-banner-accent));

	color: var(--ww-color-black) !important;

	border: 1px solid rgba(217,147,14,.86);
	border-radius: 999px;

	box-shadow:
		0 16px 34px rgba(0,0,0,.24),
		0 0 0 1px rgba(255,255,255,.45) inset,
		inset 0 1px 0 rgba(255,255,255,.55);

	font-size: .9rem;
	font-weight: 950;
	line-height: 1;
	text-align: center;
	text-transform: uppercase;
	letter-spacing: .035em;

	cursor: pointer;

	transition:
		transform var(--ww-transition-fast),
		box-shadow var(--ww-transition-fast),
		background-color var(--ww-transition-fast),
		border-color var(--ww-transition-fast);
}

body .newsletter-banner .signup-form input[type="submit"]:hover,
body .newsletter-banner .signup-form input[type="submit"]:focus {
	transform: translateY(-3px);

	background: var(--ww-color-white);
	color: var(--ww-color-black) !important;

	border-color: var(--ww-color-white);

	box-shadow:
		0 20px 42px rgba(0,0,0,.28),
		0 0 0 1px rgba(217,147,14,.34) inset;
}

body .newsletter-banner .signup-form input[type="submit"]:focus-visible,
body .newsletter-banner .signup-form input[type="checkbox"]:focus-visible {
	outline: none;

	box-shadow:
		0 0 0 4px rgba(217,147,14,.24),
		0 16px 34px rgba(0,0,0,.24);
}

/* ==========================================
   RESPONSIVE
========================================== */

@media (max-width: 1100px) {

	body .newsletter-banner .nested-banner-content > .i {
		grid-template-columns: minmax(0, .9fr) minmax(320px, .8fr);
		gap: clamp(1.5rem, 4vw, 3rem);
	}

	body .newsletter-banner .title h1,
	body .newsletter-banner .title h2 {
		font-size: clamp(3rem, 5.8vw, 5rem);
	}

}

@media (max-width: 900px) {

	body .newsletter-banner .nested-banner-content > .i {
		grid-template-columns: 1fr;
		align-items: start;
	}

	body .newsletter-banner .title,
	body .newsletter-banner .newsletter-intro,
	body .newsletter-banner .signup-form {
		max-width: 680px;
		margin-left: 0 !important;
		margin-right: auto !important;
	}

	body .newsletter-banner .signup-form {
		margin-top: clamp(.5rem, 2vw, 1rem) !important;
	}

}

@media (max-width: 767px) {

	body .newsletter-banner .nested-banner-content > .i {
		padding:
			clamp(3.5rem, 12vw, 5rem)
			0
			clamp(3.5rem, 12vw, 5rem) !important;
	}

	body .newsletter-banner .background-image::before {
		background:
			linear-gradient(
				180deg,
				rgba(0,0,0,.76) 0%,
				rgba(0,0,0,.62) 52%,
				rgba(0,0,0,.48) 100%
			),
			radial-gradient(circle at 18% 35%, rgba(217,147,14,.2), transparent 36%);
	}

	body .newsletter-banner .title::before {
		width: 76px;
		height: 76px;
	}

	body .newsletter-banner .title h1,
	body .newsletter-banner .title h2 {
		font-size: clamp(2.65rem, 14vw, 4.2rem);
	}

	body .newsletter-banner .newsletter-intro p {
		font-size: 1.05rem;
	}

	body .newsletter-banner .signup-form {
		padding: 1rem !important;

		border-radius: var(--newsletter-banner-radius-small);
	}

	body .newsletter-banner .signup-form input[type="text"],
	body .newsletter-banner .signup-form input[type="email"] {
		min-height: 54px;
	}

	body .newsletter-banner .signup-form .multi-select-container {
		align-items: start;
		padding: .85rem !important;
	}

	body .newsletter-banner .signup-form .multi-select-container input[type="checkbox"] {
		margin-top: .1rem !important;
	}

	body .newsletter-banner .signup-form input[type="submit"] {
		width: 100%;
		min-width: 0;
	}

}

@media (max-width: 480px) {

	body .newsletter-banner .signup-form {
		padding: .85rem !important;
	}

	body .newsletter-banner .signup-form .rt-label p {
		font-size: .9rem;
	}

}

/* ==========================================
   REDUCED MOTION
========================================== */

@media (prefers-reduced-motion: reduce) {

	body .newsletter-banner .signup-form input,
	body .newsletter-banner .signup-form input::after {
		transition: none !important;
	}

	body .newsletter-banner .signup-form input[type="submit"]:hover,
	body .newsletter-banner .signup-form input[type="submit"]:focus {
		transform: none !important;
	}

}
 /* Begin CSS Part: Order Manager */

 /* Begin CSS Part: Orders */

 /* Begin CSS Part: Payment Gateway */

 /* Begin CSS Part: Qanda */

 /* Begin CSS Part: Redirect */

 /* Begin CSS Part: Review */

 /* Begin CSS Part: Scroller */
/* ==========================================
   WATMAN WEB FRAMEWORK
   SCROLLER - MAIN
   NEWS / CONTENT SCROLLERS
   4 ALL FOUNDATION
========================================== */

/* ==========================================
   NEWS CARD SCROLLER
   Card column layout is handled in responsive default tabs.
========================================== */

.news-card-scroller {
	--news-card-image-height: clamp(230px, 18vw, 320px);
	--news-card-details-pad: clamp(1.15rem, 1.8vw, 1.6rem);
	--news-card-scroller-safe-pad: 0.85rem;

	position: relative;
	isolation: isolate;

	display: grid;
	grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
	grid-template-areas:
		"heading heading heading"
		"slides slides slides"
		"prev footer next"
		"pager pager pager";

	align-items: center;
	justify-content: stretch;

	column-gap: 1rem;
	row-gap: 1.5rem;

	width: min(100%, calc(100vw - (var(--ww-page-gutter) * 2)));
	max-width: none;

	margin-left: auto;
	margin-right: auto;

	transform: none;

	/*
		Important:
		This must not be visible.
		EOS fade scrollers use relative slide groups with negative top values.
		If overflow is visible, inactive slide groups can create phantom page height.
	*/
	overflow: hidden !important;
	contain: layout paint;
}

.news-card-scroller,
.news-card-scroller .slide-container,
.news-card-scroller .slide-group {
	max-width: 100%;
}

/* Also stop the parent page section from inheriting scroller overflow */

body .page-section:has(.news-card-scroller) {
	overflow: hidden !important;
}

/* ==========================================
   HEADING
========================================== */

.news-card-scroller > h2 {
	grid-area: heading;

	width: 100%;

	margin-bottom: clamp(1.5rem, 3vw, 2.5rem);

	text-align: center;
}

/* ==========================================
   SLIDE CONTAINER
   Critical footer gap fix lives here
========================================== */

.news-card-scroller .slide-container {
	grid-area: slides;

	position: relative;

	width: 100%;
	max-width: 100%;

	margin: 0 0 1.15rem !important;
	padding: var(--news-card-scroller-safe-pad) 0 var(--news-card-scroller-safe-pad) !important;

	/*
		Critical:
		EOS sets inline height on this element.
		We keep that height, but clip anything outside it.
		This prevents hidden relative slide groups from creating body overflow.
	*/
	overflow: hidden !important;
}

/*
	EOS fade mode places each slide-group in flow, then offsets later groups upward.
	We preserve that behaviour, but keep it clipped inside the slide-container.
*/

.news-card-scroller .slide-group {
	min-width: 0;

	padding-bottom: 0.25rem;

	overflow: visible;
}

/* ==========================================
   NEWS CARDS
========================================== */

.news-card-scroller .news-slide {
	position: relative;
	isolation: isolate;

	display: flex;
	flex-direction: column;

	min-width: 0;
	height: auto;
	min-height: 100%;

	background: var(--ww-color-white);

	border: 1px solid rgba(0,0,0,.08);
	border-radius: var(--ww-radius-m);

	box-shadow: 0 8px 26px rgba(0,0,0,.06);

	overflow: hidden;

	text-align: left;

	transition:
		transform var(--ww-transition-fast),
		box-shadow var(--ww-transition-fast),
		border-color var(--ww-transition-fast);
}

.news-card-scroller .news-slide:hover,
.news-card-scroller .news-slide:focus-within {
	transform: translateY(-4px);

	border-color: rgba(217,147,14,.45);

	box-shadow: 0 18px 45px rgba(0,0,0,.1);
}

/* ==========================================
   CARD IMAGE
========================================== */

.news-card-scroller .news-image {
	width: 100%;

	height: var(--news-card-image-height);
	min-height: var(--news-card-image-height);
	max-height: var(--news-card-image-height);

	background: var(--ww-color-surface-alt);

	overflow: hidden;
}

.news-card-scroller .news-image .layout-component,
.news-card-scroller .news-image .icon {
	width: 100%;
	height: 100%;
	min-height: 100%;
	max-height: 100%;

	margin: 0;
	padding: 0;
}

.news-card-scroller .news-image img {
	display: block;

	width: 100%;
	height: 100% !important;
	min-height: 100%;
	max-height: 100%;

	object-fit: cover;
	object-position: center;

	transition: transform 0.4s ease;
}

.news-card-scroller .news-slide:hover .news-image img,
.news-card-scroller .news-slide:focus-within .news-image img {
	transform: scale(1.04);
}

/* ==========================================
   CARD DETAILS
========================================== */

.news-card-scroller .news-details {
	position: static !important;

	display: flex;
	flex-direction: column;
	flex: 1;

	min-height: clamp(190px, 13vw, 230px);

	padding: var(--news-card-details-pad);

	background: var(--ww-color-white);
}

.news-card-scroller .news-details .title {
	margin-bottom: clamp(1rem, 1.8vw, 1.35rem);
}

.news-card-scroller .news-details h3 {
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;

	margin: 0;

	color: var(--ww-color-black);

	font-size: clamp(1.08rem, 1.35vw, 1.32rem);
	line-height: 1.18;
	letter-spacing: -0.02em;

	overflow: hidden;

	transition: color var(--ww-transition-fast);
}

.news-card-scroller .news-slide:hover .news-details h3,
.news-card-scroller .news-slide:focus-within .news-details h3 {
	color: var(--ww-color-orange);
}

/* Hide empty EOS self-link component */

.news-card-scroller .news-details .self-link {
	display: none;
}

/* ==========================================
   CARD DATE
========================================== */

.news-card-scroller .news-details .date-created {
	margin-top: auto;
	padding-top: 0.85rem;

	color: rgba(0,0,0,.56);

	font-size: 0.82rem;
	font-weight: 750;
	line-height: 1.2;
}

/* ==========================================
   CARD BUTTON
   Visible button is decorative because the .inflate link covers the full card.
========================================== */

.news-card-scroller .news-details .textblock {
	margin-top: auto !important;
	padding-top: clamp(1rem, 1.8vw, 1.35rem) !important;
}

.news-card-scroller .news-details .textblock p {
	margin: 0 !important;
}

.news-card-scroller .news-details .button {
	position: relative;
	z-index: 2;

	pointer-events: none;
}

/* Trigger the visible button hover state from the card hover */

.news-card-scroller .news-slide:has(a.inflate):hover .button,
.news-card-scroller .news-slide:has(a.inflate):focus-within .button {
	background: var(--ww-button-hover-bg, var(--ww-color-black)) !important;
	color: var(--ww-button-hover-text, var(--ww-color-white)) !important;
	border-color: var(--ww-button-hover-border, var(--ww-button-hover-bg, var(--ww-color-black))) !important;

	transform: translateY(-2px);
}

.news-card-scroller .news-slide:has(a.inflate):hover .button::after,
.news-card-scroller .news-slide:has(a.inflate):focus-within .button::after {
	background-color: var(--ww-button-arrow-hover-bg, var(--ww-color-orange)) !important;

	transform: translateX(3px);
}

/* ==========================================
   INFLATE LINK
   Full-card clickable layer for news slides
========================================== */

.news-card-scroller .news-slide:has(a.inflate) {
	position: relative;
}

/* Full-card clickable layer */

.news-card-scroller .news-slide a.collation-item-link.inflate,
.news-card-scroller .news-slide .news-details > a.inflate {
	position: absolute;
	inset: 0;
	z-index: 20;

	display: block;

	width: 100%;
	height: 100%;

	margin: 0 !important;
	padding: 0 !important;

	background: transparent;

	border: 0;
	border-radius: inherit;

	color: transparent !important;

	font-size: 0;
	line-height: 0;
	text-decoration: none;

	cursor: pointer;
}

/* Keep keyboard focus visible on the whole card */

.news-card-scroller .news-slide a.collation-item-link.inflate:focus-visible,
.news-card-scroller .news-slide .news-details > a.inflate:focus-visible {
	outline: 3px solid var(--ww-color-orange);
	outline-offset: -6px;

	border-radius: inherit;
}

/* Prevent pseudo content from appearing on inflated news links */

.news-card-scroller .news-slide a.collation-item-link.inflate::before,
.news-card-scroller .news-slide a.collation-item-link.inflate::after,
.news-card-scroller .news-slide .news-details > a.inflate::before,
.news-card-scroller .news-slide .news-details > a.inflate::after {
	display: none !important;
}

/* ==========================================
   SCROLLER CONTROLS
   Prev / More News / Next
========================================== */

.news-card-scroller .scroll-prev,
.news-card-scroller .scroll-next {
	position: static;
	z-index: 2;

	display: inline-flex;
	align-items: center;
	justify-content: center;

	width: 48px;
	height: 48px;
	min-height: 48px;

	margin: 0;
	padding: 0;

	background: var(--ww-color-black);
	color: var(--ww-color-orange);

	border: 2px solid var(--ww-color-black);
	border-radius: 999px;

	font-size: 0;
	text-decoration: none;

	box-shadow: 0 10px 28px rgba(0,0,0,.12);

	transform: none;

	transition:
		background-color var(--ww-transition-fast),
		color var(--ww-transition-fast),
		border-color var(--ww-transition-fast),
		transform var(--ww-transition-fast),
		box-shadow var(--ww-transition-fast);
}

.news-card-scroller .scroll-prev {
	grid-area: prev;

	justify-self: end;
}

.news-card-scroller .scroll-next {
	grid-area: next;

	justify-self: start;
}

.news-card-scroller .scroll-prev::before,
.news-card-scroller .scroll-next::before {
	content: "";

	display: block;

	width: 12px;
	height: 12px;

	border-color: currentColor;
	border-style: solid;

	transform-origin: center;
}

.news-card-scroller .scroll-prev::before {
	margin-left: 4px;

	border-width: 0 0 3px 3px;

	transform: rotate(45deg);
}

.news-card-scroller .scroll-next::before {
	margin-right: 4px;

	border-width: 3px 3px 0 0;

	transform: rotate(45deg);
}

.news-card-scroller .scroll-prev:hover,
.news-card-scroller .scroll-prev:focus,
.news-card-scroller .scroll-next:hover,
.news-card-scroller .scroll-next:focus {
	background: var(--ww-color-orange);
	color: var(--ww-color-black);

	border-color: var(--ww-color-orange);

	box-shadow: 0 12px 30px rgba(0,0,0,.16);

	transform: translateY(-2px);
}

/* ==========================================
   MORE NEWS BUTTON
========================================== */

.news-card-scroller .component-footer {
	grid-area: footer;

	justify-self: center;

	margin: 0;

	text-align: center;
}

.news-card-scroller .component-footer p {
	margin: 0;
}

/* ==========================================
   PAGER
========================================== */

.news-card-scroller .scroller-pager {
	grid-area: pager;

	margin-top: 0;

	text-align: center;
}

.news-card-scroller .sp-links {
	display: flex;
	justify-content: center;
	gap: 0.6rem;
}

.news-card-scroller .sp-link {
	width: 12px;
	height: 12px;

	background: rgba(0,0,0,.18);

	border-radius: 999px;

	overflow: hidden;
	text-indent: -999px;

	cursor: pointer;

	transition:
		background-color var(--ww-transition-fast),
		transform var(--ww-transition-fast);
}

.news-card-scroller .sp-link.active {
	background: var(--ww-color-orange);

	transform: scale(1.15);
}

/* ==========================================
   TABLET REFINEMENTS
========================================== */

@media (min-width: 768px) and (max-width: 1200px) {

	.news-card-scroller {
		--news-card-image-height: clamp(240px, 30vw, 340px);
		--news-card-scroller-safe-pad: 0.85rem;
	}

}

/* ==========================================
   MOBILE REFINEMENTS
========================================== */

@media (max-width: 767px) {

	.news-card-scroller {
		--news-card-image-height: clamp(220px, 58vw, 320px);
		--news-card-scroller-safe-pad: 0.65rem;

		grid-template-columns: auto auto;
		grid-template-areas:
			"heading heading"
			"slides slides"
			"prev next"
			"footer footer"
			"pager pager";

		column-gap: 0.75rem;
		row-gap: 1.25rem;
	}

	.news-card-scroller > h2 {
		margin-bottom: 1.5rem;
	}

	.news-card-scroller .slide-container {
		margin-bottom: 1rem !important;
	}

	.news-card-scroller .news-details {
		min-height: auto;
	}

	.news-card-scroller .scroll-prev,
	.news-card-scroller .scroll-next {
		width: auto;
		min-width: 110px;
		height: 44px;
		min-height: 44px;
	}

	.news-card-scroller .scroll-prev {
		justify-self: end;
	}

	.news-card-scroller .scroll-next {
		justify-self: start;
	}

	.news-card-scroller .scroll-prev::before,
	.news-card-scroller .scroll-next::before {
		width: auto;
		height: auto;

		margin: 0;

		border: 0;

		font-size: 0.9rem;
		font-weight: 800;
		line-height: 1;

		transform: none;
	}

	.news-card-scroller .scroll-prev::before {
		content: "Previous";
	}

	.news-card-scroller .scroll-next::before {
		content: "Next";
	}

	.news-card-scroller .scroll-prev:hover,
	.news-card-scroller .scroll-prev:focus,
	.news-card-scroller .scroll-next:hover,
	.news-card-scroller .scroll-next:focus {
		transform: translateY(-1px);
	}

}

/* ==========================================
   REDUCED MOTION
========================================== */

@media (prefers-reduced-motion: reduce) {

	.news-card-scroller .news-slide,
	.news-card-scroller .news-image img,
	.news-card-scroller .news-details h3,
	.news-card-scroller .news-details .button,
	.news-card-scroller .news-details .button::after,
	.news-card-scroller .scroll-prev,
	.news-card-scroller .scroll-next,
	.news-card-scroller .sp-link {
		transition: none;
	}

	.news-card-scroller .news-slide:hover,
	.news-card-scroller .news-slide:focus-within,
	.news-card-scroller .news-slide:hover .news-image img,
	.news-card-scroller .news-slide:focus-within .news-image img,
	.news-card-scroller .news-slide:has(a.inflate):hover .button,
	.news-card-scroller .news-slide:has(a.inflate):focus-within .button,
	.news-card-scroller .scroll-prev:hover,
	.news-card-scroller .scroll-prev:focus,
	.news-card-scroller .scroll-next:hover,
	.news-card-scroller .scroll-next:focus,
	.news-card-scroller .sp-link.active {
		transform: none;
	}

}
 /* Begin CSS Part: Search */
/* ==========================================
   ACTIVITIES FILTER PANEL
   4 ALL FOUNDATION

   Supports these structures inside .attribute-collection:
   - .layout-component.textblock .button       Optional Hubs Near Me button
   - .categories.collapsible-always            Browse by Hub dropdown
   - .attribute-filter                         Attribute tabs / result count / summary

   Important:
   This version does not depend on item order.
========================================== */

body .content-filter {
	position: relative;
	isolation: isolate;

	width: 100%;

	padding-block: clamp(2.5rem, 5vw, 4rem);

	background:
		radial-gradient(circle at 12% 20%, rgba(217,147,14,.32), transparent 34%),
		radial-gradient(circle at 90% 80%, rgba(217,147,14,.18), transparent 38%),
		var(--ww-color-black);

	color: var(--ww-color-white);

	overflow: visible;

	z-index: 10;
}

body .content-filter::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;

	background:
		linear-gradient(135deg, rgba(255,255,255,.06) 0 1px, transparent 1px 24px);

	opacity: 0.14;
	pointer-events: none;
}

/* ==========================================
   SECTION LABEL
========================================== */

body .content-filter > label {
	display: block;

	width: calc(100% - (var(--ww-page-gutter) * 2));
	max-width: var(--ww-container-max);

	margin: 0 auto 1rem;

	color: var(--ww-color-white);

	font-size: clamp(1.8rem, 3vw, 3rem);
	font-weight: 900;
	line-height: 1.05;
	letter-spacing: -0.04em;
}

/* ==========================================
   INNER CONTAINER
========================================== */

body .content-filter > .i {
	width: calc(100% - (var(--ww-page-gutter) * 2));
	max-width: var(--ww-container-max);

	margin-left: auto;
	margin-right: auto;
}

/* ==========================================
   ATTRIBUTE COLLECTION
   Main glass panel wrapping all filter actions.
   Flex layout avoids order-based targeting.
========================================== */

body .content-filter .attribute-collection {
	position: relative;
	z-index: 20;

	display: flex !important;
	align-items: flex-start;
	justify-content: flex-start;
	flex-wrap: wrap;
	gap: 1rem 1.25rem;

	width: 100%;
	min-width: 0;

	padding: clamp(1rem, 2vw, 1.5rem) !important;

	background:
		radial-gradient(circle at 10% 20%, rgba(217,147,14,.16), transparent 34%),
		rgba(255,255,255,.08);

	border: 1px solid rgba(255,255,255,.18);
	border-radius: var(--ww-radius-l);

	box-shadow:
		0 18px 50px rgba(0,0,0,.24),
		inset 0 1px 0 rgba(255,255,255,.12);

	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);

	overflow: visible;
}

body .content-filter .attribute-collection > .layout-component,
body .content-filter .attribute-collection > .layout-cell {
	margin: 0 !important;
	padding: 0 !important;
}

/* Direct filter controls */

body .content-filter .attribute-collection > .layout-component.textblock,
body .content-filter .attribute-collection > .categories.collapsible-always {
	position: relative;
	z-index: 90;

	flex: 0 0 auto;

	margin: 0 !important;
	padding: 0 !important;
}

body .content-filter .attribute-collection > .attribute-filter,
body .content-filter .attribute-collection > .collation-filter.attribute-filter {
	position: relative;
	z-index: 50;

	flex: 1 1 520px;

	min-width: min(100%, 420px);

	margin: 0 !important;
	padding: 0 !important;
}

/* ==========================================
   OPTIONAL HUBS NEAR ME BUTTON
   Targets by element type, not order.
========================================== */

body .content-filter .attribute-collection > .layout-component.textblock .content,
body .content-filter .attribute-collection > .layout-component.textblock p {
	margin: 0 !important;
	padding: 0 !important;
}

body .content-filter .attribute-collection > .layout-component.textblock .button,
body .content-filter .attribute-collection > .layout-component.textblock .button:visited {
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	gap: 0.55rem;

	min-height: 52px;

	margin: 0 !important;
	padding: 0.95rem 1.45rem !important;

	background: var(--ww-color-orange);
	color: var(--ww-color-black) !important;

	border: 2px solid var(--ww-color-orange);
	border-radius: 999px;

	font-size: 0.95rem;
	font-weight: 900;
	line-height: 1;
	text-decoration: none;
	white-space: nowrap;

	box-shadow:
		0 10px 24px rgba(0,0,0,.18),
		0 0 22px rgba(217,147,14,.12);

	cursor: pointer;

	transition:
		background-color var(--ww-transition-fast),
		color var(--ww-transition-fast),
		border-color var(--ww-transition-fast),
		transform var(--ww-transition-fast),
		box-shadow var(--ww-transition-fast);
}

body .content-filter .attribute-collection > .layout-component.textblock .button::after {
	content: "";

	display: inline-block;

	width: 0.48rem;
	height: 0.48rem;

	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;

	transform: rotate(-45deg);

	transition: transform var(--ww-transition-fast);
}

body .content-filter .attribute-collection > .layout-component.textblock .button:hover,
body .content-filter .attribute-collection > .layout-component.textblock .button:focus {
	background: var(--ww-color-white);
	color: var(--ww-color-black) !important;
	border-color: var(--ww-color-white);

	transform: translateY(-2px);

	box-shadow:
		0 14px 30px rgba(0,0,0,.22),
		0 0 26px rgba(255,255,255,.12);
}

body .content-filter .attribute-collection > .layout-component.textblock .button:hover::after,
body .content-filter .attribute-collection > .layout-component.textblock .button:focus::after {
	transform: rotate(-45deg) translate(2px, 2px);
}

/* ==========================================
   BROWSE BY HUB DROPDOWN
   Targets .categories.collapsible-always directly.
========================================== */

body .content-filter .attribute-collection > .categories.collapsible-always > label.collapsible-trigger {
	position: relative;

	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	gap: 0.6rem;

	min-height: 52px;

	margin: 0 !important;
	padding: 0.95rem 1.45rem !important;

	background: var(--ww-color-orange);
	color: var(--ww-color-black) !important;

	border: 2px solid var(--ww-color-orange);
	border-radius: 999px;

	font-size: 0.95rem;
	font-weight: 900;
	line-height: 1;
	text-decoration: none;
	white-space: nowrap;

	box-shadow:
		0 10px 24px rgba(0,0,0,.18),
		0 0 22px rgba(217,147,14,.14);

	cursor: pointer;

	transition:
		background-color var(--ww-transition-fast),
		color var(--ww-transition-fast),
		border-color var(--ww-transition-fast),
		transform var(--ww-transition-fast),
		box-shadow var(--ww-transition-fast);
}

body .content-filter .attribute-collection > .categories.collapsible-always > label.collapsible-trigger::before {
	content: "";

	display: inline-block;
	flex: 0 0 auto;

	width: 0.9rem;
	height: 0.9rem;

	background: currentColor;

	-webkit-mask:
		url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='black' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 2C8.13 2 5 5.13 5 9c0 5.25 7 13 7 13s7-7.75 7-13c0-3.87-3.13-7-7-7Zm0 9.5A2.5 2.5 0 1 1 12 6a2.5 2.5 0 0 1 0 5.5Z'/%3E%3C/svg%3E")
		center / contain no-repeat;
	mask:
		url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='black' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 2C8.13 2 5 5.13 5 9c0 5.25 7 13 7 13s7-7.75 7-13c0-3.87-3.13-7-7-7Zm0 9.5A2.5 2.5 0 1 1 12 6a2.5 2.5 0 0 1 0 5.5Z'/%3E%3C/svg%3E")
		center / contain no-repeat;
}

body .content-filter .attribute-collection > .categories.collapsible-always > label.collapsible-trigger::after {
	content: "";

	display: inline-block;
	flex: 0 0 auto;

	width: 0.5rem;
	height: 0.5rem;

	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;

	transform: rotate(45deg) translateY(-2px);

	transition: transform var(--ww-transition-fast);
}

body .content-filter .attribute-collection > .categories.collapsible-always > label.collapsible-trigger:hover,
body .content-filter .attribute-collection > .categories.collapsible-always > label.collapsible-trigger:focus {
	background: var(--ww-color-white);
	color: var(--ww-color-black) !important;
	border-color: var(--ww-color-white);

	transform: translateY(-2px);

	box-shadow:
		0 14px 30px rgba(0,0,0,.22),
		0 0 26px rgba(255,255,255,.12);
}

body .content-filter .attribute-collection > .categories.collapsible-always > label.collapsible-trigger:hover::after,
body .content-filter .attribute-collection > .categories.collapsible-always > label.collapsible-trigger:focus::after {
	transform: rotate(45deg) translate(1px, -1px);
}

/* Active hub/category context */

body .content-filter .attribute-collection > .categories.collapsible-always[data-current-category]:not([data-current-category=""]) > label.collapsible-trigger {
	background: var(--ww-color-orange);
	color: var(--ww-color-black) !important;
	border-color: var(--ww-color-orange);
}

/* ==========================================
   BROWSE BY HUB DROPDOWN PANEL
========================================== */

body .content-filter .attribute-collection > .categories.collapsible-always > .content.collapsible-content {
	position: absolute;
	top: calc(100% + 0.65rem);
	left: 0;
	z-index: 120;

	display: block;

	width: max-content;
	min-width: 330px;
	max-width: min(88vw, 460px);

	margin: 0 !important;
	padding: 0.75rem !important;

	background: var(--ww-color-white);
	color: var(--ww-color-black);

	border: 1px solid rgba(0,0,0,.08);
	border-radius: var(--ww-radius-m);

	box-shadow:
		0 18px 44px rgba(0,0,0,.24),
		inset 0 1px 0 rgba(255,255,255,.85);
}

body .content-filter .attribute-collection > .categories.collapsible-always > .content.collapsible-content.hidden {
	display: none !important;
}

body .content-filter .attribute-collection > .categories.collapsible-always .layout.mod_collation_component_categories {
	display: grid !important;
	grid-template-columns: 1fr;
	gap: 0.45rem;

	width: 100%;
	min-width: 0;

	margin: 0 !important;
	padding: 0 !important;
}

body .content-filter .attribute-collection > .categories.collapsible-always .iteration {
	position: relative;

	width: 100%;
	min-width: 0;

	margin: 0 !important;
	padding: 0 !important;

	background: rgba(0,0,0,.035);
	border: 1px solid rgba(0,0,0,.06);
	border-radius: var(--ww-radius-s);

	overflow: hidden;

	transition:
		background-color var(--ww-transition-fast),
		border-color var(--ww-transition-fast),
		transform var(--ww-transition-fast);
}

body .content-filter .attribute-collection > .categories.collapsible-always .iteration:hover,
body .content-filter .attribute-collection > .categories.collapsible-always .iteration:focus-within {
	background: rgba(217,147,14,.12);
	border-color: rgba(217,147,14,.35);

	transform: translateY(-1px);
}

body .content-filter .attribute-collection > .categories.collapsible-always .iteration .layout-cell,
body .content-filter .attribute-collection > .categories.collapsible-always .iteration .link {
	margin: 0 !important;
	padding: 0 !important;
}

body .content-filter .attribute-collection > .categories.collapsible-always .iteration .category-link,
body .content-filter .attribute-collection > .categories.collapsible-always .iteration .category-link:visited {
	display: flex !important;
	align-items: center;
	justify-content: space-between;
	gap: 0.75rem;

	width: 100%;

	margin: 0 !important;
	padding: 0.72rem 0.85rem !important;

	color: var(--ww-color-black) !important;

	font-size: 0.92rem;
	font-weight: 850;
	line-height: 1.25;
	text-decoration: none;
}

body .content-filter .attribute-collection > .categories.collapsible-always .iteration .category-link::after {
	content: "";

	flex: 0 0 auto;

	display: inline-block;

	width: 0.45rem;
	height: 0.45rem;

	border-right: 2px solid var(--ww-color-orange);
	border-bottom: 2px solid var(--ww-color-orange);

	transform: rotate(-45deg);
}

/* ==========================================
   ATTRIBUTE FILTER MODULE
========================================== */

body .content-filter .attribute-filter {
	position: relative;
	z-index: 50;

	display: block !important;

	width: 100%;
	min-width: 0;

	margin: 0 !important;
	padding: 0 !important;

	background: transparent;
	border: 0;
	box-shadow: none;

	overflow: visible;
}

body .content-filter .attribute-filter > .content,
body .content-filter .attribute-sets {
	min-width: 0;
	width: 100%;

	margin: 0 !important;
	padding: 0 !important;
}

/* ==========================================
   FILTER HEADER
========================================== */

body .content-filter .ps-header {
	display: flex !important;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 0.85rem 1rem;

	width: 100%;
	min-width: 0;

	margin: 0 !important;
	padding: 0 !important;
}

/* Filter tab row */

body .content-filter .ps-tab-container {
	display: flex !important;
	align-items: center;
	flex-wrap: wrap;
	gap: 0.65rem;

	min-width: 0;

	margin: 0 !important;
	padding: 0 !important;
}

/* ==========================================
   FILTER TABS
========================================== */

body .content-filter .attribute-filter-tab {
	position: relative;

	display: inline-flex;
	align-items: center;

	margin: 0 !important;
	padding: 0 !important;
}

body .content-filter .attribute-filter-tab > label {
	position: relative;

	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.55rem;

	min-height: 46px;

	margin: 0 !important;
	padding: 0.8rem 1.15rem !important;

	background: var(--ww-color-white);
	color: var(--ww-color-black) !important;

	border: 2px solid var(--ww-color-white);
	border-radius: 999px;

	font-size: 0.95rem;
	font-weight: 900;
	line-height: 1;
	text-decoration: none;
	white-space: nowrap;

	cursor: pointer;

	box-shadow: 0 10px 24px rgba(0,0,0,.12);

	transition:
		background-color var(--ww-transition-fast),
		color var(--ww-transition-fast),
		border-color var(--ww-transition-fast),
		transform var(--ww-transition-fast),
		box-shadow var(--ww-transition-fast);
}

body .content-filter .attribute-filter-tab > label::after {
	content: "";

	display: block;

	width: 0.5rem;
	height: 0.5rem;

	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;

	transform: rotate(45deg) translateY(-2px);

	transition: transform var(--ww-transition-fast);
}

body .content-filter .attribute-filter-tab > label:hover,
body .content-filter .attribute-filter-tab > label:focus,
body .content-filter .attribute-filter-tab.active > label {
	background: var(--ww-color-orange);
	color: var(--ww-color-black) !important;
	border-color: var(--ww-color-orange);

	transform: translateY(-2px);

	box-shadow:
		0 14px 30px rgba(0,0,0,.18),
		0 0 24px rgba(217,147,14,.16);
}

body .content-filter .attribute-filter-tab > label:hover::after,
body .content-filter .attribute-filter-tab > label:focus::after {
	transform: rotate(45deg) translate(1px, -1px);
}

/* Active tab state when an option inside it is checked */

body .content-filter .attribute-filter-tab:has(input[type="checkbox"]:checked) > label {
	background: var(--ww-color-orange);
	color: var(--ww-color-black) !important;
	border-color: var(--ww-color-orange);

	box-shadow:
		0 14px 30px rgba(0,0,0,.2),
		0 0 24px rgba(217,147,14,.24);
}

body .content-filter .attribute-filter-tab:has(input[type="checkbox"]:checked) > label::before {
	content: "";

	display: inline-block;

	width: 0.55rem;
	height: 0.55rem;

	background: var(--ww-color-black);

	border-radius: 999px;

	box-shadow: 0 0 0 3px rgba(0,0,0,.12);
}

/* ==========================================
   ATTRIBUTE DROPDOWN PANELS
========================================== */

body .content-filter .attribute-set {
	position: absolute;
	top: calc(100% + 0.65rem);
	left: 0;
	z-index: 90;

	display: grid;
	gap: 0.45rem;

	width: max-content;
	min-width: 270px;
	max-width: min(88vw, 380px);

	padding: 0.75rem;

	background: var(--ww-color-white);
	color: var(--ww-color-black);

	border: 1px solid rgba(0,0,0,.08);
	border-radius: var(--ww-radius-m);

	box-shadow:
		0 18px 44px rgba(0,0,0,.24),
		inset 0 1px 0 rgba(255,255,255,.85);
}

/* Keep EOS hidden class respected */

body .content-filter .attribute-set.hidden,
body .content-filter .filter-summary.hidden,
body .content-filter .button.clear.hidden {
	display: none !important;
}

/* ==========================================
   ATTRIBUTE DROPDOWN ITEMS
========================================== */

body .content-filter .attribute-member {
	display: grid !important;
	grid-template-columns: minmax(0, 1fr) auto auto;
	align-items: center;
	gap: 0.65rem;

	width: 100%;

	margin: 0 !important;
	padding: 0.65rem 0.75rem !important;

	background: rgba(0,0,0,.035);
	border: 1px solid rgba(0,0,0,.06);
	border-radius: var(--ww-radius-s);

	color: var(--ww-color-black);

	transition:
		background-color var(--ww-transition-fast),
		border-color var(--ww-transition-fast),
		transform var(--ww-transition-fast);
}

body .content-filter .attribute-member:hover,
body .content-filter .attribute-member:focus-within {
	background: rgba(217,147,14,.12);
	border-color: rgba(217,147,14,.35);

	transform: translateY(-1px);
}

body .content-filter .attribute-member:has(input[type="checkbox"]:checked) {
	background: rgba(217,147,14,.18);
	border-color: rgba(217,147,14,.55);

	box-shadow: inset 4px 0 0 var(--ww-color-orange);
}

body .content-filter .attribute-member label {
	margin: 0 !important;

	color: var(--ww-color-black) !important;

	font-size: 0.92rem;
	font-weight: 800;
	line-height: 1.25;

	cursor: pointer;
}

body .content-filter .attribute-member input[type="checkbox"] {
	width: 17px;
	height: 17px;

	margin: 0 !important;

	accent-color: var(--ww-color-orange);

	cursor: pointer;
}

body .content-filter .attribute-member .item-count {
	display: inline-flex;
	align-items: center;
	justify-content: center;

	min-width: 28px;
	height: 24px;

	padding: 0 0.45rem;

	background: var(--ww-color-black);
	color: var(--ww-color-orange);

	border-radius: 999px;

	font-size: 0.78rem;
	font-weight: 900;
	line-height: 1;
}

/* Clear button inside dropdown */

body .content-filter .attribute-set .button.clear {
	justify-self: start;

	min-height: 34px;

	margin-top: 0.25rem !important;
	padding: 0.45rem 0.8rem !important;

	background: var(--ww-color-black);
	color: var(--ww-color-orange) !important;

	border-color: var(--ww-color-black);
	border-radius: 999px;

	font-size: 0.8rem;
	font-weight: 900;
	line-height: 1;
	text-decoration: none;
}

body .content-filter .attribute-set .button.clear:hover,
body .content-filter .attribute-set .button.clear:focus {
	background: var(--ww-color-orange);
	color: var(--ww-color-black) !important;
	border-color: var(--ww-color-orange);
}

/* ==========================================
   RESULT COUNT
   Explicitly scoped so Browse by Hub cannot steal its styling.
========================================== */

body .content-filter .attribute-filter .result-count {
	position: relative;
	z-index: 5;

	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	gap: 0.65rem;

	min-height: 46px;

	margin: 0 !important;
	padding: 0.75rem 1rem !important;

	background: rgba(255,255,255,.12) !important;
	color: var(--ww-color-white) !important;

	border: 1px solid rgba(255,255,255,.22) !important;
	border-radius: 999px !important;

	box-shadow:
		inset 0 1px 0 rgba(255,255,255,.08),
		0 10px 24px rgba(0,0,0,.1);
}

body .content-filter .attribute-filter .result-count > label {
	display: inline-flex;
	align-items: center;

	margin: 0 !important;
	padding: 0 !important;

	background: transparent !important;
	color: var(--ww-color-white) !important;

	border: 0 !important;
	box-shadow: none !important;

	font-size: 0.8rem !important;
	font-weight: 900 !important;
	line-height: 1 !important;
	letter-spacing: 0.06em !important;
	text-transform: uppercase !important;
	white-space: nowrap;
}

body .content-filter .attribute-filter .result-count-value {
	display: inline-flex;
	align-items: center;
	justify-content: center;

	min-width: 32px;
	height: 28px;

	margin: 0 !important;
	padding: 0 0.55rem !important;

	background: var(--ww-color-orange) !important;
	color: var(--ww-color-black) !important;

	border-radius: 999px;

	font-size: 0.9rem;
	font-weight: 900;
	line-height: 1;
}

/* ==========================================
   ACTIVE FILTER SUMMARY
========================================== */

body .content-filter .filter-summary {
	position: relative;
	isolation: isolate;

	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	align-items: center;
	gap: 0.85rem 1rem;

	width: 100%;

	margin-top: clamp(1rem, 2vw, 1.35rem) !important;
	padding: clamp(0.85rem, 1.5vw, 1.1rem) !important;

	background:
		radial-gradient(circle at 8% 50%, rgba(217,147,14,.16), transparent 38%),
		rgba(255,255,255,.1);

	border: 1px solid rgba(255,255,255,.2);
	border-radius: var(--ww-radius-m);

	box-shadow:
		inset 0 1px 0 rgba(255,255,255,.1),
		0 12px 32px rgba(0,0,0,.16);

	overflow: hidden;
}

body .content-filter .filter-summary::before {
	content: "Selected filters";

	position: relative;
	z-index: 1;

	grid-column: 1 / -1;

	display: block;

	margin: 0 0 0.1rem !important;

	color: rgba(255,255,255,.62);

	font-size: 0.76rem;
	font-weight: 950;
	line-height: 1;
	letter-spacing: 0.09em;
	text-transform: uppercase;
}

body .content-filter .summary-parts {
	position: relative;
	z-index: 1;

	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 0.55rem;

	min-width: 0;

	color: var(--ww-color-white);

	font-size: 0.9rem;
	font-weight: 800;
}

/* Individual selected filter chip */

body .content-filter .attribute-selected {
	position: relative;

	display: inline-flex;
	align-items: center;
	gap: 0.45rem;

	min-height: 36px;

	margin: 0 !important;
	padding: 0.4rem 0.45rem 0.4rem 0.85rem !important;

	background: var(--ww-color-white);
	color: var(--ww-color-black);

	border: 1px solid rgba(217,147,14,.55);
	border-radius: 999px;

	box-shadow:
		0 8px 22px rgba(0,0,0,.14),
		inset 0 1px 0 rgba(255,255,255,.9);
}

body .content-filter .attribute-selected::before {
	content: "";

	display: inline-block;
	flex: 0 0 auto;

	width: 0.55rem;
	height: 0.55rem;

	background: var(--ww-color-orange);

	border-radius: 999px;

	box-shadow: 0 0 0 3px rgba(217,147,14,.16);
}

body .content-filter .attribute-selected label {
	margin: 0 !important;
	padding: 0 !important;

	color: var(--ww-color-black) !important;

	font-size: 0.86rem;
	font-weight: 900;
	line-height: 1.1;
}

/* Remove x button on each chip */

body .content-filter .attribute-selected .button.remove-filter {
	position: relative;

	display: inline-flex !important;
	align-items: center;
	justify-content: center;

	width: 26px;
	height: 26px;
	min-width: 26px;
	min-height: 26px;

	margin: 0 !important;
	padding: 0 !important;

	background: var(--ww-color-black);
	color: var(--ww-color-orange) !important;

	border: 1px solid var(--ww-color-black);
	border-radius: 999px;

	font-size: 0 !important;
	line-height: 1;
	text-decoration: none;

	transition:
		background-color var(--ww-transition-fast),
		color var(--ww-transition-fast),
		border-color var(--ww-transition-fast),
		transform var(--ww-transition-fast);
}

body .content-filter .attribute-selected .button.remove-filter::before,
body .content-filter .attribute-selected .button.remove-filter::after {
	content: "";
	position: absolute;

	width: 10px;
	height: 2px;

	background: currentColor;
	border-radius: 999px;
}

body .content-filter .attribute-selected .button.remove-filter::before {
	transform: rotate(45deg);
}

body .content-filter .attribute-selected .button.remove-filter::after {
	transform: rotate(-45deg);
}

body .content-filter .attribute-selected .button.remove-filter:hover,
body .content-filter .attribute-selected .button.remove-filter:focus {
	background: var(--ww-color-orange);
	color: var(--ww-color-black) !important;
	border-color: var(--ww-color-orange);

	transform: scale(1.06);
}

/* Clear all button */

body .content-filter .filter-summary .button.clear-all {
	position: relative;
	z-index: 1;

	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	gap: 0.45rem;

	min-height: 38px;

	margin: 0 !important;
	padding: 0.62rem 1rem !important;

	background: transparent;
	color: var(--ww-color-white) !important;

	border: 2px solid rgba(255,255,255,.42);
	border-radius: 999px;

	font-size: 0.82rem;
	font-weight: 950;
	line-height: 1;
	text-decoration: none;
	white-space: nowrap;

	transition:
		background-color var(--ww-transition-fast),
		color var(--ww-transition-fast),
		border-color var(--ww-transition-fast),
		transform var(--ww-transition-fast);
}

body .content-filter .filter-summary .button.clear-all::after {
	content: "";

	display: inline-block;

	width: 0.45rem;
	height: 0.45rem;

	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;

	transform: rotate(-45deg);
}

body .content-filter .filter-summary .button.clear-all:hover,
body .content-filter .filter-summary .button.clear-all:focus {
	background: var(--ww-color-orange);
	color: var(--ww-color-black) !important;
	border-color: var(--ww-color-orange);

	transform: translateY(-1px);
}

/* ==========================================
   HIDE EMPTY FILTER SUMMARY
========================================== */

body .content-filter .filter-summary:not(:has(.attribute-selected)),
body .content-filter .filter-summary:has(.summary-parts:empty) {
	display: none !important;
}

/* ==========================================
   MOBILE ACTIVITIES FILTER
========================================== */

@media (max-width: 767px) {

	body .content-filter {
		padding-block: var(--ww-space-l);
	}

	body .content-filter > label {
		margin-bottom: 1rem;

		font-size: clamp(1.8rem, 10vw, 2.6rem);
	}

	body .content-filter .attribute-collection {
		display: grid !important;
		grid-template-columns: 1fr;
		gap: 1rem;

		padding: 1rem !important;

		border-radius: var(--ww-radius-m);
	}

	body .content-filter .attribute-collection > .layout-component.textblock,
	body .content-filter .attribute-collection > .categories.collapsible-always,
	body .content-filter .attribute-collection > .attribute-filter,
	body .content-filter .attribute-collection > .collation-filter.attribute-filter {
		width: 100%;
		min-width: 0;
	}

	body .content-filter .attribute-collection > .layout-component.textblock .button,
	body .content-filter .attribute-collection > .categories.collapsible-always > label.collapsible-trigger {
		width: 100%;
		justify-content: space-between;
	}

	body .content-filter .attribute-collection > .categories.collapsible-always > .content.collapsible-content {
		position: static;

		width: 100%;
		min-width: 0;
		max-width: none;

		margin-top: 0.65rem !important;

		box-shadow: 0 12px 30px rgba(0,0,0,.18);
	}

	body .content-filter .ps-header {
		display: grid !important;
		grid-template-columns: 1fr;
		gap: 0.85rem;
	}

	body .content-filter .ps-tab-container {
		display: grid !important;
		grid-template-columns: 1fr;
		gap: 0.65rem;
	}

	body .content-filter .attribute-filter-tab {
		display: block;
		width: 100%;
	}

	body .content-filter .attribute-filter-tab > label {
		width: 100%;
		justify-content: space-between;
	}

	body .content-filter .attribute-set {
		position: static;

		width: 100%;
		min-width: 0;
		max-width: none;

		margin-top: 0.65rem;

		box-shadow: 0 12px 30px rgba(0,0,0,.18);
	}

	body .content-filter .attribute-filter .result-count {
		justify-content: space-between;

		width: 100%;

		border-radius: var(--ww-radius-m) !important;
	}

	body .content-filter .filter-summary {
		grid-template-columns: 1fr;

		margin-top: 1rem !important;
	}

	body .content-filter .summary-parts {
		width: 100%;
	}

	body .content-filter .attribute-selected {
		width: 100%;
		justify-content: space-between;
	}

	body .content-filter .filter-summary .button.clear-all {
		width: 100%;
		justify-content: center;
	}

}

/* ==========================================
   REDUCED MOTION
========================================== */

@media (prefers-reduced-motion: reduce) {

	body .content-filter .attribute-collection > .layout-component.textblock .button,
	body .content-filter .attribute-collection > .layout-component.textblock .button::after,
	body .content-filter .attribute-collection > .categories.collapsible-always > label.collapsible-trigger,
	body .content-filter .attribute-collection > .categories.collapsible-always > label.collapsible-trigger::after,
	body .content-filter .attribute-collection > .categories.collapsible-always .iteration,
	body .content-filter .attribute-filter-tab > label,
	body .content-filter .attribute-filter-tab > label::after,
	body .content-filter .attribute-member,
	body .content-filter .attribute-selected .button.remove-filter,
	body .content-filter .filter-summary .button.clear-all {
		transition: none !important;
	}

	body .content-filter .attribute-collection > .layout-component.textblock .button:hover,
	body .content-filter .attribute-collection > .layout-component.textblock .button:focus,
	body .content-filter .attribute-collection > .layout-component.textblock .button:hover::after,
	body .content-filter .attribute-collection > .layout-component.textblock .button:focus::after,
	body .content-filter .attribute-collection > .categories.collapsible-always > label.collapsible-trigger:hover,
	body .content-filter .attribute-collection > .categories.collapsible-always > label.collapsible-trigger:focus,
	body .content-filter .attribute-collection > .categories.collapsible-always > label.collapsible-trigger:hover::after,
	body .content-filter .attribute-collection > .categories.collapsible-always > label.collapsible-trigger:focus::after,
	body .content-filter .attribute-collection > .categories.collapsible-always .iteration:hover,
	body .content-filter .attribute-collection > .categories.collapsible-always .iteration:focus-within,
	body .content-filter .attribute-filter-tab > label:hover,
	body .content-filter .attribute-filter-tab > label:focus,
	body .content-filter .attribute-filter-tab > label:hover::after,
	body .content-filter .attribute-filter-tab > label:focus::after,
	body .content-filter .attribute-member:hover,
	body .content-filter .attribute-member:focus-within,
	body .content-filter .attribute-selected .button.remove-filter:hover,
	body .content-filter .attribute-selected .button.remove-filter:focus,
	body .content-filter .filter-summary .button.clear-all:hover,
	body .content-filter .filter-summary .button.clear-all:focus {
		transform: none !important;
	}

}
 /* Begin CSS Part: Search Results */

 /* Begin CSS Part: Seo */

 /* Begin CSS Part: Shipping */

 /* Begin CSS Part: Snippets */
/* ==========================================
   FILE COMPONENTS
   Hide uploaded file name text, keep download buttons visible
========================================== */

body .layout-component.files .uploaded-file {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	gap: 0;

	width: 100%;

	margin: 0 !important;
	padding: 0 !important;

	font-size: 0 !important;
	line-height: 0 !important;

}

/* Restore visible buttons / links inside uploaded file components */

body .layout-component.files .uploaded-file a,
body .layout-component.files .uploaded-file .button {
	font-size: 0.9rem !important;
	line-height: 1 !important;
}

/* Optional: make download buttons fill their available space */

body .layout-component.files .uploaded-file .button {
	width: 100%;
	margin: 0 !important;
}
 /* Begin CSS Part: Social Media */

 /* Begin CSS Part: Sub Layout */
/* ==========================================
   TEAM GRID
   TEMPORARY 4ALL STYLING
========================================== */

body .team-grid {
	width: 100%;
	min-width: 0;
}

/* ==========================================
   TEAM SECTION WRAPPERS
========================================== */

body .team-grid > .layout-cell {
	width: 100%;
	min-width: 0;

	margin: 0 0 clamp(2.5rem, 5vw, 4.5rem) !important;
	padding: 0 !important;
}

body .team-grid > .layout-cell:last-child {
	margin-bottom: 0 !important;
}

/* Section headings */

body .team-grid > .layout-cell > .layout-cell:first-child {
	margin: 0 0 1.25rem !important;
	padding: 0 !important;
}

body .team-grid > .layout-cell > .layout-cell:first-child .textblock {
	margin: 0 !important;
	padding: 0 !important;
}

body .team-grid > .layout-cell > .layout-cell:first-child h2,
body .team-grid > .layout-cell > .textblock h2 {
	position: relative;

	margin: 0 !important;
	padding-bottom: 0.9rem;

	color: var(--ww-color-black);

	font-size: clamp(2rem, 4vw, 3.6rem);
	font-weight: 900;
	line-height: 1.02;
	letter-spacing: -0.055em;
}

body .team-grid > .layout-cell > .layout-cell:first-child h2::after,
body .team-grid > .layout-cell > .textblock h2::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;

	width: 90px;
	height: 6px;

	background: var(--ww-color-orange);
	border-radius: 999px;
}

/* ==========================================
   TEAM CONTENT GRID
========================================== */

body .team-grid .team-contents {
	display: grid !important;
	grid-template-columns: repeat(5, minmax(0, 1fr));
	gap: clamp(1rem, 2vw, 1.5rem);

	width: 100%;
	min-width: 0;

	margin: 0 !important;
	padding: clamp(1rem, 2vw, 1.5rem) 0 !important;

	overflow: visible !important;
}

/* ==========================================
   TEAM CARDS
========================================== */

body .team-grid .team-contents > .layout-component {
	position: relative;
	isolation: isolate;

	display: flex;
	flex-direction: column;
	align-items: center;

	min-width: 0;
	height: 100%;

	margin: 0 !important;
	padding: clamp(1.1rem, 2vw, 1.4rem) !important;

	background:
		linear-gradient(180deg, rgba(255,255,255,1), rgba(255,255,255,.96));

	border: 1px solid rgba(0,0,0,.08);
	border-radius: var(--ww-radius-l);

	box-shadow:
		0 14px 36px rgba(0,0,0,.07),
		inset 0 1px 0 rgba(255,255,255,.9);

	overflow: hidden;

	text-align: center;

	transition:
		transform var(--ww-transition-fast),
		box-shadow var(--ww-transition-fast),
		border-color var(--ww-transition-fast);
}

body .team-grid .team-contents > .layout-component::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;

	width: 100%;
	height: 6px;

	background: var(--ww-color-orange);

	pointer-events: none;
}

body .team-grid .team-contents > .layout-component::after {
	content: "";
	position: absolute;
	right: -48px;
	bottom: -48px;
	z-index: -1;

	width: 130px;
	height: 130px;

	background: rgba(217,147,14,.1);
	border-radius: 999px;

	pointer-events: none;

	transition:
		transform var(--ww-transition-medium),
		opacity var(--ww-transition-medium);
}

body .team-grid .team-contents > .layout-component:hover,
body .team-grid .team-contents > .layout-component:focus-within {
	transform: translateY(-4px);
	border-color: rgba(217,147,14,.42);

	box-shadow:
		0 22px 58px rgba(0,0,0,.11),
		inset 0 1px 0 rgba(255,255,255,.95);
}

body .team-grid .team-contents > .layout-component:hover::after {
	opacity: 0.95;
	transform: scale(1.12);
}

/* Cards with real bios */

body .team-grid .team-contents > .layout-component.team-card-has-bio,
body .team-grid .team-contents > .layout-component:has(.collapsible-content p) {
	cursor: pointer;
}

body .team-grid .team-contents > .layout-component.team-card-no-bio,
body .team-grid .team-contents > .layout-component:not(:has(.collapsible-content p)) {
	cursor: default !important;
}

/* ==========================================
   TEAM CARD CONTENT
========================================== */

body .team-grid .team-contents .component-topper {
	position: relative;
	z-index: 2;

	display: flex;
	flex-direction: column;
	align-items: center;

	width: 100%;
	min-width: 0;

	margin: 0 !important;
	padding: 0 !important;
}

body .team-grid .team-contents .component-topper p {
	margin: 0 0 0.65rem !important;
	padding: 0 !important;

	color: var(--ww-color-muted);

	font-size: 0.92rem;
	font-weight: 750;
	line-height: 1.35;
}

body .team-grid .team-contents .component-topper p:last-child {
	margin-bottom: 0 !important;
}

body .team-grid .team-contents .component-topper p:has(img),
body .team-grid .team-contents .component-topper h4:has(img) {
	width: 100%;

	margin: 0 0 0.9rem !important;
	padding: 0 !important;
}

body .team-grid .team-contents .component-topper img {
	display: block;

	width: min(100%, 190px) !important;
	height: auto !important;
	aspect-ratio: 1 / 1;

	margin: 0 auto !important;
	padding: 0 !important;

	object-fit: cover;
	object-position: center top;

	background: rgba(217,147,14,.08);
	border: 4px solid rgba(217,147,14,.18);
	border-radius: 999px;

	box-shadow: 0 12px 28px rgba(0,0,0,.10);
}


/* ==========================================
   TEAM CARD LINKEDIN
   Hide profile social links on the card.
   They are displayed inside the bio popup only.
========================================== */

body .team-grid .team-contents .component-topper .linkedin {
	display: none !important;
	visibility: hidden !important;
}

/* Name / role */

body .team-grid .team-contents h4 {
	margin: 0 0 0.35rem !important;

	color: var(--ww-color-black);

	font-size: clamp(1.05rem, 1.35vw, 1.32rem);
	font-weight: 900;
	line-height: 1.1;
	letter-spacing: -0.025em;
}

body .team-grid .team-contents h4 + h4 {
	margin-top: -0.15rem !important;
}

body .team-grid .team-contents .component-topper > p:not(:has(img)) {
	color: rgba(0,0,0,.62);

	font-size: 0.9rem;
	font-weight: 850;
	line-height: 1.35;
}

/* ==========================================
   BIO TRIGGERS
========================================== */

body .team-grid .team-contents > .layout-component > label.collapsible-trigger {
	position: relative;
	z-index: 2;

	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	gap: 0.45rem;

	min-height: 42px;

	margin: 1rem 0 0 !important;
	padding: 0.7rem 1rem !important;

	background: var(--ww-color-black);
	color: var(--ww-color-orange);

	border: 2px solid var(--ww-color-black);
	border-radius: 999px;

	font-size: 0.84rem;
	font-weight: 900;
	line-height: 1;
	text-decoration: none;

	cursor: pointer;

	transition:
		background-color var(--ww-transition-fast),
		color var(--ww-transition-fast),
		border-color var(--ww-transition-fast),
		transform var(--ww-transition-fast);
}

body .team-grid .team-contents > .layout-component > label.collapsible-trigger::after {
	content: "";

	display: inline-block;

	width: 0.42rem;
	height: 0.42rem;

	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;

	transform: rotate(45deg) translateY(-2px);
}

body .team-grid .team-contents > .layout-component > label.collapsible-trigger:hover,
body .team-grid .team-contents > .layout-component > label.collapsible-trigger:focus {
	background: var(--ww-color-orange);
	color: var(--ww-color-black);
	border-color: var(--ww-color-orange);

	transform: translateY(-1px);
}

/* Hide bio trigger if the bio content is empty */

body .team-grid .team-contents > .layout-component.team-card-no-bio > label.collapsible-trigger,
body .team-grid .team-contents > .layout-component:not(:has(.collapsible-content p)) > label.collapsible-trigger {
	display: none !important;
}

/* Whole-card trigger fallback */

body .team-grid .team-contents > .layout-component.collapsible-trigger:has(.collapsible-content p):not(:has(> label.collapsible-trigger)) .component-topper::after,
body .team-grid .team-contents > .layout-component.collapsible-always:has(.collapsible-content p):not(:has(> label.collapsible-trigger)) .component-topper::after {
	content: "View bio";

	position: relative;
	z-index: 2;

	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.45rem;

	min-height: 42px;

	margin: 1rem 0 0;
	padding: 0.7rem 1rem;

	background: var(--ww-color-black);
	color: var(--ww-color-orange);

	border: 2px solid var(--ww-color-black);
	border-radius: 999px;

	font-size: 0.84rem;
	font-weight: 900;
	line-height: 1;

	transition:
		background-color var(--ww-transition-fast),
		color var(--ww-transition-fast),
		border-color var(--ww-transition-fast),
		transform var(--ww-transition-fast);
}

body .team-grid .team-contents > .layout-component.collapsible-trigger:has(.collapsible-content p):hover .component-topper::after,
body .team-grid .team-contents > .layout-component.collapsible-always:has(.collapsible-content p):hover .component-topper::after {
	background: var(--ww-color-orange);
	color: var(--ww-color-black);
	border-color: var(--ww-color-orange);

	transform: translateY(-1px);
}

/* ==========================================
   ORIGINAL EOS BIO CONTENT
   The JS copies this into .team-bio-modal.
   Card-level content should never render on page.
========================================== */

body .team-grid .team-contents .collapsible-content,
body .team-grid .team-contents .collapsible-content.hidden,
body .team-grid .team-contents .collapsible-content.content-open,
body .team-grid .team-contents > .layout-component > .collapsible-content,
body .team-grid .team-contents > .layout-component > .collapsible-content.hidden,
body .team-grid .team-contents > .layout-component > .collapsible-content.content-open {
	display: none !important;
	visibility: hidden !important;
	opacity: 0 !important;

	position: static !important;
	inset: auto !important;
	z-index: auto !important;

	width: auto !important;
	height: auto !important;
	max-width: none !important;
	max-height: none !important;

	margin: 0 !important;
	padding: 0 !important;

	background: transparent !important;
	border: 0 !important;
	box-shadow: none !important;

	overflow: hidden !important;
	transform: none !important;
}

/* ==========================================
   TEAM BIO MODAL
   Page-level modal created by the team bio JS.
========================================== */

body.team-bio-open {
	overflow: hidden !important;
}

body .team-bio-modal {
	--team-bio-close-size: 38px;
	--team-bio-close-offset: 0.9rem;
	--team-bio-dialog-width: 920px;

	position: fixed !important;
	inset: 0 !important;
	z-index: 5600 !important;

	display: flex !important;
	align-items: center !important;
	justify-content: center !important;

	width: 100vw !important;
	height: 100vh !important;

	margin: 0 !important;
	padding: clamp(1rem, 3vw, 2rem) !important;

	background:
		radial-gradient(circle at 18% 22%, rgba(217,147,14,.28), transparent 34%),
		radial-gradient(circle at 82% 78%, rgba(217,147,14,.16), transparent 34%),
		rgba(0,0,0,.74) !important;

	backdrop-filter: blur(5px);
	-webkit-backdrop-filter: blur(5px);

	opacity: 1 !important;
	visibility: visible !important;

	pointer-events: auto !important;

	box-sizing: border-box !important;

	animation: teamBioFadeIn 0.22s ease-out both;
}

body .team-bio-modal[aria-hidden="true"] {
	display: none !important;
	opacity: 0 !important;
	visibility: hidden !important;
	pointer-events: none !important;
}

/* Modal dialog panel */

body .team-bio-modal .team-bio-modal__dialog {
	position: relative !important;
	z-index: 2 !important;
	isolation: isolate;

	display: grid !important;
	grid-template-columns: minmax(240px, 0.75fr) minmax(0, 1.25fr);
	gap: 0 !important;

	width: min(94vw, var(--team-bio-dialog-width)) !important;
	max-width: var(--team-bio-dialog-width) !important;
	max-height: min(86vh, 760px) !important;

	margin: 0 !important;
	padding: 0 !important;

	background:
		linear-gradient(180deg, rgba(255,255,255,1), rgba(255,255,255,.97)) !important;

	border: 1px solid rgba(217,147,14,.34) !important;
	border-radius: var(--ww-radius-l) !important;

	box-shadow:
		0 34px 100px rgba(0,0,0,.42),
		0 0 0 1px rgba(217,147,14,.08),
		inset 0 1px 0 rgba(255,255,255,.95) !important;

	overflow: hidden !important;

	transform: translateY(0) scale(1) !important;

	animation: teamBioDialogIn 0.25s ease-out both;
}

body .team-bio-modal .team-bio-modal__dialog::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	z-index: 5;

	width: 100%;
	height: 7px;

	background:
		linear-gradient(
			90deg,
			var(--ww-color-orange),
			rgba(217,147,14,.45),
			var(--ww-color-orange)
		);

	pointer-events: none;
}

/* Profile/image side */

body .team-bio-modal .team-bio-modal__profile {
	position: relative;
	z-index: 2;

	display: flex;
	flex-direction: column;

	min-width: 0;

	margin: 0 !important;
	padding: clamp(1.35rem, 3vw, 1.85rem) !important;

	background:
		radial-gradient(circle at 18% 18%, rgba(217,147,14,.28), transparent 38%),
		var(--ww-color-black);

	color: var(--ww-color-white);

	overflow: hidden;
}

body .team-bio-modal .team-bio-modal__profile .component-topper {
	margin: 0 !important;
	padding: 0 !important;
}

body .team-bio-modal .team-bio-modal__profile p {
	margin: 0 0 0.85rem !important;
	padding: 0 !important;

	color: rgba(255,255,255,.78);

	font-size: 0.98rem;
	line-height: 1.45;
}

body .team-bio-modal .team-bio-modal__profile p:has(img) {
	margin-bottom: 1.15rem !important;
}

body .team-bio-modal .team-bio-modal__profile img {
	display: block;

	width: 100% !important;
	height: auto !important;
	aspect-ratio: 1 / 1;

	margin: 0 !important;
	padding: 0 !important;

	object-fit: cover;
	object-position: center;

	border: 4px solid rgba(255,255,255,.14);
	border-radius: var(--ww-radius-l);

	box-shadow: 0 18px 46px rgba(0,0,0,.28);
}

body .team-bio-modal .team-bio-modal__profile h4 {
	margin: 0 0 0.25rem !important;
	padding: 0 !important;

	color: var(--ww-color-white);

	font-size: clamp(1.35rem, 2.2vw, 2rem);
	font-weight: 900;
	line-height: 1.08;
	letter-spacing: -0.045em;
}

body .team-bio-modal .team-bio-modal__profile h4 + p,
body .team-bio-modal .team-bio-modal__profile h4 + h4 + p {
	margin-top: 0.45rem !important;

	color: var(--ww-color-orange);

	font-size: 0.9rem;
	font-weight: 900;
	line-height: 1.35;
}

/* LinkedIn profile link inside the bio modal */

body .team-bio-modal .team-bio-modal__profile .linkedin {
	display: flex !important;
	align-items: center !important;
	justify-content: flex-start !important;

	width: 100%;

	margin: 1rem 0 0 !important;
	padding: 0 !important;
}

body .team-bio-modal .team-bio-modal__profile .linkedin a {
	position: relative;
	isolation: isolate;

	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 0.55rem;

	min-height: 42px;

	margin: 0 !important;
	padding: 0.72rem 1rem !important;

	background:
		radial-gradient(circle at 28% 22%, rgba(255,255,255,.24), transparent 34%),
		linear-gradient(180deg, rgba(217,147,14,.22), rgba(217,147,14,.1));
	color: var(--ww-color-white) !important;

	border: 1px solid rgba(217,147,14,.48);
	border-radius: 999px;

	box-shadow:
		0 12px 30px rgba(0,0,0,.22),
		0 0 22px rgba(217,147,14,.14),
		inset 0 1px 0 rgba(255,255,255,.14);

	font-size: 0.82rem;
	font-weight: 900;
	line-height: 1;
	text-decoration: none !important;

	overflow: hidden;

	transition:
		background-color var(--ww-transition-fast),
		color var(--ww-transition-fast),
		border-color var(--ww-transition-fast),
		box-shadow var(--ww-transition-fast),
		transform var(--ww-transition-fast);
}

body .team-bio-modal .team-bio-modal__profile .linkedin a::after {
	content: "View LinkedIn profile";

	position: relative;
	z-index: 2;

	display: inline-block;
}

body .team-bio-modal .team-bio-modal__profile .linkedin img {
	position: relative;
	z-index: 2;

	display: block;

	width: 20px !important;
	height: 20px !important;
	min-width: 20px !important;
	min-height: 20px !important;
	max-width: 20px !important;
	max-height: 20px !important;
	aspect-ratio: auto !important;

	margin: 0 !important;
	padding: 0 !important;

	object-fit: contain !important;
	object-position: center !important;

	background: transparent !important;
	border: 0 !important;
	border-radius: 0 !important;

	box-shadow: none !important;

	filter:
		brightness(0) invert(1)
		drop-shadow(0 5px 10px rgba(0,0,0,.22));

	transition:
		filter var(--ww-transition-fast),
		transform var(--ww-transition-fast);
}

body .team-bio-modal .team-bio-modal__profile .linkedin a:hover,
body .team-bio-modal .team-bio-modal__profile .linkedin a:focus {
	background: var(--ww-color-orange);
	color: var(--ww-color-black) !important;
	border-color: var(--ww-color-orange);

	box-shadow:
		0 16px 36px rgba(0,0,0,.28),
		0 0 26px rgba(217,147,14,.26),
		inset 0 1px 0 rgba(255,255,255,.22);

	transform: translateY(-2px);
}

body .team-bio-modal .team-bio-modal__profile .linkedin a:hover img,
body .team-bio-modal .team-bio-modal__profile .linkedin a:focus img {
	filter:
		brightness(0) saturate(100%)
		drop-shadow(0 6px 12px rgba(0,0,0,.22));

	transform: scale(1.08);
}

body .team-bio-modal .team-bio-modal__profile .linkedin a:focus-visible {
	outline: 3px solid rgba(217,147,14,.45);
	outline-offset: 4px;
}

/* Content side */

body .team-bio-modal .team-bio-modal__content {
	position: relative;
	z-index: 2;

	min-width: 0;
	max-height: min(86vh, 760px);

	margin: 0 !important;
	padding:
		clamp(2.35rem, 4vw, 3rem)
		clamp(2.2rem, 4.5vw, 3.4rem)
		clamp(1.5rem, 3vw, 2.5rem)
		clamp(1.6rem, 3.4vw, 2.4rem) !important;

	background: var(--ww-color-white);

	overflow-y: auto;
	overflow-x: hidden;

	scrollbar-width: thin;
	scrollbar-color: rgba(217,147,14,.85) rgba(0,0,0,.08);
}

body .team-bio-modal .team-bio-modal__content::-webkit-scrollbar {
	width: 10px;
}

body .team-bio-modal .team-bio-modal__content::-webkit-scrollbar-track {
	background: rgba(0,0,0,.06);
	border-radius: 999px;
}

body .team-bio-modal .team-bio-modal__content::-webkit-scrollbar-thumb {
	background: rgba(217,147,14,.85);
	border-radius: 999px;
}

body .team-bio-modal .team-bio-modal__bio {
	position: relative;

	margin: 0 !important;
	padding: 0 !important;

	color: var(--ww-color-muted);

	font-size: clamp(1.02rem, 1.25vw, 1.13rem);
	line-height: 1.72;
}

body .team-bio-modal .team-bio-modal__bio p {
	margin: 0 0 1rem !important;
	padding: 0 !important;
}

body .team-bio-modal .team-bio-modal__bio p:last-child {
	margin-bottom: 0 !important;
}

body .team-bio-modal .team-bio-modal__bio strong {
	color: var(--ww-color-black);
	font-weight: 900;
}

body .team-bio-modal .team-bio-modal__bio a {
	color: var(--ww-color-black);
	font-weight: 900;
	text-decoration-color: var(--ww-color-orange);
	text-decoration-thickness: 2px;
	text-underline-offset: 4px;
}

/* Close button */

body .team-bio-modal .team-bio-modal__close {
	position: absolute !important;
	top: var(--team-bio-close-offset) !important;
	right: var(--team-bio-close-offset) !important;
	z-index: 20 !important;

	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;

	width: var(--team-bio-close-size) !important;
	height: var(--team-bio-close-size) !important;
	min-width: var(--team-bio-close-size) !important;
	min-height: var(--team-bio-close-size) !important;

	margin: 0 !important;
	padding: 0 !important;

	background: var(--ww-color-black) !important;
	color: var(--ww-color-orange) !important;

	border: 2px solid rgba(255,255,255,.12) !important;
	border-radius: 999px !important;

	box-shadow:
		0 10px 26px rgba(0,0,0,.18),
		inset 0 1px 0 rgba(255,255,255,.12) !important;

	font-size: 0 !important;
	line-height: 1 !important;

	cursor: pointer !important;

	transition:
		background-color var(--ww-transition-fast),
		color var(--ww-transition-fast),
		border-color var(--ww-transition-fast),
		transform var(--ww-transition-fast),
		box-shadow var(--ww-transition-fast);
}

body .team-bio-modal .team-bio-modal__close::before,
body .team-bio-modal .team-bio-modal__close::after {
	content: "";
	position: absolute;

	width: 14px;
	height: 3px;

	background: currentColor;
	border-radius: 999px;

	transform-origin: center;
}

body .team-bio-modal .team-bio-modal__close::before {
	transform: rotate(45deg);
}

body .team-bio-modal .team-bio-modal__close::after {
	transform: rotate(-45deg);
}

body .team-bio-modal .team-bio-modal__close:hover,
body .team-bio-modal .team-bio-modal__close:focus {
	background: var(--ww-color-orange) !important;
	color: var(--ww-color-black) !important;
	border-color: var(--ww-color-orange) !important;

	box-shadow:
		0 14px 34px rgba(0,0,0,.24),
		0 0 24px rgba(217,147,14,.24) !important;

	transform: translateY(-2px);
}

/* ==========================================
   TEAM BIO MODAL ANIMATION
========================================== */

@keyframes teamBioFadeIn {

	from {
		opacity: 0;
	}

	to {
		opacity: 1;
	}

}

@keyframes teamBioDialogIn {

	from {
		opacity: 0;
		transform: translateY(18px) scale(.97);
	}

	to {
		opacity: 1;
		transform: translateY(0) scale(1);
	}

}

/* ==========================================
   VOLUNTEERS BLOCK
========================================== */

body .team-grid > .layout-cell.center > .textblock {
	position: relative;
	isolation: isolate;

	padding: clamp(1.5rem, 3vw, 2.25rem) !important;

	background:
		radial-gradient(circle at 88% 12%, rgba(217,147,14,.14), transparent 34%),
		var(--ww-color-white);

	border: 1px solid rgba(217,147,14,.22);
	border-radius: var(--ww-radius-l);

	box-shadow:
		0 16px 44px rgba(0,0,0,.08),
		inset 0 1px 0 rgba(255,255,255,.9);

	overflow: hidden;
}

body .team-grid > .layout-cell.center > .textblock::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;

	width: 100%;
	height: 6px;

	background: var(--ww-color-orange);
}

body .team-grid > .layout-cell.center > .textblock h2 {
	margin: 0 0 0.75rem !important;

	color: var(--ww-color-black);

	font-size: clamp(2rem, 4vw, 3.2rem);
	font-weight: 900;
	line-height: 1.05;
	letter-spacing: -0.045em;
}

body .team-grid > .layout-cell.center > .textblock p {
	margin: 0 0 1rem !important;

	color: var(--ww-color-muted);

	font-size: 1.05rem;
	line-height: 1.65;
}

body .team-grid > .layout-cell.center > .textblock p:has(img) {
	margin: 1.5rem 0 0 !important;
}

body .team-grid > .layout-cell.center > .textblock p img {
	display: block;

	width: 100% !important;
	height: auto !important;
	max-height: 520px;

	object-fit: cover;
	object-position: center;

	border-radius: var(--ww-radius-m);

	box-shadow: 0 18px 50px rgba(0,0,0,.14);
}

/* ==========================================
   TABLET TEAM GRID
========================================== */

@media (min-width: 768px) and (max-width: 1200px) {

	body .team-grid .team-contents {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	body .team-grid .team-contents .component-topper img {
		width: min(100%, 170px) !important;
	}

}

/* ==========================================
   TEAM BIO MODAL RESPONSIVE
========================================== */

@media (max-width: 900px) {

	body .team-bio-modal .team-bio-modal__dialog {
		grid-template-columns: 1fr;

		width: min(94vw, 620px) !important;
		max-height: calc(100vh - 2rem) !important;
	}

	body .team-bio-modal .team-bio-modal__profile {
		padding: 1.35rem !important;
	}

	body .team-bio-modal .team-bio-modal__profile img {
		border-radius: var(--ww-radius-m);
	}

	body .team-bio-modal .team-bio-modal__profile p:has(img) {
		margin: 0 !important;
	}

	body .team-bio-modal .team-bio-modal__content {
		max-height: 50vh;

		padding:
			1.45rem
			1.35rem
			1.35rem
			1.35rem !important;
	}

}

/* ==========================================
   MOBILE TEAM GRID
========================================== */

@media (max-width: 767px) {

	body .team-grid > .layout-cell {
		margin-bottom: 3rem !important;
	}

	body .team-grid > .layout-cell > .layout-cell:first-child h2,
	body .team-grid > .layout-cell > .textblock h2 {
		font-size: clamp(1.9rem, 10vw, 2.8rem);
	}

	body .team-grid .team-contents {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 1rem;

		padding-block: 1rem !important;
	}

	body .team-grid .team-contents > .layout-component {
		padding: 1rem !important;

		border-radius: var(--ww-radius-m);
	}

	body .team-grid .team-contents .component-topper img {
		width: min(100%, 140px) !important;
	}

	body .team-grid .team-contents h4 {
		font-size: 1rem;
	}

	body .team-grid .team-contents .component-topper > p:not(:has(img)) {
		font-size: 0.84rem;
	}

	body .team-grid .team-contents > .layout-component > label.collapsible-trigger,
	body .team-grid .team-contents > .layout-component.collapsible-trigger:has(.collapsible-content p):not(:has(> label.collapsible-trigger)) .component-topper::after,
	body .team-grid .team-contents > .layout-component.collapsible-always:has(.collapsible-content p):not(:has(> label.collapsible-trigger)) .component-topper::after {
		width: 100%;
		min-height: 40px;

		font-size: 0.78rem;
	}

	body .team-grid > .layout-cell.center > .textblock {
		border-radius: var(--ww-radius-m);
	}

}

/* ==========================================
   MOBILE TEAM BIO MODAL
========================================== */

@media (max-width: 560px) {

	body .team-bio-modal {
		--team-bio-close-size: 34px;
		--team-bio-close-offset: 0.65rem;

		padding: 0.75rem !important;
	}

	body .team-bio-modal .team-bio-modal__dialog {
		width: calc(100vw - 1.5rem) !important;
		max-height: calc(100vh - 1.5rem) !important;

		border-radius: var(--ww-radius-m) !important;
	}

	body .team-bio-modal .team-bio-modal__profile {
		display: flex !important;
		align-items: center !important;
		justify-content: center !important;

		padding: 1.25rem 1rem 1.4rem !important;
	}

	body .team-bio-modal .team-bio-modal__profile .component-topper {
		display: grid !important;
		grid-template-columns: 96px minmax(0, 1fr);
		align-items: center;
		gap: 1rem;

		width: min(100%, 430px) !important;
		max-width: 100%;

		margin: 0 auto !important;
		padding: 0 2.4rem 0 0 !important;

		text-align: left;
	}

	body .team-bio-modal .team-bio-modal__profile p:has(img),
	body .team-bio-modal .team-bio-modal__profile h4:has(img) {
		grid-row: 1 / span 3;

		width: 96px !important;
		margin: 0 !important;
		padding: 0 !important;
	}

	body .team-bio-modal .team-bio-modal__profile img {
		width: 96px !important;
		height: 96px !important;

		border-radius: var(--ww-radius-m);
	}

	body .team-bio-modal .team-bio-modal__profile h4 {
		margin: 0 !important;

		font-size: clamp(1.35rem, 6.5vw, 1.85rem);
		line-height: 1;
		letter-spacing: -0.04em;
	}

	body .team-bio-modal .team-bio-modal__profile h4 + h4 {
		margin-top: -0.1rem !important;
	}

	body .team-bio-modal .team-bio-modal__profile .component-topper > p:not(:has(img)) {
		margin: 0.35rem 0 0 !important;

		font-size: 0.95rem;
		line-height: 1.25;
	}

	body .team-bio-modal .team-bio-modal__profile .linkedin {
		grid-column: 2;

		width: auto;

		margin: 0.7rem 0 0 !important;
	}

	body .team-bio-modal .team-bio-modal__profile .linkedin a {
		min-height: 38px;

		padding: 0.62rem 0.8rem !important;

		font-size: 0.78rem;
	}

	body .team-bio-modal .team-bio-modal__profile .linkedin img {
		width: 18px !important;
		height: 18px !important;
		min-width: 18px !important;
		min-height: 18px !important;
		max-width: 18px !important;
		max-height: 18px !important;
	}

	body .team-bio-modal .team-bio-modal__content {
		max-height: 54vh;

		padding:
			1.25rem
			1rem
			1rem
			1rem !important;

		font-size: 1rem;
	}

	body .team-bio-modal .team-bio-modal__close::before,
	body .team-bio-modal .team-bio-modal__close::after {
		width: 13px;
		height: 2.5px;
	}

}

/* ==========================================
   SMALL MOBILE TEAM GRID
========================================== */

@media (max-width: 480px) {

	body .team-grid .team-contents {
		grid-template-columns: 1fr;
	}

	body .team-grid .team-contents .component-topper img {
		width: min(100%, 170px) !important;
	}

}

/* ==========================================
   REDUCED MOTION
========================================== */

@media (prefers-reduced-motion: reduce) {

	body .team-bio-modal,
	body .team-bio-modal .team-bio-modal__dialog {
		animation: none !important;
	}

	body .team-grid .team-contents > .layout-component,
	body .team-grid .team-contents > .layout-component::after,
	body .team-grid .team-contents > .layout-component > label.collapsible-trigger,
	body .team-bio-modal .team-bio-modal__profile .linkedin a,
	body .team-bio-modal .team-bio-modal__profile .linkedin img,
	body .team-bio-modal .team-bio-modal__close {
		transition: none !important;
	}

}


/* ==========================================
   SPONSORS / PARTNERS LOGO GRID
   TEMPORARY 4ALL STYLING
========================================== */

body .open-sponsors {
	width: 100%;
	min-width: 0;

	margin: 0 !important;
	padding: 0 !important;
}

/* Main wrapper */

body .open-sponsors > .layout {
	width: 100%;
	min-width: 0;
}

/* ==========================================
   LOGO GRID
========================================== */

body .open-sponsors .flex-grid {
	display: grid !important;
	grid-template-columns: repeat(6, minmax(0, 1fr));
	gap: clamp(1rem, 2vw, 1.5rem);

	width: 100%;
	min-width: 0;

	margin: 0 !important;
	padding: clamp(1rem, 2vw, 1.5rem) 0 !important;
}

/* Hide empty CMS placeholders */

body .open-sponsors .flex-grid > .layout-component.empty {
	display: none !important;
}

/* ==========================================
   LOGO CARD
========================================== */

body .open-sponsors .flex-grid > .layout-component {
	position: relative;
	isolation: isolate;

	display: flex;
	align-items: center;
	justify-content: center;

	min-width: 0;
	min-height: clamp(135px, 11vw, 175px);

	margin: 0 !important;
	padding: clamp(0.75rem, 1.4vw, 1rem) !important;

	background: var(--ww-color-white);

	border: 1px solid rgba(0,0,0,.08);
	border-radius: var(--ww-radius-l);

	box-shadow:
		0 14px 36px rgba(0,0,0,.07),
		inset 0 1px 0 rgba(255,255,255,.9);

	overflow: hidden;

	transition:
		transform var(--ww-transition-fast),
		box-shadow var(--ww-transition-fast),
		border-color var(--ww-transition-fast);
}

/* Top accent on every logo card */

body .open-sponsors .flex-grid > .layout-component::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	z-index: 2;

	width: 100%;
	height: 5px;

	background: var(--ww-color-orange);

	pointer-events: none;
}

/* Linked logo cards get interaction */

body .open-sponsors .flex-grid > .layout-component:has(a.inflate) {
	cursor: pointer;
}

body .open-sponsors .flex-grid > .layout-component:has(a.inflate):hover,
body .open-sponsors .flex-grid > .layout-component:has(a.inflate):focus-within {
	transform: translateY(-4px);
	border-color: rgba(217,147,14,.42);

	box-shadow:
		0 22px 58px rgba(0,0,0,.11),
		inset 0 1px 0 rgba(255,255,255,.95);
}

/* Static logo cards still get a subtle polish */

body .open-sponsors .flex-grid > .layout-component:not(:has(a.inflate)):hover {
	border-color: rgba(217,147,14,.22);
}

/* ==========================================
   LOGO IMAGE HANDLING
========================================== */

body .open-sponsors .flex-grid > .layout-component p {
	display: flex;
	align-items: center;
	justify-content: center;

	width: 100%;
	height: 100%;

	margin: 0 !important;
	padding: 0 !important;
}

body .open-sponsors .flex-grid > .layout-component img {
	display: block;

	width: 100% !important;
	height: 100% !important;
	max-width: none !important;
	max-height: none !important;

	margin: 0 !important;
	padding: 0 !important;

	object-fit: contain;
	object-position: center;

	background: transparent !important;

	transition:
		transform var(--ww-transition-fast),
		opacity var(--ww-transition-fast);
}

body .open-sponsors .flex-grid > .layout-component:has(a.inflate):hover img,
body .open-sponsors .flex-grid > .layout-component:has(a.inflate):focus-within img {
	transform: scale(1.025);
}

/* Stop broken/placeholder lazyload images looking huge */

body .open-sponsors .flex-grid > .layout-component img[src*="lazyload-placeholder"] {
	opacity: 0.25;
}

/* ==========================================
   LINK OVERLAY
========================================== */

body .open-sponsors .flex-grid > .layout-component > a.inflate {
	position: absolute !important;
	inset: 0 !important;
	z-index: 5 !important;

	display: block !important;

	width: 100% !important;
	height: 100% !important;

	margin: 0 !important;
	padding: 0 !important;

	font-size: 0 !important;
	line-height: 0 !important;
	text-indent: -9999px !important;

	background: transparent !important;
	color: transparent !important;

	border: 0 !important;
	box-shadow: none !important;

	text-decoration: none !important;
}

/* External-link marker for linked cards */

body .open-sponsors .flex-grid > .layout-component:has(a.inflate)::after {
	content: "";

	position: absolute;
	right: 0.8rem;
	bottom: 0.8rem;
	z-index: 3;

	width: 0.48rem;
	height: 0.48rem;

	border-right: 2px solid var(--ww-color-orange);
	border-bottom: 2px solid var(--ww-color-orange);

	transform: rotate(-45deg);

	opacity: 0.72;

	pointer-events: none;

	transition:
		opacity var(--ww-transition-fast),
		transform var(--ww-transition-fast);
}

body .open-sponsors .flex-grid > .layout-component:has(a.inflate):hover::after,
body .open-sponsors .flex-grid > .layout-component:has(a.inflate):focus-within::after {
	opacity: 1;
	transform: rotate(-45deg) translate(2px, -2px);
}

/* ==========================================
   TABLET SPONSORS
========================================== */

@media (min-width: 768px) and (max-width: 1200px) {

	body .open-sponsors .flex-grid {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}

	body .open-sponsors .flex-grid > .layout-component {
		min-height: 145px;
	}

}

/* ==========================================
   MOBILE SPONSORS
========================================== */

@media (max-width: 767px) {

	body .open-sponsors .flex-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 0.85rem;

		padding-block: 1rem !important;
	}

	body .open-sponsors .flex-grid > .layout-component {
		min-height: 125px;
		padding: 0.65rem !important;

		border-radius: var(--ww-radius-m);
	}

	body .open-sponsors .flex-grid > .layout-component:has(a.inflate)::after {
		right: 0.65rem;
		bottom: 0.65rem;
	}

}

/* ==========================================
   SMALL MOBILE SPONSORS
========================================== */

@media (max-width: 420px) {

	body .open-sponsors .flex-grid {
		grid-template-columns: 1fr;
	}

	body .open-sponsors .flex-grid > .layout-component {
		min-height: 125px;
	}

}










/* ==========================================
   ACCREDITATIONS LOGO GRID
   TEMPORARY 4ALL STYLING
========================================== */

body .open-accreditations {
	width: 100%;
	min-width: 0;

	margin: 0 !important;
	padding: 0 !important;
}

/* Main wrapper */

body .open-accreditations > .layout {
	width: 100%;
	min-width: 0;
}

/* ==========================================
   ACCREDITATIONS GRID
========================================== */

body .open-accreditations .flex-grid {
	display: grid !important;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: clamp(1rem, 2vw, 1.5rem);

	width: 100%;
	min-width: 0;

	margin: 0 !important;
	padding: clamp(1rem, 2vw, 1.5rem) 0 !important;
}

/* Hide empty CMS placeholders */

body .open-accreditations .flex-grid > .layout-component.empty {
	display: none !important;
}

/* ==========================================
   ACCREDITATION CARD
========================================== */

body .open-accreditations .flex-grid > .layout-component {
	position: relative;
	isolation: isolate;

	display: grid;
	grid-template-rows: minmax(150px, 1fr) auto;
	align-items: stretch;

	min-width: 0;
	min-height: clamp(230px, 18vw, 280px);

	margin: 0 !important;
	padding: clamp(0.75rem, 1.4vw, 1rem) !important;

	background: var(--ww-color-white);

	border: 1px solid rgba(0,0,0,.08);
	border-radius: var(--ww-radius-l);

	box-shadow:
		0 14px 36px rgba(0,0,0,.07),
		inset 0 1px 0 rgba(255,255,255,.9);

	overflow: hidden;

	text-align: center;

	transition:
		transform var(--ww-transition-fast),
		box-shadow var(--ww-transition-fast),
		border-color var(--ww-transition-fast);
}

/* Top accent on every card */

body .open-accreditations .flex-grid > .layout-component::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	z-index: 2;

	width: 100%;
	height: 5px;

	background: var(--ww-color-orange);

	pointer-events: none;
}

/* Linked cards get interaction */

body .open-accreditations .flex-grid > .layout-component:has(a.inflate) {
	cursor: pointer;
}

body .open-accreditations .flex-grid > .layout-component:has(a.inflate):hover,
body .open-accreditations .flex-grid > .layout-component:has(a.inflate):focus-within {
	transform: translateY(-4px);
	border-color: rgba(217,147,14,.42);

	box-shadow:
		0 22px 58px rgba(0,0,0,.11),
		inset 0 1px 0 rgba(255,255,255,.95);
}

/* Static cards still get a subtle polish */

body .open-accreditations .flex-grid > .layout-component:not(:has(a.inflate)):hover {
	border-color: rgba(217,147,14,.22);
}

/* ==========================================
   LOGO IMAGE HANDLING
========================================== */

body .open-accreditations .flex-grid > .layout-component > p,
body .open-accreditations .flex-grid > .layout-component p:has(img) {
	display: flex;
	align-items: center;
	justify-content: center;

	width: 100%;
	min-height: 150px;

	margin: 0 !important;
	padding: 0 !important;
}

body .open-accreditations .flex-grid > .layout-component > img,
body .open-accreditations .flex-grid > .layout-component p img {
	display: block;

	width: 100% !important;
	height: 100% !important;
	max-width: none !important;
	max-height: 150px !important;

	margin: 0 auto !important;
	padding: 0 !important;

	object-fit: contain;
	object-position: center;

	background: transparent !important;

	transition:
		transform var(--ww-transition-fast),
		opacity var(--ww-transition-fast);
}

body .open-accreditations .flex-grid > .layout-component:has(a.inflate):hover > img,
body .open-accreditations .flex-grid > .layout-component:has(a.inflate):focus-within > img,
body .open-accreditations .flex-grid > .layout-component:has(a.inflate):hover p img,
body .open-accreditations .flex-grid > .layout-component:has(a.inflate):focus-within p img {
	transform: scale(1.025);
}

/* Stop broken/placeholder lazyload images looking huge */

body .open-accreditations .flex-grid > .layout-component img[src*="lazyload-placeholder"] {
	opacity: 0.25;
}

/* ==========================================
   CARD FOOTER / ACCREDITATION NAME
========================================== */

body .open-accreditations .flex-grid > .layout-component .component-footer {
	position: relative;
	z-index: 2;

	display: flex;
	align-items: center;
	justify-content: center;

	width: calc(100% + (clamp(0.75rem, 1.4vw, 1rem) * 2));

	margin: clamp(0.85rem, 1.5vw, 1rem) calc(clamp(0.75rem, 1.4vw, 1rem) * -1) calc(clamp(0.75rem, 1.4vw, 1rem) * -1) !important;
	padding: 0.9rem 0.85rem !important;

	background: rgba(217,147,14,.08);

	border-top: 1px solid rgba(217,147,14,.18);
}

body .open-accreditations .flex-grid > .layout-component .component-footer h3 {
	margin: 0 !important;

	color: var(--ww-color-black);

	font-size: clamp(1rem, 1.25vw, 1.2rem);
	font-weight: 900;
	line-height: 1.2;
	letter-spacing: -0.025em;
	text-align: center;
}

/* ==========================================
   LINK OVERLAY
========================================== */

body .open-accreditations .flex-grid > .layout-component > a.inflate {
	position: absolute !important;
	inset: 0 !important;
	z-index: 5 !important;

	display: block !important;

	width: 100% !important;
	height: 100% !important;

	margin: 0 !important;
	padding: 0 !important;

	font-size: 0 !important;
	line-height: 0 !important;
	text-indent: -9999px !important;

	background: transparent !important;
	color: transparent !important;

	border: 0 !important;
	box-shadow: none !important;

	text-decoration: none !important;
}

/* External-link marker for linked cards */

body .open-accreditations .flex-grid > .layout-component:has(a.inflate)::after {
	content: "";

	position: absolute;
	right: 0.8rem;
	bottom: 0.8rem;
	z-index: 6;

	width: 0.48rem;
	height: 0.48rem;

	border-right: 2px solid var(--ww-color-orange);
	border-bottom: 2px solid var(--ww-color-orange);

	transform: rotate(-45deg);

	opacity: 0.72;

	pointer-events: none;

	transition:
		opacity var(--ww-transition-fast),
		transform var(--ww-transition-fast);
}

body .open-accreditations .flex-grid > .layout-component:has(a.inflate):hover::after,
body .open-accreditations .flex-grid > .layout-component:has(a.inflate):focus-within::after {
	opacity: 1;
	transform: rotate(-45deg) translate(2px, -2px);
}

/* ==========================================
   TABLET ACCREDITATIONS
========================================== */

@media (min-width: 768px) and (max-width: 1200px) {

	body .open-accreditations .flex-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	body .open-accreditations .flex-grid > .layout-component {
		min-height: 240px;
	}

	body .open-accreditations .flex-grid > .layout-component > p,
	body .open-accreditations .flex-grid > .layout-component p:has(img) {
		min-height: 145px;
	}

	body .open-accreditations .flex-grid > .layout-component > img,
	body .open-accreditations .flex-grid > .layout-component p img {
		max-height: 145px !important;
	}

}

/* ==========================================
   MOBILE ACCREDITATIONS
========================================== */

@media (max-width: 767px) {

	body .open-accreditations .flex-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 0.85rem;

		padding-block: 1rem !important;
	}

	body .open-accreditations .flex-grid > .layout-component {
		min-height: 220px;
		padding: 0.65rem !important;

		border-radius: var(--ww-radius-m);
	}

	body .open-accreditations .flex-grid > .layout-component > p,
	body .open-accreditations .flex-grid > .layout-component p:has(img) {
		min-height: 125px;
	}

	body .open-accreditations .flex-grid > .layout-component > img,
	body .open-accreditations .flex-grid > .layout-component p img {
		max-height: 125px !important;
	}

	body .open-accreditations .flex-grid > .layout-component .component-footer {
		width: calc(100% + 1.3rem);

		margin: 0.75rem -0.65rem -0.65rem !important;
		padding: 0.8rem 0.65rem !important;
	}

	body .open-accreditations .flex-grid > .layout-component .component-footer h3 {
		font-size: 0.95rem;
	}

	body .open-accreditations .flex-grid > .layout-component:has(a.inflate)::after {
		right: 0.65rem;
		bottom: 0.65rem;
	}

}

/* ==========================================
   SMALL MOBILE ACCREDITATIONS
========================================== */

@media (max-width: 420px) {

	body .open-accreditations .flex-grid {
		grid-template-columns: 1fr;
	}

	body .open-accreditations .flex-grid > .layout-component {
		min-height: 215px;
	}

}





/* ==========================================
   SUB FOOTER VISUAL NAV LINKS
   4 ALL FOUNDATION

   Structure:
   .page-section.page-subfooter
      .ctrl
         .mod_sub_layout
            .sub-footer
               .sub-footer-photo-card

   Notes:
   - Uses .page-subfooter as the section modifier.
   - h4 is optional and styled as a small badge.
   - label is the main destination title.
   - Desktop/tablet uses image crop cards.
   - Mobile stacks cards and shows full image height.
========================================== */


/* ==========================================
   OUTER SECTION
   Sub footer visual nav wrapper
========================================== */

body .page-subfooter {
	position: relative;
	isolation: isolate;

	padding-block: clamp(3rem, 6vw, 5rem);

	background:
		linear-gradient(
			180deg,
			var(--ww-color-white) 0%,
			rgba(217,147,14,.045) 48%,
			rgba(0,0,0,.96) 48%,
			var(--ww-color-black) 100%
		);

	overflow: hidden;
}

/* Subtle black footer depth without obvious orange cutoff */

body .page-subfooter::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 0;

	height: 52%;

	background:
		radial-gradient(circle at 50% 20%, rgba(255,255,255,.055), transparent 42%),
		linear-gradient(180deg, rgba(0,0,0,0), rgba(0,0,0,.18));

	pointer-events: none;
}

body .page-subfooter > .i {
	position: relative;
	z-index: 1;

	width: calc(100% - (var(--ww-page-gutter) * 2));
	max-width: var(--ww-container-max);

	margin-left: auto;
	margin-right: auto;
}

/* Keep EOS wrapper blocks clean */

body .page-subfooter .ctrl,
body .page-subfooter .mod_sub_layout {
	position: relative;
	z-index: 1;

	width: 100%;
	min-width: 0;

	margin: 0 !important;
}

/* Hide empty CMS override block */

body .page-subfooter .overrides.empty {
	display: none !important;
}


/* ==========================================
   SUB FOOTER GRID
========================================== */

body .page-subfooter .sub-footer {
	width: 100%;
	min-width: 0;

	margin: 0 !important;
	padding: 0 !important;
}

body .page-subfooter .sub-footer > .i {
	display: grid !important;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: clamp(1rem, 2vw, 1.5rem);

	width: 100%;
	min-width: 0;

	margin: 0 !important;
	padding: 0 !important;
}


/* ==========================================
   VISUAL NAV CARD
========================================== */

body .page-subfooter .sub-footer > .i > .layout-component {
	position: relative;
	isolation: isolate;

	min-width: 0;
	min-height: clamp(310px, 26vw, 430px);

	margin: 0 !important;
	padding: 0 !important;

	background:
		radial-gradient(circle at 92% 12%, rgba(217,147,14,.12), transparent 34%),
		linear-gradient(180deg, rgba(255,255,255,1), rgba(250,247,241,1));

	border: 1px solid rgba(217,147,14,.28);
	border-radius: var(--ww-radius-l);

	box-shadow:
		0 22px 64px rgba(0,0,0,.24),
		0 0 0 1px rgba(217,147,14,.07),
		inset 0 1px 0 rgba(255,255,255,.9);

	overflow: hidden;

	cursor: pointer;

	transition:
		transform var(--ww-transition-fast),
		box-shadow var(--ww-transition-fast),
		border-color var(--ww-transition-fast);
}

body .page-subfooter .sub-footer > .i > .layout-component::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	z-index: 6;

	width: 100%;
	height: 7px;

	background:
		linear-gradient(
			90deg,
			var(--ww-color-orange),
			rgba(217,147,14,.42),
			var(--ww-color-orange)
		);

	pointer-events: none;
}

body .page-subfooter .sub-footer > .i > .layout-component::after {
	content: "";
	position: absolute;
	right: -90px;
	top: -90px;
	z-index: 1;

	width: 220px;
	height: 220px;

	background: rgba(217,147,14,.12);
	border-radius: 999px;

	pointer-events: none;

	transition:
		transform var(--ww-transition-medium),
		opacity var(--ww-transition-medium);
}

body .page-subfooter .sub-footer > .i > .layout-component:hover,
body .page-subfooter .sub-footer > .i > .layout-component:focus-within {
	transform: translateY(-6px);

	border-color: rgba(217,147,14,.58);

	box-shadow:
		0 30px 84px rgba(0,0,0,.32),
		0 0 0 1px rgba(217,147,14,.14),
		0 0 34px rgba(217,147,14,.12),
		inset 0 1px 0 rgba(255,255,255,.94);
}

body .page-subfooter .sub-footer > .i > .layout-component:hover::after,
body .page-subfooter .sub-footer > .i > .layout-component:focus-within::after {
	opacity: .95;

	transform: scale(1.16);
}


/* ==========================================
   IMAGE / LOGO MEDIA AREA
   Desktop/tablet card treatment
========================================== */

body .page-subfooter .sub-footer > .i > .layout-component img {
	position: absolute;
	top: clamp(1rem, 1.8vw, 1.35rem);
	left: clamp(1rem, 1.8vw, 1.35rem);
	right: clamp(1rem, 1.8vw, 1.35rem);
	bottom: clamp(5.8rem, 7vw, 6.9rem);
	z-index: 2;

	display: block;

	width: calc(100% - (clamp(1rem, 1.8vw, 1.35rem) * 2)) !important;
	height: calc(100% - clamp(7rem, 8.5vw, 8.25rem)) !important;
	max-width: none !important;

	margin: 0 !important;
	padding: clamp(1rem, 1.8vw, 1.45rem) !important;

	object-fit: contain;
	object-position: center;

	background:
		radial-gradient(circle at 88% 12%, rgba(217,147,14,.1), transparent 34%),
		var(--ww-color-white);

	border: 1px solid rgba(217,147,14,.2);
	border-radius: calc(var(--ww-radius-l) - .5rem);

	box-shadow:
		0 14px 34px rgba(0,0,0,.08),
		inset 0 1px 0 rgba(255,255,255,.92);

	transform: scale(1);

	transition:
		transform 0.55s ease,
		filter 0.55s ease,
		box-shadow 0.55s ease;
}

body .page-subfooter .sub-footer > .i > .layout-component:hover img,
body .page-subfooter .sub-footer > .i > .layout-component:focus-within img {
	transform: scale(1.025);

	filter: saturate(1.04) contrast(1.02);

	box-shadow:
		0 18px 42px rgba(0,0,0,.11),
		0 0 24px rgba(217,147,14,.1),
		inset 0 1px 0 rgba(255,255,255,.95);
}

/* Photo crop mode */

body .page-subfooter .sub-footer > .i > .layout-component.sub-footer-photo-card img {
	padding: 0 !important;

	object-fit: cover;
	object-position: center;
}


/* ==========================================
   CARD H4 EYEBROW
========================================== */

body .page-subfooter .sub-footer > .i > .layout-component h4 {
	position: absolute;
	top: clamp(1rem, 1.8vw, 1.35rem);
	left: clamp(1rem, 1.8vw, 1.35rem);
	z-index: 5;

	display: inline-flex;
	align-items: center;
	gap: 0.45rem;

	max-width: calc(100% - 2rem);

	margin: 0 !important;
	padding: 0.5rem 0.75rem !important;

	background: rgba(255,255,255,.94);
	color: var(--ww-color-black);

	border: 1px solid rgba(217,147,14,.28);
	border-radius: 999px;

	box-shadow:
		0 12px 30px rgba(0,0,0,.12),
		inset 0 1px 0 rgba(255,255,255,.9);

	font-size: clamp(0.72rem, .8vw, 0.84rem);
	font-weight: 950;
	line-height: 1;
	letter-spacing: 0.02em;
	text-transform: uppercase;

	pointer-events: none;
}

body .page-subfooter .sub-footer > .i > .layout-component h4::before {
	content: "";

	display: block;

	width: 0.48rem;
	height: 0.48rem;

	background: var(--ww-color-orange);
	border: 2px solid var(--ww-color-black);
	border-radius: 999px;

	box-shadow: 0 0 0 4px rgba(217,147,14,.14);

	flex: 0 0 auto;
}

/* Hide h4 if EOS leaves it empty */

body .page-subfooter .sub-footer > .i > .layout-component h4:empty {
	display: none !important;
}


/* ==========================================
   CARD LABEL PANEL
========================================== */

body .page-subfooter .sub-footer > .i > .layout-component label {
	position: absolute;
	left: clamp(1rem, 1.8vw, 1.35rem);
	right: clamp(1rem, 1.8vw, 1.35rem);
	bottom: clamp(1rem, 1.8vw, 1.35rem);
	z-index: 5;

	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.85rem;

	min-height: clamp(4rem, 4.7vw, 4.85rem);

	margin: 0 !important;
	padding: 0.75rem 0.95rem !important;

	background:
		linear-gradient(180deg, rgba(0,0,0,.9), rgba(0,0,0,.78));

	color: var(--ww-color-white);

	border: 1px solid rgba(255,255,255,.14);
	border-left: 6px solid var(--ww-color-orange);
	border-radius: var(--ww-radius-m);

	box-shadow:
		0 16px 38px rgba(0,0,0,.22),
		inset 0 1px 0 rgba(255,255,255,.1);

	font-size: clamp(0.98rem, 1.05vw, 1.18rem);
	font-weight: 950;
	line-height: 1.05;
	letter-spacing: -0.035em;

	text-align: left;
	text-wrap: balance;

	pointer-events: none;
}

body .page-subfooter .sub-footer > .i > .layout-component label::after {
	content: "";

	flex: 0 0 auto;

	display: inline-block;

	width: 0.52rem;
	height: 0.52rem;

	border-right: 3px solid var(--ww-color-orange);
	border-bottom: 3px solid var(--ww-color-orange);

	transform: rotate(-45deg);

	transition:
		transform var(--ww-transition-fast),
		border-color var(--ww-transition-fast);
}

body .page-subfooter .sub-footer > .i > .layout-component:hover label::after,
body .page-subfooter .sub-footer > .i > .layout-component:focus-within label::after {
	transform: rotate(-45deg) translate(4px, -4px);

	border-color: var(--ww-color-white);
}


/* ==========================================
   FULL CARD LINK
========================================== */

body .page-subfooter .sub-footer > .i > .layout-component > a.inflate {
	position: absolute !important;
	inset: 0 !important;
	z-index: 8 !important;

	display: block !important;

	width: 100% !important;
	height: 100% !important;

	margin: 0 !important;
	padding: 0 !important;

	font-size: 0 !important;
	line-height: 0 !important;
	text-indent: -9999px !important;

	background: transparent !important;
	color: transparent !important;

	border: 0 !important;
	box-shadow: none !important;

	text-decoration: none !important;
}

/* Keyboard focus */

body .page-subfooter .sub-footer > .i > .layout-component:focus-within {
	outline: 3px solid rgba(217,147,14,.45);
	outline-offset: 4px;
}


/* ==========================================
   TABLET SUB FOOTER NAV
========================================== */

@media (min-width: 768px) and (max-width: 1200px) {

	body .page-subfooter .sub-footer > .i {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	body .page-subfooter .sub-footer > .i > .layout-component {
		min-height: 330px;
	}

	body .page-subfooter .sub-footer > .i > .layout-component label {
		font-size: clamp(1rem, 2.2vw, 1.22rem);
	}

}


/* ==========================================
   MOBILE SUB FOOTER NAV
   Shows full image height instead of crop
========================================== */

@media (max-width: 767px) {

	body .page-subfooter {
		padding-block: var(--ww-space-l);

		background:
			radial-gradient(circle at 14% 18%, rgba(217,147,14,.14), transparent 38%),
			linear-gradient(
				180deg,
				var(--ww-color-white) 0%,
				rgba(217,147,14,.055) 44%,
				var(--ww-color-black) 44%,
				var(--ww-color-black) 100%
			);
	}

	body .page-subfooter > .i {
		width: calc(100% - (var(--ww-page-gutter) * 2));
	}

	body .page-subfooter .sub-footer > .i {
		grid-template-columns: 1fr;
		gap: 1rem;
	}

	body .page-subfooter .sub-footer > .i > .layout-component {
		display: flex !important;
		flex-direction: column;

		min-height: 0;

		border-radius: var(--ww-radius-m);
	}

	body .page-subfooter .sub-footer > .i > .layout-component::after {
		right: -70px;
		top: -70px;

		width: 170px;
		height: 170px;
	}

	/* Mobile image: natural height, no absolute crop */

	body .page-subfooter .sub-footer > .i > .layout-component img,
	body .page-subfooter .sub-footer > .i > .layout-component.sub-footer-photo-card img {
		position: relative !important;
		top: auto !important;
		left: auto !important;
		right: auto !important;
		bottom: auto !important;
		z-index: 2;

		display: block !important;

		width: 100% !important;
		height: auto !important;
		max-width: none !important;
		max-height: none !important;

		margin: 0 !important;
		padding: 0 !important;

		aspect-ratio: auto !important;

		object-fit: contain !important;
		object-position: center !important;

		background: var(--ww-color-white);

		border: 0;
		border-radius: 0;

		box-shadow: none;

		transform: none !important;
	}

	/* Mobile h4 stays over top-left if used */

	body .page-subfooter .sub-footer > .i > .layout-component h4 {
		top: 1rem;
		left: 1rem;

		font-size: 0.7rem;
	}

	/* Mobile label becomes a normal bottom panel */

	body .page-subfooter .sub-footer > .i > .layout-component label {
		position: relative;
		left: auto;
		right: auto;
		bottom: auto;
		z-index: 5;

		order: 2;

		width: 100%;

		min-height: 0;

		margin: 0 !important;
		padding: 0.9rem 1rem !important;

		border-radius: 0;
		border-left: 5px solid var(--ww-color-orange);

		font-size: clamp(1rem, 4.8vw, 1.22rem);
		line-height: 1.08;
		letter-spacing: -0.03em;
	}

	body .page-subfooter .sub-footer > .i > .layout-component label::after {
		width: 0.5rem;
		height: 0.5rem;
	}

}


/* ==========================================
   SMALL MOBILE SUB FOOTER NAV
========================================== */

@media (max-width: 480px) {

	body .page-subfooter .sub-footer > .i > .layout-component label {
		align-items: center;

		font-size: clamp(0.96rem, 5vw, 1.12rem);
	}

}


/* ==========================================
   REDUCED MOTION
========================================== */

@media (prefers-reduced-motion: reduce) {

	body .page-subfooter .sub-footer > .i > .layout-component,
	body .page-subfooter .sub-footer > .i > .layout-component::after,
	body .page-subfooter .sub-footer > .i > .layout-component img,
	body .page-subfooter .sub-footer > .i > .layout-component label::after {
		transition: none;
	}

	body .page-subfooter .sub-footer > .i > .layout-component:hover,
	body .page-subfooter .sub-footer > .i > .layout-component:focus-within,
	body .page-subfooter .sub-footer > .i > .layout-component:hover::after,
	body .page-subfooter .sub-footer > .i > .layout-component:focus-within::after,
	body .page-subfooter .sub-footer > .i > .layout-component:hover img,
	body .page-subfooter .sub-footer > .i > .layout-component:focus-within img,
	body .page-subfooter .sub-footer > .i > .layout-component:hover label::after,
	body .page-subfooter .sub-footer > .i > .layout-component:focus-within label::after {
		transform: none;
	}

}


 /* Begin CSS Part: System Manager */

 /* Begin CSS Part: User */

 /* Begin CSS Part: Warning */