/*
Theme Name: Saint John Edge
Author: m5 Marketing Communications
Version: 1
Text Domain: base

*/

:root {
	--global-font-family: "Poppins", sans-serif;
	--header-font-family: "Barlow Condensed", sans-serif;
	--subheader-font-family: "Noto Serif", sans-serif;

	--color-primary: #00333E;
	--color-purple: #812CC4;
	--color-lime: #CCFF00;
	--color-blue: #307FE2;
}

html { font-size: 10px; }

body {
	color: var(--color-primary);
	font: 1.6rem/1.5 var(--global-font-family);
	-webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6 {
	font-family: var(--header-font-family);
	font-weight: 700;
}
h1 span, h2 span, h3 span, h4 span, h5 span, h6 span,
h1 small, h2 small, h3 small, h4 small, h5 small, h6 small {
	font-family: var(--subheader-font-family);
	font-weight: 600;
}
h1 {
	color: var(--color-purple);
	font-size: 6.5rem;
	line-height: .91;
	margin: 0 0 3rem;
}
h1 small {
	display: block;
	font-size: 3rem;
	line-height: 1.1;
}
h2 {
	font-size: 4.5rem;
	line-height: 4.5rem;
}
h2 small {
	display: block;
	font-size: 2.5rem;
	line-height: 1;
}
h3 {
	font-size: 3rem;
	line-height: 2.8rem;
}
h3 small {
	font-size: 2rem;
	line-height: 2.8rem;
}
a {
	text-decoration: none;
	transition: all .2s;
}
a:hover,
a:focus {  }

b, strong { -webkit-font-smoothing: auto; }

/* Alignment */
.alignleft {
	display: inline;
	float: left;
	margin-right: 1.5em;
}
.alignright {
	display: inline;
	float: right;
	margin-left: 1.5em;
}
.aligncenter {
	clear: both;
	display: block;
	margin: 0 auto;
}

:focus { outline: none; }

img {
	display: inline-block;
	height: auto;
	max-width: 100%;
}
.wp-caption {
	border: 1px solid #ccc;
	margin-bottom: 10px;
	max-width: 100%;
	border: 1px solid #ccc;
	border-radius: 4px;
	padding: 0 10px;
}
.wp-caption.aligncenter {
	margin-bottom: 10px;
}
.wp-caption img[class*="wp-image-"] {
	display: block;
}
.wp-caption .wp-caption-text {
	text-align: center;
	margin-top: 10px;
}

/* WP Gallery */
.gallery {
	margin-bottom: 1.5em;
}
.gallery a img {
	border: none;
	height: auto;
	max-width: 90%;
}
.gallery dd {
	margin: 0;
}
embed,
iframe,
object {
	max-width: 100%;
}


.container {
	max-width: 1180px;
	padding: 0 3rem;
	margin: 0 auto !important;
}
.container-wide {
	max-width: 1280px;
}

.hentry { margin: 0 0 1.5em; }
.clear { clear: both; }

.btn,
.wp-element-button,
#field_submit .gform-button {
	display: inline-flex !important;
	justify-content: center;
	align-items: center;
	width: auto;
	min-width: 29rem;
	height: 5rem;
	padding: 1rem;
	color: #fff;
	font:700 1.6rem/1.43 var(--global-font-family);
	text-align: center;
	background-color: var(--color-blue);
	border: 2px solid var(--color-blue);
	border-radius: .5rem;
	transition: all .3s;
}
.btn:hover,
.wp-element-button:hover,
#field_submit .gform-button:hover {
	color: var(--color-blue);
	background-color: #fff;
}
#field_submit .gform-button,
#section-events .btn {
	color: #fff;
	border-color: var(--color-lime);
	background-color: transparent;
}
#field_submit .gform-button:hover,
#section-events .btn:hover {
	color: var(--color-primary);
	background-color: var(--color-lime);
}
.wp-block-image {
	position: relative;
	border-radius: .5rem;
	overflow: hidden;
}

.section {
	position: relative;
	padding: 6rem 0;
	z-index: 1;
}
.section .wp-block-columns {
	justify-content: space-between;
	margin: 0 auto;
}
.section::before,
.section::after {
	position: absolute;
	left: 0;
	right: 0;
	width: 100%;
	height: 8px;
}
.section::before {
	top: -8px;
}
.section::after {
	bottom: -8px;
}
.block-content {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 1.4rem;
	text-align: center;
}
.block-content p+p {
	margin-top: 1.6rem;
}
.block-content .btn {
	margin-top: 1.5rem;
}

#section-intro .wp-block-columns {
	max-width: 103.2rem;
}

#section-planner {
	padding: 6rem 0;
}
#section-planner::after {
	content: '';
	background: linear-gradient(to right,  rgba(4,217,255,1) 0%,rgba(48,127,226,1) 100%);
} 
#section-planner .btn {
	color: var(--color-primary);
	border-color: var(--color-lime);
	background-color: var(--color-lime);
}
#section-planner .btn:hover {
	background-color: transparent;
}

#section-hello {
	padding-top: 6rem;
}
#section-hello .wp-block-columns {
	max-width: 99.4rem;
}
#section-hello .block-content {
	align-items: center;
	max-width: 50rem;
	margin: 0 auto 4rem;
	text-align: center;
}
#section-hello h2 {
	margin-bottom: 1.6rem;
}
#section-hello h2 small {
	display: block;
}
.col-content {
	display: flex;
	flex-direction: column;
	gap: 1.2rem;
}
.col-content .wp-block-image {
	margin-bottom: 1rem;
}
.link-more a {
	display: inline-block;
	color: var(--color-primary);
	font-weight: 800;
	transition: all .3s;
}
.link-more a::after {
	content: '';
	position: relative;
	display: inline-block;
	width: 1.5rem;
	height: 1.5rem;
	margin-left: .5rem;
	transform: translateY(2px);
	background: url('data:image/svg+xml,<svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M7.35568 2.35095L12.7499 7.49996L7.35568 12.649" stroke="%23307FE2" stroke-width="1.125" stroke-linecap="round" stroke-linejoin="round"/><path d="M12.7499 7.5L2.24997 7.5" stroke="%23307FE2" stroke-width="1.125" stroke-linecap="round" stroke-linejoin="round"/></svg>');
	background-size: cover;
	transition: all .3s;
}
.link-more a:hover {
	opacity: .75;
}
.link-more a:hover::after {
	transform: translate(3px,2px);
}

#section-events {
	padding: 6rem 0 8rem;
}
#section-events .wp-block-columns {
	max-width: 108.6rem;
}
#section-events::after {
	content: '';
	background: linear-gradient(to right, var(--color-lime) 0%,var(--color-primary) 100%);
}
#section-events h2,
#section-events h3 {
	color: var(--color-lime);
}
.block-events {
	display: flex;
	flex-direction: column;
	gap: 1.8rem;
}
.event-item {
	position: relative;
	border-radius: .6rem;
	overflow: hidden;
}
.event-item .event-text {
	position: absolute;
	inset: 0;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	padding: 2rem 1rem 1.2rem;
	text-align: right;
	z-index: 8;
}
.event-item .link-more a {
	font-size: 1.4rem;
}
.event-item .link-more a::after {
	background: url('data:image/svg+xml,<svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M7.35568 2.35095L12.7499 7.49996L7.35568 12.649" stroke="%23FFFFFF" stroke-width="1.125" stroke-linecap="round" stroke-linejoin="round"/><path d="M12.7499 7.5L2.24997 7.5" stroke="%23FFFFFF" stroke-width="1.125" stroke-linecap="round" stroke-linejoin="round"/></svg>');
}
.event-item .link-more a::before {
	content: '';
	position: absolute;
	inset: 0;
	background-color: #fff;
	opacity: 0;
	transition: all .3s;
	z-index: 2;
}
.event-item .link-more a:hover::before {
	opacity: .1;
}
.event-item img {
	position: relative;
	display: block;
	width: 101%;
	max-width: 101%;
	height: auto;
	z-index: 1;
}

#section-ig {
	padding: 0;
}
#section-ig .block-content {
	align-items: center;
	text-align: center;
    margin-bottom: 6rem;
}
#section-ig .block-content .btn::before {
    content: '';
    display: inline-block;
    width: 1.4rem;
    height: 1.4rem;
    margin-right: 1.2rem;
    background: url(/wp-content/uploads/2026/06/ig.svg) no-repeat center center;
}
#section-ig .block-content .btn:hover::before {
    background-image: url(/wp-content/uploads/2026/06/ig-blue.svg);
}

#section-acknowledgement {
	padding: 4rem 0;
}
.block-wide {
	padding: 6rem 2rem 7rem;
	border-radius: .5rem;
}
.block-wide .wp-block-column {
	max-width: 99.4rem;
	margin: 0 auto;
}
.block-wide .block-content {
	align-items: center;
	text-align: center;
}
.block-wide .block-content h2 {
	margin-bottom: 1.6rem;
}

#section-footer {
	padding: 4.5rem 0 0.4rem;
	font-size: 14px;
}
#section-footer::before {
	content: '';
	background: linear-gradient(to right, var(--color-lime) 0%,var(--color-primary) 100%);
}
#section-footer > .wp-block-column {
	max-width: 107.4rem;
	margin: 0 auto;
}
#section-footer .block-content {
	gap: 3.5rem;
}
#section-footer h2 {
	color: var(--color-lime);
}
#section-footer a:hover {
	color: var(--color-lime);
}
#gform_wrapper_1 {
	padding: 4.8rem 0 2.4rem;
}
#gform_fields_1 {
	grid-template-columns: 48.4% 41.24%;
	column-gap: 10%;
	row-gap: 1.4rem;
}
#gform_fields_1 .gfield--width-full {
	grid-column: span 2;
}
#gform_wrapper_1 .gform_required_legend,
#gform_wrapper_1 .gform-footer {
	display: none;
}
#gform_wrapper_1 .gfield_label,
#gform_wrapper_1 .gfield_required,
#gform_wrapper_1 .gform-field-label,
#gform_wrapper_1 .gfield--type-html {
	color: #fff;
	font-size: 1.2rem;
}
#gform_wrapper_1 .gfield--type-html {
	padding-bottom: 1.8rem;
}
#gform_wrapper_1 .ginput_container_consent {
	display: block;
}
#gform_wrapper_1 .ginput_container_consent input {
	float: left;
	margin-top: -.3rem;
	margin-right: 1rem;
	border-color: #fff;
	background: none;
}
#gform_wrapper_1 .ginput_container_consent .gform-field-label {
	font-size: 1.4rem;
	line-height: 1.4;
	margin: 0;
}
#gform_fields_1 #field_submit {
	align-items: start;
}
.row-contact {
	gap: 3.2rem;
	margin-bottom: 1.8rem;
}
.row-social {
	gap: 2rem;
}
.row-social .wp-block-image {
	border-radius: 0;
}
.row-social a:hover img {
	opacity: .75;
}
.row-logos {
	gap: .3rem;
}
.logo-rainbow {
	width: 15.9rem;
}
#section-footer .logo-envision {
	width: 14.8rem;
	margin-right: -2.5rem;
}

#section-footer .wp-block-separator {
	border-width: .5px;
}
.row-copyright {
	padding: 2rem 0 4rem;
	font-size: 1.2rem;
}

.slick-slide {
	position: relative;
	border-radius: .5rem;
	overflow: hidden;
}
.slide-nav {
	display: flex;
	justify-content: center;
	gap: 1.8rem;
	padding-top: 6rem;
}
.slide-nav .slick-arrow {
	cursor: pointer;
	display: inline-block;
	width: 1.5rem;
	height: 1.5rem;
	border: 0;
	background: transparent url('data:image/svg+xml,<svg width="8" height="13" viewBox="0 0 8 13" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M6.39423 11.2981L1.00002 6.14908L6.39423 1.00007" stroke="%236D758F" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>') no-repeat 2px center;
	background-size: 1rem 1.3rem;
}
.slide-nav .slick-arrow:hover {
	background-image: url('data:image/svg+xml,<svg width="8" height="13" viewBox="0 0 8 13" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M6.39423 11.2981L1.00002 6.14908L6.39423 1.00007" stroke="%23307FE2" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>');
}
.slide-nav .slick-prev {
	order: 1;
}
.slide-nav .slick-next {
	order: 3;
	transform: scale(-1);
}
.slide-nav .slick-dots {
	order: 2;
	display: flex;
	gap: 1.8rem;
}
.slide-nav .slick-dots li {
	display: inline-flex;
	align-items: center;
	height: 1.5rem;
}
.slide-nav .slick-dots li button {
	cursor: pointer;
	width: 2.3rem;
	height: .7rem;
	border: 0;
	border-radius: 50vh;
	background-color: rgba(109, 128, 143, .5);
	transition: all .3s;
}
.slide-nav .slick-dots li:hover button {
	background-color: var(--color-blue);
}
.slide-nav .slick-dots li.slick-active button {
	width: 4.5rem;
	background-color: var(--color-blue);
}


@media (min-width: 768px) {
	
	.container { padding: 0 4rem; }
	.btn,
	.wp-element-button,
	#field_submit .gform-button { font-size: 1.4rem; }
	#main { padding-top: 14.4rem; }
	.section { padding: 6.94% 0; }
	#section-hello h2 br { display: none; }
	.col-content .wp-block-image { margin-bottom: 2rem; }
	#section-events { padding-bottom: 6rem; }
	#section-hello .wp-block-columns,
	#section-footer .wp-block-columns { flex-wrap: nowrap !important; }
	.event-item .event-text { padding: 2.8rem 1.2rem 1.6rem; }
	.event-item .event-text h3 { padding-right: .8rem; }
	.slide-nav { padding-top: 4rem; }
	#section-footer .block-content { gap: .5rem; }
	#gform_wrapper_1 { padding-top: 2.4rem; }
	#gform_fields_1 .gfield--width-half { grid-column: span 1; }
	#gform_wrapper_1 .gfield--type-html { padding-bottom: .4rem; }
	#section-footer .wp-block-separator { margin-top: 1rem; }
	.row-copyright { padding-bottom: 2rem; }
	
}

@media (min-width: 992px) {

	h1 { font-size: 7.5rem; margin: 0 0 3rem; max-width: 25rem; }
	h1 small { font-size: 3.5rem; line-height: 4rem; }
	h2 small { display: inline-block; line-height: 4.5rem; }
	.btn,
	.wp-element-button,
	#field_submit .gform-button { max-width: 25rem; }
	#main { padding-top: 17.6rem; }
	.block-content { align-items: start; text-align: left; }
	.block-wide { padding: 8rem 2rem 10rem; }
	#section-hello { padding-top: 5.5%; }
	#section-hello .block-content { margin-bottom: 8rem; }
	#section-events { padding: 1.4rem 0; }
	
}

@media (min-width: 1280px) {
	#main { padding-top: 20rem; }
}

@media (min-width: 1440px) {

	.section { padding: 10rem 0; }
	#section-hello { padding-top: 8rem; }
	
}

@media (max-width: 991px) {
	
	.section .wp-block-columns { gap: 4rem; }
	#section-intro { text-align: center; }
	#section-intro .wp-block-columns { align-items: center; }
	#section-intro .wp-block-image { text-align: center; }
	#section-intro .wp-block-image a { display: block; position: relative; width: 100%; min-height: 31rem; }
	#section-intro .wp-block-image img { position: absolute; left: 0; width: 100%; height: 100%; object-fit: cover; }
	#section-planner { padding-bottom: 8rem; background: linear-gradient(180deg, rgb(129, 44, 196) 0%, rgb(48, 127, 226) 100%) !important; }
	.row-contact { flex-direction: column; align-items: start; gap: 1rem; }
	

}

@media (max-width: 767px) {
	
	#section-planner .wp-block-image { min-height: 41.6rem; }
	.col-content .wp-block-image { min-height: 27.6rem; }
	.col-content h3,
	.col-content p { padding-left: 1rem; }
	.block-events { padding-top: 2rem; gap: .7rem; }
	.event-item { min-height: 13.5rem; }
	.event-item img { position: absolute; width: 100%; height: 100%; object-fit: cover; }
	.event-text h3 small { font-size: 1.6rem; }
	#section-region .wp-block-columns { gap: 8.6rem; }
	.block-gallery .slick-slide { min-height: 29.7rem; }
	#section-planner .wp-block-image img,
	.col-content .wp-block-image img,
	.block-gallery .slick-slide img { position: absolute; height: 100%; object-fit: cover; }
	#section-planner .wp-block-image img { object-position: 68%; }
    .item-1 img { object-position: 100%; }
	#section-acknowledgement .container { padding: 0 1.5rem; }
	#section-acknowledgement h2 { font-size: 4.2rem; }
	#gform_fields_1 #field_submit { justify-content: center; padding-top: 2rem; }
	.row-contact { gap: 2rem; }
	#section-footer .wp-block-columns { gap: 0; }
	#section-footer .row-logos { justify-content: center; }
	.logo-rainbow { width: 14rem; }
	.logo-envision { width: 12.8rem; }
	#section-footer .row-copyright p { text-align: left; }

}