/*
 * Site header and footer (Divi Theme Builder layouts).
 * Uses the tokens from program-pages.css, which loads first on every page.
 *
 * Header: the Divi Menu module carries the class `menu_11`; links are edited
 *         in Appearance → Menus. Top-level items whose CSS Classes field holds
 *         `sea-nav-btn sea-nav-btn--solid` or `sea-nav-btn sea-nav-btn--ghost`
 *         show as buttons (Participant Dashboard and Events Calendar).
 * Footer: the footer section carries `sea-footer`; rows carry `sea-footer-cta`,
 *         `sea-footer-links` and `sea-footer-legal`; its two Button modules carry
 *         `sea-footer-btn` plus `--solid` or `--ghost`.
 */

/* ---------- Header bar ---------- */

.et-l--header .et_pb_section--with-menu {
	padding: 0 !important;
	background: #fff !important;
	border-bottom: 1px solid var(--sea-sand);
	box-shadow: none !important;
}

.et-l--header .et_pb_section--with-menu .et_pb_row {
	width: calc(100% - 2 * var(--space-gutter)) !important;
	max-width: 1200px !important;
	padding: 0 !important;
}

.et-l--header .menu_11 .et_pb_menu_inner_container {
	align-items: center;
	min-height: 80px;
}

.et-l--header .menu_11 .et_pb_menu__logo-wrap { flex: none; margin-right: var(--sp-5); }
.et-l--header .menu_11 .et_pb_menu__logo { padding: var(--sp-3) 0; }

.et-l--header .menu_11 .et_pb_menu__logo img {
	width: auto !important;
	height: 48px !important;
	max-height: none !important;
}

.et-l--header .menu_11 .et_pb_menu__wrap { justify-content: flex-end; }

/* ---------- Top-level links ---------- */

.et-l--header .menu_11 .et_pb_menu__menu > nav > ul {
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	gap: var(--sp-1);
}

.et-l--header .menu_11 .et_pb_menu__menu > nav > ul > li {
	position: relative;
	margin: 0 !important;
	padding: 0 !important;
}

.et-l--header .menu_11 .et_pb_menu__menu > nav > ul > li > a {
	display: inline-flex !important;
	align-items: center;
	gap: 6px;
	padding: var(--sp-3) 10px !important;
	font-family: var(--font-sans) !important;
	font-size: var(--fs-ui) !important;
	font-weight: var(--fw-medium) !important;
	line-height: var(--lh-title) !important;
	color: var(--sea-navy) !important;
	white-space: nowrap;
	border-radius: 6px;
	opacity: 1 !important;
	transition: background-color .2s;
}

/* Hover (and keyboard focus) fill behind the link. */
.et-l--header .menu_11 .et_pb_menu__menu > nav > ul > li:not(.sea-nav-btn):is(:hover, :focus-within) > a { background: var(--sea-sand); }

/* Underline for hover and the current section, like the in-page menus. */
.et-l--header .menu_11 .et_pb_menu__menu > nav > ul > li::before {
	content: "";
	position: absolute;
	left: 10px;
	right: 10px;
	bottom: 4px;
	width: auto;
	height: 2px;
	border-radius: 2px;
	background: var(--sea-red);
	transform: scaleX(0);
	transition: transform .25s;
}

.et-l--header .menu_11 .et_pb_menu__menu > nav > ul > li:hover::before,
.et-l--header .menu_11 .et_pb_menu__menu > nav > ul > li:is(.current-menu-item, .current-menu-ancestor)::before { transform: scaleX(1); }

.et-l--header .menu_11 .et_pb_menu__menu > nav > ul > li:is(.current-menu-item, .current-menu-ancestor) > a { font-weight: var(--fw-semibold) !important; }

/* Chevron in place of Divi's icon-font arrow. */
.et-l--header .menu_11 .et-menu .menu-item-has-children > a {
	padding-right: 10px !important;
}

.et-l--header .menu_11 .et-menu .menu-item-has-children > a::after {
	content: "" !important;
	position: static !important;
	display: block !important;
	width: 14px;
	height: 14px;
	margin: 0 !important;
	font-size: 0 !important;
	background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") center / contain no-repeat;
	transform: none;
	transition: transform .2s;
}

.et-l--header .menu_11 .et_pb_menu__menu > nav > ul > li:hover > a::after { transform: rotate(180deg); }

/* Menu items marked as buttons (CSS Classes in Appearance → Menus). */
.et-l--header .menu_11 .et_pb_menu__menu > nav > ul > li.sea-nav-btn::before { display: none; }
.et-l--header .menu_11 .et_pb_menu__menu > nav > ul > li:not(.sea-nav-btn) + li.sea-nav-btn { margin-left: var(--sp-4) !important; }
.et-l--header .menu_11 .et_pb_menu__menu > nav > ul > li.sea-nav-btn + li.sea-nav-btn { margin-left: var(--sp-2) !important; }

.et-l--header .menu_11 .et_pb_menu__menu > nav > ul > li.sea-nav-btn > a {
	padding: 10px var(--sp-4) !important;
	border: 2px solid var(--sea-navy);
	border-radius: 4px;
	font-weight: var(--fw-semibold) !important;
	transition: background-color .2s, color .2s, border-color .2s;
}

.et-l--header .menu_11 .et_pb_menu__menu > nav > ul > li.sea-nav-btn--solid > a { background: var(--sea-navy); color: #fff !important; }
.et-l--header .menu_11 .et_pb_menu__menu > nav > ul > li.sea-nav-btn--solid:hover > a { background: var(--sea-blue); border-color: var(--sea-blue); }
.et-l--header .menu_11 .et_pb_menu__menu > nav > ul > li.sea-nav-btn--ghost > a { background: transparent; color: var(--sea-navy) !important; }
.et-l--header .menu_11 .et_pb_menu__menu > nav > ul > li.sea-nav-btn--ghost:hover > a { background: var(--sea-navy); color: #fff !important; }

/* ---------- Dropdowns ---------- */

.et-l--header .menu_11 .et-menu ul.sub-menu {
	width: 280px;
	padding: var(--sp-2) !important;
	border: 1px solid var(--sea-sand) !important;
	border-radius: var(--sea-radius-sm);
	background: #fff !important;
	box-shadow: 0 16px 40px -12px rgba(21, 41, 78, .25);
	z-index: 1000;
}

/* Right-hand dropdowns open leftward so they stay on screen. */
.et-l--header .menu_11 .et_pb_menu__menu > nav > ul > li:nth-last-child(-n+3) > ul.sub-menu { left: auto; right: 0; }

.et-l--header .menu_11 .et-menu ul.sub-menu li {
	width: 100%;
	padding: 0 !important;
}

.et-l--header .menu_11 .et-menu ul.sub-menu li > a {
	display: flex !important;
	align-items: center;
	justify-content: space-between;
	gap: var(--sp-3);
	width: 100% !important;
	padding: var(--sp-2) var(--sp-3) !important;
	border-radius: 8px;
	font-family: var(--font-sans) !important;
	font-size: var(--fs-ui) !important;
	font-weight: var(--fw-regular) !important;
	line-height: var(--lh-snug) !important;
	color: var(--sea-ink) !important;
	background: transparent !important;
	opacity: 1 !important;
}

.et-l--header .menu_11 .et-menu ul.sub-menu li > a:is(:hover, :focus-visible),
.et-l--header .menu_11 .et-menu ul.sub-menu li.current-menu-item > a {
	/* !important: older Divi menu settings or custom CSS on a site can set a dark hover background. */
	background: var(--sea-sand) !important;
	color: var(--sea-navy) !important;
}

/* Third level opens to the side; its chevron points right. */
.et-l--header .menu_11 .et-menu ul.sub-menu ul.sub-menu { top: calc(-1 * var(--sp-2) - 1px); left: 100%; }
.et-l--header .menu_11 .et-menu ul.sub-menu .menu-item-has-children > a::after { transform: rotate(-90deg) !important; }

/* ---------- Header: hamburger menu when the full menu would not fit ---------- */

/* Logo + menu (with its two buttons) need about 1,190px; below 1320px the full
   menu would not fit beside the logo once a scrollbar takes its share. Longer
   labels in Appearance → Menus may need this raised. */
@media (max-width: 1320px) {
	.et-l--header .menu_11 .et_pb_menu__menu { display: none !important; }
	.et-l--header .menu_11 .et_mobile_nav_menu { display: flex !important; align-items: center; }
}

.et-l--header .menu_11 .mobile_menu_bar::before {
	padding: 0 !important;
	border-radius: 0 !important;
	background: none !important;
	font-size: 32px;
	color: var(--sea-navy) !important;
}

.et-l--header .menu_11 .et_mobile_menu {
	padding: var(--sp-2) 0 !important;
	border: 0 !important;
	border-top: 1px solid var(--sea-sand) !important;
	background: #fff !important;
	box-shadow: 0 16px 40px -12px rgba(21, 41, 78, .25);
}

.et-l--header .menu_11 .et_mobile_menu li a {
	padding: var(--sp-3) var(--space-gutter) !important;
	border-bottom: 1px solid var(--sea-sand) !important;
	font-family: var(--font-sans) !important;
	font-size: var(--fs-small) !important;
	font-weight: var(--fw-medium) !important;
	color: var(--sea-navy) !important;
	background: transparent !important;
	opacity: 1 !important;
}

.et-l--header .menu_11 .et_mobile_menu li:not(.sea-nav-btn) > a:hover { background: var(--sea-sand) !important; }

/* Button items at the end of the phone menu. */
.et-db #et-boc .et-l .menu_11 .et_mobile_menu li.sea-nav-btn { padding: var(--sp-3) var(--space-gutter) 0 !important; }
.et-db #et-boc .et-l .menu_11 .et_mobile_menu li.sea-nav-btn:last-child { padding-bottom: var(--sp-3) !important; }

.et-l--header .menu_11 .et_mobile_menu li.sea-nav-btn > a {
	display: flex !important;
	justify-content: center;
	padding: var(--sp-3) var(--sp-4) !important;
	border: 2px solid var(--sea-navy) !important;
	border-radius: 4px;
	font-weight: var(--fw-semibold) !important;
}

.et-l--header .menu_11 .et_mobile_menu li.sea-nav-btn--solid > a { background: var(--sea-navy) !important; color: #fff !important; }
.et-l--header .menu_11 .et_mobile_menu li.sea-nav-btn--ghost > a { background: #fff !important; color: var(--sea-navy) !important; }

.et-l--header .menu_11 .et_mobile_menu ul.sub-menu { padding: 0 !important; background: var(--sea-sand-soft); }
.et-l--header .menu_11 .et_mobile_menu ul.sub-menu li a { padding-left: calc(var(--space-gutter) + var(--sp-4)) !important; font-weight: var(--fw-regular) !important; }

/* Expand/collapse indicator for items with children (the header script toggles .visible). */
.et-l--header .menu_11 .et_mobile_menu .menu-item-has-children > a { position: relative; padding-right: calc(var(--space-gutter) + 32px) !important; }

.et-l--header .menu_11 .et_mobile_menu .menu-item-has-children > a::after {
	content: "" !important;
	position: absolute;
	top: 50% !important;
	right: var(--space-gutter) !important;
	width: 16px !important;
	height: 16px;
	margin-top: -8px;
	border-radius: 0 !important;
	font-size: 0 !important;
	background: var(--sea-navy) !important;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") center / contain no-repeat;
	transition: transform .2s;
}

.et-l--header .menu_11 .et_mobile_menu .menu-item-has-children.visible > a::after { transform: rotate(180deg); }

/* Divi's own mobile-menu rules use #et-boc, so these match that specificity. */
.et-db #et-boc .et-l .menu_11 .et_mobile_menu,
.et-db #et-boc .et-l .menu_11 .et_mobile_menu ul {
	list-style: none !important;
	text-align: left !important;
}

.et-db #et-boc .et-l .menu_11 .et_mobile_menu li { list-style: none !important; padding: 0 !important; }
.et-db #et-boc .et-l .menu_11 .et_mobile_menu li::marker { content: none; }

.et-db #et-boc .et-l .menu_11 .et_mobile_menu ul.sub-menu {
	display: none !important;
	visibility: hidden !important;
	padding: 0 !important;
}

.et-db #et-boc .et-l .menu_11 .et_mobile_menu li.visible > ul.sub-menu {
	display: block !important;
	visibility: visible !important;
}

.et-db #et-boc .et-l .menu_11 .et_mobile_menu ul.sub-menu ul.sub-menu li a { padding-left: calc(var(--space-gutter) + var(--sp-7)) !important; }

/* ---------- Footer ----------
   Three rows: contact strip (.sea-footer-cta), logo + link groups
   (.sea-footer-links), funding disclaimer (.sea-footer-legal). */

.sea-footer.et_pb_section {
	padding: var(--sp-8) 0 var(--sp-7) !important;
	background: var(--sea-navy) !important;
	font-family: var(--font-sans);
}

.sea-footer .et_pb_row {
	width: calc(100% - 2 * var(--space-gutter)) !important;
	max-width: 1200px !important;
	padding: 0 !important;
}

.sea-footer-cta.et_pb_row,
.sea-footer-links.et_pb_row { display: grid !important; }

.sea-footer .et_pb_row::after { display: none; }

.sea-footer .et_pb_column {
	width: auto !important;
	margin: 0 !important;
	float: none !important;
}

.sea-footer .et_pb_module { margin-bottom: 0 !important; }
.sea-footer .et_pb_column > .et_pb_module + .et_pb_module { margin-top: var(--sp-6) !important; }

/* Contact strip. */
.sea-footer-cta.et_pb_row {
	grid-template-columns: minmax(0, 1fr) auto;
	align-items: center;
	gap: var(--sp-5) var(--space-columns);
	padding-bottom: var(--sp-7) !important;
	border-bottom: 1px solid rgba(255, 255, 255, .18);
}

.sea-footer-cta h2 {
	max-width: 22ch;
	padding: 0 !important;
	font-size: var(--fs-h2) !important;
	font-weight: var(--fw-bold) !important;
	line-height: var(--lh-heading) !important;
	letter-spacing: var(--ls-heading) !important;
	color: #fff !important;
}

.sea-footer-actions.et_pb_column {
	display: flex !important;
	flex-wrap: wrap;
	gap: var(--sp-3);
}

.sea-footer .sea-footer-actions > .et_pb_module + .et_pb_module,
.sea-footer .sea-footer-actions .et_pb_button_module_wrapper { margin: 0 !important; }

/* Logo + link groups. */
.sea-footer-links.et_pb_row {
	grid-template-columns: minmax(0, 4fr) repeat(3, minmax(0, 3fr));
	gap: var(--sp-7) var(--space-columns);
	padding-top: var(--sp-7) !important;
}

.sea-footer .et_pb_image { text-align: left; }
.sea-footer .et_pb_image .et_pb_image_wrap { display: block; }
.sea-footer .et_pb_image img { width: 100%; max-width: 220px; height: auto; }

.sea-footer h3 {
	padding: 0 !important;
	font-size: var(--fs-ui) !important;
	font-weight: var(--fw-semibold) !important;
	line-height: var(--lh-title) !important;
	color: #fff !important;
}

.sea-footer ul {
	margin-top: var(--sp-4) !important;
	padding: 0 !important;
	list-style: none !important;
}

.sea-footer li { padding: 0 !important; }
.sea-footer li + li { margin-top: var(--sp-2); }

.sea-footer li a {
	font-size: var(--fs-small);
	font-weight: var(--fw-regular) !important;
	line-height: var(--lh-snug);
	color: rgba(255, 255, 255, .8) !important;
	text-decoration: none;
}

.sea-footer li a:hover { color: #fff !important; text-decoration: underline; }

/* Footer buttons: the site's button style, reversed for the navy background. */
body #page-container .sea-footer .sea-footer-btn.et_pb_button,
body #page-container .sea-footer .sea-footer-btn.et_pb_button:hover {
	display: inline-flex;
	align-items: center;
	min-height: 48px;
	padding: var(--sp-3) var(--sp-5) !important;
	border: 2px solid #fff !important;
	border-radius: 4px !important;
	font-family: var(--font-sans) !important;
	font-size: var(--fs-ui) !important;
	font-weight: var(--fw-semibold) !important;
	line-height: var(--lh-title) !important;
	letter-spacing: 0 !important;
	transition: background-color .2s, color .2s, border-color .2s !important;
}

body #page-container .sea-footer .sea-footer-btn.et_pb_button::after { display: none !important; }

body #page-container .sea-footer .sea-footer-btn--solid.et_pb_button { background: #fff !important; color: var(--sea-navy) !important; }
body #page-container .sea-footer .sea-footer-btn--solid.et_pb_button:hover { background: var(--sea-blue-2) !important; border-color: var(--sea-blue-2) !important; color: #fff !important; }
body #page-container .sea-footer .sea-footer-btn--ghost.et_pb_button { background: transparent !important; color: #fff !important; }
body #page-container .sea-footer .sea-footer-btn--ghost.et_pb_button:hover { background: #fff !important; color: var(--sea-navy) !important; }

/* Funding disclaimer. */
.sea-footer-legal.et_pb_row {
	margin-top: var(--sp-8);
	padding-top: var(--sp-6) !important;
	border-top: 1px solid rgba(255, 255, 255, .18);
}

.sea-footer-legal p {
	padding: 0;
	font-size: var(--fs-meta);
	line-height: 1.6;
	color: rgba(255, 255, 255, .7);
}

.sea-footer a:focus-visible { outline: 3px solid #fff; outline-offset: 2px; border-radius: 4px; }

.et-l--header a:focus-visible {
	outline: 3px solid var(--sea-blue-2);
	outline-offset: 2px;
	border-radius: 4px;
}

@media (max-width: 980px) {
	.sea-footer-cta.et_pb_row { grid-template-columns: minmax(0, 1fr); }
	.sea-footer-links.et_pb_row { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.sea-footer-brand.et_pb_column { grid-column: 1 / -1; }
}

@media (max-width: 600px) {
	.sea-footer-links.et_pb_row { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-6) var(--sp-5); }
	.sea-footer-actions.et_pb_column { flex-direction: column; align-items: stretch; }
	body #page-container .sea-footer .sea-footer-btn.et_pb_button { justify-content: center; width: 100%; }
	.sea-footer .sea-footer-actions .et_pb_button_module_wrapper { width: 100%; }
}

/* ---------- Password-protected pages ----------
   Divi's password form floats its Submit button without clearing it, so the
   footer slid over the button. Lay it out as a card on a sand band instead. */

.post-password-required .et_pb_section {
	width: 100% !important;
	max-width: none !important;
	padding: var(--space-section) var(--space-gutter) !important;
	background: var(--sea-sand-soft) !important;
}

.post-password-required .et_pb_row {
	width: 100% !important;
	max-width: 560px !important;
	padding: 0 !important;
}

body #page-container .et_password_protected_form {
	padding: clamp(var(--sp-6), 4vw, var(--sp-7));
	background: #fff;
	border: 1px solid var(--sea-stone);
	border-radius: var(--sea-radius);
	box-shadow: var(--sea-shadow);
	font-family: var(--font-sans);
}

body #page-container .et_password_protected_form h1 {
	margin: 0;
	padding: 0;
	font-size: var(--fs-h2);
	font-weight: var(--fw-bold);
	line-height: var(--lh-heading);
	letter-spacing: var(--ls-heading);
	color: var(--sea-navy);
}

body #page-container .et_password_protected_form p {
	margin: var(--sp-3) 0 0;
	padding: 0;
	font-size: var(--fs-body);
	line-height: var(--lh-body);
	color: var(--sea-ink);
}

body #page-container .et_password_protected_form form p { margin-top: var(--sp-5); }

body #page-container .et_password_protected_form label {
	display: block;
	margin-bottom: var(--sp-2);
	font-size: var(--fs-ui);
	font-weight: var(--fw-semibold);
	color: var(--sea-navy);
}

body #page-container .et_password_protected_form input[type="password"] {
	display: block;
	width: 100% !important;
	max-width: none;
	margin: 0 !important;
	padding: var(--sp-3) var(--sp-4) !important;
	font-size: var(--fs-body) !important;
	color: var(--sea-ink) !important;
	background: #fff !important;
	border: 1px solid var(--sea-stone) !important;
	border-radius: 4px;
}

body #page-container .et_password_protected_form input[type="password"]:focus {
	border-color: var(--sea-blue) !important;
	outline: 3px solid rgba(0, 84, 166, .25);
	outline-offset: 0;
}

body #page-container .et_password_protected_form .et_submit_button {
	float: none !important;
	display: inline-flex;
	align-items: center;
	min-height: 48px;
	margin: 0 !important;
	padding: var(--sp-3) var(--sp-5) !important;
	font-family: var(--font-sans) !important;
	font-size: var(--fs-ui) !important;
	font-weight: var(--fw-semibold) !important;
	line-height: var(--lh-title) !important;
	color: #fff !important;
	background: var(--sea-navy) !important;
	border: 2px solid var(--sea-navy) !important;
	border-radius: 4px !important;
	cursor: pointer;
	transition: background-color .2s ease, border-color .2s ease;
}

body #page-container .et_password_protected_form .et_submit_button::after { display: none !important; }

body #page-container .et_password_protected_form .et_submit_button:hover {
	background: var(--sea-blue) !important;
	border-color: var(--sea-blue) !important;
}

body #page-container .et_password_protected_form .et_submit_button:focus-visible {
	outline: 3px solid var(--sea-blue-2);
	outline-offset: 2px;
}

/* ---------- Accessibility helpers ---------- */

/* Skip link: hidden until it receives keyboard focus. */
.sea-skip-link {
	position: absolute;
	top: var(--sp-2);
	left: var(--sp-2);
	z-index: 100000;
	padding: var(--sp-3) var(--sp-5);
	font-family: var(--font-sans);
	font-size: var(--fs-ui);
	font-weight: var(--fw-semibold);
	color: #fff !important;
	background: var(--sea-navy);
	border-radius: 4px;
	transform: translateY(-200%);
	transition: transform .15s;
}

.sea-skip-link:focus {
	transform: none;
	outline: 3px solid var(--sea-blue-2);
	outline-offset: 2px;
}

#main-content:focus { outline: none; }

/* Text for screen readers only (e.g. "opens in a new tab"). */
.sea-sr-only {
	position: absolute !important;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
	border: 0;
}