

*{
	margin:0;
	padding:0;
	box-sizing: border-box;
}

img{
	max-width: 100%;
	height: auto;
}


/* Custom Properties */

:root {

	/* Defaults */
	
	--background-default: #10071d;
	--background-transparent: rgba(0,0,0,0);

	--default-border-radius: 0.5rem;
	--default-btn-border-radius: 10%;

	--default-font: 'Gabarito', sans-serif;
	--default-font-heading: 'Raleway', 'Poppins',  sans-serif;
	--default-font-btns: 'Gabarito', 'Poppins',  sans-serif;
	
	--default-font-colour: #202020;
	--default-font-size: 19px;
	--default-font-weight: 400;

	--default-heading-size: 1.6rem;
	--default-heading-small: 1.2rem;
	--default-heading-large: 1.8rem;
	--default-heading-largest: 2rem;	

	--colour-white: #FFF;
	--colour-black: #000;
	--colour-grey: #202020;

	--svg-filter-white: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(1%) hue-rotate(157deg) brightness(113%) contrast(101%);
	--svg-filter-black: brightness(0) saturate(100%);
	--svg-filter-grey: brightness(0) saturate(100%) invert(41%) sepia(0%) saturate(1112%) hue-rotate(145deg) brightness(92%) contrast(85%);
	
	/* Theme Specific */

	--colour-theme-blue: #364C63;
	--svg-filter-theme-blue: brightness(0) saturate(100%) invert(26%) sepia(41%) saturate(487%) hue-rotate(170deg) brightness(91%) contrast(87%);

	--colour-theme-blue-light: #76929E;
	--svg-filter-theme-blue-light: brightness(0) saturate(100%) invert(56%) sepia(29%) saturate(262%) hue-rotate(153deg) brightness(94%) contrast(92%);
	
	--colour-theme-orange: #EC722E;
	--svg-filter-theme-orange: brightness(0) saturate(100%) invert(64%) sepia(25%) saturate(6627%) hue-rotate(340deg) brightness(95%) contrast(95%);

	--colour-theme-yellow: #FFDB59;
	--svg-filter-theme-yellow: brightness(0) saturate(100%) invert(57%) sepia(98%) saturate(522%) hue-rotate(352deg) brightness(109%) contrast(94%);

	--colour-theme-pink: #CE8282;
	--svg-filter-theme-grey: brightness(0) saturate(100%) invert(45%) sepia(0%) saturate(1242%) hue-rotate(157deg) brightness(91%) contrast(79%);

	--colour-theme-grey-light: #6E6E6E; /* HSL: 247, 7, 42 / RGB: 100, 99, 107 */
	--colour-theme-white: #fff;

	--header-gradient: linear-gradient(to top, rgba(var(--colour-theme-blue-rgb),0), rgba(var(--colour-theme-blue-rgb),1));

	--colour-main: var(--colour-theme-blue);
	--colour-accent: var(--colour-theme-orange);
	--colour-secondary: var(--colour-theme-yellow);	

	--theme-border-default: 1px solid var(--colour-theme-grey-light);
}


/* Global */

@media (min-width: 576px){
	.container, .container-sm {
		max-width: 540px;
	  }	  
}

@media (min-width: 768px){
	.container, .container-md, .container-sm {
		max-width: 700px;
	  }
}

@media (min-width: 992px){

	.container, .container-lg, .container-md, .container-sm {
		max-width: 960px;
	  }
}

@media (min-width: 1200px){
	.container, .container-lg, .container-md, .container-sm, .container-xl {
		max-width: 1140px;
	  }	  
}


@media (min-width: 1400px){	
	.container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
		max-width: 1320px;
		max-width: 1140px;
	  }
}

@media (max-width:50em){
	.container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
		--bs-gutter-x: 2.5rem;
	  }	

	#header-site .container,
	#header-scroll .container {
		--bs-gutter-x: .5rem;
	}
}

html, body {
	min-height:100%;
	padding: 0px;
	background-color: white;
	scroll-behavior: smooth;
  	scroll-padding-top: 80px;
}

body{
	font-family: var(--default-font);
	font-weight: var(--default-font-weight);
	font-size: var(--default-font-size);
	color: var(--colour-main);
	line-height: 1.4;
	text-transform: none;    
}

body.disable-scroll {
	overflow: hidden;
}


p{
	margin-bottom: 0.5rem;
}
/*
a, a:visited {
    color: var(--colour-main);
    text-decoration: none;
}

a:hover{
    color: var(--colour-accent);
	outline:none;
}
*/
nav a{
	text-decoration: none;
}

a.colour-blue, a.colour-blue:visited {
	color: var(--colour-theme-blue);
}

*:focus {
	outline: none;
}

article a{
	color: inherit;
}

strong, b{
 font-weight: 600;
}

/* Colours */

.colour-blue, .colour-main{
	color: var(--colour-theme-blue);
}

.colour-orange, .colour-accent{
	color: var(--colour-theme-salmon);
}

.colour-green, .colour-secondary{
	color: var(--colour-theme-green);
}

.colour-grey{
	color: var(--colour-theme-grey);
}

.colour-grey-dark{
	color: var(--colour-theme-grey-dark);
}

.colour-white{
	color: var(--colour-white);
}

.background-transparent{
	background: transparent;
	color: black;
}

.background-blue, .background-main{
	background: var(--colour-theme-blue);
	color: white;
}

.background-blue {
	background-color: var(--colour-theme-blue);
	background-image: url('../img/backgrounds/background.webp');
	background-blend-mode: luminosity;	
	background-position: bottom left;
	background-size: cover;
	color: white;
	position:relative;
}

#hero.background-blue {
	background: unset;
	background-color: var(--colour-theme-blue);	
	background-image: url('../img/backgrounds/image-frames-orange.svg'), url('../img/backgrounds/background.webp');
	background-position: center right, bottom left;
  	background-repeat: no-repeat;
  	background-size: 800px 750px, cover;
	background-blend-mode: normal, luminosity;	
}
/*
#hero.background-blue .container {

	mix-blend-mode: overlay;
  	filter: grayscale(1);	
}
*/


section:nth-child(2n of .background-blue){
	background:transparent;
}

section:nth-child(2n of .background-blue)::before{
	content: "";
	position: absolute; top:0; left: 0; right: 0; bottom: 0;
	background-color: var(--colour-theme-blue);
	background-image: url('../img/backgrounds/background.webp');
	background-blend-mode: luminosity;
	background-position: bottom left;
	background-size: cover;
	transform: scaleX(-1);
	z-index:-1;
}


.background-blue .section-title, .background-blue .section-subtitle{color: #fff;}

.background-dark {background-color: var(--colour-theme-blue-dark);color: white;}
.background-dark .section-title, .background-dark .section-subtitle{color: #fff;}

.background-green, .background-accent{
	background: var(--colour-theme-green);
}

.background-grey{
	background: var(--colour-theme-grey);
}

.background-grey strong{
	color: var(--colour-theme-blue);
}

.background-grey-dark{
	background: var(--colour-theme-grey-dark);
}

.background-white{
	background: var(--colour-theme-white);
}

.icon-blue{
	fill: var(--colour-theme-blue);
	filter: var(--svg-filter-theme-blue);
}

.icon-blue-yellow{
	fill: var(--colour-theme-yellow);
	filter: var(--svg-filter-theme-yellow);
}

.icon-blue-pink{
	fill: var(--colour-theme-pink);
	filter: var(--svg-filter-theme-pink);
}

.icon-grey{
	fill: var(--colour-theme-grey);
	filter: var(--svg-filter-theme-grey);
}

.icon-grey-dark{
	fill: var(--colour-theme-grey-dark);
	filter: var(--svg-filter-theme-grey-dark);
}

.icon-black{
	fill: var(--colour-black);
	filter: var(--svg-filter-black);
}

.icon-white{
	fill: var(--colour-white);
	filter: var(--svg-filter-white);
}

/* Utilities */

.text-center{
	text-align: center;
}

.text-start{
	text-align: start;
}

.text-end{
	text-align: end;
}

.image-left, img.alignleft{
	float: inline-start;
	margin: 1rem 1rem 1rem 0;
}

.image-right, img.alignright{
	float: inline-end;
	margin: 1rem 0 1rem 1rem;
}

.image-center, .aligncenter{
	float: center;
	margin: 1rem;
}

/* Headings */

h1, h2, h3, h4, h5, h6{
	font-family: var(--default-font-heading);
	font-style: normal;
	line-height: 1.2;
	font-weight: 700;	
}

h1{
	font-size: 2rem;
}

h2{
	font-size: 1.6rem;
	margin-bottom: 1rem;
}

h3{
	font-size: 1.2rem;
}

@media (min-width: 50em) {

	h1{
		font-size: 2.5rem;
	}
	
	h2{
		font-size: 2rem;
		margin-bottom: 2rem;
	}
	
	h3{
		font-size: 1.4rem;
	}

}

/* Links */
a{
	color: var(--colour-main);
	text-decoration: none;
}

#page-content p a,
.article-content-main p a{
	text-decoration: underline;
}

p a{
	color:var(--colour-theme-orange);
	text-decoration: underline;
}
/*
a:hover, a:focus, a:visited{
	color: var(--colour-accent);
}

a:focus-visible{
	display: inline-block;
	outline: 1px solid var(--colour-accent);
	outline-offset: 3px;
}
*/
.background-blue a{
	color: var(--colour-theme-white);
}

footer a,
footer .background-blue a{
	color: inherit;
}


.skip-to-main-content-link {
	position: absolute;
	left: -9999px;
	z-index: 999;
	padding: 1em;
	background-color: var(--colour-theme-blue);
	color: white!important;
	opacity: 0;
}

.skip-to-main-content-link:focus {
	left: 0%;
	opacity: 1;
}


/* Button */

.btn{
	position: relative;
    display: inline-block;
    text-decoration: none;
    padding: .75rem .5rem;

	font-family: var(--default-font-btns);
	font-style: normal;
	font-size: clamp(10px, 1em, 1em);
	line-height: 1;
	font-weight: 400;
	
	width: fit-content;
	max-width: 100%;
	border:2px solid var(--colour-theme-white);
	border-radius:10px;

	background-color: var(--colour-theme-blue);
	color: var(--colour-theme-white);
	
	cursor: pointer;
}

.btn:visited {
	background-color: var(--colour-theme-blue);
	color: var(--colour-theme-white);
}

.btn:hover, .btn:focus{
	color: white;
	border-color: white;
}

.btn .btn-label{
	display: flex;
	flex:1;
	justify-content: center;
	align-items: center;
}

.btn .btn-label-text{
	display: inline-block;	
}

.btn .btn-label-icon{
	padding-left: 1rem;	
	height: var(--default-font-size);
}

.btn.btn-wide{
	width: fit-content;
	padding: .75rem 1.75rem;
}

.btn.btn-wide .label-text{
	flex: 1;
}

.btn.btn-sml{
	font-size:.8rem;
}

.btn.btn-md{
	font-size:1.2rem;
}

.btn.btn-xl{
	font-size:1.4rem;
}

.btn.btn-xxl{
	font-size:1.8rem;
}

.btn.hovered, .btn:hover, .btn:focus, .btn:active {
	background-color: var(--colour-theme-orange);
	color: white;
}

.btn:hover .icon.navigation-arrow, .btn:focus .icon.navigation-arrow, .btn:active .icon.navigation-arrow {	
	fill: var(--colour-theme-blue);
	filter: var(--svg-filter-theme-blue);
}

/* Button Colour Options */

.btn.btn-outline,
.btn.btn-outline:visited{
	border-color: var(--colour-theme-blue);
	background-color: var(--background-transparent);
	color: var(--colour-theme-blue);
}

.btn.btn-outline:hover, 
.btn.btn-outline:focus{
	border-color: var(--colour-theme-blue);
	background-color: var(--colour-theme-blue);
	color: var(--colour-theme-white);
}

.btn.btn-blue,
.btn.btn-blue:visited{
	border-color: var(--colour-theme-blue);
	background-color: var(--colour-theme-blue);
	color: var(--colour-white);	
}

.btn.btn-red,
.btn.btn-red:visited {
	border-color: var(--colour-theme-red);
	background-color: var(--colour-theme-red);
	color: var(--colour-theme-white);
}

/* Background Button Options */

.background-blue .btn,
.background-blue .btn:visited{
	border-color: var(--colour-theme-white);
	background-color: var(--background-transparent);
	color: var(--colour-theme-white);
}

.background-blue .btn:hover,
.background-blue .btn:focus{
	border-color: var(--colour-theme-white);
	background-color: var(--colour-theme-white);
	color: var(--colour-theme-blue);
}

.background-blue .btn-outline,
.background-blue .btn-outline:visited{
	border-color: var(--colour-theme-white);
	background-color: var(--background-transparent);
	color: var(--colour-theme-white);	
}

.background-grey .btn,
.background-grey .btn:visited{
	border-color: var(--colour-theme-blue);
	background-color: var(--background-transparent);
	color: var(--colour-theme-blue);	
}

.background-grey .btn:hover,
.background-grey .btn:focus{
	border-color: var(--colour-theme-blue);
	background-color: var(--colour-theme-blue);
	color: var(--colour-theme-white);	
}

.btn-row, .link-row{
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: flex-end;
	padding: 1rem 0;
	overflow: hidden;
	flex-wrap: wrap;
	gap: 1rem;
}

.btn-column, .link-column{
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: flex-end;
	padding: 1rem 0;
	overflow: hidden;
	flex-wrap: wrap;
	gap: 1rem;
}

.btn-row.flow-start{
	justify-content: flex-start;
}

@media (max-width: 768px) {


}

/* Icons */

.icon {
	display: inline-block;		
	width: 32px; height: 32px; line-height: 1;
	background-size: auto;
	background-position:center center;
	background-repeat: no-repeat;
	transform-origin: center;
}

.icon-rotate-90{
	transform: rotate(-90deg);
}

.icon-rotate-180{
	transform: rotate(-180deg);
}

.icon-rotate-240{
	transform: rotate(-240deg);
}

.icon-rotate90{
	transform: rotate(90deg);
}

.icon-rotate180{
	transform: rotate(180deg);
}

.icon-rotate240{
	transform: rotate(240deg);
}

.icon-angle-right.expand-icon{
	transform: rotate(-90deg);
	cursor: pointer;
}

.icon-angle-right.expand-icon.collapsed{
	transform: rotate(90deg);
}

.icon-sml{
	width:16px; height:16px;
}

.icon.navigation-arrow{
	background-image:url('../svg/icons/arrow-up-circle.svg'), url('../svg/icons/arrow-up-circle-fill.svg');
	background-size: auto, 1px;
	transform-origin: center;
}

.icon.navigation-arrow.arrow-up{
	transform: rotate(0deg);
}

.icon.navigation-arrow.arrow-down{
	transform: rotate(180deg);
}

.icon.navigation-arrow.arrow-left{
	transform: rotate(-90deg);
}

.icon.navigation-arrow.arrow-right{
	transform: rotate(90deg);
}

.icon.navigation-arrow:hover{
	background-image:url('../svg/icons/arrow-up-circle-fill.svg'), url('../svg/icons/arrow-up-circle.svg');
}

.icon.icon-newsletter-arrow{
	background-image: url('../svg/icons/newsletter-arrow.svg');
	fill: var(--colour-theme-red);
	filter: var(--svg-filter-theme-red);
}

.icon.icon-close{
    background-image: url('../svg/icons/close.svg');
	fill: var(--colour-main);
	filter: var(--svg-filter-main);	
}

.icon.icon-plus{
    background-image: url('../svg/icons/plus.svg');
	fill: var(--colour-main);
	filter: var(--svg-filter-main);	
}

/* Social Icons */

.social-icon {
	display: inline-block;		
	width: 16px; height: 16px;	
	background-size: auto;
	background-position:center center;
	background-repeat: no-repeat;
}

.social-icon-twitter{
	background-image:url('../svg/social/twitter.svg');
}

.social-icon-instagram{
	background-image:url('../svg/social/instagram.svg');
}

.social-icon-youtube{
	background-image:url('../svg/social/youtube.svg');
}

.social-icon-facebook{
	background-image:url('../svg/social/facebook.svg');
}

/* Outline text */  

@supports (-webkit-text-stroke: 1px var(--colour-theme-blue)){

	.outline-text {
		-webkit-text-stroke: 1px var(--colour-accent);
		-webkit-text-fill-color: transparent;
	}

	.outline-text.text-blue {
		-webkit-text-stroke: 1px var(--colour-theme-blue);
		-webkit-text-fill-color: transparent;
	}	
}

/* Scroll to Top */

#scroll-top{
	position: fixed;
	bottom: -64px; right: 1rem;
	cursor: pointer;
	background-color: white;
	width: 64px; height: 64px;
	display:flex;
	align-items: center;
	justify-content: center;
	animation: fadeOut 1s;
	transition: all 1s;
	transform-origin: center;
}

#scroll-top .icon{
	width: 64px; height: 64px;
	background-size: 32px, 1px;
}

#scroll-top .icon.navigation-arrow{
	background-image:url('../svg/icons/arrow-up-circle.svg');


}

#scroll-top:hover .icon.navigation-arrow{
	background-image:url('../svg/icons/arrow-up-circle-fill.svg');
}

.scrolled #scroll-top{
	bottom: 1rem;
	animation: fadeIn 1s;
	transition: all 1s;	
}

/* loadmore */

.loadmore-button-container {
	padding:2rem;
}

#load-more{
	cursor: pointer;
}

/* Forms */

.form-group{
	display: flex;
}

.form-group-inline{
	flex-direction: row;
	justify-content: center;
	padding: 2rem 0 0;
}

.form-group-single-submit{
	padding: .75rem;
	background-color: #fff;
	display: flex; align-items: center; justify-content: space-between;
	border-radius: 30px;
	width: 100%;
}

.form-group-single-submit input[type=text]{
	flex: 1 0;
	border:0;
}

.form-group-single-submit .button{
	flex: 0 0 auto;
	border:0; line-height: 1; padding: 0;
	background-color: transparent;
	height: 32px;
}



/* Mailing List */

.mailing-list .content-elements{
	max-width: 80%;
	margin: 0 auto;
}

.mc4wp-form-basic input[type="text"], .mc4wp-form-basic input[type="email"], .mc4wp-form-basic input[type="tel"], .mc4wp-form-basic input[type="url"], .mc4wp-form-basic input[type="date"], .mc4wp-form-basic textarea, .mc4wp-form-basic select{
	max-width:100%;
}

@media (min-width: 50em) {

	.mailing-list .content-elements{
		max-width: 60%;
	}

}

/* Blocks */


@media (max-width:768px){

	
}

/* Mobile Menu */

#mobile-menu-toggle{
	cursor: pointer;
	fill: var(--colour-theme-pink);
	filter: var(--svg-filter-theme-pink);
}

#mobile-menu{
	position: fixed;
	top: 0;
	left: -200vw;
	height: 100vh;
	z-index:9999;
	width: 100%;
	transform: translate(0, 0);
	animation: fadeIn .3s;
	transition: all .3s;		
	background: var(--colour-theme-blue);
	color: var(--colour-theme-white);
}

#mobile-menu.active{
	left: 0;
}

#mobile-menu nav ul {
	flex-direction: column;
	height: 70vh;
	justify-content: space-evenly;
	width: 100%;
}

#mobile-menu nav ul a{
	text-transform: uppercase;
	text-align: center;
	color: var(--colour-theme-white);
}

#mobile-menu > .element-container{
	padding:2rem;
	display: flex;
	flex-direction: column;
}

#mobile-menu .controls{
	display: flex;
	align-items: flex-end;
	justify-content: flex-end;
	width: 100%;
}

#mobile-menu .controls .icon.icon-close{
	cursor: pointer;
	width: 32px; height: 32px;
	fill: var(--colour-theme-white);
	filter: var(--svg-filter-white);
	background-size: cover;
}


/* Header */


header .container{
	height: 100%;
}

header .header-inner,
#header-scroll .header-inner{
	height: 100%;
	display: flex;	align-items: center; justify-content: space-between;
}

#header-site {    
	border-bottom: 0;
}

#header-site {	
	width: 100%; height: 140px; overflow:hidden;
	padding: 0; margin: 0;
	background-color: var(--colour-theme-white);
	background-size: auto 100%;
	background-repeat: no-repeat no-repeat;
	position: sticky;
	top:0;
}

#header-scroll{
	background: white;
	position: fixed; z-index:2;
	top: 0; left: 0; right: 0;
	transform: translateY(-100%);
	transition: all .3s ease;
    overflow: hidden;
	padding:.5rem 0;
}

#header-scroll.active.scroll-up{
	transform: translateY(0%);
	display: block;
}

#header-scroll .header-inner{
	justify-content: center;
}

header .contact-btn{
	max-width: 40%;
	overflow: hidden;
}

header .contact-btn .btn{
	background-color:var(--colour-theme-blue);
	color:white!important;
}

header .contact-btn .btn:hover{
	background-color:var(--colour-theme-orange);
	color:white!important;
}

/* Navigation */

.main-navigation{
    display: flex; align-items: center;
	flex: 0 1 fit-content;
    text-align: center;
    width: 100%; height: 100%;
	font-size: 1.2rem;
	font-family: var(--default-font-btns);
}

.main-navigation a,
.main-navigation a:visited{
	padding: 0 .5rem;
	font-size: 1.2rem; line-height: 1.4rem;
	color: var(--colour-theme-blue);
}

.main-navigation ul li.active a,
.main-navigation a:hover,
.main-navigation a:focus{
    color: var(--colour-accent);
}

.main-navigation ul{
	display: flex; justify-content: space-between; align-items: center;
	list-style-type: none;
	margin:0; padding:0 2rem;
}

.main-navigation ul li{
	padding: .5rem 1rem;
}

#header-scroll .main-navigation a,
#header-scroll .main-navigation a:visited{
	color: var(--colour-theme-blue);
}

#header-scroll .main-navigation ul li.active a,
#header-scroll .main-navigation a:hover,
#header-scroll .main-navigation a:focus{
    color: var(--colour-theme-pink);
}

#header-site .mobile-menu-toggle,
#header-scroll .mobile-menu-toggle{
	display: none;
}

.brand{
	flex: 0 0 auto;
}

.brand img{
	height:80px; width:auto;
}

#header-scroll .brand img{
	height: 64px; width: auto;
	padding: 5px 10px;
} 

@media (max-width:80em){


	#header-site .brand{
		width:200px;
	} 

	#header-site .brand img{
		padding: 5px 10px;
	} 	

	#header-scroll .brand{
		width:auto;
	}	

	
	#header-site .main-navigation,
	#header-scroll .main-navigation{
		display:none;
	}

	#header-site .mobile-menu-toggle,
	#header-scroll .mobile-menu-toggle{
		height: 100%;
		display: flex;
		justify-content: center;
		flex-direction: column;
		color: #fff;
		fill: var(--colour-theme-blue);	
		filter: var(--svg-filter-theme-blue);
	}

}

/* Footer */

footer {	
	color: white;
	padding: 3rem 0;
	font-size: 1rem; font-weight: 400;
	line-height: 1.4;
	justify-content: flex-start;
	min-height: 300px;
	border-top: 0; 
}

footer .footer-brand .brand{
	margin-bottom:12px;
}

footer .footer-brand .brand img{
	max-width:100%;
}

footer .footer-navigation{
	display: flex;
	justify-content: space-around;
}

footer .footer-navigation > *{
	flex-basis: auto;
}

footer nav ul{
	flex-direction: column;
	align-items: flex-start;
	height: auto; width: auto;
	list-style-type: none;
	padding:0; margin:0;
}

footer nav ul li {
	margin: 0 0 0.5rem 0;
}

.footer-contact .content-element{
	padding: 0 0 0.5rem 0;	
}

.copyright{
	padding: 1rem;
	text-align: center;
}

@media (max-width: 768px) {

	footer .footer-brand {
		text-align: center;
	}
	
	footer .footer-brand .brand img{
		max-width:200px;
	}
	
	footer nav ul li {
		width: 100%;
	}

}

footer a, footer a:visited,
#footer-foot a, #footer-foot a:visited {
	color: var(--colour-footer-content);
}

footer a:hover, footer a:focus,
#footer-foot a:hover {
	color: var(--colour-accent);
}

footer .social-icon{
	width: 20px; height: 20px;
}

footer .social-menu {
	display: flex;
	justify-content: start;
	align-items: center;
	padding-top:1rem;
}

footer .social-menu a {
	fill: var(--colour-theme-blue);
	filter: var(--svg-filter-white);
	display:inline-block;
	padding:0 0.5rem;
}

footer .social-menu a:hover,
footer .social-menu a:focus{
	fill: var(--colour-theme-orange);
	filter: var(--svg-filter-theme-orange);
}

footer .footer-contact{
	border:0;
}

footer .footer-contact .address span{
	display: block;
}

footer .footer-contact .contacts .content-row{
	padding-right: .5rem;
}

footer .footer-contact .contacts .content-row-icon{
	display: inline-block; padding-right: .5rem;
}

footer .footer-contact .contacts .contact-email{
	display: block;
}

footer .credit{
	padding-top:1rem;
}

/** Elements **/

/* Section */

section {
	height: auto; width: 100%;
	padding: 30px 0; margin: 0;
    border:0;
}

.section-inner{
	flex-direction: column;
	padding: 0; margin: 0 auto;
	max-width: 1600px;
}

@media (min-width:50em){

	section {
		padding: 3rem 0;
	}
	
}

.content-block + .content-block{
	padding-top: 30px;
}

/* Campaign */

#campaign{
	overflow: hidden;
}

.campaign-inner{
	height: 100%;
	overflow: hidden;
	display: grid;
    place-items: center;
}
.campaign-inner > * {
    grid-column: 1/-1;
    grid-row: 1/-1;
}

#campaign .caption{
	width: 100%;
	padding: 2rem 0;
	display: flex; flex-direction: column;
}

.caption-content p{
	margin-top:1rem;
}

@media (max-width:50rem){
	.caption-content p br{
		display: none;
	}
}

/** Pages **/

/* Home */

.home #featured-aboutus p{
	margin: 30px auto;
	max-width: 80%;
}

.home #featured-aboutus p:first-of-type{
	font-size:1.5rem; font-weight: 600;
}

.service:first-of-type{
	padding-top: 160px;
}

.service:nth-of-type(odd){
	background-color: transparent;
	color: white;
}

.service:nth-of-type(even){
	background-color: white;
	color: var(--colour-theme-blue);
}

.service{
	text-align: start;
	align-items: center;
}

.service h2{
	font-size: 3.5rem;
}

.service .image-block{
	padding: 0 2rem;
}

.service .content-block{
	padding: 2rem;
}

@media (min-width:50em){

	.service .image-block{
		padding: 0;
	}	

	.service .content-block{
		padding: 0 2rem;
	}	
	
	.service h2{
		width: 100%;
	}
		
}

/* Team */

.team-content{
	padding-top: 2rem;
}

.team-content h2,
.team-content strong,
.team-content b{
	color: var(--colour-theme-yellow);
}

/* Content */



/* News */

#news-latest a{
	color: inherit;
}

/* News Archive */

.featured-news-inner{
	display: flex; flex-direction: column;
	justify-content: center;
	align-items: center;
}

@media (min-width: 50em){
	.featured-news-inner{
		flex-direction: row;
	}

	.featured-news-inner h3{
		font-size: 2.5rem;
	}
}

/* News Single */

#news-article #campaign,
#news-article #campaign picture {
	height: calc(100vh - 100px);
	overflow: hidden; padding:0;
}

#news-article #campaign picture {
	width: 100%;
}
	
#news-article #campaign img {
	width: 100%; height:100%;
	object-fit: cover; object-position: center center;
}

#news-article #campaign .caption {
	background-color: rgba(0,0,0,0.4);
	align-self: end;
}

#news-article .article-image{
	aspect-ratio: 16/9; width:100%; height: auto;
	border-radius: var(--default-border-radius);
	overflow: hidden; margin-bottom: 1.5rem;
}

 #news-article .article-image img {
	width: 100%; height:100%; aspect-ratio: 16/9;
	object-fit: cover; object-position: top center;
}

#news-article .article-content-main {
	padding-right: 4rem;
}

#news-article .article-content p{
	margin-bottom: 1.5rem;
}

#news-article .article-content p:first-of-type {
	font-size: 1.4rem;
	padding: 0; margin-bottom: 2rem;
	border-bottom: 0px solid rgba(0, 0, 0, 0.5);
	color: var(--colour-theme-blue);
}

#news-article .article-content-sidebar p:first-of-type{
	font-size: 1rem; padding:0; margin-bottom: 0; border:0; color: var(--colour-theme-blue);
}

/* Block News */

.card-img-top{
	position: relative;
	width: 100%; height:100%;
	height: auto;
	isolation: isolate;
	overflow: hidden;
	border-radius: var(--default-border-radius);
}

#news-all .card-img-top{
	width: 100%; max-height:300px; aspect-ratio: 16/9;
}

.card-img-top img {
	width: 100%; height: 100%; aspect-ratio: 16/9;
	background: rgba(255,255,255,0);
	object-fit: cover;	object-position: top center;
	opacity: 1;
	transition: all 1s ease-in-out;	
}

a:hover .card-img-top img {
	transform: scale(1.3);	
}

.block-news .heading{
	--max-lines: 2;
	--line-height: 1;
	--font-size: 2rem;

	font-size: var(--font-size);
	line-height: var(--line-height);
	text-transform: uppercase;
	
	text-align: start;
	position: relative;
}

/* Pages */
/*
#page-content{
	background-image: url('../img/backgrounds/left-splat.jpg'), url('../img/backgrounds/right-splat.jpg');
	background-position: left center, right center;
	background-repeat: no-repeat;
}
*/

#page-content .article-content{
	text-align: left;
}

#page-content .article-content p{
	margin: 0 auto 1.5rem auto;
	max-width: 100%; 
}

#page-content .article-content p:first-of-type {
	font-size: 1.4rem;
	padding: 2rem 0; margin-bottom: 2rem;
	border-bottom: 0px solid rgba(0,0,0, 0.5);
}

#page-content .article-content li{
	margin-bottom: 1rem;
}

.format-last-para{
	font-size: 1rem; font-weight: 600;
	max-width: 80%; margin: 0 auto;
}

.format-last-para p:last-of-type{
	font-size: 1.2rem; font-weight: 700;
	margin: 2rem 0 0;
}

.format-last-para p:last-of-type strong,
.format-last-para p:last-of-type b{
	color: var(--colour-theme-yellow);
	font-weight: 700;
}

@media (min-width:50em){
	
	.format-last-para{
		font-size: 1.2rem; 
	}
	
	.format-last-para p:last-of-type{
		font-size: 2rem;
	}	
	
}

.g-4, .gy-4 {
	--bs-gutter-y: 2.5rem;
}
.g-4, .gx-4 {
	--bs-gutter-x: 2.5rem;
}

.sponsor-blocks{
	display: grid; gap: 1.5rem; grid-template-columns: repeat(auto-fill, calc(max(200px, 24%) - .75rem));
	position: relative; width: 100%; height: fit-content; align-items: center; justify-content: center;
}
.sponsor-blocks .sponsor img{max-height: 150px; object-fit: contain;}


.sponsor-list{
	margin:0; padding-inline: 0;
	list-style: none;
}

.sponsor-list li{
	padding: 1rem; text-wrap: nowrap;
	border-radius: .5rem;
	max-width: 150px;
}

.sponsor-list li img{max-width: 100%; max-height:100px;}

.content-scroller{
	max-width: 100%;
}

.content-scroller-inner{
	--_item-gap: 1rem;
	display: flex; flex-wrap: wrap; gap: var(--_item-gap); align-items: center;
	padding-block: 1rem;
}

.content-scroller[data-animated="true"]{
	--_animation-duration: 90s;
	--_gradient: linear-gradient(90deg, transparent, white 20%, white 80%, transparent);
	overflow: hidden;
	-webkit-mask: var(--_gradient);
	mask: var(--_gradient);
}

.content-scroller[data-animated="true"] .content-scroller-inner{
	width: max-content; flex-wrap: nowrap;
	animation: scroll-horizontal var(--_animation-duration, 60s) var(--_animation-direction, forwards) linear infinite;
}

.content-scroller[data-animated="true"] .content-scroller-inner:hover{
	animation-play-state: paused;
}

@keyframes scroll-horizontal{
	to{
		transform: translate(calc(-50% - calc(var(--_item-gap)*.5)));
	}
}


/* --- General & Reset Styles --- */
        :root {
            --blue-600: #374c63;
            --yellow-400: #facc15;
            --pink-500: #ec4899;
            --gray-50: #f9fafb;
            --gray-100: #f3f4f6;
            --gray-200: #e5e7eb;
            --gray-500: #6b7280;
            --gray-600: #4b5563;
            --gray-700: #374151;
            --gray-800: #1f2937;
            --teal-600: #0d9488;
            --purple-600: #9333ea;
        }

        .container {
            width: 100%;
            max-width: 1200px;
            margin-left: auto;
            margin-right: auto;
            padding-left: 1.5rem;
            padding-right: 1.5rem;
        }

        .section {
            padding-top: 5rem;
            padding-bottom: 5rem;
        }

        .section-title {
            font-size: 2.25rem;
            font-weight: 800;
            color: var(--colour-main);
            margin-bottom: 1rem;
            text-align: center;
        }

        .section-subtitle {
            font-size: 1.125rem;
            color: var(--colour-main);
            margin-bottom: 3rem;
            text-align: center;
            max-width: 48rem;
            margin-left: auto;
            margin-right: auto;
        }

        .hidden {
            display: none !important;
        }
        
        /* --- Reveal on Scroll Animation --- */
        .section-hidden {
            opacity: 0;
            transform: translateY(2rem);
            transition: opacity 0.6s ease-out, transform 0.6s ease-out;
        }
        .section-visible {
            opacity: 1;
            transform: translateY(0);
        }


        /* --- Header --- */
        header {
            background-color: white;
            box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
            position: sticky;
            top: 0;
            z-index: 50;
        }

        header nav {
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding-top: 1rem;
            padding-bottom: 1rem;
        }

        header .logo {
            font-size: 1.5rem;
            font-weight: 700;
            color: var(--blue-600);
            text-decoration: none;
        }

        header .nav-links {
            display: none;
            align-items: center;
        }

        header .nav-links a {
            color: var(--gray-600);
            text-decoration: none;
            transition: color 0.3s;
            margin: 0 1rem;
        }

        header .nav-links a:hover {
            color: var(--blue-600);
        }

        #mobile-menu-button {
            display: block;
            background: none;
            border: none;
            cursor: pointer;
        }
        
        #mobile-menu {
            padding: 0 1.5rem 1rem;
        }

        #mobile-menu a {
            display: block;
            padding: 0.5rem 0;
            color: var(--gray-600);
            text-decoration: none;
        }

        /* --- Capsule Button Styles --- */
        .btn-capsule {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            font-weight: 700;
            color: white;
            border-radius: 9999px;
            overflow: hidden;
            transition: all 0.5s ease-in-out;
            background-size: 200% 100%;
            padding: 0.75rem 0.75rem 0.75rem 1.5rem;
            text-decoration: none;
            border: none;
            cursor: pointer;
			border:2px solid white;
			background-image: linear-gradient(to right, var(--colour-theme-orange) 50%, var(--colour-theme-blue) 50%);
			background-position: right;
        }
        .btn-capsule .icon-circle {
            margin-left: 1rem;
            width: 2rem;
            height: 2rem;
            background-color: transparent;
            border-radius: 9999px;
            display: flex;
            align-items: center;
            justify-content: center;
            transition: all 0.3s;
        }

        .btn-capsule .icon-circle svg {
            width: 1rem;
            height: 1rem;
            fill: white;
        }

		.btn-capsule:hover{
			background-position: left;
			border-color: white;
		}

        /* --- Hero Section --- */
        #hero {
            background-color: var(--colour-theme-blue);
			color: white;
            overflow: hidden;
			padding:0;
			position: relative;
			min-height:500px;
        }
        #hero .hero-grid {
            display: grid;
            grid-template-columns: 1fr;
            align-items: center;
            gap: 3rem;
			height:100%;
            min-height: 75vh;
        }
        #hero .hero-image-container {
            order: 1;
            overflow: hidden; /* For Ken Burns effect */
			/*clip-path: ellipse(100% 70% at 100% 30%);*/
			width: 500px;
			height: 500px;
			overflow: hidden; /* Crucial: Hides anything outside the transformed shape */
			transform: rotate(45deg); /* Rotates the wrapper to make a diamond shape */			
			border-radius: 20px;
			position: absolute; right:0;
        }

		#hero .hero-image-container-inner{
            clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);
			background:#202020;
			
		}

		#hero .hero-image-container-inner{
			width: 500px;
			height: 500px;
			overflow: hidden;
			transform: rotate(45deg);			
			border-radius: 20px;
			position: absolute; right:0;			
		}		

		#hero .hero-text-container {
			order: 2;
			text-align: center;
			display:flex;
			flex-direction: column;
			justify-content: space-between;			
			padding-block:1rem;
			height:100%;

		}
		#hero .hero-image {

			width: 100%;
			height: 100%;
			object-fit: cover;
			transform: rotate(-45deg) scale(1.42);
			transform-origin: center center; 

		}

		.diamond-image-soft-corners {
			width: 300px; 
			height: 300px; 
			object-fit: cover; 
			clip-path: polygon(
				50% 0%,       /* Top point */
				90% 10%,      /* Soft top-right */
				100% 50%,     /* Right point */
				90% 90%,      /* Soft bottom-right */
				50% 100%,     /* Bottom point */
				10% 90%,      /* Soft bottom-left */
				0% 50%,       /* Left point */
				10% 10%       /* Soft top-left */
			);
		}		

		.diamond-wrapper {
			width: 300px;
			height: 300px;
			overflow: hidden; 
			transform: rotate(45deg); 		
			border-radius: 20px;
		}

		.diamond-inner-image {
			width: 100%;
			height: 100%;
			object-fit: cover; 
			transform: rotate(-45deg); 
			transform-origin: center center; 
			border-radius: 20px; 
		}		


        #hero .hero-content-wrapper {
            position: relative;
            min-height: 10rem; 
			flex:1;
			display: flex;
        }
        #hero .hero-content {
            transition: opacity 0.4s ease-in-out, transform 0.4s ease-in-out;
			display: flex; flex-direction:column; flex:1;
			justify-content: center;
        }
        #hero .hero-content.fade-out {
            opacity: 0;
            transform: translateY(1rem);
        }
        #hero :is(h1, h2, h3, h4, h5, h6), #hero-title {
            font-size: 3rem;
            font-weight: 800;
            color: inherit;
            line-height: 1.2;
        }
        #hero p {
            margin-top: 1rem;
            font-size: 1.125rem;
            color: inherit;
            max-width: 36rem;
            margin-left: auto;
            margin-right: auto;
        }
        #hero .hero-buttons {
            margin-top: 2rem;
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: 1rem;
        }
        #hero .slider-controls {
            margin-top: 3rem;
            display: flex;
            align-items: center;
            justify-content: space-between;
        }
        #hero .slider-dots {
            display: flex;
            gap: 0.75rem;
        }
        #hero .slider-dots button {
            width: 0.75rem;
            height: 0.75rem;
            border-radius: 9999px;
            border: none;
            cursor: pointer;
            transition: background-color 0.3s;
        }
        #hero .slider-dots button.active {
            background-color: white;
        }
        #hero .slider-dots button.inactive {
            background-color: var(--gray-200);
        }
        #hero .slider-nav-buttons {
            display: flex;
            gap: 0.75rem;
        }
        #hero .control-btn {
            background-color: var(--gray-100);
            width: 2.5rem;
            height: 2.5rem;
            border-radius: 9999px;
            display: flex;
            align-items: center;
            justify-content: center;
            border: none;
            cursor: pointer;
            transition: background-color 0.3s;
        }
        #hero .control-btn:hover {
            background-color: var(--gray-200);
        }
        #hero .control-btn svg {
            width: 1rem;
            height: 1rem;
            fill: var(--gray-700);
        }

        /* --- Timetable Section --- */
        #timetable-tabs {
            display: flex;
            justify-content: center;
            flex-wrap: wrap;
            border-bottom: 1px solid var(--gray-200);
            margin-bottom: 2rem;
        }
        #timetable-tabs button {
            padding: 0.75rem 1.5rem;
            font-weight: 600;
            border-radius: 0.5rem 0.5rem 0 0;
            border-bottom: 4px solid transparent;
            cursor: pointer;
            transition: all 0.3s;
            background: none;
            border-left: none;
            border-right: none;
            border-top: none;
        }
        #timetable-tabs button.active {
            color: var(--colour-theme-blue);
            border-bottom-color: var(--colour-theme-orange);
        }
        #timetable-tabs button:not(.active) {
            color: var(--colour-theme-blue-light);
        }
        #timetable-content {
            max-width: 48rem;
            margin: auto;
        }
        .timetable-activity {
            background-color: white;
            padding: 1.5rem;
            border-radius: 0.5rem;
            box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1), 0 2px 4px -1px rgba(0,0,0,0.06);
            display: flex;
            flex-direction: column;
            gap: 1rem;
            align-items: center;
            text-align: center;
			margin-bottom:1rem;
        }
        .timetable-activity .time {
            flex-shrink: 0;
        }
        .timetable-activity .time .start-time {
            font-size: 1.25rem;
            font-weight: 700;
        }
        .timetable-activity .time .end-time {
            font-size: 0.875rem;
            color: var(--colour-theme-blue-light);
        }
        .timetable-activity .details {
            flex-grow: 1;
        }
        .timetable-activity .details h3 {
            font-size: 1.5rem;
            font-weight: 700;
            color: var(--colour-theme-blue);
        }
        .timetable-activity .details p {
            color: var(--gray-600);
        }
        .timetable-activity .tag {
            font-size: 0.875rem;
            font-weight: 600;
            padding: 0.25rem 0.75rem;
            border-radius: 9999px;
            white-space: nowrap;
        }
        
        /* --- Card Slider Sections (Hub & Team) --- */
        .card-slider-container {
            position: relative;
        }
        .card-slider-wrapper {
            overflow: hidden;
            cursor: grab;
			padding-left:2.5rem;
        }
        .card-slider-wrapper.grabbing {
            cursor: grabbing;
        }
        .card-slider {
            display: flex;
        }
        .card-slider.transitioning {
            transition: transform 0.5s ease-in-out;
        }
        .card-slider > .card {
            flex-shrink: 0;
            width: 90%;
            margin-right: 1rem;
        }
        .slider-nav {
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
            background-color: rgba(255, 255, 255, 0.8);
            width: 3rem;
            height: 3rem;
            border-radius: 9999px;
            box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -2px rgba(0,0,0,0.05);
            display: flex;
            align-items: center;
            justify-content: center;
            cursor: pointer;
            transition: opacity 0.3s;
            z-index: 10;
            border: none;
        }
        .slider-nav:hover {
            background-color: white;
        }
        .slider-nav.prev { left: -1.5rem; }
        .slider-nav.next { right: -1.5rem; }
        .slider-nav svg {
            width: 1rem;
            height: 1rem;
            fill: var(--gray-800);
        }
        .card {
            position: relative;
            border-radius: 0.5rem;
            overflow: hidden;
            /*box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -2px rgba(0,0,0,0.05);*/
            height: 450px;
			border:0;
        }

		.card-slider .card{
			box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -2px rgba(0,0,0,0.05);
		}
        .card img {
            width: 100%;
            height: 100%;
            object-fit: cover;
        }
        .card .card-overlay {
            position: absolute;
            inset: 0;
            background-color: black;
            opacity: 0;
            transition: opacity 0.5s;
        }
        .card:hover .card-overlay {
            opacity: 0.5;
        }
        .card .card-info {
			--_peakSpacing: 8rem;
            position: absolute;
            bottom: 0;
            left: 0;
            width: 100%;
            padding: 1.5rem;
            color: white;
            transform: translateY(calc(100% - var(--_peakSpacing))); /* Peek title */
            transition: transform 0.5s ease-in-out;
			background: rgba(0,0,0,.25);
        }

		#team-slider .card .card-info{
			--_peakSpacing: 6rem;
		}

        .card:hover .card-info {
            transform: translateY(0);
        }
        .card .card-info h3 {
            font-size: 1.5rem;
            font-weight: 700;
        }
        .card .card-info .card-subtitle {
            font-weight: 600;
        }
        .card .card-info .card-description {
            margin-top: 0.5rem;
            font-size: 0.875rem;
            opacity: 0;
            transition: opacity 0.3s 0.2s;
        }
        .card:hover .card-info .card-description {
            opacity: 1;
        }
/* --- What We Do Section --- */
        #what-we-do .content-grid {
            display: flex;
            flex-direction: column;
            gap: 2rem;
        }

		#what-we-do .content-grid .service-list {
			flex: 1 0 33%
		}

        .service-list button {
            display: block;
            width: 100%;
            text-align: left;
            padding: 1.5rem;
            border-radius: 0.5rem;
            border: 1px solid var(--gray-200);
            background-color: white;
			color: var(--colour-theme-blue);
            cursor: pointer;
            transition: all 0.3s;
            margin-bottom: 1rem;
        }
        .service-list button:hover {
            border-color: var(--colour-theme-blue);
            transform: translateY(-2px);
            box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1), 0 2px 4px -1px rgba(0,0,0,0.06);
        }
        .service-list button.active {
            background-color: var(--colour-theme-blue);
            color: white;
            border-color: var(--colour-theme-blue);
        }
        .service-list button h3 {
            font-size: 1.25rem;
            font-weight: 700;
            margin-bottom: 0.25rem;
        }
        .service-list button p {
            font-size: 0.875rem;
            line-height: 1.5;
        }
        .service-list button.active p {
            color: rgba(255, 255, 255, 0.8);
        }



		#what-we-do .content-grid .service-content {
			flex: 1;
			height: 100%
		}

        .service-content-pane {
            background-color: white;
            padding: 2rem;
            border-radius: 0.5rem;
            box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -2px rgba(0,0,0,0.05);
            transition: opacity 0.4s ease-in-out;
			height:100%;
			overflow: hidden;
			
        }
        .service-content-pane h3 {
            font-size: 1.75rem;
            font-weight: 700;
            color: var(--colour-theme-blue);
            margin-bottom: 1rem;
        }
        .service-content-pane p {
            margin-bottom: 1.5rem;
        }

		.service-content-pane .content-pane-content{
			display:flex;
		}
		.service-content-pane .content-pane-content > *{
			flex:1;
		}

		.service-content-pane .content-pane-heading{
			padding-right:2rem;
		}		
		.service-content-pane .content-pane-image{
			clip-path: circle(50% at 50% 50%);
			overflow:	hidden;
			margin: -5rem -8rem 0 0;
			flex-basis: 15%;
			height: 440px;
		}
		.service-content-pane .content-pane-image img{
			width: 100%; height: 100%;
			object-fit: cover;
		}


		.feature-cards{
			display: grid; gap: 1.5rem;
  			grid-template-columns: repeat(auto-fill, calc(max(220px, 32%) - .75rem));
			justify-content: center;
		}

		.feature-cards .feature-card {
            display: block;
            width: 100%;
            text-align: left;
            padding: 1.5rem;
            border-radius: 0.5rem;
            border: 1px solid var(--gray-200);
            background-color: white;
			color: var(--colour-theme-blue);
            transition: all 0.3s;
        }
        .feature-cards .feature-card:hover {
            border-color: var(--colour-theme-blue);
            transform: translateY(-2px);
            box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1), 0 2px 4px -1px rgba(0,0,0,0.06);
        }
        .feature-cards .feature-card.active {
            background-color: var(--colour-theme-blue);
            color: white;
            border-color: var(--colour-theme-blue);
        }
        .feature-cards .feature-card h3 {
            font-size: 1.25rem;
            font-weight: 700;
            margin-bottom: 0.25rem;
        }
        .feature-cards .feature-card p {
            font-size: 0.875rem;
            line-height: 1.5;
        }
        .feature-cards .feature-card.active p {
            color: rgba(255, 255, 255, 0.8);
        }

		/* --- Testimonial Section --- */
		/*
		#testimonials{
			
			background-color: var(--gray-200);
			background-image: linear-gradient(to bottom right, #c3c3c3, #f3f3f3);
			color: black;

		}
		#testimonials .section-title, #testimonials .section-subtitle {
			color: black;
		}
		*/
		.testimonial-slider-container {
			position: relative;
			max-width: 48rem;
			margin: auto;
			min-height: 200px;
			display: grid;
			place-items: center center;
		}
		.testimonial-slide{
			/*
			position: absolute;
			top:0; left: 0; right: 0;
			*/
			grid-column: 1/1;
			grid-row: 1/1;

			width:100%;
			display: flex;
			flex-direction: column;
			align-items: center;
			text-align: center;
			opacity: 0;
			transition: opacity 1s ease-in-out;
		}
		.testimonial-slide.active{
			opacity:1;
		}
		.testimonial-slide img{
			width: 120px; height: 120px;
			border-radius: 50%;
			border: 4px solid white;
			box-shadow: 0 10px 15px -3px rgba(0,0,0,0.2);
			object-fit: cover;
			margin-bottom: -60px;
			z-index: 10;
		}
		.testimonial-quote-box {
			background-color: rgba(255,255,255,0.1);
			padding: 2rem 2rem 2rem;
			border-radius: .75rem;
			position: relative;
			width: 100%;
		}
		.testimonial-quote-box::before{
			content: '"';
			position: absolute;
			top: .4rem; left: 1rem;
			font-size: 5rem; font-weight: 800; line-height: 1;
			color: rgba(0,0,0,.05);			
		}
		.testimonial-quote-box p{
			font-size: 1.4rem; font-style: italic;
			margin-bottom: 1rem;
		}
		.testimonial-quote-box .author{
			font-size: 1rem; font-weight: 700;
			text-transform: uppercase;
			letter-spacing: 0.05rem;
		}

        /* --- FAQ Section --- */
        .oc-container {
            /*max-width: 48rem;*/
            margin: auto;
            display: flex;
            flex-direction: column;
            gap: 1rem;
        }
        .oc-item {
            background-color: white;
            border-radius: 0.5rem;
            box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1), 0 2px 4px -1px rgba(0,0,0,0.06);
            overflow: hidden;
        }
        .oc-question {
            width: 100%;
            display: flex;
            justify-content: space-between;
            align-items: center;
            text-align: left;
            padding: 1.5rem;
            font-weight: 700;
            font-size: 1.125rem;
            color: var(--colour-theme-blue);
            background: none;
            border: none;
            cursor: pointer;
        }
        .oc-question:hover {
            background-color: var(--gray-50);
        }
        .oc-icon {
            transition: transform 0.3s;
        }
        .oc-icon svg {
            width: 1rem;
            height: 1rem;
            fill: var(--blue-600);
        }
        .oc-item.open .oc-icon, .oc-item[open] .oc-icon {
            transform: rotate(45deg);
        }
        .oc-answer {
            max-height: 0;
            overflow: hidden;
            transition: max-height .5s ease-in-out;
        }
        .oc-answer p {
            padding: 0 1.5rem 1.5rem;
            color: var(--colour-theme-blue);
        }

		.oc-item::marker, .oc-item summary::webkit-details-marker {display:none;}
		
        .oc-item.open .oc-answer, .oc-item[open] .oc-answer {
            max-height: 20rem;
        }		

        /* --- FAQ Section --- */
        .faq-container {
            /*max-width: 48rem;*/
            margin: auto;
            display: flex;
            flex-direction: column;
            gap: 1rem;
        }
        .faq-item {
            background-color: white;
            border-radius: 0.5rem;
            box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1), 0 2px 4px -1px rgba(0,0,0,0.06);
            overflow: hidden;
        }
        .faq-question {
            width: 100%;
            display: flex;
            justify-content: space-between;
            align-items: center;
            text-align: left;
            padding: 1.5rem;
            font-weight: 700;
            font-size: 1.125rem;
            color: var(--colour-theme-blue);
            background: none;
            border: none;
            cursor: pointer;
        }
        .faq-question:hover {
            background-color: var(--gray-50);
        }
		.faq-question small{font-weight:500;}

        .faq-icon {
            transition: transform 0.3s;
        }
        .faq-icon svg {
            width: 1rem;
            height: 1rem;
            fill: var(--blue-600);
        }
        .faq-item.open .faq-icon, .faq-item[open] .faq-icon {
            transform: rotate(45deg);
        }
        .faq-answer {
            max-height: 0;
            overflow: hidden;
            transition: max-height .5s ease-in-out;			
        }

		.faq-answer-inner{
			padding: 0 1.5rem 1.5rem 1.5rem;
		}

		.faq-answer .btn-capsule{
			padding: .2rem .75rem .2rem 1.5rem;
		}

        .faq-answer p {            
            color: var(--colour-theme-blue);
        }

		.faq-item::marker, .faq-item summary::webkit-details-marker {display:none;}
		
        .faq-item.open .faq-answer, .faq-item[open] .faq-answer {
            max-height: 20rem;
        }
		
        /* --- Other Sections --- */
        .gallery .gallery-grid {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 3rem;
            align-items: center;
        }
        .gallery .gallery-images {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 1rem;
        }
        .gallery .gallery-images img {
            width: 100%;
            border-radius: 0.5rem;
            box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -2px rgba(0,0,0,0.05);
            transition: transform 0.3s;
			aspect-ratio: 2/1.5;
			object-fit: cover;
			object-position: center;
        }
        .gallery .gallery-images img:hover {
            transform: scale(1.05);
        }
        .gallery .gallery-images img:nth-child(even) {
            margin-top: 2rem;
        }

        #sponsors .sponsors-grid {
            display: flex;
            flex-wrap: wrap;
            justify-content: center;
            align-items: center;
            gap: 3rem;
        }
        #sponsors .sponsors-grid img {
            height: 3rem;
            filter: grayscale(100%);
            transition: filter 0.3s;
        }
        #sponsors .sponsors-grid img:hover {
            filter: grayscale(0%);
        }

        /* --- Footer --- */
        footer {
            background-color: var(--colour-theme-blue);
            color: white;
            padding: 3rem 0;
        }
        footer .footer-grid {
            display: grid;
            grid-template-columns: 1fr;
            gap: 2rem;
        }
        footer h4 {
            font-size: 1.25rem;
            font-weight: 700;
            margin-bottom: 1rem;
        }
        footer p, footer li {
            color: #d1d5db; /* gray-300 */
        }
        footer ul { list-style: none; }
        footer a, footer a:visited {
            color: var(--colour-theme-white);
            text-decoration: none;
            transition: color 0.3s;
        }
        footer a:hover {
            color: var(--colour-theme-orange);
        }
        footer .footer-links li {
            margin-bottom: 0.5rem;
        }
        footer .footer-contact li {
            display: flex;
            align-items: flex-start;
            margin-bottom: 0.75rem;
        }
        footer .footer-contact svg {
            width: 1rem;
            height: 1rem;
            margin-right: 0.75rem;
            margin-top: 0.25rem;
            fill: currentColor;
        }
        footer .social-links {
            display: flex;
            gap: 1rem;
            margin-top: 1.5rem;
        }
        footer .social-links svg {
            width: 1.5rem;
            height: 1.5rem;
        }
        footer .footer-bottom {
            margin-top: 3rem;
            padding-top: 2rem;
            border-top: 1px solid var(--gray-700);
            text-align: center;
            color: var(--gray-500);
        }

        /* --- Responsive Styles --- */
        @media (min-width: 640px) {
            #hero .hero-buttons {
                flex-direction: row;
                justify-content: center;
            }
            .timetable-activity {
                flex-direction: row;
                text-align: left;
            }
            .timetable-activity .time {
                width: 6rem;
            }
            .card-slider > .card {
                width: 45%;
            }
        }

        @media (max-width: 767px) {

			#hero .hero-image-container-inner img{
				opacity: .3;
				mix-blend-mode: multiply;
			}

			#hero .hero-image-container{
				position: relative;
				width: 250px; height: 250px; margin:auto;
			}

             #what-we-do .service-list {
                position: absolute;
                top: 100%;
                left: 0;
                right: 0;
                background: white;
                border: 1px solid var(--gray-200);
                border-radius: 0.5rem;
                box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1);
                z-index: 10;
                max-height: 0;
                overflow: hidden;
                transition: max-height 0.4s ease-in-out;
             }
             #what-we-do .service-list.open {
                max-height: 500px; /* Or a large enough value */
             }
             #what-we-do .service-list button {
                margin-bottom: 0;
                border: none;
                border-bottom: 1px solid var(--gray-100);
                border-radius: 0;
             }
             #what-we-do .service-list button:last-child {
                border-bottom: none;
             }
             #what-we-do .service-dropdown-toggle {
                display: flex;
                align-items: center;
                justify-content: space-between;
                width: 100%;
                text-align: left;
                padding: 1.5rem;
                border-radius: 0.5rem;
                border: 1px solid var(--gray-200);
                background-color: white;
                cursor: pointer;
                transition: all 0.3s;
                margin-bottom: 1rem;
             }
             #what-we-do .service-dropdown-toggle svg {
                transition: transform 0.3s;
             }
             #what-we-do .service-list.open + .service-dropdown-toggle svg {
                transform: rotate(180deg);
             }
             #what-we-do .service-list-container {
                position: relative;
             }

			.gallery .gallery-grid {grid-template-columns: 1fr}

			footer, footer .social-menu{
				text-align: center;
				align-items: center;
				justify-content: center;
			}

			footer .menu-footer {
				width:100%;
			}
        }		

        @media (min-width: 768px) {
            header .nav-links {
                display: flex;
            }
            #mobile-menu-button, #mobile-menu {
                display: none;
            }
            #hero .hero-grid {
                grid-template-columns: 1fr 1fr;
            }
            #hero .hero-image-container {
                order: 2;
            }
            #hero .hero-text-container {
                order: 1;
                text-align: left;
            }
            #hero #hero-title {
                font-size: 3rem;
            }
            #hero p {
                margin-left: 0;
                margin-right: 0;
            }
            #hero .hero-buttons {
                justify-content: flex-start;
            }
            #hero .slider-controls {
                justify-content: flex-start;
                gap: 1.5rem;
            }
            #hero .slider-dots { order: 2; }
            #hero .slider-nav-buttons { order: 1; }
            .card-slider > .card {
                width: 30%;
            }
			
            #what-we-do .content-grid {
                display: grid;
                grid-template-columns: 1fr 2fr;
                gap: 2rem;
                align-items: flex-start;
            }
			
            #what-we-do .service-dropdown-toggle {
                display: none;
            }
			
            #gallery .gallery-grid {
                grid-template-columns: 1fr 1fr;
            }
            footer .footer-grid {
                grid-template-columns: repeat(3, 1fr);
            }
			
        }

        @media (min-width: 1024px) {
			#hero h1 {
				font-size: 3rem;
			}
			.card-slider > .card {
				width: 23%;
			}

			#hero .container {width:100vw;}
        }

	/* Icons */

	.plus-icon {
		width: 15px;
		height: 15px;
		display: inline-block;
		flex-shrink: 0;
		background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath fill='currentColor' d='M256 80c0-17.7-14.3-32-32-32s-32 14.3-32 32V224H48c-17.7 0-32 14.3-32 32s14.3 32 32 32H192V432c0 17.7 14.3 32 32 32s32-14.3 32-32V288H400c17.7 0 32-14.3 32-32s-14.3-32-32-32H256V80z'/%3E%3C/svg%3E");
		background-repeat: no-repeat;
		background-size: contain;
		transition: transform 0.2s ease-in-out; 
	}		

/* Layouts */

.layout-content .content-section-inner{
	display:flex;
	gap:1rem;
}

.layout-content .content-section-inner:has(.content-section-image){
	gap: 2rem;
}

.layout-content .content-section-inner:has(.content-section-image.image-start){
	flex-direction: row-reverse;
}

.layout-content .content-section-content{flex:2;}
.layout-content .content-section-image{flex:1;}

.layout-content .content-section-image img{
	width: 100%;
	border-radius: 0.5rem;
	box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -2px rgba(0,0,0,0.05);
	transition: transform 0.3s;
	aspect-ratio: 2/1.5;
	object-fit: cover;
	object-position: center;
}

@media (max-width: 768px) {
	.layout-content .content-section-inner{
		gap:1rem;
		flex-direction: column;
	}

	.layout-content .content-section-inner:has(.content-section-image.image-start, .content-section-image.image-end){
		flex-direction: column-reverse;
		gap:1.5rem;
	}	
}

.button-row{
	display:flex; gap:1rem; flex-wrap: wrap;
	justify-content: center;
}