.ecs-event-hero{position:relative;isolation:isolate;width:100%;height:var(--ecs-event-hero-height,80vh);min-height:560px;overflow:hidden;background:#071c28;color:#fff;display:flex;align-items:center;justify-content:center}.ecs-event-hero__media,.ecs-event-hero__overlay,.ecs-event-hero__shapes{position:absolute;inset:0}.ecs-event-hero__media{z-index:0;background-position:center;background-size:cover;overflow:hidden}.ecs-event-hero__video-inner{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:100%;height:100%}.ecs-event-hero__video-inner wistia-player,.ecs-event-hero__video-inner video,.ecs-event-hero__video-inner iframe{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;max-width:none!important;object-fit:cover!important}.ecs-event-hero__overlay{z-index:1;background:var(--ecs-event-hero-overlay,#071c28);opacity:var(--ecs-event-hero-overlay-opacity,.62)}.ecs-event-hero__shapes{z-index:2;pointer-events:none}.ecs-event-hero__shape{position:absolute;width:var(--s,140px);aspect-ratio:741.49/1079.45;opacity:0;animation:ecsHeroShape 14s ease-in-out infinite}.ecs-event-hero__shape svg{width:100%;height:100%;overflow:visible}.ecs-event-hero__shape path{fill:none;stroke-width:3px;vector-effect:non-scaling-stroke}.ecs-event-hero__shape.one path{stroke:var(--ecs-event-hero-shape-one,#ec7614);animation:ecsHeroColorOne 14s ease-in-out infinite}.ecs-event-hero__shape.two path{stroke:var(--ecs-event-hero-shape-two,#918cff);animation:ecsHeroColorTwo 14s ease-in-out infinite}.ecs-event-hero__shape.delay-1,.ecs-event-hero__shape.delay-1 path{animation-delay:2s}.ecs-event-hero__shape.delay-2,.ecs-event-hero__shape.delay-2 path{animation-delay:4s}.ecs-event-hero__shape.delay-3,.ecs-event-hero__shape.delay-3 path{animation-delay:6s}.ecs-event-hero__shape.delay-4,.ecs-event-hero__shape.delay-4 path{animation-delay:8s}.ecs-event-hero__shape.delay-5,.ecs-event-hero__shape.delay-5 path{animation-delay:10s}.ecs-event-hero__content{position:relative;z-index:3;text-align:center;display:flex;flex-direction:column;align-items:center;gap:24px;padding-top:80px}.ecs-event-hero__logo{display:block;width:min(560px,70vw);max-height:150px;object-fit:contain}.ecs-event-hero__headline{font-size:clamp(20px,1.65vw,32px);font-weight:600;text-transform:uppercase;letter-spacing:.01em;margin:0}.ecs-event-hero__details{display:flex;flex-wrap:wrap;justify-content:center;gap:20px 38px;font-size:clamp(17px,1.25vw,25px)}.ecs-event-hero__detail{position:relative;padding-right:28px}.ecs-event-hero__detail:after{position:absolute;right:0;top:50%;transform:translateY(-50%);font-size:.85em}.ecs-event-hero__detail--date:after{content:'▣'}.ecs-event-hero__detail--venue:after{content:'▦'}.ecs-event-hero__detail--location:after{content:'●'}.ecs-event-hero__actions{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}.ecs-event-hero__button,.ecs-event-hero__button:hover,.ecs-event-hero__button:focus,.ecs-event-hero__button:active{transform:none!important;scale:1!important}.ecs-event-hero__button span,.ecs-event-hero__button:hover span,.ecs-event-hero__button:focus span,.ecs-event-hero__button:active span{transform:none!important}.ecs-event-hero__button{background:#ec7614!important;color:#071c28!important;border-color:#ec7614!important;padding:0!important}.ecs-event-hero__button span{display:block;padding:15px 34px!important}.ecs-event-hero__button--secondary{background:transparent!important;color:#fff!important;border:2px solid #fff!important}.ecs-event-hero-overlay-header .header-section{position:absolute!important;top:0!important;left:0;right:0;z-index:1000;background:transparent!important}.admin-bar.ecs-event-hero-overlay-header .header-section{top:32px!important}.ecs-event-hero-overlay-header .header-section .main-menu-link{color:#fff!important}.ecs-event-hero-hide-existing .hero-section,.ecs-event-hero-hide-existing .engageheader{display:none!important}@keyframes ecsHeroShape{0%{opacity:0;transform:translate(-50%,-50%) translateX(0)}12%,38%{opacity:.32}50%{opacity:0}62%,88%{opacity:.32}100%{opacity:0;transform:translate(-50%,-50%) translateX(var(--d,48px))}}@keyframes ecsHeroColorOne{0%,49.9%{stroke:var(--ecs-event-hero-shape-one)}50%,100%{stroke:var(--ecs-event-hero-shape-two)}}@keyframes ecsHeroColorTwo{0%,49.9%{stroke:var(--ecs-event-hero-shape-two)}50%,100%{stroke:var(--ecs-event-hero-shape-one)}}@media(max-width:782px){.admin-bar.ecs-event-hero-overlay-header .header-section{top:46px!important}}@media(max-width:768px){.ecs-event-hero{height:var(--ecs-event-hero-mobile-height,100vh);min-height:680px}.ecs-event-hero__content{padding:100px 20px 40px;gap:20px}.ecs-event-hero__logo{width:min(88vw,500px)}.ecs-event-hero__headline{font-size:20px}.ecs-event-hero__details{flex-direction:column;gap:12px;font-size:18px}.ecs-event-hero__detail{padding-right:0}.ecs-event-hero__detail:after{display:none}.ecs-event-hero__shape{width:calc(var(--s,140px)*.68)}}@media(prefers-reduced-motion:reduce){.ecs-event-hero__shape,.ecs-event-hero__shape path{animation:none!important;opacity:.2}}

/*
 * Event Hero header integration.
 *
 * The core theme header is fixed and receives .shrink from the theme's scroll
 * handler. Event Hero must preserve that behavior while using a transparent,
 * light-mode treatment only while the video is behind the navigation.
 */
:root {
	--ecs-event-hero-admin-offset: 0px;
}

body.admin-bar {
	--ecs-event-hero-admin-offset: 32px;
}

body.ecs-event-hero-overlay-header .header-section.ecs-event-hero-header,
body.page-template-template-event-hero .header-section.ecs-event-hero-header,
body.ecs-event-hero-template-active .header-section.ecs-event-hero-header {
	position: fixed !important;
	top: calc(var(--ecs-event-hero-admin-offset) + var(--ecs-event-banner-height, 0px)) !important;
	left: 0;
	right: 0;
	width: 100%;
	z-index: 1000;
}

body.ecs-event-hero-overlay-header .header-section.ecs-event-hero-header:not(.shrink),
body.page-template-template-event-hero .header-section.ecs-event-hero-header:not(.shrink),
body.ecs-event-hero-template-active .header-section.ecs-event-hero-header:not(.shrink) {
	background: transparent !important;
	box-shadow: none !important;
}

body.ecs-event-hero-overlay-header .header-section.ecs-event-hero-header.shrink,
body.page-template-template-event-hero .header-section.ecs-event-hero-header.shrink,
body.ecs-event-hero-template-active .header-section.ecs-event-hero-header.shrink {
	background-color: var(--ecs_header_bgcolor_sticky) !important;
	box-shadow: 0 4px 30px 0 var(--ecs_border_10) !important;
}

/* Video-backed hero: use the theme's native light-header appearance at top. */
body.ecs-event-hero-has-video .header-section.ecs-event-hero-header:not(.shrink) .dark-logo {
	display: block !important;
	opacity: 0 !important;
	visibility: hidden !important;
}

body.ecs-event-hero-has-video .header-section.ecs-event-hero-header:not(.shrink) .white-logo {
	display: block !important;
	opacity: 1 !important;
	visibility: visible !important;
}

body.ecs-event-hero-has-video .header-section.ecs-event-hero-header:not(.shrink) .main-menu-link,
body.ecs-event-hero-has-video .header-section.ecs-event-hero-header:not(.shrink) .header-slide-title,
body.ecs-event-hero-has-video .header-section.ecs-event-hero-header:not(.shrink) .header-slide-title-inner {
	color: var(--ecs_white) !important;
}

body.ecs-event-hero-has-video .header-section.ecs-event-hero-header:not(.shrink) .header-search-icon svg path {
	fill: var(--ecs_white) !important;
}

body.ecs-event-hero-has-video .header-section.ecs-event-hero-header:not(.shrink) .menu-btn span {
	background-color: var(--ecs_white) !important;
}

body.ecs-event-hero-has-video .header-section.ecs-event-hero-header:not(.shrink) .header-slide-box img {
	filter: invert(1);
}

/* Once scrolled, return to the standard sticky white header and colored logo. */
body.ecs-event-hero-has-video .header-section.ecs-event-hero-header.shrink .dark-logo {
	display: block !important;
	opacity: 1 !important;
	visibility: visible !important;
}

body.ecs-event-hero-has-video .header-section.ecs-event-hero-header.shrink .white-logo {
	display: block !important;
	opacity: 0 !important;
	visibility: hidden !important;
}

body.ecs-event-hero-has-video .header-section.ecs-event-hero-header.shrink .main-menu-link,
body.ecs-event-hero-has-video .header-section.ecs-event-hero-header.shrink .header-slide-title,
body.ecs-event-hero-has-video .header-section.ecs-event-hero-header.shrink .header-slide-title-inner {
	color: var(--ecs_dark_text) !important;
}

body.ecs-event-hero-has-video .header-section.ecs-event-hero-header.shrink .header-search-icon svg path {
	fill: var(--ecs_dark_text) !important;
}

body.ecs-event-hero-has-video .header-section.ecs-event-hero-header.shrink .menu-btn span {
	background-color: var(--ecs_black) !important;
}

body.ecs-event-hero-has-video .header-section.ecs-event-hero-header.shrink .header-slide-box img {
	filter: invert(0);
}

body.page-template-template-event-hero .ecs-event-hero__content {
	padding-top: 140px;
}

body.page-template-template-event-hero .ecs-event-hero-page-content {
	position: relative;
	z-index: 1;
}

body.ecs-event-hero-template-active .ecs-event-hero {
	margin-top: 0;
}

@media (max-width: 782px) {
	body.admin-bar {
		--ecs-event-hero-admin-offset: 46px;
	}
}

/* Shared, configurable Event Hero detail icon. Legacy per-field glyphs are disabled. */
.ecs-event-hero__detail {
	align-items: center;
	display: inline-flex;
	gap: 14px;
	padding-right: 0 !important;
}

.ecs-event-hero__detail::after,
.ecs-event-hero__detail--date::after,
.ecs-event-hero__detail--venue::after,
.ecs-event-hero__detail--location::after {
	content: none !important;
	display: none !important;
}

.ecs-event-hero__detail-icon {
	box-sizing: border-box;
	display: inline-block;
	flex: 0 0 auto;
}

.ecs-event-hero__detail-icon--dot {
	background: currentColor;
	border-radius: 50%;
	height: 9px;
	width: 9px;
}

.ecs-event-hero__detail-icon--square {
	border: 2px solid currentColor;
	height: 14px;
	width: 14px;
}

.ecs-event-hero__detail-icon--custom {
	height: 24px;
	object-fit: contain;
	width: 24px;
}

/* The theme button component adds its own hover arrow. Event Hero CTAs do not. */
.ecs-event-hero .ecs-event-hero__button::before,
.ecs-event-hero .ecs-event-hero__button::after,
.ecs-event-hero .ecs-event-hero__button span::before,
.ecs-event-hero .ecs-event-hero__button span::after,
.ecs-event-hero .ecs-event-hero__button:hover::before,
.ecs-event-hero .ecs-event-hero__button:hover::after,
.ecs-event-hero .ecs-event-hero__button:hover span::before,
.ecs-event-hero .ecs-event-hero__button:hover span::after,
.ecs-event-hero .ecs-event-hero__button:focus::before,
.ecs-event-hero .ecs-event-hero__button:focus::after,
.ecs-event-hero .ecs-event-hero__button:focus span::before,
.ecs-event-hero .ecs-event-hero__button:focus span::after {
	background: none !important;
	border: 0 !important;
	content: none !important;
	display: none !important;
	height: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	width: 0 !important;
}


/* Theme-derived Event Hero gradient presets. */
.ecs-event-hero--bg-custom .ecs-event-hero__overlay { background: var(--ecs-event-hero-overlay, #071c28); }
.ecs-event-hero--bg-dark-blue-fade .ecs-event-hero__overlay { background: linear-gradient(180deg, #0d3347 0%, rgba(13, 51, 71, 0) 100%); }
.ecs-event-hero--bg-blue-purple .ecs-event-hero__overlay { background: linear-gradient(180deg, #27516f 0%, rgba(145, 140, 255, .3) 100%); }
.ecs-event-hero--bg-purple-rise .ecs-event-hero__overlay { background: linear-gradient(180deg, rgba(145, 140, 255, 0) 0%, #918cff 100%); }
.ecs-event-hero--bg-cyan-purple .ecs-event-hero__overlay { background: linear-gradient(135deg, rgba(5, 194, 222, .88) 0%, rgba(145, 140, 255, .9) 100%); }
.ecs-event-hero--bg-dark-blue-sweep .ecs-event-hero__overlay { background: linear-gradient(180deg, #0d3347 0%, rgba(13, 51, 71, .5) 100%); }

/* Button hover states retain each CTA's color and brighten it slightly. */
.ecs-event-hero__button,
.ecs-event-hero__button:visited {
	--ecs-event-hero-button-bg: #ec7614;
	--ecs-event-hero-button-hover: color-mix(in srgb, var(--ecs-event-hero-button-bg) 84%, white);
	background: var(--ecs-event-hero-button-bg) !important;
	border-color: var(--ecs-event-hero-button-bg) !important;
	transition: background-color .2s ease, border-color .2s ease, color .2s ease !important;
}
.ecs-event-hero__button:hover,
.ecs-event-hero__button:focus-visible {
	background: var(--ecs-event-hero-button-hover) !important;
	border-color: var(--ecs-event-hero-button-hover) !important;
}
.ecs-event-hero__button--secondary,
.ecs-event-hero__button--secondary:visited {
	--ecs-event-hero-button-bg: #ffffff;
	background: transparent !important;
	border-color: var(--ecs-event-hero-button-bg) !important;
	color: var(--ecs-event-hero-button-bg) !important;
}
.ecs-event-hero__button--secondary:hover,
.ecs-event-hero__button--secondary:focus-visible {
	background: color-mix(in srgb, var(--ecs-event-hero-button-bg) 22%, transparent) !important;
	border-color: var(--ecs-event-hero-button-hover) !important;
	color: var(--ecs-event-hero-button-hover) !important;
}

/* v39: each Event Hero detail has its own icon and independent control. */
.ecs-event-hero__detail-icon--default {
  height: 25px;
  width: 25px;
}
.ecs-event-hero__detail-icon--default svg {
  display: block;
  fill: none;
  height: 100%;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.8;
  width: 100%;
}

/* v44: independently configurable Event Hero icon color and size. */
.ecs-event-hero__detail-icon {
	color: var(--ecs-event-detail-icon-color, currentColor);
	height: var(--ecs-event-detail-icon-size, 25px) !important;
	width: var(--ecs-event-detail-icon-size, 25px) !important;
}
.ecs-event-hero__detail-icon--custom-image {
	object-fit: contain;
}
.ecs-event-hero__detail-icon--custom-svg {
	background-color: var(--ecs-event-detail-icon-color, currentColor);
	display: inline-block;
	-webkit-mask-image: var(--ecs-event-detail-icon-image);
	mask-image: var(--ecs-event-detail-icon-image);
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-size: contain;
	mask-size: contain;
}
